20230216

ruoyi-ui/.env.production

@@ -1,8 +1,8 @@
 # 页面标题
-VUE_APP_TITLE = 若依管理系统
+VUE_APP_TITLE = 证书管理系统
 
 # 生产环境配置
 ENV = 'production'
 
-# 若依管理系统/生产环境
+# 管理系统/生产环境
 VUE_APP_BASE_API = '/prod-api'

ruoyi-ui/.env.staging

@@ -6,5 +6,5 @@ NODE_ENV = production
 # 测试环境配置
 ENV = 'staging'
 
-# 若依管理系统/测试环境
+# 管理系统/测试环境
 VUE_APP_BASE_API = '/stage-api'

ruoyi-ui/.hintrc

@@ -0,0 +1,14 @@
+{
+  "extends": [
+    "development"
+  ],
+  "hints": {
+    "meta-viewport": "off",
+    "axe/language": [
+      "default",
+      {
+        "html-has-lang": "off"
+      }
+    ]
+  }
+}

ruoyi-ui/src/utils/htmlToPdf.js

@@ -1,9 +1,9 @@
 // 导出页面为PDF格式
 import html2Canvas from 'html2canvas'
-import JsPDF from 'jspdf'
+// import JsPDF from 'jspdf'
 export default {
   install(Vue, options) {
-    Vue.prototype.getPdf = function () {
+    Vue.prototype.getPdf = function() {
       var title = this.htmlTitle // 导出名称
       // var type = this.downType // 导出类型 true ->图片 false-> pdf
       var htmlID = document.getElementById('pdfDom')
@@ -12,31 +12,31 @@ export default {
         allowTaint: true,
         // 下面两个用来提高清晰度
         // dpi: window.devicePixelRatio*4, //将分辨率提高到特定的DPI 提高四倍
-        dpi: 300, //将分辨率提高到特定的DPI 提高四倍
-        scale:4, //按比例增加分辨率
+        dpi: 300, // 将分辨率提高到特定的DPI 提高四倍
+        scale: 4, // 按比例增加分辨率
         useCORS: true // 【重要】开启跨域配置
-      }).then(function (canvas) {
-        var contentWidth = canvas.width*2;
-        var contentHeight = canvas.height*2;
-        //一页pdf显示html页面生成的canvas高度;
-        var pageHeight = contentWidth / 592.28 * 841.89;
-        //未生成pdf的html页面高度
-        var leftHeight = contentHeight;
-        //页面偏移
-        var position = 0;
-        //a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高
-        var imgHeight = 590.28;
-        var imgWidth = 841.89 ;
+      }).then(function(canvas) {
+        // var contentWidth = canvas.width * 2
+        // var contentHeight = canvas.height * 2
+        // 一页pdf显示html页面生成的canvas高度;
+        // var pageHeight = contentWidth / 592.28 * 841.89
+        // 未生成pdf的html页面高度
+        // var leftHeight = contentHeight
+        // 页面偏移
+        // var position = 0
+        // a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高
+        // var imgHeight = 590.28
+        // var imgWidth = 841.89
         // var imgHeight = 592.28/contentWidth * contentHeight;
-        var pageData = canvas.toDataURL('image/png', 1.0);
+        var pageData = canvas.toDataURL('image/png', 1.0)
         // console.log(pageData,1111)
         // this.imgUrl = pageData
-        const el = document.createElement("a");
+        const el = document.createElement('a')
         // 设置 href 为图片经过 base64 编码后的字符串，默认为 png 格式
-        el.href = pageData;
-        el.download = title;
+        el.href = pageData
+        el.download = title
         // 创建一个点击事件并对 a 标签进行触发
-        const event = new MouseEvent("click");
+        const event = new MouseEvent('click')
         el.dispatchEvent(event)
         // var pdf = new JsPDF('landscape', 'pt', 'a4');
         // //有两个高度需要区分，一个是html页面的实际高度，和生成pdf的页面高度(841.89)

ruoyi-ui/src/utils/request.js

@@ -1,15 +1,16 @@
+/* eslint-disable eqeqeq */
 import axios from 'axios'
 import { Notification, MessageBox, Message, Loading } from 'element-ui'
 import store from '@/store'
 import { getToken } from '@/utils/auth'
 import errorCode from '@/utils/errorCode'
-import { tansParams, blobValidate } from "@/utils/ruoyi";
+import { tansParams, blobValidate } from '@/utils/ruoyi'
 import cache from '@/plugins/cache'
 import { saveAs } from 'file-saver'
 
-let downloadLoadingInstance;
+let downloadLoadingInstance
 // 是否显示重新登录
-export let isRelogin = { show: false };
+export const isRelogin = { show: false }
 
 axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
 // 创建axios实例
@@ -31,10 +32,10 @@ service.interceptors.request.use(config => {
   }
   // get请求映射params参数
   if (config.method === 'get' && config.params) {
-    let url = config.url + '?' + tansParams(config.params);
-    url = url.slice(0, -1);
-    config.params = {};
-    config.url = url;
+    let url = config.url + '?' + tansParams(config.params)
+    url = url.slice(0, -1)
+    config.params = {}
+    config.url = url
   }
   if (!isRepeatSubmit && (config.method === 'post' || config.method === 'put')) {
     const requestObj = {
@@ -46,12 +47,12 @@ service.interceptors.request.use(config => {
     if (sessionObj === undefined || sessionObj === null || sessionObj === '') {
       cache.session.setJSON('sessionObj', requestObj)
     } else {
-      const s_url = sessionObj.url;                  // 请求地址
-      const s_data = sessionObj.data;                // 请求数据
-      const s_time = sessionObj.time;                // 请求时间
-      const interval = 1000;                         // 间隔时间(ms)，小于此时间视为重复提交
+      const s_url = sessionObj.url // 请求地址
+      const s_data = sessionObj.data // 请求数据
+      const s_time = sessionObj.time // 请求时间
+      const interval = 1000 // 间隔时间(ms)，小于此时间视为重复提交
       if (s_data === requestObj.data && requestObj.time - s_time < interval && s_url === requestObj.url) {
-        const message = '数据正在处理，请勿重复提交';
+        const message = '数据正在处理，请勿重复提交'
         console.warn(`[${s_url}]: ` + message)
         return Promise.reject(new Error(message))
       } else {
@@ -61,85 +62,85 @@ service.interceptors.request.use(config => {
   }
   return config
 }, error => {
-    console.log(error)
-    Promise.reject(error)
+  console.log(error)
+  Promise.reject(error)
 })
 
 // 响应拦截器
 service.interceptors.response.use(res => {
-    // 未设置状态码则默认成功状态
-    const code = res.data.code || 200;
-    // 获取错误信息
-    const msg = errorCode[code] || res.data.msg || errorCode['default']
-    // 二进制数据则直接返回
-    if(res.request.responseType ===  'blob' || res.request.responseType ===  'arraybuffer'){
-      return res.data
-    }
-    if (code === 401) {
-      if (!isRelogin.show) {
-        isRelogin.show = true;
-        MessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
-          isRelogin.show = false;
-          store.dispatch('LogOut').then(() => {
-            location.href = '/index';
-          })
+  // 未设置状态码则默认成功状态
+  const code = res.data.code || 200
+  // 获取错误信息
+  const msg = errorCode[code] || res.data.msg || errorCode['default']
+  // 二进制数据则直接返回
+  if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {
+    return res.data
+  }
+  if (code === 401) {
+    if (!isRelogin.show) {
+      isRelogin.show = true
+      MessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
+        isRelogin.show = false
+        store.dispatch('LogOut').then(() => {
+          location.href = '/index'
+        })
       }).catch(() => {
-        isRelogin.show = false;
-      });
-    }
-      return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
-    } else if (code === 500) {
-      Message({ message: msg, type: 'error' })
-      return Promise.reject(new Error(msg))
-    } else if (code === 601) {
-      Message({ message: msg, type: 'warning' })
-      return Promise.reject('error')
-    } else if (code !== 200) {
-      Notification.error({ title: msg })
-      return Promise.reject('error')
-    } else {
-      return res.data
+        isRelogin.show = false
+      })
     }
-  },
-  error => {
-    console.log('err' + error)
-    let { message } = error;
-    if (message == "Network Error") {
-      message = "后端接口连接异常";
-    } else if (message.includes("timeout")) {
-      message = "系统接口请求超时";
-    } else if (message.includes("Request failed with status code")) {
-      message = "系统接口" + message.substr(message.length - 3) + "异常";
-    }
-    Message({ message: message, type: 'error', duration: 5 * 1000 })
-    return Promise.reject(error)
+    return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
+  } else if (code === 500) {
+    Message({ message: msg, type: 'error' })
+    return Promise.reject(new Error(msg))
+  } else if (code === 601) {
+    Message({ message: msg, type: 'warning' })
+    return Promise.reject('error')
+  } else if (code !== 200) {
+    Notification.error({ title: msg })
+    return Promise.reject('error')
+  } else {
+    return res.data
+  }
+},
+error => {
+  console.log('err' + error)
+  let { message } = error
+  if (message == 'Network Error') {
+    message = '后端接口连接异常'
+  } else if (message.includes('timeout')) {
+    message = '系统接口请求超时'
+  } else if (message.includes('Request failed with status code')) {
+    message = '系统接口' + message.substr(message.length - 3) + '异常'
   }
+  Message({ message: message, type: 'error', duration: 5 * 1000 })
+  return Promise.reject(error)
+}
 )
 
 // 通用下载方法
 export function download(url, params, filename, config) {
-  downloadLoadingInstance = Loading.service({ text: "正在下载数据，请稍候", spinner: "el-icon-loading", background: "rgba(0, 0, 0, 0.7)", })
+  downloadLoadingInstance = Loading.service({ text: '正在下载数据，请稍候', spinner: 'el-icon-loading', background: 'rgba(0, 0, 0, 0.7)' })
   return service.post(url, params, {
     transformRequest: [(params) => { return tansParams(params) }],
     headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
     responseType: 'blob',
     ...config
-  }).then(async (data) => {
-    const isLogin = await blobValidate(data);
+  }).then(async(data) => {
+    const isLogin = await blobValidate(data)
     if (isLogin) {
       const blob = new Blob([data])
       saveAs(blob, filename)
     } else {
-      const resText = await data.text();
-      const rspObj = JSON.parse(resText);
+      const resText = await data.text()
+      const rspObj = JSON.parse(resText)
       const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
-      Message.error(errMsg);
+      Message.error(errMsg)
     }
-    downloadLoadingInstance.close();
+    downloadLoadingInstance.close()
   }).catch((r) => {
     console.error(r)
     Message.error('下载文件出现错误，请联系管理员！')
-    downloadLoadingInstance.close();
+    downloadLoadingInstance.close()
   })
 }
 

ruoyi-ui/src/views/certInquire/index.vue

@@ -141,8 +141,6 @@ body,html{
 
 .tit {
   color: #000;
-  /* color: #892f27; */
-  /* font-size: 36px; */
   font-size: 22px;
   font-weight: 700;
   position: relative;
@@ -160,15 +158,12 @@ body,html{
   /* margin-right: 5px; */
 }
 .con {
-  font-size: 20px;
-  /* font-weight: 700; */
+  font-size: 18px;
   text-align: left;
   margin: 10px 0;
   line-height: 32px;
   text-indent: 2em;
-  // text-indent: 3em;
   position: absolute;
-    /* top: 129px; */
   bottom: 265px;
   margin-top: 30px;
   padding-right: 80px;
@@ -176,7 +171,8 @@ body,html{
 }
 .con-name {
   margin-right: 10px;
-  font-size: 24px;
+  margin-left: 10px;
+  font-size: 20px;
 }
 .heiti{
   font-family:黑体 ;
@@ -189,7 +185,6 @@ body,html{
   bottom: 100px;
   z-index: 10;
   text-align: center;
-  /* letter-spacing: 2px; */
 }
 .con-unit p {
   margin: 5px 0;
@@ -220,18 +215,18 @@ body,html{
 }
 .foot-term{
   position: absolute;
-  bottom: 124px;
-  left: 175px;
+  bottom: 160px;
+  left: 200px;
 }
 .foot-cert{
   position: absolute;
-  bottom: 94px;
-  left: 175px;
+    bottom: 130px;
+    left: 200px;
 }
 .foot-date{
   position: absolute;
-  bottom: 64px;
-  left: 175px;
+    bottom: 104px;
+    left: 200px;
 }
 .z10{
   z-index: 10;
@@ -241,8 +236,8 @@ body,html{
 }
 .foot-pp{
   position: absolute;
-  top: 270px;
-  left: 147px;
+  top: 273px;
+  left: 161px;
   text-align: center;
   line-height: 42px;
   p{

ruoyi-ui/src/views/certInquire/member/index.vue

@@ -1,46 +1,46 @@
 <template>
-    <div >
-      <div class="main-content">
-        <div class="img-box">
-            <img src="../../../assets/logo/logo2.png" alt="广东省教师继续教育学会">
+  <div>
+    <div class="main-content">
+      <div class="img-box">
+        <img src="../../../assets/logo/logo2.png" alt="广东省教师继续教育学会">
+      </div>
+      <div style="text-align: center;line-height: 50px;">
+        <span class="main-title" style="margin: 0 10px;font-weight: bold;">会员、理事证书、聘书查询</span>
+      </div>
+      <div>
+        <div class="label-box">
+          <div class="label-title">
+            <p>持证人姓名</p>
+            <p>（或持证单位全称）</p>
+          </div>
+          <input v-model="userName" type="text" class="label-input">
         </div>
-        <div style="text-align: center;line-height: 50px;">
-            <span class="main-title" style="margin: 0 10px;font-weight: bold;" >会员、理事证书、聘书查询</span>
+        <div class="label-box">
+          <div class="label-title">
+            <p>证书编码</p>
+          </div>
+          <input v-model="certNumber" type="text" class="label-input">
         </div>
-        <div>
-            <div class="label-box">
-                <div class="label-title">
-                    <p>持证人姓名</p>
-                    <p>（或持证单位全称）</p>
-                </div>
-                <input type="text" v-model="userName" class="label-input" />
-            </div>
-            <div class="label-box">
-                <div class="label-title">
-                    <p>证书编码</p>
-                </div>
-                <input type="text" v-model="certNumber" class="label-input" />
-            </div>
-            <div class="label-box">
-                <div class="label-title">
-                    <p>验证码<span class="label-must">*</span></p>
-                </div>
-                <input type="text" v-model="code" class="label-input" style="border-color:#acb1b5"/>
-                <div class="captcha-img">
-                    <img :src="codeUrl" @click="getCode" class="login-code-img"/>
-                </div>
-            </div>
-            <div class="btn-box">
-                <button class="btn-reset">重置</button>
-                <button class="btn-search" @click="handleSearch" v-bind:disabled="iconShow">
-                  查询<i class="el-icon-loading" v-show="iconShow"></i>
-                </button>
-            </div>
+        <div class="label-box">
+          <div class="label-title">
+            <p>验证码<span class="label-must">*</span></p>
+          </div>
+          <input v-model="code" type="text" class="label-input" style="border-color:#acb1b5">
+          <div class="captcha-img">
+            <img :src="codeUrl" class="login-code-img" @click="getCode">
+          </div>
+        </div>
+        <div class="btn-box">
+          <button class="btn-reset">重置</button>
+          <button class="btn-search" :disabled="iconShow" @click="handleSearch">
+            查询<i v-show="iconShow" class="el-icon-loading" />
+          </button>
         </div>
       </div>
-      <div style="position:fixed;top:-1200px;left:-1800px">
-        <div id="pdfDomm" ref="posterWrap">
-          <!-- <div class="proBox" >
+    </div>
+    <div style="position:fixed;top:-1200px;left:-1800px">
+      <div id="pdfDomm" ref="posterWrap">
+        <!-- <div class="proBox" >
             <img class="proBox-img" :src="data.url" >
             <div class="con" >
               <span class="con-name heiti">{{data.name}}</span>
@@ -50,186 +50,189 @@
             <span class="foot-cert">{{data.certId}}</span>
             <span class="foot-date">{{data.issueDate}}</span>
           </div> -->
-        </div>
       </div>
-      
-      <el-dialog
-        :title="`您以证书编号：${certNumber}为关键字查询验证证书结果如下：`"
-        :visible.sync="dialogVisible"
-        width="fit-content"
-        :before-close="handleClose"
-        class="dialog-box"
-      >
-        <p >经证书系统验证查询，证书信息正确，该证书预览如下，如需下载使用，请点击“下载”按钮。</p>
-        <img :src="imgUrl" width="750px" height="525px" ref="certimg"/>
-        <p style="font-weight:bold;color: red;font-size: 20px;text-indent: 0;">提示：伪造证书系违法行为，请勿尝试。</p>
-        <span slot="footer" class="dialog-footer">
-          <el-button @click="handleClose">取 消</el-button>
-          <el-button type="primary" @click="downloadImg">下载</el-button>
-          <!-- getPdf('#pdfDom') -->
-        </span>
-      </el-dialog>
-      <el-dialog
-        :title="`您以证书编号：${certNumber}为关键字查询验证证书结果如下：`"
-        :visible.sync="errorDialog"
-        width="50%"
-        class="errordialog-box"
-        :before-close="handleErrorClose"
-        >
-        <!-- :before-close="handleClose" -->
-        <p>未能查询到该证书，原因可能是证书编号或姓名（单位名称）输入错误， 也可能该证书为伪造证书。请重新输入准确的 证书编号 与 姓名（单位名称）信息后，再查询。谢谢您的关注。</p>
-        <p>如有疑问，请通知持证人与我会联系。</p>
-        <span slot="footer" class="dialog-footer">
-          <el-button type="primary" @click="handleErrorClose" style="width:100px">确 定</el-button>
-        </span>
-      </el-dialog>
     </div>
+
+    <el-dialog
+      :title="`您以证书编号：${certNumber}为关键字查询验证证书结果如下：`"
+      :visible.sync="dialogVisible"
+      width="fit-content"
+      :before-close="handleClose"
+      class="dialog-box"
+    >
+      <p>经证书系统验证查询，证书信息正确，该证书预览如下，如需下载使用，请点击“下载”按钮。</p>
+      <img ref="certimg" :src="imgUrl" width="750px" height="525px">
+      <p style="font-weight:bold;color: red;font-size: 20px;text-indent: 0;">提示：伪造证书系违法行为，请勿尝试。</p>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose">取 消</el-button>
+        <el-button type="primary" @click="downloadImg">下载</el-button>
+        <!-- getPdf('#pdfDom') -->
+      </span>
+    </el-dialog>
+    <el-dialog
+      :title="`您以证书编号：${certNumber}为关键字查询验证证书结果如下：`"
+      :visible.sync="errorDialog"
+      width="50%"
+      class="errordialog-box"
+      :before-close="handleErrorClose"
+    >
+      <!-- :before-close="handleClose" -->
+      <p>未能查询到该证书，原因可能是证书编号或姓名（单位名称）输入错误， 也可能该证书为伪造证书。请重新输入准确的 证书编号 与 姓名（单位名称）信息后，再查询。谢谢您的关注。</p>
+      <p>如有疑问，请通知持证人与我会联系。</p>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" style="width:100px" @click="handleErrorClose">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
-import { getCodeImg,checkCode} from "@/api/login";
-import { getCert } from "@/api/system/contract"
+import { getCodeImg, checkCode } from '@/api/login'
+import { getCert } from '@/api/system/contract'
 import html2Canvas from 'html2canvas'
 export default {
   data() {
     return {
-      pic:require('@/assets/certback/appiontment_page-0001.jpg'),
-      userName: "",
-      certNumber: "",
-      code: "",
-      codeUrl:"",
-      captchaEnabled:true,
-      uuid:"",
+      pic: require('@/assets/certback/appiontment_page-0001.jpg'),
+      userName: '',
+      certNumber: '',
+      code: '',
+      codeUrl: '',
+      captchaEnabled: true,
+      uuid: '',
       dialogVisible: false,
-      iconShow:false,
-      dist:"cert_b_type",
-      pageData: null, //接收html格式代码
-      htmlTitle: "结业证书",
+      iconShow: false,
+      dist: 'cert_b_type',
+      pageData: null, // 接收html格式代码
+      htmlTitle: '结业证书',
       isShow: true,
       isCanvas: false,
       downType: false, // false为 pdf , true为图片
-      data:{
+      data: {
         certContent: null,
-        certId: "221231hhh13",
+        certId: '221231hhh13',
         certMajor: 1,
         certType: 1,
-        code: "666666666666666",
+        code: '666666666666666',
         createBy: null,
         createTime: null,
-        email: "littlegreen55@163.com",
+        email: 'littlegreen55@163.com',
         id: 4,
-        issueDate: "2022-11-28",
-        name: "张晓翠",
-        phone: "16329009990",
+        issueDate: '2022-11-28',
+        name: '张晓翠',
+        phone: '16329009990',
         remark: null,
         updateBy: null,
         updateDate: null,
         updateTime: null,
-        validTerm: "22222222"
+        validTerm: '22222222'
       },
-      imgUrl:'',
-      errorDialog:false,
-      word:''
-    };
+      imgUrl: '',
+      errorDialog: false,
+      word: ''
+    }
+  },
+  mounted() {
+    this.getCode()
   },
-  methods:{
+  methods: {
     getCode() {
       getCodeImg().then(res => {
         // console.log(res)
-        this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled;
+        this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
         if (this.captchaEnabled) {
-          this.codeUrl = "data:image/gif;base64," + res.img;
-          this.uuid = res.uuid;
+          this.codeUrl = 'data:image/gif;base64,' + res.img
+          this.uuid = res.uuid
         }
         this.iconShow = false
-      });
+      })
     },
-    async handleSearch(){
-       this.iconShow = true
-        if( this.isBlock(this.userName)){
-          this.iconShow = false
-          this.$message.error("请输入持证人姓名或单位名称！")
-          return;
-        }
-        if( this.isBlock(this.certNumber)){
-          this.iconShow = false
-          this.$message.error("请输入证书编码！")
-          return;
-        }
-        if( this.isBlock(this.code)){
-          this.iconShow = false
-          this.$message.error("请输入验证码！")
-          return;
-        }
-        const form = {
-          userName: this.userName,
-          certNumber: this.certNumber,
-        }
-        const codeForm = {
-          code: this.code,
-          uuid: this.uuid
-        }
-        try{
-          let codeRes = await checkCode(codeForm)
-          if(codeRes.code===200){
-            try{
-              getCert(form).then(res=>{
-                if(res.data){
-                  this.iconShow = false
-                  this.data = res.data
-                  let img = this.realUrl(this.data.url)
-                  this.htmlTitle = this.data.name
-                  this.data.url = img
-                  // 创建html代码
-                  this.makeHtml()
-                  this.$nextTick(()=>{
-                    // 将html代码=>canvas=>img
-                    this.toImg()
-                    this.dialogVisible = true
-                    // 然后删除掉用完的html代码
-                    let e = document.getElementById('pdfDomm')
-                    e.innerHTML = ""
-                  })
-                }else{
-                  this.errorDialog = true
-                }
-              })
-              setTimeout(()=>{
-                if(this.iconShow){
-                  this.iconShow = false
-                }
-              },10000)
-            }catch(error){
-              this.iconShow = false
-              this.getCode()
-            }
+    async handleSearch() {
+      this.iconShow = true
+      if (this.isBlock(this.userName)) {
+        this.iconShow = false
+        this.$message.error('请输入持证人姓名或单位名称！')
+        return
+      }
+      if (this.isBlock(this.certNumber)) {
+        this.iconShow = false
+        this.$message.error('请输入证书编码！')
+        return
+      }
+      if (this.isBlock(this.code)) {
+        this.iconShow = false
+        this.$message.error('请输入验证码！')
+        return
+      }
+      const form = {
+        userName: this.userName,
+        certNumber: this.certNumber
+      }
+      const codeForm = {
+        code: this.code,
+        uuid: this.uuid
+      }
+      try {
+        const codeRes = await checkCode(codeForm)
+        if (codeRes.code === 200) {
+          try {
+            getCert(form).then(res => {
+              if (res.data) {
+                this.iconShow = false
+                this.data = res.data
+                const img = this.realUrl(this.data.url)
+                this.htmlTitle = this.data.name
+                this.data.url = img
+                // 创建html代码
+                this.makeHtml()
+                this.$nextTick(() => {
+                  // 将html代码=>canvas=>img
+                  this.toImg()
+                  this.dialogVisible = true
+                  // 然后删除掉用完的html代码
+                  const e = document.getElementById('pdfDomm')
+                  e.innerHTML = ''
+                })
+              } else {
+                this.errorDialog = true
+              }
+            })
+            setTimeout(() => {
+              if (this.iconShow) {
+                this.iconShow = false
+              }
+            }, 10000)
+          } catch (error) {
+            this.iconShow = false
+            this.getCode()
           }
-        }catch(err){
-          this.iconShow = false
-          this.getCode()
         }
+      } catch (err) {
+        this.iconShow = false
+        this.getCode()
+      }
     },
-    isBlock(str){
-      if(str===""){
+    isBlock(str) {
+      if (str === '') {
         return true
-      }else {
+      } else {
         return false
       }
     },
-    handleClose(){
+    handleClose() {
       this.iconShow = false
       this.getCode()
       this.dialogVisible = false
     },
-    handleErrorClose(){
+    handleErrorClose() {
       this.iconShow = false
       this.getCode()
       this.errorDialog = false
     },
-    realUrl(val){
+    realUrl(val) {
       return process.env.VUE_APP_BASE_API + val
     },
-    toImg(){
+    toImg() {
       // 将html代码=>canvas=>img
       var htmlID = document.getElementById('pdfDomm')
       const that = this
@@ -237,31 +240,34 @@ export default {
         allowTaint: true,
         // 下面两个用来提高清晰度
         // dpi: window.devicePixelRatio*4, //将分辨率提高到特定的DPI 提高四倍
-        dpi: 300, //将分辨率提高到特定的DPI 提高四倍
-        scale:4, //按比例增加分辨率
+        dpi: 300, // 将分辨率提高到特定的DPI 提高四倍
+        scale: 4, // 按比例增加分辨率
         useCORS: true // 【重要】开启跨域配置
-      }).then(function (canvas) {
-        var pageData = canvas.toDataURL('image/png', 1.0);
+      }).then(function(canvas) {
+        var pageData = canvas.toDataURL('image/png', 1.0)
         that.imgUrl = pageData
       })
     },
-    downloadImg(){
-      const el = document.createElement("a");
+    downloadImg() {
+      const el = document.createElement('a')
       // 设置 href 为图片经过 base64 编码后的字符串，默认为 png 格式
-      el.href = this.$refs.certimg.src;
-      el.download = this.htmlTitle;
+      el.href = this.$refs.certimg.src
+      el.download = this.htmlTitle
       // 创建一个点击事件并对 a 标签进行触发
-      const event = new MouseEvent("click");
+      const event = new MouseEvent('click')
       el.dispatchEvent(event)
     },
-    makeHtml(){
+    makeHtml() {
       // js写html代码
-      let e = document.getElementById('pdfDomm')
-      this.word =  `<div class="proBox" >
+      const e = document.getElementById('pdfDomm')
+      this.word = `<div class="proBox" >
         <img class="proBox-img" src="${window.location.origin}${this.data.url}" >
-        <div class="con" >
-          <span class="con-name heiti">${this.data.name}</span>
-          <span>${this.data.certContent}</span>
+        <div class="con" style="bottom:0;top:165px">
+          <p style="margin:0">
+            <span class="con-name heiti">${this.data.name}</span>
+            <span>${this.data.certContent}</span>
+          </p>
+          <p style="margin:0">特发此证。</p>
         </div>
         <span class="foot-term" >${this.data.validTerm}</span>
         <span class="foot-cert">${this.data.certId}</span>
@@ -269,11 +275,8 @@ export default {
       </div>`
       e.innerHTML = this.word
     }
-  },
-  mounted(){
-    this.getCode()
   }
-};
+}
 </script>
 
 <style lang="scss" scoped>

ruoyi-ui/src/views/certInquire/profess/index.vue

@@ -1,73 +1,73 @@
 <template>
-    <div>
-      <div class="main-content">
-        <div class="img-box">
-              <img src="../../../assets/logo/logo2.png" alt="广东省教师继续教育学会">
+  <div>
+    <div class="main-content">
+      <div class="img-box">
+        <img src="../../../assets/logo/logo2.png" alt="广东省教师继续教育学会">
+      </div>
+      <div style="text-align: center;line-height: 50px;">
+        <span class="main-title" style="margin: 0 10px;font-weight: bold;">专业能力证书查询</span>
+      </div>
+      <div>
+        <div class="label-box">
+          <div class="label-title">
+            <p>持证人姓名</p>
+            <p>（或持证单位全称）</p>
           </div>
-        <div style="text-align: center;line-height: 50px;">
-            <span class="main-title" style="margin: 0 10px;font-weight: bold;" >专业能力证书查询</span>
+          <input v-model="userName" type="text" class="label-input">
         </div>
-        <div>
-          <div class="label-box">
-              <div class="label-title">
-                  <p>持证人姓名</p>
-                  <p>（或持证单位全称）</p>
-              </div>
-              <input type="text" v-model="userName" class="label-input" />
-          </div>
-          <div class="label-box">
-              <div class="label-title">
-                  <p>证书编码</p>
-              </div>
-              <input type="text" v-model="certNumber" class="label-input" />
+        <div class="label-box">
+          <div class="label-title">
+            <p>证书编码</p>
           </div>
-          <div class="label-box">
-              <div class="label-title">
-                  <p>验证码<span class="label-must">*</span></p>
-              </div>
-              <input type="text" v-model="code" class="label-input" style="border-color:#acb1b5"/>
-              <div class="captcha-img">
-                  <img :src="codeUrl" @click="getCode" class="login-code-img"/>
-              </div>
+          <input v-model="certNumber" type="text" class="label-input">
+        </div>
+        <div class="label-box">
+          <div class="label-title">
+            <p>验证码<span class="label-must">*</span></p>
           </div>
-          <div class="btn-box">
-              <button class="btn-reset">重置</button>
-              <button class="btn-search" @click="handleSearch" v-bind:disabled="iconShow">
-                查询<i class="el-icon-loading" v-show="iconShow"></i>
-              </button>
+          <input v-model="code" type="text" class="label-input" style="border-color:#acb1b5">
+          <div class="captcha-img">
+            <img :src="codeUrl" class="login-code-img" @click="getCode">
           </div>
         </div>
+        <div class="btn-box">
+          <button class="btn-reset">重置</button>
+          <button class="btn-search" :disabled="iconShow" @click="handleSearch">
+            查询<i v-show="iconShow" class="el-icon-loading" />
+          </button>
+        </div>
       </div>
-      <div style="position:fixed;top:-1200px;left:-1800px">
-        <div id="pdfDomm" ref="posterWrap">
-          <div class="proBox" >
-            <img class="proBox-img z01" :src="data.backurl" />
-            <div class="con z10" style="width: 64px; height: 83px;overflow: hidden;text-indent: 0;padding-right: 0;top: 133px;left: 182px;">
-              <img id="pdfhead" :src="data.headurl" style="height:100%;position: absolute;left: 50%;transform: translate(-50%, -50%);top: 50%;" />
-            </div>
-            <div class="foot-pp z10">
-              <p class="foot-p-name " >{{data.uesrName}}</p>
-              <p class="foot-p-ID ">{{data.userId}}</p>
-              <p class="foot-p-cert ">{{data.certId}}</p>
-              <p class="foot-p-date ">{{data.issueDate}}</p>
-            </div>
-            <div class="content z10" style="position: absolute;left: 450px;width: 230px;top: 85px;font-size: 19px;line-height: 30px;text-indent: 2em;">
-              <p style="margin:0">
-                持证人参加了<span class="heiti" style="margin: 0 15px;font-size: 19px;">{{data.certName}}</span>，已修完教学计划规定的全部课程，合计<span class="heiti" style="margin: 0 15px;font-size: 20px;">{{data.courseHours}}</span>学时。
-              </p>
-              <p style="margin:0">考核合格，准予结业，特发此证。</p>
-            </div>
+    </div>
+    <div style="position:fixed;top:-1200px;left:-1800px">
+      <div id="pdfDomm" ref="posterWrap">
+        <div class="proBox">
+          <img class="proBox-img z01" :src="data.backurl">
+          <div class="con z10" style="width: 64px; height: 83px;overflow: hidden;text-indent: 0;padding-right: 0;top: 144px;left: 183px;">
+            <img id="pdfhead" :src="data.headurl" style="height:100%;position: absolute;left: 50%;transform: translate(-50%, -50%);top: 50%;">
+          </div>
+          <div class="foot-pp z10">
+            <p class="foot-p-name ">{{ data.uesrName }}</p>
+            <p class="foot-p-ID ">{{ data.userId }}</p>
+            <p class="foot-p-cert ">{{ data.certId }}</p>
+            <p class="foot-p-date ">{{ data.issueDate }}</p>
+          </div>
+          <div class="content z10" style="position: absolute;left: 405px;width: 270px;top: 125px;font-size: 17px;line-height: 30px;text-indent: 2em;text-align: justify;text-align-last: left;">
+            <p style="margin:0">
+              持证人参加了<span class="heiti" style="margin: 0 15px;font-size: 17px;">{{ data.certName }}</span>，已修完教学计划规定的全部课程，合计<span class="heiti" style="margin: 0 15px;font-size: 18px;">{{ data.courseHours }}</span>学时。
+            </p>
+            <p style="margin:0">考核合格，准予结业，特发此证。</p>
           </div>
         </div>
       </div>
-      <el-dialog
+    </div>
+    <el-dialog
       :title="`您以证书编号：${certNumber}为关键字查询验证证书结果如下：`"
-        :visible.sync="dialogVisible"
-        width="fit-content"
-        :before-close="handleClose"
-        class="dialog-box"
-      >
-        <!-- <div id="pdfDom" ref="posterWrap">
+      :visible.sync="dialogVisible"
+      width="fit-content"
+      :before-close="handleClose"
+      class="dialog-box"
+    >
+      <!-- <div id="pdfDom" ref="posterWrap">
           <div class="proBox" >
             <img class="proBox-img z01" :src="data.backurl" />
             <div class="con z10" style="width: 64px; height: 83px;overflow: hidden;text-indent: 0;padding-right: 0;top: 133px;left: 182px;">
@@ -87,184 +87,187 @@
             </div>
           </div>
         </div> -->
-        <p >经证书系统验证查询，证书信息正确，该证书预览如下，如需下载使用，请点击“下载”按钮。</p>
-        <img :src="imgUrl" width="750px" height="525px" ref="certimg"/>
-        <p style="font-weight:bold;color: red;font-size: 20px;text-indent: 0;">提示：伪造证书系违法行为，请勿尝试。</p>
-        <span slot="footer" class="dialog-footer">
-          <el-button @click="handleClose">取 消</el-button>
-          <el-button type="primary" @click="downloadImg">下载</el-button>
-          <!-- getPdf('#pdfDom') -->
-        </span>
-      </el-dialog>
-      <el-dialog
-        :title="`您以证书编号：${certNumber}为关键字查询验证证书结果如下：`"
-        :visible.sync="errorDialog"
-        width="50%"
-        class="errordialog-box"
-        :before-close="handleErrorClose"
-        >
-        <!-- :before-close="handleClose" -->
-        <p>未能查询到该证书，原因可能是证书编号或姓名（单位名称）输入错误， 也可能该证书为伪造证书。请重新输入准确的 证书编号 与 姓名（单位名称）信息后，再查询。谢谢您的关注。</p>
-        <p>如有疑问，请通知持证人与我会联系。</p>
-        <span slot="footer" class="dialog-footer">
-          <el-button type="primary" @click="handleErrorClose" style="width:100px">确 定</el-button>
-        </span>
-      </el-dialog>
-    </div>
+      <p>经证书系统验证查询，证书信息正确，该证书预览如下，如需下载使用，请点击“下载”按钮。</p>
+      <img ref="certimg" :src="imgUrl" width="750px" height="525px">
+      <p style="font-weight:bold;color: red;font-size: 20px;text-indent: 0;">提示：伪造证书系违法行为，请勿尝试。</p>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose">取 消</el-button>
+        <el-button type="primary" @click="downloadImg">下载</el-button>
+        <!-- getPdf('#pdfDom') -->
+      </span>
+    </el-dialog>
+    <el-dialog
+      :title="`您以证书编号：${certNumber}为关键字查询验证证书结果如下：`"
+      :visible.sync="errorDialog"
+      width="50%"
+      class="errordialog-box"
+      :before-close="handleErrorClose"
+    >
+      <!-- :before-close="handleClose" -->
+      <p>未能查询到该证书，原因可能是证书编号或姓名（单位名称）输入错误， 也可能该证书为伪造证书。请重新输入准确的 证书编号 与 姓名（单位名称）信息后，再查询。谢谢您的关注。</p>
+      <p>如有疑问，请通知持证人与我会联系。</p>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" style="width:100px" @click="handleErrorClose">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
-import { getCodeImg,checkCode} from "@/api/login"
-import { getACert } from "@/api/system/grad"
+import { getCodeImg, checkCode } from '@/api/login'
+import { getACert } from '@/api/system/grad'
 import html2Canvas from 'html2canvas'
 export default {
   data() {
     return {
-      userName: "",
-      certNumber: "",
-      code: "",
-      codeUrl:"",
-      captchaEnabled:true,
-      uuid:"",
+      userName: '',
+      certNumber: '',
+      code: '',
+      codeUrl: '',
+      captchaEnabled: true,
+      uuid: '',
       dialogVisible: false,
-      iconShow:false,
-      dist:"cert_b_type",
-      pageData: null, //接收html格式代码
-      htmlTitle: "结业证书",
+      iconShow: false,
+      dist: 'cert_b_type',
+      pageData: null, // 接收html格式代码
+      htmlTitle: '结业证书',
       isShow: true,
       isCanvas: false,
       downType: false, // false为 pdf , true为图片
-      data:{
-        certId: "11111111",
-        certName: "222",
+      data: {
+        certId: '11111111',
+        certName: '222',
         certType: 0,
-        courseHours: "222",
-        courseName: "222",
+        courseHours: '222',
+        courseName: '222',
         createBy: null,
         createTime: null,
         id: 3,
-        issueDate: "2022-11-29",
-        level: "22",
-        picture: "/profile/2022/222_A00.jpg",
+        issueDate: '2022-11-29',
+        level: '22',
+        picture: '/profile/2022/222_A00.jpg',
         remark: null,
-        trainPeriod: "222",
+        trainPeriod: '222',
         uesrName: null,
         updateBy: null,
-        updateDate: "2022-12-13T15:29:56.000+08:00",
+        updateDate: '2022-12-13T15:29:56.000+08:00',
         updateTime: null,
-        url: "/profile/upload/2022/12/13/pro1_page-0001_20221213151348A006.jpg",
-        userEmail:"222222",
-        userId: "2222",
-        userPhone: "222"
+        url: '/profile/upload/2022/12/13/pro1_page-0001_20221213151348A006.jpg',
+        userEmail: '222222',
+        userId: '2222',
+        userPhone: '222'
       },
-      imgUrl:'',
-      errorDialog:false,
-      word:''
-    };
+      imgUrl: '',
+      errorDialog: false,
+      word: ''
+    }
   },
-  methods:{
+  mounted() {
+    this.getCode()
+  },
+  methods: {
     getCode() {
       getCodeImg().then(res => {
         // console.log(res)
-        this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled;
+        this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
         if (this.captchaEnabled) {
-          this.codeUrl = "data:image/gif;base64," + res.img;
-          this.uuid = res.uuid;
+          this.codeUrl = 'data:image/gif;base64,' + res.img
+          this.uuid = res.uuid
         }
-      });
+      })
     },
-    async handleSearch(){
-       this.iconShow = true
-        if( this.isBlock(this.userName)){
-          this.iconShow = false
-          this.$message.error("请输入持证人姓名或单位名称！")
-          return;
-        }
-        if( this.isBlock(this.certNumber)){
-          this.iconShow = false
-          this.$message.error("请输入证书编码！")
-          return;
-        }
-        if( this.isBlock(this.code)){
-          this.iconShow = false
-          this.$message.error("请输入验证码！")
-          return;
-        }
-        const form = {
-          userName: this.userName,
-          certNumber: this.certNumber,
-          certType:0
-        }
-        const codeForm = {
-          code: this.code,
-          uuid: this.uuid
-        }
-        try{
-          let codeRes = await checkCode(codeForm)
-          // console.log(codeRes)
-          if(codeRes.code===200){
-            try{
-              getACert(form).then(res=>{
-                if(res.data){
-                  this.iconShow = false
-                  this.data = res.data
-                  // console.log(this.data)
-                  let backimg = this.realUrl(this.data.url)
-                  let headimg = this.realUrl(this.data.picture)
-                  this.htmlTitle = this.data.uesrName
-                  this.data.backurl = backimg
-                  this.data.headurl = headimg
-                  // 创建html代码
-                  // this.makeHtml()
-                  this.$nextTick(()=>{
-                    // 将html代码=>canvas=>img
-                    this.toImg()
-                    this.dialogVisible = true
-                    // 然后删除掉用完的html代码
-                    let e = document.getElementById('pdfDomm')
+    async handleSearch() {
+      this.iconShow = true
+      if (this.isBlock(this.userName)) {
+        this.iconShow = false
+        this.$message.error('请输入持证人姓名或单位名称！')
+        return
+      }
+      if (this.isBlock(this.certNumber)) {
+        this.iconShow = false
+        this.$message.error('请输入证书编码！')
+        return
+      }
+      if (this.isBlock(this.code)) {
+        this.iconShow = false
+        this.$message.error('请输入验证码！')
+        return
+      }
+      const form = {
+        userName: this.userName,
+        certNumber: this.certNumber,
+        certType: 0
+      }
+      const codeForm = {
+        code: this.code,
+        uuid: this.uuid
+      }
+      try {
+        const codeRes = await checkCode(codeForm)
+        // console.log(codeRes)
+        if (codeRes.code === 200) {
+          try {
+            getACert(form).then(res => {
+              if (res.data) {
+                this.iconShow = false
+                this.data = res.data
+                // console.log(this.data)
+                const backimg = this.realUrl(this.data.url)
+                const headimg = this.realUrl(this.data.picture)
+                this.htmlTitle = this.data.uesrName
+                this.data.backurl = backimg
+                this.data.headurl = headimg
+                // 创建html代码
+                // this.makeHtml()
+                this.$nextTick(() => {
+                  // 将html代码=>canvas=>img
+                  this.toImg()
+                  this.dialogVisible = true
+                  // 然后删除掉用完的html代码
+                  const e = document.getElementById('pdfDomm')
 
-                    e.innerHTML = ""
-                  })
-                }else{
-                  this.errorDialog = true
-                }
-              })
-              setTimeout(()=>{
-                if(this.iconShow){
-                  this.iconShow = false
-                }
-              },10000)
-            }catch(error){
-              this.iconShow = false
-              this.getCode()
-            }
+                  e.innerHTML = ''
+                })
+              } else {
+                this.errorDialog = true
+              }
+            })
+            setTimeout(() => {
+              if (this.iconShow) {
+                this.iconShow = false
+              }
+            }, 10000)
+          } catch (error) {
+            this.iconShow = false
+            this.getCode()
           }
-        }catch(err){
-          this.iconShow = false
-          this.getCode()
         }
+      } catch (err) {
+        this.iconShow = false
+        this.getCode()
+      }
     },
-    isBlock(str){
-      if(str===""){
+    isBlock(str) {
+      if (str === '') {
         return true
-      }else {
+      } else {
         return false
       }
     },
-    handleClose(){
+    handleClose() {
       this.iconShow = false
       this.getCode()
       this.dialogVisible = false
     },
-    handleErrorClose(){
+    handleErrorClose() {
       this.iconShow = false
       this.getCode()
       this.errorDialog = false
     },
-    realUrl(val){
+    realUrl(val) {
       return process.env.VUE_APP_BASE_API + val
     },
-    toImg(){
+    toImg() {
       // 将html代码=>canvas=>img
       var htmlID = document.getElementById('pdfDomm')
       const that = this
@@ -272,29 +275,29 @@ export default {
         allowTaint: true,
         // 下面两个用来提高清晰度
         // dpi: window.devicePixelRatio*4, //将分辨率提高到特定的DPI 提高四倍
-        dpi: 300, //将分辨率提高到特定的DPI 提高四倍
-        scale:4, //按比例增加分辨率
+        dpi: 300, // 将分辨率提高到特定的DPI 提高四倍
+        scale: 4, // 按比例增加分辨率
         useCORS: true // 【重要】开启跨域配置
-      }).then(function (canvas) {
-        var pageData = canvas.toDataURL('image/png', 1.0);
+      }).then(function(canvas) {
+        var pageData = canvas.toDataURL('image/png', 1.0)
         that.imgUrl = pageData
       })
     },
-    downloadImg(){
-      const el = document.createElement("a");
+    downloadImg() {
+      const el = document.createElement('a')
       // 设置 href 为图片经过 base64 编码后的字符串，默认为 png 格式
-      el.href = this.$refs.certimg.src;
-      el.download = this.htmlTitle;
+      el.href = this.$refs.certimg.src
+      el.download = this.htmlTitle
       // 创建一个点击事件并对 a 标签进行触发
-      const event = new MouseEvent("click");
+      const event = new MouseEvent('click')
       el.dispatchEvent(event)
     },
-    makeHtml(){
+    makeHtml() {
       // js写html代码
-      let e = document.getElementById('pdfDomm')
+      const e = document.getElementById('pdfDomm')
       this.word = `<div class="proBox" >
             <img class="proBox-img z01" src="${window.location.origin}${this.data.backurl}" />
-            <div class="con z10" style="width: 64px; height: 83px;overflow: hidden;text-indent: 0;padding-right: 0;top: 133px;left: 182px;">
+            <div class="con z10" style="width: 64px; height: 83px;overflow: hidden;text-indent: 0;padding-right: 0;top: 144px;left: 183px;">
               <img src="${window.location.origin}${this.data.headurl}" style="height:100%;position: absolute;left: 50%;transform: translate(-50%, -50%);top: 50%;" />
             </div>
             <div class="foot-pp z10">
@@ -312,11 +315,8 @@ export default {
           </div>`
       e.innerHTML = this.word
     }
-  },
-  mounted(){
-    this.getCode()
   }
-};
+}
 </script>
 
 <style lang="scss" scoped>

ruoyi-ui/src/views/certInquire/train/index.vue

@@ -2,54 +2,60 @@
   <div>
     <div class="main-content">
       <div class="img-box">
-            <img src="../../../assets/logo/logo2.png" alt="广东省教师继续教育学会">
-        </div>
+        <img src="../../../assets/logo/logo2.png" alt="广东省教师继续教育学会">
+      </div>
       <div style="text-align: center;line-height: 50px;">
-          <span class="main-title" style="margin: 0 10px;font-weight: bold;" >结业证书、学时证明查询</span>
+        <span class="main-title" style="margin: 0 10px;font-weight: bold;">结业证书、学时证明查询</span>
       </div>
       <div>
-          <div class="label-box">
-              <div class="label-title">
-                  <p>持证人姓名</p>
-                  <p>（或持证单位全称）</p>
-              </div>
-              <input type="text" v-model="userName" class="label-input" />
+        <div class="label-box">
+          <div class="label-title">
+            <p>证书类型</p>
+          </div>
+          <el-radio v-model="radio" label="1">结业证书</el-radio>
+          <el-radio v-model="radio" label="2">学时证明</el-radio>
+        </div>
+        <div class="label-box">
+          <div class="label-title">
+            <p>持证人姓名</p>
+            <p>（或持证单位全称）</p>
           </div>
-          <div class="label-box">
-              <div class="label-title">
-                  <p>证书编码</p>
-              </div>
-              <input type="text" v-model="certNumber" class="label-input" />
+          <input v-model="userName" type="text" class="label-input">
+        </div>
+        <div class="label-box">
+          <div class="label-title">
+            <p>证书编码</p>
           </div>
-          <div class="label-box">
-              <div class="label-title">
-                  <p>验证码<span class="label-must">*</span></p>
-              </div>
-              <input type="text" v-model="code" class="label-input" style="border-color:#acb1b5"/>
-              <div class="captcha-img">
-                  <img :src="codeUrl" @click="getCode" class="login-code-img"/>
-              </div>
+          <input v-model="certNumber" type="text" class="label-input">
+        </div>
+        <div class="label-box">
+          <div class="label-title">
+            <p>验证码<span class="label-must">*</span></p>
           </div>
-          <div class="btn-box">
-              <button class="btn-reset">重置</button>
-              <button class="btn-search" @click="handleSearch" v-bind:disabled="iconShow">
-                查询<i class="el-icon-loading" v-show="iconShow"></i>
-              </button>
+          <input v-model="code" type="text" class="label-input" style="border-color:#acb1b5">
+          <div class="captcha-img">
+            <img :src="codeUrl" class="login-code-img" @click="getCode">
           </div>
+        </div>
+        <div class="btn-box">
+          <button class="btn-reset">重置</button>
+          <button class="btn-search" :disabled="iconShow" @click="handleSearch">
+            查询<i v-show="iconShow" class="el-icon-loading" />
+          </button>
+        </div>
       </div>
     </div>
     <div style="position:fixed;top:-1200px;left:-1800px">
-        <div id="pdfDomm" ref="posterWrap">
-        </div>
-      </div>
+      <div id="pdfDomm" ref="posterWrap" />
+    </div>
     <el-dialog
-        :title="`您以证书编号：${certNumber}为关键字查询验证证书结果如下：`"
-        :before-close="handleClose"
-        :visible.sync="dialogVisible"
-        width="fit-content"
-        class="dialog-box"
-      >
-        <!-- <div id="pdfDom" ref="posterWrap">
+      :title="`您以证书编号：${certNumber}为关键字查询验证证书结果如下：`"
+      :before-close="handleClose"
+      :visible.sync="dialogVisible"
+      width="fit-content"
+      class="dialog-box"
+    >
+      <!-- <div id="pdfDom" ref="posterWrap">
           <div class="proBox" >
             <img class="proBox-img" :src="data.backurl" >
             <div class="con train-con" >
@@ -62,182 +68,190 @@
             <span class="foot-date train-foot-date">{{data.issueDate}}</span>
           </div>
         </div> -->
-        <p >经证书系统验证查询，证书信息正确，该证书预览如下，如需下载使用，请点击“下载”按钮。</p>
-        <img :src="imgUrl" width="750px" height="525px" ref="certimg"/>
-        <p style="font-weight:bold;color: red;font-size: 20px;text-indent: 0;">提示：伪造证书系违法行为，请勿尝试。</p>
-        <span slot="footer" class="dialog-footer">
-          <el-button @click="handleClose">取 消</el-button>
-          <el-button type="primary" @click="downloadImg">下载</el-button>
-          <!-- getPdf('#pdfDom') -->
-        </span>
+      <p>经证书系统验证查询，证书信息正确，该证书预览如下，如需下载使用，请点击“下载”按钮。</p>
+      <img ref="certimg" :src="imgUrl" width="750px" height="525px">
+      <p style="font-weight:bold;color: red;font-size: 20px;text-indent: 0;">提示：伪造证书系违法行为，请勿尝试。</p>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose">取 消</el-button>
+        <el-button type="primary" @click="downloadImg">下载</el-button>
+        <!-- getPdf('#pdfDom') -->
+      </span>
     </el-dialog>
     <el-dialog
-        :title="`您以证书编号：${certNumber}为关键字查询验证证书结果如下：`"
-        :visible.sync="errorDialog"
-        width="50%"
-        class="errordialog-box"
-        :before-close="handleErrorClose"
-        >
-        <!-- :before-close="handleClose" -->
-        <p>未能查询到该证书，原因可能是证书编号或姓名（单位名称）输入错误， 也可能该证书为伪造证书。请重新输入准确的 证书编号 与 姓名（单位名称）信息后，再查询。谢谢您的关注。</p>
-        <p>如有疑问，请通知持证人与我会联系。</p>
-        <span slot="footer" class="dialog-footer">
-          <el-button type="primary" @click="handleErrorClose" style="width:100px">确 定</el-button>
-        </span>
-      </el-dialog>
+      :title="`您以证书编号：${certNumber}为关键字查询验证证书结果如下：`"
+      :visible.sync="errorDialog"
+      width="50%"
+      class="errordialog-box"
+      :before-close="handleErrorClose"
+    >
+      <!-- :before-close="handleClose" -->
+      <p>未能查询到该证书，原因可能是证书编号或姓名（单位名称）输入错误， 也可能该证书为伪造证书。请重新输入准确的 证书编号 与 姓名（单位名称）信息后，再查询。谢谢您的关注。</p>
+      <p>如有疑问，请通知持证人与我会联系。</p>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" style="width:100px" @click="handleErrorClose">确 定</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { getCodeImg,checkCode} from "@/api/login";
-import { getACert } from "@/api/system/grad";
+import { getCodeImg, checkCode } from '@/api/login'
+import { getACert } from '@/api/system/grad'
 import html2Canvas from 'html2canvas'
 export default {
   data() {
     return {
-      userName: "",
-      certNumber: "",
-      code: "",
-      codeUrl:"",
-      captchaEnabled:true,
-      uuid:"",
+      radio:'1',
+      userName: '',
+      certNumber: '',
+      code: '',
+      codeUrl: '',
+      captchaEnabled: true,
+      uuid: '',
       dialogVisible: false,
-      iconShow:false,
-      dist:"cert_b_type",
-      pageData: null, //接收html格式代码
-      htmlTitle: "结业证书",
+      iconShow: false,
+      dist: 'cert_b_type',
+      pageData: null, // 接收html格式代码
+      htmlTitle: '结业证书',
       isShow: true,
       isCanvas: false,
       downType: false, // false为 pdf , true为图片
-      data:{
-        certId: "11111111",
-        certName: "222",
+      data: {
+        certId: '11111111',
+        certName: '222',
         certType: 0,
-        courseHours: "222",
-        courseName: "222",
+        courseHours: '222',
+        courseName: '222',
         createBy: null,
         createTime: null,
         id: 3,
-        issueDate: "2022-11-29",
-        level: "22",
-        picture: "/profile/2022/222_A00.jpg",
+        issueDate: '2022-11-29',
+        level: '22',
+        picture: '/profile/2022/222_A00.jpg',
         remark: null,
-        trainPeriod: "222",
+        trainPeriod: '222',
         uesrName: null,
         updateBy: null,
-        updateDate: "2022-12-13T15:29:56.000+08:00",
+        updateDate: '2022-12-13T15:29:56.000+08:00',
         updateTime: null,
-        url: "/profile/upload/2022/12/13/pro1_page-0001_20221213151348A006.jpg",
-        userEmail:"222222",
-        userId: "2222",
-        userPhone: "222"
+        url: '/profile/upload/2022/12/13/pro1_page-0001_20221213151348A006.jpg',
+        userEmail: '222222',
+        userId: '2222',
+        userPhone: '222'
       },
-      imgUrl:'',
-      errorDialog:false,
-      word:''
-    };
+      imgUrl: '',
+      errorDialog: false,
+      word: ''
+    }
+  },
+  mounted() {
+    this.getCode()
   },
-  methods:{
+  methods: {
     getCode() {
       getCodeImg().then(res => {
         // console.log(res)
-        this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled;
+        this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
         if (this.captchaEnabled) {
-          this.codeUrl = "data:image/gif;base64," + res.img;
-          this.uuid = res.uuid;
+          this.codeUrl = 'data:image/gif;base64,' + res.img
+          this.uuid = res.uuid
         }
-      });
+      })
     },
-    async handleSearch(){
-       this.iconShow = true
-        if( this.isBlock(this.userName)){
-          this.iconShow = false
-          this.$message.error("请输入持证人姓名或单位名称！")
-          return;
-        }
-        if( this.isBlock(this.certNumber)){
-          this.iconShow = false
-          this.$message.error("请输入证书编码！")
-          return;
-        }
-        if( this.isBlock(this.code)){
-          this.iconShow = false
-          this.$message.error("请输入验证码！")
-          return;
-        }
-        const form = {
-          userName: this.userName,
-          certNumber: this.certNumber,
-          certType:1
-        }
-        const codeForm = {
-          code: this.code,
-          uuid: this.uuid
-        }
-        try{
-          let codeRes = await checkCode(codeForm)
-          // console.log(codeRes)
-          if(codeRes.code===200){
-            try{
-              getACert(form).then(res=>{
-                if(res.data){
-                  this.iconShow = false
-                  this.data = res.data
-                  // console.log(this.data)
-                  let backimg = this.realUrl(this.data.url)
-                  this.htmlTitle = this.data.uesrName
-                  this.data.backurl = backimg
+    async handleSearch() {
+      this.iconShow = true
+      if (this.isBlock(this.userName)) {
+        this.iconShow = false
+        this.$message.error('请输入持证人姓名或单位名称！')
+        return
+      }
+      if (this.isBlock(this.certNumber)) {
+        this.iconShow = false
+        this.$message.error('请输入证书编码！')
+        return
+      }
+      if (this.isBlock(this.code)) {
+        this.iconShow = false
+        this.$message.error('请输入验证码！')
+        return
+      }
+      const form = {
+        userName: this.userName,
+        certNumber: this.certNumber,
+        certType: Number(this.radio)
+      }
+      const codeForm = {
+        code: this.code,
+        uuid: this.uuid
+      }
+      try {
+        const codeRes = await checkCode(codeForm)
+        // console.log(codeRes)
+        if (codeRes.code === 200) {
+          try {
+            getACert(form).then(res => {
+              if (res.data) {
+                this.iconShow = false
+                this.data = res.data
+                // console.log(this.data)
+                const backimg = this.realUrl(this.data.url)
+                this.htmlTitle = this.data.uesrName
+                this.data.backurl = backimg
+                if(this.radio=='1'){
+                  //结业证书
                   // 创建html代码
                   this.makeHtml()
-                  this.$nextTick(()=>{
-                    // 将html代码=>canvas=>img
-                    this.toImg()
-                    this.dialogVisible = true
-                    // 然后删除掉用完的html代码
-                    let e = document.getElementById('pdfDomm')
-                    e.innerHTML = ""
-                  })
                 }else{
-                  this.errorDialog = true
-                }
-                
-              })
-              setTimeout(()=>{
-                if(this.iconShow){
-                  this.iconShow = false
+                  this.makeTimeHtml()
                 }
-              },10000)
-            }catch(error){
-              this.iconShow = false
-              this.getCode()
-            }
+                this.$nextTick(() => {
+                  // 将html代码=>canvas=>img
+                  this.toImg()
+                  this.dialogVisible = true
+                  // 然后删除掉用完的html代码
+                  // const e = document.getElementById('pdfDomm')
+                  // e.innerHTML = ''
+                })
+              } else {
+                this.errorDialog = true
+              }
+            })
+            setTimeout(() => {
+              if (this.iconShow) {
+                this.iconShow = false
+              }
+            }, 10000)
+          } catch (error) {
+            this.iconShow = false
+            this.getCode()
           }
-        }catch(err){
-          this.iconShow = false
-          this.getCode()
         }
+      } catch (err) {
+        this.iconShow = false
+        this.getCode()
+      }
     },
-    isBlock(str){
-      if(str===""){
+    isBlock(str) {
+      if (str === '') {
         return true
-      }else {
+      } else {
         return false
       }
     },
-    handleClose(){
+    handleClose() {
       this.iconShow = false
       this.getCode()
       this.dialogVisible = false
     },
-    handleErrorClose(){
+    handleErrorClose() {
       this.iconShow = false
       this.getCode()
       this.errorDialog = false
     },
-    realUrl(val){
+    realUrl(val) {
       return process.env.VUE_APP_BASE_API + val
     },
-    toImg(){
+    toImg() {
       // 将html代码=>canvas=>img
       var htmlID = document.getElementById('pdfDomm')
       const that = this
@@ -245,33 +259,51 @@ export default {
         allowTaint: true,
         // 下面两个用来提高清晰度
         // dpi: window.devicePixelRatio*4, //将分辨率提高到特定的DPI 提高四倍
-        dpi: 300, //将分辨率提高到特定的DPI 提高四倍
-        scale:4, //按比例增加分辨率
+        dpi: 300, // 将分辨率提高到特定的DPI 提高四倍
+        scale: 4, // 按比例增加分辨率
         useCORS: true // 【重要】开启跨域配置
-      }).then(function (canvas) {
-        var pageData = canvas.toDataURL('image/png', 1.0);
+      }).then(function(canvas) {
+        var pageData = canvas.toDataURL('image/png', 1.0)
         that.imgUrl = pageData
       })
     },
-    downloadImg(){
-      const el = document.createElement("a");
+    downloadImg() {
+      const el = document.createElement('a')
       // 设置 href 为图片经过 base64 编码后的字符串，默认为 png 格式
-      el.href = this.$refs.certimg.src;
-      el.download = this.htmlTitle;
+      el.href = this.$refs.certimg.src
+      el.download = this.htmlTitle
       // 创建一个点击事件并对 a 标签进行触发
-      const event = new MouseEvent("click");
+      const event = new MouseEvent('click')
       el.dispatchEvent(event)
     },
-    makeHtml(){
+    makeHtml() {
       // js写html代码
-      let e = document.getElementById('pdfDomm')
+      const e = document.getElementById('pdfDomm')
       this.word = `<div class="proBox" >
           <img class="proBox-img" src="${window.location.origin}${this.data.backurl}" >
           <div class="con train-con" >
-            <p>
+            <p style="margin:0">
               <span class="con-name heiti">${this.data.uesrName}</span>于<span class="train-span heiti">${this.data.trainPeriod}</span>
               参加了<span class="train-span heiti">${this.data.certName}</span>学习，已修完教学计划规定的全部课程，计<span class="train-span heiti">${this.data.courseHours}</span>学时，经考核成绩合格，准予结业。
             </p>
+            <p style="margin:0">特发此证。</p>
+          </div>
+          <span class="foot-cert train-foot-cert">${this.data.certId}</span>
+          <span class="foot-date train-foot-date">${this.data.issueDate}</span>
+      </div>`
+      e.innerHTML = this.word
+    },
+    makeTimeHtml() {
+      // js写html代码
+      const e = document.getElementById('pdfDomm')
+      this.word = `<div class="proBox" >
+          <img class="proBox-img" src="${window.location.origin}${this.data.backurl}" >
+          <div class="con train-con" >
+            <p style="margin:0">
+              兹证明<span class="con-name heiti">${this.data.uesrName}</span>同志，身份证号：<span>${this.data.userId}</span>，于<span class="train-span heiti">${this.data.trainPeriod}</span>
+              参加了<span class="train-span heiti">${this.data.certName}</span>学习，已修完教学计划规定的全部课程，计<span class="train-span heiti">${this.data.courseHours}</span>学时，经考核成绩合格，准予结业。
+            </p>
+            <p style="margin:0">特发此证。</p>
           </div>
           <span class="foot-cert train-foot-cert">${this.data.certId}</span>
           <span class="foot-date train-foot-date">${this.data.issueDate}</span>
@@ -279,28 +311,29 @@ export default {
       e.innerHTML = this.word
     }
 
-  },
-  mounted(){
-    this.getCode()
   }
-};
+}
 </script>
 
 <style>
 .train-con{
-  top: 125px;
+  top: 138px;
   bottom: 0;
   line-height: 40px;
 }
+.train-con p{
+  text-align: justify;
+  text-align-last: left;
+}
 .train-span{
   margin: 0 10px;
 }
 .train-foot-cert{
-  left: 200px;
-  bottom: 103px;
+  left: 190px;
+  bottom: 130px;
 }
 .train-foot-date{
-  left: 200px;
-  bottom: 78px;
+  left: 190px;
+  bottom: 104px;
 }
 </style>

ruoyi-ui/src/views/login.vue

@@ -53,10 +53,18 @@
           <router-link class="link-type" :to="'/register'">立即注册</router-link>
         </div>
       </el-form-item>
+      <el-form-item style="width:100%;">
+        <p @click="showLink">快速链接 <i :class="linkShow?'el-icon-arrow-up':'el-icon-arrow-down'" /></p>
+        <div v-show="linkShow">
+          <router-link to="/certInquire/member" tag="a" target="_blank" class="fast-link">会员、理事证书、聘书查询</router-link>
+          <router-link to="/certInquire/profess" tag="a" target="_blank" class="fast-link">专业能力证书查询</router-link>
+          <router-link to="/certInquire/train" tag="a" target="_blank" class="fast-link">结业证书、学时证明查询</router-link>
+        </div>
+      </el-form-item>
     </el-form>
     <!--  底部  -->
     <div class="el-login-footer">
-      <span>Copyright © 2018-2022 ruoyi.vip All Rights Reserved.</span>
+      <!-- <span>Copyright © 2018-2022 ruoyi.vip All Rights Reserved.</span> -->
     </div>
   </div>
 </template>
@@ -76,7 +84,8 @@ export default {
         password: "admin123",
         rememberMe: false,
         code: "",
-        uuid: ""
+        uuid: "",
+
       },
       loginRules: {
         username: [
@@ -92,8 +101,10 @@ export default {
       captchaEnabled: true,
       // 注册开关
       register: false,
-      redirect: undefined
+      redirect: undefined,
+      linkShow:true
     };
+
   },
   watch: {
     $route: {
@@ -150,6 +161,9 @@ export default {
           });
         }
       });
+    },
+    showLink(){
+      this.linkShow = !this.linkShow
     }
   }
 };
@@ -161,7 +175,7 @@ export default {
   justify-content: center;
   align-items: center;
   height: 100%;
-  background-image: url("../assets/images/login-background.jpg");
+  background-image: url("../assets/images/img31.jpg");
   background-size: cover;
 }
 .title {
@@ -173,7 +187,7 @@ export default {
 .login-form {
   border-radius: 6px;
   background: #ffffff;
-  width: 400px;
+  width: 550px;
   padding: 25px 25px 5px 25px;
   .el-input {
     height: 38px;
@@ -216,4 +230,14 @@ export default {
 .login-code-img {
   height: 38px;
 }
+.fast-link{
+  margin-right: 20px;
+  color: #1890ff;
+  text-decoration: underline;
+}
+.fast-link:hover{
+  margin-right: 20px;
+  color: #1063b1;
+  text-decoration: underline;
+}
 </style>

ruoyi-ui/src/views/register.vue

@@ -61,7 +61,7 @@
     </el-form>
     <!--  底部  -->
     <div class="el-register-footer">
-      <span>Copyright © 2018-2022 ruoyi.vip All Rights Reserved.</span>
+      <!-- <span>Copyright © 2018-2022 ruoyi.vip All Rights Reserved.</span> -->
     </div>
   </div>
 </template>
@@ -151,7 +151,7 @@ export default {
   justify-content: center;
   align-items: center;
   height: 100%;
-  background-image: url("../assets/images/login-background.jpg");
+  background-image: url("../assets/images/img31.jpg");
   background-size: cover;
 }
 .title {

ruoyi-ui/vue.config.js

@@ -7,9 +7,9 @@ function resolve(dir) {
 
 const CompressionPlugin = require('compression-webpack-plugin')
 
-const name = process.env.VUE_APP_TITLE || '若依管理系统' // 网页标题
+const name = process.env.VUE_APP_TITLE || '证书管理系统' // 网页标题
 
-const port = process.env.port || process.env.npm_config_port || 80 // 端口
+const port = process.env.port || process.env.npm_config_port || 8089 // 端口
 
 // vue.config.js 配置说明
 //官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions
@@ -36,7 +36,7 @@ module.exports = {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
         target: `http://localhost:8080`,
-        // target: `http://192.168.0.100:8080`,
+        // target: `http://192.168.0.104:8080`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''