新增接口页面

马宇豪

2023-10-07 21e03c21386fb124774df48c8bb1fe3b185dbb48

新增接口页面

 .env.development

@@ -6,9 +6,10 @@

# 若依管理系统/开发环境
#黄镇
VUE_APP_BASE_API = 'http://192.168.0.41:8085'
#VUE_APP_BASE_API = 'http://192.168.0.47:8085'

#张凤
#VUE_APP_BASE_API = 'http://192.168.0.70:8085'
VUE_APP_BASE_API = 'http://192.168.0.70:8085'

# 路由懒加载
VUE_CLI_BABEL_TRANSPILE_MODULES = true

 src/api/coalMine/jobRegist.js

New file
@@ -0,0 +1,53 @@
import request from '@/utils/request'

// 数据分页
export function getJobRegistPage(query) {
  return request({
    url: '/work/registration/list/page',
    method: 'get',
    params: query
  })
}

// 获取数据
export function getJobRegist(id) {
  return request({
    url: '/work/registration/get/' + id,
    method: 'get'
  })
}

// 新增数据
export function addJobRegist(data) {
  return request({
    url: '/work/registration/add',
    method: 'post',
    data: data
  })
}

// 修改数据
export function editJobRegist(data) {
  return request({
    url: '/work/registration/mod',
    method: 'post',
    data: data
  })
}

// 删除数据
export function delJobRegist(ids) {
  return request({
    url: '/work/registration/del/batch/' + ids,
    method: 'delete'
  })
}

// 上传
export function uploadFile(data) {
  return request({
    url: '/attachment/upload/detail',
    method: 'post',
    data: data
  })
}

 src/api/coalMine/teacher.js

New file
@@ -0,0 +1,114 @@
import request from '@/utils/request'

// 数据分页
export function getTeacherPage(query) {
  return request({
    url: '/teacherManage/page',
    method: 'get',
    params: query
  })
}

// 获取数据
export function getTeacher(id) {
  return request({
    url: '/teacherManage/' + id,
    method: 'get'
  })
}

// 新增数据
export function addTeacher(data) {
  return request({
    url: '/teacherManage/add',
    method: 'post',
    data: data
  })
}

// 修改数据
export function editTeacher(data) {
  return request({
    url: '/teacherManage/update',
    method: 'post',
    data: data
  })
}

// 删除数据
export function delTeacher(id) {
  return request({
    url: '/teacherManage/del/' + id,
    method: 'get'
  })
}

// 停用数据
export function abortTeacher(data) {
  return request({
    url: '/teacherManage/updateStatus',
    method: 'post',
    data: data
  })
}

// 删除数据
export function delTeacherOperate(id) {
  return request({
    url: '/teacherManage/operateType/del/' + id,
    method: 'get'
  })
}

// 数据分页
export function getExaminerPage(query) {
  return request({
    url: '/examinerManage/page',
    method: 'get',
    params: query
  })
}

// 新增数据
export function addExaminer(data) {
  return request({
    url: '/examinerManage/add',
    method: 'post',
    data: data
  })
}

// 修改数据
export function editExaminer(data) {
  return request({
    url: '/examinerManage/update',
    method: 'post',
    data: data
  })
}

// 删除数据
export function delExaminer(id) {
  return request({
    url: '/examinerManage/del/' + id,
    method: 'get'
  })
}

// 停用数据
export function abortExaminer(data) {
  return request({
    url: '/examinerManage/updateStatus',
    method: 'post',
    data: data
  })
}

// 上传
export function uploadFile(data) {
  return request({
    url: '/attachment/upload/detail',
    method: 'post',
    data: data
  })
}

 src/api/coalMine/violation.js

New file
@@ -0,0 +1,53 @@
import request from '@/utils/request'

// 数据分页
export function getViolationPage(query) {
  return request({
    url: '/violation/registration/page/list',
    method: 'get',
    params: query
  })
}

// 获取数据
export function getViolation(id) {
  return request({
    url: '/violation/registration/get/' + id,
    method: 'get'
  })
}

// 新增数据
export function addViolation(data) {
  return request({
    url: '/violation/registration/add',
    method: 'post',
    data: data
  })
}

// 修改数据
export function editViolation(data) {
  return request({
    url: '/violation/registration/mod',
    method: 'post',
    data: data
  })
}

// 删除数据
export function delViolation(ids) {
  return request({
    url: '/violation/registration/del/batch/' + ids,
    method: 'delete'
  })
}

// 上传
export function uploadFile(data) {
  return request({
    url: '/attachment/upload/detail',
    method: 'post',
    data: data
  })
}

 src/api/notCoalMine/certifiate.js

New file
@@ -0,0 +1,10 @@
import request from '@/utils/request'

// 数据分页
export function getCertificatePage(query) {
  return request({
    url: '/nc/cert/page/list',
    method: 'get',
    params: query
  })
}

 src/main.js

@@ -37,7 +37,8 @@
import VueMeta from 'vue-meta'
// 字典数据组件
import DictData from '@/components/DictData'

import '@/utils/filter'
import '@/utils/validate'
// 全局方法挂载
Vue.prototype.getDicts = getDicts
Vue.prototype.getConfigKey = getConfigKey

 src/utils/filter.js

New file
@@ -0,0 +1,25 @@
import Vue from 'vue'

// 人民币过滤器
Vue.filter('moneyFormat', (value) => {
  return '¥' + Number(value).toFixed(2);
});
// 三位数姓名脱敏，中间一位隐藏
Vue.filter('threeName', (value) => {
  return value.replace(/(?<=[\u4e00-\u9fa5]).*(?=[\u4e00-\u9fa5])/, "*");
});
//身份证脱敏展示
Vue.filter('peridcardtm', (value) => {
  return value.replace(/^(.{3})(?:\d+)(.{4})$/, "$1**********$2");
});
//手机号码脱敏展示
Vue.filter('phoneteltm', (value) => {
  return value.replace(/^(.{3})(?:\d+)(.{4})$/, "$1****$2");
});
// 两位数姓名脱敏，最后一位隐藏
Vue.filter('twoName', (value) => {
  return value.replace(/.*(?=[\u4e00-\u9fa5])/, "*");
});
Vue.filter('threeName', (value) => {
  return value
});

 src/utils/request.js

