新增页面

马宇豪

2024-11-13 865c472d4b2bca2a3506f8e9c36809887369bd9b

新增页面

 src/assets/logo/logo2.png

 src/layout/components/Sidebar/menu.js

@@ -66,6 +66,16 @@
            ]
        },
        {
            path: '/postEvaluation',
            name: '/postEvaluation',
            meta: { title: '事后考评',icon: 'post'}
        },
        {
            path: '/evaluateRecord',
            name: '/evaluateRecord',
            meta: { title: '专家考评记录',icon: 'post'}
        },
        {
            path: '/system',
            redirect: '/system/dept',
            meta: { title: '系统设置',icon: 'dict'},
@@ -76,30 +86,20 @@
                    meta: { title: '部门处室管理',icon: 'build'}
                },
                {
                    path: 'expertsType',
                    name: 'expertsType',
                    meta: { title: '专业领域管理',icon: 'clipboard'}
                },
                {
                    path: 'evaluate',
                    name: 'evaluate',
                    meta: { title: '类型管理',icon: 'build'}
                    meta: { title: '考评项目管理',icon: 'build'}
                },
                // {
                //     path: 'expertsType',
                //     name: 'expertsType',
                //     meta: { title: '专家类型管理',icon: 'clipboard'}
                // },
                // {
                //     path: 'business',
                //     name: 'business',
                //     meta: { title: '业务范围管理',icon: 'cascader'}
                // },
                // {
                //     path: 'area',
                //     name: 'area',
                //     meta: { title: '地区维护管理',icon: 'component'}
                // },
                // {
                //     path: 'major',
                //     name: 'major',
                //     meta: { title: '专业方向管理',icon: 'documentation'}
                // }
                {
                    path: 'openApply',
                    name: 'openApply',
                    meta: { title: '专家申请设置',icon: 'cascader'}
                }

            ]
        },

 src/router/index.js

@@ -240,6 +240,32 @@
    ]
  },
  {
    path: '/postEvaluation',
    component: Layout,
    redirect: '/postEvaluation',
    children: [
      {
        path: '/postEvaluation',
        component: () => import('@/views/safetyReview/expertManage/postEvaluation/index.vue'),
        name: 'postEvaluation',
        meta: { title: '事后考评'}
      }
    ]
  },
  {
    path: '/evaluateRecord',
    component: Layout,
    redirect: '/evaluateRecord',
    children: [
      {
        path: '/evaluateRecord',
        component: () => import('@/views/safetyReview/expertManage/evaluateRecord/index.vue'),
        name: 'evaluateRecord',
        meta: { title: '专家考评记录'}
      }
    ]
  },
  {
    path: '/system',
    component: Layout,
    redirect: '/system/post',
@@ -252,35 +278,23 @@
        meta: { title: '部门处室管理',icon: 'form'}
      },
      {
        path: 'expertsType',
        component: () => import('@/views/safetyReview/baseSet/expertsType/index.vue'),
        name: 'expertsType',
        meta: { title: '专业领域管理',icon: 'form'}
      },
      {
        path: 'evaluate',
        component: () => import('@/views/safetyReview/baseSet/evaluateType/index.vue'),
        name: 'evaluate',
        meta: { title: '类型管理',icon: 'form'}
        meta: { title: '考评项目管理',icon: 'form'}
      },
      // {
      //   path: 'expertsType',
      //   component: () => import('@/views/safetyReview/baseSet/expertsType/index.vue'),
      //   name: 'expertsType',
      //   meta: { title: '专家类型管理',icon: 'form'}
      // },
      // {
      //   path: 'business',
      //   component: () => import('@/views/safetyReview/baseSet/business/index.vue'),
      //   name: 'business',
      //   meta: { title: '业务范围',icon: 'form'}
      // },
      // {
      //   path: 'area',
      //   component: () => import('@/views/safetyReview/baseSet/area/index.vue'),
      //   name: 'area',
      //   meta: { title: '地区维护',icon: 'form'}
      // },
      // {
      //   path: 'major',
      //   component: () => import('@/views/safetyReview/baseSet/major/index.vue'),
      //   name: 'major',
      //   meta: { title: '专业方向',icon: 'form'}
      // },
      {
        path: 'openApply',
        component: () => import('@/views/safetyReview/baseSet/openApply/index.vue'),
        name: 'openApply',
        meta: { title: '专家申请设置',icon: 'form'}
      }
    ]
  },


 src/views/safetyReview/baseSet/evaluateType/components/typeDialog.vue

@@ -8,7 +8,16 @@
        >
            <el-form :model="state.form" size="default" ref="busRef" :rules="state.formRules" label-width="110px" >
                <el-form-item label="类型:" prop="label">
                    <el-input v-model.trim="state.form.label"></el-input>
                <el-radio-group v-model="state.form.type">
                  <el-radio :label="0" size="large" border>加分项</el-radio>
                  <el-radio :label="1" size="large" border>扣分项</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="标准分值:" prop="score">
                  <el-input v-model.trim="state.form.score"></el-input>
              </el-form-item>
              <el-form-item label="内容:" prop="content">
                <el-input v-model.trim="state.form.content" type="textarea" :autosize="{minRows: 2}"></el-input>
                </el-form-item>
            </el-form>
            <template #footer>

 src/views/safetyReview/baseSet/evaluateType/index.vue

@@ -8,9 +8,18 @@
                @click="openDialog('add',{})"
            >新增</el-button>
        </div>
      <div style="margin-top: 15px;margin-bottom: 15px;">
        <el-radio-group v-model="queryParams.expertType">
          <el-radio-button label="">全部</el-radio-button>
          <el-radio-button label="1">加分项</el-radio-button>
          <el-radio-button label="2">扣分项</el-radio-button>
        </el-radio-group>
      </div>
        <!-- 表格数据 -->
        <el-table v-loading="loading" :data="dataList" :border="true">
          <el-table-column label="项目内容" prop="label" align="center"  />
            <el-table-column label="类型" prop="label" align="center"  />
          <el-table-column label="标准分值" prop="label" align="center"  />
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" >
                <template #default="scope">
                    <el-button link type="primary"  @click="openDialog('edit',scope.row)">编辑</el-button>

 src/views/safetyReview/baseSet/openApply/index.vue

