fix: 修改文档标点

src/components/NoticeIcon/index.tsx

@@ -9,7 +9,6 @@ import encodeQuery from '@/utils/encodeQuery';
 import { getMenuPathByCode, MENUS_CODE } from '@/utils/menu';
 import useHistory from '@/hooks/route/useHistory';
 import { throttleTime } from 'rxjs/operators';
-import Icon from '@ant-design/icons';
 import useSendWebsocketMessage from '@/hooks/websocket/useSendWebsocketMessage';
 
 export type GlobalHeaderRightProps = {
@@ -100,14 +99,14 @@ const NoticeIconView = () => {
       ?.pipe(throttleTime(2000))
       .subscribe((resp: any) => {
         getUnread();
-        notification.open({
+        notification.warning({
           message: resp?.payload?.topicName,
           description: resp?.payload?.message,
           key: resp.payload.id,
-          top: 60,
           btn: (
             <Button
               type="primary"
+              size="small"
               onClick={() => {
                 service.changeNoticeReadState(resp.payload.id).then((response) => {
                   if (response.status === 200) {
@@ -120,7 +119,6 @@ const NoticeIconView = () => {
               标记已读
             </Button>
           ),
-          icon: <Icon type="exclamation-circle" style={{ color: '#E23D38' }} />,
         });
       });
   };
@@ -136,11 +134,10 @@ const NoticeIconView = () => {
   const changeReadState = async (item: any) => {
     const resp = await service.changeNoticeReadState(item.id);
     if (resp.status === 200) {
-      getUnread();
+      const url = getMenuPathByCode(MENUS_CODE['account/NotificationRecord']);
+      history.push(url, { ...item });
+      setVisible(false);
     }
-    const url = getMenuPathByCode(MENUS_CODE['account/NotificationRecord']);
-    history.push(url, { ...item });
-    setVisible(false);
   };
 
   const clearReadState = async (title: string) => {

src/hooks/route/useHistory.tsx

@@ -1,6 +1,6 @@
 import { useHistory } from 'umi';
 import { useEffect, useState } from 'react';
-import type { LocationDescriptor, LocationState, Path } from 'history';
+import type { LocationState, Path } from 'history';
 import { model } from '@formily/reactive';
 
 export const historyStateModel = model<{ state: any }>({ state: {} });
@@ -10,9 +10,9 @@ const useHistories = () => {
 
   const [history, setHistory] = useState<any>();
 
-  const push = (location: Path | LocationDescriptor<LocationState>, state?: LocationState) => {
+  const push = (location: Path, state?: LocationState) => {
     if (state) {
-      historyStateModel.state = state;
+      historyStateModel.state[location] = state;
     }
     umiHistory.push(location, state);
   };

src/hooks/route/useLocation.tsx

@@ -8,11 +8,11 @@ const useLocations = () => {
   useEffect(() => {
     setLocation({
       ...umiLocation,
-      state: historyStateModel.state,
+      state: historyStateModel.state[umiLocation.pathname],
     });
 
     return () => {
-      historyStateModel.state = undefined;
+      delete historyStateModel.state[umiLocation.pathname];
     };
   }, [umiLocation]);
 

src/pages/account/NotificationRecord/index.tsx

@@ -13,7 +13,7 @@ import encodeQuery from '@/utils/encodeQuery';
 import { useDomFullHeight } from '@/hooks';
 import { onlyMessage } from '@/utils/util';
 import type { CustomIconComponentProps } from '@ant-design/icons/lib/components/Icon';
-import { historyStateModel } from '@/hooks/route/useHistory';
+import useLocations from '@/hooks/route/useLocation';
 import { observer } from '@formily/reactive-react';
 
 export const service = new Service('notifications');
@@ -27,6 +27,8 @@ const NotificationRecord = observer(() => {
   const [typeList, setTypeList] = useState<any>({});
   const { minHeight } = useDomFullHeight(`.record`, 24);
 
+  const location = useLocations();
+
   useEffect(() => {
     service.getProvidersList().then((resp) => {
       const obj: any = {};
@@ -38,11 +40,12 @@ const NotificationRecord = observer(() => {
   }, []);
 
   useEffect(() => {
-    if (historyStateModel.state.id) {
+    console.log(location.state);
+    if (location.state?.id) {
       setVisible(true);
-      setCurrent(historyStateModel.state);
+      setCurrent(location.state);
     }
-  }, [historyStateModel.state]);
+  }, [location.state]);
 
   const ReadSvg = () => (
     <svg

src/pages/media/Device/Save/index.tsx

@@ -341,55 +341,72 @@ const Save = () => {
               </Form>
             </Col>
             <Col span={12}>
-              <div className={styles.doc} style={{ height: 800 }}>
-                <h1>1、概述</h1>
-                <div>
-                  视频设备通过GB/T28181接入平台整体分为2部分，包括平台端配置和设备端配置，不同的设备端配置的路径或页面存在差异，但配置项基本大同小异。
+              {accessType === DefaultAccessType ? (
+                <div className={styles.doc} style={{ height: 800 }}>
+                  <h1>1.概述</h1>
+                  <div>
+                    视频设备通过GB/T28181接入平台整体分为2部分，包括平台端配置和设备端配置，不同的设备端配置的路径或页面存在差异，但配置项基本大同小异。
+                  </div>
+                  <h1>2.配置说明</h1>
+                  <h1>平台端配置</h1>
+                  <h2>1、ID</h2>
+                  <div>设备唯一标识，若不填写，系统将自动生成唯一标识</div>
+                  <h2>2、所属产品</h2>
+                  <div>
+                    只能选择接入方式为GB/T28281的产品，若当前无对应产品，可点击右侧快速添加按钮，填写产品名称和选择GB/T28181类型的网关完成产品创建
+                  </div>
+                  <h2>3、接入密码</h2>
+                  <div>
+                    配置接入密码，设备端配置的密码需与该密码一致。该字段可在产品-设备接入页面进行统一配置，配置后所有设备将继承产品配置。设备单独修改后将脱离继承关系。
+                  </div>
+                  <h1>设备端配置</h1>
+                  <div>
+                    各个厂家、不同设备型号的设备端配置页面布局存在差异，但配置项基本大同小异，此处以大华摄像头为例作为接入配置示例
+                  </div>
+                  <div className={styles.image}>
+                    <Image width="100%" src={img1} />
+                  </div>
+                  <h2>1、SIP服务器编号/SIP域</h2>
+                  <div>
+                    SIP服务器编号填入该设备所属产品-接入方式页面“连接信息”的SIP。
+                    SIP域通常为SIP服务器编号的前10位。
+                  </div>
+                  <div className={styles.image}>
+                    <Image width="100%" src={img2} />
+                  </div>
+                  <h2>2、SIP服务器IP/端口</h2>
+                  <div>SIP服务器IP/端口填入该设备所属产品-接入方式页面中“连接信息”的IP/端口。</div>
+                  <div className={styles.image}>
+                    <Image width="100%" src={img3} />
+                  </div>
+                  <h2>3、设备编号</h2>
+                  <div>
+                    设备编号为设备唯一性标识，物联网平台的设备接入没有校验该字段，输入任意数字均不影响设备接入平台。
+                  </div>
+                  <h2>4、注册密码</h2>
+                  <div>填入该设备所属产品-接入方式页面中“GB28281配置”处的接入密码</div>
+                  <div className={styles.image}>
+                    <Image width="100%" src={img4} />
+                  </div>
+                  <h2>5、其他字段</h2>
+                  <div>不影响设备接入平台，可保持设备初始化值。</div>
                 </div>
-                <h1>2、配置说明</h1>
-                <h1>平台端配置</h1>
-                <h2>1、ID</h2>
-                <div>设备唯一标识，若不填写，系统将自动生成唯一标识</div>
-                <h2>2、所属产品</h2>
-                <div>
-                  只能选择接入方式为GB/T28281的产品，若当前无对应产品，可点击右侧快速添加按钮，填写产品名称和选择GB/T28181类型的网关完成产品创建
+              ) : (
+                <div className={styles.doc} style={{ height: 600 }}>
+                  <h1>1.概述</h1>
+                  <div>视频设备通过RTSP、RTMP固定地址接入平台分为2步。</div>
+                  <div>1.添加视频设备</div>
+                  <div>2.添加视频下的通道地址。</div>
+                  <div>注：当前页面为新增视频设备，新增完成后点击设备的“通道”按钮，添加通道。</div>
+                  <h1>2.配置说明</h1>
+                  <h2>1、ID</h2>
+                  <div>设备唯一标识，若不填写，系统将自动生成唯一标识。</div>
+                  <h2>2、所属产品</h2>
+                  <div>
+                    只能选择接入方式为固定地址的产品，若当前无对应产品，可点击右侧快速添加按钮，填写产品名称和选择固定地址类型的网关完成产品创建。
+                  </div>
                 </div>
-                <h2>3、接入密码</h2>
-                <div>
-                  配置接入密码，设备端配置的密码需与该密码一致。该字段可在产品-设备接入页面进行统一配置，配置后所有设备将继承产品配置。设备单独修改后将脱离继承关系。
-                </div>
-                <h1>设备端配置</h1>
-                <div>
-                  各个厂家、不同设备型号的设备端配置页面布局存在差异，但配置项基本大同小异，此处以大华摄像头为例作为接入配置示例
-                </div>
-                <div className={styles.image}>
-                  <Image width="100%" src={img1} />
-                </div>
-                <h2>1、SIP服务器编号/SIP域</h2>
-                <div>
-                  SIP服务器编号填入该设备所属产品-接入方式页面“连接信息”的SIP。
-                  SIP域通常为SIP服务器编号的前10位。
-                </div>
-                <div className={styles.image}>
-                  <Image width="100%" src={img2} />
-                </div>
-                <h2>2、SIP服务器IP/端口</h2>
-                <div>SIP服务器IP/端口填入该设备所属产品-接入方式页面中“连接信息”的IP/端口。</div>
-                <div className={styles.image}>
-                  <Image width="100%" src={img3} />
-                </div>
-                <h2>3、设备编号</h2>
-                <div>
-                  设备编号为设备唯一性标识，物联网平台的设备接入没有校验该字段，输入任意数字均不影响设备接入平台。
-                </div>
-                <h2>4、注册密码</h2>
-                <div>填入该设备所属产品-接入方式页面中“GB28281配置”处的接入密码</div>
-                <div className={styles.image}>
-                  <Image width="100%" src={img4} />
-                </div>
-                <h2>5、其他字段</h2>
-                <div>不影响设备接入平台，可保持设备初始化值。</div>
-              </div>
+              )}
             </Col>
           </Row>
         </Card>

src/pages/notice/Config/Detail/doc/AliyunSms.tsx

@@ -11,19 +11,19 @@ const AliyunSms = () => {
           https://home.console.aliyun.com
         </a>
       </div>
-      <h1>1. 概述</h1>
+      <h1>1.概述</h1>
       <div>
         通知配置可以结合通知配置为告警消息通知提供支撑。也可以用于系统中其他自定义模块的调用。
       </div>
       <h1>2.通知配置说明</h1>
       <div>
-        <h2>1. RegionID</h2>
+        <h2>1、RegionID</h2>
         <div>阿里云内部给每台机器设置的唯一编号。请根据购买的阿里云服务器地址进行填写。</div>
         <div>
           阿里云地域和可用区对照表地址：https://help.aliyun.com/document_detail/40654.html?spm=a2c6h.13066369.0.0.54a174710O7rWH
         </div>
       </div>
-      <h2>2. AccesskeyID/Secret</h2>
+      <h2>2、AccesskeyID/Secret</h2>
       <div>
         <div>用于程序通知方式调用云服务费API的用户标识和秘钥</div>
         <div>获取路径：“阿里云管理控制台”--“用户头像”--“”--“AccessKey管理”--“查看”</div>

src/pages/notice/Config/Detail/doc/AliyunVoice.tsx

@@ -18,7 +18,7 @@ const AliyunVoice = () => {
       </div>
       <h1>2.通知配置说明</h1>
       <div>
-        <h2>1. RegionID</h2>
+        <h2>1、RegionID</h2>
         <div>
           阿里云内部给每台机器设置的唯一编号。请根据购买的阿里云服务器阿里云地域和可用区对照表地址：https://help.aliyun.com/document_detail/40654.html?spm=a2c6h.13066369.0.0.54a174710O7rWH获取路径：“微信公众平台”管理后台--“设置与开发”--“基本配置”
         </div>

src/pages/notice/Config/Detail/doc/DingTalk.tsx

@@ -18,7 +18,7 @@ const DingTalk = () => {
       </div>
       <h1>2.通知配置说明</h1>
       <div>
-        <h2>1. AppKey</h2>
+        <h2>1、AppKey</h2>
         <div>
           企业内部应用的唯一身份标识。在钉钉开发者后台创建企业内部应用后，系统会自动生成一对AppKey和AppSecret。
         </div>
@@ -27,7 +27,7 @@ const DingTalk = () => {
           <Image width="100%" src={appKey} />
         </div>
       </div>
-      <h2>2. AppSecret</h2>
+      <h2>2、AppSecret</h2>
       <div>
         <div>钉钉应用对应的调用密钥</div>
         <div>获取路径：“钉钉开放平台”--“应用开发”--“应用信息”</div>

src/pages/notice/Config/Detail/doc/DingTalkRebot.tsx

@@ -15,7 +15,7 @@ const DingTalkRebot = () => {
       </div>
       <h1>2.通知配置说明</h1>
       <div>
-        <h2> 1. WebHook</h2>
+        <h2> 1、WebHook</h2>
         <div>在钉钉群内每创建一个钉钉群自定义机器人都会产生唯一的WebHook地址。</div>
         <div>获取路径：“钉钉桌面客户端”--“群设置”--“智能群助手”--“机器人信息”</div>
         <div className={'image'}>

src/pages/notice/Config/Detail/doc/Email.tsx

@@ -8,16 +8,16 @@ const Email = () => {
         通知配置可以结合通知配置为告警消息通知提供支撑。也可以用于系统中其他自定义模块的调用。
       </div>
       <h1>2.通知配置说明</h1>
-      <h2>1. 服务器地址</h2>
+      <h2>1、 服务器地址</h2>
       <div>下拉可选择国内常用的邮箱服务配置，也支持手动输入其他地址。</div>
       <div>
         系统POP协议。POP允许电子邮件客户端下载服务器上的邮件，但是您在电子邮件客户端的操作（如：移动邮件、标记已读等），这是不会反馈到服务器上。
       </div>
-      <h2>2. 发件人</h2>
+      <h2>2、发件人</h2>
       <div>用于发送邮件时“发件人“信息的显示</div>
-      <h2>3. 用户名</h2>
+      <h2>3、 用户名</h2>
       <div>用该账号进行发送邮件。</div>
-      <h2>4. 密码</h2>
+      <h2>4、密码</h2>
       <div>用与账号身份认证，认证通过后可通过该账号进行发送邮件。</div>
     </div>
   );

src/pages/notice/Config/Detail/doc/Webhook.tsx

@@ -9,10 +9,10 @@ const Webhook = () => {
         POST请求），实现了Webhook的第三方系统可以基于该URL订阅本平台系统信息，本平台按配置把特定的事件结果推送到指定的地址，便于系统做后续处理。
       </div>
       <h1>2.通知配置说明</h1>
-      <h2>1. Webhook</h2>
+      <h2>1、Webhook</h2>
       <div>Webhook地址。</div>
 
-      <h2>2. 请求头</h2>
+      <h2>2、请求头</h2>
       <div>支持根据系统提供的接口设置不同的请求头。如 Accept-Language 、Content-Type</div>
     </div>
   );

src/pages/notice/Config/Detail/doc/WeixinApp.tsx

@@ -19,14 +19,14 @@ const WeixinApp = () => {
       </div>
       <h1>2.通知配置说明</h1>
       <div>
-        <h2>1. AppID</h2>
+        <h2>1、AppID</h2>
         <div>微信服务号的唯一专属编号。</div>
         <div>获取路径：“微信公众平台”管理后台--“设置与开发”--“基本配置”</div>
         <div className={'image'}>
           <Image width="100%" src={appId} />
         </div>
       </div>
-      <h2>2. AppSecret</h2>
+      <h2>2、AppSecret</h2>
       <div>
         <div>公众号开发者身份的密码</div>
         <div>获取路径：“微信公众平台”管理后台--“设置与开发”--“基本配置”</div>

src/pages/notice/Config/Detail/doc/WeixinCorp.tsx

@@ -18,7 +18,7 @@ const WeixinCorp = () => {
       </div>
       <h1>2.通知配置说明</h1>
       <div>
-        <h2>1. corpId</h2>
+        <h2>1、corpId</h2>
         <div>企业号的唯一专属编号。</div>
         <div>获取路径：“企业微信”管理后台--“我的企业”--“企业ID”</div>
         <div className={'image'}>
@@ -26,7 +26,7 @@ const WeixinCorp = () => {
         </div>
       </div>
 
-      <h2>2. corpSecret</h2>
+      <h2>2、corpSecret</h2>
       <div>
         <div>应用的唯一secret,一个企业微信中可以有多个corpSecret</div>
         <div>获取路径：“企业微信”--“应用与小程序”--“自建应用”中获取</div>

src/pages/notice/Template/Detail/doc/DingTalk.tsx

@@ -26,13 +26,13 @@ const DingTalk = () => {
       <h1> 2.模板配置说明</h1>
       <h2> 1、绑定配置</h2>
       <div> 使用固定的通知配置发送此通知模板</div>
-      <h2> 2. Agentid</h2>
+      <h2> 2、Agentid</h2>
       <div> 应用唯一标识</div>
       <div className="image">
         <Image width="100%" src={agentId} />
       </div>
       <div> 获取路径：“钉钉开发平台”--“应用开发”--“查看应用”</div>
-      <h2> 3. 收信人ID、收信部门ID</h2>
+      <h2> 3、收信人ID、收信部门ID</h2>
       <div>
         接收通知的2种方式，2个字段若在此页面都没有填写，则在模板调试和配置告警通知时需要手动填写
       </div>
@@ -42,7 +42,7 @@ const DingTalk = () => {
         <Image width="100%" src={userId} />
         <Image width="100%" src={dept} />
       </div>
-      <h2> 4. 模板内容</h2>
+      <h2> 4、模板内容</h2>
       <div>
         支持填写带变量的动态模板。变量填写规范示例：${a}
         。填写动态参数后，可对变量的名称、类型、格式进行配置，以便告警通知时填写。

src/pages/notice/Template/Detail/doc/DingTalkRebot.tsx

@@ -20,7 +20,7 @@ const DingTalkRebot = () => {
         <div> 使用固定的通知配置发送此通知模板</div>
         <h2> 2、消息类型</h2>
         <div> 目前支持text、markdown、link3种。</div>
-        <h2> 3. 模板内容</h2>
+        <h2> 3、模板内容</h2>
         <div>
           支持填写带变量的动态模板。变量填写规范示例：${b}
           。填写动态参数后，可对变量的名称、类型、格式进行配置，以便告警通知时填写。

src/pages/notice/Template/Detail/doc/Email.tsx

@@ -12,13 +12,13 @@ const Email = () => {
       </div>
       <h1>2.模板配置说明</h1>
       <div>
-        <h2> 1. 服务器地址</h2>
+        <h2> 1、服务器地址</h2>
         <div>服务器地址支持自定义输入</div>
-        <h2> 2. 标题</h2>
+        <h2> 2、标题</h2>
         <div>支持输入变量，变量格式${a}</div>
-        <h2> 3. 收件人</h2>
+        <h2> 3、收件人</h2>
         <div> 支持录入多个邮箱地址，可填写变量参数。</div>
-        <h2> 4. 模板内容</h2>
+        <h2> 4、模板内容</h2>
         <div>
           支持填写带变量的动态模板。变量填写规范示例：${b}
           。填写动态参数后，可对变量的名称、类型、格式进行配置，以便告警通知时填写。

src/pages/notice/Template/Detail/doc/WeixinApp.tsx

@@ -18,34 +18,34 @@ const WeixinApp = () => {
       </div>
       <h1>2.模板配置说明</h1>
       <div>
-        <h2>1. 绑定配置</h2>
+        <h2>1、绑定配置</h2>
         <div>使用固定的通知配置发送此通知模板</div>
       </div>
       <div>
-        <h2>2. 用户标签</h2>
+        <h2>2、用户标签</h2>
         <div>以标签的维度通知该标签下所有用户</div>
       </div>
       <div>
-        <h2>3. 消息模板</h2>
+        <h2>3、消息模板</h2>
         <div>微信公众号中配置的消息模板</div>
       </div>
       <div>
-        <h2>4. 模板跳转链接</h2>
+        <h2>4、模板跳转链接</h2>
         <div>点击消息之后进行页面跳转</div>
       </div>
       <div>
-        <h2>5. 跳转小程序Appid</h2>
+        <h2>5、跳转小程序Appid</h2>
         <div>点击消息之后打开对应的小程序</div>
       </div>
       <div>
-        <h2>6. 跳转小程序具体路径</h2>
+        <h2>6、跳转小程序具体路径</h2>
         <div>点击消息之后跳转到小程序的具体页面</div>
         <div className="image">
           <Image width="100%" src={appId} />
         </div>
       </div>
       <div>
-        <h2>7. 模板内容</h2>
+        <h2>7、模板内容</h2>
         <div>
           支持填写带变量的动态模板。变量填写规范示例：${name}
           。填写动态参数后，可对变量的名称、类型、格式进行配置，以便告警通知时填写。

src/pages/notice/Template/Detail/doc/WeixinCorp.tsx

@@ -23,13 +23,13 @@ const WeixinCorp = () => {
       <div>
         <h2> 1、绑定配置</h2>
         <div> 使用固定的通知配置发送此通知模板</div>
-        <h2> 2. Agentid</h2>
+        <h2> 2、Agentid</h2>
         <div> 应用唯一标识</div>
         <div> 获取路径：“企业微信”管理后台--“应用管理”--“应用”--“查看应用”</div>
         <div className="image">
           <Image width="100%" src={agentId} />
         </div>
-        <h2> 3. 收信人ID、收信部门ID、标签推送</h2>
+        <h2> 3、收信人ID、收信部门ID、标签推送</h2>
         <div>
           接收通知的3种方式，3个字段若在此页面都没有填写，则在模板调试和配置告警通知时需要手动填写
         </div>

src/pages/system/Role/Detail/Permission/Allocate/MenuPermission.tsx

@@ -99,6 +99,26 @@ const MenuPermission = (props: Props) => {
                 fontWeight: value.id === 'menu-permission' ? 600 : 400,
               }}
               onChange={(e) => {
+                let access: any[] = [];
+                if (e.target.checked && !checkValue) {
+                  setCheckValue('creator');
+                  access = (value?.assetAccesses || []).map((i: any) => {
+                    return {
+                      ...i,
+                      granted: i.supportId === 'creator',
+                    };
+                  });
+                } else if (!e.target.checked) {
+                  setCheckValue('');
+                  access = (value?.assetAccesses || []).map((i: any) => {
+                    return {
+                      ...i,
+                      granted: false,
+                    };
+                  });
+                } else {
+                  access = value?.assetAccesses || [];
+                }
                 setCheckAll(e.target.checked);
                 setIndeterminate(false);
                 const buttons = (value?.buttons || []).map((i: any) => {
@@ -109,6 +129,7 @@ const MenuPermission = (props: Props) => {
                 });
                 props.change({
                   ...value,
+                  assetAccesses: [...access],
                   check: e.target.checked ? 1 : 3, // 1: 全选 2: 只选了部分 3: 一个都没选
                   buttons: [...buttons],
                   children: checkAllData(value.children || [], e.target.checked),
@@ -131,6 +152,26 @@ const MenuPermission = (props: Props) => {
                   'id',
                 )}
                 onChange={(data: CheckboxValueType[]) => {
+                  let access: any[] = [];
+                  if (data.length > 0 && !checkValue) {
+                    setCheckValue('creator');
+                    access = (value?.assetAccesses || []).map((i: any) => {
+                      return {
+                        ...i,
+                        granted: i.supportId === 'creator',
+                      };
+                    });
+                  } else if (data.length === 0) {
+                    setCheckValue('');
+                    access = (value?.assetAccesses || []).map((i: any) => {
+                      return {
+                        ...i,
+                        granted: false,
+                      };
+                    });
+                  } else {
+                    access = value?.assetAccesses || [];
+                  }
                   const buttons = value.buttons.map((i: any) => {
                     return {
                       ...i,
@@ -152,6 +193,7 @@ const MenuPermission = (props: Props) => {
                   const d = {
                     ...value,
                     check,
+                    assetAccesses: [...access],
                     buttons: [...buttons],
                   };
                   props.change(d);
@@ -220,7 +262,7 @@ const MenuPermission = (props: Props) => {
                 <div>{value?.accessDescription}</div>
               ) : (
                 <Radio.Group
-                  defaultValue={value?.assetAccesses[0]?.supportId}
+                  defaultValue={'creator'}
                   value={checkValue}
                   onChange={(e) => {
                     setCheckValue(e.target.value);