@@ -50,7 +50,7 @@
      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) {
      if (s_data === requestObj.data && requestObj.time - s_time < interval && s_url === requestObj.url && s_url!=='/attachment/upload/detail') {
        const message = '数据正在处理，请勿重复提交';
        console.warn(`[${s_url}]: ` + message)
        return Promise.reject(new Error(message))

 src/views/coalMine/cJobRegistration/index.vue

@@ -88,7 +88,7 @@

<script>

import addDialog from "@/views/notCoalMine/nJobRegistration/components/addDialog.vue";
// import addDialog from "@/views/notCoalMine/nJobRegistration/components/addDialog.vue";
export default {
  name: "nViolationRegistration",
  dicts: [],

 src/views/coalMine/cPeopleManage/components/certDialog.vue

@@ -20,7 +20,6 @@
      <el-table-column label="资格类型" align="center" prop="qualificationType" />
      <el-table-column label="作业类别" align="center" prop="jobCategory" />
      <el-table-column label="操作项目" align="center" prop="operationItems" />
      <el-table-column label="人员" align="center" prop="staffId" />
      <el-table-column label="有效期至" align="center" prop="expiredTime"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">

 src/views/coalMine/cPeopleManage/components/experienceDialog.vue

@@ -16,7 +16,7 @@
    </el-row>
    <el-table v-loading="loading" :data="dataList">
      <el-table-column type="index" label="序号" width="55" align="center" />
      <el-table-column label="时间" align="center" prop="startTime">
      <el-table-column label="时间" align="center">
        <template #default="scope">
          {{scope.row.startTime.substring(0,7) + '~' + scope.row.endTime.substring(0,7)}}
        </template>

 src/views/coalMine/cPeopleManage/components/peopleDialog.vue

@@ -1,7 +1,7 @@
<template>
  <el-dialog :title="title" :visible.sync="open" width="50%" append-to-body>
    <div class="main_form">
      <el-form :model="form" :rules="rules" ref="ruleForm" label-width="200px" :label-position="labelPosition">
      <el-form :model="form" :rules="rules" ref="ruleForm" label-width="120px" :label-position="labelPosition">
        <el-row>
          <el-col :span="20">
            <el-form-item label="姓名" prop="name">
@@ -50,7 +50,14 @@
        <el-row>
          <el-col :span="20">
            <el-form-item label="最高学历" prop="eduLevel">
              <el-input v-model="form.eduLevel" :readonly="disable"></el-input>
              <el-select v-model="form.eduLevel" placeholder="请选择" :disabled="disable" style="width: 100%">
                <el-option
                  v-for="dict in dict.type.sys_highest_education_code"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
@@ -75,8 +82,82 @@
            </el-form-item>
          </el-col>
        </el-row>
        <template v-if="title == '查看人员'">
          <el-row v-if="form.violationRegistrationVOS && form.violationRegistrationVOS.length>0">
            <el-col :span="24">
              <el-form-item label="违章记录">
                <el-table :data="form.violationRegistrationVOS" border>
                  <el-table-column label="发生时间" align="center" prop="violationTime"/>
                  <el-table-column label="违章（时）所属单位" align="center" prop="dept"/>
                  <el-table-column label="作业类别/操作项目" align="center" prop="dept"/>
                </el-table>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row v-if="form.cmStaffResumes && form.cmStaffResumes.length>0">
            <el-col :span="24">
              <el-form-item label="个人履历">
                <el-table :data="form.cmStaffResumes" border>
                  <el-table-column label="时间" align="center">
                    <template #default="scope">
                      {{scope.row.startTime.substring(0,7) + '~' + scope.row.endTime.substring(0,7)}}
                    </template>
                  </el-table-column>
                  <el-table-column label="单位" align="center" prop="unit" />
                </el-table>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row v-if="form.cmStaffQas && form.cmStaffQas.length>0">
            <el-col :span="24">
              <el-form-item label="资格证书">
                <el-table :data="form.cmStaffQas" border>
                  <el-table-column label="证书名称" align="center" prop="name"/>
                  <el-table-column label="资格类型" align="center" prop="qualificationType" />
                  <el-table-column label="作业类别" align="center" prop="jobCategory" />
                  <el-table-column label="操作项目" align="center" prop="operationItems" />
                  <el-table-column label="人员" align="center" prop="staffId" />
                  <el-table-column label="有效期至" align="center" prop="expiredTime"/>
                </el-table>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row v-if="form.cmStaffTrains && form.cmStaffTrains.length>0">
            <el-col :span="24">
              <el-form-item label="培训经历">
                <el-table :data="form.cmStaffTrains" border>
                  <el-table-column label="培训时间" align="center" prop="startTime">
                    <template #default="scope">
                      {{scope.row.startTime.substring(0,7) + '~' + scope.row.endTime.substring(0,7)}}
                    </template>
                  </el-table-column>
                  <el-table-column label="培训单位" align="center" prop="unit" />
                  <el-table-column label="所属批次" align="center" prop="batch" />
                  <el-table-column label="科目" align="center" prop="subject" />
                </el-table>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row v-if="form.cmStaffExams && form.cmStaffExams.length>0">
            <el-col :span="24">
              <el-form-item label="考试经历">
                <el-table :data="form.cmStaffExams" border>
                  <el-table-column label="考试时间" align="center" prop="examTime"/>
                  <el-table-column label="考试中心" align="center" prop="examCenter"/>
                  <el-table-column label="科目" align="center" prop="subject"/>
                  <el-table-column label="考试结果" align="center" prop="result">
                    <template #default="scope">
                      {{scope.row.result == 0 ? '通过' : '未通过'}}
                    </template>
                  </el-table-column>
                </el-table>
              </el-form-item>
            </el-col>
          </el-row>
        </template>
      </el-form>
      <div style="width: 100%;padding-bottom: 30px;display: flex;justify-content: center">
        <el-button @click="open = false">取消</el-button>
        <el-button v-if="title == '查看人员'" type="primary" @click="open = false">确认</el-button>
        <el-button v-else type="primary" @click="submit()">提交</el-button>
      </div>
@@ -92,7 +173,7 @@
import { verifySimplePhone, verifyIdCard } from "@/utils/validate";
export default {
  name: "peopleDialog",
  dicts: ['sys_nation_code'],
  dicts: ['sys_nation_code','sys_highest_education_code'],
  data() {
    var validatePass = (rule, value, callback) => {
      if (this.fileList.length == 0) {
@@ -154,15 +235,11 @@
  },
  created() {
    const t = this
    const width = document.documentElement.clientWidth
    if(width < 750){t.labelPosition = 'top'}
  },
  methods: {
    openDialog(val,type){
      const t = this
      t.fileList = []
      const width = document.documentElement.clientWidth
      if(width < 750){this.labelPosition = 'top'}
      t.open = true
      if(type == 'add'){
        t.title = '新增人员'
@@ -181,26 +258,46 @@
        if(type == 'edit'){
          t.title = '编辑人员'
          t.disable = false
          if(val){
            for(let i in val){
              if(t.isValidKey(i,this.form)){
                t.form[i] = val[i]
              }
            }
            t.form.sex = Number(t.form.sex)
            // 仅限单张图片处理
            t.form.photoAttachment = val.photoAttachment.id
            let file = {
              name: val.photoAttachment.fileName,
              url: process.env.VUE_APP_BASE_API + val.photoAttachment.fileUrl
            }
            t.fileList.push(file)
          }
        }else{
          t.title = '查看人员'
          t.disable = true
        }
        if(val){
          for(let i in val){
            if(t.isValidKey(i,this.form)){
              t.form[i] = val[i]
          if(val){
            for(let i in val){
              if(t.isValidKey(i,this.form)){
                t.form[i] = val[i]
              }
            }
            t.form.sex = Number(t.form.sex)
            t.form.violationRegistrationVOS = val.violationRegistrationVOS
            t.form.cmStaffResumes = val.cmStaffResumes
            t.form.cmStaffQas = val.cmStaffQas
            t.form.cmStaffTrains = val.cmStaffTrains
            t.form.cmStaffExams = val.cmStaffExams
            // 仅限单张图片处理
            t.form.photoAttachment = val.photoAttachment.id
            let file = {
              name: val.photoAttachment.fileName,
              url: process.env.VUE_APP_BASE_API + val.photoAttachment.fileUrl
            }
            t.fileList.push(file)
          }
          t.form.sex = Number(t.form.sex)
          // 仅限单张图片处理
          t.form.photoAttachment = val.photoAttachment.id
          let file = {
            name: val.photoAttachment.fileName,
            url: process.env.VUE_APP_BASE_API + val.photoAttachment.fileUrl
          }
          t.fileList.push(file)
          console.log(t.form,'form')
        }
        console.log(t.fileList,'fileList1')
      }
    },
    isValidKey(key,obj){
@@ -308,9 +405,6 @@
          })
        }
      })
    },
    changeSource(num){
      this.form.source = num
    }
  }
};

 src/views/coalMine/cPeopleManage/components/trainDialog.vue

@@ -21,9 +21,9 @@
          {{scope.row.startTime.substring(0,7) + '~' + scope.row.endTime.substring(0,7)}}
        </template>
      </el-table-column>
      <el-table-column label="培训单位" align="center" prop="unit" />
      <el-table-column label="所属批次" align="center" prop="batch" />
      <el-table-column label="科目" align="center" prop="subject" />
      <el-table-column label="培训单位" align="center" prop="unit"/>
      <el-table-column label="所属批次" align="center" prop="batch"/>
      <el-table-column label="科目" align="center" prop="subject"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
          <el-button

 src/views/coalMine/cPeopleManage/index.vue

@@ -51,7 +51,11 @@
          {{getNationName(scope.row.nationCode)}}
        </template>
      </el-table-column>
      <el-table-column label="最高学历" align="center" prop="eduLevel"/>
      <el-table-column label="最高学历" align="center" prop="eduLevel">
        <template #default="scope">
          {{getDegreeName(scope.row.eduLevel)}}
        </template>
      </el-table-column>
      <el-table-column label="证件照片" align="center" prop="photoPath">
        <template #default="scope">
          <el-button type="text" @click="viewFile(scope.row.photoAttachment)">预览</el-button>
@@ -114,7 +118,7 @@
import { getToken } from "@/utils/auth";
export default {
  name: "cPeopleManage",
  dicts: ['sys_nation_code'],
  dicts: ['sys_nation_code','sys_highest_education_code'],
  components: { peopleDialog, experienceDialog, certDialog, trainDialog, examDialog },
  data() {
    return {
@@ -155,7 +159,15 @@
      if(obj){
        return obj.label
      }else{
        return '无'
        return '未知'
      }
    },
    getDegreeName(code){
      let obj = JSON.parse(JSON.stringify(this.dict.type.sys_highest_education_code)).find(i=>i.value == code)
      if(obj){
        return obj.label
      }else{
        return '未知'
      }
    },
    openPeople(data,type){
@@ -203,11 +215,13 @@
      this.getPage()
    },
    resetQuery(){
      this.$refs['queryForm'].resetFields()
      this.queryParams = {
        code: '',
        name: '',
        pageNum: 1,
        pageSize: 10
      }
      this.getPage()
    },
    handleAdd(){

    },
    viewFile(file){
      axios.get(process.env.VUE_APP_BASE_API + file.fileUrl,{headers:{'Content-Type': 'application/json','Authorization': "Bearer " + getToken()},responseType: 'blob'}).then(res=>{

 src/views/coalMine/cTeacherManage/cReviewer/components/reviewerDialog.vue

New file
@@ -0,0 +1,638 @@
<template>
  <el-dialog :title="title" :visible.sync="open" width="50%" append-to-body>
    <div class="main_form">
      <el-form :model="form" :rules="rules" ref="ruleForm" label-width="200px" :label-position="labelPosition">
        <el-row>
          <el-col :span="20">
            <el-form-item label="姓名" prop="name">
              <el-input v-model="form.name" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="性别" prop="sex">
              <el-radio-group v-model="form.sex" :disabled="disable">
                <el-radio :label="0">男</el-radio>
                <el-radio :label="1">女</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="身份证号" prop="code">
              <el-input v-model="form.code" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="联系电话" prop="mobilePhone">
              <el-input v-model="form.mobilePhone" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="职称" prop="jobTitle">
              <el-input v-model="form.jobTitle" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="最高学历" prop="eduLevel">
              <el-select v-model="form.eduLevel" placeholder="请选择" style="width: 100%" :disabled="disable">
                <el-option
                  v-for="dict in dict.type.sys_highest_education_code"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="资质到期" prop="expiredTime">
              <el-date-picker
                style="width: 100%"
                v-model="form.expiredTime"
                value-format="yyyy-MM-dd"
                type="date"
                :disabled="disable"
                placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="在职情况" prop="status">
              <el-radio-group v-model="form.status" :disabled="disable">
                <el-radio label="0">正常</el-radio>
                <el-radio label="1">停用</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="描述">
              <el-input v-model="form.description" type="textarea" :autosize="{ minRows: 2}" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="证件照" prop="photoAttachment">
              <el-upload
                :disabled="disable"
                action="#"
                multiple
                :limit="1"
                :on-exceed="overLimit"
                :auto-upload="false"
                accept="image/*,.pdf"
                :file-list="resumeList"
                list-type="picture-card"
                :before-upload="beforeAvatarUpload"
                :on-change="resumeChange"
                :on-preview="handlePreview"
                :on-remove="(file,fileList)=>handleRemove(file,fileList,'证件照')">
                <i class="el-icon-plus"></i>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="资质" prop="qaAttachment">
              <el-upload
                :disabled="disable"
                action=""
                multiple
                :limit="1"
                :on-exceed="overLimit"
                :auto-upload="false"
                accept="image/*,.pdf"
                list-type="picture-card"
                :file-list="inventionList"
                :before-upload="beforeAvatarUpload"
                :on-change="inventChange"
                :on-preview="handlePreview"
                :on-remove="(file,fileList)=>handleRemove(file,fileList,'资质')">
                <i class="el-icon-plus"></i>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="工种详情" prop="operateTypes">
                <el-table :data="form.operateTypes" border>
                  <el-table-column label="序号" type="index" align="center"/>
                  <el-table-column label="资格类型" align="center" prop="qualificationType" />
                  <el-table-column label="作业类别" align="center" prop="jobCategory" />
                  <el-table-column label="操作项目" align="center" prop="operationItems"/>
                  <el-table-column label="操作" align="center" class-name="small-padding fixed-width" v-if="disable == false">
                    <template #default="scope">
<!--                      <el-button size="mini" type="text" icon="el-icon-edit" @click="openEdit(scope.row,'edit')">编辑</el-button>-->
                      <el-button size="mini" type="text" icon="el-icon-delete" @click="deleteItem(scope.index)" v-hasPermi="['system:experts:remove']">删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>
                <el-button v-if="disable == false" @click="openEdit({},'add')" style="margin-top: 15px">新增</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div style="width: 100%;padding-bottom: 30px;display: flex;justify-content: center" v-if="disable == false">
        <el-button type="primary" @click="submit()">提交</el-button>
      </div>
      <el-dialog :visible.sync="dialogVisible" append-to-body>
        <img width="100%" :src="dialogImageUrl" alt="">
      </el-dialog>
      <el-dialog :title="dialogTitle" :visible.sync="addVisible" width="50%" append-to-body>
        <el-form :model="addForm" :rules="addRules" ref="addRuleForm" label-width="200px">
          <el-row>
            <el-col :span="20">
              <el-form-item label="资格类型" prop="operate">
                <el-cascader
                  v-model="addForm.operate"
                  :options="typeList"
                  style="width: 100%"
                  :props="{ expandTrigger: 'hover', value: 'id',label: 'name'}"></el-cascader>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div style="width: 100%;padding-bottom: 30px;display: flex;justify-content: center">
          <el-button type="primary" @click="submitAdd()">提交</el-button>
        </div>
      </el-dialog>
    </div>
  </el-dialog>
</template>

<script>
import { verifySimplePhone, verifyIdCard } from "@/utils/validate";
import {getOperatePage} from "@/api/coalMine/operateType";
import {addExaminer, editExaminer, uploadFile} from "@/api/coalMine/teacher";
export default {
  name: "teacherDialog",
  dicts: ['sys_highest_education_code'],
  data() {
    // let validateTypes = (rule, value, callback) => {
    //   if (this.form.operateTypes.length == 0) {
    //     callback(new Error('请添加工种详情'));
    //   } else {
    //     callback();
    //   }
    // }
    let validateResume = (rule, value, callback) => {
      if (this.resumeList.length == 0) {
        callback(new Error('请上传证件照'));
      } else {
        callback();
      }
    }
    let validateCert = (rule, value, callback) => {
      if (this.inventionList.length == 0) {
        callback(new Error('请上传资质证书'));
      } else {
        callback();
      }
    }
    let validatePhone = (rule, value, callback)=>{
      if(value === ''){
        callback(new Error('请输入手机号'))
      }else{
        if(!verifySimplePhone(value)){
          callback(new Error('手机号格式有误'))
        }else{
          callback()
        }
      }
    }
    let verifyId = (rule, value, callback)=>{
      if(value === ''){
        callback(new Error('请输入身份证号'))
      }else{
        if(!verifyIdCard(value)){
          callback(new Error('身份证号格式有误'))
        }else{
          callback()
        }
      }
    }
    return {
      title: '新增考评员',
      open: false,
      disable: false,
      labelPosition: 'right',
      form:{
        id: null,
        isCm: '1',
        name:'',
        sex:'',
        code: '',
        mobilePhone: '',
        jobTitle: '',
        eduLevel: '',
        expiredTime: '',
        status: '',
        operateTypes: [],
        photoAttachment: null,
        qaAttachment: null,
        description: '',
      },
      resumeList: [],
      inventionList: [],
      dialogImageUrl: '',
      dialogVisible: false,
      dialogTitle: '新增',
      addVisible: false,
      addForm: {
        operate: [],
        qualificationType: '',
        jobCategory: '',
        operationItems: '',
        operateTypeId: null
      },
      typeList: [],
      rules:{
        name:[{ required: true, message: '请填写姓名', trigger: 'blur'}],
        sex:[{ required: true, message: '请选择性别', trigger: 'blur'}],
        code:[{ required: true, validator: verifyId, trigger: 'blur' }],
        mobilePhone:[{ required: true, validator: validatePhone, trigger: 'blur' }],
        // code:[{ required: true, message: '请填写身份证号', trigger: 'blur'}],
        // mobilePhone:[{ required: true, message: '请填写联系方式', trigger: 'blur'}],
        jobTitle: [{ required: true, message: '请填写职称', trigger: 'blur'}],
        eduLevel: [{ required: true, message: '请选择最高学历', trigger: 'blur'}],
        expiredTime: [{ required: true, message: '请选择到期时间', trigger: 'blur'}],
        status: [{ required: true, message: '请选择在岗情况', trigger: 'blur'}],
        // operateTypes: [{ required: true,validator: validateTypes, trigger: 'blur' }],
        photoAttachment: [{ required: true,validator: validateResume, trigger: 'blur'}],
        qaAttachment: [{ required: true,validator: validateCert, trigger: 'blur'}]
      },
      addRules:{
        operate:[{ required: true, message: '请选择', trigger: 'blur' }]
      }
    };
  },
  created() {
    const t = this
  },
  methods: {
    openDialog(val,type){
      this.resumeList = []
      this.inventionList = []
      if(type == 'add'){
        this.title = '新增考评员'
        this.disable = false
        this.form = {
          id: null,
          isCm: '1',
          name:'',
          sex:'',
          code: '',
          mobilePhone: '',
          jobTitle: '',
          eduLevel: '',
          expiredTime: '',
          status: '',
          operateTypes: [],
          photoAttachment: null,
          qaAttachment: null,
          description: '',
        }
      }else{
        if(type == 'edit'){
          this.title = '编辑考评员'
          this.disable = false
        }else{
          this.title = '查看考评员'
          this.disable = true
        }
        if(val){
          for(let i in val){
            if(this.isValidKey(i,this.form)){
              this.form[i] = val[i]
            }
          }
        }
        this.form.sex = Number(this.form.sex)
        // 仅限单张图片处理
        this.form.photoAttachment = val.photoAttachment.id
        this.form.qaAttachment = val.qaAttachment.id
        this.resumeList.push({
          name: val.photoAttachment.fileName,
          url: process.env.VUE_APP_BASE_API + val.photoAttachment.fileUrl
        })
        this.inventionList.push({
          name: val.qaAttachment.fileName,
          url: process.env.VUE_APP_BASE_API + val.qaAttachment.fileUrl
        })
        if(!this.form.operateTypes){
          this.form.operateTypes = []
        }
        console.log(this.form,'form')
      }
      this.open = true
    },

    isValidKey(key,obj){
      return key in obj
    },

    openEdit(data,type){
      this.getList()
      if(type == 'add'){
        this.dialogTitle = '新增'
        this.addVisible = true
        this.addForm = {
          operate: [],
          qualificationType: '',
          jobCategory: '',
          operationItems: '',
          operateTypeId: null
        }
      }else{

      }
    },
    async submitUpload() {
      const { resumeList, inventionList, form } = this;
      const uploadAndCollect = async (fileList, type) => {
        if (fileList.length > 0 && fileList.find((file)=>file.raw)) {
          for (const file of fileList) {
            const formData = new FormData();
            formData.append("file", file.raw);
            formData.append("module", 'accountPath');
            try {
              const res = await uploadFile(formData);
              if (res.code === 200) {
                if (type === '证件照') {
                  form.photoAttachment = res.data.id;
                }
                if (type === '资质') {
                  form.qaAttachment = res.data.id;
                }
              } else {
                this.$message.error('图片上传出错!');
              }
            } catch (error) {
              this.$message.error('图片上传出错!');
            }
          }
        }else{
          return
        }
      };
      const uploadPromises = [
        uploadAndCollect(resumeList, '证件照'),
        uploadAndCollect(inventionList, '资质')
      ];
      try {
        await Promise.all(uploadPromises);
        console.log(form, 'form1');
      } catch (error) {
        console.error('上传出错:', error);
      }
    },

    async submit(){
      this.$refs["ruleForm"].validate(async(valid) =>{
        if(valid) {
          await this.submitUpload()
          if(this.title == '新增考评员'){
            const {id,...data} = this.form
            const res= await addExaminer(data)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.resumeList = []
              this.inventionList = []
              this.open = false
              this.$emit('closeDialog')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }else{
            const res= await editExaminer(this.form)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.fileList = []
              this.open = false
              this.$emit('closeDialog')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }
        }else{
          this.$message({
            type:'warning',
            message:'请完善必填信息'
          })
        }
      })
    },
    deleteItem(index){
      this.form.operateTypes.splice(index,1);
    },
    async getList() {
      this.loading = true;
      const res = await getOperatePage({name: ''})
      if(res.code == 200){
        this.typeList = this.handleTree(res.data, "id");
      }else{
        this.$message({
          type: 'warning',
          message: res.msg
        });
      }
      this.loading = false;
    },

    resumeChange(file, fileList) {
      this.resumeList = fileList;
    },
    inventChange(file, fileList){
      this.inventionList = fileList;
    },
    overLimit(){
      this.$message({
        type: 'warning',
        message: '超出文件上传数量'
      });
    },
    handlePreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    beforeAvatarUpload(file) {
      const isLt5M = file.size / 1024 / 1024 < 5;
      if (!isLt5M) {
        this.$message.error('上传头像图片大小不能超过 5MB!');
      }
      return isLt5M;
    },

    handleRemove(file,fileList,type) {
      if(type == '证件照'){
        this.resumeList = fileList
      }else{
        this.inventionList = fileList
      }
    },
    async submitAdd(){
      this.$refs["addRuleForm"].validate(async(valid) =>{
        if(valid) {
          if(this.addForm.operate.length == 2){
            this.addForm.qualificationType = this.findNameById(this.typeList,this.addForm.operate[0])
            this.addForm.jobCategory = this.findNameById(this.typeList,this.addForm.operate[1])
            this.addForm.operateTypeId = this.addForm.operate[1]
          }
          if(this.addForm.operate.length == 3){
            this.addForm.qualificationType = this.findNameById(this.typeList,this.addForm.operate[0])
            this.addForm.jobCategory = this.findNameById(this.typeList,this.addForm.operate[1])
            this.addForm.operationItems = this.findNameById(this.typeList,this.addForm.operate[2])
            this.addForm.operateTypeId = this.addForm.operate[2]
          }
          const {operate,...obj} = this.addForm
          this.form.operateTypes.push(obj)
          this.addVisible = false
        }else{
          this.$message({
            type:'warning',
            message:'请完善必填信息'
          })
        }
      })
    },
    findNameById(data,id){
      for(const node of data){
        if(node.id == id){
          return node.name
        }
        if(node.children){
          const foundName = this.findNameById(node.children,id)
          if(foundName){
            return foundName
          }
        }
      }
      return null
    }
  }
};
</script>

<style scoped lang="scss">
.home {
  .main-title{
    font-size: 24px;
    font-weight: bolder;
    text-align: center;
    margin-bottom: 20px;
    color: #333;
  }
  blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #eee;
  }
  hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee;
  }
  .col-item {
    margin-bottom: 20px;
  }

  ul {
    padding: 0;
    margin: 0;
  }

  font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  color: #676a6c;
  overflow-x: hidden;

  ul {
    list-style-type: none;
  }

  h4 {
    margin-top: 0px;
  }

  h2 {
    margin-top: 10px;
    font-size: 26px;
    font-weight: 100;
  }

  p {
    margin-top: 10px;

    b {
      font-weight: 700;
    }
  }

  .update-log {
    ol {
      display: block;
      list-style-type: decimal;
      margin-block-start: 1em;
      margin-block-end: 1em;
      margin-inline-start: 0;
      margin-inline-end: 0;
      padding-inline-start: 40px;
    }
  }
}
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409EFF;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>


 src/views/coalMine/cTeacherManage/cReviewer/index.vue

@@ -1,27 +1,27 @@
<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="用户姓名" prop="userName">
        <el-input
          v-model="queryParams.userName"
          placeholder="请输入用户姓名"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="身份证号" prop="idCard">
        <el-input
          v-model="queryParams.idCard"
          placeholder="请输入身份证号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
<!--    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">-->
<!--      <el-form-item label="用户姓名" prop="userName">-->
<!--        <el-input-->
<!--          v-model="queryParams.userName"-->
<!--          placeholder="请输入用户姓名"-->
<!--          clearable-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="身份证号" prop="idCard">-->
<!--        <el-input-->
<!--          v-model="queryParams.idCard"-->
<!--          placeholder="请输入身份证号"-->
<!--          clearable-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item>-->
<!--        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>-->
<!--        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
<!--      </el-form-item>-->
<!--    </el-form>-->

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
@@ -30,90 +30,129 @@
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          @click="openDialog({},'add')"
          v-hasPermi="['system:experts:add']"
        >新增</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getPage"></right-toolbar>
    </el-row>
    <el-table v-loading="loading" :data="expertList">
    <el-table v-loading="loading" :data="dataList">
      <el-table-column type="index" label="序号" width="55" align="center" />
      <el-table-column label="姓名" align="center" prop="name" />
      <el-table-column label="性别" align="center" prop="name" />
      <el-table-column label="身份证号" align="center" prop="name" />
      <el-table-column label="最高学历" align="center" prop="degree" />
      <el-table-column label="职称" align="center" prop="job" />
      <el-table-column label="资质" align="center" prop="speciality" />
      <el-table-column label="资质有效期" align="center"/>
      <el-table-column label="描述" align="center"/>
      <el-table-column label="证件照" align="center"/>
      <el-table-column label="状态" align="center"/>
      <el-table-column label="工种详情" align="center"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
      <el-table-column label="性别" align="center" prop="sex">
        <template #default="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
          >编辑</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-view"
            @click="handleView(scope.row)"
          >停用</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['system:experts:remove']"
          >删除</el-button>
          {{ scope.row.sex == 0?'男':'女' }}
        </template>
      </el-table-column>
      <el-table-column label="身份证号" align="center" prop="code" />
      <el-table-column label="最高学历" align="center" prop="eduLevel">
        <template #default="scope">
          {{getDegreeName(scope.row.eduLevel)}}
        </template>
      </el-table-column>
      <el-table-column label="职称" align="center" prop="jobTitle" />
      <el-table-column label="资质" align="center" prop="photoPath">
        <template #default="scope">
          <el-button type="text" @click="viewFile(scope.row.qaAttachment)">预览</el-button>
        </template>
      </el-table-column>
      <el-table-column label="资质有效期" align="center" prop="expiredTime"/>
      <el-table-column label="描述" align="center" prop="description" />
      <el-table-column label="证件照片" align="center" prop="photoPath">
        <template #default="scope">
          <el-button type="text" @click="viewFile(scope.row.photoAttachment)">预览</el-button>
        </template>
      </el-table-column>
      <el-table-column label="状态" align="center" prop="status">
        <template #default="scope">
          <el-tag :type="scope.row.status === '0'? 'success' : 'danger' ">{{ scope.row.status == '0'?'正常':'停用' }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="工种详情" align="center">
        <template #default="scope">
          <el-button size="mini" type="text" @click="openWorkType(scope.row)" v-if="scope.row.operateTypes && scope.row.operateTypes.length>0">查看</el-button>
          <span v-else>无</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="300">
        <template #default="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="openDialog(scope.row,'edit')">编辑</el-button>
          <el-button size="mini" type="text" icon="el-icon-view" @click="openDialog(scope.row,'view')">查看</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['system:experts:remove']">删除</el-button>
          <el-switch size="mini" v-model="scope.row.status" style="margin-left: 12px" active-value="0" inactive-value="1" @change="handleAbort($event,scope.row)"></el-switch>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageIndex"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
      @pagination="getPage"
    />
    <reviewerDialog ref="reviewerDialog" @closeDialog="resetQuery"></reviewerDialog>
    <el-dialog title="工种详情" :visible.sync="typeVisible" width="50%" append-to-body>
      <el-table :data="workType" border>
        <el-table-column label="资格类型" align="center" prop="qualificationType"/>
        <el-table-column label="作业类别" align="center" prop="jobCategory"/>
        <el-table-column label="操作项目" align="center" prop="operationItems"/>
      </el-table>
    </el-dialog>
  </div>
</template>

<script>
import reviewerDialog from "@/views/coalMine/cTeacherManage/cReviewer/components/reviewerDialog";
import {delExaminer, abortExaminer, getExaminerPage} from "@/api/coalMine/teacher";
import axios from "axios";
import {getToken} from "@/utils/auth";
import {delPeople} from "@/api/coalMine/people";

export default {
  name: "cTeacherManage",
  dicts: [],
  components: {},
  dicts: ['sys_highest_education_code'],
  components: { reviewerDialog },
  data() {
    return {
      loading: false,
      single: true,
      multiple: true,
      showSearch: true,
      addForm: false,
      typeVisible: false,
      workType: [],
      dataList: [],
      total: 0,
      expertTypes: [],
      expertList: [],
      queryParams: {},
      classiFy: [],
      form: {},
      rules: {
        classifyName: [
          { required: true, message: "分类名称不能为空", trigger: "blur" }
        ]
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        isCm: '1'
      }
    };
  },
  created() {

    const t = this
    t.getPage()
  },
  methods: {
    getList(){
    async getPage(){
      this.loading = true
      const res = await getExaminerPage(this.queryParams)
      if(res.code == 200){
        this.dataList = res.rows
        this.total = res.total
      }else{
        this.$message({
          message: res.msg,
          type: 'warning'
        })
      }
      this.loading = false
    },

    openDialog(data,type){
      this.$refs.reviewerDialog.openDialog(data,type)
    },
    openWorkType(row){
      this.workType = row.operateTypes
      this.typeVisible = true
    },
    handleChange(){

@@ -122,11 +161,72 @@

    },
    resetQuery(){

      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        isCm: 1
      }
      this.getPage()
    },
    handleAdd(){
    viewFile(file){
      axios.get(process.env.VUE_APP_BASE_API + file.fileUrl,{headers:{'Content-Type': 'application/json','Authorization': "Bearer " + getToken()},responseType: 'blob'}).then(res=>{
        if (res) {
          const link = document.createElement('a')
          let blob = new Blob([res.data],{type: res.data.type})
          link.style.display = "none";
          link.href = URL.createObjectURL(blob); // 创建URL
          window.open(link.href)
        } else {
          this.$message.error('获取文件失败')
        }
      })
    },
    getDegreeName(code){
      let obj = JSON.parse(JSON.stringify(this.dict.type.sys_highest_education_code)).find(i=>i.value == code)
      if(obj){
        return obj.label
      }else{
        return '未知'
      }
    },
    async handleAbort(value,row){
        const res = await abortExaminer({id: row.id,status: value})
        if(res.code == 200){
          this.$message({
            type: 'success',
            message: '状态变更成功!'
          });
          this.getPage()
        }else {
          this.$message({
            type: 'warning',
            message: res.msg
          });
        }
    },
    handleDelete(row){
      this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await delExaminer(row.id)
        if(res.code == 200){
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          await this.getPage()
        }else{
          this.$message({
            type: 'warning',
            message: res.msg
          });
        }
      }).catch(() => {

    }
      });
    },
  }
};
</script>

 src/views/coalMine/cTeacherManage/cTeacher/components/teacherDialog.vue

New file
@@ -0,0 +1,638 @@
<template>
  <el-dialog :title="title" :visible.sync="open" width="50%" append-to-body>
    <div class="main_form">
      <el-form :model="form" :rules="rules" ref="ruleForm" label-width="200px" :label-position="labelPosition">
        <el-row>
          <el-col :span="20">
            <el-form-item label="姓名" prop="name">
              <el-input v-model="form.name" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="性别" prop="sex">
              <el-radio-group v-model="form.sex" :disabled="disable">
                <el-radio :label="0">男</el-radio>
                <el-radio :label="1">女</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="身份证号" prop="code">
              <el-input v-model="form.code" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="联系电话" prop="mobilePhone">
              <el-input v-model="form.mobilePhone" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="职称" prop="jobTitle">
              <el-input v-model="form.jobTitle" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="最高学历" prop="eduLevel">
              <el-select v-model="form.eduLevel" placeholder="请选择" style="width: 100%" :disabled="disable">
                <el-option
                  v-for="dict in dict.type.sys_highest_education_code"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="资质到期" prop="expiredTime">
              <el-date-picker
                style="width: 100%"
                v-model="form.expiredTime"
                value-format="yyyy-MM-dd"
                type="date"
                :disabled="disable"
                placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="在职情况" prop="status">
              <el-radio-group v-model="form.status" :disabled="disable">
                <el-radio label="0">正常</el-radio>
                <el-radio label="1">停用</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="描述">
              <el-input v-model="form.description" type="textarea" :autosize="{ minRows: 2}" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="证件照" prop="photoAttachment">
              <el-upload
                :disabled="disable"
                action="#"
                multiple
                :limit="1"
                :on-exceed="overLimit"
                :auto-upload="false"
                accept="image/*,.pdf"
                :file-list="resumeList"
                list-type="picture-card"
                :before-upload="beforeAvatarUpload"
                :on-change="resumeChange"
                :on-preview="handlePreview"
                :on-remove="(file,fileList)=>handleRemove(file,fileList,'证件照')">
                <i class="el-icon-plus"></i>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="资质" prop="qaAttachment">
              <el-upload
                :disabled="disable"
                action=""
                multiple
                :limit="1"
                :on-exceed="overLimit"
                :auto-upload="false"
                accept="image/*,.pdf"
                list-type="picture-card"
                :file-list="inventionList"
                :before-upload="beforeAvatarUpload"
                :on-change="inventChange"
                :on-preview="handlePreview"
                :on-remove="(file,fileList)=>handleRemove(file,fileList,'资质')">
                <i class="el-icon-plus"></i>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="工种详情" prop="operateTypes">
                <el-table :data="form.operateTypes" border>
                  <el-table-column label="序号" type="index" align="center"/>
                  <el-table-column label="资格类型" align="center" prop="qualificationType" />
                  <el-table-column label="作业类别" align="center" prop="jobCategory" />
                  <el-table-column label="操作项目" align="center" prop="operationItems"/>
                  <el-table-column label="操作" align="center" class-name="small-padding fixed-width" v-if="disable == false">
                    <template #default="scope">
<!--                      <el-button size="mini" type="text" icon="el-icon-edit" @click="openEdit(scope.row,'edit')">编辑</el-button>-->
                      <el-button size="mini" type="text" icon="el-icon-delete" @click="deleteItem(scope.index)" v-hasPermi="['system:experts:remove']">删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>
                <el-button v-if="disable == false" @click="openEdit({},'add')" style="margin-top: 15px">新增</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div style="width: 100%;padding-bottom: 30px;display: flex;justify-content: center" v-if="disable == false">
        <el-button type="primary" @click="submit()">提交</el-button>
      </div>
      <el-dialog :visible.sync="dialogVisible" append-to-body>
        <img width="100%" :src="dialogImageUrl" alt="">
      </el-dialog>
      <el-dialog :title="dialogTitle" :visible.sync="addVisible" width="50%" append-to-body>
        <el-form :model="addForm" :rules="addRules" ref="addRuleForm" label-width="200px">
          <el-row>
            <el-col :span="20">
              <el-form-item label="资格类型" prop="operate">
                <el-cascader
                  v-model="addForm.operate"
                  :options="typeList"
                  style="width: 100%"
                  :props="{ expandTrigger: 'hover', value: 'id',label: 'name'}"></el-cascader>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div style="width: 100%;padding-bottom: 30px;display: flex;justify-content: center" v-if="disable == false">
          <el-button type="primary" @click="submitAdd()">提交</el-button>
        </div>
      </el-dialog>
    </div>
  </el-dialog>
</template>

<script>
import { verifySimplePhone, verifyIdCard } from "@/utils/validate";
import {getOperatePage} from "@/api/coalMine/operateType";
import {addTeacher, editTeacher, uploadFile} from "@/api/coalMine/teacher";
export default {
  name: "teacherDialog",
  dicts: ['sys_highest_education_code'],
  data() {
    // let validateTypes = (rule, value, callback) => {
    //   if (this.form.operateTypes.length == 0) {
    //     callback(new Error('请添加工种详情'));
    //   } else {
    //     callback();
    //   }
    // }
    let validateResume = (rule, value, callback) => {
      if (this.resumeList.length == 0) {
        callback(new Error('请上传证件照'));
      } else {
        callback();
      }
    }
    let validateCert = (rule, value, callback) => {
      if (this.inventionList.length == 0) {
        callback(new Error('请上传资质证书'));
      } else {
        callback();
      }
    }
    let validatePhone = (rule, value, callback)=>{
      if(value === ''){
        callback(new Error('请输入手机号'))
      }else{
        if(!verifySimplePhone(value)){
          callback(new Error('手机号格式有误'))
        }else{
          callback()
        }
      }
    }
    let verifyId = (rule, value, callback)=>{
      if(value === ''){
        callback(new Error('请输入身份证号'))
      }else{
        if(!verifyIdCard(value)){
          callback(new Error('身份证号格式有误'))
        }else{
          callback()
        }
      }
    }
    return {
      title: '新增教师',
      open: false,
      disable: false,
      labelPosition: 'right',
      form:{
        id: null,
        isCm: '1',
        name:'',
        sex:'',
        code: '',
        mobilePhone: '',
        jobTitle: '',
        eduLevel: '',
        expiredTime: '',
        status: '',
        operateTypes: [],
        photoAttachment: null,
        qaAttachment: null,
        description: '',
      },
      resumeList: [],
      inventionList: [],
      dialogImageUrl: '',
      dialogVisible: false,
      dialogTitle: '新增',
      addVisible: false,
      addForm: {
        operate: [],
        qualificationType: '',
        jobCategory: '',
        operationItems: '',
        operateTypeId: null
      },
      typeList: [],
      rules:{
        name:[{ required: true, message: '请填写姓名', trigger: 'blur'}],
        sex:[{ required: true, message: '请选择性别', trigger: 'blur'}],
        code:[{ required: true, validator: verifyId, trigger: 'blur' }],
        mobilePhone:[{ required: true, validator: validatePhone, trigger: 'blur' }],
        // code:[{ required: true, message: '请填写身份证号', trigger: 'blur'}],
        // mobilePhone:[{ required: true, message: '请填写联系方式', trigger: 'blur'}],
        jobTitle: [{ required: true, message: '请填写职称', trigger: 'blur'}],
        eduLevel: [{ required: true, message: '请选择最高学历', trigger: 'blur'}],
        expiredTime: [{ required: true, message: '请选择到期时间', trigger: 'blur'}],
        status: [{ required: true, message: '请选择在岗情况', trigger: 'blur'}],
        // operateTypes: [{ required: true,validator: validateTypes, trigger: 'blur' }],
        photoAttachment: [{ required: true,validator: validateResume, trigger: 'blur'}],
        qaAttachment: [{ required: true,validator: validateCert, trigger: 'blur'}]
      },
      addRules:{
        operate:[{ required: true, message: '请选择', trigger: 'blur' }]
      }
    };
  },
  created() {
    const t = this
  },
  methods: {
    openDialog(val,type){
      this.resumeList = []
      this.inventionList = []
      if(type == 'add'){
        this.title = '新增教师'
        this.disable = false
        this.form = {
          id: null,
          isCm: '1',
          name:'',
          sex:'',
          code: '',
          mobilePhone: '',
          jobTitle: '',
          eduLevel: '',
          expiredTime: '',
          status: '',
          operateTypes: [],
          photoAttachment: null,
          qaAttachment: null,
          description: '',
        }
      }else{
        if(type == 'edit'){
          this.title = '编辑教师'
          this.disable = false
        }else{
          this.title = '查看教师'
          this.disable = true
        }
        if(val){
          for(let i in val){
            if(this.isValidKey(i,this.form)){
              this.form[i] = val[i]
            }
          }
        }
        this.form.sex = Number(this.form.sex)
        // 仅限单张图片处理
        this.form.photoAttachment = val.photoAttachment.id
        this.form.qaAttachment = val.qaAttachment.id
        this.resumeList.push({
          name: val.photoAttachment.fileName,
          url: process.env.VUE_APP_BASE_API + val.photoAttachment.fileUrl
        })
        this.inventionList.push({
          name: val.qaAttachment.fileName,
          url: process.env.VUE_APP_BASE_API + val.qaAttachment.fileUrl
        })
        if(!this.form.operateTypes){
          this.form.operateTypes = []
        }
        console.log(this.form,'form')
      }
      this.open = true
    },

    isValidKey(key,obj){
      return key in obj
    },

    openEdit(data,type){
      this.getList()
      if(type == 'add'){
        this.dialogTitle = '新增'
        this.addVisible = true
        this.addForm = {
          operate: [],
          qualificationType: '',
          jobCategory: '',
          operationItems: '',
          operateTypeId: null
        }
      }else{

      }
    },
    async submitUpload() {
      const { resumeList, inventionList, form } = this;
      const uploadAndCollect = async (fileList, type) => {
        if (fileList.length > 0 && fileList.find((file)=>file.raw)) {
          for (const file of fileList) {
            const formData = new FormData();
            formData.append("file", file.raw);
            formData.append("module", 'accountPath');
            try {
              const res = await uploadFile(formData);
              if (res.code === 200) {
                if (type === '证件照') {
                  form.photoAttachment = res.data.id;
                }
                if (type === '资质') {
                  form.qaAttachment = res.data.id;
                }
              } else {
                this.$message.error('图片上传出错!');
              }
            } catch (error) {
              this.$message.error('图片上传出错!');
            }
          }
        }else{
          return
        }
      };
      const uploadPromises = [
        uploadAndCollect(resumeList, '证件照'),
        uploadAndCollect(inventionList, '资质')
      ];
      try {
        await Promise.all(uploadPromises);
        console.log(form, 'form1');
      } catch (error) {
        console.error('上传出错:', error);
      }
    },

    async submit(){
      this.$refs["ruleForm"].validate(async(valid) =>{
        if(valid) {
          await this.submitUpload()
          if(this.title == '新增教师'){
            const {id,...data} = this.form
            const res= await addTeacher(data)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.resumeList = []
              this.inventionList = []
              this.open = false
              this.$emit('closeDialog')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }else{
            const res= await editTeacher(this.form)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.fileList = []
              this.open = false
              this.$emit('closeDialog')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }
        }else{
          this.$message({
            type:'warning',
            message:'请完善必填信息'
          })
        }
      })
    },
    deleteItem(index){
      this.form.operateTypes.splice(index,1);
    },
    async getList() {
      this.loading = true;
      const res = await getOperatePage({name: ''})
      if(res.code == 200){
        this.typeList = this.handleTree(res.data, "id");
      }else{
        this.$message({
          type: 'warning',
          message: res.msg
        });
      }
      this.loading = false;
    },

    resumeChange(file, fileList) {
      this.resumeList = fileList;
    },
    inventChange(file, fileList){
      this.inventionList = fileList;
    },
    overLimit(){
      this.$message({
        type: 'warning',
        message: '超出文件上传数量'
      });
    },
    handlePreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    beforeAvatarUpload(file) {
      const isLt5M = file.size / 1024 / 1024 < 5;
      if (!isLt5M) {
        this.$message.error('上传头像图片大小不能超过 5MB!');
      }
      return isLt5M;
    },

    handleRemove(file,fileList,type) {
      if(type == '证件照'){
        this.resumeList = fileList
      }else{
        this.inventionList = fileList
      }
    },
    async submitAdd(){
      this.$refs["addRuleForm"].validate(async(valid) =>{
        if(valid) {
          if(this.addForm.operate.length == 2){
            this.addForm.qualificationType = this.findNameById(this.typeList,this.addForm.operate[0])
            this.addForm.jobCategory = this.findNameById(this.typeList,this.addForm.operate[1])
            this.addForm.operateTypeId = this.addForm.operate[1]
          }
          if(this.addForm.operate.length == 3){
            this.addForm.qualificationType = this.findNameById(this.typeList,this.addForm.operate[0])
            this.addForm.jobCategory = this.findNameById(this.typeList,this.addForm.operate[1])
            this.addForm.operationItems = this.findNameById(this.typeList,this.addForm.operate[2])
            this.addForm.operateTypeId = this.addForm.operate[2]
          }
          const {operate,...obj} = this.addForm
          this.form.operateTypes.push(obj)
          this.addVisible = false
        }else{
          this.$message({
            type:'warning',
            message:'请完善必填信息'
          })
        }
      })
    },
    findNameById(data,id){
      for(const node of data){
        if(node.id == id){
          return node.name
        }
        if(node.children){
          const foundName = this.findNameById(node.children,id)
          if(foundName){
            return foundName
          }
        }
      }
      return null
    }
  }
};
</script>

<style scoped lang="scss">
.home {
  .main-title{
    font-size: 24px;
    font-weight: bolder;
    text-align: center;
    margin-bottom: 20px;
    color: #333;
  }
  blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #eee;
  }
  hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee;
  }
  .col-item {
    margin-bottom: 20px;
  }

  ul {
    padding: 0;
    margin: 0;
  }

  font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  color: #676a6c;
  overflow-x: hidden;

  ul {
    list-style-type: none;
  }

  h4 {
    margin-top: 0px;
  }

  h2 {
    margin-top: 10px;
    font-size: 26px;
    font-weight: 100;
  }

  p {
    margin-top: 10px;

    b {
      font-weight: 700;
    }
  }

  .update-log {
    ol {
      display: block;
      list-style-type: decimal;
      margin-block-start: 1em;
      margin-block-end: 1em;
      margin-inline-start: 0;
      margin-inline-end: 0;
      padding-inline-start: 40px;
    }
  }
}
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409EFF;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>


 src/views/coalMine/cTeacherManage/cTeacher/index.vue

@@ -1,27 +1,27 @@
<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="用户姓名" prop="userName">
        <el-input
          v-model="queryParams.userName"
          placeholder="请输入用户姓名"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="身份证号" prop="idCard">
        <el-input
          v-model="queryParams.idCard"
          placeholder="请输入身份证号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
<!--    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">-->
<!--      <el-form-item label="用户姓名" prop="userName">-->
<!--        <el-input-->
<!--          v-model="queryParams.userName"-->
<!--          placeholder="请输入用户姓名"-->
<!--          clearable-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="身份证号" prop="idCard">-->
<!--        <el-input-->
<!--          v-model="queryParams.idCard"-->
<!--          placeholder="请输入身份证号"-->
<!--          clearable-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item>-->
<!--        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>-->
<!--        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
<!--      </el-form-item>-->
<!--    </el-form>-->

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
@@ -30,46 +30,56 @@
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          @click="openDialog({},'add')"
          v-hasPermi="['system:experts:add']"
        >新增</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getPage"></right-toolbar>
    </el-row>
    <el-table v-loading="loading" :data="expertList">
    <el-table v-loading="loading" :data="dataList">
      <el-table-column type="index" label="序号" width="55" align="center" />
      <el-table-column label="姓名" align="center" prop="name" />
      <el-table-column label="性别" align="center" prop="name" />
      <el-table-column label="身份证号" align="center" prop="name" />
      <el-table-column label="最高学历" align="center" prop="degree" />
      <el-table-column label="职称" align="center" prop="job" />
      <el-table-column label="资质" align="center" prop="speciality" />
      <el-table-column label="资质有效期" align="center"/>
      <el-table-column label="描述" align="center"/>
      <el-table-column label="证件照" align="center"/>
      <el-table-column label="状态" align="center"/>
      <el-table-column label="工种详情" align="center"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
      <el-table-column label="性别" align="center" prop="sex">
        <template #default="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
          >编辑</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-view"
            @click="handleView(scope.row)"
          >停用</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['system:experts:remove']"
          >删除</el-button>
          {{ scope.row.sex == 0?'男':'女' }}
        </template>
      </el-table-column>
      <el-table-column label="身份证号" align="center" prop="code" />
      <el-table-column label="最高学历" align="center" prop="eduLevel">
        <template #default="scope">
          {{getDegreeName(scope.row.eduLevel)}}
        </template>
      </el-table-column>
      <el-table-column label="职称" align="center" prop="jobTitle" />
      <el-table-column label="资质" align="center" prop="photoPath">
        <template #default="scope">
          <el-button type="text" @click="viewFile(scope.row.qaAttachment)">预览</el-button>
        </template>
      </el-table-column>
      <el-table-column label="资质有效期" align="center" prop="expiredTime"/>
      <el-table-column label="描述" align="center" prop="description" />
      <el-table-column label="证件照片" align="center" prop="photoPath">
        <template #default="scope">
          <el-button type="text" @click="viewFile(scope.row.photoAttachment)">预览</el-button>
        </template>
      </el-table-column>
      <el-table-column label="状态" align="center" prop="status">
        <template #default="scope">
          <el-tag :type="scope.row.status === '0'? 'success' : 'danger' ">{{ scope.row.status == '0'?'正常':'停用' }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="工种详情" align="center">
        <template #default="scope">
          <el-button size="mini" type="text" @click="openWorkType(scope.row)" v-if="scope.row.operateTypes && scope.row.operateTypes.length>0">查看</el-button>
          <span v-else>无</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="300">
        <template #default="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="openDialog(scope.row,'edit')">编辑</el-button>
          <el-button size="mini" type="text" icon="el-icon-view" @click="openDialog(scope.row,'view')">查看</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['system:experts:remove']">删除</el-button>
          <el-switch size="mini" v-model="scope.row.status" style="margin-left: 12px" active-value="0" inactive-value="1" @change="handleAbort($event,scope.row)"></el-switch>
        </template>
      </el-table-column>
    </el-table>
@@ -78,42 +88,71 @@
      :total="total"
      :page.sync="queryParams.pageIndex"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
      @pagination="getPage"
    />
    <teacherDialog ref="teacherDialog" @closeDialog="resetQuery"></teacherDialog>
    <el-dialog title="工种详情" :visible.sync="typeVisible" width="50%" append-to-body>
      <el-table :data="workType" border>
        <el-table-column label="资格类型" align="center" prop="qualificationType"/>
        <el-table-column label="作业类别" align="center" prop="jobCategory"/>
        <el-table-column label="操作项目" align="center" prop="operationItems"/>
      </el-table>
    </el-dialog>
  </div>
</template>

<script>
import teacherDialog from "@/views/coalMine/cTeacherManage/cTeacher/components/teacherDialog";
import {delTeacher, getTeacherPage, abortTeacher} from "@/api/coalMine/teacher";
import axios from "axios";
import {getToken} from "@/utils/auth";
import {delPeople} from "@/api/coalMine/people";

export default {
  name: "cTeacherManage",
  dicts: [],
  components: {},
  dicts: ['sys_highest_education_code'],
  components: { teacherDialog },
  data() {
    return {
      loading: false,
      single: true,
      multiple: true,
      showSearch: true,
      addForm: false,
      typeVisible: false,
      workType: [],
      dataList: [],
      total: 0,
      expertTypes: [],
      expertList: [],
      queryParams: {},
      classiFy: [],
      form: {},
      rules: {
        classifyName: [
          { required: true, message: "分类名称不能为空", trigger: "blur" }
        ]
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        isCm: '1'
      }
    };
  },
  created() {

    const t = this
    t.getPage()
  },
  methods: {
    getList(){
    async getPage(){
      this.loading = true
      const res = await getTeacherPage(this.queryParams)
      if(res.code == 200){
        this.dataList = res.rows
        this.total = res.total
      }else{
        this.$message({
          message: res.msg,
          type: 'warning'
        })
      }
      this.loading = false
    },

    openDialog(data,type){
      this.$refs.teacherDialog.openDialog(data,type)
    },
    openWorkType(row){
      this.workType = row.operateTypes
      this.typeVisible = true
    },
    handleChange(){

@@ -122,11 +161,72 @@

    },
    resetQuery(){

      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        isCm: 1
      }
      this.getPage()
    },
    handleAdd(){
    viewFile(file){
      axios.get(process.env.VUE_APP_BASE_API + file.fileUrl,{headers:{'Content-Type': 'application/json','Authorization': "Bearer " + getToken()},responseType: 'blob'}).then(res=>{
        if (res) {
          const link = document.createElement('a')
          let blob = new Blob([res.data],{type: res.data.type})
          link.style.display = "none";
          link.href = URL.createObjectURL(blob); // 创建URL
          window.open(link.href)
        } else {
          this.$message.error('获取文件失败')
        }
      })
    },
    getDegreeName(code){
      let obj = JSON.parse(JSON.stringify(this.dict.type.sys_highest_education_code)).find(i=>i.value == code)
      if(obj){
        return obj.label
      }else{
        return '未知'
      }
    },
    async handleAbort(value,row){
        const res = await abortTeacher({id: row.id,status: value})
        if(res.code == 200){
          this.$message({
            type: 'success',
            message: '状态变更成功!'
          });
          this.getPage()
        }else {
          this.$message({
            type: 'warning',
            message: res.msg
          });
        }
    },
    handleDelete(row){
      this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await delTeacher(row.id)
        if(res.code == 200){
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          await this.getPage()
        }else{
          this.$message({
            type: 'warning',
            message: res.msg
          });
        }
      }).catch(() => {

    }
      });
    },
  }
};
</script>

 src/views/coalMine/cViolationRegistration/components/addDialog.vue

File was deleted

 src/views/coalMine/cViolationRegistration/components/violationDialog.vue

New file
@@ -0,0 +1,312 @@
<template>
  <el-dialog
    :title="title"
    :visible.sync="open"
    append-to-body
    width="50%"
    :before-close="handleClose"
  >
    <el-form ref="ruleForm" :model="form"  :rules="rules" label-position="right" label-width="150px" style="padding-right: 50px" element-loading-text="保存中...">
      <el-form-item label="姓名:" prop="name">
        <el-input v-model.trim="form.name" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="身份证号:" prop="idCard">
        <el-input v-model.trim="form.idCard" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="IC卡编号:" prop="icNum">
        <el-input v-model.trim="form.icNum" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="电子证号:" prop="electNum">
        <el-input v-model.trim="form.electNum" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="所属单位:" prop="dept">
        <el-input v-model.trim="form.dept" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="违章日期:" prop="violationTime">
        <el-date-picker
          v-model="form.violationTime"
          type="date"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd 00:00:00"
          placeholder="选择日期"
          :disabled="disable">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="操作类型" prop="operateTypeId">
        <el-cascader
          v-model="form.operateTypeId"
          :options="typeList"
          :disabled="disable"
          :show-all-levels="false"
          :props="{ expandTrigger: 'hover', value: 'id',label: 'name',emitPath:false}"></el-cascader>
      </el-form-item>
      <el-form-item label="图片上传" prop="violationPath">
        <el-upload
          action=""
          :disabled="disable"
          :auto-upload="false"
          :limit="10"
          multiple
          accept="image/*,.pdf"
          :file-list="fileList"
          list-type="picture-card"
          :before-upload="beforeAvatarUpload"
          :on-change="avatorChange"
          :on-preview="handlePreview"
          :on-exceed="overLimit"
          :on-remove="handleRemove">
          <i class="el-icon-plus"></i>
        </el-upload>
      </el-form-item>
      <el-form-item label="违章描述:" prop="remark">
        <el-input type="textarea" v-model.trim="form.remark" :readonly="disable"/>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="handleClose">取消</el-button>
      <el-button v-if="disable == false" type="primary" @click="submit">提交</el-button>
      <el-button v-else type="primary" @click="handleClose">确定</el-button>
    </span>
    <el-dialog :visible.sync="dialogVisible" append-to-body>
      <img width="100%" :src="dialogImageUrl" alt="">
    </el-dialog>
  </el-dialog>
</template>

<script >
import {addViolation, editViolation, uploadFile} from "@/api/coalMine/violation";
import {verifyIdCard} from "@/utils/validate";

export default {
  name: 'violationDialog',
  components: {
  },
  props: ['typeList'],
  data() {
    let validatePass = (rule, value, callback) => {
      if (this.fileList.length == 0) {
        callback(new Error('请上传图片'));
      } else {
        callback();
      }
    }
    let verifyId = (rule, value, callback)=>{
      if(value === ''){
        callback(new Error('请输入身份证号'))
      }else{
        if(!verifyIdCard(value)){
          callback(new Error('身份证号格式有误'))
        }else{
          callback()
        }
      }
    }
    return {
      disable: false,
      title: '新增填报',
      open: false,
      form:{
        id: null,
        isCm: 1,
        name: '',
        idCard: '',
        icNum: '',
        electNum: '',
        dept: '',
        violationTime: '',
        operateTypeId: null,
        violationPath: '',
        remark: ''
      },
      fileList: [],
      dialogImageUrl: '',
      dialogVisible: false,
      rules:{
        name:[{ required: true, message: '请填写姓名', trigger: 'blur' }],
        // idCard: [{ required: true, validator: verifyId, trigger: 'blur' }],
        idCard: [{ required: true, message: '请填写身份证号', trigger: 'blur' }],
        dept: [{ required: true, message: '请填写所在单位', trigger: 'blur' }],
        violationTime: [{ required: true, message: '请选择违章日期', trigger: 'blur' }],
        violationPath: [{ required: true,validator: validatePass, trigger: 'blur' }],
        operateTypeId: [{ required: true, message: '请选择操作类型', trigger: 'blur' }]
      },
    }
  },
  created() {

  },
  methods: {
    openDialog (val,type) {
      const t = this
      t.fileList = []
      t.open = true
      if(type == 'add'){
        t.title = '新增填报'
        t.disable = false
        t.form = {
          id: null,
          isCm: 1,
          name: '',
          idCard: '',
          icNum: '',
          electNum: '',
          dept: '',
          violationTime: '',
          operateTypeId: null,
          violationPath: '',
          remark: ''
        }
      }else{
        t.title = '查看'
        t.disable = true
        if(val){
          for(let i in val){
            if(t.isValidKey(i,this.form)){
              t.form[i] = val[i]
            }
          }
          const picList = val.violationPath.split(',')
          t.fileList = picList.map((item,index)=>{
            return {
              name: index,
              url: process.env.VUE_APP_BASE_API + item
            }
          })
        }
      }
    },
    isValidKey(key,obj){
      return key in obj
    },

    avatorChange(file, fileList) {
      this.fileList = fileList;
      console.log(fileList,'list2')
    },

    overLimit(){
      this.$message({
        type: 'warning',
        message: '超出文件上传数量'
      });
    },
    handlePreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    beforeAvatarUpload(file) {
      const isLt5M = file.size / 1024 / 1024 < 5;
      if (!isLt5M) {
        this.$message.error('上传头像图片大小不能超过 5MB!');
      }
      return isLt5M;
    },
    async submitUpload() {
      const t = this;
      // 创建一个数组来存储所有上传操作的 Promise
      const uploadPromises = [];
      // 定义一个函数来上传文件并将结果存入 resumeLink 数组
      async function uploadAndCollect(fileList) {
        if (fileList.length > 0) {
          const resumeLink = [];
          for (const file of fileList) {
            const formData = new FormData();
            formData.append("file", file.raw);
            formData.append("module", 'accountPath');

            const res = await uploadFile(formData);
            if (res.code === 200) {
              resumeLink.push(res.data.fileKey);
            } else {
              this.$message.error('图片上传出错!');
            }
          }
          // 将收集到的文件链接设置到 this.form 中
          t.form.violationPath = resumeLink.join(',')
          return resumeLink;
        }
        return [];
      }
      // 依次执行上传操作并等待完成
      uploadPromises.push(uploadAndCollect(t.fileList));
      // 等待所有上传操作完成
      await Promise.all(uploadPromises);
      // 打印已更新的 this.form
      console.log(t.form, 'form1');
    },
    handleRemove(file, fileList) {
      console.log(file, fileList);
      this.fileList = fileList
    },
    handleClose() {
      this.open = false;
      this.resetForm();
    },
    async submit(){
      this.$refs["ruleForm"].validate(async(valid) =>{
        if(valid) {
          await this.submitUpload()
          if(this.title == '新增填报'){
            const {id,...data} = this.form
            const res= await addViolation(data)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.fileList = []
              this.open = false
              this.$emit('getList')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }else{
            const res= await editViolation(this.form)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.fileList = []
              this.open = false
              this.$emit('getList')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }
        }else{
          this.$message({
            type:'warning',
            message:'请完善必填信息'
          })
        }
      })
    },
    resetForm() {
      this.form = {
        id: null,
        isCm: 1,
        name: '',
        idCard: '',
        icNum: '',
        electNum: '',
        dept: '',
        violationTime: '',
        operateTypeId: null,
        violationPath: '',
        remark: ''
      }
    },
  }
}

</script>
<style scoped>

</style>

 src/views/coalMine/cViolationRegistration/index.vue

@@ -3,7 +3,7 @@
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="用户姓名" prop="userName">
        <el-input
          v-model="queryParams.userName"
          v-model="queryParams.name"
          placeholder="请输入用户姓名"
          clearable
          @keyup.enter.native="handleQuery"
@@ -17,19 +17,20 @@
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="单位名称" prop="idCard">
      <el-form-item label="单位名称" prop="dept">
        <el-input
          v-model="queryParams.unit"
          v-model="queryParams.dept"
          placeholder="请输入单位名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="作业类型">
      <el-form-item label="操作类型">
        <el-cascader
          v-model="classiFy"
          :options="expertTypes"
          :props="{ expandTrigger: 'hover', value: 'id',label: 'label'}"
          v-model="queryParams.operateTypeId"
          :options="typeList"
          :show-all-levels="false"
          :props="{ expandTrigger: 'hover', value: 'id',label: 'name',emitPath:false}"
          @change="handleChange"></el-cascader>
      </el-form-item>
      <el-form-item>
@@ -44,27 +45,35 @@
          type="primary"
          plain
          size="mini"
          @click="handleAdd"
          @click="openViolation({},'add')"
          v-hasPermi="['system:experts:add']"
        >新增填报</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>
    <el-table v-loading="loading" :data="expertList">
      <el-table-column label="发生时间" align="center" prop="name" />
    <el-table v-loading="loading" :data="dataList">
      <el-table-column label="发生时间" align="center" prop="violationTime" />
      <el-table-column label="姓名" align="center" prop="name" />
      <el-table-column label="身份证号" align="center" prop="name" />
      <el-table-column label="IC/电子证编号" align="center" prop="phone"/>
      <el-table-column label="所属单位" align="center" prop="phone"/>
      <el-table-column label="作业种类" align="center" prop="phone"/>
      <el-table-column label="身份证号" align="center" prop="idCard" />
      <el-table-column label="IC卡编号" align="center" prop="icNum"/>
      <el-table-column label="电子证编号" align="center" prop="electNum"/>
      <el-table-column label="所属单位" align="center" prop="dept"/>
      <el-table-column label="作业种类" align="center" prop="jobCategory"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-view"
            @click="handleView(scope.row)"
            @click="openViolation(scope.row,'view')"
          >查看违规详情</el-button>
<!--          <el-button-->
<!--            size="mini"-->
<!--            type="text"-->
<!--            icon="el-icon-edit"-->
<!--            @click="openViolation(scope.row,'edit')"-->
<!--            v-hasPermi="['system:experts:remove']"-->
<!--          >编辑</el-button>-->
          <el-button
            size="mini"
            type="text"
@@ -78,62 +87,122 @@
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageIndex"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
    <add-dialog ref="addDialogRef" @getList = "getList"></add-dialog>
    <violation-dialog ref="violationDialog" @getList="getList" :typeList="typeList"></violation-dialog>
  </div>
</template>

<script>

import addDialog from "@/views/notCoalMine/nViolationRegistration/components/addDialog.vue";
import violationDialog from "@/views/coalMine/cViolationRegistration/components/violationDialog.vue";
import {delViolation, getViolationPage} from "@/api/coalMine/violation";
import {getOperatePage} from "@/api/coalMine/operateType";
import {delPeople} from "@/api/coalMine/people";
export default {
  name: "nViolationRegistration",
  name: "cViolationRegistration",
  dicts: [],
  components: {
    addDialog
    violationDialog
  },
  data() {
    return {
      addDialogRef: '',
      violationDialog: '',
      loading: false,
      single: true,
      multiple: true,
      showSearch: true,
      addForm: false,
      dataList: [],
      total: 0,
      expertTypes: [],
      expertList: [],
      queryParams: {},
      classiFy: [],
      form: {},
      rules: {
        classifyName: [
          { required: true, message: "分类名称不能为空", trigger: "blur" }
        ]
      }
      typeList: [],
      queryParams: {
        name: '',
        idCard:'',
        dept: '',
        operateTypeId: null,
        isCm: 1,
        pageNum: 1,
        pageSize: 10
      },
    };
  },
  created() {

    this.getList()
    this.getTypeList()
  },
  methods: {
    getList(){

    async getList(){
      const t = this
      t.loading = true
      const res = await getViolationPage(t.queryParams)
      if(res.code == 200){
        t.dataList = res.rows
        t.total = res.total
      }else{
        t.$message({
          message: res.msg,
          type: 'warning'
        })
      }
      t.loading = false
    },
    async getTypeList() {
      this.loading = true;
      const res = await getOperatePage({name: ''})
      if(res.code == 200){
        this.typeList = this.handleTree(res.data, "id");
      }else{
        this.$message({
          type: 'warning',
          message: res.msg
        });
      }
      this.loading = false;
    },
    handleChange(){

    },
    handleQuery(){
    handleDelete(row){
      this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await delViolation(row.violationId)
        if(res.code == 200){
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          await this.getList()
        }else{
          this.$message({
            type: 'warning',
            message: res.msg
          });
        }
      }).catch(() => {

      });
    },
    handleQuery(){
      this.queryParams.pageNum = 1
      this.getList()
    },
    resetQuery(){

      this.queryParams = {
        name: '',
        idCard:'',
        dept: '',
        operateTypeId: null,
        isCm: 1,
        pageNum: 1,
        pageSize: 10
      }
      this.getList()
    },
    handleAdd(){
      this.$refs.addDialogRef.openDialog();
    openViolation(data,type){
      this.$refs.violationDialog.openDialog(data,type);
    }
  }
};

 src/views/notCoalMine/nCertificateList/components/certificateDialog.vue

New file
@@ -0,0 +1,415 @@
<template>
  <el-dialog :title="title" :visible.sync="open" width="50%" append-to-body>
    <div class="main_form">
      <el-form :model="form" :rules="rules" ref="ruleForm" label-width="200px" :label-position="labelPosition">
        <el-row>
          <el-col :span="20">
            <el-form-item label="姓名" prop="name">
              <el-input v-model="form.name" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="性别" prop="sex">
              <el-radio-group v-model="form.sex" :disabled="disable">
                <el-radio label="男">男</el-radio>
                <el-radio label="女">女</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="身份证号" prop="idcardNum">
              <el-input v-model="form.idcardNum" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="证书编号" prop="certNum">
              <el-input v-model="form.certNum" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="资格类型" prop="personTypeName">
              <el-input v-model="form.personTypeName" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="作业类别" prop="jobTypeName">
              <el-input v-model="form.jobTypeName" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="操作项目" prop="operItemName">
              <el-input v-model="form.operItemName" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="初领日期" prop="firstCertDate">
              <el-input v-model="form.firstCertDate" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="发证日期" prop="createTime">
              <el-input v-model="form.createTime" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="有效期从" prop="validBeginDate">
              <el-input v-model="form.validBeginDate" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="有效期至" prop="validEndDate">
              <el-input v-model="form.validEndDate" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="复审期" prop="shouldReviewDate">
              <el-input v-model="form.shouldReviewDate" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="20">
            <el-form-item label="图片查看" prop="imgPath">
              <el-image
                style="width: 100px; height: 100px"
                :src="imgPath"
                fit="fill"></el-image>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div style="width: 100%;padding-bottom: 30px;display: flex;justify-content: center">
        <el-button v-if="title == '查看证书'" type="primary" @click="open = false">确认</el-button>
        <el-button v-else type="primary" @click="submit()">提交</el-button>
      </div>
      <el-dialog :visible.sync="dialogVisible">
        <img width="100%" :src="dialogImageUrl" alt="">
      </el-dialog>
    </div>
  </el-dialog>
</template>

<script>
// import {getExpertTypes,addExpertInfo,uploadFile} from '@/api/system/form'
// import { verifySimplePhone, verifyIdCard } from "@/utils/validate";
export default {
  name: "nCertificateDialog",
  dicts: ['sys_nation_code'],
  data() {
    var validatePass = (rule, value, callback) => {
      if (this.fileList.length == 0) {
        callback(new Error('请上传证件照'));
      } else {
        callback();
      }
    }
    let validatePhone = (rule, value, callback)=>{
      if(value === ''){
        callback(new Error('请输入手机号'))
      }else{
        if(!verifySimplePhone(value)){
          callback(new Error('手机号格式有误'))
        }else{
          callback()
        }
      }
    }
    let verifyId = (rule, value, callback)=>{
      if(value === ''){
        callback(new Error('请输入身份证号'))
      }else{
        if(!verifyIdCard(value)){
          callback(new Error('身份证号格式有误'))
        }else{
          callback()
        }
      }
    }
    return {
      labelPosition: 'right',
      title: '新增证书',
      disable: false,
      open: false,
      form:{
        name: '',
        sex: '',
        idcardNum: '',
        certNum: '',
        personTypeName: '',
        jobTypeName: '',
        operItemName: '',
        firstCertDate: '',
        createTime: '',
        validBeginDate: '',
        validEndDate: '',
        shouldReviewDate: '',
        imgPath: ''
      },
      fileList: [],
      dialogImageUrl: '',
      dialogVisible: false,
      rules:{
        name:[{ required: true, message: '请填写姓名', trigger: 'blur' }],
        sex:[{ required: true, message: '请选择性别', trigger: 'blur' }],
        idCard: [{ required: true, validator: verifyId, trigger: 'blur' }],
        race: [{ required: true, message: '请选择民族', trigger: 'blur' }],
        phone:[{ required: true, validator: validatePhone, trigger: 'blur' }],
        degree: [{ required: true, message: '请填写最高学历', trigger: 'blur' }],
        photoPath: [{ required: true,validator: validatePass, trigger: 'blur' }]
      },
    };
  },
  created() {
    const t = this
  },
  methods: {
    openDialog(val,type){
      if(type == 'add'){
        this.title = '新增证书'
        this.disable = false
      }else{
        if(type == 'edit'){
          this.title = '编辑证书'
          this.disable = false
        }else{
          this.title = '查看证书'
          this.disable = true
        }
        // this.form = val
        for(let i in val){
          if(this.isValidKey(i,this.form)){
            this.form[i] = val[i]
          }
        }
      }
      this.open = true
    },
    isValidKey(key,obj){
      return key in obj
    },

    async getExpertsType(){
      const res = await getExpertTypes()
      if(res.code == 200){
        this.expertsType = res.data
      }else{
        this.$message({
          type: 'warning',
          message: res.msg
        });
      }
    },
    avatorChange(file, fileList) {
      this.fileList = fileList;
    },
    overLimit(){
      this.$message({
        type: 'warning',
        message: '超出文件上传数量'
      });
    },
    handlePreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    beforeAvatarUpload(file) {
      const isLt5M = file.size / 1024 / 1024 < 5;
      if (!isLt5M) {
        this.$message.error('上传头像图片大小不能超过 5MB!');
      }
      return isLt5M;
    },
    async submitUpload() {
      const t = this;
      // 创建一个数组来存储所有上传操作的 Promise
      const uploadPromises = [];
      // 定义一个函数来上传文件并将结果存入 resumeLink 数组
      async function uploadAndCollect(fileList, type) {
        if (fileList.length > 0) {
          const resumeLink = [];
          for (const file of fileList) {
            const formData = new FormData();
            formData.append("file", file.raw);
            formData.append("module", 'expertPath');

            const res = await uploadFile(formData);
            if (res.code === 200) {
              resumeLink.push(res.data[0].fileKey);
            } else {
              this.$message.error('图片上传出错!');
            }
          }
          // 将收集到的文件链接设置到 this.form 中
          if (type == '证件照') { t.form.photoPath = resumeLink.join(',')}
          return resumeLink;
        }
        return [];
      }
      // 依次执行上传操作并等待完成
      uploadPromises.push(uploadAndCollect(t.fileList, '证件照'));
      // 等待所有上传操作完成
      await Promise.all(uploadPromises);
      // 打印已更新的 this.form
      console.log(t.form, 'form1');
    },
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    async submit(){
      if(this.form.supportDirectionSafety.length == 0 && this.form.supportDirectionPrevention.length == 0 && this.form.supportDirectionEmergency.length == 0){
        this.$message({
          type:'warning',
          message: '请至少选择一种支撑方向'
        })
        return
      }
      this.$refs["ruleForm"].validate(async(valid) =>{
        if(valid) {
          await this.submitUpload()
          let data = this.form
          data.supportDirectionSafety = data.supportDirectionSafety.join(',')
          data.supportDirectionPrevention = data.supportDirectionPrevention.join(',')
          data.supportDirectionEmergency = data.supportDirectionEmergency.join(',')
          data.bigClassify = data.profession[0]
          data.smallClassify = data.profession[1]
          delete data.profession
          const res= await addExpertInfo(data)
          if(res.code == 200){
            this.$message({
              type:'success',
              message: res.msg
            })
            this.$emit('closeDialog')
            this.$refs.ruleForm.resetFields()
            this.fileList = []
          }else{
            this.$message({
              type:'warning',
              message: res.msg
            })
          }
        }else{
          this.$message({
            type:'warning',
            message:'请完善必填信息'
          })
        }
      })
    },
    changeSource(num){
      this.form.source = num
    }
  }
};
</script>

<style scoped lang="scss">
.home {
  blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #eee;
  }
  hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee;
  }
  .col-item {
    margin-bottom: 20px;
  }

  ul {
    padding: 0;
    margin: 0;
  }

  font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  color: #676a6c;
  overflow-x: hidden;

  ul {
    list-style-type: none;
  }

  h4 {
    margin-top: 0px;
  }

  h2 {
    margin-top: 10px;
    font-size: 26px;
    font-weight: 100;
  }

  p {
    margin-top: 10px;

    b {
      font-weight: 700;
    }
  }

  .update-log {
    ol {
      display: block;
      list-style-type: decimal;
      margin-block-start: 1em;
      margin-block-end: 1em;
      margin-inline-start: 0;
      margin-inline-end: 0;
      padding-inline-start: 40px;
    }
  }
}
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409EFF;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>


 src/views/notCoalMine/nCertificateList/index.vue