对比新文件
@@ -0,0 +1,108 @@
<template>
    <div class="app-container">
        <div style="margin-bottom: 10px">
          <el-button type="primary" plain icon="Open">开启专家申请</el-button>
          <el-button type="danger" plain icon="TurnOff">关闭专家申请</el-button>
        </div>
        <!-- 表格数据 -->
        <el-table v-loading="loading" :data="dataList" :border="true">
          <el-table-column label="序号" type="index" align="center"  />
          <el-table-column label="开启时间" prop="startTime" align="center"  />
          <el-table-column label="结束时间" prop="endTime" align="center"  />
        </el-table>

        <div class="pag-container">
            <el-pagination
                v-model:current-page="data.queryParams.pageNum"
                v-model:page-size="data.queryParams.pageSize"
                :page-sizes="[10,15,20,25]"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
            />
        </div>
    </div>
</template>

<script setup>
import {getCurrentInstance, onMounted, reactive, ref, toRefs} from "vue";
import {ElMessage, ElMessageBox} from "element-plus";
import {delDict, getDictList} from "@/api/backManage/evaluate";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const busRef = ref();
const dictType = ref("sys_major_orientation")
const data = reactive({
    queryParams: {
        pageNum: 1,
        pageSize: 10,
        dictType: dictType.value
    },
    total: 0,
    dataList: [
    ]


});

const { queryParams, total, dataList } = toRefs(data);

onMounted(() => {
    getList();
});
const getList = async () => {
    loading.value = true;
    const res = await getDictList(data.queryParams);
    if(res.code === 200){
        dataList.value = res.data.list
        total.value = res.data.total
    }else{
        ElMessage.warning(res.message)
    }
    loading.value = false;
}
const handleSizeChange = (val) => {
    data.queryParams.pageNum = 1;
    data.queryParams.pageSize = val
    getList()
}
const handleCurrentChange = (val) => {
    data.queryParams.pageNum = val
    getList()
}

/** 重置新增的表单以及其他数据  */
function reset() {
    proxy.resetForm("roleRef");
}
const handleDelete = (val) => {
    ElMessageBox.confirm(
        '确定删除此条数据？',
        '提示',
        {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
        })
        .then( async() => {
            const res = await delDict(val);
            if(res.code === 200){
                ElMessage({
                    type: 'success',
                    message: '删除成功'
                });
                getList();
            }else{
                ElMessage.warning(res.message)
            }
        })
}

</script>
<style>
.pag-container{
float: right;
margin-top: 10px;
}
</style>

 src/views/safetyReview/expertManage/evaluateRecord/components/evaluateDetail.vue

对比新文件
@@ -0,0 +1,115 @@
<template>
    <div class="notice">
        <el-dialog
            v-model="dialogVisible"
            :title="title"
            width="900px"
            :before-close="handleClose"
        >
            <el-form :model="state.form" inline size="default" ref="busRef" :rules="state.formRules" label-width="140px" >
              <el-form-item label="姓名:" prop="score">
                  <el-input v-model.trim="state.form.score" readonly></el-input>
              </el-form-item>
              <el-form-item label="身份证号:" prop="content">
                <el-input v-model.trim="state.form.content" readonly></el-input>
              </el-form-item>
              <el-form-item label="项目名称:" prop="score">
                <el-input v-model.trim="state.form.score" readonly></el-input>
              </el-form-item>
              <el-form-item label="是否为专家组组长:" prop="content">
                <el-input v-model.trim="state.form.content" readonly></el-input>
              </el-form-item>
              <el-form-item label="考评记录时间:" prop="content">
                <el-input v-model.trim="state.form.content" readonly></el-input>
              </el-form-item>
              <el-form-item label="总计:" prop="content">
                <el-input v-model.trim="state.form.content" readonly></el-input>
              </el-form-item>
            </el-form>
          <el-table :data="tableData" border style="width: 100%">
            <el-table-column prop="name" label="加（扣）分项目"/>
            <el-table-column prop="score" label="分值明细" />
          </el-table>
            <template #footer>
                    <span class="dialog-footer">
                        <el-button type="primary"  @click="handleClose" size="default" v-preReClick>确认</el-button>
                    </span>
            </template>
        </el-dialog>
    </div>
</template>
<script setup>
import {reactive, ref, toRefs} from 'vue'
import Editor from "@/components/Editor/index.vue";
import {ElMessage} from "element-plus";
import {addNotice} from "@/api/backManage/notice";
import {addDict, editDict, getDictDetail} from "@/api/backManage/evaluate";

const dialogVisible = ref(false);
const title = ref("");
const busRef = ref();
const length = ref()
const emit = defineEmits(["getList"]);
const state = reactive({
    form: {
        id: '',
        label: '',
        value: '',
        dictType: "sys_assess_type",
    },
    formRules:{
        label: [{ required: true, message: '请输入类型', trigger: 'blur' }],
    },

})

const openDialog = async (type, value) => {
    length.value = value.listLength
    title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ;
    if(type === 'edit') {
        state.form = value;
        const param = {
            dictId: value.id
        }
        const res = await getDictDetail(param);
        if(res.code === 200){
            state.form = res.data
        }else{
            ElMessage.warning(res.message)
        }
    }
    dialogVisible.value = true;
}

const handleClose = () => {
    busRef.value.clearValidate();
    reset();
    dialogVisible.value = false;

}
const reset = () => {
    state.form = {
        id: '',
        label: '',
        value: '',
        dictType: "sys_assess_type",
    }
}
defineExpose({
    openDialog
});

