页面完成+创建快捷方式

master_055
张瑞宁 10 months ago
parent 2d209d9564
commit b4630c8669

@ -3,152 +3,34 @@ const routes = [
// { path: '/', redirect: '/404', }, // 后续上线时开放 // { path: '/', redirect: '/404', }, // 后续上线时开放
// 节点初始化工具 // 节点初始化工具
{ path: '/nodeInit', name: '节点初始化工具', component: '@/pages/NodeInitTool', layout: false }, { path: '/nodeInit/:fileType', name: '节点初始化工具', component: '@/pages/NodeInitTool', layout: false },
// 063
{ path: '/restore/:fileType', name: '恢复出厂数据', component: '@/pages/M063/Restore', layout: false },
{ path: '/identifier/:fileType', name: '系统自检', component: '@/pages/M063/Init', layout: false },
{ path: '/passwordManage/:fileType', name: '密码管理', component: '@/pages/M063/PasswordManage' },
{ path: '/unify/:fileType', name: '一体化管理', component: '@/pages/M063/UnifyManage' },
// ------------------------------设备管理---------------------------------- // ------------------------------设备管理----------------------------------
{ path: '/machineManage/register', name: '设备注册', component: '@/pages/MachineManage/MachineRegister' }, { path: '/machineManage/register/:fileType', name: '设备注册', component: '@/pages/MachineManage/MachineRegister' },
{ path: '/machineManage/offline/import', name: '离线管理导入', component: '@/pages/MachineManage/OffLineManage/ImportStep' }, { path: '/machineManage/offline/:fileType', name: '离线管理', component: '@/pages/MachineManage/OffLineManage' },
{ path: '/machineManage/offline/export', name: '离线管理导出', component: '@/pages/MachineManage/OffLineManage/ExportStep' }, { path: '/machineManage/offline/import/:fileType', name: '离线管理导入', component: '@/pages/MachineManage/OffLineManage/ImportStep' },
{ path: '/machineManage/offline/export/:fileType', name: '离线管理导出', component: '@/pages/MachineManage/OffLineManage/ExportStep' },
// --------------------------------------------------------------------------- // ---------------------------------------------------------------------------
// ------------------------------密钥管理---------------------------------- // ------------------------------密钥管理----------------------------------
{path:'/secretmanage/receive',name:'接收预制密钥',component:'@/pages/SecretManage/ReceiveSecret'}, {path:'/secretmanage/receive/:fileType',name:'接收预制密钥',component:'@/pages/SecretManage/ReceiveSecret'},
{path:'/secretmanage/detail',name:'预制密钥信息',component:'@/pages/SecretManage/SecretInfo'}, {path:'/secretmanage/detail/:fileType',name:'预制密钥信息',component:'@/pages/SecretManage/SecretInfo'},
{path:'/secretmanage/assemble',name:'密钥装配',component:'@/pages/SecretManage/SecretAssemble'}, {path:'/secretmanage/assemble/:fileType',name:'密钥装配',component:'@/pages/SecretManage/SecretAssemble'},
{ path: '/secretmanage/offline/:fileType', name: '离线管理', component: '@/pages/SecretManage/OffLineManage' },
{ path: '/secretmanage/offline/import/:fileType', name: '离线管理导入', component: '@/pages/SecretManage/OffLineManage/ImportStep' },
{ path: '/secretmanage/offline/export/:fileType', name: '离线管理导出', component: '@/pages/SecretManage/OffLineManage/ExportStep' },
// --------------------------------------------------------------------------- // ---------------------------------------------------------------------------
// 桌面 // 桌面
{ path: '/index', name: '桌面', component: '@/pages/index', layout: false }, { path: '/index', name: '桌面', component: '@/pages/index', layout: false },
// ------------------------------流程------------------------------
{ path: '/installExe/:fileType', name: '01MMD049安装.exe', component: '@/pages/InstallExe', layout: false },
{ path: '/initialSystem/:fileType', name: '初装系统', component: '@/pages/InitialSystem', layout: false },
{ path: '/coreSystemEntrance/:fileType', name: '核心管理系统', component: '@/pages/CoreSystemEntrance', layout: false },
// ------------------------------GLQ远程维护----------------------------------
// 建立远程链接
{ path: '/teamViewer/paramsSetting', name: '参数设置', component: '@/pages/GLQ/TeamViewer/ParamsSetting' },
// 交互维护命令
{ path: '/teamViewer/systemTime', name: '系统时间', component: '@/pages/GLQ/TeamViewer/SystemTime' },
{ path: '/teamViewer/currentIP', name: '当前IP', component: '@/pages/GLQ/TeamViewer/CurrentIP' },
{ path: '/teamViewer/pingCommand', name: 'PING命令', component: '@/pages/GLQ/TeamViewer/PingCommand' },
{ path: '/teamViewer/telnetCommand', name: 'TELNET命令', component: '@/pages/GLQ/TeamViewer/TelnetCommand' },
{ path: '/teamViewer/otherCommand', name: '其他命令', component: '@/pages/GLQ/TeamViewer/OtherCommand' },
// ---------------------------------------------------------------------------
// ------------------------------网络MMJ管理----------------------------------
{ path: '/webMMJ/mmjInitInstall', name: 'MMJ初装', component: '@/pages/GLQ/WebMMJ/MmjInitInstall' },
{ path: '/webMMJ/statusQuery', name: '状态查询', component: '@/pages/GLQ/WebMMJ/StatusQuery' },
{ path: '/webMMJ/keyDestruction', name: '密钥销毁', component: '@/pages/GLQ/WebMMJ/KeyDestruction' },
{ path: '/webMMJ/keyRemoteKill', name: '密钥遥毙', component: '@/pages/GLQ/WebMMJ/KeyRemoteKill' },
{ path: '/webMMJ/mmjRemoteKill', name: 'MMJ遥毙', component: '@/pages/GLQ/WebMMJ/MmjRemoteKill' },
// ---------------------------------------------------------------------------
// ------------------------------网络GLQ配置----------------------------------
// 获取配置信息
{ path: '/webGLQ/serviceListInfo', name: '服务列表信息', component: '@/pages/GLQ/WebGLQ/ServiceListInfo' },
{ path: '/webGLQ/networkConfigInfo', name: '网络配置信息', component: '@/pages/GLQ/WebGLQ/NetworkConfigInfo' },
{ path: '/webGLQ/securityPolicyInfo', name: '安全策略信息', component: '@/pages/GLQ/WebGLQ/SecurityPolicyInfo' },
{ path: '/webGLQ/manageConfigInfo', name: '管理配置信息', component: '@/pages/GLQ/WebGLQ/ManageConfigInfo' },
{ path: '/webGLQ/vpnPolicyInfo', name: 'VPN策略信息', component: '@/pages/GLQ/WebGLQ/VpnPolicyInfo' },
{ path: '/webGLQ/firewallPolicyInfo', name: '防火墙策略信息', component: '@/pages/GLQ/WebGLQ/FirewallPolicyInfo'},
{ path: '/webGLQ/logRecordInfo', name: '日志记录信息', component: '@/pages/GLQ/WebGLQ/LogRecordInfo' },
// 远程文件配置
{ path: '/webMMJ/serviceList', name: '服务列表', component: '@/pages/GLQ/WebGLQ/ServiceList' },
{ path: '/webMMJ/networkParams', name: '网络参数', component: '@/pages/GLQ/WebGLQ/NetworkParams' },
{ path: '/webMMJ/securityPolicy', name: '安全策略', component: '@/pages/GLQ/WebGLQ/SecurityPolicy' },
{ path: '/webMMJ/manageConfig', name: '管理配置', component: '@/pages/GLQ/WebGLQ/ManageConfig' },
{ path: '/webMMJ/vpnPolicy', name: 'VPN策略', component: '@/pages/GLQ/WebGLQ/VpnPolicy' },
// ---------------------------------------------------------------------------
// ------------------------------MY管理----------------------------------
// 密钥体管理
{ path: '/KeyBodyManage/formatImport', name: '密钥体格式导入', component: '@/pages/MY/KeyBodyManage/FormatImport' },
{ path: '/KeyBodyManage/formatPublishing', name: '密钥体格式发布', component: '@/pages/MY/KeyBodyManage/FormatPublishing' },
{ path: '/KeyBodyManage/application', name: '密钥体申请', component: '@/pages/MY/KeyBodyManage/Application' },
{ path: '/KeyBodyManage/import', name: '密钥体导入', component: '@/pages/MY/KeyBodyManage/Import' },
{ path: '/KeyBodyManage/receiptForm', name: '密钥体接收单', component: '@/pages/MY/KeyBodyManage/ReceiptForm' },
{ path: '/KeyBodyManage/cleaned', name: '已清理密钥体', component: '@/pages/MY/KeyBodyManage/Cleaned' },
{ path: '/KeyBodyManage/codeComparisonTable', name: '密钥体代号对照表', component: '@/pages/MY/KeyBodyManage/CodeComparisonTable' },
{ path: '/KeyBodyManage/subordinateDistr', name: '向下级配发', component: '@/pages/MY/KeyBodyManage/SubordinateDistr' },
{ path: '/KeyBodyManage/emailDistr', name: '向邮箱配发', component: '@/pages/MY/KeyBodyManage/EmailDistr' },
{ path: '/KeyBodyManage/systemDistr', name: '向专用密码管理系统配发', component: '@/pages/MY/KeyBodyManage/SystemDistr' },
{ path: '/KeyBodyManage/distrTriple', name: '密钥体配发三联单', component: '@/pages/MY/KeyBodyManage/DistrTriple' },
{ path: '/KeyBodyManage/plaintext', name: '明文载体包封', component: '@/pages/MY/KeyBodyManage/Plaintext' },
{ path: '/KeyBodyManage/ciphertext', name: '密文载体包封', component: '@/pages/MY/KeyBodyManage/Ciphertext' },
// 密钥管理
{ path: '/KeyManage/dataMaintenance', name: '管理系统管理盘数据维护', component: '@/pages/MY/KeyManage/DataMaintenance' },
{ path: '/KeyManage/relationConfig', name: '统型完善普密设备密钥互通关系配置', component: '@/pages/MY/KeyManage/RelationConfig' },
{ path: '/KeyManage/manageKeys', name: '管理密钥装配', component: '@/pages/MY/KeyManage/ManageKeys' },
{ path: '/KeyManage/userKey', name: '用户密钥装配', component: '@/pages/MY/KeyManage/UserKey' },
{ path: '/KeyManage/privateKey', name: '专用密钥装配', component: '@/pages/MY/KeyManage/PrivateKey' },
{ path: '/KeyManage/keyConfigQuery', name: '密钥配置查询', component: '@/pages/MY/KeyManage/KeyConfigQuery' },
{ path: '/KeyManage/tripleKeyDistri', name: '密钥配发三联单', component: '@/pages/MY/KeyManage/TripleKeyDistri' },
// 邮箱管理
{ path: '/mailboxManage/index', name: '邮箱管理', component: '@/pages/MY/MailboxManage/index' },
// ---------------------------------------------------------------------------
// ------------------------------SB管理----------------------------------
// 设备管理
{ path: '/deviceManage/dutyAreaConfig', name: '执勤区配置', component: '@/pages/SB/DeviceManage/DutyAreaConfig' },
{ path: '/deviceManage/dataSync', name: '数据同步', component: '@/pages/SB/DeviceManage/DataSync' },
{ path: '/deviceManage/remoteMaintenance', name: '远程维护', component: '@/pages/SB/DeviceManage/RemoteMaintenance' },
{ path: '/deviceManage/numberMaintenance', name: '报号维护', component: '@/pages/SB/DeviceManage/NumberMaintenance' },
// 日志管理
{ path: '/logManage/index', name: '日志管理', component: '@/pages/SB/LogManage/index' },
// 审计管理
{ path: '/auditManage/index', name: '审计管理', component: '@/pages/SB/AuditManage/index' },
// 境外任务管理
{ path: '/overseasTaskManage/index', name: '境外任务管理', component: '@/pages/SB/OverseasTaskManage/index' },
// ---------------------------------------------------------------------------
// ------------------------------SF管理----------------------------------
// 算法资源管理
{ path: '/resourceManage/algorithmMaintenance', name: '算法信息维护', component: '@/pages/SF/ResourceManage/AlgorithmMaintenance' },
{ path: '/resourceManage/paramMaintenance', name: '参数信息维护', component: '@/pages/SF/ResourceManage/ParamMaintenance' },
{ path: '/resourceManage/algorithmSetConfig', name: '算法集合配置', component: '@/pages/SF/ResourceManage/AlgorithmSetConfig' },
{ path: '/resourceManage/networkConfig', name: '管理类参数所属网络配置', component: '@/pages/SF/ResourceManage/NetworkConfig' },
{ path: '/resourceManage/algorithmDistr', name: '算法配发', component: '@/pages/SF/ResourceManage/AlgorithmDistr' },
{ path: '/resourceManage/algorithmParam', name: '算法参数配发', component: '@/pages/SF/ResourceManage/AlgorithmParam' },
// 算法配置管理
{ path: '/configManage/sfSingleInstallConfig', name: '单算法安装配置', component: '@/pages/SF/ConfigManage/SFSingleInstallConfig' },
{ path: '/configManage/sfSingleChangeConfig', name: '单算法更换配置', component: '@/pages/SF/ConfigManage/SFSingleChangeConfig' },
{ path: '/configManage/sfMultiInstallConfig', name: '多算法安装配置', component: '@/pages/SF/ConfigManage/SFMultiInstallConfig' },
{ path: '/configManage/sfMultiChangeConfig', name: '多算法更换配置', component: '@/pages/SF/ConfigManage/SFMultiChangeConfig' },
{ path: '/configManage/paramSingleInstallConfig', name: '单参数安装配置', component: '@/pages/SF/ConfigManage/ParamSingleInstallConfig' },
{ path: '/configManage/paramSingleChangeConfig', name: '单参数更换配置', component: '@/pages/SF/ConfigManage/ParamSingleChangeConfig' },
{ path: '/configManage/paramMultiInstallConfig', name: '多参数安装配置', component: '@/pages/SF/ConfigManage/ParamMultiInstallConfig' },
{ path: '/configManage/paramMultiChangeConfig', name: '多参数更换配置', component: '@/pages/SF/ConfigManage/ParamMultiChangeConfig' },
// 算法托收管理
{ path: '/collectionManage/dataSync', name: '算法托收管理', component: '@/pages/SF/CollectionManage/index' },
// 算法邮箱管理
{ path: '/mailboxManage/index', name: '算法邮箱管理', component: '@/pages/SF/MailboxManage/index' },
// ---------------------------------------------------------------------------
// ------------------------------SBJK二维版-----------------------------------
// ---------------------------------------------------------------------------
// ------------------------------设备注册-----------------------------------
// 注册管理
{ path: '/registerManage/deviceRegister/:id', name: '设备注册管理', component: '@/pages/Register/RegisterManage/DeviceRegister' },
{ path: '/registerManage/manageDiskMainten', name: '管理盘维护', component: '@/pages/Register/RegisterManage/ManageDiskMainten' },
{ path: '/registerManage/devicePhotoMainten', name: '设备照片维护', component: '@/pages/Register/RegisterManage/DevicePhotoMainten' },
{ path: '/registerManage/deviceSearch', name: '设备查找', component: '@/pages/Register/RegisterManage/DeviceSearch' },
{ path: '/registerManage/appSystemConfig', name: '应用系统配置', component: '@/pages/Register/RegisterManage/AppSystemConfig' },
{ path: '/registerManage/infoAggre', name: '信息汇总', component: '@/pages/Register/RegisterManage/InfoAggre' },
// 位置管理
{ path: '/registerManage/unitLocation/:id', name: '单位位置管理', component: '@/pages/Register/PositionManage/UnitLocation' },
{ path: '/registerManage/regionalEdit', name: '地域编辑', component: '@/pages/Register/PositionManage/RegionalEdit' },
// ---------------------------------------------------------------------------
// 建设中页面 // 建设中页面
{ {

1010
package-lock.json generated

File diff suppressed because it is too large Load Diff

@ -1,21 +1,23 @@
.cont_warp { .cont_warp {
border: 1px solid #000; // border: 1px solid #000;
width:100%;
.header { .header {
height: 40px; // height: 40px;
line-height: 40px; line-height: 40px;
font-size: 16px; font-size: 16px;
font-weight: 600; font-weight: 600;
text-align: center; text-align: center;
border-bottom: 1px solid #000; // border-bottom: 1px solid #000;
} }
.main_body { .main_body {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
border-bottom: 1px solid #000; border: 1px solid #000;
height: 500px; // max-height: 500px;
.body_left { .body_left {
width: 200px; width: 200px;
@ -29,11 +31,13 @@
display:flex; display:flex;
flex-direction: column; flex-direction: column;
justify-content: flex-start; justify-content: flex-start;
height:100%; flex:1;
// height:100%;
margin:20px;
.stepTitle{ // .stepTitle{
margin-top:30px; // margin-top:30px;
} // }
.stepDesc{ .stepDesc{
margin-top:30px; margin-top:30px;
} }
@ -44,7 +48,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
margin: 0 10px; margin: 20px 0;
.btns { .btns {
display: flex; display: flex;
align-items: center; align-items: center;

@ -3,7 +3,7 @@ import styles from './index.less';
import ButtonComp from '@/components/ButtonComp'; import ButtonComp from '@/components/ButtonComp';
interface PageProps { interface PageProps {
headTitle: string; //顶部标题 // headTitle: string; //顶部标题
stepTitle: string; //步骤标题 stepTitle: string; //步骤标题
stepDesc: string; //步骤描述 stepDesc: string; //步骤描述
leftStep: string; //左侧步骤描述 leftStep: string; //左侧步骤描述
@ -19,7 +19,7 @@ interface PageProps {
} }
const NodeInitWrap: FC<PageProps> = ({ const NodeInitWrap: FC<PageProps> = ({
headTitle, // headTitle,
stepTitle, stepTitle,
stepDesc, stepDesc,
leftStep, leftStep,
@ -37,7 +37,7 @@ const NodeInitWrap: FC<PageProps> = ({
return ( return (
<div className={styles.cont_warp}> <div className={styles.cont_warp}>
{/* 标题 */} {/* 标题 */}
<div className={styles.header}>{headTitle}</div> {/* <div className={styles.header}>{headTitle}</div> */}
{/* 中间左右结构的主体 */} {/* 中间左右结构的主体 */}
<div className={styles.main_body}> <div className={styles.main_body}>
<div className={styles.body_left}>{leftStep}</div> <div className={styles.body_left}>{leftStep}</div>
@ -51,10 +51,10 @@ const NodeInitWrap: FC<PageProps> = ({
<div className={styles.footer}> <div className={styles.footer}>
<div>xxx</div> <div>xxx</div>
<div className={styles.btns}> <div className={styles.btns}>
{nextbtn && <ButtonComp text='上一步' style={{marginRight:'10px'}} onClick={onNext}/>} {cancelbtn && <ButtonComp type={'cancel'} style={{marginRight:'20px'}} text='取消' onClick={onCancel} />}
{prebtn && <ButtonComp text='下一步' style={{marginRight:'10px'}} onClick={onPre} />} {prebtn && <ButtonComp text='上一步' style={{marginRight:'20px'}} onClick={onPre}/>}
{finishbtn && <ButtonComp text='完成' style={{marginRight:'10px'}} onClick={onFinish} />} {nextbtn && <ButtonComp text='下一步' style={{marginRight:'20px'}} onClick={onNext} />}
{cancelbtn && <ButtonComp text='取消' onClick={onCancel} />} {finishbtn && <ButtonComp text='完成' style={{marginRight:'20px'}} onClick={onFinish} />}
</div> </div>
</div> </div>
</div> </div>

@ -0,0 +1,53 @@
.menu_item {
width: 260px;
height: 32px;
background: linear-gradient(180deg, #4AB4E4 0%, #A2E1FF 100%);
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
font-weight: 600;
color: #FFFFFF;
cursor: pointer;
position: relative;
margin-top:20px;
.triangle {
position: absolute;
right: 20px;
width: 0;
height: 0;
border-left: 6px solid #fff;
border-bottom: 6px solid transparent;
border-top: 6px solid transparent;
transition: all 0.15s ease-in;
}
}
.item_warp {
transition: all 2s ease-in;
.item1 {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
margin: 20px 0;
cursor: pointer;
}
.item1_img {
width: 60px;
height: 60px;
background-color: saddlebrown;
}
.item1_name {
width: 100%;
text-align: center;
font-size: 14px;
font-weight: 400;
color: #1A374A;
margin-top: 6px;
}
}

@ -0,0 +1,49 @@
import { FC, useEffect, useRef, useState } from 'react';
import styles from './index.less';
import { history, useLocation, useParams } from 'umi';
import { Menu, Tree } from 'antd';
interface PageProps {
data: Array<{
name: string;
url: string
}>;
}
const LeftMenuCom: FC<PageProps> = ({ data }) => {
const urlParams = useParams();
const [list, setList] = useState<any>([]);
const [active,setActive] = useState(0)
let urlStr = `${urlParams?.fileType}${location?.search}`;
useEffect(() => {
setList([...data])
}, [])
return (
<div>
{list.map((item: any, index: number) => {
return (
<div key={index}>
{/* 类型 */}
<div className={styles.menu_item} onClick={() => {
history.push(`${item.url}/${urlStr}`)
setActive(index);
}}>
<div style={{color: active==index? '#fff':'#000'}}>{item.name}</div>
{/* <div className={styles.triangle} style={{ transform: list[index].check ? 'rotate(90deg)' : '' }}></div> */}
</div>
</div>
)
})}
</div >
)
}
export default LeftMenuCom

@ -28,6 +28,8 @@ const LeftMenuCom: FC<PageProps> = ({ data }) => {
const [menuItems, setMenuItems] = useState<any>([]); const [menuItems, setMenuItems] = useState<any>([]);
useEffect(() => { useEffect(() => {
menuItemsConfig(); menuItemsConfig();

@ -0,0 +1,33 @@
import { FC, useEffect, useRef, useState } from 'react';
import styles from './index.less';
import { history, useLocation, useParams } from 'umi';
interface PageProps {
currStep: number,
allStep:number,
stepName:string,
}
const LeftMenuCom: FC<PageProps> = ({
currStep,
allStep,
stepName
}) => {
return (
<div style={{
display:'flex',
justifyContent:'center',
alignItems:'center',
width:'100%',
height:'100%',
}}>
<div>{currStep}of{allStep}:{stepName}</div>
</div>
)
}
export default LeftMenuCom

@ -4,16 +4,7 @@ import { history, useLocation, useParams } from 'umi';
import { Menu, Tree } from 'antd'; import { Menu, Tree } from 'antd';
interface PageProps { interface PageProps {
data: Array<{ data: any
// 菜单名称
name: string;
// 是否展开
check: boolean;
// 内容是否有目录结构
isTree?: boolean;
// 菜单列表 name: 名称; url: 路由; img: 图标;
data: Array<{ name: string; url: string; img: any; }>
}>;
} }
const LeftMenuCom: FC<PageProps> = ({ data }) => { const LeftMenuCom: FC<PageProps> = ({ data }) => {
@ -29,16 +20,16 @@ const LeftMenuCom: FC<PageProps> = ({ data }) => {
const [menuItems, setMenuItems] = useState<any>([]); const [menuItems, setMenuItems] = useState<any>([]);
useEffect(() => { useEffect(() => {
menuItemsConfig(); // menuItemsConfig();
data.forEach((item, index) => { // data.forEach((item, index) => {
// 默认展开第一个 // // 默认展开第一个
// item.check = (index == 0 ? true : false); // // item.check = (index == 0 ? true : false);
// 默认全部展开 // // 默认全部展开
item.check = true; // item.check = true;
if (item?.isTree) setSelectedKeys([urlParams?.id]) // if (item?.isTree) setSelectedKeys([urlParams?.id])
}) // })
setList([...data]) setList([...data])
const handleClickOutside = (e: any) => { const handleClickOutside = (e: any) => {
@ -56,15 +47,15 @@ const LeftMenuCom: FC<PageProps> = ({ data }) => {
const menuItemsConfig = () => { const menuItemsConfig = () => {
if (`/registerManage/deviceRegister/${urlParams?.id}` == route?.pathname) { if (`/registerManage/deviceRegister/${urlParams?.id}` == route?.pathname) {
setMenuItems([ setMenuItems([
{key: '1', label: '删除'}, { key: '1', label: '删除' },
{key: '2', label: '刷新'}, { key: '2', label: '刷新' },
]) ])
}else if (`/registerManage/unitLocation/${urlParams?.id}` == route?.pathname) { } else if (`/registerManage/unitLocation/${urlParams?.id}` == route?.pathname) {
setMenuItems([ setMenuItems([
{key: '1', label: '修改'}, { key: '1', label: '修改' },
{key: '2', label: '刷新'}, { key: '2', label: '刷新' },
{key: '3', label: '新建'}, { key: '3', label: '新建' },
{key: '4', label: '删除'} { key: '4', label: '删除' }
]) ])
} }
} }
@ -132,24 +123,6 @@ const LeftMenuCom: FC<PageProps> = ({ data }) => {
]; ];
return ( return (
<div>
{list.map((item: any, index: number) => {
return (
<div key={index}>
{/* 类型 */}
<div className={styles.menu_item} onClick={() => {
list[index].check = !list[index].check;
setList([...list])
}}>
<div>{item.name}</div>
<div className={styles.triangle} style={{ transform: list[index].check ? 'rotate(90deg)' : '' }}></div>
</div>
{/* 列表 */}
<div className={styles.item_warp} style={{ display: list[index].check ? 'block' : 'none' }}>
{
item?.isTree ?
// 树结构
<div> <div>
<Tree <Tree
style={{ padding: 20 }} style={{ padding: 20 }}
@ -157,49 +130,12 @@ const LeftMenuCom: FC<PageProps> = ({ data }) => {
onRightClick={({ event, node }) => handleRightClick(event, node)} onRightClick={({ event, node }) => handleRightClick(event, node)}
onSelect={(e) => { handleSelect(e, item.name) }} onSelect={(e) => { handleSelect(e, item.name) }}
selectedKeys={selectedKeys} selectedKeys={selectedKeys}
treeData={treeData} treeData={data}
blockNode={true} blockNode={true}
defaultExpandAll={true} defaultExpandAll={true}
/> />
{showContextMenu && (
<div ref={treeRef}>
<Menu
style={{
zIndex: 99,
width: 111,
position: 'absolute',
left: contextMenuPosition.x,
top: contextMenuPosition.y,
boxShadow: '0px 4px 8px 0px rgba(156, 172, 180, 0.5)'
}}
mode="vertical"
onClick={handleContextMenuClick}
items={menuItems}
/>
</div>
)}
</div> :
// 列表item
item.data.map((item1: any, index1: number) => {
return (
<div className={styles.item1} key={index1} onClick={() => {
setSelectedKeys([])
history.push(item1.url)
}}>
<div className={styles.item1_img}></div>
<div className={styles.item1_name} style={{ color: (route.pathname == item1.url ? 'red' : '') }}>
{item1.name}
</div>
</div> </div>
) )
})
}
</div>
</div>
)
})}
</div >
)
} }
export default LeftMenuCom export default LeftMenuCom

@ -78,7 +78,7 @@
.nav_warp_b { .nav_warp_b {
display:flex; display:flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: flex-start;
background: linear-gradient(rgb(74, 180, 228) 0%, rgb(162, 225, 255) 100%); background: linear-gradient(rgb(74, 180, 228) 0%, rgb(162, 225, 255) 100%);
box-shadow: 0px 2px 4px 0px rgba(36, 57, 75, 0.5); box-shadow: 0px 2px 4px 0px rgba(36, 57, 75, 0.5);
@ -152,15 +152,15 @@
.main_warp { .main_warp {
width: 100%; width: 100%;
height: calc(100vh - 114px); height: calc(100vh - 224px);
min-height: 600px; min-height: 500px;
display: flex; display: flex;
.left_menu { .left_menu {
width: 260px; width: 260px;
min-width: 260px; min-width: 260px;
height: 100%; height: 100%;
min-height: calc(100vh - 114px - 50px); min-height: calc(100vh - 224px - 50px);
background: #FFFFFF; background: #FFFFFF;
border-right: 1px solid #D8D8D8; border-right: 1px solid #D8D8D8;
overflow: hidden; overflow: hidden;
@ -169,13 +169,14 @@
} }
.right_warp { .right_warp {
height: calc(100% - 114px); height: calc(100% - 224px);
min-height: calc(100vh - 114px); min-height: calc(100vh - 224px);
width: calc(100% - 261px) width: calc(100% - 261px)
} }
.right_route { .right_route {
position: relative; position: relative;
height:100%;
overflow: hidden; overflow: hidden;
overflow-y: auto; overflow-y: auto;
background: #F9F9F9; background: #F9F9F9;

@ -1,11 +1,14 @@
import { Outlet, history, useLocation } from 'umi'; import { Outlet, history, useLocation,useParams } from 'umi';
import styles from './index.less'; import styles from './index.less';
import { useEffect, useState } from 'react'; import { useEffect, useState} from 'react';
import { MenuType, tabsType } from '@/utils/menu'; import { MenuType, tabsType } from '@/utils/menu';
import { ConfigProvider, Select, message } from 'antd'; import { ConfigProvider, Select, message } from 'antd';
import LeftMenuOne from '@/layouts/LeftMenuOne'; import LeftMenuOne from '@/layouts/LeftMenuOne';
import LeftMenuTwo from '@/layouts/LeftMenuTwo'; import LeftMenuTwo from '@/layouts/LeftMenuTwo';
import LeftMenuTree from '@/layouts/LeftMenuTree';
import LeftMenuStep from '@/layouts/LeftMenuStep';
import LeftMenuA from '@/layouts/LeftMenuA';
import BottomConfigInfo from '@/layouts/BottomConfigInfo'; import BottomConfigInfo from '@/layouts/BottomConfigInfo';
import zhCN from 'antd/es/locale/zh_CN'; import zhCN from 'antd/es/locale/zh_CN';
@ -17,50 +20,54 @@ dayjs.locale('zh-cn');
import moment from 'moment' import moment from 'moment'
moment.locale('ZH-cn') moment.locale('ZH-cn')
const options55=[
const options2 = [
{ value: 1, label: '设备管理' }, { value: 1, label: '设备管理' },
{ value: 2, label: 'MY管理' }, { value: 2, label: '密钥管理' },
{ value: 3, label: 'SB管理' }, { value: 3, label: '算法管理' },
{ value: 4, label: 'SF管理' }, { value: 4, label: '审计管理' },
{ value: 5, label: 'SBJK二维版', disabled: true }, { value: 5, label: '监控管理' },
{ value: 6, label: '日志管理' } { value: 6, label: '系统管理' },
{ value: 7, label: '日志管理' },
]
const options63=[
{ value: 8, label: '密码管理' },
{ value: 9, label: '一体化管理' },
] ]
const leftMenuType: any = { const leftMenuType: any = {
// 设备管理 // 设备管理
'设备注册': <LeftMenuOne key={1} data={MenuType['设备注册']} />, '设备注册': <LeftMenuTree key={1} data={MenuType['设备注册']} />,
'在线管理': <LeftMenuTwo key={2} data={MenuType['在线管理']} />, '离线管理1':<LeftMenuStep currStep={1} allStep={4} stepName={'设备离线管理'} />,
'离线管理': <LeftMenuOne key={3} data={MenuType['离线管理']} />, // 密钥管理
// MY管理 '预制密钥':<LeftMenuA data={MenuType['预制密钥']}/>,
'密钥体管理': <LeftMenuOne key={4} data={MenuType['密钥体管理']} />, '密钥装配': <LeftMenuTree key={1} data={MenuType['密钥装配']} />,
'密钥管理': <LeftMenuOne key={5} data={MenuType['密钥管理']} />, '离线管理2':<LeftMenuStep currStep={1} allStep={4} stepName={'密钥离线管理'} />,
'邮箱管理': <LeftMenuOne key={6} data={MenuType['邮箱管理']} />,
// SB管理 // 063
'设备管理': <LeftMenuOne key={7} data={MenuType['设备管理']} />, '密码管理': <LeftMenuTree key={1} data={MenuType['xx管理']} />,
'日志管理': <LeftMenuTwo key={8} data={MenuType['日志管理']} />,
'审计管理': <LeftMenuTwo key={9} data={MenuType['审计管理']} />,
'境外任务管理': <LeftMenuTwo key={10} data={MenuType['境外任务管理']} />,
// SF管理
'算法资源管理': <LeftMenuOne key={11} data={MenuType['算法资源管理']} />,
'算法配置管理': <LeftMenuOne key={12} data={MenuType['算法配置管理']} />,
'算法托收管理': <LeftMenuOne key={13} data={MenuType['算法托收管理']} />,
'算法邮箱管理': <LeftMenuOne key={14} data={MenuType['算法邮箱管理']} />,
// SBJK二维版
'设备监控二维版': <div />,
// 设备注册
'注册管理': <LeftMenuOne key={15} data={MenuType['注册管理']} />,
'位置管理': <LeftMenuOne key={16} data={MenuType['位置管理']} />
} }
export default function Layout() { export default function Layout() {
const urlParams = useParams();
const location = useLocation(); const location = useLocation();
const [routeName, setRouteName] = useState<string>(''); const [routeName, setRouteName] = useState<string>('');
const [selectVal, setSelectVal] = useState<number>(1); //当前选中的是哪个一级菜单 const [selectVal, setSelectVal] = useState<number>(1); //当前选中的是哪个一级菜单
const [tabList, setTabList] = useState<any>([]); //一级菜单包含的二级菜单列表 const [tabList, setTabList] = useState<any>([]); //一级菜单包含的二级菜单列表
const [active, setActive] = useState<number>(1); //当前选中的是哪个二级菜单 const [active, setActive] = useState<number>(1); //当前选中的是哪个二级菜单
const [activeName, setActiveName] = useState<any>('GLQ远程维护'); const [activeName, setActiveName] = useState<any>('设备注册');
// 获取布局信息
let sysData = localStorage.getItem(`${urlParams?.fileType}`);
let info = sysData ? JSON.parse(sysData) : null;
let urlStr = `${urlParams?.fileType}${location?.search}`;
const [options2,setOptios2] = useState([...options55])
const [treeData, setTreeData] = useState<any>([ const [treeData, setTreeData] = useState<any>([
{ {
title: 'Parent 1', title: 'Parent 1',
@ -110,6 +117,12 @@ export default function Layout() {
} else { } else {
setTabList([...tabsType[selectVal]]); setTabList([...tabsType[selectVal]]);
} }
if(urlParams?.fileType === 's63'){
setOptios2(options63)
}else{
setOptios2(options55)
}
}, []) }, [])
useEffect(() => { useEffect(() => {
@ -126,20 +139,20 @@ export default function Layout() {
localStorage.setItem('layoutInfo', JSON.stringify(layoutInfo)); localStorage.setItem('layoutInfo', JSON.stringify(layoutInfo));
}); });
useEffect(() => { // useEffect(() => {
// 条件判断: 当选择框的值发生改变时tabList长度大于0 并且 没有发现记录布局的数据)时 ,默认进入第一个模块的页面 // // 条件判断: 当选择框的值发生改变时tabList长度大于0 并且 没有发现记录布局的数据)时 ,默认进入第一个模块的页面
if (tabList.length > 0 && !layoutInfo) { // if (tabList.length > 0 && !layoutInfo) {
setActiveName(tabList[0].name) // setActiveName(tabList[0].name)
let info = MenuType[tabList[0].name]; // let info = MenuType[tabList[0].name];
if (isTreeType(info)) return // if (isTreeType(info)) return
if (info[0].data) { // if (info[0].data) {
history.push(`${info[0].data[0].url}`) // history.push(`${info[0].data[0].url}`)
} else { // } else {
history.push(`${info[0].url}`) // history.push(`${info[0].url}`)
} // }
} // }
}, [selectVal]) // }, [selectVal])
// 校验是否是树结构列表 // 校验是否是树结构列表
const isTreeType = (info: any) => { const isTreeType = (info: any) => {
@ -200,6 +213,8 @@ export default function Layout() {
setSelectVal(item.value) setSelectVal(item.value)
setTabList([...tabsType[item.value]]) setTabList([...tabsType[item.value]])
setActive(1) setActive(1)
setActiveName(tabsType[item.value]?.[0]?.name)
history.push(`${tabsType[item.value]?.[0]?.url}/${urlStr}`)
}} }}
> >
<div className={styles.menu_list_item_img}></div> <div className={styles.menu_list_item_img}></div>
@ -208,6 +223,12 @@ export default function Layout() {
}) })
} }
</div> </div>
<div className={styles.times}>
<div>XXXX3023-00-00 15:00:00</div>
<div>XXXX3023-00-00 15:00:00</div>
</div>
</div> </div>
<div className={styles.nav_warp_b}> <div className={styles.nav_warp_b}>
@ -222,20 +243,21 @@ export default function Layout() {
setActive(item.id) setActive(item.id)
setActiveName(item.name) setActiveName(item.name)
history.push(`${item.url}/${urlStr}`)
if (isTreeType(info)) return // if (isTreeType(info)) return
if (info.length == 0 || info[0].data && info[0].data.length == 0) { // if (info.length == 0 || info[0].data && info[0].data.length == 0) {
history.push('/construction'); // history.push('/construction');
return // return
} // }
// 改变activeName时跳转菜单栏的第一个路由 // 改变activeName时跳转菜单栏的第一个路由
if (info[0].data) { // if (info[0].data) {
history.push(`${info[0].data[0].url}`) // history.push(`${info[0].data[0].url}`)
} else { // } else {
history.push(`${info[0].url}`) // history.push(`${info[0].url}`)
} // }
}}> }}>
{item.name} {item.name}
@ -244,10 +266,6 @@ export default function Layout() {
}) })
} }
</div> </div>
<div className={styles.times}>
<div>XXXX3023-00-00 15:00:00</div>
<div>XXXX3023-00-00 15:00:00</div>
</div>
</div> </div>
{/* 二级导航标题 */} {/* 二级导航标题 */}

@ -1,54 +0,0 @@
.entrance {
position: relative;
width: 100vw;
min-height: 100vh;
background: url('../../assets/images/bk_img.png') no-repeat;
background-size: 100% 100%;
.text_warp {
width: 80vw;
margin: 0 auto;
div {
text-align: center;
}
div:nth-child(1) {
font-size: 36px;
font-weight: 600;
padding-top: 30vh;
}
div:nth-child(2) {
font-size: 50px;
font-weight: 600;
margin: 50px 0 80px 0;
letter-spacing: 2px;
}
div:nth-child(3) {
font-size: 28px;
}
}
.prompt {
position: fixed;
bottom: 45px;
right: 20px;
font-size: 24px;
color: red;
font-weight: bold;
}
}
.login_warp {
display: flex;
align-items: center;
.imges {
width: 81px;
height: 81px;
margin-right: 20px;
background-color: saddlebrown;
}
}

@ -1,99 +0,0 @@
import { FC, useEffect, useState } from 'react';
import { history, useLocation, useParams } from "umi";
import styles from './index.less';
import { Input, Modal, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { LeftOutlined } from '@ant-design/icons';
interface PageProps { }
const CoreSystemEntrance: FC<PageProps> = ({ }) => {
const urlParams = useParams();
const loaction = useLocation();
const [visibility, setVisibility] = useState<boolean>(false);
const [key, setKey] = useState<string>('一');
const [pin, setPin] = useState<any>('');
useEffect(() => {
let sysName = localStorage.getItem(`${urlParams?.fileType}`);
if (sysName) {
let data = JSON.parse(sysName);
console.log("1",data);
}
function handleKeyPress(e: any) {
if (e.key === 'Enter') {
setVisibility(true)
}
}
// 添加事件监听器
document.addEventListener('keydown', handleKeyPress);
// 清除事件监听器
return () => {
document.removeEventListener('keydown', handleKeyPress);
};
}, [])
const initData = () => {
setVisibility(false);
setKey('一');
setPin('')
}
const submit = () => {
if (key == '一' && pin == 'admin') {
setKey('二');
setPin('')
} else if (key == '二' && pin == 'test') {
initData()
// 登录成功进入系统
history.push('/teamViewer/paramsSetting')
}else {
message.error('PIN码错误请重新输入')
}
}
return (
<div className={styles.entrance}>
<div className={styles.text_warp}>
<div></div>
<div></div>
<div></div>
</div>
<div className={styles.prompt}>...</div>
{/* 登录弹窗 */}
<Modal
title="用户登录"
open={visibility}
centered
width={550}
onCancel={() => setVisibility(false)}
footer={null}
maskClosable={false}
>
<div className={styles.login_warp}>
<div className={styles.imges}></div>
<div>
<div style={{ display: 'flex', alignItems: 'center' }}>
<div style={{ width: 120, marginRight: 16 }}>PIN</div>
<Input placeholder="请输入PIN码" value={pin} onChange={(e) => setPin(e.target.value)} onPressEnter={() => submit()} />
</div>
<div className='mt20'>{key}PIN</div>
</div>
</div>
<div className='flex_jE mt20'>
<ButtonComp style={{ marginRight: 20 }} text={'确定'} onClick={() => submit()} />
<ButtonComp type="cancel" text={'退出'} onClick={() => initData()} />
</div>
</Modal>
</div>
)
}
export default CoreSystemEntrance

@ -1,10 +0,0 @@
import styles from './index.less';
// GLQ远程维护 --> 交互维护命令--> 当前IP
export default function Page() {
return (
<div>
{'GLQ远程维护 --> 交互维护命令--> 当前IP'}
</div>
);
}

@ -1,10 +0,0 @@
import styles from './index.less';
// GLQ远程维护 --> 交互维护命令--> 当前IP
export default function Page() {
return (
<div>
{'GLQ远程维护 --> 交互维护命令--> 当前IP'}
</div>
);
}

@ -1,49 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import { Form, Input, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { setParameter } from '@/services/gql';
import { validateIPAddress } from '@/utils/validate';
export default function Page() {
const [form] = Form.useForm();
const onFinish = (values: any) => {
setParameter({
ipAddress: values.ipAddress
}).then((res) => {
if (res.result == 'success') {
message.success('连接成功')
}else {
message.success(res.errorMsg)
}
})
};
return (
<div className={styles.params_warp}>
<ContentWarp text={'参数设置'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<Form form={form} onFinish={onFinish}>
<Form.Item
name="ipAddress"
label="本地GLQ后端IP"
rules={[
{ required: true, message: '请输入本地GLQ后端IP' },
{ validator: validateIPAddress },
]}
>
<Input placeholder="请输入本地GLQ后端IP" style={{ width: '560px' }} />
</Form.Item>
</Form>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'建立连接'} onClick={() => form.submit()} />
<ButtonComp type={'cancel'} text={'参数重置'} onClick={() => form.resetFields()} />
</div>
</div>
</ContentWarp>
</div>
);
}

@ -1,10 +0,0 @@
import styles from './index.less';
// GLQ远程维护 --> 交互维护命令--> PING命令
export default function Page() {
return (
<div>
{'GLQ远程维护 --> 交互维护命令--> PING命令'}
</div>
);
}

@ -1,10 +0,0 @@
import styles from './index.less';
// GLQ远程维护 --> 交互维护命令--> 系统时间
export default function Page() {
return (
<div>
{'GLQ远程维护 --> 交互维护命令--> 系统时间'}
</div>
);
}

@ -1,10 +0,0 @@
import styles from './index.less';
// GLQ远程维护 --> 交互维护命令-->TELNET命令
export default function Page() {
return (
<div>
{'GLQ远程维护 --> 交互维护命令-->TELNET命令'}
</div>
);
}

@ -1,83 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useRef, useState } from 'react';
import { getGlqInfo } from '@/services/gql';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import SaveAs from '@/components/SaveAs';
// 网络GQL管理 --> 获取防火墙策略
export default function Page() {
const [lines, setLines] = useState<any>([]);
const [currentLineIndex, setCurrentLineIndex] = useState(0);
const [visibility, setVisibility] = useState<boolean>(false);
const outputRef: any = useRef(null);
useEffect(() => {
const timer = setInterval(() => {
if (currentLineIndex < lines.length) {
setCurrentLineIndex((prevIndex) => prevIndex + 1);
} else {
clearInterval(timer);
}
}, 300);
if (outputRef.current.scrollHeight > 330) {
outputRef.current.scrollTop = outputRef.current.scrollHeight;
}
return () => {
clearInterval(timer); // 组件卸载时清除定时器
};
}, [currentLineIndex, lines.length]);
const statusQuery = () => {
getGlqInfo({type: 4}).then((res) => {
if (res?.result == "success") {
setLines([
...lines,
'发送命令成功',
`获取防火墙策略`,
`正在获取防火墙策略中...`,
`获取防火墙策略完成`
])
} else {
setLines([`${res?.errorMsg}`])
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'获取防火墙策略'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<div ref={outputRef} className={styles.html_con}>
<div id='messageInfo' style={{ padding: '0px 12px' }} key={currentLineIndex}>
{lines.slice(0, currentLineIndex).map((line: string, index: number) => (
<p key={index} style={{ paddingTop: index == 0 ? 20 : 10 }}>{line}</p>
))}
</div>
</div>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送命令'} onClick={() => { statusQuery() }} />
<SaveAs style={{ marginRight: 20}} fileName='获取防火墙策略' domId='messageInfo'/>
<ButtonComp type={'cancel'} disabled={lines.length == 0} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
setLines([]);
setCurrentLineIndex(0);
setVisibility(false);
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,83 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useRef, useState } from 'react';
import { getGlqInfo } from '@/services/gql';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import SaveAs from '@/components/SaveAs';
// 网络GQL管理 --> 获取日志信息
export default function Page() {
const [lines, setLines] = useState<any>([]);
const [currentLineIndex, setCurrentLineIndex] = useState(0);
const [visibility, setVisibility] = useState<boolean>(false);
const outputRef: any = useRef(null);
useEffect(() => {
const timer = setInterval(() => {
if (currentLineIndex < lines.length) {
setCurrentLineIndex((prevIndex) => prevIndex + 1);
} else {
clearInterval(timer);
}
}, 300);
if (outputRef.current.scrollHeight > 330) {
outputRef.current.scrollTop = outputRef.current.scrollHeight;
}
return () => {
clearInterval(timer); // 组件卸载时清除定时器
};
}, [currentLineIndex, lines.length]);
const statusQuery = () => {
getGlqInfo({type: 4}).then((res) => {
if (res?.result == "success") {
setLines([
...lines,
'发送命令成功',
`获取日志信息`,
`正在获取日志信息中...`,
`获取日志信息完成`
])
} else {
setLines([`${res?.errorMsg}`])
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'获取日志信息'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<div ref={outputRef} className={styles.html_con}>
<div id='messageInfo' style={{ padding: '0px 12px' }} key={currentLineIndex}>
{lines.slice(0, currentLineIndex).map((line: string, index: number) => (
<p key={index} style={{ paddingTop: index == 0 ? 20 : 10 }}>{line}</p>
))}
</div>
</div>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送命令'} onClick={() => { statusQuery() }} />
<SaveAs style={{ marginRight: 20}} fileName='获取日志信息' domId='messageInfo'/>
<ButtonComp type={'cancel'} disabled={lines.length == 0} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
setLines([]);
setCurrentLineIndex(0);
setVisibility(false);
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,123 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import { Form, Input, Select, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { useEffect } from 'react';
import { remoteFileConfiSendData, remoteFileConfigClean } from '@/services/gql';
// 网络GLQ配置 --> 远程文件配置--> 管理配置
export default function Page() {
const [form] = Form.useForm();
useEffect(() => {
form.setFieldsValue({
deviceLocation: '前端机平台',
deviceType: '类型1',
hotStandby: 'no',
deviceId: '',
})
}, [])
const onFinish = (values: any) => {
remoteFileConfiSendData({
jsonStr: JSON.stringify(values),
type: 4
}).then((res) => {
if (res?.result == "success") {
message.success('文件提交成功');
form.resetFields();
} else {
message.error(res?.errorMsg);
}
})
};
const clearInfo = () => {
remoteFileConfigClean({type: 4}).then(res => {
if (res?.result == "success") {
message.success('清除信息成功');
}else {
message.error(res?.errorMsg);
}
})
}
return (
<div className={`${styles.params_warp}`}>
<ContentWarp text={'管理文件配置'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<Form
form={form}
onFinish={onFinish}
>
<Form.Item
name="deviceLocation"
label="设备位置"
rules={[
{ required: true, message: '请选择设备位置' },
]}
>
<Select
style={{ width: 560 }}
onChange={(e) => { }}
options={[
{ label: '前端机平台', value: '前端机平台' },
{ label: '后端机平台', value: '后端机平台' }
]}
/>
</Form.Item>
<Form.Item
name="deviceType"
label="设备类型"
rules={[
{ required: true, message: '请选择设备类型' },
]}
>
<Select
style={{ width: 560 }}
onChange={(e) => { }}
options={[
{ label: '类型1', value: '类型1' },
{ label: '类型2', value: '类型2' }
]}
/>
</Form.Item>
<Form.Item
name="hotStandby"
label="存在热备"
rules={[
{ required: true, message: '请选择存在热备' },
]}
>
<Select
style={{ width: 560 }}
onChange={(e) => { }}
options={[
{ label: 'no', value: 'no' },
{ label: 'yes', value: 'yes' }
]}
/>
</Form.Item>
<Form.Item
name="deviceId"
label="设备标识"
rules={[
{ required: true, message: '请输入设备标识' },
]}
>
<Input placeholder="请输入设备标识" style={{ width: '560px' }} />
</Form.Item>
</Form>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'文件提交'} onClick={() => form.submit()} />
<ButtonComp type={'cancel'} text={'清空信息'} onClick={() => clearInfo()} />
</div>
</div>
</ContentWarp>
</div>
);
}

@ -1,83 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useRef, useState } from 'react';
import { getGlqInfo } from '@/services/gql';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import SaveAs from '@/components/SaveAs';
// 网络GQL管理 --> 获取管理配置
export default function Page() {
const [lines, setLines] = useState<any>([]);
const [currentLineIndex, setCurrentLineIndex] = useState(0);
const [visibility, setVisibility] = useState<boolean>(false);
const outputRef: any = useRef(null);
useEffect(() => {
const timer = setInterval(() => {
if (currentLineIndex < lines.length) {
setCurrentLineIndex((prevIndex) => prevIndex + 1);
} else {
clearInterval(timer);
}
}, 300);
if (outputRef.current.scrollHeight > 330) {
outputRef.current.scrollTop = outputRef.current.scrollHeight;
}
return () => {
clearInterval(timer); // 组件卸载时清除定时器
};
}, [currentLineIndex, lines.length]);
const statusQuery = () => {
getGlqInfo({type: 4}).then((res) => {
if (res?.result == "success") {
setLines([
...lines,
'发送命令成功',
`获取管理配置`,
`正在获取管理配置中...`,
`获取管理配置完成`
])
} else {
setLines([`${res?.errorMsg}`])
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'获取管理配置'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<div ref={outputRef} className={styles.html_con}>
<div id='messageInfo' style={{ padding: '0px 12px' }} key={currentLineIndex}>
{lines.slice(0, currentLineIndex).map((line: string, index: number) => (
<p key={index} style={{ paddingTop: index == 0 ? 20 : 10 }}>{line}</p>
))}
</div>
</div>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送命令'} onClick={() => { statusQuery() }} />
<SaveAs style={{ marginRight: 20}} fileName='获取管理配置' domId='messageInfo'/>
<ButtonComp type={'cancel'} disabled={lines.length == 0} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
setLines([]);
setCurrentLineIndex(0);
setVisibility(false);
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,83 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useRef, useState } from 'react';
import { getGlqInfo } from '@/services/gql';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import SaveAs from '@/components/SaveAs';
// 网络GQL管理 --> 获取网络配置
export default function Page() {
const [lines, setLines] = useState<any>([]);
const [currentLineIndex, setCurrentLineIndex] = useState(0);
const [visibility, setVisibility] = useState<boolean>(false);
const outputRef: any = useRef(null);
useEffect(() => {
const timer = setInterval(() => {
if (currentLineIndex < lines.length) {
setCurrentLineIndex((prevIndex) => prevIndex + 1);
} else {
clearInterval(timer);
}
}, 300);
if (outputRef.current.scrollHeight > 330) {
outputRef.current.scrollTop = outputRef.current.scrollHeight;
}
return () => {
clearInterval(timer); // 组件卸载时清除定时器
};
}, [currentLineIndex, lines.length]);
const statusQuery = () => {
getGlqInfo({type: 2}).then((res) => {
if (res?.result == "success") {
setLines([
...lines,
'发送命令成功',
`获取网络配置`,
`正在获取网络配置中...`,
`获取网络配置完成`
])
} else {
setLines([`${res?.errorMsg}`])
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'获取网络配置'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<div ref={outputRef} className={styles.html_con}>
<div id='messageInfo' style={{ padding: '0px 12px' }} key={currentLineIndex}>
{lines.slice(0, currentLineIndex).map((line: string, index: number) => (
<p key={index} style={{ paddingTop: index == 0 ? 20 : 10 }}>{line}</p>
))}
</div>
</div>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送命令'} onClick={() => { statusQuery() }} />
<SaveAs style={{ marginRight: 20}} fileName='被控端网络状态信息配置情况' domId='messageInfo'/>
<ButtonComp type={'cancel'} disabled={lines.length == 0} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
setLines([]);
setCurrentLineIndex(0);
setVisibility(false);
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,6 +0,0 @@
.params_warp1 {
[class~='ant-form-item-label'] {
width: 80px;
justify-content: flex-end;
}
}

@ -1,85 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import styles1 from './index.less';
import { Form, Input, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { remoteFileConfiSendData, remoteFileConfigClean } from '@/services/gql';
import { subnetMaskValidator, validateIPAddress } from '@/utils/validate';
// 网络GLQ配置 --> 远程文件配置--> 网络参数
export default function Page() {
const [form] = Form.useForm();
const onFinish = (values: any) => {
remoteFileConfiSendData({
jsonStr: JSON.stringify(values),
type: 2
}).then( (res) => {
if (res?.result == "success") {
message.success('文件提交成功');
form.resetFields();
}else {
message.error(res?.errorMsg);
}
})
};
const clearInfo = () => {
remoteFileConfigClean({type: 2}).then(res => {
if (res?.result == "success") {
message.success('清除信息成功');
}else {
message.error(res?.errorMsg);
}
})
}
return (
<div className={`${styles.params_warp} ${styles1.params_warp1}`}>
<ContentWarp text={'网络参数配置'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<Form
form={form}
onFinish={onFinish}
>
<Form.Item
name="ipAddress"
label="IP地址"
rules={[
{ required: true, message: '请输入IP地址' },
{ validator: validateIPAddress }
]}
>
<Input placeholder="请输入IP地址" style={{ width: '560px' }} />
</Form.Item>
<Form.Item
name="mask"
label="子网掩码"
rules={[
{ required: true, message: '请输入子网掩码' }
]}
>
<Input placeholder="请输入子网掩码" style={{ width: '560px' }} />
</Form.Item>
<Form.Item
name="defaultGateway"
label="默认网关"
rules={[
{ required: true, message: '请输入默认网关' },
]}
>
<Input placeholder="请输入默认网关" style={{ width: '560px' }} />
</Form.Item>
</Form>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'文件提交'} onClick={() => form.submit()} />
<ButtonComp type={'cancel'} text={'清空信息'} onClick={() => clearInfo()} />
</div>
</div>
</ContentWarp>
</div>
);
}

@ -1,101 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import { ConfigProvider, Form, Input, Table, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useState } from 'react';
import { rowClassName } from '@/utils';
import { getTextSecretInfo, remoteFileConfiSendData } from '@/services/gql';
import { validateIPAddress } from '@/utils/validate';
// 网络GLQ配置 --> 远程文件配置--> 安全策略
export default function Page() {
const [form] = Form.useForm();
const [tableData, setTableData] = useState([]);
useEffect(() => {
form.setFieldsValue({ip: '114.114.114.114'})
}, [])
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '单位名称', dataIndex: '单位名称', key: '单位名称', align: 'center' },
{ title: '设备名称', dataIndex: '设备名称', key: '设备名称', align: 'center' },
{ title: '设备IP', dataIndex: '设备ip', key: '设备ip', align: 'center' },
{ title: '电话号码', dataIndex: '电话号码', key: '电话号码', align: 'center' },
{ title: '设备属性', dataIndex: '设备属性', key: '设备属性', align: 'center' },
{ title: '设备型号', dataIndex: '设备型号', key: '设备型号', align: 'center' },
]
const onFinish = (values: any) => {
getTextSecretInfo(values).then(res => {
if (res?.result == "success") {
setTableData(res?.data[0].jsonStr)
message.success('获取成功');
} else {
message.error(res?.errorMsg);
}
})
};
const sending = () => {
if (tableData.length == 0) {
message.info('请获取普密信息后再发送数据');
return
}
remoteFileConfiSendData({
jsonStr: JSON.stringify(tableData),
type: 3
}).then( (res) => {
if (res?.result == "success") {
message.success('发送数据成功');
}else {
message.error(res?.errorMsg);
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'安全策略配置'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<Table
scroll={tableData.length > 0 ? { y: 41 * 5 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<Form form={form} layout={'inline'} onFinish={onFinish} className='mt20'>
<Form.Item name="ip" label="普密对外服务器IP仅Ⅱ型隔离器时需配置此项" rules={[
{ required: true, message: '请输入普密对外服务器IP' },
{ validator: validateIPAddress }
]} >
<Input placeholder="请输入普密对外服务器IP" style={{ width: '280px' }} />
</Form.Item>
<ButtonComp style={{ marginRight: 20 }} text={'获取普密信息'} onClick={() => form.submit()} />
</Form>
<div className='mt20'></div>
<div className={styles.btn_warp}>
<ButtonComp text={'发送数据'} onClick={() => sending()} />
</div>
</div>
</ContentWarp>
</div>
);
}

@ -1,83 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useRef, useState } from 'react';
import { getGlqInfo } from '@/services/gql';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import SaveAs from '@/components/SaveAs';
// 网络GQL管理 --> 获取安全策略
export default function Page() {
const [lines, setLines] = useState<any>([]);
const [currentLineIndex, setCurrentLineIndex] = useState(0);
const [visibility, setVisibility] = useState<boolean>(false);
const outputRef: any = useRef(null);
useEffect(() => {
const timer = setInterval(() => {
if (currentLineIndex < lines.length) {
setCurrentLineIndex((prevIndex) => prevIndex + 1);
} else {
clearInterval(timer);
}
}, 300);
if (outputRef.current.scrollHeight > 330) {
outputRef.current.scrollTop = outputRef.current.scrollHeight;
}
return () => {
clearInterval(timer); // 组件卸载时清除定时器
};
}, [currentLineIndex, lines.length]);
const statusQuery = () => {
getGlqInfo({type: 3}).then((res) => {
if (res?.result == "success") {
setLines([
...lines,
'发送命令成功',
`获取安全策略`,
`正在获取安全策略中...`,
`获取安全策略完成`
])
} else {
setLines([`${res?.errorMsg}`])
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'获取安全策略'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<div ref={outputRef} className={styles.html_con}>
<div id='messageInfo' style={{ padding: '0px 12px' }} key={currentLineIndex}>
{lines.slice(0, currentLineIndex).map((line: string, index: number) => (
<p key={index} style={{ paddingTop: index == 0 ? 20 : 10 }}>{line}</p>
))}
</div>
</div>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送命令'} onClick={() => { statusQuery() }} />
<SaveAs style={{ marginRight: 20}} fileName='获取安全策略' domId='messageInfo'/>
<ButtonComp type={'cancel'} disabled={lines.length == 0} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
setLines([]);
setCurrentLineIndex(0);
setVisibility(false);
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,111 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import { ConfigProvider, Form, Input, Table, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { useState } from 'react';
import { rowClassName } from '@/utils';
import { validateIPAddress, validatePort } from '@/utils/validate';
import { remoteFileConfiSendData, remoteFileConfigClean } from '@/services/gql';
// 网络GLQ配置 --> 远程文件配置--> 服务列表
export default function Page() {
const [form] = Form.useForm();
const [tableData, setTableData] = useState<any>([]);
const onFinish = (values: any) => {
values.rowKey = Math.random();
setTableData([...tableData, values])
};
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '服务名称', dataIndex: 'serviceName', key: 'serviceName', align: 'center' },
{ title: '服务器IP', dataIndex: 'serviceIP', key: 'serviceIP', align: 'center' },
{ title: '服务端口', dataIndex: 'servicePort', key: 'servicePort', align: 'center' },
]
const sending = () => {
if(tableData.length == 0) {
message.info('请添加数据');
return
}
let serviceList = tableData.map(({serviceName, serviceIP, servicePort}: any) => {
return {serviceName, serviceIP, servicePort}
})
remoteFileConfiSendData({
jsonStr: JSON.stringify({ serviceList: serviceList }),
type: 1
}).then( (res) => {
if (res?.result == "success") {
message.success('发送数据成功');
form.resetFields();
}else {
message.error(res?.errorMsg);
}
})
}
const clearInfo = () => {
remoteFileConfigClean({type: 1}).then(res => {
if (res?.result == "success") {
message.success('清除信息成功');
}else {
message.error(res?.errorMsg);
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'服务列表配置'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<Form form={form} layout={'inline'} onFinish={onFinish} className='mb20'>
<Form.Item name="serviceName" label="服务名称" rules={[{ required: true, message: '请输入服务名称' }]} >
<Input placeholder="请输入服务名称" style={{ width: '200px' }} />
</Form.Item>
<Form.Item name="serviceIP" label="服务IP" rules={[
{ required: true, message: '请输入服务IP' },
{ validator: validateIPAddress}
]} >
<Input placeholder="请输入服务IP" style={{ width: '200px' }} />
</Form.Item>
<Form.Item name="servicePort" label="服务端口" rules={[
{ required: true, message: '请输入服务端口' },
{ validator: validatePort }
]} >
<Input placeholder="请输入服务端口" style={{ width: '200px' }} />
</Form.Item>
<ButtonComp text={'提交'} onClick={() => form.submit()} />
</Form>
<Table
scroll={tableData.length > 0 ? { y: 41 * 5 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.rowKey}
rowClassName={rowClassName}
/>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送数据'} onClick={() => sending()} />
<ButtonComp type={'cancel'} text={'清空信息'} onClick={() => clearInfo()} />
</div>
</div>
</ContentWarp>
</div>
);
}

@ -1,83 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useRef, useState } from 'react';
import { getGlqInfo } from '@/services/gql';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import SaveAs from '@/components/SaveAs';
// 网络GQL管理 --> 获取服务列表
export default function Page() {
const [lines, setLines] = useState<any>([]);
const [currentLineIndex, setCurrentLineIndex] = useState(0);
const [visibility, setVisibility] = useState<boolean>(false);
const outputRef: any = useRef(null);
useEffect(() => {
const timer = setInterval(() => {
if (currentLineIndex < lines.length) {
setCurrentLineIndex((prevIndex) => prevIndex + 1);
} else {
clearInterval(timer);
}
}, 300);
if (outputRef.current.scrollHeight > 330) {
outputRef.current.scrollTop = outputRef.current.scrollHeight;
}
return () => {
clearInterval(timer); // 组件卸载时清除定时器
};
}, [currentLineIndex, lines.length]);
const statusQuery = () => {
getGlqInfo({type: 1}).then((res) => {
if (res?.result == "success") {
setLines([
...lines,
'发送命令成功',
`获取服务列表`,
`正在获取服务列表中...`,
`获取服务列表完成`
])
} else {
setLines([`${res?.errorMsg}`])
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'获取服务列表'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<div ref={outputRef} className={styles.html_con}>
<div id='messageInfo' style={{ padding: '0px 12px' }} key={currentLineIndex}>
{lines.slice(0, currentLineIndex).map((line: string, index: number) => (
<p key={index} style={{ paddingTop: index == 0 ? 20 : 10 }}>{line}</p>
))}
</div>
</div>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送命令'} onClick={() => { statusQuery() }} />
<SaveAs style={{ marginRight: 20}} fileName='获取服务列表' domId='messageInfo'/>
<ButtonComp type={'cancel'} disabled={lines.length == 0} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
setLines([]);
setCurrentLineIndex(0);
setVisibility(false);
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,6 +0,0 @@
.params_warp1 {
[class~='ant-form-item-label'] {
width: 110px;
justify-content: flex-end;
}
}

@ -1,194 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import styles1 from './index.less';
import { Form, Input, Select, Table, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useState } from 'react';
import { rowClassName } from '@/utils';
import { validateIPAddress } from '@/utils/validate';
import { remoteFileConfiSendData, remoteFileConfigClean } from '@/services/gql';
// 网络GLQ配置 --> 远程文件配置--> VPN策略
export default function Page() {
const [form] = Form.useForm();
const [tableData, setTableData] = useState<any>([]);
const [activeList, setActiveList] = useState<any>([]);
useEffect(() => {
form.setFieldsValue({
unitName: '',
deviceName: '',
deviceIp: '',
deviceId: '',
messageComm: '加密通信',
pingComm: '允许互PING',
})
}, [])
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '单位名称', dataIndex: 'unitName', key: 'unitName', align: 'center' },
{ title: '设备名称', dataIndex: 'deviceName', key: 'deviceName', align: 'center' },
{ title: '设备IP', dataIndex: 'deviceIp', key: 'deviceIp', align: 'center' },
{ title: '设备ID', dataIndex: 'deviceId', key: 'deviceId', align: 'center' },
{ title: '报文通信策略', dataIndex: 'messageComm', key: 'messageComm', align: 'center' },
{ title: 'PING通信策略', dataIndex: 'pingComm', key: 'pingComm', align: 'center' },
]
const onFinish = (values: any) => {
values.rowKey = Math.floor(Math.random() * 10000);
setTableData([...tableData, values])
};
const sending = () => {
if (tableData.length == 0) {
message.info('请添加数据');
return
}else if (activeList.length == 0) {
message.info('请勾选需要发送的数据');
return
}
let serviceList = activeList.map(({ unitName, deviceName, deviceIp, deviceId, messageComm, pingComm }: any) => {
return { unitName, deviceName, deviceIp, deviceId, messageComm, pingComm }
})
remoteFileConfiSendData({
jsonStr: JSON.stringify({ serviceList: serviceList }),
type: 5
}).then((res) => {
if (res?.result == "success") {
message.success('发送数据成功');
form.resetFields();
} else {
message.error(res?.errorMsg);
}
})
}
const clearInfo = () => {
remoteFileConfigClean({ type: 5 }).then(res => {
if (res?.result == "success") {
message.success('清除信息成功');
} else {
message.error(res?.errorMsg);
}
})
}
return (
<div className={`${styles.params_warp} ${styles1.params_warp1}`}>
<ContentWarp text={'VPN策略配置'}>
<div className='pd20'>VPN</div>
<div className='line'></div>
<div className='pd20 pb100'>
<Form
form={form}
onFinish={onFinish}
>
<Form.Item
name="unitName"
label="单位名称"
rules={[
{ required: true, message: '请输入单位名称' },
]}
>
<Input placeholder="请输入单位名称" style={{ width: '630px' }} />
</Form.Item>
<Form.Item
name="deviceName"
label="设备名称"
rules={[
{ required: true, message: '请输入设备名称' },
]}
>
<Input placeholder="请输入设备名称" style={{ width: '630px' }} />
</Form.Item>
<div style={{ display: 'flex' }}>
<Form.Item
name="deviceIp"
label="设备IP"
rules={[
{ required: true, message: '请输入设备IP' },
{ validator: validateIPAddress }
]}
>
<Input placeholder="请输入设备IP" style={{ width: '250px', marginRight: 20 }} />
</Form.Item>
<Form.Item
name="deviceId"
label="设备ID"
rules={[
{ required: true, message: '请输入设备ID' },
]}
>
<Input placeholder="请输入设备ID" style={{ width: '250px' }} />
</Form.Item>
</div>
<div style={{ display: 'flex' }}>
<Form.Item
name="messageComm"
label="报文通信策略"
rules={[
{ required: true, message: '请选择报文通信策略' },
]}
>
<Select
style={{ width: 250, marginRight: 20 }}
onChange={(e) => { }}
options={[
{ label: '加密通信', value: '加密通信' },
{ label: '数据明传', value: '数据明传' },
{ label: '通信阻断', value: '通信阻断' }
]}
/>
</Form.Item>
<Form.Item
name="pingComm"
label="PING通信策略"
rules={[
{ required: true, message: '请选择PING通信策略' },
]}
>
<Select
style={{ width: 250, marginRight: 20 }}
onChange={(e) => { }}
options={[
{ label: '允许互PING', value: '允许互PING' },
{ label: '阻断互PING', value: '阻断互PING' }
]}
/>
</Form.Item>
<ButtonComp text={'提交'} onClick={() => form.submit()} />
</div>
</Form>
<Table
scroll={tableData.length > 0 ? { y: 41 * 5 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.rowKey}
rowClassName={rowClassName}
rowSelection={{
onChange: (selectedRowKeys: any, selectedRows: any) => {
setActiveList(selectedRows)
}
}}
/>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送数据'} onClick={() => sending()} />
<ButtonComp type={'cancel'} text={'信息清空'} onClick={() => clearInfo()} />
</div>
</div>
</ContentWarp>
</div>
);
}

@ -1,83 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useRef, useState } from 'react';
import { getGlqInfo } from '@/services/gql';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import SaveAs from '@/components/SaveAs';
// 网络GQL管理 --> 获取VPN策略
export default function Page() {
const [lines, setLines] = useState<any>([]);
const [currentLineIndex, setCurrentLineIndex] = useState(0);
const [visibility, setVisibility] = useState<boolean>(false);
const outputRef: any = useRef(null);
useEffect(() => {
const timer = setInterval(() => {
if (currentLineIndex < lines.length) {
setCurrentLineIndex((prevIndex) => prevIndex + 1);
} else {
clearInterval(timer);
}
}, 300);
if (outputRef.current.scrollHeight > 330) {
outputRef.current.scrollTop = outputRef.current.scrollHeight;
}
return () => {
clearInterval(timer); // 组件卸载时清除定时器
};
}, [currentLineIndex, lines.length]);
const statusQuery = () => {
getGlqInfo({type: 4}).then((res) => {
if (res?.result == "success") {
setLines([
...lines,
'发送命令成功',
`获取VPN策略`,
`正在获取VPN策略中...`,
`获取VPN策略完成`
])
} else {
setLines([`${res?.errorMsg}`])
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'获取VPN策略'}>
<div className='pd20'>VPN</div>
<div className='line'></div>
<div className='pd20 pb100'>
<div ref={outputRef} className={styles.html_con}>
<div id='messageInfo' style={{ padding: '0px 12px' }} key={currentLineIndex}>
{lines.slice(0, currentLineIndex).map((line: string, index: number) => (
<p key={index} style={{ paddingTop: index == 0 ? 20 : 10 }}>{line}</p>
))}
</div>
</div>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送命令'} onClick={() => { statusQuery() }} />
<SaveAs style={{ marginRight: 20}} fileName='获取VPN策略' domId='messageInfo'/>
<ButtonComp type={'cancel'} disabled={lines.length == 0} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
setLines([]);
setCurrentLineIndex(0);
setVisibility(false);
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,82 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useRef, useState } from 'react';
import { secretInit_sendCommand } from '@/services/gql';
import ClearInfoDialog from '@/components/ClearInfoDialog';
// 网络MMJ管理 --> 密钥销毁
export default function Page() {
const [lines, setLines] = useState<any>([]);
const [currentLineIndex, setCurrentLineIndex] = useState(0);
const [visibility, setVisibility] = useState<boolean>(false);
const outputRef: any = useRef(null);
useEffect(() => {
const timer = setInterval(() => {
if (currentLineIndex < lines.length) {
setCurrentLineIndex((prevIndex) => prevIndex + 1);
} else {
clearInterval(timer);
}
}, 300);
if (outputRef.current.scrollHeight > 330) {
outputRef.current.scrollTop = outputRef.current.scrollHeight;
}
return () => {
clearInterval(timer); // 组件卸载时清除定时器
};
}, [currentLineIndex, lines.length]);
const sending = () => {
secretInit_sendCommand({type: 1}).then((res) => {
if (res?.result == "success") {
setLines([
...lines,
'发送命令成功',
`执行密码销毁`,
`正在密码销毁中...`,
`密码销毁完成`
])
} else {
setLines([`${res?.errorMsg}`])
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'密码销毁'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<div ref={outputRef} className={styles.html_con}>
<div style={{ padding: '0px 12px' }}>
{lines.slice(0, currentLineIndex).map((line: string, index: number) => (
<p key={line} style={{ paddingTop: index == 0 ? 20 : 10 }}>{line}</p>
))}
</div>
</div>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送命令'} onClick={() => sending()} />
<ButtonComp type={'cancel'} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
setLines([]);
setCurrentLineIndex(0);
setVisibility(false);
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,82 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useRef, useState } from 'react';
import { secretInit_sendCommand } from '@/services/gql';
import ClearInfoDialog from '@/components/ClearInfoDialog';
// 网络MMJ管理 --> 密码遥毙
export default function Page() {
const [lines, setLines] = useState<any>([]);
const [currentLineIndex, setCurrentLineIndex] = useState(0);
const [visibility, setVisibility] = useState<boolean>(false);
const outputRef: any = useRef(null);
useEffect(() => {
const timer = setInterval(() => {
if (currentLineIndex < lines.length) {
setCurrentLineIndex((prevIndex) => prevIndex + 1);
} else {
clearInterval(timer);
}
}, 300);
if (outputRef.current.scrollHeight > 330) {
outputRef.current.scrollTop = outputRef.current.scrollHeight;
}
return () => {
clearInterval(timer); // 组件卸载时清除定时器
};
}, [currentLineIndex, lines.length]);
const sending = () => {
secretInit_sendCommand({type: 2}).then((res) => {
if (res?.result == "success") {
setLines([
...lines,
'发送命令成功',
`执行密码遥毙`,
`正在密码遥毙中...`,
`密码遥毙完成`
])
} else {
setLines([`${res?.errorMsg}`])
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'密码遥毙'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<div ref={outputRef} className={styles.html_con}>
<div style={{ padding: '0px 12px' }}>
{lines.slice(0, currentLineIndex).map((line: string, index: number) => (
<p key={line} style={{ paddingTop: index == 0 ? 20 : 10 }}>{line}</p>
))}
</div>
</div>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送命令'} onClick={() => sending()} />
<ButtonComp type={'cancel'} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
setLines([]);
setCurrentLineIndex(0);
setVisibility(false);
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,6 +0,0 @@
.params_warp1 {
[class~='ant-form-item-label'] {
width: 100px;
justify-content: flex-end;
}
}

@ -1,133 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import styles1 from './index.less';
import { Form, Input, Upload, UploadProps, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { secretInit_cleanInfo, secretInit_loadData, secretInit_sendData } from '@/services/gql';
import { useEffect, useState, } from 'react';
import ClearInfoDialog from '@/components/ClearInfoDialog';
// 网络MMJ管理 --> MMJ初装
export default function Page() {
const [dataLoading, setDataLoading] = useState(false);
const [form] = Form.useForm();
const [visibility, setVisibility] = useState<boolean>(false);
const onFinish = (values: any) => {
console.log('表单提交:', values);
};
useEffect(() => {
let layoutInfo: any = localStorage.getItem('MMJInit');
if (layoutInfo) {
form.setFieldsValue({ ...JSON.parse(layoutInfo) })
setDataLoading(true);
}
}, [])
const props: UploadProps = {
maxCount: 1,
beforeUpload: (file: any) => {
const formData = new FormData();
formData.append('file', file);
secretInit_loadData(formData).then((res) => {
if (res?.result == "success" && res?.data.length > 0) {
message.success('加载数据成功');
form.setFieldsValue({ ...res?.data[0] })
localStorage.setItem('MMJInit', JSON.stringify(res?.data[0]));
setDataLoading(true);
} else {
message.error(res?.errorMsg);
}
})
}
};
const goData = () => {
if (!dataLoading) {
message.info('请先加载数据');
return
}
secretInit_sendData({}).then((res) => {
if (res?.result == "success") {
message.success('发送数据成功');
} else {
message.error(res?.errorMsg);
}
})
}
const clearInfo = () => {
secretInit_cleanInfo({}).then((res) => {
if (res?.result == "success") {
message.success('清空信息成功');
form.resetFields()
localStorage.removeItem('MMJInit');
} else {
message.error(res?.errorMsg);
}
})
}
return (
<div className={`${styles.params_warp} ${styles1.params_warp1}`}>
<ContentWarp text={'密码机初装'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<Form
form={form}
onFinish={onFinish}
>
<Form.Item
name="passwordInit"
label="初装密钥"
// rules={[
// { required: true, message: '请输入初装密钥' },
// ]}
>
<Input placeholder="请输入初装密钥" style={{ width: '560px' }} disabled={true} />
</Form.Item>
<Form.Item
name="algorithmParam"
label="算法参数"
// rules={[
// { required: true, message: '请输入算法参数' },
// ]}
>
<Input placeholder="请输入算法参数" style={{ width: '560px' }} disabled={true} />
</Form.Item>
<Form.Item
name="paramCode"
label="参数自检码"
// rules={[
// { required: true, message: '请输入参数自检码' },
// ]}
>
<Input placeholder="请输入参数自检码" style={{ width: '560px' }} disabled={true} />
</Form.Item>
</Form>
<div className={styles.btn_warp}>
<Upload {...props} showUploadList={false}>
<ButtonComp style={{ marginRight: 20 }} text={'加载数据'} />
</Upload>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'发送数据'} onClick={() => {
goData()
}} />
<ButtonComp type={'cancel'} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
clearInfo()
setVisibility(false)
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,83 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useRef, useState } from 'react';
import { secretInit_sendCommand } from '@/services/gql';
import ClearInfoDialog from '@/components/ClearInfoDialog';
// 网络MMJ管理 --> 密码机遥毙
export default function Page() {
const [lines, setLines] = useState<any>([]);
const [currentLineIndex, setCurrentLineIndex] = useState(0);
const [visibility, setVisibility] = useState<boolean>(false);
const outputRef: any = useRef(null);
useEffect(() => {
const timer = setInterval(() => {
if (currentLineIndex < lines.length) {
setCurrentLineIndex((prevIndex) => prevIndex + 1);
} else {
clearInterval(timer);
}
}, 300);
if (outputRef.current.scrollHeight > 330) {
outputRef.current.scrollTop = outputRef.current.scrollHeight;
}
return () => {
clearInterval(timer); // 组件卸载时清除定时器
};
}, [currentLineIndex, lines.length]);
const sending = () => {
secretInit_sendCommand({type: 2}).then((res) => {
if (res?.result == "success") {
setLines([
...lines,
'发送命令成功',
`执行密码机遥毙`,
`正在密码机遥毙中...`,
`密码机遥毙完成`
])
} else {
setLines([`${res?.errorMsg}`])
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'密码机遥毙'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<div ref={outputRef} className={styles.html_con}>
<div style={{ padding: '0px 12px' }}>
{lines.slice(0, currentLineIndex).map((line: string, index: number) => (
<p key={line} style={{ paddingTop: index == 0 ? 20 : 10 }}>{line}</p>
))}
</div>
</div>
<div className={styles.erroInfo}></div>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送命令'} onClick={() => sending()} />
<ButtonComp type={'cancel'} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
setLines([]);
setCurrentLineIndex(0);
setVisibility(false);
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,91 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useRef, useState } from 'react';
import { secretInit_getStatus } from '@/services/gql';
import { message } from 'antd';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import SaveAs from '@/components/SaveAs';
// 网络MMJ管理 --> 状态查询
export default function Page() {
const [lines, setLines] = useState<any>([]);
const [currentLineIndex, setCurrentLineIndex] = useState(0);
const [visibility, setVisibility] = useState<boolean>(false);
const outputRef: any = useRef(null);
useEffect(() => {
const timer = setInterval(() => {
if (currentLineIndex < lines.length) {
setCurrentLineIndex((prevIndex) => prevIndex + 1);
} else {
clearInterval(timer);
}
}, 300);
if (outputRef.current.scrollHeight > 330) {
outputRef.current.scrollTop = outputRef.current.scrollHeight;
}
return () => {
clearInterval(timer); // 组件卸载时清除定时器
};
}, [currentLineIndex, lines.length]);
const statusQuery = () => {
secretInit_getStatus({}).then((res) => {
if (res?.result == "success") {
let data = res?.data[0];
setLines([
...lines,
`算法参数--${data?.algorithmParam}`,
`创建时间--${data?.createTime}`,
`导入文件名--${data?.fileName}`,
`未遥毙--${data?.mmjKill}`,
`参数自检码--${data?.paramCode}`,
`初装秘钥--${data?.passwordInit}`,
`秘钥数据状态--${data?.secretDataStatus}`,
`秘钥机未遥毙--${data?.secretKill}`,
`秘钥未销毁--${data?.secretRain}`,
`更新时间--${data?.updateTime}`,
])
} else {
setLines([`${res?.errorMsg}`])
}
})
}
return (
<div className={styles.params_warp}>
<ContentWarp text={'密码机状态'}>
<div className='pd20'></div>
<div className='line'></div>
<div className='pd20 pb100'>
<div ref={outputRef} className={styles.html_con}>
<div id='messageInfo' style={{ padding: '0px 12px' }} key={currentLineIndex}>
{lines.slice(0, currentLineIndex).map((line: string, index: number) => (
<p key={index} style={{ paddingTop: index == 0 ? 20 : 10 }}>{line}</p>
))}
</div>
</div>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'状态查询'} onClick={() => { statusQuery() }} />
<SaveAs style={{ marginRight: 20}} fileName='密码机状态' domId='messageInfo'/>
<ButtonComp type={'cancel'} disabled={lines.length == 0} text={'清空信息'} onClick={() => setVisibility(true)} />
</div>
</div>
</ContentWarp>
<ClearInfoDialog
visibility={visibility}
onCancel={() => setVisibility(false)}
onOk={() => {
setLines([]);
setCurrentLineIndex(0);
setVisibility(false);
}}>
<div></div>
</ClearInfoDialog>
</div>
);
}

@ -1,32 +0,0 @@
.params_warp {
position: relative;
padding: 20px;
}
.btn_warp {
position: absolute;
bottom: 20px;
right: 20px;
display: flex;
align-items: flex-end;
justify-content: flex-end;
}
.erroInfo {
position: absolute;
bottom: 20px;
left: 20px;
height: 32px;
line-height: 32px;
color: red;
}
.html_con {
background: #FFFFFF;
box-shadow: inset 1px 1px 3px 0px rgba(35, 44, 48, 0.22);
border-radius: 1px;
border: 1px solid #E3E3E3;
width: 100%;
height: 330px;
overflow-y: scroll;
}

@ -1,32 +0,0 @@
.con_warp {
width: calc(100% - 40px);
height: calc(100% - 40px);
background-color: #fff;
font-size: 14px;
margin: 20px;
.title1 {
font-size: 18px;
font-weight: 600;
color: #191919;
}
.title2 {
font-size: 14px;
font-weight: 600;
color: #333333;
margin: 20px 0 30px 0;
}
.flex {
display: flex;
align-items: center;
margin-bottom: 20px;
div:nth-child(1) {
width: 80px;
text-align: right;
margin-right: 16px;
}
}
}

@ -1,107 +0,0 @@
import { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Upload, UploadProps, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { college_table_query, deviceInit_init, deviceInstall_deviceInstall } from '@/services/api';
import { useParams } from 'umi';
import { fileStr, sysType } from '@/utils';
interface PageProps {
}
const DeviceInstall: FC<PageProps> = ({ }) => {
const urlParams = useParams();
const [dataLoading, setDataLoading] = useState(false);
const [fileInfo, setFileInfo] = useState({
"secret": "",
"algorithm": "",
"selfInspectionCode": "",
"deviceName": "",
"initNumber": "",
"versionNumber": "",
"localNum": "",
"firmwareVersion": "",
"deviceStatus": "",
"fileName": null,
"dataInstalled": null
});
useEffect(() => {
let layoutInfo: any = localStorage.getItem('deviceInit');
if (layoutInfo) {
setFileInfo(JSON.parse(layoutInfo))
setDataLoading(true);
}
}, [])
const props: UploadProps = {
maxCount: 1,
beforeUpload: (file: any) => {
let str = sysType[urlParams?.fileType] + fileStr[urlParams?.fileType]
const formData = new FormData();
formData.append('file', file);
formData.append('sysType ', str);
deviceInit_init(formData).then((res) => {
if (res?.result == "success" && res?.data.length > 0) {
message.success('数据加载成功')
setFileInfo(res?.data[0]);
localStorage.setItem('deviceInit', JSON.stringify(res?.data[0]));
setDataLoading(true);
} else {
message.error(res?.errorMsg);
}
})
}
};
return (
<div className={styles.con_warp}>
<div style={{ padding: 30 }}>
<div className={styles.title1}></div>
<div className={styles.title2}></div>
<div className={styles.flex}>
<div></div>
<Input placeholder="请输入初装密钥" value={fileInfo.secret} disabled={true} />
</div>
<div className={styles.flex}>
<div></div>
<Input placeholder="请输入算法参数" value={fileInfo.algorithm} disabled={true} />
</div>
<div className={styles.flex}>
<div></div>
<Input placeholder="请输入参数自检码" value={fileInfo.selfInspectionCode} disabled={true} />
</div>
<div className='flex_jE' style={{ margin: '30px 0' }}>
<Upload {...props} showUploadList={false}>
<ButtonComp style={{ marginRight: 20 }} text={'数据加载'} />
</Upload>
<ButtonComp text={'数据安装'} onClick={() => {
if (!dataLoading) {
message.info('请先数据加载');
return
}
deviceInstall_deviceInstall({}).then((res) => {
if (res?.result == "success") {
message.success('数据安装成功')
} else {
message.error(res?.errorMsg);
}
})
}} />
</div>
<div className={styles.title1}></div>
<div className='mt30 mb30'>{fileInfo.deviceName || '--'}</div>
<div style={{ display: 'flex' }}>
<div style={{ marginRight: 100 }}>{fileInfo.initNumber || '--'}</div>
<div>{fileInfo.versionNumber || '--'}</div>
</div>
</div>
</div>
)
}
export default DeviceInstall

@ -1,26 +0,0 @@
.con_warp {
width: calc(100% - 40px);
height: calc(100% - 40px);
background-color: #fff;
font-size: 14px;
margin: 20px;
.title1 {
font-size: 18px;
font-weight: 600;
color: #191919;
}
.title2 {
font-size: 14px;
font-weight: 600;
color: #333333;
margin: 20px 0 30px 0;
}
.flex {
display: flex;
align-items: center;
margin-top: 30px;
}
}

@ -1,118 +0,0 @@
import { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Modal, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { college_table_query } from '@/services/api';
interface PageProps {
}
const PowerOnAuth: FC<PageProps> = ({ }) => {
const [visibility, setVisibility] = useState<boolean>(false);
const [deviceInfo, setDeviceInfo] = useState<any>({
"createTime": "",
"updateTime": "",
"secret": "",
"algorithm": "",
"selfInspectionCode": "",
"deviceName": "",
"initNumber": "",
"versionNumber": "",
"localNum": "",
"firmwareVersion": "",
"deviceStatus": "",
"fileName": null,
"dataInstalled": ""
});
const [isDeviceInit, setIsDeviceInit] = useState<boolean>(false);
useEffect(() => {
let deviceInit = localStorage.getItem('deviceInit');
if (deviceInit) {
setIsDeviceInit(true);
college_table_query({}).then((res) => {
if (res?.result == "success" && res?.data.length > 0) {
let layoutInfo: any = localStorage.getItem('powerOn');
if (!JSON.parse(layoutInfo)) {
setVisibility(true);
localStorage.setItem('powerOn', JSON.stringify({ powerOn: true }));
}
setDeviceInfo(res?.data[0]);
} else {
message.error(res?.errorMsg);
}
})
}else {
setVisibility(true);
}
}, [])
return (
<div className={styles.con_warp}>
<div style={{ padding: 30 }}>
<div className={styles.title1}></div>
<div className='mt30 mb30'>{deviceInfo.deviceName || '--'}</div>
<div className='mt30 mb30' style={{ display: 'flex' }}>
<div style={{ marginRight: 150 }}>{deviceInfo.deviceStatus || '--'}</div>
<div>{deviceInfo.initNumber || '--'}</div>
</div>
<div style={{ display: 'flex', marginBottom: 40 }}>
<div style={{ marginRight: 150 }}>{deviceInfo.firmwareVersion || '--'}</div>
<div>{deviceInfo.createTime || '--'}</div>
</div>
<div className={styles.title1}></div>
<div className={styles.flex}>
<div className='mr50'></div>
<div>
<div className='mb30'> <span className='ml50'>{'无密钥'}</span></div>
<div> <span className='ml50'>{'无密钥'}</span></div>
</div>
</div>
<div className={styles.flex}>
<div className='mr50'>VPN</div>
<div>
<div className='mb30'> <span className='ml50'>{'无密钥'}</span></div>
<div> <span className='ml50'>{'无密钥'}</span></div>
</div>
</div>
<div className={styles.flex}>
<div className='mr50'></div>
<div>
<div className='mb30'> <span className='ml50'>{'无密钥'}</span></div>
<div> <span className='ml50'>{'无密钥'}</span></div>
</div>
</div>
<div className={styles.flex}>
<div className='mr50'></div>
<div>
<div className='mb30'> <span className='ml50'>{'无密钥'}</span></div>
<div> <span className='ml50'>{'无密钥'}</span></div>
</div>
</div>
</div>
{/* 开机认证 */}
<Modal
title="开机认证"
open={visibility}
centered
width={380}
onCancel={() => setVisibility(false)}
footer={null}
maskClosable={false}
>
<div style={{ fontSize: 16 }}>
{isDeviceInit ? '开机认证成功!' :'开机认证失败,请先完成设备初装!'}
</div>
<div className='flex_jE mt20'>
<ButtonComp text={'确定'} onClick={() => setVisibility(false)} />
</div>
</Modal>
</div>
)
}
export default PowerOnAuth

@ -1,120 +0,0 @@
.initial_warp {
width: 100vw;
min-height: 100vh;
.header_warp {
height: 56px;
background: linear-gradient(180deg, #6DCFEA 0%, #3BA1CF 100%);
box-shadow: inset 0px 2px 3px 0px rgba(255, 255, 255, 0.5);
display: flex;
align-items: center;
justify-content: space-between;
font-size: 16px;
font-weight: 600;
color: #FFFFFF;
letter-spacing: 1px;
}
.main_warp {
width: 100%;
height: calc(100vh - 58px);
min-height: 600px;
display: flex;
}
.nav_title {
height: 32px;
background: #3EA4D1;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
color: #FFFFFF;
font-weight: bold;
}
.left_menu {
width: 260px;
min-width: 260px;
height: 100%;
min-height: calc(100vh - 58px);
background: #fff;
border-right: 1px solid #D8D8D8;
overflow: hidden;
overflow-y: auto;
user-select: none;
}
.right_warp {
height: calc(100% - 58px);
min-height: calc(100vh - 58px);
width: calc(100vw - 261px);
background: #F1F1F1;
overflow: hidden;
overflow-y: auto;
padding: 0;
}
}
.start_warp {
position: relative;
width: calc(100% - 40px);
height: calc(100% - 40px);
background-color: #fff;
margin: 20px;
display: flex;
align-items: center;
justify-content: center;
.start_title {
font-size: 48px;
font-weight: 600;
color: #191919;
margin-bottom: 60px;
letter-spacing: 1px;
}
.introduce {
position: absolute;
right: 40px;
bottom: 40px;
font-size: 16px;
font-weight: 500;
color: #333333;
line-height: 26px;
div:nth-child(2) {
margin: 10px 0;
}
}
}
.item1 {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
margin: 20px 0;
cursor: pointer;
}
.item1_img {
width: 60px;
height: 60px;
background-color: saddlebrown;
}
.item1_name {
width: 100%;
text-align: center;
font-size: 14px;
font-weight: 400;
color: #1A374A;
margin-top: 6px;
}

@ -1,118 +0,0 @@
import { FC, useEffect, useState } from 'react';
import { history, useLocation, useParams } from 'umi';
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 { }
const InitialSystem: FC<PageProps> = ({ }) => {
const [activeItem, setActiveItem] = useState<any>(null)
const location = useLocation();
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 = localStorage.getItem(`${urlParams?.fileType}`);
let info = installExe ? JSON.parse(installExe) : null;
const MenuList: any = {
'admin': [
{ name: '算法加载', dom: <div></div>, img: '' },
{ name: '设备初装', dom: <DeviceInstall />, img: '' },
{ name: '开机认证', dom: <PowerOnAuth />, img: '' },
{ name: '状态查询', dom: <div></div>, img: '' },
{ name: '安全销毁', dom: <div></div>, img: '' },
],
'test': [
{ name: '硬件检测', dom: <div></div>, img: '' },
{ name: '传输加解密', dom: <div></div>, img: '' },
{ name: '存储加解密', dom: <div></div>, img: '' },
{ name: '认证/验证', dom: <div></div>, img: '' },
{ name: '非对称算法', dom: <div></div>, img: '' },
]
}
useEffect(() => {
if (type && count) {
setActiveItem(MenuList[type][count])
} else {
setActiveItem(null)
}
}, [location.search])
const itemDom = (type: string, item: any, index: number) => {
return (
<div className={styles.item1} key={item.name} onClick={() => {
setActiveItem(item)
history.push(`/initialSystem/${urlParams?.fileType}?type=${type}&count=${index}`)
}}>
<div className={styles.item1_img}></div>
<div className={styles.item1_name} style={{ color: activeItem?.name == item.name ? 'red' : '' }}>
{item.name}
</div>
</div>
)
}
return (
<div className={styles.initial_warp}>
{info.installExe[14].select ? <>
{/* 头部 */}
<div className={styles.header_warp}>
<div className='ml20'></div>
<div className='mr20'></div>
</div>
{/* 底部 */}
<div className={styles.main_warp}>
{/* 左侧菜单 */}
<div className={styles.left_menu}>
<div className={styles.nav_title}></div>
{MenuList['admin'].map((item: any, index: number) => itemDom('admin', item, index))}
<div className={styles.nav_title}></div>
{MenuList['test'].map((item: any, index: number) => itemDom('test', item, index))}
</div>
{/* 右侧内容 */}
<div className={styles.right_warp}>
{
activeItem ? activeItem.dom :
<div className={styles.start_warp}>
<div className={styles.start_title}></div>
<div className={styles.introduce}>
<div></div>
<div>2.0.3</div>
<div>XXX</div>
</div>
</div>
}
</div>
</div>
</> : <Modal
title={'系统提示'}
open={visibility}
centered
width={500}
closeIcon={false}
footer={null}
maskClosable={false}
>
<div style={{padding: '20px 0'}}>
</div>
</Modal>
}
</div>
)
}
export default InitialSystem

@ -1,93 +0,0 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
interface PageProps {
open: boolean;
onCancel: (name?: string) => void;
setInstallExe: (index: number, text: string) => void;
}
const CodeDriver: FC<PageProps> = ({
open = false,
onCancel,
setInstallExe
}) => {
const [active, setActive] = useState(1);
const [percentVal, setPercentVal] = useState(0);
useEffect(() => {
if (open) setActive(1)
}, [open])
// 监听是否到安装进度条步骤
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 = () => {
setInstallExe(14,'一体化密码机驱动安装成功!')
onCancel()
}
return <>
{
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} />
<div className={styles.close} onClick={()=>{
onCancel('一体化密码机驱动安装程序')
}}></div>
{[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>}
{active == 2 && <div className={styles.pic1} style={{ top: 166, left: 85 }}></div>}
{active == 4 && <div className={styles.pic1} style={{ top: 123, left: 85 }}></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;

@ -1,114 +0,0 @@
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';
import DEV from '@/utils/env/dev';
interface PageProps {
open: boolean;
onCancel: (name?: string) => void;
setInstallExe: (index: number, text: string) => void;
}
const CodeManage: FC<PageProps> = ({
open = false,
onCancel,
setInstallExe
}) => {
const [active, setActive] = useState(1);
const [percentVal, setPercentVal] = useState(0);
const urlParams = useParams();
useEffect(() => {
if (open) setActive(1)
}, [open])
// 监听是否到安装进度条步骤
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: `${DEV.FILE_URL}/${countType[urlParams?.fileType]}`,
shortcutName: '专用核心密码综合管理系统',
shortcutURL: `${DEV.LOCAL_URL}/initialSystem/${urlParams?.fileType}`
}),
});
const data = await response.text();
setInstallExe(13, data)
onCancel()
} catch (error) {
message.error(error); // 处理请求错误
}
}
return <>
{
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} />
<div className={styles.close} onClick={()=>{
onCancel('一体化密码机管理软件')
}}></div>
{[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>}
{active == 2 && <div className={styles.pic1} style={{ top: 166, left: 85 }}></div>}
{active == 4 && <div className={styles.pic1} style={{ top: 123, left: 85 }}></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;

@ -1,170 +0,0 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
import { countType, sysType } from '@/utils';
import { useParams } from 'umi';
import DEV from '@/utils/env/dev';
interface PageProps {
open: boolean;
onCancel: (name?: string) => void;
setInstallExe: (index: number, text: string) => void;
}
const CoreArea: FC<PageProps> = ({
open = false,
onCancel,
setInstallExe
}) => {
const [active, setActive] = useState(1);
const [percentVal, setPercentVal] = useState(0);
const [userName, setUserName] = useState('root');
const [password, setPassword] = useState('');
const [serverIp, setServerIp] = useState('127.0.0.1');
const [serverPort, setServerPort] = useState('2222');
const [localPort, setLocalPort] = useState('11110');
const urlParams = useParams();
useEffect(() => {
if (open) {
setActive(1)
setPassword('')
setServerIp('127.0.0.1')
}
}, [open])
// 监听是否到安装进度条步骤
useEffect(() => {
if (active == 4) {
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: `${DEV.FILE_URL}/${countType[urlParams?.fileType]}`,
shortcutName: '核心区客户端',
shortcutURL: `${DEV.LOCAL_URL}/coreSystemEntrance/${urlParams?.fileType}?sysType=${encodeURIComponent(sysType[urlParams?.fileType] + '核心区')}`
}),
});
const data = await response.text();
setInstallExe(9, data)
onCancel()
} catch (error) {
message.error(error); // 处理请求错误
}
}
const verifyPassword = () => {
if (userName.trim().length == 0) {
message.error('请输入用户名!')
return true;
}
if (password.trim().length == 0) {
message.error('请输入密码!');
return true;
}
let sysName = localStorage.getItem(`${urlParams?.fileType}`);
if (sysName) {
let info = JSON.parse(sysName)
if (password !== info.GBasePassword) {
message.error('密码错误!');
return true;
}
}
}
return <>
{
open &&
<div className={styles.modalOverlay}>
<div className={styles.modal} style={{ width: 500, height: 460 }}>
<img src={require(`../../../assets/images/coreArea/${active}.png`)} width={500} height={460} />
<div className={styles.close} onClick={() => {
onCancel('核心区安装程序')
}}></div>
{[1, 2, 3].includes(active) && <div className={styles.title}> </div>}
{![1, 2, 3].includes(active) && <div className={styles.title1}> </div>}
{active == 1 && <div className={styles.pic1}></div>}
{active == 2 && <>
<div className={styles.pic1} style={{ left: 10 }}>GBase</div>
<div className={styles.pic1} style={{ fontSize: 12, top: 130, left: 16 }}></div>
<div className={styles.pic1} style={{ fontSize: 12, top: 180, left: 27 }}></div>
<Input disabled value={userName} onChange={(e) => { setUserName(e.target.value) }} className={styles.input1} style={{ top: 121, left: 59, width: 325 }} />
<Input value={password} onChange={(e) => { setPassword(e.target.value) }} className={styles.input2} style={{ top: 171, left: 59, width: 325 }} />
</>}
{active == 3 && <div className={styles.pic1} style={{ top: 166, left: 85 }}></div>}
{active == 5 && <div className={styles.pic1} style={{ top: 123, left: 85 }}></div>}
{active == 6 && <>
<div className={styles.pic1} style={{ left: 15, top: 45 }}>GBase</div>
<div className={styles.pic1} style={{ fontSize: 12, top: 130, left: 16 }}>ip</div>
<div className={styles.pic1} style={{ fontSize: 12, top: 180, left: 39 }}></div>
<div className={styles.pic1} style={{ fontSize: 12, top: 230, left: 50 }}></div>
<Input value={serverIp} onChange={(e) => { setServerIp(e.target.value) }} className={styles.input1} style={{ top: 121, left: 109, width: 325 }} />
<Input disabled value={serverPort} onChange={(e) => { setServerPort(e.target.value) }} className={styles.input2} style={{ top: 171, left: 109, width: 325 }} />
<Input disabled value={localPort} onChange={(e) => { setLocalPort(e.target.value) }} className={styles.input2} style={{ top: 221, left: 109, width: 325 }} />
<div className={styles.pic1} style={{ fontSize: 12, top: 427, left: 265 }}></div>
<div className={styles.pic1} style={{ fontSize: 12, top: 427, left: 343 }}></div>
<div className={styles.pic1} style={{ fontSize: 12, top: 427, left: 420 }}></div>
</>}
{[1, 2, 3].includes(active) && <div
className={styles.net}
onClick={() => {
if (active == 2 && verifyPassword()) return
setValue()
}}>
</div>}
{active == 4 && <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>}
{[5, 6].includes(active) && <div
className={styles.net}
style={{ bottom: 17, right: active == 5 ? 27 : 187 }}
onClick={() => {
active == 5 ? setValue() : installSuccess()
}}>
</div>}
</div>
</div>
}
</>
};
export default CoreArea;

@ -1,93 +0,0 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
interface PageProps {
open: boolean;
onCancel: (name?: string) => void;
setInstallExe: (index: number, text: string) => void;
}
const CodeDriver: FC<PageProps> = ({
open = false,
onCancel,
setInstallExe
}) => {
const [active, setActive] = useState(1);
const [percentVal, setPercentVal] = useState(0);
useEffect(() => {
if (open) setActive(1)
}, [open])
// 监听是否到安装进度条步骤
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 = () => {
setInstallExe(12, '密码资源输入输出设备驱动安装成功!')
onCancel()
}
return <>
{
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} />
<div className={styles.close} onClick={()=>{
onCancel('密码资源输入输出设备驱动')
}}></div>
{[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>}
{active == 2 && <div className={styles.pic1} style={{ top: 166, left: 85}}></div>}
{active == 4 && <div className={styles.pic1} style={{ top: 123, left: 85}}></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;

@ -1,166 +0,0 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
import { countType, sysType } from '@/utils';
import { useParams } from 'umi';
import DEV from '@/utils/env/dev';
interface PageProps {
open: boolean;
onCancel: (name?: string) => void;
setInstallExe: (index: number, text: string) => void;
}
const DutyArea: FC<PageProps> = ({
open = false,
onCancel,
setInstallExe
}) => {
const [active, setActive] = useState(1);
const [percentVal, setPercentVal] = useState(0);
const [userName, setUserName] = useState('root');
const [password, setPassword] = useState('');
const [serverIp, setServerIp] = useState('127.0.0.1');
const [serverPort, setServerPort] = useState('2222');
const [localPort, setLocalPort] = useState('11110');
const urlParams = useParams();
useEffect(() => {
if (open) {
setActive(1)
setPassword('')
setServerIp('127.0.0.1')
}
}, [open])
// 监听是否到安装进度条步骤
useEffect(() => {
if (active == 4) {
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: `${DEV.FILE_URL}/${countType[urlParams?.fileType]}`,
shortcutName: '执勤区客户端',
shortcutURL: `${DEV.LOCAL_URL}/coreSystemEntrance/${urlParams?.fileType}?sysType=${encodeURIComponent(sysType[urlParams?.fileType] + '执勤区')}`
}),
});
const data = await response.text();
setInstallExe(10, data)
onCancel()
} catch (error) {
message.error(error); // 处理请求错误
}
}
const verifyPassword = () => {
if (userName.trim().length == 0) {
message.error('请输入用户名!')
return true;
}
if (password.trim().length == 0) {
message.error('请输入密码!');
return true;
}
if (false) {
message.error('用户名或密码错误!');
return true;
}
}
return <>
{
open &&
<div className={styles.modalOverlay}>
<div className={styles.modal} style={{ width: 500, height: 460 }}>
<img src={require(`../../../assets/images/coreArea/${active}.png`)} width={500} height={460} />
<div className={styles.close} onClick={()=>{
onCancel('执勤区安装程序')
}}></div>
{[1, 2, 3].includes(active) && <div className={styles.title}> </div>}
{![1, 2, 3].includes(active) && <div className={styles.title1}> </div>}
{active == 1 && <div className={styles.pic1}></div>}
{active == 2 && <>
<div className={styles.pic1} style={{left: 10}}>GBase</div>
<div className={styles.pic1} style={{fontSize: 12, top: 130, left: 16}}></div>
<div className={styles.pic1} style={{fontSize: 12, top: 180, left: 27}}></div>
<Input value={userName} onChange={(e) => { setUserName(e.target.value) }} className={styles.input1} style={{top: 121, left: 59, width: 325}}/>
<Input value={password} onChange={(e) => { setPassword(e.target.value) }} className={styles.input2} style={{top: 171, left: 59, width: 325}}/>
</>}
{active == 3 && <div className={styles.pic1} style={{ top: 166, left: 85 }}></div>}
{active == 5 && <div className={styles.pic1} style={{ top: 123, left: 85 }}></div>}
{active == 6 && <>
<div className={styles.pic1} style={{left: 15, top: 45}}>GBase</div>
<div className={styles.pic1} style={{fontSize: 12, top: 130, left: 16}}>ip</div>
<div className={styles.pic1} style={{fontSize: 12, top: 180, left: 39}}></div>
<div className={styles.pic1} style={{fontSize: 12, top: 230, left: 50}}></div>
<Input value={serverIp} onChange={(e) => { setServerIp(e.target.value) }} className={styles.input1} style={{top: 121, left: 109, width: 325}}/>
<Input disabled value={serverPort} onChange={(e) => { setServerPort(e.target.value) }} className={styles.input2} style={{top: 171, left: 109, width: 325}}/>
<Input disabled value={localPort} onChange={(e) => { setLocalPort(e.target.value) }} className={styles.input2} style={{top: 221, left: 109, width: 325}}/>
<div className={styles.pic1} style={{fontSize: 12, top: 427, left: 265}}></div>
<div className={styles.pic1} style={{fontSize: 12, top: 427, left: 343}}></div>
<div className={styles.pic1} style={{fontSize: 12, top: 427, left: 420}}></div>
</>}
{[1, 2, 3].includes(active) && <div
className={styles.net}
onClick={() => {
if (active == 2 && verifyPassword()) return
setValue()
}}>
</div>}
{active == 4 && <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>}
{[5, 6].includes(active) && <div
className={styles.net}
style={{ bottom: 17, right: active == 5 ? 27 : 187}}
onClick={() => {
active == 5 ? setValue() : installSuccess()
}}>
</div>}
</div>
</div>
}
</>
};
export default DutyArea;

@ -1,87 +0,0 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
interface PageProps {
open: boolean;
onCancel: (name?: string) => void;
setInstallExe: (index: number, text: string) => void;
}
const FlashPlayer: FC<PageProps> = ({
open = false,
onCancel,
setInstallExe
}) => {
const [active, setActive] = useState(1);
const [percentVal, setPercentVal] = useState(0);
useEffect(() => {
if (open) setActive(1)
}, [open])
// 监听是否到安装进度条步骤
useEffect(() => {
if (active == 2) {
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 = () => {
setInstallExe(2, 'FlashPlayer安装成功')
onCancel()
}
return <>
{
open &&
<div className={styles.modalOverlay}>
<div className={styles.modal} style={{ width: 656, height: 403 }}>
<img src={require(`../../../assets/images/flashPlayer/${active}.png`)} width={656} height={403} />
<div className={styles.close} onClick={()=>{
onCancel('FlashPlayer9')
}}></div>
{active != 2 && <div
className={styles.f_p}
onClick={() => {
active == 1 ? setValue() : installSuccess()
}}>
</div>}
{active == 2 &&
<>
<div className={styles.percentValVal}>{percentVal}</div>
<div className={styles.progress} style={{background: 'rgba(0,1,1,0)', width: 511, height: 26, bottom: 235, left: 66}}>
<Progress style={{left: 4, top: 4}} percent={percentVal} strokeLinecap="butt" size={[511, 26]} strokeColor={'rgba(96,156,212)'} trailColor={'rgba(0,0,0,0)'} showInfo={false} />
</div>
</>}
</div>
</div>
}
</>
};
export default FlashPlayer;

@ -1,124 +0,0 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
import { useParams } from 'umi';
interface PageProps {
open: boolean;
onCancel: (name?: string) => void;
setInstallExe: (index: number, text: string) => void;
}
const GBase: FC<PageProps> = ({
open = false,
onCancel,
setInstallExe
}) => {
const urlParams = useParams();
const [active, setActive] = useState(1);
const [password, setPassword] = useState('');
const [confirmPassword, setConfirmPassword] = useState('');
const [percentVal, setPercentVal] = useState(0);
useEffect(() => {
if (open) {
setActive(1)
setPassword('')
setConfirmPassword('')
}
}, [open])
// 监听是否到安装进度条步骤
useEffect(() => {
if (active == 11) {
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 = () => {
setInstallExe(0, 'Gbase安装成功')
onCancel()
}
const verifyPassword = () => {
if (password.trim().length == 0 || confirmPassword.trim().length == 0) {
message.error('请输入密码!')
return true;
}
if (password != confirmPassword) {
message.error('两次输入的密码不相同!');
return true;
}
}
const setGBasePassword = () => {
let sysName = localStorage.getItem(`${urlParams?.fileType}`);
if (sysName) {
let info = JSON.parse(sysName);
info.GBasePassword = password;
localStorage.setItem(`${urlParams?.fileType}`, JSON.stringify(info));
}
}
return <>
{
open &&
<div className={styles.modalOverlay}>
<div className={styles.modal}>
<img src={require(`../../../assets/images/gbase/${active}.png`)} width={689} height={508} />
{active == 1 && <div className={styles.a1} onClick={() => setValue()}></div>}
{(active > 1 && active != 11) && <div className={styles.a2} onClick={() => {
if (active == 8 && verifyPassword()) return;
if (active == 8) setGBasePassword();
if (active == 12) { installSuccess(); return }
setValue()
}}></div>}
{/* 定位元素 */}
{active == 3 && <div>
<div className={styles.dian}></div>
<div className={`${styles.dian} ${styles.dian1}`}></div>
<div className={styles.last}>(N)</div>
</div>}
{active == 8 && <div>
<Input value={password} onChange={(e) => { setPassword(e.target.value) }} className={styles.input1} />
<Input value={confirmPassword} onChange={(e) => { setConfirmPassword(e.target.value) }} className={styles.input2} />
</div>}
{active == 11 && <div className={styles.progress}>
<Progress percent={percentVal} steps={41} size={[9, 19]} strokeColor={'rgb(56, 158, 13)'} trailColor={'rgba(0,0,0,0)'} showInfo={false} />
</div>}
<div className={styles.gbase_close} onClick={() => onCancel('GBase')}></div>
</div>
</div>
}
</>
};
export default GBase;

@ -1,83 +0,0 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
interface PageProps {
open: boolean;
onCancel: (name?: string) => void;
setInstallExe: (index: number, text: string) => void;
}
const HGoogleEarth: FC<PageProps> = ({
open = false,
onCancel,
setInstallExe
}) => {
const [active, setActive] = useState(1);
const [percentVal, setPercentVal] = useState(0);
const [showOk, setShowOk] = useState(false);
useEffect(() => {
if (open) setActive(1)
}, [open])
// 监听是否到安装进度条步骤
useEffect(() => {
if (active == 2) {
const interval = setInterval(() => {
setPercentVal((val) => {
const randomStep = Math.round(Math.random() * (100 / 10));
const newPercent = val + randomStep;
if (newPercent >= 100) {
clearInterval(interval);
setShowOk(true)
return 100;
}
return newPercent;
});
}, 500);
return () => clearInterval(interval);
}
}, [active])
// 安装完成后 记录安装的信息
const installSuccess = () => {
setInstallExe(6, 'HGoogleEarth安装成功')
onCancel()
}
// 设置安装步骤进度
const setValue = () => {
setActive((e) => { return e + 1 })
}
return <>
{
open &&
<div className={styles.modalOverlay}>
<div className={styles.modal} style={{ width: 'auto', height: ' auto' }}>
<img src={require(`../../../assets/images/googleEarth/${active}.jpg`)} />
<div className={styles.close} onClick={()=>{
onCancel('HGoogleEarth')
}}></div>
{active == 1 && <div className={styles.g_e} onClick={() => setValue()}></div>}
{active == 2 && <>
{showOk && <div className={styles.h_g_e} onClick={() => installSuccess()}></div>}
<div className={styles.progress} style={{ background: 'rgba(0,0,0,0)', right: 42, top: 90 }}>
<Progress percent={percentVal} steps={50} size={[8, 17]} strokeColor={'rgb(56, 158, 13)'} trailColor={'rgba(0,0,0,0)'} showInfo={false} />
</div>
</>}
</div>
</div>
}
</>
};
export default HGoogleEarth;

@ -1,88 +0,0 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
interface PageProps {
open: boolean;
onCancel: (name?: string) => void;
setInstallExe: (index: number, text: string) => void;
}
const MSXML: FC<PageProps> = ({
open = false,
onCancel,
setInstallExe
}) => {
const [active, setActive] = useState(1);
const [percentVal, setPercentVal] = useState(0);
useEffect(() => {
if (open) setActive(1)
}, [open])
// 监听是否到安装进度条步骤
useEffect(() => {
if (active == 6) {
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 = () => {
setInstallExe(3, 'MSXML安装成功')
onCancel()
}
return <>
{
open &&
<div className={styles.modalOverlay}>
<div className={styles.modal}>
<img src={require(`../../../assets/images/MSXML/${active}.jpg`)} width={689} height={508} />
<div className={styles.close} onClick={()=>{
onCancel('MSXML4')
}}></div>
{![6, 7].includes(active) && <div
className={styles.msx1}
style={active == 5 ? {width: 140, right: 170} : {}}
onClick={() => setValue()}>
</div>}
{active == 6 && <div className={styles.progress} style={{width: 482, bottom: 257, left: 59,}}>
<Progress percent={percentVal} steps={44} size={[9, 19]} strokeColor={'rgb(56, 158, 13)'} trailColor={'rgba(0,0,0,0)'} showInfo={false} />
</div>}
{active == 7 && <div
className={styles.msx1}
style={{right: 105}}
onClick={() => installSuccess()}>
</div>}
</div>
</div>
}
</>
};
export default MSXML;

@ -1,87 +0,0 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
interface PageProps {
open: boolean;
onCancel: (name?: string) => void;
setInstallExe: (index: number, text: string) => void;
}
const Net: FC<PageProps> = ({
open = false,
onCancel,
setInstallExe
}) => {
const [active, setActive] = useState(1);
const [percentVal, setPercentVal] = useState(0);
useEffect(() => {
if (open) setActive(1)
}, [open])
// 监听是否到安装进度条步骤
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 = () => {
setInstallExe(4, 'Net安装成功')
onCancel()
}
return <>
{
open &&
<div className={styles.modalOverlay}>
<div className={styles.modal} style={{width: 500, height: 460}}>
<img src={require(`../../../assets/images/net/${active}.png`)} width={500} height={460} />
<div className={styles.close} onClick={()=>{
onCancel('.NET 2.0')
}}></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 Net;

@ -1,87 +0,0 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
interface PageProps {
open: boolean;
onCancel: (name?: string) => void;
setInstallExe: (index: number, text: string) => void;
}
const NetSP1: FC<PageProps> = ({
open = false,
onCancel,
setInstallExe
}) => {
const [active, setActive] = useState(1);
const [percentVal, setPercentVal] = useState(0);
useEffect(() => {
if (open) setActive(1)
}, [open])
// 监听是否到安装进度条步骤
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 = () => {
setInstallExe(5, 'Net SP1安装成功')
onCancel()
}
return <>
{
open &&
<div className={styles.modalOverlay}>
<div className={styles.modal} style={{width: 500, height: 460}}>
<img src={require(`../../../assets/images/netsp1/${active}.png`)} width={500} height={460} />
<div className={styles.close} onClick={()=>{
onCancel('.NET 2.0 SP1')
}}></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: 223, 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 NetSP1;

@ -1,203 +0,0 @@
.modalOverlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
background: rgba(0, 0, 0, 0.5);
-webkit-user-select: none; /* Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* 标准语法 */
}
.modal {
position: relative;
width: 689px;
height: 508px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
.a1 {
position: absolute;
bottom: 8px;
left: 385px;
width: 40px;
height: 35px;
cursor: pointer;
}
.a2 {
position: absolute;
bottom: 8px;
right: 15px;
width: 115px;
height: 35px;
cursor: pointer;
z-index: 99;
}
.dian {
position: absolute;
bottom: 101px;
right: 324px;
width: 6px;
height: 6px;
border-radius: 50%;
background-color: #fff;
}
.dian1 {
bottom: 133px;
background-color: #333;
}
.last {
position: absolute;
bottom: 25px;
right: 40px;
color: #444;
font-weight: bold;
font-size: 14px;
cursor: pointer;
}
.input1, .input2 {
width: 344px;
height: 28px;
}
.input1 {
position: absolute;
bottom: 251px;
right: 32px;
}
.input2 {
position: absolute;
bottom: 208px;
right: 32px;
}
.progress {
height: 20px;
width: 450px;
position: absolute;
bottom: 20px;
right: 15px;
background-color: #DCDFE6;
display: flex;
align-items: center;
justify-content: center;
}
.g_e {
position: absolute;
width: 110px;
height: 28px;
bottom: 31px;
right: 155px;
cursor: pointer;
}
.msx1 {
position: absolute;
width: 95px;
height: 25px;
bottom: 22px;
right: 214px;
cursor: pointer;
}
.f_p {
position: absolute;
width: 170px;
height: 40px;
bottom: 30px;
right: 27px;
cursor: pointer;
}
.net {
position: absolute;
width: 74px;
height: 20px;
bottom: 19px;
right: 110px;
cursor: pointer;
}
.percentValVal {
position: absolute;
width: 100px;
text-align: right;
top: 116px;
right: 95px;
color: rgba(255, 255, 255, .8);
font-size: 13px;
}
.h_g_e {
position: absolute;
width: 110px;
height: 26px;
color: #000;
background-color: rgba(153, 153, 153, 0.2);
border: 1px solid rgb(153, 153, 153);
display: flex;
align-items: center;
justify-content: center;
bottom: 20px;
right: 38px;
font-size: 13px;
cursor: pointer;
}
.gbase_close {
position: absolute;
width: 18px;
height: 18px;
top: 3px;
right: 5px;
cursor: pointer;
}
}
.title{
position: absolute;
top: 8px;
left: 25px;
color: #fff;
font-size: 12px;
font-weight: bold;
}
.title1{
position: absolute;
top: 10px;
left: 25px;
color: #fff;
font-size: 12px;
font-weight: bold;
}
.pic1{
position: absolute;
top: 41px;
left: 70px;
font-size: 13px;
font-weight: bold;
}
.close{
width: 25px;
height: 25px;
// background: red;
position: absolute;
top: 0px;
right: 5px;
&:hover{
cursor: pointer;
}
}

@ -1,50 +0,0 @@
.exeInstall {
width: 100vw;
min-height: 100vh;
background: url('../../assets/images/bk_img.png') no-repeat;
background-size: 100% 100%;
.title_con {
width: 100%;
padding: 2.2% 0;
text-align: center;
font-size: 24px;
font-weight: 600;
color: rgba(15, 61, 123, 0.8);
}
.box {
width: 80%;
height: 4.4vh;
background: #FFFFFF;
border-radius: 4px;
border: 1px solid #EAEAEA;
margin: 0 auto;
margin-bottom: 3vh;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
&:hover {
border-color: #41B0E2;
color: #41B0E2;
}
&:last-child {
margin-bottom: 0;
}
}
.active_box {
background-color: #41B0E2;
color: #fff;
border-color: #41B0E2;
&:hover {
color: #fff;
border-color: #41B0E2;
}
}
}

@ -1,278 +0,0 @@
import { FC, useEffect, useState } from 'react';
import { history, useLocation, useParams } from "umi";
import { message } from 'antd';
import styles from './index.less';
import ContentWarp from '@/components/ContentWarp';
import ButtonComp from '@/components/ButtonComp';
import GBase from './exeDialog/GBase'
import HGoogleEarth from './exeDialog/HGoogleEarth';
import MSXML from './exeDialog/MSXML';
import FlashPlayer from './exeDialog/FlashPlayer';
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';
import DeviceDriver from './exeDialog/DeviceDriver';
const typeData = [
// 依赖程序
{ name: 'GBase', select: false },
{ name: 'GBase升级程序', select: false },
{ name: 'FlashPlayer9', select: false },
{ name: 'MSXML4', select: false },
{ name: '.NET 2.0', select: false },
{ name: '.NET 2.0 SP1', select: false },
{ name: 'HGoogleEarth', select: false },
{ name: 'MySQLServer 5.1', select: false },
{ name: 'MyODBC 3.51', select: false },
// 专用核心密码管理分系统
{ name: '核心区安装程序', select: false },
{ name: '执勤区安装程序', select: false },
{ name: '密钥格式管理安装程序', select: false },
{ name: '密码资源输入输出设备驱动', select: false },
// 一体化密码机
{ name: '一体化密码机管理软件', select: false },
{ name: '一体化密码机驱动安装程序', select: false },
// JJP903C密码钥匙
{ name: '认证服务器Install', select: false },
{ name: '用户登录组件', select: false },
]
interface PageProps { }
const InstallExe: FC<PageProps> = ({ }) => {
const urlParams = useParams();
const [listData, setListData] = useState<any[]>(typeData);
const [open1, setOpen1] = useState(false); // Gbase
const [open2, setOpen2] = useState(false); // HGoogleEarth
const [open3, setOpen3] = useState(false); // MSXML4
const [open4, setOpen4] = useState(false); // FlashPlayer
const [open5, setOpen5] = useState(false); // Net2.0
const [open6, setOpen6] = useState(false); // NET 2.0 SP1
const [open7, setOpen7] = useState(false); // 核心区安装程序
const [open8, setOpen8] = useState(false); // 执勤区安装程序
const [open9, setOpen9] = useState(false); // 密码资源输入输出设备驱动
const [open11, setOpen11] = useState(false); // 一体化密码机管理软件
const [open12, setOpen12] = useState(false); // 一体化密码机驱动安装程序
useEffect(() => {
let sysName = localStorage.getItem(`${urlParams?.fileType}`);
if (sysName) {
let info = JSON.parse(sysName)
if (info?.installExe) {
setListData(info.installExe);
} else {
info.installExe = typeData
localStorage.setItem(`${urlParams?.fileType}`, JSON.stringify(info));
setListData(typeData);
}
} else {
localStorage.setItem(`${urlParams?.fileType}`, JSON.stringify({}));
}
}, [])
const itemDom = (item: any, index: number) => {
return (
<div className={`${styles.box} ${item.select ? styles.active_box : ''}`} key={index}
onClick={() => {
const notRequireds = [
'MySQLServer 5.1',
'MyODBC 3.51',
'密钥格式管理安装程序',
'认证服务器Install',
'用户登录组件'
]
// needArr 校验依赖程序中是否有未安装的
let needArr = false;
listData.slice(0, 7).forEach((k, i) => {
if (!k.select) { needArr = true }
})
const updatedList = listData.map((data: any, key: number) => {
if (data.name === item.name) {
// 如果(选中) 或者 (不需要安装的) 就返回
if (data.select || notRequireds.includes(item.name)) return data;
// 依赖程序必安装的完成后才能点就右侧2块的内容专用核心密码管理分系统、一体化密码机、JJP903C密码钥匙)
if (key > 8 && needArr) {
message.info('请将需要的依赖程序安装完成!');
return data
}
openDialog(item.name);
return { ...data, select: !data.select };
}
return data;
});
setListData(updatedList);
}}>
{item.name}
</div>
)
}
const openDialog = (name: string) => {
switch (name) {
case 'GBase':
setOpen1(true)
break;
case 'GBase升级程序':
let sysName = localStorage.getItem(`${urlParams?.fileType}`);
if (sysName) {
let info = JSON.parse(sysName);
info.installExe[1].select = true;
localStorage.setItem(`${urlParams?.fileType}`, JSON.stringify(info));
message.success('GBase升级成功')
}
break;
case 'HGoogleEarth':
setOpen2(true)
break;
case 'MSXML4':
setOpen3(true)
break;
case 'FlashPlayer9':
setOpen4(true)
break;
case '.NET 2.0':
setOpen5(true)
break;
case '.NET 2.0 SP1':
setOpen6(true)
break;
case '核心区安装程序':
setOpen7(true)
break;
case '执勤区安装程序':
setOpen8(true)
break;
case '密码资源输入输出设备驱动':
setOpen9(true)
break;
case '一体化密码机管理软件':
setOpen11(true)
break;
case '一体化密码机驱动安装程序':
setOpen12(true)
break;
}
}
const setInstallExe = (index: number, text: string) => {
let sysName = localStorage.getItem(`${urlParams?.fileType}`);
if (sysName) {
let info = JSON.parse(sysName);
info.installExe[index].select = true;
localStorage.setItem(`${urlParams?.fileType}`, JSON.stringify(info));
message.success(text)
}
}
// 取消选中
const uncheck = (name: any) => {
if (name) {
setListData((prevListData) => {
return prevListData.map((e) => {
if (e.name === name) {
return { ...e, select: false };
}
return e;
});
});
}
};
return (
<div className={styles.exeInstall}>
<div className={styles.title_con}></div>
<div className='flex_acB_jE'>
{/* 左 */}
<ContentWarp style={{ width: '28.5%', padding: '7vh 3vh 3vh 3vh' }} text={'依赖程序'}>
{listData.slice(0, 9).map((item: any, index: number) => { return itemDom(item, index) })}
</ContentWarp>
{/* 中 */}
<ContentWarp style={{ width: '28.5%', padding: '7vh 3vh 3vh 3vh' }} text={'专用核心密码管理分系统'}>
{listData.slice(9, 13).map((item: any, index: number) => { return itemDom(item, index) })}
</ContentWarp>
{/* 右 */}
<div style={{ width: '28.5%' }}>
<ContentWarp style={{ marginBottom: '8%', padding: '7vh 3vh 3vh 3vh', height: '25.7vh' }} text={'一体化密码机'}>
{listData.slice(13, 15).map((item: any, index: number) => { return itemDom(item, index) })}
</ContentWarp>
<ContentWarp text={'JJP903C密码钥匙'} style={{ padding: '7vh 3vh 3vh 3vh', height: '25.7vh' }}>
{listData.slice(15, 17).map((item: any, index: number) => { return itemDom(item, index) })}
</ContentWarp>
</div>
</div>
<div className='flex_jE' style={{ marginTop: '3vh', paddingRight: '4.5vh' }}>
<ButtonComp text={'退出'} onClick={() => { }} />
</div>
{/* 依赖程序安装--弹窗 */}
<GBase
open={open1}
onCancel={(e) => { uncheck(e); setOpen1(false) }}
setInstallExe={(i, t) => { setInstallExe(i, t) }}
/>
<HGoogleEarth
open={open2}
onCancel={(e) => { uncheck(e); setOpen2(false) }}
setInstallExe={(i, t) => { setInstallExe(i, t) }} />
<MSXML
open={open3}
onCancel={(e) => { uncheck(e); setOpen3(false) }}
setInstallExe={(i, t) => { setInstallExe(i, t) }} />
<FlashPlayer
open={open4}
onCancel={(e) => { uncheck(e); setOpen4(false) }}
setInstallExe={(i, t) => { setInstallExe(i, t) }} />
<Net
open={open5}
onCancel={(e) => { uncheck(e); setOpen5(false) }}
setInstallExe={(i, t) => { setInstallExe(i, t) }} />
<NetSP1
open={open6}
onCancel={(e) => { uncheck(e); setOpen6(false) }}
setInstallExe={(i, t) => { setInstallExe(i, t) }} />
{/* 专用核心密码管理分系统--弹窗 */}
<CoreArea
open={open7}
onCancel={(e) => { uncheck(e); setOpen7(false) }}
setInstallExe={(i, t) => { setInstallExe(i, t) }} />
<DutyArea
open={open8}
onCancel={(e) => { uncheck(e); setOpen8(false) }}
setInstallExe={(i, t) => { setInstallExe(i, t) }} />
<DeviceDriver
open={open9}
onCancel={(e) => { uncheck(e); setOpen9(false) }}
setInstallExe={(i, t) => { setInstallExe(i, t) }} />
{/* 一体化密码机--弹窗 */}
<CodeManage
open={open11}
onCancel={(e) => { uncheck(e); setOpen11(false) }}
setInstallExe={(i, t) => { setInstallExe(i, t) }} />
<CodeDriver
open={open12}
onCancel={(e) => { uncheck(e); setOpen12(false) }}
setInstallExe={(i, t) => { setInstallExe(i, t) }} />
</div>
)
}
export default InstallExe;

@ -0,0 +1,100 @@
import { FC, useEffect, useState } from 'react';
import { history, useLocation, useParams } from 'umi';
import ButtonComp from '@/components/ButtonComp';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import NodeInitWrap from '@/components/NodeInitWrap';
import ContentWarp from '@/components/ContentWarp';
import { Button, ConfigProvider, Form, Input, Modal, Radio, Checkbox, message, Space,Select } from 'antd';
import DEV from '@/utils/env/dev';
import { countType } from '@/utils/sysType';
interface PageProps {
}
const NodeInitTool: FC<PageProps> = ({ }) => {
const urlParams = useParams();
const [authOpen, setAuthOpen] = useState(true);
const [noticeOpen,setNoticeOpen] = useState(false)
let sysInfo = localStorage.getItem(`${urlParams?.fileType}`);
let info = sysInfo ? JSON.parse(sysInfo) : null;
useEffect(() => {
installSuccess()
setAuthOpen(true)
}, [])
// 在指定的目录下安装快捷方式
const installSuccess = async () => {
try {
const response = await fetch('http://localhost:3001/createShortcut', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
mode: "cors",
body: JSON.stringify({
folderPath: `${DEV.FILE_URL}/${countType[urlParams?.fileType]}`,
shortcutName: 'MMD063',
shortcutURL: `${DEV.LOCAL_URL}/identifier/${urlParams?.fileType}`
}),
});
} catch (error) {
message.error(error); // 处理请求错误
}
}
return (
<section>
<Modal
title="XXX服务器"
open={authOpen}
centered
footer={null}
maskClosable={false}
onCancel={() => {
setAuthOpen(false)
}}
>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-start' }}>
<div style={{ marginRight: '10px' }}></div>
<div style={{ flex: 1 }}><Input /></div>
</div>
<div className='flex_jE_AC mt30' >
<ButtonComp type={'confirm'} text={'确定'} onClick={() => {
setAuthOpen(false)
setNoticeOpen(true)
}} />
</div>
</Modal>
<Modal
title="XXX服务器"
open={noticeOpen}
centered
footer={null}
maskClosable={false}
onCancel={() => {
setAuthOpen(false)
}}
>
<div>
<div style={{ marginRight: '10px' }}></div>
<div></div>
<div></div>
</div>
<div className='flex_jE_AC mt30' >
<ButtonComp type={'confirm'} text={'确定'} onClick={() => {
setNoticeOpen(false)
}} />
</div>
</Modal>
</section>
)
}
export default NodeInitTool

@ -0,0 +1,6 @@
.nav{
display:flex;
align-items: center;
margin-left:20px;
margin-top:10px;
}

@ -0,0 +1,191 @@
import { FC, useEffect, useState } from 'react';
import { history, useLocation, useParams } from 'umi';
import ButtonComp from '@/components/ButtonComp';
import { Table, message } from 'antd';
import styles from './index.less';
import CheckSelect from '@/components/CheckSelect';
import CheckInput from '@/components/CheckInput';
import DEV from '@/utils/env/dev';
import { countType } from '@/utils/sysType';
interface PageProps {
}
const MachineRegister: FC<PageProps> = ({ }) => {
const [params, setParams] = useState({
page: 1,
limit: 10,
mdepart:null, //设备使用单位
mposition:null,//设备部署地点
mstate:null,//设备使用状态
midentifer:null,// 密码实体标识
mnumber:null,//上级设备编号
});
const [clearAll, setclearAll] = useState(false) // 点击复位按钮时所有的chebox都变为false
const [result, setResult] = useState({})
const [addModalVisible,setAddModalVisible] = useState<boolean>(false) //控制新增弹窗显隐
const urlParams = useParams();
let sysInfo = localStorage.getItem(`${urlParams?.fileType}`);
let info = sysInfo ? JSON.parse(sysInfo) : null;
useEffect(() => {
installSuccess()
}, [])
// 在指定的目录下安装快捷方式
const installSuccess = async () => {
try {
const response = await fetch('http://localhost:3001/createShortcut', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
mode: "cors",
body: JSON.stringify({
folderPath: `${DEV.FILE_URL}/${countType[urlParams?.fileType]}`,
shortcutName: '客户端',
shortcutURL: `${DEV.LOCAL_URL}/machineManage/register/${urlParams?.fileType}`
}),
});
} catch (error) {
message.error(error); // 处理请求错误
}
}
const columns = [{
title: '序号',
dataIndex: 'name',
key: 'name',
ellipsis: true,
fixed: 'left',
width: 60,
render: (text: any, record: any, index: any) => {
return (
<span style={{ color: "#333" }}>{params.limit * (params.page - 1) + index + 1}</span>
)
}
}, {
title: '设备实体标识',
dataIndex: 'school_info',
key: 'school_info',
ellipsis: true,
render: (text: any, record: any, index: any) => <span style={{ color: "#333" }}>{text.name}</span>
}, {
title: '设备编号',
dataIndex: 'department_info',
key: 'department_info',
ellipsis: true,
render: (text: any, record: any, index: any) => <span style={{ color: "#333" }}>{text.name}</span>
}, {
title: '设备名称',
dataIndex: 'teacher_count',
key: 'teacher_count',
width: 90,
ellipsis: true,
render: (text: any, record: any) => <span style={{ color: '#165DFF', cursor: 'pointer' }} onClick={() => { history.push(`/colleges/${record?.school_info?.id}/statistics`) }}>{text}</span>
}, {
title: '工作状态',
dataIndex: 'student_count',
key: 'student_count',
width: 90,
ellipsis: true,
render: (text: any, record: any) => <span style={{ color: '#165DFF', cursor: 'pointer' }} onClick={() => { history.push(`/colleges/${record?.school_info?.id}/statistics`) }}>{text}</span>
}, {
title: '使用单位',
dataIndex: 'type_cn',
key: 'type_cn',
width: 100,
ellipsis: true,
render: (text: any) => <span style={{ color: "#333" }}>{text}</span>
}, {
title: '监控日志',
dataIndex: 'service_end_time',
key: 'service_end_time',
ellipsis: true,
render: (text: any, record: any, index: any) => <span title={(record?.service_start_time && record?.service_end_time) ? `${moment(record?.service_start_time).format('YYYY-MM-DD HH:mm')} - ${moment(record?.service_end_time).format('YYYY-MM-DD HH:mm')}` : '--'}
style={{ color: "#000" }}> {(record?.service_start_time && record?.service_end_time) ? `${moment(record?.service_start_time).format('YYYY-MM-DD HH:mm')} - ${moment(record?.service_end_time).format('YYYY-MM-DD HH:mm')}` : '--'}</span>
},]
// 查找
const handleSearch = () => {
console.log("params-", params)
}
// 复位
const handleClear = () => {
params.mdepart=null;
params.mposition=null;
params.mstate=null;
params.midentifer=null;
params.mnumber=null;
setParams({...params})
setclearAll(true)
}
const getList = () => {
}
// 查询条件改变时设置参数
const handleChange = (value:any,param:string) =>{
params[`${param}`]=value;
setParams({...params})
setclearAll(false)
}
return (
<section style={{ margin: '20px' }}>
<div style={{ marginTop: '20px' }}>
<Table
columns={columns}
// loading={tableLoading}
dataSource={result?.list}
pagination={{
size: 'default',
showQuickJumper: true,
showSizeChanger: true,
pageSizeOptions: ['10', '15', '50', '100', '200'],
hideOnSinglePage: true,
pageSize: params.limit,
current: params.page,
position: ["bottomRight"],
onChange: (page, pagesize) => {
params.page = page;
params.limit = pagesize;
setParams({ ...params });
getList();
},
total: result?.count,
showTotal: (total, range) => <span><span style={{ color: '#165DFF' }}> {total} </span></span>
}}
/>
</div>
<div className='flex_aiC_jB mt30 mb30'>
<div className='flex_aiC'>
<ButtonComp style={{ marginRight: 20 }} text={'第一页'} onClick={() => { }} />
<ButtonComp style={{ marginRight: 20 }} text={'上一页'} onClick={() => { }} />
<ButtonComp style={{ marginRight: 20 }} text={'下一页'} onClick={() => { }} />
<ButtonComp text={'最后一页'} onClick={() => { }} />
</div>
<div className='flex_aiC'>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'新增'} onClick={() => {setAddModalVisible(true) }} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'修改'} onClick={() => { }} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'删除'} onClick={() => { }} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'退出'} onClick={() => { }} />
</div>
</div>
</section>
)
}
export default MachineRegister

@ -0,0 +1,98 @@
import { FC, useEffect, useState } from 'react';
import { history, useLocation, useParams } from 'umi';
import ButtonComp from '@/components/ButtonComp';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import NodeInitWrap from '@/components/NodeInitWrap';
import ContentWarp from '@/components/ContentWarp';
import { Button, ConfigProvider, Form, Input, Modal, Radio, Checkbox, message, Space,Select } from 'antd';
import DEV from '@/utils/env/dev';
import { countType } from '@/utils/sysType';
interface PageProps {
}
const NodeInitTool: FC<PageProps> = ({ }) => {
const urlParams = useParams();
const [authOpen, setAuthOpen] = useState(true);
const [noticeOpen,setNoticeOpen] = useState(false)
let sysInfo = localStorage.getItem(`${urlParams?.fileType}`);
let info = sysInfo ? JSON.parse(sysInfo) : null;
useEffect(() => {
installSuccess()
setAuthOpen(true)
}, [])
// 在指定的目录下安装快捷方式
const installSuccess = async () => {
try {
const response = await fetch('http://localhost:3001/createShortcut', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
mode: "cors",
body: JSON.stringify({
folderPath: `${DEV.FILE_URL}/${countType[urlParams?.fileType]}`,
shortcutName: 'USBKEY工具软件',
shortcutURL: `${DEV.LOCAL_URL}/restore/${urlParams?.fileType}`
}),
});
} catch (error) {
message.error(error); // 处理请求错误
}
}
return (
<section>
<Modal
title="USBKEY工具软件"
open={authOpen}
centered
footer={null}
maskClosable={false}
onCancel={() => {
setAuthOpen(false)
}}
>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-start' }}>
<div style={{ marginRight: '10px' }}></div>
<div style={{ flex: 1 }}><Input /></div>
</div>
<div className='flex_jE_AC mt30' >
<ButtonComp type={'confirm'} text={'恢复出厂数据'} onClick={() => {
setAuthOpen(false)
setNoticeOpen(true)
}} />
</div>
</Modal>
<Modal
title="通知"
open={noticeOpen}
centered
footer={null}
maskClosable={false}
onCancel={() => {
setAuthOpen(false)
}}
>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-start' }}>
<div style={{ marginRight: '10px' }}></div>
</div>
<div className='flex_jE_AC mt30' >
<ButtonComp type={'confirm'} text={'确定'} onClick={() => {
setNoticeOpen(false)
}} />
</div>
</Modal>
</section>
)
}
export default NodeInitTool

@ -0,0 +1,67 @@
import { FC, useEffect, useState } from 'react';
import { history, useLocation, useParams } from 'umi';
import ButtonComp from '@/components/ButtonComp';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import NodeInitWrap from '@/components/NodeInitWrap';
import ContentWarp from '@/components/ContentWarp';
import { Button, ConfigProvider, Form, Input, Modal, Radio, Upload,UploadProps, Checkbox, message, Space,Select } from 'antd';
interface PageProps {
}
const NodeInitTool: FC<PageProps> = ({ }) => {
const [fileOpen, setFileOpen] = useState(true);
const uploadprops: UploadProps = {
maxCount: 1,
beforeUpload: (file: any) => {
const formData = new FormData();
formData.append('file', file, '11');
console.log("file--", file)
console.log("formData--", formData)
// secretInit_loadData(formData).then((res) => {
// if (res?.result == "success" && res?.data.length > 0) {
// message.success('加载数据成功');
// form.setFieldsValue({ ...res?.data[0] })
// localStorage.setItem('MMJInit', JSON.stringify(res?.data[0]));
// setDataLoading(true);
// } else {
// message.error(res?.errorMsg);
// }
// })
}
};
return (
<section>
<Modal
title="导入"
open={fileOpen}
centered
footer={null}
maskClosable={false}
onCancel={() => {
setFileOpen(false)
}}
>
<div><Radio defaultChecked></Radio></div>
<div className='mt20'>
<Upload {...uploadprops} showUploadList={false}>
<ButtonComp style={{ marginRight: 20 }} text={'选择一个文件'} />
</Upload>
</div>
<div className='flex_jE_AC mt30' >
<ButtonComp type={'confirm'} text={'确定'} onClick={() => {
setFileOpen(false)
}} />
</div>
</Modal>
</section>
)
}
export default NodeInitTool

@ -1,190 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useEffect, useState } from 'react';
import { ConfigProvider, Form, Input, Pagination, Radio, Select, Table, message } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
import { addSecretAsk, secretAskList, secretFormatList } from '@/services/my';
export default function Page() {
const [activeTab, setActiveTab] = useState(1)
const [tableData, setTableData] = useState([]);
const [form] = Form.useForm();
const formItemSty = { width: 'auto', marginBottom: 20, marginRight: 30 };
const [pageNumber, setPageNumber] = useState(1);
const [pageSize, setpageSize] = useState(10);
const [total, setTotal] = useState(0);
const [selectData, setSelectData] = useState<any>({
productName: [],
productNum: [],
publisherType: [],
carrierNumber: []
});
useEffect(() => {
form.setFieldsValue({
applyNewOld: '申请新密钥体',
})
getSelect()
}, [])
// 获取下拉框数据
const getSelect = () => {
secretFormatList({}).then((res) => {
if (res?.result == "success") {
let list = res.data[0].list;
let productName = list.map((item: any) => { return { label: item.productName, value: item.productName } });
let publisherType = list.map((item: any) => { return { label: item.publisherType, value: item.publisherType } });
let productNum = list.map((item: any) => { return { label: item.productNum, value: item.productNum } });
let carrierNumber = list.map((item: any) => { return { label: item.carrierNumber, value: item.carrierNumber } });
setSelectData({
productName,
publisherType,
productNum,
carrierNumber
})
} else {
message.error(res?.errorMsg);
}
})
}
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '申请类型', dataIndex: 'askType', key: 'askType', align: 'center' },
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '申请数量', dataIndex: 'applyNum', key: 'applyNum', align: 'center' },
{ title: '申请时间', dataIndex: 'createTime', key: 'createTime', align: 'center' },
{
title: '申请结果', key: 'name', align: 'center',
render: (a: any, b: any, c: any) => {
return <span></span>
}
},
// { title: '载体型号', dataIndex: 'carrierModel', key: 'carrierModel', align: 'center' }
]
useEffect(() => {
getList();
}, [pageNumber]);
// 获取密钥体列表
const getList = () => {
secretAskList({ pageNumber, pageSize }).then((res) => {
if (res?.result == "success") {
setTotal(res.data[0].total)
setTableData(res.data[0].list)
} else {
message.error(res?.errorMsg);
}
})
}
const onFinish = (values: any) => {
addSecretAsk(values).then((res) => {
if (res?.result == "success") {
message.success('申请成功')
pageNumber == 1 ? getList() : setPageNumber(1);
form.setFieldsValue({
applyNewOld: '申请新密钥体',
})
} else {
message.error(res?.errorMsg);
}
})
};
const pageOnChange = (pageNumber: number) => {
setPageNumber(pageNumber);
}
const onShowSizeChange = (current: any, pageSize: any) => {
setpageSize(pageSize);
getList();
}
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '密钥体申请' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<Form form={form} layout={'inline'} onFinish={onFinish} className='mt20'>
<Form.Item name="applyNewOld" label="" style={{ width: '100%', marginBottom: 20 }}>
<Radio.Group>
<Radio value={'申请新密钥体'}> </Radio>
<Radio value={'申请旧密钥体'}> </Radio>
</Radio.Group>
</Form.Item>
{/* 密钥种类字段未知 未对接字段 */}
{/* <Form.Item name="keyType" label="" style={formItemSty}>
<Select
placeholder="请选择密钥种类"
style={{ width: 260 }}
onChange={(e) => { }}
options={[
{ label: '1管理密销', value: 1 },
{ label: '2用户密钥', value: 2 },
{ label: '3用户密钥', value: 3 }
]} />
</Form.Item> */}
<Form.Item name="productName" label="产品名称" style={formItemSty} rules={[
{ required: true, message: '请选择产品名称' }
]}>
<Select style={{ width: 260 }} placeholder={'请选择产品名称'} onChange={(e) => { }} options={selectData.productName} />
</Form.Item>
<Form.Item name="productNum" label="产品编号" style={formItemSty} rules={[
{ required: true, message: '请输入产品编号' }
]}>
<Input placeholder="请输入产品编号" style={{ width: 260 }} />
</Form.Item>
<Form.Item name="askType" label="申请类型" style={formItemSty} rules={[
{ required: true, message: '请选择申请类型' }
]}>
<Select style={{ width: 260 }} placeholder={'请选择申请类型'} onChange={(e) => { }} options={selectData.publisherType} />
</Form.Item>
<div className='flex_aiC'>
<Form.Item name="applyNum" label="申请数量" style={{ marginBottom: 30 }} rules={[
{ required: true, message: '请输入申请数量' }
]}>
<Input placeholder="请输入申请数量" style={{ width: 260 }} type='number' min={1} />
</Form.Item>
<ButtonComp style={{ marginBottom: 30 }} text={'申请密钥体'} onClick={() => form.submit()} />
</div>
</Form>
<div className='mb20'></div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
{total > 0 && <div className='flex_aiC_jB mt20'>
<div> {total} </div>
<Pagination
current={pageNumber}
pageSize={pageSize}
total={total}
showQuickJumper
onChange={pageOnChange}
onShowSizeChange={onShowSizeChange}
/>
</div>}
</div>
);
}

@ -1,84 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../../GLQ/index.less';
import { Form, Input, Select, Upload, UploadProps } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { useEffect } from 'react';
export default function Page() {
const [form] = Form.useForm();
const formItemSty = { width: 'auto', marginBottom: 20, marginRight: 30 };
useEffect(() => {
form.setFieldsValue({
carrierType: 1,
carrierModel: 1,
filePath: '',
})
}, [])
const onFinish = (values: any) => {
console.log('表单提交:', values);
};
const props: UploadProps = {
maxCount: 1,
beforeUpload: (file: any) => {
console.log('file',file);
}
};
return (
<div className={styles.params_warp}>
<ContentWarp text={'管理协议加密的密文密钥体载体包封'}>
<div className='pd20' style={{ paddingBottom: 30 }}>
<Form form={form} layout={'inline'} onFinish={onFinish} className='mt20'>
<Form.Item name="carrierType" label="载体类型" style={formItemSty} rules={[{ required: true, message: '请选择载体类型' }]}>
<Select style={{ width: 260 }} placeholder="请选择载体类型" onChange={(e) => { }} options={[
{ label: '软盘', value: 1 },
{ label: '移动盘', value: 2 },
{ label: '光盘', value: 3 },
]} />
</Form.Item>
<Form.Item name="carrierModel" label="载体型号" style={formItemSty} rules={[{ required: true, message: '请选择载体型号' }]}>
<Select style={{ width: 260 }} placeholder="请选择载体型号" onChange={(e) => { }} options={[
{ label: '三寸', value: 1 }
]} />
</Form.Item>
<Form.Item name="filePath" label="文件路径" style={{ width: '80%', marginBottom: 20 }} rules={[{ required: true, message: '请选择文件路径' }]}>
<div style={{ display: 'flex' }}>
<Input style={{ width: 480 }} disabled={true}/>
<Upload {...props} showUploadList={false}>
<ButtonComp style={{ marginLeft: 20 }} type={'cancel'} text={'选择'} onClick={() => { }} />
</Upload>
</div>
</Form.Item>
</Form>
<div className='flex_jE mb20'>
<ButtonComp text={'包封'} onClick={() => form.submit()} />
</div>
<ContentWarp text={'包封结果'}>
<div className='pd20'>
<div className='flex_aiC'>
<div style={{ marginRight: 30 }}></div>
<Input placeholder="请输入产品名称" style={{ width: 260 }} disabled={true} />
<div className='ml20' style={{ marginRight: 30 }}></div>
<Input placeholder="请输入产品编号" style={{ width: 260 }} disabled={true} />
</div>
<div className='flex_aiC mt20'>
<div className='mr16' ></div>
<Input placeholder="请输入发起者标识" style={{ width: 260 }} disabled={true} />
<div className='mr16 ml20' ></div>
<Input placeholder="请输入接受者标识" style={{ width: 260 }} disabled={true} />
</div>
</div>
</ContentWarp>
</div>
</ContentWarp>
</div>
);
}

@ -1,96 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useEffect, useState } from 'react';
import { ConfigProvider, Pagination, Table, message } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
import { secretList } from '@/services/my';
export default function Page() {
const [activeTab, setActiveTab] = useState(1)
const [tableData, setTableData] = useState([]);
const [pageNumber, setPageNumber] = useState(1);
const [pageSize, setpageSize] = useState(10);
const [total, setTotal] = useState(0);
useEffect(() => {
getList();
}, [pageNumber]);
// 获取密钥体列表
const getList = () => {
secretList({ pageNumber, pageSize, isClean: 1 }).then((res) => {
if (res?.result == "success") {
setTotal(res.data[0].total)
setTableData(res.data[0].list)
} else {
message.error(res?.errorMsg);
}
})
}
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '载体型号', dataIndex: 'applyModel', key: 'applyModel', align: 'center' },
{ title: '数量', dataIndex: 'number', key: 'number', align: 'center' },
{ title: '来源', dataIndex: 'source', key: 'source', align: 'center' },
// { title: '当前时间', dataIndex: 'createTime', key: 'createTime', align: 'center' },
{ title: '当前状态', dataIndex: 'currentStatus', key: 'currentStatus', align: 'center' },
{ title: '导入时间', dataIndex: 'importTime', key: 'importTime', align: 'center' }
]
const pageOnChange = (pageNumber: number) => {
setPageNumber(pageNumber);
}
const onShowSizeChange = (current: any, pageSize: any) => {
setpageSize(pageSize);
getList();
}
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '已清理密钥体列表' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<div className='flex_jE mb20'>
<ButtonComp type={'cancel'} text={'刷新'} onClick={() => {
pageNumber == 1 ? getList() : setPageNumber(1);
}} />
</div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
{total > 0 && <div className='flex_aiC_jB mt20'>
<div> {total} </div>
<Pagination
current={pageNumber}
pageSize={pageSize}
total={total}
showQuickJumper
onChange={pageOnChange}
onShowSizeChange={onShowSizeChange}
/>
</div>}
</div>
);
}

@ -1,37 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useState } from 'react';
import { ConfigProvider, Table } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
export default function Page() {
const [activeTab, setActiveTab] = useState(1)
const [tableData, setTableData] = useState([]);
const columns: any = [
{ title: '密钥体大代号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '密钥体子代号', dataIndex: 'name', key: 'name', align: 'center' }
]
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '密钥体代号对照表' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
</div>
);
}

@ -1,98 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useState } from 'react';
import { ConfigProvider, Form, Input, Radio, Select, Table } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
export default function Page() {
const [activeTab, setActiveTab] = useState(1)
const [tableData, setTableData] = useState([]);
const columns: any = [
{ title: '配发类型', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '操作员', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '操作时间', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '三联单号', dataIndex: 'name', key: 'name', align: 'center' }
]
const columns1: any = [
{ title: '密码种类', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '套数', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '编号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '载体数量', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '载体编号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '备注', dataIndex: 'name', key: 'name', align: 'center' }
]
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '密钥体配发三联单' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<div className='flex_aiC mb20' >
<div style={{ marginRight: 12 }}></div>
<Select style={{ width: 260 }} placeholder="请选择发往单位" onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
</div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<div className='flex_jE mt20 mb20'>
<ButtonComp text={'添加'} onClick={() => { }} />
</div>
<div className='mb20' style={{ height: 1, background: '#EDEDED' }}></div>
<div className='mb20 flex_aiC' >
<div style={{ marginRight: 12 }}></div>
<Select style={{ width: 260, marginRight: 20 }} placeholder="请选择发往单位" onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
<ButtonComp text={'查询'} onClick={() => { }} />
</div>
<div className='flex_aiC_jB mb20 mt20'>
<div> --</div>
<div>--</div>
</div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns1}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<div className='mb20 mt20 flex_aiC' >
<div style={{ marginRight: 12 }}></div>
<Input placeholder="请输入发往单位" style={{ width: 260, marginRight: 50 }} />
<div>--</div>
</div>
<div className='flex_aiC_jB mt20'>
<ButtonComp text={'添加'} onClick={() => { }} />
<div className='flex_jE'>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'移出'} onClick={() => { }} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'制作'} onClick={() => { }} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'预览'} onClick={() => { }} />
<ButtonComp type={'cancel'} text={'打印'} onClick={() => { }} />
</div>
</div>
</div>
);
}

@ -1,294 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useEffect, useState } from 'react';
import { ConfigProvider, DatePicker, Form, Input, Pagination, Select, Table, message } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
import { mailIssueList, secretFormatList, secretList, secretUpdateStatus } from '@/services/my';
export default function Page() {
const [activeTab, setActiveTab] = useState(1)
const [tableData, setTableData] = useState([]);
const [pageNumber, setPageNumber] = useState(1);
const [pageSize, setpageSize] = useState(10);
const [total, setTotal] = useState(0);
const [form] = Form.useForm();
const [selectData, setSelectData] = useState<any>({
productName: [],
publisherType: []
});
const [tableData1, setTableData1] = useState([]);
const [pageNumber1, setPageNumber1] = useState(1);
const [pageSize1, setpageSize1] = useState(10);
const [total1, setTotal1] = useState(0);
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
const formItemSty = { width: '31%', marginBottom: 20, marginRight: 30 };
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{(pageNumber - 1) * pageSize + c + 1}</span>;
},
},
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '载体型号', dataIndex: 'applyModel', key: 'applyModel', align: 'center' },
{ title: '数量', dataIndex: 'number', key: 'number', align: 'center' },
{ title: '当前状态', dataIndex: 'currentStatus', key: 'currentStatus', align: 'center' },
{ title: '导入时间', dataIndex: 'importTime', key: 'importTime', align: 'center' },
]
const columns1: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{(pageNumber1 - 1) * pageSize1 + c + 1}</span>;
},
},
// { title: '编号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '密钥分发平台名称', dataIndex: 'keyDistPlatformName', key: 'keyDistPlatformName', align: 'center' },
{ title: '密钥分发平台实体标识', dataIndex: 'keyDistPlatformEntity', key: 'keyDistPlatformEntity', align: 'center' },
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productCode', key: 'productCode', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '载体型号', dataIndex: 'applyModel', key: 'applyModel', align: 'center' },
{ title: '总数量', dataIndex: 'total', key: 'total', align: 'center' },
{ title: '已下载数量', dataIndex: 'downloadNum', key: 'downloadNum', align: 'center' },
{ title: '授权', dataIndex: 'empower', key: 'empower', align: 'center' },
{ title: '优先级', dataIndex: 'priority', key: 'priority', align: 'center' },
{ title: '结束时间', dataIndex: 'overTime', key: 'overTime', align: 'center' },
{ title: '通知标志', dataIndex: 'notificationFlag', key: 'notificationFlag', align: 'center' },
{ title: '删除标志', dataIndex: 'deleteFlag', key: 'deleteFlag', align: 'center' }
]
useEffect(() => {
form.setFieldsValue({
productName: '',
carrierType: '',
carrierNumber: '',
orderDirection: '',
})
getSelect()
}, [])
// 获取下拉框数据
const getSelect = () => {
secretFormatList({}).then((res) => {
if (res?.result == "success") {
let list = res.data[0].list;
let productName = list.map((item: any) => { return { label: item.productName, value: item.productName } });
let carrierType = list.map((item: any) => { return { label: item.carrierType, value: item.carrierType } });
let carrierNumber = list.map((item: any) => { return { label: item.carrierNumber, value: item.carrierNumber } });
setSelectData({
productName: [{ label: '全部', value: '' }, ...productName],
carrierType: [{ label: '全部', value: '' }, ...carrierType],
carrierNumber: [{ label: '全部', value: '' }, ...carrierNumber],
})
} else {
message.error(res?.errorMsg);
}
})
}
useEffect(() => {
getList();
setSelectedRowKeys([])
}, [pageNumber]);
useEffect(() => {
getList1();
}, [pageNumber1]);
// 获取密钥体列表
const getList = () => {
let data = form.getFieldsValue()
let params = {
'secretImport.productName': data.productName,
'secretImport.productNum': data.productNum,
'secretImport.carrierType': data.carrierType,
'secretImport.carrierNumber': data.carrierNumber,
}
secretList({ pageNumber, pageSize, ...params }).then((res) => {
if (res?.result == "success") {
setTotal(res.data[0].total)
setTableData(res.data[0].list)
} else {
message.error(res?.errorMsg);
}
})
}
// 获取密钥体邮箱任务列表
const getList1 = () => {
mailIssueList({ pageNumber: pageNumber1, pageSize: pageSize1 }).then((res) => {
if (res?.result == "success") {
setTotal1(res.data[0].total)
setTableData1(res.data[0].list)
} else {
message.error(res?.errorMsg);
}
})
}
const pageOnChange = (pageNumber: number) => {
setPageNumber(pageNumber);
}
const onShowSizeChange = (current: any, pageSize: any) => {
setpageSize(pageSize);
getList();
}
const onFinish = () => {
pageNumber == 1 ? getList() : setPageNumber(1);
};
const sending = (type: number) => {
if (selectedRowKeys.length == 0) {
message.info('请勾选数据');
return
}
let promises = selectedRowKeys.map(item => {
return secretUpdateStatus({ id: item, type }).then((res) => {
if (res?.result === "success") {
return 1;
} else {
message.error(res?.errorMsg);
return 0;
}
});
});
Promise.all(promises).then(results => {
let recordCount = results.reduce((acc: any, val) => acc + val, 0);
if (recordCount === selectedRowKeys.length) {
message.success('配发成功');
pageNumber1 == 1 ? getList1() : setPageNumber1(1);
setSelectedRowKeys([]);
}
});
}
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '向邮箱配发密钥体' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<Form form={form} layout={'inline'} onFinish={onFinish} className='mt20'>
<Form.Item name="productName" label="产品名称" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择产品名称" onChange={(e) => { }} options={selectData.productName} />
</Form.Item>
<Form.Item name="carrierType" label="载体类型" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择载体类型" onChange={(e) => { }} options={selectData.carrierType} />
</Form.Item>
{/* <Form.Item name="aaa" label="" style={formItemSty}>
<Input placeholder="请输入可下载数量" style={{ width: 260 }} />
</Form.Item> */}
<Form.Item name="productNum" label="产品编号" style={formItemSty}>
<Input placeholder="请输入产品编号" style={{ width: 260 }} />
</Form.Item>
<div className='flex_aiC'>
<Form.Item name="carrierNumber" label="载体型号" style={{ marginBottom: 30 }}>
<Select style={{ width: 260 }} placeholder="请选择载体型号" onChange={(e) => { }} options={selectData.carrierNumber} />
</Form.Item>
<ButtonComp style={{ marginBottom: 30 }} text={'查询'} onClick={() => form.submit()} />
</div>
{/* <Form.Item name="aaa" label="&nbsp;&nbsp;&nbsp;&nbsp;" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择下载授权" onChange={(e) => { }} options={[
{ label: '已授权', value: '已授权' },
{ label: '未授权', value: '未授权' }
]} />
</Form.Item>
<Form.Item name="systemName" label="目的系统" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择目的系统" onChange={(e) => { }} options={[]} />
</Form.Item>
<Form.Item name="quantity" label="配发数量" style={formItemSty}>
<Input placeholder="请输入配发数量" style={{ width: 260 }} type='number' min={0} />
</Form.Item>
<Form.Item name="aaa" label="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;优先级" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择优先级" onChange={(e) => { }} options={[
{ label: '普通', value: '普通' },
{ label: '特急', value: '特急' },
{ label: '紧急', value: '紧急' }
]} />
</Form.Item>
<Form.Item name="aaa" label="结束时间" style={formItemSty}>
<DatePicker style={{ width: 260 }} />
</Form.Item> */}
</Form>
<div className='mb20 flex_aiC_jB'>
<div></div>
<ButtonComp type={'cancel'} text={'配发'} onClick={() => sending(2)} />
</div>
<Table
scroll={{ x: 800, y: 41 * 11 }}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
rowSelection={{
selectedRowKeys,
onChange: (selectedKeys: any) => {
setSelectedRowKeys(selectedKeys);
}
}}
/>
{total > 0 && <div className='flex_aiC_jB mt20'>
<div> {total} </div>
<Pagination
current={pageNumber}
pageSize={pageSize}
total={total}
showQuickJumper
onChange={pageOnChange}
onShowSizeChange={onShowSizeChange}
/>
</div>}
<div className='mt30 mb20 flex_aiC_jB'>
<div></div>
</div>
<Table
scroll={{ x: 800, y: 41 * 11 }}
pagination={false}
bordered
columns={columns1}
dataSource={tableData1}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
{total1 > 0 && <div className='flex_aiC_jB mt20'>
<div> {total1} </div>
<Pagination
current={pageNumber1}
pageSize={pageSize1}
total={total1}
showQuickJumper
onChange={(pageNumber: number) => {
setPageNumber1(pageNumber);
}}
onShowSizeChange={(current: any, pageSize: any) => {
setpageSize1(pageSize);
getList1();
}}
/>
</div>}
</div>
);
}

@ -1,111 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useEffect, useState } from 'react';
import { ConfigProvider, Pagination, Table, Upload, UploadProps, message } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
import { secretFormatImport, secretFormatList } from '@/services/my';
export default function Page() {
const [activeTab, setActiveTab] = useState(1)
const [tableData, setTableData] = useState([]);
const [pageNumber, setPageNumber] = useState(1);
const [pageSize, setpageSize] = useState(10);
const [total, setTotal] = useState(0);
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{(pageNumber - 1) * pageSize + c + 1}</span>;
},
},
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '载体型号', dataIndex: 'carrierNumber', key: 'carrierNumber', align: 'center' },
{ title: '管理文件名', dataIndex: 'managerFilename', key: 'managerFilename', align: 'center' }
]
useEffect(() => {
getList();
}, [pageNumber]);
// 获取密钥体格式列表
const getList = () => {
secretFormatList({ pageNumber, pageSize }).then((res) => {
if (res?.result == "success") {
setTotal(res.data[0].total)
setTableData(res.data[0].list)
} else {
message.error(res?.errorMsg);
}
})
}
const pageOnChange = (pageNumber: number) => {
setPageNumber(pageNumber);
}
const onShowSizeChange = (current: any, pageSize: any) => {
setpageSize(pageSize);
getList();
}
const props: UploadProps = {
maxCount: 1,
beforeUpload: (file: any) => {
const formData = new FormData();
formData.append('file', file);
secretFormatImport(formData).then((res) => {
if (res?.result == "success") {
message.success('导入成功');
getList()
} else {
message.error(res?.errorMsg);
}
})
}
};
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '密钥体格式导入和删除' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<div className='mb20 flex_aiC_jB'>
<div></div>
<div style={{ display: 'flex' }}>
<Upload {...props} showUploadList={false}>
<ButtonComp style={{ marginRight: 20 }} text={'密钥体格式导入'} />
</Upload>
<ButtonComp type={'delete'} text={'删除'} onClick={() => { }} />
</div>
</div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
{total > 0 && <div className='flex_aiC_jB mt20'>
<div> {total} </div>
<Pagination
current={pageNumber}
pageSize={pageSize}
total={total}
showQuickJumper
onChange={pageOnChange}
onShowSizeChange={onShowSizeChange}
/>
</div>}
</div>
);
}

@ -1,213 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useEffect, useState } from 'react';
import { ConfigProvider, Form, Pagination, Select, Table, message } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
import { secretFormatList, secretPublisher } from '@/services/my';
export default function Page() {
const [activeTab, setActiveTab] = useState(1)
const [tableData, setTableData] = useState([]);
const [form] = Form.useForm();
const [pageNumber, setPageNumber] = useState(1);
const [pageSize, setpageSize] = useState(10);
const [total, setTotal] = useState(0);
const [selectData, setSelectData] = useState<any>({
productName: [],
carrierType: [],
carrierNumber: [],
publisherType: []
});
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
const [allRowKeys, setAllRowKeys] = useState([]);
const formItemSty = { width: 'auto', marginBottom: 20, marginRight: 30 };
useEffect(() => {
initForm()
getSelect()
}, [])
const initForm = () => {
form.setFieldsValue({
productName: '',
carrierType: '',
carrierNumber: '',
publisherType: ''
})
}
// 获取下拉框数据
const getSelect = () => {
secretFormatList({}).then((res) => {
if (res?.result == "success") {
let list = res.data[0].list;
let productName = list.map((item: any) => { return { label: item.productName, value: item.productName } });
let carrierType = list.map((item: any) => { return { label: item.carrierType, value: item.carrierType } });
let carrierNumber = list.map((item: any) => { return { label: item.carrierNumber, value: item.carrierNumber } });
let publisherType = list.map((item: any) => { return { label: item.publisherType, value: item.publisherType } });
setSelectData({
productName: [{ label: '全部', value: '' }, ...productName],
carrierType: [{ label: '全部', value: '' }, ...carrierType],
carrierNumber: [{ label: '全部', value: '' }, ...carrierNumber],
publisherType: [{ label: '全部', value: '' }, ...publisherType]
})
} else {
message.error(res?.errorMsg);
}
})
}
useEffect(() => {
getList();
setSelectedRowKeys([])
setAllRowKeys([])
}, [pageNumber]);
// 获取密钥体格式列表
const getList = () => {
let data = form.getFieldsValue()
let params = {
'secretFormat.productName': data.productName,
'secretFormat.carrierType': data.carrierType,
'secretFormat.carrierNumber': data.carrierNumber,
'secretFormat.publisherType': data.publisherType
}
secretFormatList({ pageNumber, pageSize, ...params }).then((res) => {
if (res?.result == "success") {
setTotal(res.data[0].total)
setTableData(res.data[0].list)
const keys = res.data[0].list.map((item: any) => item?.id);
setAllRowKeys(keys);
} else {
message.error(res?.errorMsg);
}
})
}
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '管理系统名称', dataIndex: 'systemName', key: 'systemName', align: 'center' },
{ title: '管理系统实体标识', dataIndex: 'shstemId', key: 'shstemId', align: 'center' },
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '发布状态', dataIndex: 'currentStatus', key: 'currentStatus', align: 'center' },
{ title: '当前状态', dataIndex: 'currentStatus', key: 'currentStatus', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '载体型号', dataIndex: 'carrierNumber', key: 'carrierNumber', align: 'center' }
]
const onFinish = () => {
pageNumber == 1 ? getList() : setPageNumber(1);
};
const pageOnChange = (pageNumber: number) => {
setPageNumber(pageNumber);
}
const onShowSizeChange = (current: any, pageSize: any) => {
setpageSize(pageSize);
getList();
}
const sending = () => {
if (selectedRowKeys.length == 0) {
message.info('请勾选需要发布的数据');
return
}
let promises = selectedRowKeys.map(item => {
return secretPublisher({ id: item }).then((res) => {
if (res?.result === "success") {
return 1;
} else {
message.error(res?.errorMsg);
return 0;
}
});
});
Promise.all(promises).then(results => {
let recordCount = results.reduce((acc: any, val) => acc + val, 0);
if (recordCount === selectedRowKeys.length) {
message.success('发布成功');
initForm();
onFinish();
setSelectedRowKeys([]);
}
});
}
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '密钥体格式发布' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<Form form={form} layout={'inline'} onFinish={onFinish} className='mt20'>
<Form.Item name="productName" label="产品名称" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择产品名称" onChange={(e) => { }} options={selectData.productName} />
</Form.Item>
<Form.Item name="carrierType" label="载体类型" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择载体类型" onChange={(e) => { }} options={selectData.carrierType} />
</Form.Item>
<Form.Item name="carrierNumber" label="载体型号" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择载体型号" onChange={(e) => { }} options={selectData.carrierNumber} />
</Form.Item>
<Form.Item name="publisherType" label="发布方式" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择发布方式" onChange={(e) => { }} options={selectData.publisherType} />
</Form.Item>
{/* <Form.Item name="aaa" label="" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择目的系统" onChange={(e) => { }} options={[]} />
</Form.Item> */}
</Form>
<div className='flex_jE' style={{ marginBottom: 30 }}>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'发布'} onClick={() => sending()} />
<ButtonComp text={'查询'} onClick={() => form.submit()} />
</div>
<div className='mb20 flex_aiC_jB'>
<div></div>
<ButtonComp type={'cancel'} text={'全部'} onClick={() => setSelectedRowKeys(allRowKeys)} />
</div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
rowSelection={{
selectedRowKeys,
onChange: (selectedKeys: any) => {
setSelectedRowKeys(selectedKeys);
}
}}
/>
{total > 0 && <div className='flex_aiC_jB mt20'>
<div> {total} </div>
<Pagination
current={pageNumber}
pageSize={pageSize}
total={total}
showQuickJumper
onChange={pageOnChange}
onShowSizeChange={onShowSizeChange}
/>
</div>}
</div>
);
}

@ -1,312 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useEffect, useState } from 'react';
import { Button, ConfigProvider, Form, Input, Modal, Pagination, Select, Table, Upload, UploadProps, message } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
import { secretBodyImport, secretFormatList, secretList, secretUpdateSecret } from '@/services/my';
export default function Page() {
const [activeTab, setActiveTab] = useState(1);
const [tableData, setTableData] = useState([]);
const [visibility, setVisibility] = useState(false);
const [pageNumber, setPageNumber] = useState(1);
const [pageSize, setpageSize] = useState(10);
const [total, setTotal] = useState(0);
const [fileInfo, setFileInfo] = useState(null);
const [productNumber, setProductNumber] = useState('');
const [speed, setSpeed] = useState(1);
const [selectData, setSelectData] = useState<any>({
productName: [],
carrierType: [],
carrierNumber: [],
publisherType: [],
orderDirection: []
});
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
const [allRowKeys, setAllRowKeys] = useState([]);
const [form] = Form.useForm();
const formItemSty = { width: 'auto', marginBottom: 20, marginRight: 30 };
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{(pageNumber - 1) * pageSize + c + 1}</span>;
},
},
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '载体型号', dataIndex: 'applyModel', key: 'applyModel', align: 'center' },
{ title: '数量', dataIndex: 'number', key: 'number', align: 'center' },
// { title: '来源', dataIndex: 'orderDirection', key: 'orderDirection', align: 'center' },
{ title: '当前状态', dataIndex: 'currentStatus', key: 'currentStatus', align: 'center' },
{ title: '导入时间', dataIndex: 'importTime', key: 'importTime', align: 'center' },
]
useEffect(() => {
initForm()
getSelect()
}, [])
const initForm = () => {
form.setFieldsValue({
productName: '',
carrierType: '',
carrierNumber: '',
// orderDirection: '',
})
}
// 获取下拉框数据
const getSelect = () => {
secretFormatList({ pageNumber, pageSize }).then((res) => {
if (res?.result == "success") {
let list = res.data[0].list;
let productName = list.map((item: any) => { return { label: item.productName, value: item.productName } });
let carrierType = list.map((item: any) => { return { label: item.carrierType, value: item.carrierType } });
let carrierNumber = list.map((item: any) => { return { label: item.carrierNumber, value: item.carrierNumber } });
setSelectData({
productName: [{ label: '全部', value: '' }, ...productName],
carrierType: [{ label: '全部', value: '' }, ...carrierType],
carrierNumber: [{ label: '全部', value: '' }, ...carrierNumber],
})
} else {
message.error(res?.errorMsg);
}
})
}
useEffect(() => {
getList();
setSelectedRowKeys([])
setAllRowKeys([])
}, [pageNumber]);
// 获取密钥体列表
const getList = () => {
let data = form.getFieldsValue()
let params = {
'secretImport.productName': data.productName,
'secretImport.carrierType': data.carrierType,
'secretImport.carrierNumber': data.carrierNumber,
}
secretList({ pageNumber, pageSize, ...params}).then((res) => {
if (res?.result == "success") {
setTotal(res.data[0].total)
setTableData(res.data[0].list)
const keys = res.data[0].list.map((item: any) => item?.id);
setAllRowKeys(keys);
} else {
message.error(res?.errorMsg);
}
})
}
const pageOnChange = (pageNumber: number) => {
setPageNumber(pageNumber);
}
const onShowSizeChange = (current: any, pageSize: any) => {
setpageSize(pageSize);
getList();
}
const onFinish = () => {
pageNumber == 1 ? getList() : setPageNumber(1);
};
const props: UploadProps = {
maxCount: 1,
beforeUpload: (file: any) => {
setFileInfo(file);
}
};
const sending = (type: number) => {
if (selectedRowKeys.length == 0) {
message.info('请勾选数据');
return
}
let promises = selectedRowKeys.map(item => {
return secretUpdateSecret({ id: item, type }).then((res) => {
if (res?.result === "success") {
return 1;
} else {
message.error(res?.errorMsg);
return 0;
}
});
});
let str: any = { 1: '删除成功', 2: '还原成功', 3: '清理成功'}
Promise.all(promises).then(results => {
let recordCount = results.reduce((acc: any, val) => acc + val, 0);
if (recordCount === selectedRowKeys.length) {
message.success(`${str[type]}`);
initForm();
onFinish();
setSelectedRowKeys([]);
}
});
}
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '密钥体导入' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<Form form={form} layout={'inline'} onFinish={onFinish} className='mt20'>
{/* <Form.Item name="keyType" label="" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择密钥种类" onChange={(e) => { }} options={[
{ label: '全部', value: '' },
{ label: '1管理密销', value: 1 },
{ label: '2用户密钥', value: 2 },
{ label: '3用户密钥', value: 3 }
]} />
</Form.Item> */}
<Form.Item name="productName" label="产品名称" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择产品名称" onChange={(e) => { }} options={selectData.productName} />
</Form.Item>
<Form.Item name="carrierType" label="载体类型" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择载体类型" onChange={(e) => { }} options={selectData.carrierType} />
</Form.Item>
<Form.Item name="carrierNumber" label="载体型号" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择载体型号" onChange={(e) => { }} options={selectData.carrierNumber} />
</Form.Item>
{/* <Form.Item name="orderDirection" label="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择来源" onChange={(e) => { }} options={[
{ label: '全部', value: '' },
{ label: '来自产品1', value: 1 },
{ label: '来自产品2', value: 2 },
]} />
</Form.Item> */}
</Form>
<div className='flex_jE' style={{ marginBottom: 30 }}>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'导入'} onClick={() => {
setSpeed(1);
setFileInfo(null);
setProductNumber('');
setVisibility(true)
}} />
<ButtonComp text={'查询'} onClick={() => form.submit()} />
</div>
<div className='mb20 flex_aiC_jB'>
<div></div>
<ButtonComp type={'cancel'} text={'全部'} onClick={() => setSelectedRowKeys(allRowKeys)} />
</div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
rowSelection={{
selectedRowKeys,
onChange: (selectedKeys: any) => {
setSelectedRowKeys(selectedKeys);
}
}}
/>
{total > 0 && <div className='flex_aiC_jB mt20'>
<div> {total} </div>
<Pagination
current={pageNumber}
pageSize={pageSize}
total={total}
showQuickJumper
onChange={pageOnChange}
onShowSizeChange={onShowSizeChange}
/>
</div>}
<div className='flex_jE mt20'>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'删除'} onClick={() => sending(1)} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'还原'} onClick={() => sending(2)} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'清理'} onClick={() => sending(3)} />
<ButtonComp type={'cancel'} text={'载体输出'} onClick={() => { message.info('建设中')}} />
</div>
<Modal
title="请确认或者输入产品编号"
open={visibility}
centered
width={550}
onCancel={() => setVisibility(false)}
footer={null}>
<div>
{
speed == 1 &&
<div className='mb20 mt10'>
<div>
<span style={{ marginRight: 4, color: 'red' }}>*</span>
<Input placeholder="请输入产品编号" style={{ width: 300, marginLeft: 16 }}
value={productNumber}
onChange={(e) => setProductNumber(e.target.value)}
/>
</div>
</div>
}
{
speed == 2 &&
<div className='mb30'>
<div className='mb10'></div>
<div className='flex_aiC'>
<span style={{ marginRight: 4, color: 'red' }}>*</span>
<Input style={{ width: 300, marginLeft: 16 }} value={fileInfo?.name || ''} disabled={true} />
<Upload {...props} showUploadList={false}>
<ButtonComp style={{ marginLeft: 20 }} text={'选择'} onClick={() => { }} />
</Upload>
</div>
</div>
}
{speed == 3 && <div></div>}
{speed == 4 && <div></div>}
</div>
<div className='flex_jE mt20'>
<ButtonComp style={{ marginRight: 20 }} text={'确定'} onClick={() => {
switch (speed) {
case 1:
if (!productNumber.trim()) { message.error('产品编号不能为空'); return }
setSpeed(2)
break;
case 2:
const formData = new FormData();
formData.append('file', fileInfo);
formData.append('productNumber', `${productNumber}`);
secretBodyImport(formData).then((res) => {
if (res?.result == "success") {
setSpeed(3)
} else {
message.error(res?.errorMsg);
}
})
break;
case 3:
setSpeed(4)
break;
case 4:
onFinish()
setVisibility(false)
break;
}
}} />
<ButtonComp type='cancel' text={'取消'} onClick={() => setVisibility(false)} />
</div>
</Modal>
</div>
);
}

@ -1,81 +0,0 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../../GLQ/index.less';
import { Form, Input, Select, Upload, UploadProps } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { useEffect } from 'react';
export default function Page() {
const [form] = Form.useForm();
const formItemSty = { width: 'auto', marginBottom: 20, marginRight: 30 };
const typeList = [
{ label: '软盘', value: 1 },
{ label: '移动盘', value: 2 },
{ label: 'IC卡', value: 3 },
{ label: '光盘', value: 4 },
{ label: '芯片', value: 5 },
{ label: '密钥枪', value: 6 },
{ label: 'iButton', value: 7 },
{ label: '密码注入器', value: 8 }
]
useEffect(() => {
form.setFieldsValue(() => {
})
}, [])
const onFinish = (values: any) => {
console.log('表单提交:', values);
};
const props: UploadProps = {
maxCount: 1,
beforeUpload: (file: any) => {
console.log('file', file);
}
};
return (
<div className={styles.params_warp}>
<ContentWarp text={'明文密钥体载体包封'}>
<div className='pd20 pb100'>
<Form form={form} layout={'inline'} onFinish={onFinish} className='mt20'>
<Form.Item name="aaa" label="产品名称" style={formItemSty} rules={[{ required: true, message: '请输入产品名称' }]}>
<Input placeholder="请输入产品名称" style={{ width: 260 }} />
</Form.Item>
<Form.Item name="aaa" label="产品编号" style={formItemSty} rules={[{ required: true, message: '请输入产品编号' }]}>
<Input placeholder="请输入产品编号" style={{ width: 260 }} />
</Form.Item>
<Form.Item name="aaa" label="载体编号" style={formItemSty} rules={[{ required: true, message: '请选输入载体编号' }]}>
<Input placeholder="请输入载体编号" style={{ width: 260 }} />
</Form.Item>
<Form.Item name="aaa" label="载体类型" style={formItemSty} rules={[{ required: true, message: '请选择载体类型' }]}>
<Select style={{ width: 260 }} placeholder="请选择载体类型" onChange={(e) => { }} options={typeList} />
</Form.Item>
<Form.Item name="aaa" label="载体型号" style={formItemSty} rules={[{ required: true, message: '请选择载体型号' }]}>
<Select style={{ width: 260 }} placeholder="请选择载体型号" onChange={(e) => { }} options={[{ label: '三寸', value: 1 }]} />
</Form.Item>
<Form.Item name="filePath" label="文件路径" style={{ width: '80%', marginBottom: 20 }} rules={[{ required: true, message: '请选择文件路径' }]}>
<div style={{ display: 'flex' }}>
<Input style={{ width: 480 }} disabled={true} />
<Upload {...props} showUploadList={false}>
<ButtonComp style={{ marginLeft: 20 }} type={'cancel'} text={'选择'} onClick={() => { }} />
</Upload>
</div>
</Form.Item>
<Form.Item name="aaa" label="载体位置" style={formItemSty} rules={[{ required: true, message: '请选择载体位置' }]}>
<Select style={{ width: 260 }} placeholder="请选择载体位置" onChange={(e) => { }} options={[
{ label: '1', value: 1 },
{ label: '2', value: 2 }
]} />
</Form.Item>
</Form>
<div className={styles.btn_warp}>
<ButtonComp text={'包封'} onClick={() => form.submit()} />
</div>
</div>
</ContentWarp>
</div>
);
}

@ -1,110 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useState } from 'react';
import { ConfigProvider, Form, Radio, Select, Table } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
export default function Page() {
const [activeTab, setActiveTab] = useState(1)
const [tableData, setTableData] = useState([]);
const columns: any = [
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '来源', dataIndex: 'orderDirection', key: 'orderDirection', align: 'center' },
{ title: '操作员', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '导入时间', dataIndex: 'importTime', key: 'importTime', align: 'center' },,
{ title: '是否制作接', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '发来单位', dataIndex: 'name', key: 'name', align: 'center' }
]
const columns1: any = [
{ title: '密码种类', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '套数', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '编号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '载体种类', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '载体数量', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '载体编号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '操作员', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '导入时间', dataIndex: 'importTime', key: 'importTime', align: 'center' },,
{ title: '备注', dataIndex: 'name', key: 'name', align: 'center' }
]
const [form] = Form.useForm();
const formItemSty = { width: 'auto', marginBottom: 20, marginRight: 30 };
const onFinish = (values: any) => {
console.log('表单提交:', values);
};
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '密钥体接收情况单' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<div className='mb20 flex_aiC_jB'>
<Radio.Group>
<Radio value="1" style={{ marginRight: 100 }}> </Radio>
<Radio value="2"> </Radio>
</Radio.Group>
<div>xxxxxxx</div>
</div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<div className='flex_jE mt20 mb20'>
<ButtonComp text={'添加'} onClick={() => { }} />
</div>
<div className='mb20' style={{ height: 1, background: '#EDEDED' }}></div>
<Form form={form} layout={'inline'} onFinish={onFinish} className='mt20' style={{ position: 'relative' }}>
<Form.Item name="aaa" label="密钥种类" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择密钥种类" onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
</Form.Item>
<Form.Item name="aaa" label="产品名称" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择产品名称" onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
</Form.Item>
<Form.Item name="aaa" label="产品编号" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择产品编号" onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
</Form.Item>
<Form.Item name="aaa" label="申请类型" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择申请类型" onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
</Form.Item>
<div style={{ position: 'absolute', right: 0, bottom: '20px' }}>
<ButtonComp text={'查询'} onClick={() => { }} />
</div>
</Form>
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns1}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<div className='flex_jE mt20'>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'移出'} onClick={() => form.submit()} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'制作'} onClick={() => form.submit()} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'预览'} onClick={() => form.submit()} />
<ButtonComp type={'cancel'} text={'打印'} onClick={() => form.submit()} />
</div>
</div>
);
}

@ -1,274 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useEffect, useState } from 'react';
import { ConfigProvider, Form, Input, Pagination, Select, Table, message } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
import { belowIssueList, secretFormatList, secretList, secretUpdateStatus } from '@/services/my';
export default function Page() {
const [activeTab, setActiveTab] = useState(1)
const [tableData, setTableData] = useState([]);
const [pageNumber, setPageNumber] = useState(1);
const [pageSize, setpageSize] = useState(10);
const [total, setTotal] = useState(0);
const [form] = Form.useForm();
const [tableData1, setTableData1] = useState([]);
const [pageNumber1, setPageNumber1] = useState(1);
const [pageSize1, setpageSize1] = useState(10);
const [total1, setTotal1] = useState(0);
const [selectData, setSelectData] = useState<any>({
productName: [],
productNum: [],
publisherType: []
});
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
const formItemSty = { width: 'auto', marginBottom: 20, marginRight: 30 };
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{(pageNumber - 1) * pageSize + c + 1}</span>;
},
},
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '载体型号', dataIndex: 'applyModel', key: 'applyModel', align: 'center' },
{ title: '数量', dataIndex: 'number', key: 'number', align: 'center' },
{ title: '当前状态', dataIndex: 'currentStatus', key: 'currentStatus', align: 'center' },
{ title: '导入时间', dataIndex: 'importTime', key: 'importTime', align: 'center' },
]
const columns1: any = [
{ title: '配发类型', dataIndex: 'issueStatus', key: 'name', align: 'center' },
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '载体型号', dataIndex: 'applyModel', key: 'applyModel', align: 'center' },
{ title: '配发管理系统名称', dataIndex: 'distManagerName', key: 'distManagerName', align: 'center' },
{ title: '配发管理系统实体标识', dataIndex: 'distManagerIdentifer', key: 'distManagerIdentifer', align: 'center' },
{ title: '配发数量', dataIndex: 'issueNum', key: 'issueNum', align: 'center' },
{ title: '配发状态', dataIndex: 'issueStatus', key: 'issueStatus', align: 'center' },
{ title: '删除标志', dataIndex: 'delNotes', key: 'delNotes', align: 'center' },
{ title: '配发操作时间', dataIndex: 'subOperateTime', key: 'subOperateTime', align: 'center' },
{ title: '申请管理系统名称', dataIndex: 'applyManagerSysName', key: 'applyManagerSysName', align: 'center' },
{ title: '申请管理系统实体标识', dataIndex: 'applyManagerModelName', key: 'applyManagerModelName', align: 'center' },
{ title: '申请数量', dataIndex: 'quantity', key: 'quantity', align: 'center' },
{ title: '申请时间', dataIndex: 'quantityTime', key: 'quantityTime', align: 'center' },
{ title: '配发编号', dataIndex: 'distCode', key: 'distCode', align: 'center' },
{ title: '申请编号', dataIndex: 'applyCode', key: 'applyCode', align: 'center' }
]
useEffect(() => {
form.setFieldsValue({
productName: '',
carrierType: '',
carrierNumber: '',
orderDirection: '',
})
getSelect()
}, [])
// 获取下拉框数据
const getSelect = () => {
secretFormatList({}).then((res) => {
if (res?.result == "success") {
let list = res.data[0].list;
let productName = list.map((item: any) => { return { label: item.productName, value: item.productName } });
let carrierType = list.map((item: any) => { return { label: item.carrierType, value: item.carrierType } });
let carrierNumber = list.map((item: any) => { return { label: item.carrierNumber, value: item.carrierNumber } });
setSelectData({
productName: [{ label: '全部', value: '' }, ...productName],
carrierType: [{ label: '全部', value: '' }, ...carrierType],
carrierNumber: [{ label: '全部', value: '' }, ...carrierNumber]
})
} else {
message.error(res?.errorMsg);
}
})
}
useEffect(() => {
getList();
setSelectedRowKeys([])
}, [pageNumber]);
useEffect(() => {
getList1();
}, [pageNumber1]);
// 获取密钥体列表
const getList = () => {
let data = form.getFieldsValue()
let params = {
'secretImport.productName': data.productName,
'secretImport.productNum': data.productNum,
'secretImport.carrierType': data.carrierType,
'secretImport.carrierNumber': data.carrierNumber,
}
secretList({ pageNumber, pageSize, ...params }).then((res) => {
if (res?.result == "success") {
setTotal(res.data[0].total)
setTableData(res.data[0].list)
} else {
message.error(res?.errorMsg);
}
})
}
// 获取向下级配发列表
const getList1 = () => {
belowIssueList({ pageNumber: pageNumber1, pageSize: pageSize1 }).then((res) => {
if (res?.result == "success") {
setTotal1(res.data[0].total)
setTableData1(res.data[0].list)
} else {
message.error(res?.errorMsg);
}
})
}
const pageOnChange = (pageNumber: number) => {
setPageNumber(pageNumber);
}
const onShowSizeChange = (current: any, pageSize: any) => {
setpageSize(pageSize);
getList();
}
const onFinish = () => {
pageNumber == 1 ? getList() : setPageNumber(1);
};
const sending = (type: number) => {
if (selectedRowKeys.length == 0) {
message.info('请勾选数据');
return
}
let promises = selectedRowKeys.map(item => {
return secretUpdateStatus({ id: item, type }).then((res) => {
if (res?.result === "success") {
return 1;
} else {
message.error(res?.errorMsg);
return 0;
}
});
});
Promise.all(promises).then(results => {
let recordCount = results.reduce((acc: any, val) => acc + val, 0);
if (recordCount === selectedRowKeys.length) {
message.success('配发成功');
pageNumber1 == 1 ? getList1() : setPageNumber1(1);
setSelectedRowKeys([]);
}
});
}
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '在线向下级管理系统配发密钥体' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<Form form={form} layout={'inline'} onFinish={onFinish} className='mt20'>
<Form.Item name="productName" label="产品名称" style={formItemSty}>
<Select style={{ width: 260 }} placeholder="请选择产品名称" onChange={(e) => { }} options={selectData.productName} />
</Form.Item>
<Form.Item name="productNum" label="产品编号" style={formItemSty}>
<Input placeholder="载体类型" style={{ width: 260 }} />
</Form.Item>
<Form.Item name="carrierType" label="载体类型" style={formItemSty}>
<Select style={{ width: 260 }} placeholder={'请选择载体类型'} onChange={(e) => { }} options={selectData.carrierType} />
</Form.Item>
<div className='flex_aiC'>
<Form.Item name="carrierNumber" label="载体型号" style={{ marginBottom: 30 }}>
<Select style={{ width: 260 }} placeholder={'请选择载体型号'} onChange={(e) => { }} options={selectData.carrierNumber} />
</Form.Item>
<ButtonComp style={{ marginBottom: 30 }} text={'查询'} onClick={() => form.submit()} />
</div>
{/* <div className='flex_aiC'>
<Form.Item name="number" label="申请编号" style={{ marginBottom: 30 }}>
<Input placeholder="请输入申请编号" style={{ width: 260 }} placeholder={'请输入'} />
</Form.Item>
<ButtonComp style={{ marginBottom: 30 }} text={'查询'} onClick={() => form.submit()} />
</div> */}
</Form>
<div className='mb20 flex_aiC_jB'>
<div></div>
<ButtonComp type={'cancel'} text={'配发'} onClick={() => sending(1)} />
</div>
<Table
scroll={{ x: 800, y: 41 * 11 }}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
rowSelection={{
selectedRowKeys,
onChange: (selectedKeys: any) => {
setSelectedRowKeys(selectedKeys);
}
}}
/>
{total > 0 && <div className='flex_aiC_jB mt20'>
<div> {total} </div>
<Pagination
current={pageNumber}
pageSize={pageSize}
total={total}
showQuickJumper
onChange={pageOnChange}
onShowSizeChange={onShowSizeChange}
/>
</div>}
<div className='mt30 mb20 flex_aiC_jB'>
<div></div>
</div>
<Table
scroll={{ x: 800, y: 41 * 11 }}
pagination={false}
bordered
columns={columns1}
dataSource={tableData1}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
{total1 > 0 && <div className='flex_aiC_jB mt20'>
<div> {total1} </div>
<Pagination
current={pageNumber1}
pageSize={pageSize1}
total={total1}
showQuickJumper
onChange={(pageNumber: number) => {
setPageNumber1(pageNumber);
}}
onShowSizeChange={(current: any, pageSize: any) => {
setpageSize1(pageSize);
getList1();
}}
/>
</div>}
</div>
);
}

@ -1,301 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useEffect, useState } from 'react';
import { ConfigProvider, Form, Input, Pagination, Radio, Select, Table, message } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
import { privateIssueList, secretFormatList, secretList, secretUpdateStatus } from '@/services/my';
export default function Page() {
const [activeTab, setActiveTab] = useState(1)
const [form] = Form.useForm();
const [selectData, setSelectData] = useState<any>({
productName: [],
publisherType: []
});
// 密钥体
const [tableData, setTableData] = useState([]);
const [pageNumber, setPageNumber] = useState(1);
const [pageSize, setpageSize] = useState(10);
const [total, setTotal] = useState(0);
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
// 配发
const [tableData1, setTableData1] = useState([]);
const [pageNumber1, setPageNumber1] = useState(1);
const [pageSize1, setpageSize1] = useState(10);
const [total1, setTotal1] = useState(0);
const [selectedPFKeys, setSelectedPFKeys] = useState([]);
const [allRowKeys, setAllRowKeys] = useState([]);
// 执勤
const [tableData2, setTableData2] = useState([]);
const [pageNumber2, setPageNumber2] = useState(1);
const [pageSize2, setpageSize2] = useState(10);
const [total2, setTotal2] = useState(0);
const formItemSty = { width: 'auto', marginBottom: 20, marginRight: 30 };
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{(pageNumber - 1) * pageSize + c + 1}</span>;
},
},
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '载体型号', dataIndex: 'applyModel', key: 'applyModel', align: 'center' },
{ title: '数量', dataIndex: 'number', key: 'number', align: 'center' },
{ title: '当前状态', dataIndex: 'currentStatus', key: 'currentStatus', align: 'center' },
{ title: '导入时间', dataIndex: 'importTime', key: 'importTime', align: 'center' },
]
const columns1: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '配发管理系统名称', dataIndex: 'distManagerName', key: 'distManagerName', align: 'center' },
{ title: '配发管理系统实体标识', dataIndex: 'distManagerIdentifer ', key: 'distManagerIdentifer', align: 'center' },
{ title: '操作时间', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '同步状态', dataIndex: 'name', key: 'name', align: 'center' }
]
const columns2: any = [
{ title: '执勤区名称', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '执勤区标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '所属网络', dataIndex: 'name', key: 'name', align: 'center' },
{ title: 'IP地址', dataIndex: 'name', key: 'name', align: 'center' },
]
useEffect(() => {
form.setFieldsValue({
productName: '',
carrierType: '',
carrierNumber: '',
orderDirection: '',
})
getSelect()
}, [])
// 获取下拉框数据
const getSelect = () => {
secretFormatList({}).then((res) => {
if (res?.result == "success") {
let list = res.data[0].list;
let productName = list.map((item: any) => { return { label: item.productName, value: item.productName } });
setSelectData({
productName: [{ label: '全部', value: '' }, ...productName]
})
} else {
message.error(res?.errorMsg);
}
})
}
useEffect(() => {
getList();
setSelectedRowKeys([])
}, [pageNumber]);
useEffect(() => {
getList1();
setSelectedPFKeys([])
}, [pageNumber1]);
// 获取密钥体列表
const getList = () => {
let data = form.getFieldsValue()
let params = {
'secretImport.productName': data.productName,
'secretImport.productNum': data.productNum,
}
secretList({ pageNumber, pageSize, ...params }).then((res) => {
if (res?.result == "success") {
setTotal(res.data[0].total);
setTableData(res.data[0].list);
} else {
message.error(res?.errorMsg);
}
})
}
const pageOnChange = (pageNumber: number) => {
setPageNumber(pageNumber);
}
const onShowSizeChange = (current: any, pageSize: any) => {
setpageSize(pageSize);
getList();
}
const sending = (type: number) => {
if (selectedRowKeys.length == 0) {
message.info('请勾选数据');
return
}
let promises = selectedRowKeys.map(item => {
return secretUpdateStatus({ id: item, type }).then((res) => {
if (res?.result === "success") {
return 1;
} else {
message.error(res?.errorMsg);
return 0;
}
});
});
Promise.all(promises).then(results => {
let recordCount = results.reduce((acc: any, val) => acc + val, 0);
if (recordCount === selectedRowKeys.length) {
message.success('配发成功');
pageNumber1 == 1 ? getList1() : setPageNumber1(1);
setSelectedRowKeys([]);
}
});
}
const onFinish = () => {
pageNumber == 1 ? getList() : setPageNumber(1);
};
// 获取向专用密码管理系统配发列表
const getList1 = () => {
privateIssueList({ pageNumber: pageNumber1, pageSize: pageSize1 }).then((res) => {
if (res?.result == "success") {
setTotal1(res.data[0].total)
setTableData1(res.data[0].list)
const keys = res.data[0].list.map((item: any) => item?.id);
setAllRowKeys(keys);
} else {
message.error(res?.errorMsg);
}
})
}
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '向专用密码管理系统配发密钥体' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<div style={{ display: 'flex' }}>
<ButtonComp type={'special'} text={'向专用密码管理系统配发密钥体'} onClick={() => { }} />
</div>
<div className='flex_aiC mt20'>
<Form form={form} layout={'inline'} onFinish={onFinish} className='mt20'>
{/* <Form.Item name="aaa" label="" style={formItemSty}>
<Select style={{ width: 260 }} placeholder={'请选择目的系统'} onChange={(e) => { }} options={[]} />
</Form.Item> */}
<Form.Item name="productName" label="产品名称" style={formItemSty}>
<Select style={{ width: 260 }} placeholder={'请选择产品名称'} onChange={(e) => { }} options={selectData.productName} />
</Form.Item>
<div className='flex_aiC'>
<Form.Item name="productNum" label="产品编号" style={{ marginBottom: 30 }}>
<Input placeholder="请输入产品编号" style={{ width: 260 }} />
</Form.Item>
{/* <ButtonComp style={{ marginBottom: 30 }} text={'添加'} onClick={() => form.submit()} /> */}
<ButtonComp style={{ marginBottom: 30 }} text={'查询'} onClick={() => form.submit()} />
</div>
</Form>
</div>
<div className='mb20 flex_aiC_jB'>
<div></div>
<ButtonComp type={'cancel'} text={'配发'} onClick={() => sending(3)} />
</div>
<Table
scroll={{ x: 800, y: 41 * 11 }}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
rowSelection={{
selectedRowKeys,
onChange: (selectedKeys: any) => {
setSelectedRowKeys(selectedKeys);
}
}}
/>
{total > 0 && <div className='flex_aiC_jB mt20'>
<div> {total} </div>
<Pagination
current={pageNumber}
pageSize={pageSize}
total={total}
showQuickJumper
onChange={pageOnChange}
onShowSizeChange={onShowSizeChange}
/>
</div>}
<div className='mt30 mb20 flex_aiC_jB'>
<div></div>
<ButtonComp type={'cancel'} text={'全部'} onClick={() => {setSelectedPFKeys(allRowKeys)}} />
</div>
<Table
scroll={tableData1.length > 0 ? { y: 41 * 5 } : {}}
pagination={false}
bordered
columns={columns1}
dataSource={tableData1}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
rowSelection={{
selectedRowKeys: selectedPFKeys,
onChange: (selectedKeys: any) => {
setSelectedPFKeys(selectedKeys);
}
}}
/>
{total1 > 0 && <div className='flex_aiC_jB mt20'>
<div> {total1} </div>
<Pagination
current={pageNumber1}
pageSize={pageSize1}
total={total1}
showQuickJumper
onChange={(pageNumber: number) => {
setPageNumber1(pageNumber);
}}
onShowSizeChange={(current: any, pageSize: any) => {
setpageSize1(pageSize);
getList1();
}}
/>
</div>}
<div className='mt30 mb20 flex_aiC_jB'>
<div></div>
<ButtonComp text={'同步'} onClick={() => { message.info('建设中') }} />
</div>
<Table
scroll={tableData2.length > 0 ? { y: 41 * 5 } : {}}
pagination={false}
bordered
columns={columns2}
dataSource={tableData2}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
</div>
);
}

@ -1,62 +0,0 @@
import styles from '../../../GLQ/index.less';
import { useState } from 'react';
import { ConfigProvider, Modal, Table } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
export default function Page() {
const [tableData, setTableData] = useState([]);
const [visibility, setVisibility] = useState(false);
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '管理盘号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '密钥种类', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '当前版本号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '导入时间', dataIndex: 'importTime', key: 'importTime', align: 'center' },,
{ title: '数据长度', dataIndex: 'name', key: 'name', align: 'center' }
]
return (
<div className={`${styles.params_warp}`}>
<ButtonComp type={'special'} text={'管理系统管理盘数据维护'} onClick={() => { }} />
<div className='flex_aiC mt20 mb20'>
<ButtonComp text={'数据导入'} onClick={() => setVisibility(true)} />
</div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 10 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<Modal
title="xx部一体化对称密码管理系统"
open={visibility}
centered
width={500}
onCancel={() => setVisibility(false)}
footer={null}>
<div>
<div>1 </div>
<div>2 </div>
<div>3 </div>
</div>
<div className='flex_jE mt20'>
<ButtonComp text={'确定'} onClick={() => { }} />
</div>
</Modal>
</div>
);
}

@ -1,108 +0,0 @@
import styles from '../../../GLQ/index.less';
import { useState } from 'react';
import { ConfigProvider, Modal, Select, Table } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
export default function Page() {
const [tableData, setTableData] = useState([]);
const [visibility, setVisibility] = useState(false);
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '管理实体标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '000标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: 'IP地址', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '密钥种类名称', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '密钥类型', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '使用区/备用区', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '安装方式', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '启用日期', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '终止日期', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '密钥套号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '协同管理标志', dataIndex: 'name', key: 'name', align: 'center' }
]
const columns1: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '设备名称', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '管理实体标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '310标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: 'IP地址', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '设备型号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '应用系统', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '管理代理', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '设备状态', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '协同管理标志', dataIndex: 'name', key: 'name', align: 'center' }
]
return (
<div className={`${styles.params_warp}`}>
<ButtonComp type={'special'} text={'密钥配置查询'} onClick={() => { }} />
<ButtonComp style={{ margin: '20px 0 ' }} text={'选择设备'} onClick={() => setVisibility(true)} />
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<Modal
title="选择设备"
open={visibility}
centered
width={1100}
onCancel={() => setVisibility(false)}
footer={null}>
<div className='flex_aiC mb20 pt10'>
<div className='mr16'></div>
<Select style={{ width: 120, marginRight: 20 }} placeholder={'请选择检索项'} onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
<div className='mr16'></div>
<Select style={{ width: 120, marginRight: 20 }} placeholder={'请选择检索项'} onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
<div className='mr16'></div>
<Select style={{ width: 120, marginRight: 20 }} placeholder={'请选择设备型号'} onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
<div className='mr16'></div>
<Select style={{ width: 120, marginRight: 20 }} placeholder={'请选择管理代理'} onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
<ButtonComp text={'查找'} onClick={() => { }} />
</div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 8 } : {}}
pagination={false}
bordered
columns={columns1}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<div className='flex_jE mt20'>
<ButtonComp style={{ marginRight: 20 }} text={'确定'} onClick={() => { }} />
<ButtonComp type='cancel' text={'取消'} onClick={() => { }} />
</div>
</Modal>
</div>
);
}

@ -1,117 +0,0 @@
import styles from '../../../GLQ/index.less';
import { useState } from 'react';
import { ConfigProvider, DatePicker, Modal, Radio, Select, Table } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
export default function Page() {
const [tableData, setTableData] = useState([]);
const [visibility, setVisibility] = useState(false);
const columns: any = [
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '装配情况', dataIndex: 'name', key: 'name', align: 'center' }
]
const columns1: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '设备名称', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '管理实体标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '000标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '使用期/备用区', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '分发状态', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '安装方式', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '启用日期', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '套号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '输出日期', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '协同管理标志', dataIndex: 'name', key: 'name', align: 'center' }
]
return (
<div className={`${styles.params_warp}`}>
<ButtonComp type={'special'} text={'管理密钥装配'} onClick={() => { }} />
<div className='flex_aiC mt20 mb20'>
<Radio.Group>
<Radio value="1" style={{ marginRight: 100 }}> 使 </Radio>
<Radio value="2"> </Radio>
</Radio.Group>
</div>
<div className='flex_aiC mt20 mb20'>
<div className='mr16'></div>
<Select style={{ width: 260, marginRight: 20 }} placeholder={'请选择密钥类型'} onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
<div className='mr16'></div>
<Select style={{ width: 260, marginRight: 20 }} placeholder={'请选择所属网络'} onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
<div className='mr16'></div>
<DatePicker style={{ width: 260 }} />
</div>
<div className='mb10'></div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 5 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<div className='flex_jE mt20'>
<ButtonComp text={'装配'} onClick={() => setVisibility(true)} />
</div>
<div className='mb10 mt30'></div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 5 } : {}}
pagination={false}
bordered
columns={columns1}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<div className='flex_jE mt20'>
<ButtonComp type='cancel' style={{ marginRight: 20 }} text={'过滤'} onClick={() => { }} />
<ButtonComp type='cancel' style={{ marginRight: 20 }} text={'载体输出'} onClick={() => { }} />
<ButtonComp type='cancel' text={'下载到邮箱'} onClick={() => { }} />
</div>
<Modal
title="xx部一体化对称密码管理系统"
open={visibility}
centered
width={500}
onCancel={() => setVisibility(false)}
footer={null}>
<div>
<div className='mb20'>
1
<div className='ml20'>:</div>
<div className='ml20'> ZY310</div>
<div className='ml20'> 8151</div>
<div className='ml20'> 20231011</div>
</div>
<div>2 </div>
</div>
<div className='flex_jE mt20'>
<ButtonComp text={'确定'} onClick={() => { }} />
</div>
</Modal>
</div>
);
}

@ -1,61 +0,0 @@
import styles from '../../../GLQ/index.less';
import { useState } from 'react';
import { ConfigProvider, Select, Table } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
export default function Page() {
const [tableData, setTableData] = useState([]);
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '设备名称', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '管理实体标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '000标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '密钥种类名称', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '安装方式', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '输出日期', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '协同管理标志', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '是否下载到邮箱', dataIndex: 'name', key: 'name', align: 'center' }
]
return (
<div className={`${styles.params_warp}`}>
<ButtonComp type={'special'} text={'专用密钥装配'} onClick={() => { }} />
<div className='flex_aiC mt20 mb20'>
<div className='mr16'></div>
<Select style={{ width: 260, marginRight: 20 }} onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
<div className='mr16'></div>
<Select style={{ width: 260 }} onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
</div>
<div className='mt30 mb30'></div>
<div className='mb10'></div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 8 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<div className='flex_jE mt20'>
<ButtonComp type='cancel' style={{ marginRight: 20 }} text={'过滤'} onClick={() => { }} />
<ButtonComp type='cancel' style={{ marginRight: 20 }} text={'载体输出'} onClick={() => { }} />
<ButtonComp type='cancel' text={'下载到邮箱'} onClick={() => { }} />
</div>
</div>
);
}

@ -1,54 +0,0 @@
.center_w {
display: flex;
justify-content: center;
flex-wrap: wrap;
align-content: center;
}
.btn {
position: relative;
width: 40px;
height: 40px;
background: linear-gradient(180deg, #87CDEE 0%, #69C0E9 34%, #7ECDF2 51%, #56B9E6 63%, #81D7FE 100%);
box-shadow: 0px 2px 4px 0px #BDCDE2;
border-radius: 4px;
border: 1px solid rgba(76, 106, 118, 0.22);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
margin: 0 15%;
}
.no_btn {
width: 40px;
height: 40px;
background: #E2F3FA;
box-shadow: 0px 2px 4px 0px rgba(81,84,90,0.5);
border-radius: 4px;
border: 1px solid rgba(171, 207, 223, 0.22);
cursor: not-allowed;
.sjx {
border-left: 12px solid #9FB5BC;
}
.sjx1 {
border-left: 0px solid #9FB5BC;
border-right: 12px solid #9FB5BC;
}
}
.sjx {
width: 0;
height: 0;
border-left: 12px solid #fff;
border-bottom: 12px solid transparent;
border-top: 12px solid transparent;
transition: all 0.15s ease-in;
}
.sjx1 {
border-left: 0px solid #fff;
border-right: 12px solid #fff;
}

@ -1,91 +0,0 @@
import styles from '../../../GLQ/index.less';
import styles1 from './index.less';
import { useState } from 'react';
import { ConfigProvider, Select, Table } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
export default function Page() {
const [tableData, setTableData] = useState([]);
const [tableData1, setTableData1] = useState([]);
let number = {
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
}
const columns: any = [
number,
{ title: '设备名称', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '管理实体标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '设备型号', dataIndex: 'name', key: 'name', align: 'center' }
]
const columns1: any = [
number,
{ title: '设备名称', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '管理实体标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '设备型号', dataIndex: 'name', key: 'name', align: 'center' }
]
return (
<div className={`${styles.params_warp}`}>
<ButtonComp type={'special'} text={'管理系统管理盘数据维护'} onClick={() => { }} />
<div className='flex_aiC mt20'>
<div className='mr16'></div>
<Select style={{ width: 260 }} onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
</div>
<div className='flex_aiC mt20 mb20'>
<ButtonComp text={'数据导入'} onClick={() => { }} />
</div>
<div className='flex_jB'>
{/* 左侧 */}
<div style={{ width: '43%' }}>
<div className='mb20' style={{ color: '#0087DA' }}></div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 10 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
</div>
{/* 中间 */}
<div className={`${styles1.center_w} mb20`}>
<div className={`${styles1.btn} ${tableData.length == 0 ? styles1.no_btn : ''}`} style={{ margin: 40 }}>
<div className={styles1.sjx} />
</div>
<div className={`${styles1.btn} ${tableData1.length == 0 ? styles1.no_btn : ''}`}>
<div className={`${styles1.sjx} ${styles1.sjx1}`} />
</div>
</div>
{/* 底部 */}
<div style={{ width: '43%' }}>
<div className='mb20' style={{ color: '#0087DA' }}></div>
<Table
scroll={tableData1.length > 0 ? { y: 41 * 10 } : {}}
pagination={false}
bordered
columns={columns1}
dataSource={tableData1}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
</div>
</div>
<div className='flex_jE' style={{ marginTop: 30 }}>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'取消'} onClick={() => { }} />
<ButtonComp text={'保存'} onClick={() => { }} />
</div>
</div>
);
}

@ -1,76 +0,0 @@
import TabsComp from '@/components/TabsComp';
import styles from '../../../GLQ/index.less';
import { useState } from 'react';
import { ConfigProvider, Form, Input, Radio, Select, Table } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
export default function Page() {
const [activeTab, setActiveTab] = useState(1)
const [tableData, setTableData] = useState([]);
const columns: any = [
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '数量', dataIndex: 'number', key: 'number', align: 'center' },
{ title: '载体编号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '内含文件类型', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '文件内容', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '密码机型号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '备注', dataIndex: 'name', key: 'name', align: 'center' }
]
return (
<div className={`${styles.params_warp}`}>
<TabsComp
dataSource={[{ id: 1, name: '密钥配发三联单' }]}
activeTab={activeTab}
onChange={(e) => setActiveTab(e)} />
<div className='flex_aiC mb20' >
<div style={{ marginRight: 12 }}></div>
<Select style={{ width: 260 }} placeholder="请选择发往单位" onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
</div>
<div className='mb20' style={{ height: 1, background: '#EDEDED' }}></div>
<div className='mb20 flex_aiC' >
<div style={{ marginRight: 12 }}></div>
<Select style={{ width: 260, marginRight: 20 }} placeholder="请选择单号" onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
<ButtonComp text={'查询'} onClick={() => { }} />
</div>
<div className='flex_aiC_jB mb20 mt20'>
<div> --</div>
<div>--</div>
</div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 9 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<div className='mb20 mt20 flex_aiC' >
<div style={{ marginRight: 12 }}></div>
<Input placeholder="请输入配发人" style={{ width: 260, marginRight: 50 }} />
<div>--</div>
</div>
<div className='flex_aiC_jB mt20'>
<ButtonComp text={'添加'} onClick={() => { }} />
<div className='flex_jE'>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'移出'} onClick={() => { }} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'制作'} onClick={() => { }} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'预览'} onClick={() => { }} />
<ButtonComp type={'cancel'} text={'打印'} onClick={() => { }} />
</div>
</div>
</div>
);
}

@ -1,95 +0,0 @@
import styles from '../../../GLQ/index.less';
import { useState } from 'react';
import { ConfigProvider, DatePicker, Select, Table } from 'antd';
import { rowClassName } from '@/utils';
import ButtonComp from '@/components/ButtonComp';
export default function Page() {
const [tableData, setTableData] = useState([]);
const columns: any = [
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '装配情况', dataIndex: 'name', key: 'name', align: 'center' }
]
const columns1: any = [
{
title: '序号', key: 'index', align: 'center', width: 80,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '设备名称', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '管理实体标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '000标识', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '产品名称', dataIndex: 'productName', key: 'productName', align: 'center' },
{ title: '产品编号', dataIndex: 'productNum', key: 'productNum', align: 'center' },
{ title: '安装方式', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '分发状态', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '启用日期', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '终止日期', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '密钥套号', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '载体类型', dataIndex: 'carrierType', key: 'carrierType', align: 'center' },
{ title: '输出日期', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '协同管理标志', dataIndex: 'name', key: 'name', align: 'center' }
]
return (
<div className={`${styles.params_warp}`}>
<ButtonComp type={'special'} text={'用户密钥装配'} onClick={() => { }} />
<div className='flex_aiC mt20 mb20'>
<div className='mr16'></div>
<Select style={{ width: 260, marginRight: 20 }} placeholder="请选择密钥类型" onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
<div className='mr16'></div>
<Select style={{ width: 260, marginRight: 20 }} placeholder="请选择所属网络" onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
<div className='mr16'></div>
<DatePicker style={{ width: 260, marginRight: 20 }} />
</div>
<div className='flex_aiC mt20 mb20'>
<div className='mr16'></div>
<DatePicker style={{ width: 260, marginRight: 20 }} />
<div className='mr16'></div>
<Select style={{ width: 260 }} placeholder="请选择应用系统" onChange={(e) => { }} options={[{ label: '选项1', value: 1 }]} />
</div>
<div className='mb10'></div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 5 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<div className='flex_jE mt20'>
<ButtonComp text={'装配'} onClick={() => { }} />
</div>
<div className='mb10 mt30'></div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 5 } : {}}
pagination={false}
bordered
columns={columns1}
dataSource={tableData}
rowKey={(record: any) => record?.id}
rowClassName={rowClassName}
/>
<div className='flex_jE mt20'>
<ButtonComp type='cancel' style={{ marginRight: 20 }} text={'过滤'} onClick={() => { }} />
<ButtonComp type='cancel' style={{ marginRight: 20 }} text={'载体输出'} onClick={() => { }} />
<ButtonComp type='cancel' text={'下载到邮箱'} onClick={() => { }} />
</div>
</div>
);
}

@ -1,9 +0,0 @@
import styles from './index.less';
export default function Page() {
return (
<div>
</div>
);
}

@ -6,6 +6,10 @@ import styles from './index.less';
import CheckSelect from '@/components/CheckSelect'; import CheckSelect from '@/components/CheckSelect';
import CheckInput from '@/components/CheckInput'; import CheckInput from '@/components/CheckInput';
import AddModal from './components/AddModal'; import AddModal from './components/AddModal';
import DEV from '@/utils/env/dev';
import { countType } from '@/utils/sysType';
interface PageProps { interface PageProps {
} }
@ -24,6 +28,34 @@ const MachineRegister: FC<PageProps> = ({ }) => {
const [clearAll, setclearAll] = useState(false) // 点击复位按钮时所有的chebox都变为false const [clearAll, setclearAll] = useState(false) // 点击复位按钮时所有的chebox都变为false
const [result, setResult] = useState({}) const [result, setResult] = useState({})
const [addModalVisible,setAddModalVisible] = useState<boolean>(false) //控制新增弹窗显隐 const [addModalVisible,setAddModalVisible] = useState<boolean>(false) //控制新增弹窗显隐
const urlParams = useParams();
let sysInfo = localStorage.getItem(`${urlParams?.fileType}`);
let info = sysInfo ? JSON.parse(sysInfo) : null;
useEffect(() => {
installSuccess()
}, [])
// 在指定的目录下安装快捷方式
const installSuccess = async () => {
try {
const response = await fetch('http://localhost:3001/createShortcut', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
mode: "cors",
body: JSON.stringify({
folderPath: `${DEV.FILE_URL}/${countType[urlParams?.fileType]}`,
shortcutName: '客户端',
shortcutURL: `${DEV.LOCAL_URL}/machineManage/register/${urlParams?.fileType}`
}),
});
} catch (error) {
message.error(error); // 处理请求错误
}
}
const columns = [{ const columns = [{
title: '序号', title: '序号',

@ -24,8 +24,7 @@ interface PageProps {
} }
const ImportStep: FC<PageProps> = ({ }) => { const ImportStep: FC<PageProps> = ({ }) => {
const [step, setStep] = useState(1) const [step, setStep] = useState(2)
const [radioValue, setRadioValue] = useState(1)
const uploadprops: UploadProps = { const uploadprops: UploadProps = {
maxCount: 1, maxCount: 1,
@ -47,38 +46,24 @@ const ImportStep: FC<PageProps> = ({ }) => {
} }
}; };
const handleRadioChange = (e) => {
setRadioValue(e.target.value)
}
return ( return (
<section className={styles.contentwrap}> <section className={styles.contentwrap}>
<StepHeader title={`${step}`} description={`${step}步的描述信息`} /> <StepHeader title={`${step}`} description={`${step}步的描述信息`} />
{step === 1 && <ContentWarp text='设备离线管理操作'>
<Radio.Group className={styles.radiostyle} onChange={handleRadioChange} value={radioValue}>
<Space direction="vertical">
<Radio value={1}></Radio>
<Radio value={2}></Radio>
<Radio value={3}></Radio>
</Space>
</Radio.Group>
</ContentWarp>
}
{step === 2 && <ContentWarp text='操作过程信息' style={{ height: '200px' }}> <ContentWarp text='操作过程信息' style={{ height: '200px' }}>
<div className='mt20 ml20'></div> <div className='mt20 ml20'></div>
</ContentWarp> </ContentWarp>
}
<div className='flex_jE mt20'> <div className='flex_jE mt20'>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'下一步'} onClick={() => { setStep(2) }} /> <ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'下一步'} onClick={() => { }} />
{step ===2 && <ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'上一步'} onClick={() => { setStep(1) }} />} <ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'上一步'} onClick={() => { history.back() }} />
{step ===2 && <Upload {...uploadprops} showUploadList={false}> <Upload {...uploadprops} showUploadList={false}>
<ButtonComp style={{ marginRight: 20 }} text={'加载数据'} /> <ButtonComp style={{ marginRight: 20 }} text={'加载数据'} />
</Upload>} </Upload>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'退出'} onClick={() => { }} /> <ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'退出'} onClick={() => { }} />
</div> </div>
</section> </section>

@ -0,0 +1,48 @@
import { FC, useEffect, useState } from 'react';
import { history, useLocation, useParams } from 'umi';
import { Radio, Space } from 'antd';
import ContentWarp from '@/components/ContentWarp';
import ButtonComp from '@/components/ButtonComp';
interface PageProps {}
const PageName: FC<PageProps> = ({ }) => {
const [radioValue, setRadioValue] = useState(1)
const urlParams = useParams();
const location = useLocation();
let urlStr = `${urlParams?.fileType}${location?.search}`;
const handleRadioChange = (e) => {
setRadioValue(e.target.value)
}
return (
<section>
<ContentWarp text='设备离线管理操作'>
<Radio.Group style={{ margin: '20px' }} onChange={handleRadioChange} value={radioValue}>
<Space direction="vertical">
<Radio value={1}></Radio>
<Radio value={2}></Radio>
<Radio value={3}></Radio>
</Space>
</Radio.Group>
</ContentWarp>
<div className='flex_jE_AC'>
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'下一步'} onClick={() => {
if(radioValue ==1){
history.push(`/machineManage/offline/import/${urlStr}`)
}
else if(radioValue ==2){
history.push(`/machineManage/offline/export/${urlStr}`)
}
}} />
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'退出'} onClick={() => { }} />
</div>
</section>
)
}
export default PageName