@@ -1,17 +1,17 @@
<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="用户姓名" prop="userName">
      <el-form-item label="用户姓名" prop="name">
        <el-input
          v-model="queryParams.userName"
          v-model="queryParams.name"
          placeholder="请输入用户姓名"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="身份证号" prop="idCard">
      <el-form-item label="身份证号" prop="idcardNum">
        <el-input
          v-model="queryParams.idCard"
          v-model="queryParams.idcardNum"
          placeholder="请输入身份证号"
          clearable
          @keyup.enter.native="handleQuery"
@@ -30,94 +30,125 @@
          plain
          icon="el-icon-refresh"
          size="mini"
          @click="handleAdd"
          @click="resetQuery"
          v-hasPermi="['system:experts:add']"
        >同步数据</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getPage"></right-toolbar>
    </el-row>
    <el-table v-loading="loading" :data="expertList">
    <el-table v-loading="loading" :data="dataList">
      <el-table-column type="index" label="序号" width="55" align="center" />
      <el-table-column label="姓名" align="center" prop="name" />
      <el-table-column label="性别" align="center" prop="name" />
      <el-table-column label="身份证号" align="center" prop="name" />
      <el-table-column label="电话" align="center" prop="phone"/>
      <el-table-column label="民族" align="center" prop="phone"/>
      <el-table-column label="最高学历" align="center" prop="degree" />
      <el-table-column label="资格类型" align="center" prop="job" />
      <el-table-column label="作业类别" align="center" prop="job" />
      <el-table-column label="操作项目" align="center" prop="speciality" />
      <el-table-column label="初领日期" align="center"/>
      <el-table-column label="发证日期" align="center"/>
      <el-table-column label="有效期从" align="center"/>
      <el-table-column label="有效期到" align="center"/>
      <el-table-column label="一次复审期" align="center"/>
      <el-table-column label="二次复审期" align="center"/>
      <el-table-column label="历史记录" align="center"/>
      <el-table-column label="性别" align="center" prop="sex"/>
      <el-table-column label="身份证号" align="center" prop="idcardNum">
        <template #default="scope">
          {{scope.row.idcardNum | peridcardtm}}
        </template>
      </el-table-column>
