|
|
@@ -0,0 +1,237 @@
|
|
|
+<template>
|
|
|
+ <div class="cert-body">
|
|
|
+ <div style="padding-top: 1rem;">
|
|
|
+ <div class="box_title">特种作业操作证及安全生产知识和</div>
|
|
|
+ <div class="box_title">管理能力考核合格信息查询平台</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-card style="border-radius: 10px; margin: 20px;">
|
|
|
+ <div class="content_box_title">
|
|
|
+ <img data-v-10945277=""
|
|
|
+ src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFcAAAAOCAYAAABaSYBTAAAABHNCSVQICAgIfAhkiAAAANRJREFUWEftmO0NgyAYhOtOMIxr6By6RoeBnVTqR2rL6wlFOJPyy+QC3j0vIlAZY55a6/ohNHbd2S7tUWJXOcFaOyilXs++xq4zZPBx24CyA0T+GAHvZisKwK6zAf5aCtgBIn9MgL3rLArArrMAvu1PDBWYAbAIl8EcAoj00hkO4ZY2l+L9KcZARZR0CLekuXXvGBvufe/56xgx/U/B/QOeyxQK+DTcmME/Ty2h5lL3z50hCG5uc1ccxXNmCIa7mGunu4hOuIpwn08z6T2rvmS42mM7AlIFLwQXiU8MAAAAAElFTkSuQmCC" />
|
|
|
+ <span>特种作业操作证查询</span>
|
|
|
+ <img
|
|
|
+ src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFcAAAAOCAYAAABaSYBTAAAABHNCSVQICAgIfAhkiAAAALRJREFUWEft2LENgCAQBVCZwtoZkBHcwtItnMTedSgI29CgmGhiRBS8K0w+7YX75AEFiCpzGGMa59yglBpjU7nrIZM7g6q/yLHVWkvv/dSuIzaPux4yuTMo+7/GpQwt2Zi/wYb1vsIFbNmNecQFbBns48kFbDlsEhew32BvcQH7HTaKC1ga2AsuYOlgT7iApYU9cAFLD7vhApYHdsftpZRz7Elqra3XT5qOqx4yuTO4+6f+ZhZW89Ai/bICGAAAAABJRU5ErkJggg==" />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-if="showTable">
|
|
|
+ <p style="text-align: center;margin-top: 1rem;">最新证书信息</p>
|
|
|
+ <div class="certificate-cards">
|
|
|
+ <div v-for="(certificate, index) in certificates" :key="index" class="card">
|
|
|
+ <el-table :data="certificate.tableData" border style="width: 100%" :show-header="false">
|
|
|
+ <el-table-column prop="label" label="项目"
|
|
|
+ width="150"
|
|
|
+ :cell-style="{ backgroundColor: '#000' }"/>
|
|
|
+ <el-table-column prop="value" label="内容" />
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <div class="remark" v-if="certificate.remark">
|
|
|
+ 备注：{{ certificate.remark }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-else>
|
|
|
+ <el-form class="sign-serach" :rules="rules" :inline="false" :model="searchInfo" ref="searchForm"
|
|
|
+ label-width="80px">
|
|
|
+ <el-form-item label="身份证号" prop="cardId">
|
|
|
+ <el-input placeholder="输入身份证" v-model="searchInfo.cardId" type="text" style="width:260px;"
|
|
|
+ clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="学员姓名" prop="nickname">
|
|
|
+ <el-input placeholder="输入姓名" v-model="searchInfo.nickname" type="text" style="width:260px;"
|
|
|
+ clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+
|
|
|
+ <el-form-item label="校验码" prop="code">
|
|
|
+ <el-input placeholder="校验码" v-model="searchInfo.code" type="text" style="width:130px;" clearable></el-input>
|
|
|
+ <span class="qr-code ng-scope" @click="changeCode()">
|
|
|
+ <img alt="验证码" :src="codeShow" v-show="codeShow">
|
|
|
+ </span>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item class="form-btn-group" label-width="0px">
|
|
|
+ <el-button size="medium" @click="resetForm">重 置</el-button>
|
|
|
+ <el-button size="medium" type="primary" @click="queryCertificate">查 询</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+
|
|
|
+ <div class="mess_style">
|
|
|
+ <div class="mess_explain">
|
|
|
+ <img
|
|
|
+ src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAABHNCSVQICAgIfAhkiAAAATZJREFUSIm1lrtxwzAQRA8czTh36h5UgBKjEVfgBpyJylyDmwEVuhnHzp4DH6QT/hKlneFwCO7eLsATICcdAF5E9mbI630RkaOIiHNu7tWpFgcCOUpjANcZJYWCGvqE44FZLwtfrlpP3xZcaq1ZfVY2fYPzNGiUBzSEagrgHfgFvhocXzSyCRril2Tt3xrcuOTBDg51CPBtuNsO9zwbM72mgQqfgU9gN8CNdcNGzj+uLpxzPyLyMcq3juE0rTHe0NKq5v879z64EfgbTALApM9LT7AG0cQ/qP4xmiwip9323thHk4djEpGDdb0XTGMcJufcog/Zdr4Sr5lrttfkyYZbmNpm2xNrz6eX74TJTOovB8HloVeuwejptlZLfmbPtYbQ5OmRPR6uYIYWm6n/iymGudXsquJ/zhquFSAu+Z8AAAAASUVORK5CYII=" />
|
|
|
+ <span>说明</span>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 4rem;">
|
|
|
+ <div class="mess_title">01、法律依据</div>
|
|
|
+ <div class="mess_text">
|
|
|
+ 《安全生产法》第三十条规定，生产经营单位的特种作业人员必须按照国家有关规定经专门的安全作业培训，取得相应资格，方可上岗作业。
|
|
|
+ </div>
|
|
|
+ <div class="mess_title">02、查询范围</div>
|
|
|
+ <div class="mess_text">
|
|
|
+ 本平台提供由应急管理部门及矿山安全监管部门按照国家有关规定经专门的安全作业培训，取得相应资格的特种作业人员操作证件信息查询。
|
|
|
+ </div>
|
|
|
+ <div class="mess_title">03、相关说明</div>
|
|
|
+ <div class="mess_text">
|
|
|
+ 平台中数据由各省级应急管理部门及矿山安全监管部门提供，如对查询结果存有疑问，请与原发证部门联系。
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ httpServer
|
|
|
+ } from "@/components/httpServer/httpServer.js";
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ codeShow: '',
|
|
|
+ showTable: false,
|
|
|
+ certificates: [],
|
|
|
+ searchInfo: {
|
|
|
+ cardId: '',
|
|
|
+ nickname: '',
|
|
|
+ code: '',
|
|
|
+ courseType: '特种作业',
|
|
|
+ captchaId: '',
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ code: [{
|
|
|
+ required: true,
|
|
|
+ message: '请输入校验码',
|
|
|
+ trigger: 'blur'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ len: 5,
|
|
|
+ message: '校验码有误',
|
|
|
+ trigger: 'blur'
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ nickname: [{
|
|
|
+ required: true,
|
|
|
+ message: '请输入姓名',
|
|
|
+ trigger: 'blur',
|
|
|
+ min: 2
|
|
|
+ }],
|
|
|
+ cardId: [{
|
|
|
+ required: true,
|
|
|
+ message: '请输入身份证号码',
|
|
|
+ trigger: 'blur'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ validator: (rule, value, callback) => {
|
|
|
+ if (!value) {
|
|
|
+ return callback(new Error('请输入身份证号码'));
|
|
|
+ }
|
|
|
+ const cleanValue = value.replace(/[\s()]/g, '').toUpperCase();
|
|
|
+ const mainlandReg = /^[1-9]\d{5}(18|19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\d|3[01])\d{3}[\dXx]$/;
|
|
|
+ const hkReg = /^(?:C(?:\d{8}|[A-HJ-NP-Z]\d{7})|[HM](?:\d{10}|\d{8}))$/;
|
|
|
+ if (mainlandReg.test(cleanValue) || hkReg.test(cleanValue)) {
|
|
|
+ callback();
|
|
|
+ } else {
|
|
|
+ callback(new Error('请输入正确的大陆身份证（18位）或香港身份证（如 A1234567）'));
|
|
|
+ }
|
|
|
+ },
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ resetForm() {
|
|
|
+ this.searchInfo.cardId = '';
|
|
|
+ this.searchInfo.nickname = '';
|
|
|
+
|
|
|
+ },
|
|
|
+ changeCode() {
|
|
|
+ httpServer("Auth.GetValidateCode", {}).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.codeShow = res.data.codeData;
|
|
|
+ this.searchInfo.captchaId = res.data.captchaId;
|
|
|
+ } else {
|
|
|
+ this.codeShow = ''
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ packData(data) {
|
|
|
+ this.showTable = true;
|
|
|
+ this.certificates = [];
|
|
|
+ for (let i in data) {
|
|
|
+ let item = data[i];
|
|
|
+ this.certificates.push({
|
|
|
+ remark: `本证书应于${item.reviewDate}前进行复审`,
|
|
|
+ tableData: [{
|
|
|
+ label: '姓名',
|
|
|
+ value: item.nickname
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '性别',
|
|
|
+ value: item.gender
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '作业类别',
|
|
|
+ value: item.certificateType
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '操作项目',
|
|
|
+ value: item.courseName
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '签发机关',
|
|
|
+ value: item.certificateOrgan
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '初领日期',
|
|
|
+ value: item.signDate
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '有效期开始日期',
|
|
|
+ value: item.startDate
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '有效期结束日期',
|
|
|
+ value: item.endDate
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '应复审日期',
|
|
|
+ value: item.reviewDate
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '实际复审日期',
|
|
|
+ value: item.realReviewDate
|
|
|
+ },
|
|
|
+ ]
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ queryCertificate() {
|
|
|
+ this.$refs.searchForm.validate(valid => {
|
|
|
+ if (!valid) this.changeCode();
|
|
|
+ let param = Object.assign({}, this.searchInfo);
|
|
|
+ httpServer("Auth.QueryCert", param).then(res => {
|
|
|
+ this.changeCode();
|
|
|
+ if (res.code != 200) return;
|
|
|
+ this.packData(res.data || []);
|
|
|
+ this.showTable = true;
|
|
|
+ this.changeCode()
|
|
|
+ })
|
|
|
+
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.changeCode();
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+ @import url("./index.css");
|
|
|
+</style>
|