</script>

<style scoped lang="scss">
.notice{
    :deep(.el-form .el-form-item__label) {
        font-size: 15px;
    }
    .file {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
}
</style>

 src/views/safetyReview/expertManage/evaluateRecord/index.vue

对比新文件
@@ -0,0 +1,219 @@
<template>
    <div class="app-container">
      <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
        <el-form-item label="项目名称">
          <el-input v-model="queryParams.name" placeholder="请输入项目名称" />
        </el-form-item>
        <el-form-item label="姓名">
          <el-input v-model="queryParams.name" placeholder="请输入姓名" />
        </el-form-item>
        <el-form-item label="身份证号">
          <el-input v-model="queryParams.name" placeholder="请输入身份证号" />
        </el-form-item>
        <el-form-item label="领域" prop="dutyStatus">
          <el-select v-model="queryParams.dutyStatus" placeholder="岗位状态" clearable>
            <el-option :key="0" label="已评估" :value="0"/>
            <el-option :key="1" label="未评估" :value="1"/>
          </el-select>
        </el-form-item>
        <el-form-item label="时间范围" prop="searchTime">
          <el-date-picker
              v-model="searchTime"
              type="daterange"
              @change="changeTime"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              value-format="YYYY-MM-DD"
          />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
          <el-button icon="Refresh" @click="resetQuery">重置</el-button>
        </el-form-item>
      </el-form>

      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button type="primary" plain :icon="Plus" @click="openDialog('add',{})">新增</el-button>
        </el-col>
      </el-row>
      <el-table v-loading="loading" :data="expertList" :border="true">
        <el-table-column type="index" width="55" align="center" />
        <el-table-column label="考评时间" align="center" prop="birthday" />
        <el-table-column label="姓名" align="center" prop="birthday" />
        <el-table-column label="身份证号" align="center" prop="birthday" />
        <el-table-column label="考评应用领域" align="center" prop="birthday" />
        <el-table-column label="项目名称" align="center" prop="name" />
        <el-table-column label="是否为专家组" align="center">
          <template #default="scope">
            {{findNodeById(expertTypes,scope.row.bigClassify)}}/{{findNodeById(expertTypes,scope.row.smallClassify)}}
          </template>
        </el-table-column>
        <el-table-column label="考评分数" align="center">
          <template #default="scope">
            {{findNodeById(expertTypes,scope.row.bigClassify)}}/{{findNodeById(expertTypes,scope.row.smallClassify)}}
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
          <template #default="scope">
            <el-button type="primary" link @click="openDialog('view',scope.row)">查看明细</el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination
          v-show="total > 0"
          :total="total"
          v-model:page="queryParams.pageNum"
          v-model:limit="queryParams.pageSize"
          @pagination="getList"
      />
      <evaluate-detail ref="evaluateFormRef" @getList="getList"></evaluate-detail>
    </div>
</template>

<script setup>
import {getCurrentInstance, onMounted, onUnmounted, reactive, ref, toRefs} from "vue";
import {ElMessage, ElMessageBox} from "element-plus";
import EvaluateDetail from "./components/evaluateDetail";
import {delExpert, getExpertsList, getExpertTypes} from "../../../../api/form";
import { Plus } from '@element-plus/icons-vue'

const loading = ref(false);
const data = reactive({
  showSearch: true,
  total: 0,
  expertTypes: [],
  expertList: [],
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    bigClassify: null,
    smallClassify: null,
    dutyStatus: null,
    name: '',
    params: {
      startTime: '',
      endTime: ''
    }
  },
  classiFy: [],
  searchTime: []
});

const { showSearch,total, expertTypes,expertList,queryParams,classiFy,searchTime} = toRefs(data);
const evaluateFormRef = ref()
onMounted(()=>{
  getList()
  getTypes()
})

onUnmounted(()=>{

})

const getTypes = async()=> {
  const res = await getExpertTypes()
  if(res.code == 200){
    data.expertTypes = res.data
  }else{
    ElMessage.warning(res.msg)
  }
}

const handleChange=(value)=> {
    if(!value){
        data.classiFy = []
        data.queryParams.bigClassify = ""
        data.queryParams.smallClassify = ""
    }
}
const changeTime=(value)=>{
    if(!value){
        data.queryParams.params.endTime = ""
        data.queryParams.params.startTime = ""
    }
}

const findNodeById = (data,value)=> {
  for (const node of data) {
    if (node.id === value) {
      return node.classifyName;
    }
    if (node.children) {
      const foundNode = findNodeById(node.children, value);
      if (foundNode) {
        return foundNode;
      }
    }
  }
  return null;
}

const handleQuery=()=> {
  data.queryParams.pageNum = 1
  if(data.classiFy && data.classiFy.length>0){
    data.queryParams.bigClassify = data.classiFy[0]
    data.queryParams.smallClassify = data.classiFy[1]
  }
  if(data.searchTime && data.searchTime.length>0){
    data.queryParams.params.startTime = data.searchTime[0]
    data.queryParams.params.endTime = data.searchTime[1]
  }
  getList()
}

const getList = async () => {
  loading.value = true;
  const res = await getExpertsList(data.queryParams)
  if(res.code == 200){
    data.expertList = res.data.list
    data.total = res.data.total
  }else{
    ElMessage.warning(res.msg)
  }
  loading.value = false;
}

const openDialog = (type, value) => {
  evaluateFormRef.value.openDialog(type, value)
}