<!--      <el-table-column label="电话" align="center" prop="phone"/>-->
<!--      <el-table-column label="民族" align="center" prop="phone"/>-->
<!--      <el-table-column label="最高学历" align="center" prop="degree" />-->
      <el-table-column label="资格类型" align="center" prop="personTypeName" />
      <el-table-column label="作业类别" align="center" prop="jobTypeName" />
      <el-table-column label="操作项目" align="center" prop="operItemName" />
      <el-table-column label="初领日期" align="center" prop="firstCertDate"/>
      <el-table-column label="发证日期" align="center" prop="createTime">
        <template #default="scope">
          {{scope.row.createTime.substring(0,7)}}
        </template>
      </el-table-column>
      <el-table-column label="有效期从" align="center" prop="validBeginDate"/>
      <el-table-column label="有效期到" align="center" prop="validEndDate"/>
      <el-table-column label="复审期" align="center" prop="shouldReviewDate"/>
<!--      <el-table-column label="二次复审期" align="center" prop="operItemName"/>-->
<!--      <el-table-column label="历史记录" align="center" prop="operItemName"/>-->
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
<!--          <el-button-->
<!--            size="mini"-->
<!--            type="text"-->
<!--            icon="el-icon-edit"-->
<!--            @click="handleUpdate(scope.row)"-->
<!--          >编辑</el-button>-->
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="openCert(scope.row,'view')"
          >查看</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageIndex"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
      @pagination="getPage"
    />
    <certificate-dialog ref="certificate" @getList="getPage"></certificate-dialog>
  </div>
