马宇豪
2024-11-26 81eb726dec221cce6e0be422a69c01916ac13bf0
src/views/safetyReview/expertManage/postEvaluation/components/evaluate.vue
@@ -2,121 +2,289 @@
    <div class="notice">
        <el-dialog
            v-model="dialogVisible"
            :title="title"
            width="900px"
        :title="state.title"
        width="50%"
            :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 :model="state.info" inline size="default" ref="busRef" label-width="140px">
        <el-form-item label="姓名:">
          <el-input v-model.trim="state.info.name" 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 label="身份证号:">
          <el-input v-model.trim="state.info.idCard" 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 label="项目名称:">
          <el-input v-model.trim="state.info.projectName" 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 label="是否为专家组组长:">
          <el-input v-model.trim="state.info.teamLeader" 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 label="考评记录时间:">
          <el-input v-model.trim="state.info.evaluateTime" 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 label="总计:">
          <el-input v-model.trim="state.info.score" readonly></el-input>
              </el-form-item>
            </el-form>
            <div>
              请对专家表现进行评分:
            </div>
            <div style="width: 100%;display: flex;align-items: center;justify-content: space-between">
              <el-button type="primary" size="default" v-preReClick>添加加分项</el-button>
      <div style="width: 100%;display: flex;align-items: center;justify-content: space-between;margin: 25px 0 15px">
              <div>
                加分总计:52 分
          <el-button type="primary" size="default" @click="openSelectList('1')" v-preReClick>添加加分项</el-button>
          <el-button type="default" size="default" @click="addSelect('1')" v-preReClick>自定义加分项</el-button>
        </div>
        <div style="font-size: 14px">
          加分总计:<span style="font-weight: bolder;color: #10B981">{{addTotal}}</span> 分
              </div>
            </div>
            <el-table :data="tableData" border style="width: 100%">
            <el-table-column prop="name" label="加分项"/>
            <el-table-column prop="score" label="分值" />
      <el-table :data="state.addData" border style="width: 100%">
        <el-table-column prop="content" label="加分项"/>
        <el-table-column prop="score" label="分值">
          <template #default="scope">
            <el-input v-model.trim="scope.row.score" type="number"></el-input>
          </template>
        </el-table-column>
        <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>-->
            <el-button link type="danger"  @click="deleteSelect(scope.row,scope.$index,1)" >删除</el-button>
          </template>
        </el-table-column>
            </el-table>
            <div style="width: 100%;display: flex;align-items: center;justify-content: space-between">
              <el-button type="primary" size="default" v-preReClick>添加扣分项</el-button>
      <div style="width: 100%;display: flex;align-items: center;justify-content: space-between;margin: 25px 0 15px">
              <div>
                扣分总计:52 分
          <el-button type="primary" size="default" @click="openSelectList('2')" v-preReClick>添加扣分项</el-button>
          <el-button type="default" size="default" @click="addSelect('2')" v-preReClick>自定义扣分项</el-button>
        </div>
        <div style="font-size: 14px">
          扣分总计:<span style="font-weight: bolder;color: #EF4444">{{deductTotal}}</span> 分
              </div>
            </div>
            <el-table :data="tableData" border style="width: 100%">
              <el-table-column prop="name" label="扣分项"/>
              <el-table-column prop="score" label="分值" />
      <el-table :data="state.deductData" border style="width: 100%">
        <el-table-column prop="content" label="扣分项"/>
        <el-table-column prop="score" label="分值">
          <template #default="scope">
            <el-input v-model.trim="scope.row.score" type="number"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" >
          <template #default="scope">
            <el-button link type="danger"  @click="deleteSelect(scope.row,scope.$index,2)" >删除</el-button>
          </template>
        </el-table-column>
            </el-table>
      <div style="margin: 25px 0;font-size: 14px;display: flex;justify-content: right">
        本项目考评总计:<span style="font-weight: bolder;color: #2563EB">{{totalScore}}</span> 分
      </div>
      <div>提示:如果该专家在本项目无加分项,也无扣分项,直接点击“完成评分” 即可,不做任何分数更改。</div>
            <template #footer>
                    <span class="dialog-footer">
                        <el-button type="primary" @click="handleClose" size="default" v-preReClick>确认</el-button>
            <el-button type="primary" @click="confirmScore" size="default" v-preReClick>完成评分</el-button>
                    </span>
            </template>
      <select-list ref="selectRef"  @refreshSelected="getSelected"></select-list>
      <el-dialog
          v-model="state.addVisible"
          :title="state.addTitle"
          width="500px"
          :before-close="closeAdd"
      >
        <el-form :model="state.addForm" size="default" ref="addRef" :rules="state.addFormRules" label-width="110px" >
          <el-form-item label="内容:" prop="content">
            <el-input v-model.trim="state.addForm.content" type="textarea" :autosize="{minRows: 2}"></el-input>
          </el-form-item>
          <el-form-item label="分值:" prop="score">
            <el-input v-model.trim.number="state.addForm.score" type="number" placeholder="扣分请填写负数"></el-input>
          </el-form-item>
        </el-form>
        <template #footer>
          <span class="dialog-footer">
            <el-button @click="closeAdd" size="default">取 消</el-button>
            <el-button type="primary"  @click="submitAdd" size="default" v-preReClick>确认</el-button>
          </span>
        </template>
      </el-dialog>
        </el-dialog>
    </div>
