Newer
Older
safe_production_front / src / views / smGateway-bak.vue
<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>