</template>

<script>
import { getCertificatePage } from "@/api/notCoalMine/certifiate";
import certificateDialog from "@/views/notCoalMine/nCertificateList/components/certificateDialog";
export default {
  name: "nPeopleManage",
  name: "nCertificateManage",
  dicts: [],
  components: {},
  components: {certificateDialog},
  data() {
    return {
      loading: false,
      single: true,
      multiple: true,
      showSearch: true,
      addForm: false,
      total: 0,
      expertTypes: [],
      expertList: [],
      queryParams: {},
      classiFy: [],
      form: {},
      rules: {
        classifyName: [
          { required: true, message: "分类名称不能为空", trigger: "blur" }
        ]
      dataList: [],
      queryParams: {
        idcardNum: '',
        name: '',
        idcardTypeCode: '',
        pageNum: 1,
        pageSize: 10
      }
    };
  },
  created() {

    this.getPage()
  },
  methods: {
    getList(){

    async getPage(){
      const t = this
      t.loading = true
      if(t.queryParams.idcardNum !== ''){
        t.queryParams.idcardTypeCode = '01'
      }else{
        t.queryParams.idcardTypeCode = ''
      }
      const res = await getCertificatePage(t.queryParams)
      if(res.code == 200){
        t.dataList = res.rows
        t.total = res.total
      }else{
        t.$message({
          message: res.msg,
          type: 'warning'
        })
      }
      t.loading = false
    },
    handleChange(){

    },
    handleQuery(){

      this.queryParams.pageNum = 1
      this.getPage()
    },
    resetQuery(){

      this.queryParams={
        idcardNum: '',
        name: '',
        idcardTypeCode: '01',
        pageNum: 1,
        pageSize: 10
      }
      this.getPage()
    },
    handleAdd(){

    openCert(data,type){
      this.$refs.certificate.openDialog(data,type)
    }
  }
};

 src/views/notCoalMine/nJobRegistration/components/addDialog.vue

File was deleted

 src/views/notCoalMine/nJobRegistration/components/jobRegistDialog.vue

New file
@@ -0,0 +1,219 @@
<template>
  <el-dialog
    :title="title"
    :visible.sync="open"
    append-to-body
    width="50%"
    :before-close="handleClose"
  >
    <el-form ref="ruleForm" :model="form"  :rules="rules" label-position="right" label-width="150px" style="padding-right: 50px" element-loading-text="保存中...">
      <el-form-item label="姓名:" prop="name">
        <el-input v-model.trim="form.name" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="身份证号:" prop="idCard">
        <el-input v-model.trim="form.idCard" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="IC卡编号:" prop="icNum">
        <el-input v-model.trim="form.icNum" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="电子证号:" prop="electNum">
        <el-input v-model.trim="form.electNum" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="所属单位:" prop="dept">
        <el-input v-model.trim="form.dept" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="操作类型:" prop="operateTypeId">
        <el-cascader
          v-model="form.operateTypeId"
          :options="typeList"
          :disabled="disable"
          :show-all-levels="false"
          :props="{ expandTrigger: 'hover', value: 'id',label: 'name',emitPath:false}"></el-cascader>
      </el-form-item>
      <el-form-item label="作业时间:" prop="workTime">
        <el-date-picker
          v-model="form.workTime"
          type="date"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd 00:00:00"
          placeholder="选择日期"
          :disabled="disable">
        </el-date-picker>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="handleClose">取消</el-button>
      <el-button v-if="disable == false" type="primary" @click="submit">提交</el-button>
      <el-button v-else type="primary" @click="handleClose">确定</el-button>
    </span>
    <el-dialog :visible.sync="dialogVisible" append-to-body>
      <img width="100%" :src="dialogImageUrl" alt="">
    </el-dialog>
  </el-dialog>
</template>

<script >
import {verifyIdCard} from "@/utils/validate";
import {addJobRegist, editJobRegist} from "@/api/coalMine/jobRegist";

export default {
  name: 'violationDialog',
  components: {
  },
  props: ['typeList'],
  data() {
    let verifyId = (rule, value, callback)=>{
      if(value === ''){
        callback(new Error('请输入身份证号'))
      }else{
        if(!verifyIdCard(value)){
          callback(new Error('身份证号格式有误'))
        }else{
          callback()
        }
      }
    }
    return {
      disable: false,
      title: '新增登记',
      open: false,
      form:{
        workId: null,
        isCm: 0,
        name: '',
        idCard: '',
        icNum: '',
        electNum: '',
        dept: '',
        operateTypeId: null,
        workTime: '',
        remark: ''
      },
      fileList: [],
      dialogImageUrl: '',
      dialogVisible: false,
      rules:{
        name:[{ required: true, message: '请填写姓名', trigger: 'blur' }],
        // idCard: [{ required: true, validator: verifyId, trigger: 'blur' }],
        idCard: [{ required: true, message: '请填写身份证号', trigger: 'blur' }],
        dept: [{ required: true, message: '请填写所在单位', trigger: 'blur' }],
        operateTypeId: [{ required: true, message: '请选择操作类型', trigger: 'blur' }],
        workTime: [{ required: true, message: '请选择作业时间', trigger: 'blur' }]
      },
    }
  },
  created() {

  },
  methods: {
    openDialog (val,type) {
      const t = this
      t.fileList = []
      t.open = true
      if(type == 'add'){
        t.title = '新增登记'
        t.disable = false
        t.form = {
          workId: null,
          isCm: 0,
          name: '',
          idCard: '',
          icNum: '',
          electNum: '',
          dept: '',
          operateTypeId: null,
          workTime: '',
          remark: ''
        }
      }else{
        if(type == 'edit'){
          t.title = '编辑'
          t.disable = false
        }else{
          t.title = '查看'
          t.disable = true
        }
        if(val){
          for(let i in val){
            if(t.isValidKey(i,this.form)){
              t.form[i] = val[i]
            }
          }
        }
        t.form.workTime = t.form.workTime + ' 00:00:00'
      }
    },
    isValidKey(key,obj){
      return key in obj
    },

    handleClose() {
      this.open = false;
      this.resetForm();
    },
    async submit(){
      this.$refs["ruleForm"].validate(async(valid) =>{
        if(valid) {
          if(this.title == '新增登记'){
            const {workId,...data} = this.form
            const res= await addJobRegist(data)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.fileList = []
              this.open = false
              this.$emit('getList')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }else{
            const res= await editJobRegist(this.form)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.fileList = []
              this.open = false
              this.$emit('getList')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }
        }else{
          this.$message({
            type:'warning',
            message:'请完善必填信息'
          })
        }
      })
    },
    resetForm() {
      this.form = {
        workId: null,
        isCm: 0,
        name: '',
        idCard: '',
        icNum: '',
        electNum: '',
        dept: '',
        operateTypeId: null,
        workTime: '',
        remark: ''
      }
    },
  }
}

</script>
<style scoped>

</style>

 src/views/notCoalMine/nJobRegistration/index.vue

@@ -3,7 +3,7 @@
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="用户姓名" prop="userName">
        <el-input
          v-model="queryParams.userName"
          v-model="queryParams.name"
          placeholder="请输入用户姓名"
          clearable
          @keyup.enter.native="handleQuery"
@@ -17,19 +17,20 @@
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="单位名称" prop="idCard">
      <el-form-item label="单位名称" prop="dept">
        <el-input
          v-model="queryParams.unit"
          v-model="queryParams.dept"
          placeholder="请输入单位名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="作业类型">
      <el-form-item label="操作类型">
        <el-cascader
          v-model="classiFy"
          :options="expertTypes"
          :props="{ expandTrigger: 'hover', value: 'id',label: 'label'}"
          v-model="queryParams.operateTypeId"
          :options="typeList"
          :show-all-levels="false"
          :props="{ expandTrigger: 'hover', value: 'id',label: 'name',emitPath:false}"
          @change="handleChange"></el-cascader>
      </el-form-item>
      <el-form-item>
@@ -44,27 +45,35 @@
          type="primary"
          plain
          size="mini"
          @click="handleAdd"
          @click="openJobRegist({},'add')"
          v-hasPermi="['system:experts:add']"
        >新增填报</el-button>
        >新增作业</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>
    <el-table v-loading="loading" :data="expertList">
      <el-table-column label="作业日期" align="center" prop="name" />
    <el-table v-loading="loading" :data="dataList">
      <el-table-column label="发生时间" align="center" prop="workTime" />
      <el-table-column label="姓名" align="center" prop="name" />
      <el-table-column label="身份证号" align="center" prop="name" />
      <el-table-column label="IC/电子证编号" align="center" prop="phone"/>
      <el-table-column label="所属单位" align="center" prop="phone"/>
      <el-table-column label="作业种类" align="center" prop="phone"/>
      <el-table-column label="身份证号" align="center" prop="idCard" />
      <el-table-column label="IC卡编号" align="center" prop="icNum"/>
      <el-table-column label="电子证编号" align="center" prop="electNum"/>
      <el-table-column label="所属单位" align="center" prop="dept"/>
      <el-table-column label="作业种类" align="center" prop="jobCategory"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
<!--          <el-button-->
<!--            size="mini"-->
<!--            type="text"-->
<!--            icon="el-icon-view"-->
<!--            @click="handleView(scope.row)"-->
<!--          >查看违规详情</el-button>-->
          <el-button
            size="mini"
            type="text"
            icon="el-icon-view"
            @click="openJobRegist(scope.row,'view')"
          >查看详情</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="openJobRegist(scope.row,'edit')"
            v-hasPermi="['system:experts:remove']"
          >编辑</el-button>
          <el-button
            size="mini"
            type="text"
@@ -78,62 +87,121 @@
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageIndex"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
    <add-dialog ref="addDialogRef" @getList = "getList"></add-dialog>
    <jobRegist-dialog ref="jobRegistDialog" @getList="getList" :typeList="typeList"></jobRegist-dialog>
  </div>
</template>

<script>

import addDialog from "@/views/notCoalMine/nJobRegistration/components/addDialog.vue";
import jobRegistDialog from "@/views/notCoalMine/nJobRegistration/components/jobRegistDialog";
import {getOperatePage} from "@/api/coalMine/operateType";
import {delJobRegist, getJobRegistPage} from "@/api/coalMine/jobRegist";
export default {
  name: "nViolationRegistration",
  name: "cJobRegist",
  dicts: [],
  components: {
    addDialog
    jobRegistDialog
  },
  data() {
    return {
      addDialogRef: '',
      violationDialog: '',
      loading: false,
      single: true,
      multiple: true,
      showSearch: true,
      addForm: false,
      dataList: [],
      total: 0,
      expertTypes: [],
      expertList: [],
      queryParams: {},
      classiFy: [],
      form: {},
      rules: {
        classifyName: [
          { required: true, message: "分类名称不能为空", trigger: "blur" }
        ]
      }
      typeList: [],
      queryParams: {
        name: '',
        idCard:'',
        dept: '',
        operateTypeId: null,
        isCm: 0,
        pageNum: 1,
        pageSize: 10
      },
    };
  },
  created() {

    this.getList()
    this.getTypeList()
  },
  methods: {
    getList(){

    async getList(){
      const t = this
      t.loading = true
      const res = await getJobRegistPage(t.queryParams)
      if(res.code == 200){
        t.dataList = res.rows
        t.total = res.total
      }else{
        t.$message({
          message: res.msg,
          type: 'warning'
        })
      }
      t.loading = false
    },
    async getTypeList() {
      this.loading = true;
      const res = await getOperatePage({name: ''})
      if(res.code == 200){
        this.typeList = this.handleTree(res.data, "id");
      }else{
        this.$message({
          type: 'warning',
          message: res.msg
        });
      }
      this.loading = false;
    },
    handleChange(){

    },
    handleQuery(){
    handleDelete(row){
      this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await delJobRegist(row.workId)
        if(res.code == 200){
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          await this.getList()
        }else{
          this.$message({
            type: 'warning',
            message: res.msg
          });
        }
      }).catch(() => {

      });
    },
    handleQuery(){
      this.queryParams.pageNum = 1
      this.getList()
    },
    resetQuery(){

      this.queryParams = {
        name: '',
        idCard:'',
        dept: '',
        operateTypeId: null,
        isCm: 0,
        pageNum: 1,
        pageSize: 10
      }
      this.getList()
    },
    handleAdd(){
      this.$refs.addDialogRef.openDialog();
    openJobRegist(data,type){
      this.$refs.jobRegistDialog.openDialog(data,type);
    }
  }
};

 src/views/notCoalMine/nPeopleManage/components/peopleDialog.vue

@@ -76,9 +76,9 @@
        </el-row>
        <template v-if="title == '查看人员'">
          <el-row v-if="form.violationList && form.violationList.length>0">
            <el-col :span="20">
            <el-col :span="24">
              <el-form-item label="违章记录">
                <el-table :data="form.violationList">
                <el-table :data="form.violationList" border>
                  <el-table-column label="时间" align="center">
                    <template #default="scope">
                      {{scope.row.startTime + '--' + scope.row.endTime}}
@@ -90,9 +90,9 @@
            </el-col>
          </el-row>
          <el-row v-if="form.resumeList && form.resumeList.length>0">
            <el-col :span="20">
            <el-col :span="24">
              <el-form-item label="个人履历">
                <el-table :data="form.resumeList">
                <el-table :data="form.resumeList" border>
                  <el-table-column label="时间" align="center">
                    <template #default="scope">
                      {{scope.row.startTime + '--' + scope.row.endTime}}
@@ -104,9 +104,9 @@
            </el-col>
          </el-row>
          <el-row v-if="form.trainList && form.trainList.length>0">
            <el-col :span="20">
            <el-col :span="24">
              <el-form-item label="培训经历">
                <el-table :data="form.trainList">
                <el-table :data="form.trainList" border>
                  <el-table-column label="培训时间" align="center">
                    <template #default="scope">
                      {{scope.row.startTime + '--' + scope.row.endTime}}
@@ -120,9 +120,9 @@
            </el-col>
          </el-row>
          <el-row v-if="form.examineeList && form.examineeList.length>0">
            <el-col :span="20">
            <el-col :span="24">
              <el-form-item label="考试经历">
                <el-table :data="form.examineeList">
                <el-table :data="form.examineeList" border>
                  <el-table-column label="考试时间" align="center">
                    <template #default="scope">
                      {{scope.row.startTime + '--' + scope.row.endTime}}
@@ -232,14 +232,13 @@
          this.title = '查看人员'
          this.disable = true
        }
        this.form = val
        // if(val){
        //   for(let i in val){
        //     if(this.isValidKey(i,this.form)){
        //       this.form[i] = val[i]
        //     }
        //   }
        // }
        // this.form = val
        for(let i in val){
          if(this.isValidKey(i,this.form)){
            this.form[i] = val[i]
          }
        }
        this.form.sex = Number(this.form.sex)
      }
      this.open = true
    },

 src/views/notCoalMine/nPeopleManage/index.vue

@@ -147,7 +147,7 @@
      if(obj){
        return obj.label
      }else{
        return '无'
        return '未知'
      }
    },
    openPeople(data,type){
@@ -161,7 +161,12 @@
      this.getPage()
    },
    resetQuery(){
      this.$refs['queryForm'].resetFields()
      this.queryParams={
        idCardNum: '',
        name: '',
        pageNum: 1,
        pageSize: 10
      }
      this.getPage()
    },
    handleAdd(){

 src/views/notCoalMine/nTeacherManage/nReviewer/components/reviewerDialog.vue

New file
@@ -0,0 +1,638 @@
<template>
  <el-dialog :title="title" :visible.sync="open" width="50%" append-to-body>
    <div class="main_form">
      <el-form :model="form" :rules="rules" ref="ruleForm" label-width="200px" :label-position="labelPosition">
        <el-row>
          <el-col :span="20">
            <el-form-item label="姓名" prop="name">
              <el-input v-model="form.name" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="性别" prop="sex">
              <el-radio-group v-model="form.sex" :disabled="disable">
                <el-radio :label="0">男</el-radio>
                <el-radio :label="1">女</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="身份证号" prop="code">
              <el-input v-model="form.code" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="联系电话" prop="mobilePhone">
              <el-input v-model="form.mobilePhone" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="职称" prop="jobTitle">
              <el-input v-model="form.jobTitle" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="最高学历" prop="eduLevel">
              <el-select v-model="form.eduLevel" placeholder="请选择" style="width: 100%" :disabled="disable">
                <el-option
                  v-for="dict in dict.type.sys_highest_education_code"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="资质到期" prop="expiredTime">
              <el-date-picker
                style="width: 100%"
                v-model="form.expiredTime"
                value-format="yyyy-MM-dd"
                type="date"
                :disabled="disable"
                placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="在职情况" prop="status">
              <el-radio-group v-model="form.status" :disabled="disable">
                <el-radio label="0">正常</el-radio>
                <el-radio label="1">停用</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="描述">
              <el-input v-model="form.description" type="textarea" :autosize="{ minRows: 2}" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="证件照" prop="photoAttachment">
              <el-upload
                :disabled="disable"
                action="#"
                multiple
                :limit="1"
                :on-exceed="overLimit"
                :auto-upload="false"
                accept="image/*,.pdf"
                :file-list="resumeList"
                list-type="picture-card"
                :before-upload="beforeAvatarUpload"
                :on-change="resumeChange"
                :on-preview="handlePreview"
                :on-remove="(file,fileList)=>handleRemove(file,fileList,'证件照')">
                <i class="el-icon-plus"></i>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="资质" prop="qaAttachment">
              <el-upload
                :disabled="disable"
                action=""
                multiple
                :limit="1"
                :on-exceed="overLimit"
                :auto-upload="false"
                accept="image/*,.pdf"
                list-type="picture-card"
                :file-list="inventionList"
                :before-upload="beforeAvatarUpload"
                :on-change="inventChange"
                :on-preview="handlePreview"
                :on-remove="(file,fileList)=>handleRemove(file,fileList,'资质')">
                <i class="el-icon-plus"></i>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="工种详情" prop="operateTypes">
                <el-table :data="form.operateTypes" border>
                  <el-table-column label="序号" type="index" align="center"/>
                  <el-table-column label="资格类型" align="center" prop="qualificationType" />
                  <el-table-column label="作业类别" align="center" prop="jobCategory" />
                  <el-table-column label="操作项目" align="center" prop="operationItems"/>
                  <el-table-column label="操作" align="center" class-name="small-padding fixed-width" v-if="disable == false">
                    <template #default="scope">
<!--                      <el-button size="mini" type="text" icon="el-icon-edit" @click="openEdit(scope.row,'edit')">编辑</el-button>-->
                      <el-button size="mini" type="text" icon="el-icon-delete" @click="deleteItem(scope.index)" v-hasPermi="['system:experts:remove']">删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>
                <el-button v-if="disable == false" @click="openEdit({},'add')" style="margin-top: 15px">新增</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div style="width: 100%;padding-bottom: 30px;display: flex;justify-content: center" v-if="disable == false">
        <el-button type="primary" @click="submit()">提交</el-button>
      </div>
      <el-dialog :visible.sync="dialogVisible" append-to-body>
        <img width="100%" :src="dialogImageUrl" alt="">
      </el-dialog>
      <el-dialog :title="dialogTitle" :visible.sync="addVisible" width="50%" append-to-body>
        <el-form :model="addForm" :rules="addRules" ref="addRuleForm" label-width="200px">
          <el-row>
            <el-col :span="20">
              <el-form-item label="资格类型" prop="operate">
                <el-cascader
                  v-model="addForm.operate"
                  :options="typeList"
                  style="width: 100%"
                  :props="{ expandTrigger: 'hover', value: 'id',label: 'name'}"></el-cascader>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div style="width: 100%;padding-bottom: 30px;display: flex;justify-content: center">
          <el-button type="primary" @click="submitAdd()">提交</el-button>
        </div>
      </el-dialog>
    </div>
  </el-dialog>
</template>

<script>
import { verifySimplePhone, verifyIdCard } from "@/utils/validate";
import {getOperatePage} from "@/api/coalMine/operateType";
import {addExaminer, editExaminer, uploadFile} from "@/api/coalMine/teacher";
export default {
  name: "teacherDialog",
  dicts: ['sys_highest_education_code'],
  data() {
    // let validateTypes = (rule, value, callback) => {
    //   if (this.form.operateTypes.length == 0) {
    //     callback(new Error('请添加工种详情'));
    //   } else {
    //     callback();
    //   }
    // }
    let validateResume = (rule, value, callback) => {
      if (this.resumeList.length == 0) {
        callback(new Error('请上传证件照'));
      } else {
        callback();
      }
    }
    let validateCert = (rule, value, callback) => {
      if (this.inventionList.length == 0) {
        callback(new Error('请上传资质证书'));
      } else {
        callback();
      }
    }
    let validatePhone = (rule, value, callback)=>{
      if(value === ''){
        callback(new Error('请输入手机号'))
      }else{
        if(!verifySimplePhone(value)){
          callback(new Error('手机号格式有误'))
        }else{
          callback()
        }
      }
    }
    let verifyId = (rule, value, callback)=>{
      if(value === ''){
        callback(new Error('请输入身份证号'))
      }else{
        if(!verifyIdCard(value)){
          callback(new Error('身份证号格式有误'))
        }else{
          callback()
        }
      }
    }
    return {
      title: '新增考评员',
      open: false,
      disable: false,
      labelPosition: 'right',
      form:{
        id: null,
        isCm: '0',
        name:'',
        sex:'',
        code: '',
        mobilePhone: '',
        jobTitle: '',
        eduLevel: '',
        expiredTime: '',
        status: '',
        operateTypes: [],
        photoAttachment: null,
        qaAttachment: null,
        description: '',
      },
      resumeList: [],
      inventionList: [],
      dialogImageUrl: '',
      dialogVisible: false,
      dialogTitle: '新增',
      addVisible: false,
      addForm: {
        operate: [],
        qualificationType: '',
        jobCategory: '',
        operationItems: '',
        operateTypeId: null
      },
      typeList: [],
      rules:{
        name:[{ required: true, message: '请填写姓名', trigger: 'blur'}],
        sex:[{ required: true, message: '请选择性别', trigger: 'blur'}],
        code:[{ required: true, validator: verifyId, trigger: 'blur' }],
        mobilePhone:[{ required: true, validator: validatePhone, trigger: 'blur' }],
        // code:[{ required: true, message: '请填写身份证号', trigger: 'blur'}],
        // mobilePhone:[{ required: true, message: '请填写联系方式', trigger: 'blur'}],
        jobTitle: [{ required: true, message: '请填写职称', trigger: 'blur'}],
        eduLevel: [{ required: true, message: '请选择最高学历', trigger: 'blur'}],
        expiredTime: [{ required: true, message: '请选择到期时间', trigger: 'blur'}],
        status: [{ required: true, message: '请选择在岗情况', trigger: 'blur'}],
        // operateTypes: [{ required: true,validator: validateTypes, trigger: 'blur' }],
        photoAttachment: [{ required: true,validator: validateResume, trigger: 'blur'}],
        qaAttachment: [{ required: true,validator: validateCert, trigger: 'blur'}]
      },
      addRules:{
        operate:[{ required: true, message: '请选择', trigger: 'blur' }]
      }
    };
  },
  created() {
    const t = this
  },
  methods: {
    openDialog(val,type){
      this.resumeList = []
      this.inventionList = []
      if(type == 'add'){
        this.title = '新增考评员'
        this.disable = false
        this.form = {
          id: null,
          isCm: '0',
          name:'',
          sex:'',
          code: '',
          mobilePhone: '',
          jobTitle: '',
          eduLevel: '',
          expiredTime: '',
          status: '',
          operateTypes: [],
          photoAttachment: null,
          qaAttachment: null,
          description: '',
        }
      }else{
        if(type == 'edit'){
          this.title = '编辑考评员'
          this.disable = false
        }else{
          this.title = '查看考评员'
          this.disable = true
        }
        if(val){
          for(let i in val){
            if(this.isValidKey(i,this.form)){
              this.form[i] = val[i]
            }
          }
        }
        this.form.sex = Number(this.form.sex)
        // 仅限单张图片处理
        this.form.photoAttachment = val.photoAttachment.id
        this.form.qaAttachment = val.qaAttachment.id
        this.resumeList.push({
          name: val.photoAttachment.fileName,
          url: process.env.VUE_APP_BASE_API + val.photoAttachment.fileUrl
        })
        this.inventionList.push({
          name: val.qaAttachment.fileName,
          url: process.env.VUE_APP_BASE_API + val.qaAttachment.fileUrl
        })
        if(!this.form.operateTypes){
          this.form.operateTypes = []
        }
        console.log(this.form,'form')
      }
      this.open = true
    },

    isValidKey(key,obj){
      return key in obj
    },

    openEdit(data,type){
      this.getList()
      if(type == 'add'){
        this.dialogTitle = '新增'
        this.addVisible = true
        this.addForm = {
          operate: [],
          qualificationType: '',
          jobCategory: '',
          operationItems: '',
          operateTypeId: null
        }
      }else{

      }
    },
    async submitUpload() {
      const { resumeList, inventionList, form } = this;
      const uploadAndCollect = async (fileList, type) => {
        if (fileList.length > 0 && fileList.find((file)=>file.raw)) {
          for (const file of fileList) {
            const formData = new FormData();
            formData.append("file", file.raw);
            formData.append("module", 'accountPath');
            try {
              const res = await uploadFile(formData);
              if (res.code === 200) {
                if (type === '证件照') {
                  form.photoAttachment = res.data.id;
                }
                if (type === '资质') {
                  form.qaAttachment = res.data.id;
                }
              } else {
                this.$message.error('图片上传出错!');
              }
            } catch (error) {
              this.$message.error('图片上传出错!');
            }
          }
        }else{
          return
        }
      };
      const uploadPromises = [
        uploadAndCollect(resumeList, '证件照'),
        uploadAndCollect(inventionList, '资质')
      ];
      try {
        await Promise.all(uploadPromises);
        console.log(form, 'form1');
      } catch (error) {
        console.error('上传出错:', error);
      }
    },

    async submit(){
      this.$refs["ruleForm"].validate(async(valid) =>{
        if(valid) {
          await this.submitUpload()
          if(this.title == '新增考评员'){
            const {id,...data} = this.form
            const res= await addExaminer(data)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.resumeList = []
              this.inventionList = []
              this.open = false
              this.$emit('closeDialog')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }else{
            const res= await editExaminer(this.form)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.fileList = []
              this.open = false
              this.$emit('closeDialog')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }
        }else{
          this.$message({
            type:'warning',
            message:'请完善必填信息'
          })
        }
      })
    },
    deleteItem(index){
      this.form.operateTypes.splice(index,1);
    },
    async getList() {
      this.loading = true;
      const res = await getOperatePage({name: ''})
      if(res.code == 200){
        this.typeList = this.handleTree(res.data, "id");
      }else{
        this.$message({
          type: 'warning',
          message: res.msg
        });
      }
      this.loading = false;
    },

    resumeChange(file, fileList) {
      this.resumeList = fileList;
    },
    inventChange(file, fileList){
      this.inventionList = fileList;
    },
    overLimit(){
      this.$message({
        type: 'warning',
        message: '超出文件上传数量'
      });
    },
    handlePreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    beforeAvatarUpload(file) {
      const isLt5M = file.size / 1024 / 1024 < 5;
      if (!isLt5M) {
        this.$message.error('上传头像图片大小不能超过 5MB!');
      }
      return isLt5M;
    },

    handleRemove(file,fileList,type) {
      if(type == '证件照'){
        this.resumeList = fileList
      }else{
        this.inventionList = fileList
      }
    },
    async submitAdd(){
      this.$refs["addRuleForm"].validate(async(valid) =>{
        if(valid) {
          if(this.addForm.operate.length == 2){
            this.addForm.qualificationType = this.findNameById(this.typeList,this.addForm.operate[0])
            this.addForm.jobCategory = this.findNameById(this.typeList,this.addForm.operate[1])
            this.addForm.operateTypeId = this.addForm.operate[1]
          }
          if(this.addForm.operate.length == 3){
            this.addForm.qualificationType = this.findNameById(this.typeList,this.addForm.operate[0])
            this.addForm.jobCategory = this.findNameById(this.typeList,this.addForm.operate[1])
            this.addForm.operationItems = this.findNameById(this.typeList,this.addForm.operate[2])
            this.addForm.operateTypeId = this.addForm.operate[2]
          }
          const {operate,...obj} = this.addForm
          this.form.operateTypes.push(obj)
          this.addVisible = false
        }else{
          this.$message({
            type:'warning',
            message:'请完善必填信息'
          })
        }
      })
    },
    findNameById(data,id){
      for(const node of data){
        if(node.id == id){
          return node.name
        }
        if(node.children){
          const foundName = this.findNameById(node.children,id)
          if(foundName){
            return foundName
          }
        }
      }
      return null
    }
  }
};
</script>

<style scoped lang="scss">
.home {
  .main-title{
    font-size: 24px;
    font-weight: bolder;
    text-align: center;
    margin-bottom: 20px;
    color: #333;
  }
  blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #eee;
  }
  hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee;
  }
  .col-item {
    margin-bottom: 20px;
  }

  ul {
    padding: 0;
    margin: 0;
  }

  font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  color: #676a6c;
  overflow-x: hidden;

  ul {
    list-style-type: none;
  }

  h4 {
    margin-top: 0px;
  }

  h2 {
    margin-top: 10px;
    font-size: 26px;
    font-weight: 100;
  }

  p {
    margin-top: 10px;

    b {
      font-weight: 700;
    }
  }

  .update-log {
    ol {
      display: block;
      list-style-type: decimal;
      margin-block-start: 1em;
      margin-block-end: 1em;
      margin-inline-start: 0;
      margin-inline-end: 0;
      padding-inline-start: 40px;
    }
  }
}
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409EFF;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>


 src/views/notCoalMine/nTeacherManage/nReviewer/index.vue

