<route lang="yaml"> meta: title: 网关集成 constant: true layout: false </route> <script lang="ts" setup name="SmGateway"> import type { FormInstance, FormRules } from 'element-plus' import { ElMessage } from 'element-plus' import useUserStore from '@/store/modules/user' import { RSAdecrypt, RSAencrypt } from '@/utils/security' import { getPrivateKey, removePrivateKey } from '@/utils/auth' import JIT_GW_ExtInterface from '/public/smGateway/pnxclient.js' // import { fetchGwUrl } from '@/api/smGateway/smGateway' const route = useRoute() const router = useRouter() const userStore = useUserStore() const showKaptcha = ref(false) const publicKey = ref('') // 公钥 const sid = ref('') // sid const haveExe = ref(true) // 是否有安装插件 const passwordType = ref('password') // 密码类型:password 密码 const form = ref({ username: '', password: '', }) // 校验规则 const rules: FormRules = reactive({ username: [{ required: true, message: '用户名必填', trigger: ['blur', 'change'] }], password: [{ required: true, message: '密码必填', trigger: ['blur', 'change'] }], })// 前端校验规则 // 获取系统基础配置: 公钥,是否开启验证码 function getBaseConfig() { userStore.getBaseConfig().then((res) => { showKaptcha.value = res.kaptcha publicKey.value = res.publicKey sid.value = res.sid ElMessage({ message: '连接服务器成功', type: 'success', }) }) } // 获取控件版本-如果未安装插件,则提示安装。 const fetchVersion = () => { try { console.log('JIT_GW_ExtInterface', JIT_GW_ExtInterface) const res = JIT_GW_ExtInterface.GetVersion() console.log('获取网关插件版本', res) haveExe.value = true } catch (e) { haveExe.value = false console.log('获取网关版本插件失败, 没有插件') } } // 点击安装插件 const installExe = () => { fetch('./smGateway/PNXClient.exe').then((res: any) => { res.blob().then((blob: any) => { const blobUrl = window.URL.createObjectURL(blob) const filename = 'PNXClient.exe' const a = document.createElement('a') a.href = blobUrl a.download = filename a.click() window.URL.revokeObjectURL(blobUrl) }) }) } // 获取token function getToken(initParam: any, strGatewayAddress: string) { try { JIT_GW_ExtInterface.GetVersion() } catch (e) { // eslint-disable-next-line no-alert alert('未安装控件,请进行安装控件, 安装完请刷新页面或重新进入系统') return false } JIT_GW_ExtInterface.ClearFilter() // 初始化vctk控件 JIT_GW_ExtInterface.Initialize('', initParam) // 获取Token信息 const token = JIT_GW_ExtInterface.GetSessionToken(strGatewayAddress) if (JIT_GW_ExtInterface.GetLastError() != 0) { if (JIT_GW_ExtInterface.GetLastError() == 3758096386 || JIT_GW_ExtInterface.GetLastError() == 2148532334) { // eslint-disable-next-line no-alert alert('用户取消操作') return } else { alert(JIT_GW_ExtInterface.GetLastErrorMessage()) return } } document.getElementById('token')!.value = token submitToken() } // 认证 const getAuthPath = () => { const initParam = '<\?xml version="1.0" encoding="utf-8"\?><authinfo><liblist><lib type="PM" version="1.0" dllname="Q3J5cHRPY3guZGxs"><algid val="SHA1" sm2_hashalg="SM3" /></lib><lib type="CSP" version="1.0" dllname="TWljcm9zb2Z0IEVuaGFuY2VkIENyeXB0b2dyYXBoaWMgUHJvdmlkZXIgdjEuMA=="><algid val="SHA1" sm2_hashalg="SHA1" /></lib><lib type="CSP" version="1.0" dllname="TWljcm9zb2Z0IFN0cm9uZyBDcnlwdG9ncmFwaGljIFByb3ZpZGVy"><algid val="SHA1" sm2_hashalg="SHA1" /></lib><lib type="CSP" version="1.0" dllname="RW50ZXJTYWZlIGVQYXNzMzAwMyBDU1AgdjEuMA=="><algid val="SHA1" sm2_hashalg="SHA1" /></lib><lib type="CSP" version="1.0" dllname="SklUIFVTQiBLZXkgQ1NQIHYxLjA="><algid val="SHA1" sm2_hashalg="SHA1" /></lib><lib type="CSP" version="1.0" dllname="RW50ZXJTYWZlIGVQYXNzMjAwMSBDU1AgdjEuMA=="><algid val="SHA1" sm2_hashalg="SHA1" /></lib><lib type="CSP" version="1.0" dllname="SklUIFVTQiBLZXkzMDAzIENTUCB2MS4w"><algid val="SHA1" sm2_hashalg="SHA1" /></lib><lib type="CSP" version="1.0" dllname="TWljcm9zb2Z0IEJhc2UgQ3J5cHRvZ3JhcGhpYyBQcm92aWRlciB2MS4w"><algid val="SHA1" sm2_hashalg="SHA1" /></lib><lib type="CSP" version="1.0" dllname="RkVJVElBTiBlUGFzc05HIFJTQSBDcnlwdG9ncmFwaGljIFNlcnZpY2UgUHJvdmlkZXI="><algid val="SHA1" sm2_hashalg="SHA1" /></lib><lib type="CSP" version="1.0" dllname="RkVJVElBTiBlUGFzc05HIENTUCBGb3IgSklUM0sgVjEuMA=="><algid val="SHA1" sm2_hashalg="SHA1" /></lib><lib type="SKF" version="1.1" dllname="U2h1dHRsZUNzcDExXzMwMDBHTS5kbGw="><algid val="SHA1" sm2_hashalg="SM3" /></lib></liblist></authinfo>' fetchGwUrl().then((result: any) => { const strGatewayAddress = result.gwUrl // 应用标识 document.getElementById('appId')!.value = result.appId // 获取token getToken(initParam, strGatewayAddress) }).catch((e: any) => { console.log('请求gwUrl错误:', e.responseText) }) } onBeforeMount(async () => { getBaseConfig() fetchVersion() }) </script> <template> <div style="position: relative;"> <div class="bg-banner" /> <div class="main"> <div class="bg-top-banner"> 安全生产智慧监管系统 </div> <div class="exe"> <el-result v-if="!haveExe" icon="warning" title="警告提示" sub-title="未安装PNXClient插件,请先下载安装插件"> <template #extra> <el-button type="primary" size="large" @click="installExe"> 下载插件 </el-button> </template> </el-result> <div class="form"> <el-form ref="dataFormRef" label-position="left" label-width="80px" :model="form" :rules="rules" > <el-row :gutter="24"> <el-col :span="24"> <el-form-item label="用户名" prop="oldpassword"> <el-input v-model.trim="form.username" placeholder="请输入用户名" /> </el-form-item> </el-col> <el-col :span="24"> <el-form-item label="密码" prop="oldpassword"> <el-input v-model="form.password" placeholder="请输入密码" show-password /> </el-form-item> </el-col> <el-col :span="24" style="display: flex;justify-content: center;"> <el-button plain style="margin-top: 32px;" type="primary" size="large" @click="getAuthPath"> T+A认证 </el-button> </el-col> </el-row> </el-form> </div> <form id="formToken" action="" method="post"> <!-- 应用标识 --> <input id="appId" type="hidden" name="appId"> <!-- token信息 --> <input id="token" type="hidden" name="token"> </form> </div> </div> </div> </template> <style lang="scss" scoped> .bg-banner { position: fixed; z-index: -1; top: 0; width: 100%; height: 100%; // background: radial-gradient(circle at center, var(--el-fill-color-lighter), var(--el-bg-color-page)); background: url("../assets//images/login_images/theme2/bg-login.png") no-repeat center / cover; } .main { position: fixed; top: 20%; left: 55%; z-index: 0; .bg-top-banner { text-align: center; font-size: 30px; color: #000; font-weight: 700; letter-spacing: 2px; } .exe { margin-top: 30px; } .form { width: 500px; background: url("../assets//images/login_images/theme2/bg-blue.png") no-repeat center / cover; padding: 50px 30px 20px; border-radius: 8px; margin-top: 20px; } } </style>