@ -1,35 +0,0 @@
import { FC, useEffect, useState } from 'react';
import { history, useLocation, useParams } from 'umi';
import ButtonComp from '@/components/ButtonComp';
import ClearInfoDialog from '@/components/ClearInfoDialog';
import { getPlugCordResult } from '@/services/api';
import { validateNumber } from '@/utils/validate';
import theme from '@/styles/antd.theme';
import { Button, ConfigProvider, Form, Input, Modal, Radio, message } from 'antd';
// import styles from './index.less';
interface PageProps {
data: Array<{
// 菜单名称
name: string;
// 是否展开
check: boolean;
// 内容是否有目录结构
isTree?: boolean;
// 菜单列表 name: 名称; url: 路由; img: 图标;
data: Array<{ name: string; url: string; img: any; }>
}>;
}
const PageName: FC<PageProps> = ({ }) => {
return (
<section>
</section>
)
}
export default PageName

@ -0,0 +1,16 @@
@keyframes typing{
from{
width:0
}
to{
width:10ch
}
}
.importStyle{
// width:9em;
animation:typing 5s steps(5) infinite ;
white-space: nowrap;
overflow: hidden;
border-right:1px solid;
}

@ -3,31 +3,294 @@ import { history, useLocation, useParams } from 'umi';
import ButtonComp from '@/components/ButtonComp'; import ButtonComp from '@/components/ButtonComp';
import ClearInfoDialog from '@/components/ClearInfoDialog'; import ClearInfoDialog from '@/components/ClearInfoDialog';
import NodeInitWrap from '@/components/NodeInitWrap'; import NodeInitWrap from '@/components/NodeInitWrap';
import { getPlugCordResult } from '@/services/api'; import ContentWarp from '@/components/ContentWarp';
import { validateNumber } from '@/utils/validate'; import { Button, ConfigProvider, Form, Input, Modal, Radio, Checkbox, message, Space,Select } from 'antd';
import theme from '@/styles/antd.theme';
import { Button, ConfigProvider, Form, Input, Modal, Radio, message } from 'antd';
import styles from './index.less'; import styles from './index.less';
import DEV from '@/utils/env/dev';
import { countType } from '@/utils/sysType';
interface PageProps { interface PageProps {
} }
const NodeInitTool: FC<PageProps> = ({ }) => { const NodeInitTool: FC<PageProps> = ({ }) => {
const urlParams = useParams();
const [authOpen, setAuthOpen] = useState(false);
const [stepOpen,setStepOpen] = useState(false);
const [step, setStep] = useState(1)
const [radioValue, setRadioValue] = useState(1)
const [configRadio, setConfigRadio] = useState(1)
const [curform] = Form.useForm();
const [preform] = Form.useForm();
const handleRadioChange = (e) => {
setRadioValue(e.target.value)
}
const handleConfigRadio = (e) => {
setConfigRadio(e.target.value)
}
let sysInfo = localStorage.getItem(`${urlParams?.fileType}`);
let info = sysInfo ? JSON.parse(sysInfo) : null;
useEffect(() => {
installSuccess()
setAuthOpen(true)
}, [])
// 在指定的目录下安装快捷方式
const installSuccess = async () => {
try {
const response = await fetch('http://localhost:3001/createShortcut', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
mode: "cors",
body: JSON.stringify({
folderPath: `${DEV.FILE_URL}/${countType[urlParams?.fileType]}`,
shortcutName: '节点初始化',
shortcutURL: `${DEV.LOCAL_URL}/nodeInit/${urlParams?.fileType}`
}),
});
} catch (error) {
message.error(error); // 处理请求错误
}
}
return ( return (
<section style={{width:'1200px',margin:'20px auto'}}> <section style={{ width: '1200px', margin: '20px auto' }}>
<NodeInitWrap <Modal
headTitle='各级节点初始化工具' title="管理员身份认证"
open={authOpen}
centered
footer={null}
maskClosable={false}
onCancel={() => {
setAuthOpen(false)
}}
>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-start' }}>
<div style={{ marginRight: '10px' }}></div>
<div style={{ flex: 1 }}><Input /></div>
</div>
<div className='flex_jE_AC mt30' >
<ButtonComp style={{ marginRight: 20 }} type={'cancel'} text={'取消'} onClick={() => {
setAuthOpen(false)
}} />
<ButtonComp type={'confirm'} text={'确定'} onClick={() => {
setAuthOpen(false)
setStepOpen(true)
}} />
</div>
</Modal>
<Modal
title="各级节点初始化工具"
open={stepOpen}
width={1200}
centered
footer={null}
maskClosable={false}
onCancel={() => {
setStepOpen(false)
}}
>
{step == 1 && <NodeInitWrap
stepTitle='第1步' stepTitle='第1步'
stepDesc='第一步描述' stepDesc='第一步描述'
leftStep='步骤1of4初始化' leftStep='步骤1of4初始化'
nextbtn={true} nextbtn={true}
cancelbtn={true} cancelbtn={true}
onNext={() => (setStep(2))}
>
<div style={{ marginTop: '20px' }}>
<div style={{ height: '200px', border: '1px solid #69C0E9' }}></div>
<div style={{ marginTop: '50px', display: 'flex', alignItems: 'center', justifyContent: 'flex-start' }}>
<div style={{ marginRight: '10px' }}>IP</div>
<div style={{ flex: 1 }}><Input /></div>
<ButtonComp type={'confirm'} text={'确定'} style={{ marginLeft: '30px' }} onClick={() => { }} />
</div>
</div>
</NodeInitWrap>}
{step == 2 && <NodeInitWrap
stepTitle='第2步'
stepDesc='第二步描述'
leftStep='步骤2of4初始化'
nextbtn={true}
prebtn={true}
cancelbtn={true}
onNext={() => (setStep(3))}
onPre={() => (setStep(1))}
>
<div style={{ marginTop: '20px' }}>
<div><Checkbox></Checkbox></div>
<div className='mt20'></div>
<div style={{ marginTop: '10px', height: '200px', border: '1px solid #69C0E9' }}>
<div className={styles.importStyle}>...</div>
</div>
<div style={{ marginTop: '20px', display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
<Radio.Group style={{ margin: '20px' }} onChange={handleRadioChange} value={radioValue}>
<Radio value={1}>u</Radio>
<Radio value={2}></Radio>
</Radio.Group>
<ButtonComp type={'confirm'} text={'确定'} style={{ marginLeft: '30px' }} onClick={() => { }} />
</div>
</div>
</NodeInitWrap>}
{step == 3 && <NodeInitWrap
stepTitle='第3步'
stepDesc='第三步描述'
leftStep='步骤3of4初始化'
nextbtn={true}
prebtn={true}
cancelbtn={true}
onNext={() => (setStep(4))}
onPre={() => (setStep(2))}
>
<div style={{ marginTop: '20px' }}>
<ContentWarp text='请选择一种配置操作类型'>
<Radio.Group style={{ margin: '20px' }} onChange={handleConfigRadio} value={configRadio}>
<Space direction="vertical">
<Radio value={1}></Radio>
<Radio value={2}></Radio>
<Radio value={3}></Radio>
</Space>
</Radio.Group>
</ContentWarp>
</div>
</NodeInitWrap>}
{step == 4 && <NodeInitWrap
stepTitle='第4步'
stepDesc='第四步描述'
leftStep='步骤4of4初始化'
finishbtn={true}
prebtn={true}
cancelbtn={true}
onNext={() => (setStep(4))}
onPre={() => (setStep(2))}
>
<div style={{ marginTop: '20px' }}>
<ContentWarp text='本级设备及上级设备基本信息'>
<div style={{ margin:'0 20px',display: 'flex', alignItems: 'center', justifyContent: 'flex-start' }}>
<div>
<div className='mt10 mb10'></div>
<div>
<Form
form={curform}
// onFinish={onFinish}
// initialValues={{ residence: ['zhejiang', 'hangzhou', 'xihu'], prefix: '86' }}
// style={{ maxWidth: 600 }}
scrollToFirstError
>
<Form.Item
name="id"
label="系统编号"
>
<Input />
</Form.Item>
<Form.Item
name="gender"
label="设备名称"
>
<Select placeholder="请选择设备名称">
<Option value="male">1</Option>
<Option value="female">2</Option>
<Option value="other">3</Option>
</Select>
</Form.Item>
<Form.Item
name="level"
label="管理级别"
>
<Input />
</Form.Item>
<Form.Item
name="num"
label="设备编号"
> >
<Input />
</Form.Item>
<Form.Item
name="identifier"
label="实体标识"
>
<Input />
</Form.Item>
</Form>
</div>
</div>
<div style={{marginLeft:'50px'}}>
<div className='mt10 mb10'></div>
<div>
<Form
form={preform}
// onFinish={onFinish}
// initialValues={{ residence: ['zhejiang', 'hangzhou', 'xihu'], prefix: '86' }}
// style={{ maxWidth: 600 }}
scrollToFirstError
>
<Form.Item
name="id"
label="系统编号"
>
<Input />
</Form.Item>
<Form.Item
name="gender"
label="设备名称"
>
<Select placeholder="请选择设备名称">
<Option value="male">1</Option>
<Option value="female">2</Option>
<Option value="other">3</Option>
</Select>
</Form.Item>
<Form.Item
name="level"
label="管理级别"
>
<Input />
</Form.Item>
<Form.Item
name="num"
label="设备编号"
>
<Input />
</Form.Item>
<Form.Item
name="identifier"
label="实体标识"
>
<Input />
</Form.Item>
</Form>
</div>
</div>
</div>
</ContentWarp>
</div>
</NodeInitWrap>}
</NodeInitWrap> </Modal>
</section> </section>
) )

Some files were not shown because too many files have changed in this diff Show More

Loading…
Cancel
Save