@@ -1,27 +1,27 @@
<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="用户姓名" prop="userName">
        <el-input
          v-model="queryParams.userName"
          placeholder="请输入用户姓名"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="身份证号" prop="idCard">
        <el-input
          v-model="queryParams.idCard"
          placeholder="请输入身份证号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
<!--    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">-->
<!--      <el-form-item label="用户姓名" prop="userName">-->
<!--        <el-input-->
<!--          v-model="queryParams.userName"-->
<!--          placeholder="请输入用户姓名"-->
<!--          clearable-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="身份证号" prop="idCard">-->
<!--        <el-input-->
<!--          v-model="queryParams.idCard"-->
<!--          placeholder="请输入身份证号"-->
<!--          clearable-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item>-->
<!--        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>-->
<!--        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
<!--      </el-form-item>-->
<!--    </el-form>-->

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
@@ -30,90 +30,129 @@
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          @click="openDialog({},'add')"
          v-hasPermi="['system:experts:add']"
        >新增</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getPage"></right-toolbar>
    </el-row>
    <el-table v-loading="loading" :data="expertList">
    <el-table v-loading="loading" :data="dataList">
      <el-table-column type="index" label="序号" width="55" align="center" />
      <el-table-column label="姓名" align="center" prop="name" />
      <el-table-column label="性别" align="center" prop="name" />
      <el-table-column label="身份证号" align="center" prop="name" />
      <el-table-column label="最高学历" align="center" prop="degree" />
      <el-table-column label="职称" align="center" prop="job" />
      <el-table-column label="资质" align="center" prop="speciality" />
      <el-table-column label="资质有效期" align="center"/>
      <el-table-column label="描述" align="center"/>
      <el-table-column label="证件照" align="center"/>
      <el-table-column label="状态" align="center"/>
      <el-table-column label="工种详情" align="center"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
      <el-table-column label="性别" align="center" prop="sex">
        <template #default="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
          >编辑</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-view"
            @click="handleView(scope.row)"
          >停用</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['system:experts:remove']"
          >删除</el-button>
          {{ scope.row.sex == 0?'男':'女' }}
        </template>
      </el-table-column>
      <el-table-column label="身份证号" align="center" prop="code" />
      <el-table-column label="最高学历" align="center" prop="eduLevel">
        <template #default="scope">
          {{getDegreeName(scope.row.eduLevel)}}
        </template>
      </el-table-column>
      <el-table-column label="职称" align="center" prop="jobTitle" />
      <el-table-column label="资质" align="center" prop="photoPath">
        <template #default="scope">
          <el-button type="text" @click="viewFile(scope.row.qaAttachment)">预览</el-button>
        </template>
      </el-table-column>
      <el-table-column label="资质有效期" align="center" prop="expiredTime"/>
      <el-table-column label="描述" align="center" prop="description" />
      <el-table-column label="证件照片" align="center" prop="photoPath">
        <template #default="scope">
          <el-button type="text" @click="viewFile(scope.row.photoAttachment)">预览</el-button>
        </template>
      </el-table-column>
      <el-table-column label="状态" align="center" prop="status">
        <template #default="scope">
          <el-tag :type="scope.row.status === '0'? 'success' : 'danger' ">{{ scope.row.status == '0'?'正常':'停用' }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="工种详情" align="center">
        <template #default="scope">
          <el-button size="mini" type="text" @click="openWorkType(scope.row)" v-if="scope.row.operateTypes && scope.row.operateTypes.length>0">查看</el-button>
          <span v-else>无</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="300">
        <template #default="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="openDialog(scope.row,'edit')">编辑</el-button>
          <el-button size="mini" type="text" icon="el-icon-view" @click="openDialog(scope.row,'view')">查看</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['system:experts:remove']">删除</el-button>
          <el-switch size="mini" v-model="scope.row.status" style="margin-left: 12px" active-value="0" inactive-value="1" @change="handleAbort($event,scope.row)"></el-switch>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageIndex"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
      @pagination="getPage"
    />
    <reviewerDialog ref="teacherDialog" @closeDialog="resetQuery"></reviewerDialog>
    <el-dialog title="工种详情" :visible.sync="typeVisible" width="50%" append-to-body>
      <el-table :data="workType" border>
        <el-table-column label="资格类型" align="center" prop="qualificationType"/>
        <el-table-column label="作业类别" align="center" prop="jobCategory"/>
        <el-table-column label="操作项目" align="center" prop="operationItems"/>
      </el-table>
    </el-dialog>
  </div>
</template>

<script>
import reviewerDialog from "@/views/notCoalMine/nTeacherManage/nReviewer/components/reviewerDialog";
import {delExaminer, getExaminerPage, abortExaminer} from "@/api/coalMine/teacher";
import axios from "axios";
import {getToken} from "@/utils/auth";
import {delPeople} from "@/api/coalMine/people";

export default {
  name: "cTeacherManage",
  dicts: [],
  components: {},
  name: "nReviewerManage",
  dicts: ['sys_highest_education_code'],
  components: { reviewerDialog },
  data() {
    return {
      loading: false,
      single: true,
      multiple: true,
      showSearch: true,
      addForm: false,
      typeVisible: false,
      workType: [],
      dataList: [],
      total: 0,
      expertTypes: [],
      expertList: [],
      queryParams: {},
      classiFy: [],
      form: {},
      rules: {
        classifyName: [
          { required: true, message: "分类名称不能为空", trigger: "blur" }
        ]
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        isCm: '0'
      }
    };
  },
  created() {

    const t = this
    t.getPage()
  },
  methods: {
    getList(){
    async getPage(){
      this.loading = true
      const res = await getExaminerPage(this.queryParams)
      if(res.code == 200){
        this.dataList = res.rows
        this.total = res.total
      }else{
        this.$message({
          message: res.msg,
          type: 'warning'
        })
      }
      this.loading = false
    },

    openDialog(data,type){
      this.$refs.teacherDialog.openDialog(data,type)
    },
    openWorkType(row){
      this.workType = row.operateTypes
      this.typeVisible = true
    },
    handleChange(){

@@ -122,11 +161,72 @@

    },
    resetQuery(){

      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        isCm: '0'
      }
      this.getPage()
    },
    handleAdd(){
    viewFile(file){
      axios.get(process.env.VUE_APP_BASE_API + file.fileUrl,{headers:{'Content-Type': 'application/json','Authorization': "Bearer " + getToken()},responseType: 'blob'}).then(res=>{
        if (res) {
          const link = document.createElement('a')
          let blob = new Blob([res.data],{type: res.data.type})
          link.style.display = "none";
          link.href = URL.createObjectURL(blob); // 创建URL
          window.open(link.href)
        } else {
          this.$message.error('获取文件失败')
        }
      })
    },
    getDegreeName(code){
      let obj = JSON.parse(JSON.stringify(this.dict.type.sys_highest_education_code)).find(i=>i.value == code)
      if(obj){
        return obj.label
      }else{
        return '未知'
      }
    },
    async handleAbort(value,row){
        const res = await abortExaminer({id: row.id,status: value})
        if(res.code == 200){
          this.$message({
            type: 'success',
            message: '状态变更成功!'
          });
          this.getPage()
        }else {
          this.$message({
            type: 'warning',
            message: res.msg
          });
        }
    },
    handleDelete(row){
      this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await delExaminer(row.id)
        if(res.code == 200){
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          await this.getPage()
        }else{
          this.$message({
            type: 'warning',
            message: res.msg
          });
        }
      }).catch(() => {

    }
      });
    },
  }
};
</script>

 src/views/notCoalMine/nTeacherManage/nTeacher/components/teacherDialog.vue

