fix

src/pages/InitialSystem/index.tsx

@@ -4,6 +4,7 @@ import styles from './index.less';
 import DeviceInstall from './DeviceInstall';
 import PowerOnAuth from './PowerOnAuth';
 import { LeftOutlined } from '@ant-design/icons';
+import { Modal } from 'antd';
 
 interface PageProps { }
 
@@ -13,9 +14,11 @@ const InitialSystem: FC<PageProps> = ({ }) => {
   const queryParams = new URLSearchParams(location.search);
   const type = queryParams.get('type');
   const count = queryParams.get('count');
+  const [visibility, setVisibility] = useState<boolean>(true);
 
   const urlParams = useParams();
-
+  let installExe: any = localStorage.getItem('installExe')
+  let info = JSON.parse(installExe);
   const MenuList: any = {
     'admin': [
       { name: '算法加载', dom: <div>暂无内容</div>, img: '' },
@@ -57,7 +60,8 @@ const InitialSystem: FC<PageProps> = ({ }) => {
 
   return (
     <div className={styles.initial_warp}>
-      {/* 头部 */}
+      {info[14].select ? <>
+         {/* 头部 */}
       <div className={styles.header_warp}>
         <div className='ml20'>专用核心密码机管理软件</div>
         <div className='mr20'></div>
@@ -89,6 +93,24 @@ const InitialSystem: FC<PageProps> = ({ }) => {
           }
         </div>
       </div>
+      </> :<Modal
+        title={'提示'}
+        open={visibility}
+        centered
+        width={500}
+        closeIcon={false}
+        footer={null}
+        maskClosable={false}
+      >
+        
+        <div >
+          请安装一体化密码机驱动程序
+        </div>
+      </Modal>
+
+      }
+      
+      
     </div>
   )
 }

src/pages/InstallExe/exeDialog/CodeDriver.tsx

@@ -0,0 +1,92 @@
+import React, { FC, useEffect, useState } from 'react';
+import styles from './index.less';
+import { Input, Progress, message } from 'antd';
+import { countType } from '@/utils';
+import { useParams } from 'umi';
+
+interface PageProps {
+  open: boolean;
+  onCancel: () => void;
+}
+
+const CodeDriver: FC<PageProps> = ({
+  open = false,
+  onCancel
+}) => {
+  const [active, setActive] = useState(1);
+  const [percentVal, setPercentVal] = useState(0);
+
+  const urlParams = useParams();
+
+  // 监听是否到安装进度条步骤
+  useEffect(() => {
+    if (active == 3) {
+      const interval = setInterval(() => {
+        setPercentVal((val) => {
+          const randomStep = Math.round(Math.random() * (100 / 10));
+          const newPercent = val + randomStep;
+
+          if (newPercent >= 100) {
+            clearInterval(interval);
+            setValue()
+            return 100;
+          }
+
+          return newPercent;
+        });
+      }, 500);
+
+      return () => clearInterval(interval);
+    }
+  }, [active])
+  
+  // 设置安装步骤进度
+  const setValue = () => {
+    setActive((e) => { return e + 1 })
+  }
+  const installSuccess = () => {
+    let installExe: any = localStorage.getItem('installExe')
+    let data = JSON.parse(installExe);
+    data[14].select = true;
+    localStorage.setItem('installExe', JSON.stringify(data));
+    message.success('一体化密码机驱动安装成功！')
+    onCancel()
+  }
+
+  return <>
+    {
+      // open && <div>
+
+      // </div>
+    }
+    {
+      open &&
+      <div className={styles.modalOverlay}>
+        <div className={styles.modal} style={{width: 500, height: 460}}>
+          <img src={require(`../../../assets/images/codemanage/${active}.png`)} width={500} height={460} />
+
+          {[1,2].includes(active)&&<div className={styles.title}>一体化密码机驱动 安装程序</div>}
+          {![1,2].includes(active)&&<div className={styles.title1}>一体化密码机驱动 安装程序</div>}
+          {active==1&&<div className={styles.pic1}>一体化密码机驱动安装程序</div>}
+
+          {[1,2].includes(active)  && <div 
+            className={styles.net} 
+            onClick={() => setValue()}>
+          </div>}
+
+          {active == 3 && <div className={styles.progress} style={{background: '#fff', height: 15, width: 375, bottom: 222, left: 33,}}>
+            <Progress percent={percentVal} steps={42} size={[7, 14]} strokeColor={'rgb(56, 158, 13)'} trailColor={'rgba(0,0,0,0)'} showInfo={false} />
+          </div>}
+
+          {active == 4  && <div 
+            className={styles.net} 
+            style={{bottom: 17, right: 27}}
+            onClick={() => installSuccess()}>
+          </div>}
+        </div>
+      </div>
+    }
+  </>
+};
+
+export default CodeDriver;

src/pages/InstallExe/exeDialog/CodeManage.tsx

@@ -0,0 +1,112 @@
+import React, { FC, useEffect, useState } from 'react';
+import styles from './index.less';
+import { Input, Progress, message } from 'antd';
+import { countType } from '@/utils';
+import { useParams } from 'umi';
+
+interface PageProps {
+  open: boolean;
+  onCancel: () => void;
+}
+
+const CodeManage: FC<PageProps> = ({
+  open = false,
+  onCancel
+}) => {
+  const [active, setActive] = useState(1);
+  const [percentVal, setPercentVal] = useState(0);
+
+  const urlParams = useParams();
+
+  // 监听是否到安装进度条步骤
+  useEffect(() => {
+    if (active == 3) {
+      const interval = setInterval(() => {
+        setPercentVal((val) => {
+          const randomStep = Math.round(Math.random() * (100 / 10));
+          const newPercent = val + randomStep;
+
+          if (newPercent >= 100) {
+            clearInterval(interval);
+            setValue()
+            return 100;
+          }
+
+          return newPercent;
+        });
+      }, 500);
+
+      return () => clearInterval(interval);
+    }
+  }, [active])
+  
+  // 设置安装步骤进度
+  const setValue = () => {
+    setActive((e) => { return e + 1 })
+  }
+
+    // 在指定的目录下安装快捷方式
+    const installSuccess = async () => {
+      try {
+        const response = await fetch('http://localhost:3000/createShortcut', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          mode: "cors",
+          body: JSON.stringify({
+            folderPath: `c:/Users/向明星/Desktop/${countType[urlParams?.fileType]}`,
+            shortcutName: '专用核心密码综合管理系统',
+            shortcutURL: `http://localhost:8000/initialSystem/${urlParams?.fileType}`
+          }),
+        });
+        const data = await response.text();
+        message.success(data)
+
+        // 储存信息
+        let installExe: any = localStorage.getItem('installExe')
+        let obj = JSON.parse(installExe);
+        obj[13].select = true;
+        localStorage.setItem('installExe', JSON.stringify(obj));
+
+        onCancel()
+      } catch (error) {
+        message.error(error); // 处理请求错误
+      }
+    }
+
+  return <>
+    {
+      // open && <div>
+
+      // </div>
+    }
+    {
+      open &&
+      <div className={styles.modalOverlay}>
+        <div className={styles.modal} style={{width: 500, height: 460}}>
+          <img src={require(`../../../assets/images/codemanage/${active}.png`)} width={500} height={460} />
+
+          {[1,2].includes(active)&&<div className={styles.title}>一体化密码机管理软件 安装程序</div>}
+          {![1,2].includes(active)&&<div className={styles.title1}>一体化密码机管理软件 安装程序</div>}
+          {active==1&&<div className={styles.pic1}>一体化密码机管理软件安装程序</div>}
+
+          {[1,2].includes(active)  && <div 
+            className={styles.net} 
+            onClick={() => setValue()}>
+          </div>}
+
+          {active == 3 && <div className={styles.progress} style={{background: '#fff', height: 15, width: 375, bottom: 222, left: 33,}}>
+            <Progress percent={percentVal} steps={42} size={[7, 14]} strokeColor={'rgb(56, 158, 13)'} trailColor={'rgba(0,0,0,0)'} showInfo={false} />
+          </div>}
+
+          {active == 4  && <div 
+            className={styles.net} 
+            style={{bottom: 17, right: 27}}
+            onClick={() => installSuccess()}>
+          </div>}
+        </div>
+      </div>
+    }
+  </>
+};
+
+export default CodeManage;

src/pages/InstallExe/exeDialog/index.less

@@ -155,4 +155,23 @@
     font-size: 13px;
     cursor: pointer;
   }
+}
+.title{
+  position: absolute;
+  top: 5px;
+  left: 25px;
+  color: #fff;
+}
+.title1{
+  position: absolute;
+  top: 8px;
+  left: 25px;
+  color: #fff;
+}
+.pic1{
+  position: absolute;
+  top: 41px;
+  left: 70px;
+  font-size: 13px;
+  font-weight: 800;
 }