const handleDelete = (val) => {
    ElMessageBox.confirm(
        '确定删除此条数据？',
        '提示',
        {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
        })
        .then( async() => {
            const res = await delExpert(val.id)
            if(res.code == 200){
              ElMessage.success('数据删除成功')
              getList()
            }else{
              ElMessage.warning(res.message)
            }
        })
}
const resetQuery=()=> {
  data.queryParams = {
    pageNum: 1,
    pageSize: 10,
    bigClassify: null,
    smallClassify: null,
    dutyStatus: null,
    name: '',
    params: {
      startTime: '',
      endTime: ''
    }
  };
  data.classiFy = []
  data.searchTime = []
  handleQuery()
}

</script>

 src/views/safetyReview/expertManage/postEvaluation/components/expertForm.vue

对比新文件
@@ -0,0 +1,810 @@
<template>
    <div class="notice">
        <el-dialog
            v-model="dialogVisible"
            :title="state.title"
            width="80%"
            :before-close="handleClose"
        >
          <div class="main-title">专家信息录入</div>
          <!--    <el-divider>专家信息录入</el-divider>-->
          <div class="main_form">
            <el-form :model="state.form" :rules="state.rules" ref="ruleFormRef" label-width="200px">
              <el-row>
                <el-col :span="20">
                  <el-form-item label="专业类别" prop="profession">
                    <el-cascader
                        :disabled="state.disable"
                        style="width: 100%"
                        v-model="state.form.profession"
                        :options="state.expertsType"
                        :props="{ expandTrigger: 'hover',value: 'id',label: 'classifyName' }"
                        @change="professionChange"></el-cascader>
                  </el-form-item>
                </el-col>
              </el-row>
              <!--        <el-row>-->
              <!--          <el-col :span="20">-->
              <!--            <el-form-item label="填报日期" prop="date">-->
              <!--              <el-date-picker-->
              <!--                style="width: 100%"-->
              <!--                v-model="form.date"-->
              <!--                type="date"-->
              <!--                placeholder="选择日期">-->
              <!--              </el-date-picker>-->
              <!--            </el-form-item>-->
              <!--          </el-col>-->
              <!--        </el-row>-->
              <el-row>
                <el-col :span="20">
                  <el-form-item label="姓名" prop="name">
                    <el-input v-model="state.form.name" :readonly="state.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="state.form.sex" :disabled="state.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="birthday">
                    <el-date-picker
                        style="width: 100%"
                        v-model="state.form.birthday"
                        value-format="YYYY-MM-DD 00:00:00"
                        type="date"
                        placeholder="选择日期" :disabled="state.disable">
                    </el-date-picker>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="联系电话" prop="phone">
                    <el-input v-model="state.form.phone" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="职称" prop="title">
                    <!--              <el-select v-model="form.title" placeholder="请选择" style="width: 100%">-->
                    <!--                <el-option-->
                    <!--                  v-for="item in professionalList"-->
                    <!--                  :key="item.value"-->
                    <!--                  :label="item.label"-->
                    <!--                  :value="item.value">-->
                    <!--                </el-option>-->
                    <!--              </el-select>-->
                    <el-input v-model="state.form.title" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="证件照" prop="electronicPhoto">
                    <el-upload accept="image/*" :action="state.uploadUrl" :headers="state.header" :disabled="state.disable" method="post" :on-success="(res, uploadFile)=>handleAvatarSuccess(res, uploadFile,'证件照')" :on-exceed="showTip" :on-preview="handlePictureCardPreview" :limit='1' v-model:file-list="state.fileList" list-type="picture-card" :before-upload="picSize" :on-remove="(file, uploadFiles)=>handleRemove(file, uploadFiles,'证件照')" :before-remove="beforeRemove">
                      <el-icon><Plus /></el-icon>
                      <template #tip>
                        <div class="el-upload__tip">上传jpg/png图片尺寸小于5M,最多可上传1张</div>
                      </template>
                    </el-upload>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="身份证号" prop="idCard">
                    <el-input v-model="state.form.idCard" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="在岗情况" prop="dutyStatus">
                    <el-radio-group v-model="state.form.dutyStatus" :disabled="state.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="companyName">
                    <el-input v-model="state.form.companyName" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="单位地址">
                    <el-input v-model="state.form.companyAddress" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="所在部门">
                    <el-input v-model="state.form.deptName" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="职务">
                    <el-input v-model="state.form.job" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="单位电话">
                    <el-input v-model="state.form.companyTelephone" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="传真号码">
                    <el-input v-model="state.form.faxNum" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="电子邮箱">
                    <el-input v-model="state.form.email" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="毕业学校">
                    <el-input v-model="state.form.graduationSchool" :readonly="state.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="state.form.degree" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="所学专业">
                    <el-input v-model="state.form.speciality" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="现从事的专业及方向">
                    <el-input v-model="state.form.currentProfession" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="支撑方向_安全生产" prop="supportDirectionSafety">
                    <!--              <el-radio-group v-model="form.supportDirectionSafety">-->
                    <!--                <el-radio v-for="item in directionList" :label="item.value" :key="item.value">{{ item.label }}</el-radio>-->
                    <!--              </el-radio-group>-->
                    <el-checkbox-group v-model="state.form.supportDirectionSafety" :disabled="state.disable">
                      <el-checkbox v-for="item in state.directionList" :label="item.value" :key="item.value">{{ item.label }}</el-checkbox>
                    </el-checkbox-group>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="支撑方向_防灾减灾救灾" prop="supportDirectionPrevention">
                    <!--              <el-radio-group v-model="form.supportDirectionPrevention">-->
                    <!--                <el-radio v-for="item in directionList" :label="item.value" :key="item.value">{{ item.label }}</el-radio>-->
                    <!--              </el-radio-group>-->
                    <el-checkbox-group v-model="state.form.supportDirectionPrevention" :disabled="state.disable">
                      <el-checkbox v-for="item in state.directionList" :label="item.value" :key="item.value">{{ item.label }}</el-checkbox>
                    </el-checkbox-group>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="支撑方向_应急救援" prop="supportDirectionEmergency">
                    <!--              <el-radio-group v-model="form.supportDirectionEmergency">-->
                    <!--                <el-radio v-for="item in directionList" :label="item.value" :key="item.value">{{ item.label }}</el-radio>-->
                    <!--              </el-radio-group>-->
                    <el-checkbox-group v-model="state.form.supportDirectionEmergency" :disabled="state.disable">
                      <el-checkbox v-for="item in state.directionList" :label="item.value" :key="item.value">{{ item.label }}</el-checkbox>
                    </el-checkbox-group>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="工作简历">
                    <el-upload accept="image/*" multiple :action="state.uploadUrl" :headers="state.header" method="post" :disabled="state.disable" :on-success="(res, uploadFile)=>handleAvatarSuccess(res, uploadFile,'简历')" :on-exceed="showTip" :on-preview="handlePictureCardPreview" :limit='8' v-model:file-list="state.resumeList" list-type="picture-card" :before-upload="picSize" :on-remove="(file, uploadFiles)=>handleRemove(file, uploadFiles,'简历')" :before-remove="beforeRemove">
                      <el-icon><Plus /></el-icon>
                      <template #tip>
                        <div class="el-upload__tip">上传jpg/png图片尺寸小于5M,最多可上传5张</div>
                      </template>
                    </el-upload>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="发明、著作、学术论文情况（何时、何地出版或发表）">
                    <el-upload accept="image/*" multiple :action="state.uploadUrl" :headers="state.header" method="post" :disabled="state.disable" :on-success="(res, uploadFile)=>handleAvatarSuccess(res, uploadFile,'著作')" :on-exceed="showTip" :on-preview="handlePictureCardPreview" :limit='8' v-model:file-list="state.inventionList" list-type="picture-card" :before-upload="picSize" :on-remove="(file, uploadFiles)=>handleRemove(file, uploadFiles,'著作')" :before-remove="beforeRemove">
                      <el-icon><Plus /></el-icon>
                      <template #tip>
                        <div class="el-upload__tip">上传jpg/png图片尺寸小于5M,最多可上传5张</div>
                      </template>
                    </el-upload>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="受过何种奖励">
                    <el-upload accept="image/*" multiple :action="state.uploadUrl" :headers="state.header" method="post" :disabled="state.disable" :on-success="(res, uploadFile)=>handleAvatarSuccess(res, uploadFile,'奖励')" :on-exceed="showTip" :on-preview="handlePictureCardPreview" :limit='8' v-model:file-list="state.rewardList" list-type="picture-card" :before-upload="picSize" :on-remove="(file, uploadFiles)=>handleRemove(file, uploadFiles,'奖励')" :before-remove="beforeRemove">
                      <el-icon><Plus /></el-icon>
                      <template #tip>
                        <div class="el-upload__tip">上传jpg/png图片尺寸小于5M,最多可上传5张</div>
                      </template>
                    </el-upload>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="应急管理相关工作主要业绩及研究成果">
                    <el-upload accept="image/*" multiple :action="state.uploadUrl" :headers="state.header" method="post" :disabled="state.disable" :on-success="(res, uploadFile)=>handleAvatarSuccess(res, uploadFile,'研究')" :on-exceed="showTip" :on-preview="handlePictureCardPreview" :limit='8' v-model:file-list="state.achievementList" list-type="picture-card" :before-upload="picSize" :on-remove="(file, uploadFiles)=>handleRemove(file, uploadFiles,'研究')" :before-remove="beforeRemove">
                      <el-icon><Plus /></el-icon>
                      <template #tip>
                        <div class="el-upload__tip">上传jpg/png图片尺寸小于5M,最多可上传5张</div>
                      </template>
                    </el-upload>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="专家本人意见">
                    <el-upload accept="image/*" multiple :action="state.uploadUrl" :headers="state.header" method="post" :disabled="state.disable" :on-success="(res, uploadFile)=>handleAvatarSuccess(res, uploadFile,'本人')" :on-exceed="showTip" :on-preview="handlePictureCardPreview" :limit='8' v-model:file-list="state.proAdviceList" list-type="picture-card" :before-upload="picSize" :on-remove="(file, uploadFiles)=>handleRemove(file, uploadFiles,'本人')" :before-remove="beforeRemove">
                      <el-icon><Plus /></el-icon>
                      <template #tip>
                        <div class="el-upload__tip">上传jpg/png图片尺寸小于5M,最多可上传5张</div>
                      </template>
                    </el-upload>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="推荐单位意见">
                    <el-upload accept="image/*" multiple :action="state.uploadUrl" :headers="state.header" method="post" :disabled="state.disable" :on-success="(res, uploadFile)=>handleAvatarSuccess(res, uploadFile,'单位')" :on-exceed="showTip" :on-preview="handlePictureCardPreview" :limit='8' v-model:file-list="state.adviceList" list-type="picture-card" :before-upload="picSize" :on-remove="(file, uploadFiles)=>handleRemove(file, uploadFiles,'单位')" :before-remove="beforeRemove">
                      <el-icon><Plus /></el-icon>
                      <template #tip>
                        <div class="el-upload__tip">上传jpg/png图片尺寸小于5M,最多可上传5张</div>
                      </template>
                    </el-upload>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="20">
                  <el-form-item label="补充说明">
                    <el-input v-model="state.form.remark" type="textarea" :autosize="{ minRows: 2}" :readonly="state.disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
            <el-dialog v-model="imgDialog">
              <img w-full :src="state.dialogImageUrl" alt="">
            </el-dialog>
          </div>
            <template #footer>
              <span class="dialog-footer" v-if="state.title == '新增' || state.title == '编辑'">
                  <el-button @click="handleClose" size="default">取 消</el-button>
                  <el-button type="primary" @click="onSubmit(ruleFormRef)" size="default" v-preReClick>确认</el-button>
              </span>
              <span class="dialog-footer" v-if="state.title == '评定'">
                  <el-button type="danger" size="default" @click="assess(3)"  v-preReClick>评定驳回</el-button>
                  <el-button type="primary" @click="assess(2)" size="default" v-preReClick>评定通过</el-button>
              </span>
            </template>
        </el-dialog>
    </div>