</template>
<script setup>
import {reactive, ref, toRefs} from 'vue'
import Editor from "@/components/Editor/index.vue";
import {computed, defineAsyncComponent, reactive, ref, toRefs} from 'vue'
import {ElMessage} from "element-plus";
import {addNotice} from "@/api/backManage/notice";
import {addDict, editDict, getDictDetail} from "@/api/backManage/evaluate";
import SelectList from './selectList'
import {getExpertEvaDetail, projectExpertDetailSave} from '@/api/backManage/evaluate'
const dialogVisible = ref(false);
const title = ref("");
const busRef = ref();
const length = ref()
const dialogVisible = ref(false)
const busRef = ref()
const addRef = ref()
const selectRef = ref()
const emit = defineEmits(["getList"]);
const state = reactive({
  title: '',
  addData: [],
  deductData: [],
  info: {
    name: '',
    idCard: '',
    projectName: '',
    teamLeader: '',
    evaluateTime: '',
    score: ''
  },
    form: {
        id: '',
        label: '',
        value: '',
        dictType: "sys_assess_type",
    projectExpertId: null,
    saveData: [],
    delData: [],
    score: null
    },
    formRules:{
        label: [{ required: true, message: '请输入类型', trigger: 'blur' }],
  addVisible: false,
  addTitle: '',
  addForm: {
    scoreType: '',
    score: null,
    content: ''
    },
  addFormRules: {
    content: [{required: true, message: '请输入内容', trigger: 'blur'}],
    score: [{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
const addTotal = computed(()=>{
  return state.addData.map(i=>Number(i.score)).reduce((sum, num) => sum + num, 0)
})
const deductTotal = computed(()=>{
  return state.deductData.map(i=>Number(i.score)).reduce((sum, num) => sum + num, 0)
})
const totalScore = computed(()=>{
  return Number(addTotal.value) + Number(deductTotal.value)
})
const openDialog = async (value, projectName, projectCheckTime) => {
  state.info = value
  state.form.projectExpertId = value.id
  state.info.projectName = projectName
  state.info.evaluateTime = projectCheckTime
  state.info.teamLeader = state.info.teamLeader == 1 ? '是' : '否'
  if (value.evaluationState === 1) {
    state.title = '继续评分'
    const res = await getExpertEvaDetail({projectExpertId: value.id});
    if(res.code == 200){
      state.addData = res.data.filter(i=>i.scoreType == '1')
      state.deductData = res.data.filter(i=>i.scoreType == '2')
        }else{
            ElMessage.warning(res.message)
      ElMessage.warning(res.msg)
        }
    console.log(state.addData,'add')
  }else{
    state.title = '评分'
    }
    dialogVisible.value = true;
}
const openSelectList = (type) => {
  if(type == '1'){
    selectRef.value.openDialog(type, state.addData)
  }else{
    selectRef.value.openDialog(type, state.deductData)
  }
}
const getSelected = (type)=>{
  if(type == '1'){
    state.addData = state.addData.concat(selectRef.value.data.selected.map(({ id, ...rest }) => rest))
  }else{
    state.deductData = state.deductData.concat(selectRef.value.data.selected.map(({ id, ...item }) => ({
      ...item,
      score: item.score <0 ? item.score : -Math.abs(item.score)
    })))
  }
}
const deleteSelect=(row,index,type)=>{
  if(type == 1){
    state.addData.splice(index,1)
  }else{
    state.deductData.splice(index,1)
  }
  if(row.id){
    state.form.delData.push(row.id)
  }
}
const addSelect = (type) =>{
  state.addVisible = true
  if(type == '1'){
    state.addTitle = '自定义加分项'
    state.addForm.scoreType = '1'
  }else{
    state.addTitle = '自定义扣分项'
    state.addForm.scoreType = '2'
  }
}
const handleClose = () => {
    busRef.value.clearValidate();
    reset();
    dialogVisible.value = false;
  state.info = {
    name: '',
    idCard: '',
    projectName: '',
    teamLeader: '',
    evaluateTime: '',
    score: ''
}
const reset = () => {
    state.form = {
        id: '',
        label: '',
        value: '',
        dictType: "sys_assess_type",
    projectExpertId: null,
    saveData: [],
    delData: [],
    score: null
  }
  state.addData = []
  state.deductData = []
  dialogVisible.value = false;
}
const submitAdd = async ()=>{
  const valid = await addRef.value.validate();
  if(valid){
    if(state.addTitle == '自定义加分项'){
      state.addData.push(state.addForm)
    }else{
      state.deductData.push(state.addForm)
    }
    await closeAdd()
    }
}
const closeAdd = ()=>{
  state.addVisible = false
  state.addForm = {
    scoreType: '',
    score: null,
    content: ''
  }
}
const confirmScore = async ()=>{
  state.form.saveData = [...state.addData,...state.deductData]
  state.form.delData = state.form.delData.filter((id) => !state.form.saveData.some((item) => item.id === id))
  console.log(state.form,'form')
  state.form.score = totalScore.value
  const res = await projectExpertDetailSave(state.form)
  if(res.code == 200){
    ElMessage.success(res.msg)
    await handleClose()
    emit('getList')
  }else{
    ElMessage.warning(res.msg)
  }
}
defineExpose({
    openDialog
});
})
</script>
@@ -125,6 +293,7 @@
    :deep(.el-form .el-form-item__label) {
        font-size: 15px;
    }
    .file {
        display: flex;
        flex-direction: column;