src/pages/InstallExe/index.tsx

@@ -12,6 +12,8 @@ import Net from './exeDialog/Net';
 import NetSP1 from './exeDialog/NetSP1';
 import CoreArea from './exeDialog/CoreArea';
 import DutyArea from './exeDialog/DutyArea';
+import CodeManage from './exeDialog/CodeManage';
+import CodeDriver from './exeDialog/CodeDriver';
 
 const typeData = [
   // 依赖程序
@@ -51,6 +53,9 @@ const InstallExe: FC<PageProps> = ({ }) => {
   const [open7, setOpen7] = useState(false); // 核心区安装程序
   const [open8, setOpen8] = useState(false); // 核心区安装程序
 
+  const [open11, setOpen11] = useState(false); // 一体化密码机管理软件
+  const [open12, setOpen12] = useState(false); // 一体化密码机驱动安装程序
+
   useEffect(() => {
     let data = localStorage.getItem('installExe');
     if (data) {
@@ -140,6 +145,12 @@ const InstallExe: FC<PageProps> = ({ }) => {
         obj[9].select = false;
         localStorage.setItem('installExe', JSON.stringify(obj));
         break;
+      case '一体化密码机管理软件':
+        setOpen11(true)
+        break;
+      case '一体化密码机驱动安装程序':
+        setOpen12(true)
+        break;
     }
   }
 
@@ -183,6 +194,9 @@ const InstallExe: FC<PageProps> = ({ }) => {
       {/* 专用核心密码管理分系统--弹窗 */}
       <CoreArea open={open7} onCancel={() => setOpen7(false)} />
       <DutyArea open={open8} onCancel={() => setOpen8(false)} />
+      {/* 一体化密码机--弹窗 */}
+      <CodeManage open={open11} onCancel={() => setOpen11(false)} />
+      <CodeDriver open={open12} onCancel={() => setOpen12(false)} />
     </div>
   )
 }

src/pages/index.tsx

@@ -11,8 +11,8 @@ import ClearInfoDialog from '@/components/ClearInfoDialog';
 // 首页(目前无用了)
 export default function IndexPage() {
   // 是否认证通过
-  const [isAuth, setIsAuth] = useState(true);
+  const [isAuth, setIsAuth] = useState(false);
-  const [visibility, setVisibility] = useState<boolean>(false);
+  const [visibility, setVisibility] = useState<boolean>(true);
   const [form] = Form.useForm();
   const [loading, setLoading] = useState(false);
   const [tishiDialog, setTishiDialog] = useState(false);