</template>
<script setup>
import {reactive, ref, toRefs, defineEmits, nextTick, onMounted} from 'vue'
import {ElMessage, ElMessageBox} from "element-plus"
import {verifyPhone, verifyIdCard} from "../../../../../utils/validate"
import {addExpertInfo, getExpertTypes, getInfo, modExpertInfo, uploadFile, changeApprove} from "@/api/form"
import {delPic} from "@/api/login"
import { getToken } from "@/utils/auth"
import {Base64} from "js-base64"
const emit = defineEmits(["getList"])
const dialogVisible = ref(false)
const imgDialog = ref(false)
const ruleFormRef = ref()
var validatePass = (rule, value, callback) => {
  if (state.fileList.length == 0) {
    callback(new Error('请上传证件照'));
  } else {
    callback();
  }
}
let validatePhone = (rule, value, callback)=>{
  if(value === ''){
    callback(new Error('请输入手机号'))
  }else{
    if(!verifyPhone(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()
    }
  }
}

const state = reactive({
  form:{
    id: null,
    name:'',
    sex:'',
    profession: [],
    bigClassify:null,
    smallClassify: null,
    birthday: '',
    phone:'',
    title: '',
    electronicPhoto: '',
    idCard: '',
    dutyStatus: null,
    companyName: '',
    companyAddress: '',
    deptName: '',
    job: '',
    companyTelephone: '',
    faxNum: '',
    email: '',
    graduationSchool: '',
    degree: '',
    speciality: '',
    currentProfession: '',
    supportDirectionSafety: [],
    supportDirectionPrevention: [],
    supportDirectionEmergency: [],
    resumeKey: '',
    paperSituationKey: '',
    rewardKey: '',
    achievementKey: '',
    personalOpinionKey: '',
    recommendUnitOpinionKey: '',
    remark: '',
    source: 2
  },
  hasDeleteFile: false,
  disable: false,
  expertsType: [],
  directionList: [
    {
      value: 1,
      label: '现场检查'
    },
    {
      value: 2,
      label: '调查评估'
    },
    {
      value: 3,
      label: '咨询服务'
    },
    {
      value: 4,
      label: '教育培训'
    },
    {
      value: 5,
      label: '其他'
    }
  ],
  uploadUrl: import.meta.env.VITE_APP_BASE_API + '/system/common/uploadFile',
  header: {
    Authorization: 'Bearer ' + getToken()
  },
  fileList: [],
  resumeList: [],
  inventionList: [],
  rewardList: [],
  achievementList: [],
  proAdviceList: [],
  adviceList: [],
  dialogImageUrl: '',
  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' }]
  }
})

  onMounted(()=>{
  })

  const openDialog = (type, value) => {
    state.title = type === 'add' ? '新增' : type ==='edit' ? '编辑' : type ==='view' ?'查看':'评定'
    getExpertsType()
      if(type == 'edit'||type=='view'||type=='assess'){
        getInfo(value.id).then((res)=>{
          if(res.code == 200){
            if(res.data) {
              const val = res.data
              for(let i in state.form) {
                if (validKey(i, val)) {
                  state.form[i] = val[i]
                }
              }
              state.form.profession[0] = val.bigClassify
              state.form.profession[1] = val.smallClassify
              if(val.supportDirectionSafety){
                state.form.supportDirectionSafety = val.supportDirectionSafety.split(',').map(i=>Number(i))
              }
              if(val.supportDirectionPrevention){
                state.form.supportDirectionPrevention = val.supportDirectionPrevention.split(',').map(i=>Number(i))
              }
              if(val.supportDirectionEmergency){
                state.form.supportDirectionEmergency = val.supportDirectionEmergency.split(',').map(i=>Number(i))
              }
              state.fileList.push({
                name: state.form.electronicPhoto,
                url: import.meta.env.VITE_APP_BASE_API + '/' + state.form.electronicPhoto,
              })
              if(state.form.resumeKey !== ''){
                state.resumeList = state.form.resumeKey.split(',').map(i=>{
                  return {
                    name: i,
                    url: import.meta.env.VITE_APP_BASE_API + '/' + i,
                  }
                })
              }
              if(state.form.paperSituationKey !== ''){
                state.inventionList = state.form.paperSituationKey.split(',').map(i=>{
                  return {
                    name: i,
                    url: import.meta.env.VITE_APP_BASE_API + '/' + i,
                  }
                })
              }
              if(state.form.rewardKey !== ''){
                state.rewardList = state.form.rewardKey.split(',').map(i=>{
                  return {
                    name: i,
                    url: import.meta.env.VITE_APP_BASE_API + '/' + i,
                  }
                })
              }
              if(state.form.achievementKey !== ''){
                state.achievementList = state.form.achievementKey.split(',').map(i=>{
                  return {
                    name: i,
                    url: import.meta.env.VITE_APP_BASE_API + '/' + i,
                  }
                })
              }
              if(state.form.personalOpinionKey !== ''){
                state.proAdviceList = state.form.personalOpinionKey.split(',').map(i=>{
                  return {
                    name: i,
                    url: import.meta.env.VITE_APP_BASE_API + '/' + i,
                  }
                })
              }
              if(state.form.recommendUnitOpinionKey !== ''){
                state.adviceList = state.form.recommendUnitOpinionKey.split(',').map(i=>{
                  return {
                    name: i,
                    url: import.meta.env.VITE_APP_BASE_API + '/' + i,
                  }
                })
              }
            }
            dialogVisible.value = true
          }else{
            ElMessage.warning('数据获取失败：'+res.message)
          }
        })
        if(type == 'edit'){
          state.disable = false
        }else{
          state.disable = true
        }
      }else{
        state.disable = false
        dialogVisible.value = true
      }
  }

  const validKey=(key,obj)=>{
    return key in obj
  }

  const assess = (num)=>{
    ElMessageBox.confirm(
        '确定对该专家进行此审批操作？',
        '提示',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        })
        .then(async() => {
          const res = await changeApprove({id:state.form.id,state: num})
          if(res.code == 200){
            ElMessage({
              type: 'success',
              message: '审批成功'
            });
            emit('getList')
            dialogVisible.value = false
          }else{
            ElMessage({
              type: 'warning',
              message: res.message
            });
          }
        })
  }

  const getExpertsType = async ()=>{
    const res = await getExpertTypes()
    if(res.code == 200){
      state.expertsType = res.data
    }else{
      ElMessage({
        type: 'warning',
        message: res.message
      });
    }
  }

  const professionChange=(value)=> {
    console.log(value,'val')
  }



  // 图片上传
  const showTip =()=>{
    ElMessage({
      type: 'warning',
      message: '超出文件上传数量'
    });
  }

  const picSize = async (rawFile) => {
    if(rawFile.size / 1024 / 1024 > 5){
      ElMessage({
        type: 'warning',
        message: '文件大小不能超过5M'
      });
      return false
    }
  };

  const handlePictureCardPreview = (uploadFile) => {
    state.dialogImageUrl = uploadFile.url
    imgDialog.value = true;
  }

  const handleAvatarSuccess = (res, uploadFile,type) => {
    if(res.code == 200){
      if(type == '证件照'){
        state.form.electronicPhoto = res.data.path
      }else{
        uploadFile.name = res.data.path
      }
    }else{
      ElMessage({
        type: 'warning',
        message: '文件上传失败'
      })
    }
  }

  const handleRemove = (file, uploadFiles,type) => {
    if(file && file.status == 'success') {
      ElMessageBox.confirm(
          '该操作将永久删除此文件内容，是否继续？',
          '提示',
          {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
          })
          .then(async () => {
            let path = ''
            if (type == '证件照') {
              path = state.form.electronicPhoto
            } else {
              path = file.name
            }
            const res = await delPic({path: path})
            if (res.code == 200) {
              ElMessage({
                type: 'success',
                message: '文件已删除'
              })
              state.hasDeleteFile = true
            } else {
              ElMessage({
                type: 'warning',
                message: res.message
              })
            }
          })
    }
  }