@@ -5,14 +5,14 @@
        <el-row>
          <el-col :span="20">
            <el-form-item label="姓名" prop="name">
              <el-input v-model="form.name"></el-input>
              <el-input v-model="form.name" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="性别" prop="sex">
              <el-radio-group v-model="form.sex">
              <el-radio-group v-model="form.sex" :disabled="disable">
                <el-radio :label="0">男</el-radio>
                <el-radio :label="1">女</el-radio>
              </el-radio-group>
@@ -21,40 +21,48 @@
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="身份证号" prop="idCard">
              <el-input v-model="form.idCard"></el-input>
            <el-form-item label="身份证号" prop="code">
              <el-input v-model="form.code" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="联系电话" prop="phone">
              <el-input v-model="form.phone"></el-input>
            <el-form-item label="联系电话" prop="mobilePhone">
              <el-input v-model="form.mobilePhone" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="职称" prop="title">
              <el-input v-model="form.title"></el-input>
            <el-form-item label="职称" prop="jobTitle">
              <el-input v-model="form.jobTitle" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="最高学历" prop="degree">
              <el-input v-model="form.degree"></el-input>
            <el-form-item label="最高学历" prop="eduLevel">
              <el-select v-model="form.eduLevel" placeholder="请选择" style="width: 100%" :disabled="disable">
                <el-option
                  v-for="dict in dict.type.sys_highest_education_code"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="资质到期" prop="birthday">
            <el-form-item label="资质到期" prop="expiredTime">
              <el-date-picker
                style="width: 100%"
                v-model="form.birthday"
                v-model="form.expiredTime"
                value-format="yyyy-MM-dd"
                type="date"
                :disabled="disable"
                placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
@@ -62,10 +70,10 @@
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="在职情况" prop="dutyStatus">
              <el-radio-group v-model="form.dutyStatus">
                <el-radio :label="0">在岗</el-radio>
                <el-radio :label="1">退休</el-radio>
            <el-form-item label="在职情况" prop="status">
              <el-radio-group v-model="form.status" :disabled="disable">
                <el-radio label="0">正常</el-radio>
                <el-radio label="1">停用</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
@@ -73,17 +81,18 @@
        <el-row>
          <el-col :span="20">
            <el-form-item label="描述">
              <el-input v-model="form.remark" type="textarea" :autosize="{ minRows: 2}"></el-input>
              <el-input v-model="form.description" type="textarea" :autosize="{ minRows: 2}" :readonly="disable"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="证件照">
            <el-form-item label="证件照" prop="photoAttachment">
              <el-upload
                :disabled="disable"
                action="#"
                multiple
                :limit="20"
                :limit="1"
                :on-exceed="overLimit"
                :auto-upload="false"
                accept="image/*,.pdf"
@@ -92,7 +101,7 @@
                :before-upload="beforeAvatarUpload"
                :on-change="resumeChange"
                :on-preview="handlePreview"
                :on-remove="handleRemove">
                :on-remove="(file,fileList)=>handleRemove(file,fileList,'证件照')">
                <i class="el-icon-plus"></i>
              </el-upload>
            </el-form-item>
@@ -100,11 +109,12 @@
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="资质">
            <el-form-item label="资质" prop="qaAttachment">
              <el-upload
                :disabled="disable"
                action=""
                multiple
                :limit="20"
                :limit="1"
                :on-exceed="overLimit"
                :auto-upload="false"
                accept="image/*,.pdf"
@@ -113,32 +123,85 @@
                :before-upload="beforeAvatarUpload"
                :on-change="inventChange"
                :on-preview="handlePreview"
                :on-remove="handleRemove">
                :on-remove="(file,fileList)=>handleRemove(file,fileList,'资质')">
                <i class="el-icon-plus"></i>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="工种详情" prop="operateTypes">
                <el-table :data="form.operateTypes" border>
                  <el-table-column label="序号" type="index" align="center"/>
                  <el-table-column label="资格类型" align="center" prop="qualificationType" />
                  <el-table-column label="作业类别" align="center" prop="jobCategory" />
                  <el-table-column label="操作项目" align="center" prop="operationItems"/>
                  <el-table-column label="操作" align="center" class-name="small-padding fixed-width" v-if="disable == false">
                    <template #default="scope">
<!--                      <el-button size="mini" type="text" icon="el-icon-edit" @click="openEdit(scope.row,'edit')">编辑</el-button>-->
                      <el-button size="mini" type="text" icon="el-icon-delete" @click="deleteItem(scope.index)" v-hasPermi="['system:experts:remove']">删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>
                <el-button v-if="disable == false" @click="openEdit({},'add')" style="margin-top: 15px">新增</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div style="width: 100%;padding-bottom: 30px;display: flex;justify-content: center">
      <div style="width: 100%;padding-bottom: 30px;display: flex;justify-content: center" v-if="disable == false">
        <el-button type="primary" @click="submit()">提交</el-button>
      </div>
      <el-dialog :visible.sync="dialogVisible">
      <el-dialog :visible.sync="dialogVisible" append-to-body>
        <img width="100%" :src="dialogImageUrl" alt="">
      </el-dialog>
      <el-dialog :title="dialogTitle" :visible.sync="addVisible" width="50%" append-to-body>
        <el-form :model="addForm" :rules="addRules" ref="addRuleForm" label-width="200px">
          <el-row>
            <el-col :span="20">
              <el-form-item label="资格类型" prop="operate">
                <el-cascader
                  v-model="addForm.operate"
                  :options="typeList"
                  style="width: 100%"
                  :props="{ expandTrigger: 'hover', value: 'id',label: 'name'}"></el-cascader>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div style="width: 100%;padding-bottom: 30px;display: flex;justify-content: center">
          <el-button type="primary" @click="submitAdd()">提交</el-button>
        </div>
      </el-dialog>
    </div>
  </el-dialog>
</template>