const onSubmit = async (formEl)=> {
  if (!formEl) return
  await formEl.validate(async (valid, fields) => {
    if (valid) {
      if(state.form.supportDirectionSafety.length==0&&state.form.supportDirectionSafety.length==0&&state.form.supportDirectionSafety.length==0){
        ElMessage.warning('请至少选择一种支撑方向')
        return
      }
      let data = JSON.parse(JSON.stringify(state.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]
      data.resumeKey = state.resumeList.map(i=>i.name).join(',')
      data.paperSituationKey = state.inventionList.map(i=>i.name).join(',')
      data.rewardKey = state.rewardList.map(i=>i.name).join(',')
      data.achievementKey = state.achievementList.map(i=>i.name).join(',')
      data.personalOpinionKey = state.proAdviceList.map(i=>i.name).join(',')
      data.recommendUnitOpinionKey = state.adviceList.map(i=>i.name).join(',')
      delete data.profession
      if(state.title == '新增'){
        delete data.id
        const res= await addExpertInfo(data)
        if(res.code == 200){
          ElMessage.success(res.message)
          state.fileList = []
          state.resumeList = []
          state.inventionList = []
          state.rewardList = []
          state.achievementList = []
          state.proAdviceList = []
          state.adviceList = []
          emit('getList')
          state.hasDeleteFile = false
          dialogVisible.value = false
        }else{
          ElMessage.warning(res.message)
        }
      }else{
        const res= await modExpertInfo(data)
        if(res.code == 200){
          ElMessage.success(res.message)
          state.fileList = []
          state.resumeList = []
          state.inventionList = []
          state.rewardList = []
          state.achievementList = []
          state.proAdviceList = []
          state.adviceList = []
          emit('getList')
          state.hasDeleteFile = false
          dialogVisible.value = false
        }else{
          ElMessage.warning(res.message)
        }
      }
    } else {
      ElMessage.warning('请完善必填信息')
    }
  })
}

const handleClose = () => {
    if(state.hasDeleteFile == false){
      ruleFormRef.value.clearValidate()
      state.form={
        id: null,
        name:'',
        sex:'',
        profession: [],
        bigClassify:null,
        smallClassify: null,
        birthday: '',
        phone:'',
        title: '',
        electronicPhoto: '',
        idCard: '',
        dutyStatus: null,
        companyName: '',
        companyAddress: '',
        deptName: '',
        job: '',
        companyTelephone: '',
        faxNum: '',
        email: '',
        graduationSchool: '',
        degree: '',
        speciality: '',
        currentProfession: '',
        supportDirectionSafety: [],
        supportDirectionPrevention: [],
        supportDirectionEmergency: [],
        resumeKey: '',
        paperSituationKey: '',
        rewardKey: '',
        achievementKey: '',
        personalOpinionKey: '',
        recommendUnitOpinionKey: '',
        remark: '',
        source: 2
      }
      state.fileList = []
      state.resumeList = []
      state.inventionList = []
      state.rewardList = []
      state.achievementList = []
      state.proAdviceList = []
      state.adviceList = []
      dialogVisible.value = false;
    }else{
      onSubmit()
    }
}

defineExpose({
    openDialog,
  getExpertsType
})

</script>

<style scoped lang="scss">
.notice{
    :deep(.el-form .el-form-item__label) {
        font-size: 15px;
    }
    .file {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
}
</style>

 src/views/safetyReview/expertManage/postEvaluation/index.vue

对比新文件
@@ -0,0 +1,212 @@
<template>
    <div class="app-container">
      <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
        <el-form-item label="项目名称">
          <el-input v-model="queryParams.name" placeholder="请输入姓名" />
        </el-form-item>
        <el-form-item label="评估情况" prop="dutyStatus">
          <el-select v-model="queryParams.dutyStatus" placeholder="岗位状态" clearable>
            <el-option :key="0" label="已评估" :value="0"/>
            <el-option :key="1" label="未评估" :value="1"/>
          </el-select>
        </el-form-item>
        <el-form-item label="审批时间" prop="searchTime">
          <el-date-picker
              v-model="searchTime"
              type="date"
              @change="changeTime"
              value-format="YYYY-MM-DD"
          />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
          <el-button icon="Refresh" @click="resetQuery">重置</el-button>
        </el-form-item>
      </el-form>

      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button type="primary" plain :icon="Plus" @click="openDialog('add',{})">新增</el-button>
        </el-col>
      </el-row>
      <el-table v-loading="loading" :data="expertList" :border="true">
        <el-table-column type="index" width="55" align="center" />
        <el-table-column label="项目名称" align="center" prop="name" />
        <el-table-column label="审批单时间" align="center" prop="birthday" />
        <el-table-column label="结束时间" align="center" prop="birthday" />
        <el-table-column label="部门" align="center" prop="degree" />
        <el-table-column label="专家人数" align="center">
          <template #default="scope">
            {{findNodeById(expertTypes,scope.row.bigClassify)}}/{{findNodeById(expertTypes,scope.row.smallClassify)}}
          </template>
        </el-table-column>
        <el-table-column label="评估状态" align="center" prop="state">
          <template #default="scope">
            <el-tag :type="scope.row.state==0?'info':scope.row.state==1?'':scope.row.state==2?'success':scope.row.state==3?'danger':'warning'">
              {{scope.row.state==0?'暂存':scope.row.state==1?'审核中':scope.row.state==2?'审核通过':scope.row.state==3?'审核驳回':scope.row.state==4?'已作废':'--'}}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
          <template #default="scope">
            <el-button type="primary" link @click="openDialog('edit',scope.row)">开始评估</el-button>
            <el-button type="primary" link @click="openDialog('edit',scope.row)">修改评估</el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination
          v-show="total > 0"
          :total="total"
          v-model:page="queryParams.pageNum"
          v-model:limit="queryParams.pageSize"
          @pagination="getList"
      />
      <expert-form ref="expertFormRef" @getList="getList"></expert-form>
    </div>
</template>

<script setup>
import {getCurrentInstance, onMounted, onUnmounted, reactive, ref, toRefs} from "vue";
import {ElMessage, ElMessageBox} from "element-plus";
import ExpertForm from "./components/expertForm";
import {delExpert, getExpertsList, getExpertTypes} from "../../../../api/form";
import { Plus } from '@element-plus/icons-vue'

const loading = ref(false);
const data = reactive({
  showSearch: true,
  total: 0,
  expertTypes: [],
  expertList: [],
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    bigClassify: null,
    smallClassify: null,
    dutyStatus: null,
    name: '',
    params: {
      startTime: '',
      endTime: ''
    }
  },
  classiFy: [],
  searchTime: []
});

const { showSearch,total, expertTypes,expertList,queryParams,classiFy,searchTime} = toRefs(data);
const expertFormRef = ref()
onMounted(()=>{
  getList()
  getTypes()
})

onUnmounted(()=>{

})

const getTypes = async()=> {
  const res = await getExpertTypes()
  if(res.code == 200){
    data.expertTypes = res.data
  }else{
    ElMessage.warning(res.msg)
  }
}

const handleChange=(value)=> {
    if(!value){
        data.classiFy = []
        data.queryParams.bigClassify = ""
        data.queryParams.smallClassify = ""
    }
}
const changeTime=(value)=>{
    if(!value){
        data.queryParams.params.endTime = ""
        data.queryParams.params.startTime = ""
    }
}

const findNodeById = (data,value)=> {
  for (const node of data) {
    if (node.id === value) {
      return node.classifyName;
    }
    if (node.children) {
      const foundNode = findNodeById(node.children, value);
      if (foundNode) {
        return foundNode;
      }
    }
  }
  return null;
}

const handleQuery=()=> {
  data.queryParams.pageNum = 1
  if(data.classiFy && data.classiFy.length>0){
    data.queryParams.bigClassify = data.classiFy[0]
    data.queryParams.smallClassify = data.classiFy[1]
  }
  if(data.searchTime && data.searchTime.length>0){
    data.queryParams.params.startTime = data.searchTime[0]
    data.queryParams.params.endTime = data.searchTime[1]
  }
  getList()
}

const getList = async () => {
  loading.value = true;
  const res = await getExpertsList(data.queryParams)
  if(res.code == 200){
    data.expertList = res.data.list
    data.total = res.data.total
  }else{
    ElMessage.warning(res.msg)
  }
  loading.value = false;
}

const openDialog = (type, value) => {
  expertFormRef.value.openDialog(type, value)
}

const handleDelete = (val) => {
    ElMessageBox.confirm(
        '确定删除此条数据？',
        '提示',
        {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
        })
        .then( async() => {
            const res = await delExpert(val.id)
            if(res.code == 200){
              ElMessage.success('数据删除成功')
              getList()
            }else{
              ElMessage.warning(res.message)
            }
        })
}
const resetQuery=()=> {
  data.queryParams = {
    pageNum: 1,
    pageSize: 10,
    bigClassify: null,
    smallClassify: null,
    dutyStatus: null,
    name: '',
    params: {
      startTime: '',
      endTime: ''
    }
  };
  data.classiFy = []
  data.searchTime = []
  handleQuery()
}

</script>