<script>
// import {getExpertTypes,addExpertInfo,uploadFile} from '@/api/system/form'
import { verifySimplePhone, verifyIdCard } from "@/utils/validate";
import {getOperatePage} from "@/api/coalMine/operateType";
import {addTeacher, editTeacher, uploadFile} from "@/api/coalMine/teacher";
export default {
  name: "teacherDialog",
  dicts: ['sys_highest_education_code'],
  data() {
    var validatePass = (rule, value, callback) => {
      if (this.fileList.length == 0) {
    // let validateTypes = (rule, value, callback) => {
    //   if (this.form.operateTypes.length == 0) {
    //     callback(new Error('请添加工种详情'));
    //   } else {
    //     callback();
    //   }
    // }
    let validateResume = (rule, value, callback) => {
      if (this.resumeList.length == 0) {
        callback(new Error('请上传证件照'));
      } else {
        callback();
      }
    }
    let validateCert = (rule, value, callback) => {
      if (this.inventionList.length == 0) {
        callback(new Error('请上传资质证书'));
      } else {
        callback();
      }
@@ -168,94 +231,91 @@
    return {
      title: '新增教师',
      open: false,
      disable: false,
      labelPosition: 'right',
      form:{
        id: null,
        isCm: '0',
        name:'',
        sex:'',
        profession: [],
        bigClassify:null,
        smallClassify: null,
        birthday: '',
        phone:'',
        title: '',
        idCard: '',
        dutyStatus: null,
        companyName: '',
        companyAddress: '',
        deptName: '',
        job: '',
        companyTelephone: '',
        faxNum: '',
        email: '',
        graduationSchool: '',
        degree: '',
        speciality: '',
        currentProfession: '',
        supportDirectionSafety: [],
        supportDirectionPrevention: [],
        supportDirectionEmergency: [],
        resumeKey: '',
        paperSituationKey: '',
        remark: '',
        code: '',
        mobilePhone: '',
        jobTitle: '',
        eduLevel: '',
        expiredTime: '',
        status: '',
        operateTypes: [],
        photoAttachment: null,
        qaAttachment: null,
        description: '',
      },
      expertsType: [],
      directionList: [
        {
          value: 1,
          label: '现场检查'
        },
        {
          value: 2,
          label: '调查评估'
        },
        {
          value: 3,
          label: '咨询服务'
        },
        {
          value: 4,
          label: '教育培训'
        },
        {
          value: 5,
          label: '其他'
        }
      ],
      resumeList: [],
      inventionList: [],
      dialogImageUrl: '',
      dialogVisible: false,
      rules:{
        name:[{ required: true, message: '请填写姓名', trigger: 'blur' }],
        sex:[{ required: true, message: '请选择性别', trigger: 'blur' }],
        profession: [{ required: true, message: '请选择专业类别', trigger: 'blur' }],
        birthday: [{ required: true, message: '请选择出生日期', trigger: 'blur' }],
        phone:[{ required: true, validator: validatePhone, trigger: 'blur' }],
        title: [{ required: true, message: '请填写职称', trigger: 'blur' }],
        electronicPhoto: [{ required: true,validator: validatePass, trigger: 'blur' }],
        idCard: [{ required: true, validator: verifyId, trigger: 'blur' }],
        dutyStatus: [{ required: true, message: '请选择在岗情况', trigger: 'blur' }],
        companyName: [{ required: true, message: '请填写单位全称', trigger: 'blur' }],
        degree: [{ required: true, message: '请填写最高学历', trigger: 'blur' }]
      dialogTitle: '新增',
      addVisible: false,
      addForm: {
        operate: [],
        qualificationType: '',
        jobCategory: '',
        operationItems: '',
        operateTypeId: null
      },
      typeList: [],
      rules:{
        name:[{ required: true, message: '请填写姓名', trigger: 'blur'}],
        sex:[{ required: true, message: '请选择性别', trigger: 'blur'}],
        code:[{ required: true, validator: verifyId, trigger: 'blur' }],
        mobilePhone:[{ required: true, validator: validatePhone, trigger: 'blur' }],
        // code:[{ required: true, message: '请填写身份证号', trigger: 'blur'}],
        // mobilePhone:[{ required: true, message: '请填写联系方式', trigger: 'blur'}],
        jobTitle: [{ required: true, message: '请填写职称', trigger: 'blur'}],
        eduLevel: [{ required: true, message: '请选择最高学历', trigger: 'blur'}],
        expiredTime: [{ required: true, message: '请选择到期时间', trigger: 'blur'}],
        status: [{ required: true, message: '请选择在岗情况', trigger: 'blur'}],
        // operateTypes: [{ required: true,validator: validateTypes, trigger: 'blur' }],
        photoAttachment: [{ required: true,validator: validateResume, trigger: 'blur'}],
        qaAttachment: [{ required: true,validator: validateCert, trigger: 'blur'}]
      },
      addRules:{
        operate:[{ required: true, message: '请选择', trigger: 'blur' }]
      }
    };
  },
  created() {
    const t = this
    const width = document.documentElement.clientWidth
    if(width < 750){t.labelPosition = 'top'}
  },
  methods: {
    openDialog(val,type){
      const width = document.documentElement.clientWidth
      if(width < 750){this.labelPosition = 'top'}
      this.resumeList = []
      this.inventionList = []
      if(type == 'add'){
        this.title = '新增教师'
        this.disable = false
        this.form = {
          id: null,
          isCm: '0',
          name:'',
          sex:'',
          code: '',
          mobilePhone: '',
          jobTitle: '',
          eduLevel: '',
          expiredTime: '',
          status: '',
          operateTypes: [],
          photoAttachment: null,
          qaAttachment: null,
          description: '',
        }
      }else{
        if(type == 'edit'){
          this.title = '编辑教师'
          this.disable = false
        }else{
          this.title = '查看教师'
          this.disable = true
        }
        if(val){
          for(let i in val){
@@ -264,29 +324,150 @@
            }
          }
        }
        this.form.sex = Number(this.form.sex)
        // 仅限单张图片处理
        this.form.photoAttachment = val.photoAttachment.id
        this.form.qaAttachment = val.qaAttachment.id
        this.resumeList.push({
          name: val.photoAttachment.fileName,
          url: process.env.VUE_APP_BASE_API + val.photoAttachment.fileUrl
        })
        this.inventionList.push({
          name: val.qaAttachment.fileName,
          url: process.env.VUE_APP_BASE_API + val.qaAttachment.fileUrl
        })
        if(!this.form.operateTypes){
          this.form.operateTypes = []
        }
        console.log(this.form,'form')
      }
      this.open = true
    },

    isValidKey(key,obj){
      return key in obj
    },

    openEdit(data,type){
      this.getList()
      if(type == 'add'){
        this.dialogTitle = '新增'
        this.addVisible = true
        this.addForm = {
          operate: [],
          qualificationType: '',
          jobCategory: '',
          operationItems: '',
          operateTypeId: null
        }
      }else{

    async getExpertsType(){
      const res = await getExpertTypes()
      }
    },
    async submitUpload() {
      const { resumeList, inventionList, form } = this;
      const uploadAndCollect = async (fileList, type) => {
        if (fileList.length > 0 && fileList.find((file)=>file.raw)) {
          for (const file of fileList) {
            const formData = new FormData();
            formData.append("file", file.raw);
            formData.append("module", 'accountPath');
            try {
              const res = await uploadFile(formData);
              if (res.code === 200) {
                if (type === '证件照') {
                  form.photoAttachment = res.data.id;
                }
                if (type === '资质') {
                  form.qaAttachment = res.data.id;
                }
              } else {
                this.$message.error('图片上传出错!');
              }
            } catch (error) {
              this.$message.error('图片上传出错!');
            }
          }
        }else{
          return
        }
      };
      const uploadPromises = [
        uploadAndCollect(resumeList, '证件照'),
        uploadAndCollect(inventionList, '资质')
      ];
      try {
        await Promise.all(uploadPromises);
        console.log(form, 'form1');
      } catch (error) {
        console.error('上传出错:', error);
      }
    },

    async submit(){
      this.$refs["ruleForm"].validate(async(valid) =>{
        if(valid) {
          await this.submitUpload()
          if(this.title == '新增教师'){
            const {id,...data} = this.form
            const res= await addTeacher(data)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.resumeList = []
              this.inventionList = []
              this.open = false
              this.$emit('closeDialog')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }else{
            const res= await editTeacher(this.form)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.fileList = []
              this.open = false
              this.$emit('closeDialog')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }
        }else{
          this.$message({
            type:'warning',
            message:'请完善必填信息'
          })
        }
      })
    },
    deleteItem(index){
      this.form.operateTypes.splice(index,1);
    },
    async getList() {
      this.loading = true;
      const res = await getOperatePage({name: ''})
      if(res.code == 200){
        this.expertsType = res.data
        this.typeList = this.handleTree(res.data, "id");
      }else{
        this.$message({
          type: 'warning',
          message: res.msg
        });
      }
      this.loading = false;
    },

    avatorChange(file, fileList) {
      this.fileList = fileList;
    },
    resumeChange(file, fileList) {
      this.resumeList = fileList;
    },
@@ -310,71 +491,31 @@
      }
      return isLt5M;
    },
    async submitUpload() {
      const t = this;
      // 创建一个数组来存储所有上传操作的 Promise
      const uploadPromises = [];
      // 定义一个函数来上传文件并将结果存入 resumeLink 数组
      async function uploadAndCollect(fileList, type) {
        if (fileList.length > 0) {
          const resumeLink = [];
          for (const file of fileList) {
            const formData = new FormData();
            formData.append("file", file.raw);
            formData.append("module", 'expertPath');

            const res = await uploadFile(formData);
            if (res.code === 200) {
              resumeLink.push(res.data[0].fileKey);
            } else {
              this.$message.error('图片上传出错!');
            }
          }
          // 将收集到的文件链接设置到 this.form 中
          if (type == '工作简历') { t.form.resumeKey = resumeLink.join(',')}
          if (type == '发明著作') { t.form.paperSituationKey = resumeLink.join(',')}
          return resumeLink;
        }
        return [];
    handleRemove(file,fileList,type) {
      if(type == '证件照'){
        this.resumeList = fileList
      }else{
        this.inventionList = fileList
      }
      // 依次执行上传操作并等待完成
      uploadPromises.push(uploadAndCollect(t.resumeList, '工作简历'));
      uploadPromises.push(uploadAndCollect(t.inventionList,'发明著作'));
      // 等待所有上传操作完成
      await Promise.all(uploadPromises);
      // 打印已更新的 this.form
      console.log(t.form, 'form1');
    },
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    async submit(){
      this.$refs["ruleForm"].validate(async(valid) =>{
    async submitAdd(){
      this.$refs["addRuleForm"].validate(async(valid) =>{
        if(valid) {
          await this.submitUpload()
          let data = this.form
          data.supportDirectionSafety = data.supportDirectionSafety.join(',')
          data.supportDirectionPrevention = data.supportDirectionPrevention.join(',')
          data.supportDirectionEmergency = data.supportDirectionEmergency.join(',')
          data.bigClassify = data.profession[0]
          data.smallClassify = data.profession[1]
          delete data.profession
          const res= await addExpertInfo(data)
          if(res.code == 200){
            this.$message({
              type:'success',
              message: res.msg
            })
            this.$emit('closeDialog')
            this.$refs.ruleForm.resetFields()
            this.resumeList = []
            this.inventionList = []
          }else{
            this.$message({
              type:'warning',
              message: res.msg
            })
          if(this.addForm.operate.length == 2){
            this.addForm.qualificationType = this.findNameById(this.typeList,this.addForm.operate[0])
            this.addForm.jobCategory = this.findNameById(this.typeList,this.addForm.operate[1])
            this.addForm.operateTypeId = this.addForm.operate[1]
          }
          if(this.addForm.operate.length == 3){
            this.addForm.qualificationType = this.findNameById(this.typeList,this.addForm.operate[0])
            this.addForm.jobCategory = this.findNameById(this.typeList,this.addForm.operate[1])
            this.addForm.operationItems = this.findNameById(this.typeList,this.addForm.operate[2])
            this.addForm.operateTypeId = this.addForm.operate[2]
          }
          const {operate,...obj} = this.addForm
          this.form.operateTypes.push(obj)
          this.addVisible = false
        }else{
          this.$message({
            type:'warning',
@@ -383,8 +524,19 @@
        }
      })
    },
    changeSource(num){
      this.form.source = num
    findNameById(data,id){
      for(const node of data){
        if(node.id == id){
          return node.name
        }
        if(node.children){
          const foundName = this.findNameById(node.children,id)
          if(foundName){
            return foundName
          }
        }
      }
      return null
    }
  }
};

 src/views/notCoalMine/nTeacherManage/nTeacher/index.vue

@@ -1,27 +1,27 @@
<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="用户姓名" prop="userName">
        <el-input
          v-model="queryParams.userName"
          placeholder="请输入用户姓名"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="身份证号" prop="idCard">
        <el-input
          v-model="queryParams.idCard"
          placeholder="请输入身份证号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
<!--    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">-->
<!--      <el-form-item label="用户姓名" prop="userName">-->
<!--        <el-input-->
<!--          v-model="queryParams.userName"-->
<!--          placeholder="请输入用户姓名"-->
<!--          clearable-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="身份证号" prop="idCard">-->
<!--        <el-input-->
<!--          v-model="queryParams.idCard"-->
<!--          placeholder="请输入身份证号"-->
<!--          clearable-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item>-->
<!--        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>-->
<!--        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
<!--      </el-form-item>-->
<!--    </el-form>-->

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
@@ -30,46 +30,56 @@
          plain
          icon="el-icon-plus"
          size="mini"
          @click="openTeacher({},'add')"
          @click="openDialog({},'add')"
          v-hasPermi="['system:experts:add']"
        >新增</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getPage"></right-toolbar>
    </el-row>
    <el-table v-loading="loading" :data="expertList">
    <el-table v-loading="loading" :data="dataList">
      <el-table-column type="index" label="序号" width="55" align="center" />
      <el-table-column label="姓名" align="center" prop="name" />
      <el-table-column label="性别" align="center" prop="name" />
      <el-table-column label="身份证号" align="center" prop="name" />
      <el-table-column label="最高学历" align="center" prop="degree" />
      <el-table-column label="职称" align="center" prop="job" />
      <el-table-column label="资质" align="center" prop="speciality" />
      <el-table-column label="资质有效期" align="center"/>
      <el-table-column label="描述" align="center"/>
      <el-table-column label="证件照" align="center"/>
      <el-table-column label="状态" align="center"/>
      <el-table-column label="工种详情" align="center"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
      <el-table-column label="性别" align="center" prop="sex">
        <template #default="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="openTeacher({},'add')"
          >编辑</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['system:experts:remove']"
          >删除</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="openWorkType(scope.row)"
          >工种详情</el-button>
          {{ scope.row.sex == 0?'男':'女' }}
        </template>
      </el-table-column>
      <el-table-column label="身份证号" align="center" prop="code" />
      <el-table-column label="最高学历" align="center" prop="eduLevel">
        <template #default="scope">
          {{getDegreeName(scope.row.eduLevel)}}
        </template>
      </el-table-column>
      <el-table-column label="职称" align="center" prop="jobTitle" />
      <el-table-column label="资质" align="center" prop="photoPath">
        <template #default="scope">
          <el-button type="text" @click="viewFile(scope.row.qaAttachment)">预览</el-button>
        </template>
      </el-table-column>
      <el-table-column label="资质有效期" align="center" prop="expiredTime"/>
      <el-table-column label="描述" align="center" prop="description" />
      <el-table-column label="证件照片" align="center" prop="photoPath">
        <template #default="scope">
          <el-button type="text" @click="viewFile(scope.row.photoAttachment)">预览</el-button>
        </template>
      </el-table-column>
      <el-table-column label="状态" align="center" prop="status">
        <template #default="scope">
          <el-tag :type="scope.row.status === '0'? 'success' : 'danger' ">{{ scope.row.status == '0'?'正常':'停用' }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="工种详情" align="center">
        <template #default="scope">
          <el-button size="mini" type="text" @click="openWorkType(scope.row)" v-if="scope.row.operateTypes && scope.row.operateTypes.length>0">查看</el-button>
          <span v-else>无</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="300">
        <template #default="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="openDialog(scope.row,'edit')">编辑</el-button>
          <el-button size="mini" type="text" icon="el-icon-view" @click="openDialog(scope.row,'view')">查看</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['system:experts:remove']">删除</el-button>
          <el-switch size="mini" v-model="scope.row.status" style="margin-left: 12px" active-value="0" inactive-value="1" @change="handleAbort($event,scope.row)"></el-switch>
        </template>
      </el-table-column>
    </el-table>
@@ -78,47 +88,71 @@
      :total="total"
      :page.sync="queryParams.pageIndex"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
      @pagination="getPage"
    />
    <teacherDialog ref="teacherDialog"></teacherDialog>
    <teacherDialog ref="teacherDialog" @closeDialog="resetQuery"></teacherDialog>
    <el-dialog title="工种详情" :visible.sync="typeVisible" width="50%" append-to-body>
      <el-table :data="workType" border>
        <el-table-column label="资格类型" align="center" prop="qualificationType"/>
        <el-table-column label="作业类别" align="center" prop="jobCategory"/>
        <el-table-column label="操作项目" align="center" prop="operationItems"/>
      </el-table>
    </el-dialog>
  </div>
</template>

<script>
import teacherDialog from "@/views/notCoalMine/nTeacherManage/nTeacher/components/teacherDialog";
import {delTeacher, getTeacherPage, abortTeacher} from "@/api/coalMine/teacher";
import axios from "axios";
import {getToken} from "@/utils/auth";
import {delPeople} from "@/api/coalMine/people";

export default {
  name: "cTeacherManage",
  dicts: [],
  components: {teacherDialog},
  name: "nTeacherManage",
  dicts: ['sys_highest_education_code'],
  components: { teacherDialog },
  data() {
    return {
      loading: false,
      single: true,
      multiple: true,
      showSearch: true,
      addForm: false,
      typeVisible: false,
      workType: [],
      dataList: [],
      total: 0,
      expertTypes: [],
      expertList: [],
      queryParams: {},
      classiFy: [],
      form: {},
      rules: {
        classifyName: [
          { required: true, message: "分类名称不能为空", trigger: "blur" }
        ]
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        isCm: '0'
      }
    };
  },
  created() {

    const t = this
    t.getPage()
  },
  methods: {
    openTeacher(data,type){
    async getPage(){
      this.loading = true
      const res = await getTeacherPage(this.queryParams)
      if(res.code == 200){
        this.dataList = res.rows
        this.total = res.total
      }else{
        this.$message({
          message: res.msg,
          type: 'warning'
        })
      }
      this.loading = false
    },

    openDialog(data,type){
      this.$refs.teacherDialog.openDialog(data,type)
    },
    getList(){

    openWorkType(row){
      this.workType = row.operateTypes
      this.typeVisible = true
    },
    handleChange(){

@@ -127,11 +161,72 @@

    },
    resetQuery(){

      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        isCm: '0'
      }
      this.getPage()
    },
    handleAdd(){
    viewFile(file){
      axios.get(process.env.VUE_APP_BASE_API + file.fileUrl,{headers:{'Content-Type': 'application/json','Authorization': "Bearer " + getToken()},responseType: 'blob'}).then(res=>{
        if (res) {
          const link = document.createElement('a')
          let blob = new Blob([res.data],{type: res.data.type})
          link.style.display = "none";
          link.href = URL.createObjectURL(blob); // 创建URL
          window.open(link.href)
        } else {
          this.$message.error('获取文件失败')
        }
      })
    },
    getDegreeName(code){
      let obj = JSON.parse(JSON.stringify(this.dict.type.sys_highest_education_code)).find(i=>i.value == code)
      if(obj){
        return obj.label
      }else{
        return '未知'
      }
    },
    async handleAbort(value,row){
        const res = await abortTeacher({id: row.id,status: value})
        if(res.code == 200){
          this.$message({
            type: 'success',
            message: '状态变更成功!'
          });
          this.getPage()
        }else {
          this.$message({
            type: 'warning',
            message: res.msg
          });
        }
    },
    handleDelete(row){
      this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await delTeacher(row.id)
        if(res.code == 200){
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          await this.getPage()
        }else{
          this.$message({
            type: 'warning',
            message: res.msg
          });
        }
      }).catch(() => {

    }
      });
    },
  }
};
</script>

 src/views/notCoalMine/nViolationRegistration/components/addDialog.vue

File was deleted

 src/views/notCoalMine/nViolationRegistration/components/violationDialog.vue

New file
@@ -0,0 +1,312 @@
<template>
  <el-dialog
    :title="title"
    :visible.sync="open"
    append-to-body
    width="50%"
    :before-close="handleClose"
  >
    <el-form ref="ruleForm" :model="form"  :rules="rules" label-position="right" label-width="150px" style="padding-right: 50px" element-loading-text="保存中...">
      <el-form-item label="姓名:" prop="name">
        <el-input v-model.trim="form.name" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="身份证号:" prop="idCard">
        <el-input v-model.trim="form.idCard" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="IC卡编号:" prop="icNum">
        <el-input v-model.trim="form.icNum" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="电子证号:" prop="electNum">
        <el-input v-model.trim="form.electNum" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="所属单位:" prop="dept">
        <el-input v-model.trim="form.dept" :readonly="disable"/>
      </el-form-item>
      <el-form-item label="违章日期:" prop="violationTime">
        <el-date-picker
          v-model="form.violationTime"
          type="date"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd 00:00:00"
          placeholder="选择日期"
          :disabled="disable">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="操作类型:" prop="operateTypeId">
        <el-cascader
          v-model="form.operateTypeId"
          :options="typeList"
          :disabled="disable"
          :show-all-levels="false"
          :props="{ expandTrigger: 'hover', value: 'id',label: 'name',emitPath:false}"></el-cascader>
      </el-form-item>
      <el-form-item label="图片上传:" prop="violationPath">
        <el-upload
          action=""
          :disabled="disable"
          :auto-upload="false"
          :limit="10"
          multiple
          accept="image/*,.pdf"
          :file-list="fileList"
          list-type="picture-card"
          :before-upload="beforeAvatarUpload"
          :on-change="avatorChange"
          :on-preview="handlePreview"
          :on-exceed="overLimit"
          :on-remove="handleRemove">
          <i class="el-icon-plus"></i>
        </el-upload>
      </el-form-item>
      <el-form-item label="违章描述:" prop="remark">
        <el-input type="textarea" v-model.trim="form.remark" :readonly="disable"/>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="handleClose">取消</el-button>
      <el-button v-if="disable == false" type="primary" @click="submit">提交</el-button>
      <el-button v-else type="primary" @click="handleClose">确定</el-button>
    </span>
    <el-dialog :visible.sync="dialogVisible" append-to-body>
      <img width="100%" :src="dialogImageUrl" alt="">
    </el-dialog>
  </el-dialog>
</template>

<script >
import {addViolation, editViolation, uploadFile} from "@/api/coalMine/violation";
import {verifyIdCard} from "@/utils/validate";

export default {
  name: 'violationDialog',
  components: {
  },
  props: ['typeList'],
  data() {
    let validatePass = (rule, value, callback) => {
      if (this.fileList.length == 0) {
        callback(new Error('请上传图片'));
      } else {
        callback();
      }
    }
    let verifyId = (rule, value, callback)=>{
      if(value === ''){
        callback(new Error('请输入身份证号'))
      }else{
        if(!verifyIdCard(value)){
          callback(new Error('身份证号格式有误'))
        }else{
          callback()
        }
      }
    }
    return {
      disable: false,
      title: '新增填报',
      open: false,
      form:{
        id: null,
        isCm: 0,
        name: '',
        idCard: '',
        icNum: '',
        electNum: '',
        dept: '',
        violationTime: '',
        operateTypeId: null,
        violationPath: '',
        remark: ''
      },
      fileList: [],
      dialogImageUrl: '',
      dialogVisible: false,
      rules:{
        name:[{ required: true, message: '请填写姓名', trigger: 'blur' }],
        // idCard: [{ required: true, validator: verifyId, trigger: 'blur' }],
        idCard: [{ required: true, message: '请填写身份证号', trigger: 'blur' }],
        dept: [{ required: true, message: '请填写所在单位', trigger: 'blur' }],
        violationTime: [{ required: true, message: '请选择违章日期', trigger: 'blur' }],
        violationPath: [{ required: true,validator: validatePass, trigger: 'blur' }],
        operateTypeId: [{ required: true, message: '请选择操作类型', trigger: 'blur' }]
      },
    }
  },
  created() {

  },
  methods: {
    openDialog (val,type) {
      const t = this
      t.fileList = []
      t.open = true
      if(type == 'add'){
        t.title = '新增填报'
        t.disable = false
        t.form = {
          id: null,
          isCm: 0,
          name: '',
          idCard: '',
          icNum: '',
          electNum: '',
          dept: '',
          violationTime: '',
          operateTypeId: null,
          violationPath: '',
          remark: ''
        }
      }else{
        t.title = '查看'
        t.disable = true
        if(val){
          for(let i in val){
            if(t.isValidKey(i,this.form)){
              t.form[i] = val[i]
            }
          }
          const picList = val.violationPath.split(',')
          t.fileList = picList.map((item,index)=>{
            return {
              name: index,
              url: process.env.VUE_APP_BASE_API + item
            }
          })
        }
      }
    },
    isValidKey(key,obj){
      return key in obj
    },

    avatorChange(file, fileList) {
      this.fileList = fileList;
      console.log(fileList,'list2')
    },

    overLimit(){
      this.$message({
        type: 'warning',
        message: '超出文件上传数量'
      });
    },
    handlePreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    beforeAvatarUpload(file) {
      const isLt5M = file.size / 1024 / 1024 < 5;
      if (!isLt5M) {
        this.$message.error('上传头像图片大小不能超过 5MB!');
      }
      return isLt5M;
    },
    async submitUpload() {
      const t = this;
      // 创建一个数组来存储所有上传操作的 Promise
      const uploadPromises = [];
      // 定义一个函数来上传文件并将结果存入 resumeLink 数组
      async function uploadAndCollect(fileList) {
        if (fileList.length > 0) {
          const resumeLink = [];
          for (const file of fileList) {
            const formData = new FormData();
            formData.append("file", file.raw);
            formData.append("module", 'accountPath');

            const res = await uploadFile(formData);
            if (res.code === 200) {
              resumeLink.push(res.data.fileKey);
            } else {
              this.$message.error('图片上传出错!');
            }
          }
          // 将收集到的文件链接设置到 this.form 中
          t.form.violationPath = resumeLink.join(',')
          return resumeLink;
        }
        return [];
      }
      // 依次执行上传操作并等待完成
      uploadPromises.push(uploadAndCollect(t.fileList));
      // 等待所有上传操作完成
      await Promise.all(uploadPromises);
      // 打印已更新的 this.form
      console.log(t.form, 'form1');
    },
    handleRemove(file, fileList) {
      console.log(file, fileList);
      this.fileList = fileList
    },
    handleClose() {
      this.open = false;
      this.resetForm();
    },
    async submit(){
      this.$refs["ruleForm"].validate(async(valid) =>{
        if(valid) {
          await this.submitUpload()
          if(this.title == '新增填报'){
            const {id,...data} = this.form
            const res= await addViolation(data)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.fileList = []
              this.open = false
              this.$emit('getList')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }else{
            const res= await editViolation(this.form)
            if(res.code == 200){
              this.$message({
                type:'success',
                message: res.msg
              })
              this.fileList = []
              this.open = false
              this.$emit('getList')
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }
        }else{
          this.$message({
            type:'warning',
            message:'请完善必填信息'
          })
        }
      })
    },
    resetForm() {
      this.form = {
        id: null,
        isCm: 0,
        name: '',
        idCard: '',
        icNum: '',
        electNum: '',
        dept: '',
        violationTime: '',
        operateTypeId: null,
        violationPath: '',
        remark: ''
      }
    },
  }
}

</script>
<style scoped>

</style>

 src/views/notCoalMine/nViolationRegistration/index.vue

@@ -3,7 +3,7 @@
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="用户姓名" prop="userName">
        <el-input
          v-model="queryParams.userName"
          v-model="queryParams.name"
          placeholder="请输入用户姓名"
          clearable
          @keyup.enter.native="handleQuery"
@@ -17,19 +17,20 @@
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="单位名称" prop="idCard">
      <el-form-item label="单位名称" prop="dept">
        <el-input
          v-model="queryParams.unit"
          v-model="queryParams.dept"
          placeholder="请输入单位名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="作业类型">
      <el-form-item label="操作类型">
        <el-cascader
          v-model="classiFy"
          :options="expertTypes"
          :props="{ expandTrigger: 'hover', value: 'id',label: 'label'}"
          v-model="queryParams.operateTypeId"
          :options="typeList"
          :show-all-levels="false"
          :props="{ expandTrigger: 'hover', value: 'id',label: 'name',emitPath:false}"
          @change="handleChange"></el-cascader>
      </el-form-item>
      <el-form-item>
@@ -44,27 +45,35 @@
          type="primary"
          plain
          size="mini"
          @click="handleAdd"
          @click="openViolation({},'add')"
          v-hasPermi="['system:experts:add']"
        >新增填报</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>
    <el-table v-loading="loading" :data="expertList">
      <el-table-column label="发生时间" align="center" prop="name" />
    <el-table v-loading="loading" :data="dataList">
      <el-table-column label="发生时间" align="center" prop="violationTime" />
      <el-table-column label="姓名" align="center" prop="name" />
      <el-table-column label="身份证号" align="center" prop="name" />
      <el-table-column label="IC/电子证编号" align="center" prop="phone"/>
      <el-table-column label="所属单位" align="center" prop="phone"/>
      <el-table-column label="作业种类" align="center" prop="phone"/>
      <el-table-column label="身份证号" align="center" prop="idCard" />
      <el-table-column label="IC卡编号" align="center" prop="icNum"/>
      <el-table-column label="电子证编号" align="center" prop="electNum"/>
      <el-table-column label="所属单位" align="center" prop="dept"/>
      <el-table-column label="作业种类" align="center" prop="jobCategory"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-view"
            @click="handleView(scope.row)"
            @click="openViolation(scope.row,'view')"
          >查看违规详情</el-button>
<!--          <el-button-->
<!--            size="mini"-->
<!--            type="text"-->
<!--            icon="el-icon-edit"-->
<!--            @click="openViolation(scope.row,'edit')"-->
<!--            v-hasPermi="['system:experts:remove']"-->
<!--          >编辑</el-button>-->
          <el-button
            size="mini"
            type="text"
@@ -78,62 +87,122 @@
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageIndex"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
    <add-dialog ref="addDialogRef" @getList = "getList"></add-dialog>
    <violation-dialog ref="violationDialog" @getList="getList" :typeList="typeList"></violation-dialog>
  </div>
</template>

<script>

import addDialog from "@/views/notCoalMine/nViolationRegistration/components/addDialog.vue";
import violationDialog from "@/views/notCoalMine/nViolationRegistration/components/violationDialog.vue";
import {delViolation, getViolationPage} from "@/api/coalMine/violation";
import {getOperatePage} from "@/api/coalMine/operateType";
import {delPeople} from "@/api/coalMine/people";
export default {
  name: "nViolationRegistration",
  name: "cViolationRegistration",
  dicts: [],
  components: {
    addDialog
    violationDialog
  },
  data() {
    return {
      addDialogRef: '',
      violationDialog: '',
      loading: false,
      single: true,
      multiple: true,
      showSearch: true,
      addForm: false,
      dataList: [],
      total: 0,
      expertTypes: [],
      expertList: [],
      queryParams: {},
      classiFy: [],
      form: {},
      rules: {
        classifyName: [
          { required: true, message: "分类名称不能为空", trigger: "blur" }
        ]
      }
      typeList: [],
      queryParams: {
        name: '',
        idCard:'',
        dept: '',
        operateTypeId: null,
        isCm: 0,
        pageNum: 1,
        pageSize: 10
      },
    };
  },
  created() {

    this.getList()
    this.getTypeList()
  },
  methods: {
    getList(){

    async getList(){
      const t = this
      t.loading = true
      const res = await getViolationPage(t.queryParams)
      if(res.code == 200){
        t.dataList = res.rows
        t.total = res.total
      }else{
        t.$message({
          message: res.msg,
          type: 'warning'
        })
      }
      t.loading = false
    },
    async getTypeList() {
      this.loading = true;
      const res = await getOperatePage({name: ''})
      if(res.code == 200){
        this.typeList = this.handleTree(res.data, "id");
      }else{
        this.$message({
          type: 'warning',
          message: res.msg
        });
      }
      this.loading = false;
    },
    handleChange(){

    },
    handleQuery(){
    handleDelete(row){
      this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await delViolation(row.violationId)
        if(res.code == 200){
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          await this.getList()
        }else{
          this.$message({
            type: 'warning',
            message: res.msg
          });
        }
      }).catch(() => {

      });
    },
    handleQuery(){
      this.queryParams.pageNum = 1
      this.getList()
    },
    resetQuery(){

      this.queryParams = {
        name: '',
        idCard:'',
        dept: '',
        operateTypeId: null,
        isCm: 0,
        pageNum: 1,
        pageSize: 10
      }
      this.getList()
    },
    handleAdd(){
      this.$refs.addDialogRef.openDialog();
    openViolation(data,type){
      this.$refs.violationDialog.openDialog(data,type);
    }
  }
};