drp-ui/src/views/business/ehr/pm/awaitMarkPm/detail.vue

<template>
  <div>
    <el-card v-if="flow.staff == this.$store.state.user.name">
      <div slot="header" class="clearfix">
        <span style="font-weight:bold">绩效评分</span>
        <div style="float: right; padding: 3px 0" type="text">
          <el-button size="mini" plain @click="btnBack">返回</el-button>
          <el-button size="mini" plain @click="btnTurnDown(1)" v-if="flow.status == 0">驳回</el-button>
          <el-button size="mini" type="primary" plain @click="btnverify" v-if="flow.status == 0">提交</el-button>
        </div>
      </div>
      <div v-loading="loading">
        <el-form size="mini" ref="dataForm" :model="form" :rules="rules">
          <el-descriptions :column="6 ">
            <el-descriptions-item label="员工编号">{{form.staff}}</el-descriptions-item>
            <el-descriptions-item label="员工姓名">{{form.staffName}}</el-descriptions-item>
            <el-descriptions-item label="入职日期">{{form.dateJoin}}</el-descriptions-item>
            <el-descriptions-item label="转正日期">{{form.probationComplete}}</el-descriptions-item>
            <el-descriptions-item label="部门" span="2">{{form.deptName}}</el-descriptions-item>
            <el-descriptions-item label="职位">{{form.jobName}}</el-descriptions-item>
            <el-descriptions-item label="评估周期">{{form.name}}</el-descriptions-item>
            <el-descriptions-item label="评估人">{{form.evaluatorName}}</el-descriptions-item>
            <el-descriptions-item label="所属分组">
              <div v-for="dict in dict.type.ehr_pm_group" v-if="form.staffDivide == dict.value">
                <div>{{ dict.label }}</div>
              </div>
            </el-descriptions-item>
          </el-descriptions>
          <el-descriptions :column="6 ">
            <el-descriptions-item label="自评分" v-if="form.status > 3">{{form.saMark}}</el-descriptions-item>
          </el-descriptions>
          <el-descriptions v-if="form.status > 3">
            <el-descriptions-item label="个人总结">{{form.summary}}</el-descriptions-item>
          </el-descriptions>
          <el-descriptions v-if="form.status > 4">
            <el-descriptions-item label="评语">{{form.comment}}</el-descriptions-item>
          </el-descriptions>
          <div v-if="flow.status == 0">
            <el-form-item label="评语" prop="comment">
              <el-input type="textarea" v-model="form.comment"></el-input>
            </el-form-item>
          </div>
          <!-- <div style="float:right">
            <el-button size="mini" @click="btnUnfold">{{isUnfold == true ? "收起" : "展开"}}</el-button>
          </div> -->
          <el-table size="mini"  :data="form.performanceItem" show-summary :summary-method="getSummaries" border>
            <el-table-column type="index" width="50" label="序号"/>
            <el-table-column width="100" :show-overflow-tooltip="!isUnfold" label="评估方面" align="center" prop="aspect">
              <template slot-scope="scope">
                <dict-tag :options="dict.type.ehr_pm_aspect" :value="scope.row.aspect"/>
              </template>
            </el-table-column>
            <el-table-column width="100" :show-overflow-tooltip="!isUnfold" label="评估指标" align="center" prop="target" />
            <el-table-column width="80" label="权重" align="center" prop="weight"/>
            <el-table-column :show-overflow-tooltip="!isUnfold" label="指标说明" align="center" prop="instructions">
              <template slot-scope="scope">
                <div style="white-space: pre-wrap;text-align: left">{{scope.row.instructions}}</div>
              </template>
            </el-table-column>
            <!-- <el-table-column width="100" label="角色" align="center" prop="role">
              <template slot-scope="scope">
                <dict-tag :options="dict.type.ehr_pm_role" :value="scope.row.role"/>
              </template>
            </el-table-column> -->
            <el-table-column :show-overflow-tooltip="!isUnfold" label="评分标准" align="center" prop="standard">
              <template slot-scope="scope">
                <div style="white-space: pre-wrap;text-align: left">{{scope.row.standard}}</div>
              </template>
            </el-table-column>
            <el-table-column width="100" label="数据来源" align="center" prop="source" />
            <el-table-column width="80" label="自评分" align="center" prop="selfScoring"/>
            <el-table-column :show-overflow-tooltip="!isUnfold" label="自评语" align="center" prop="selfComment"/>
            <el-table-column width="80" label="上级评分" align="center" prop="leaderScoring" v-if="flow.status != 0"/>
            <el-table-column :show-overflow-tooltip="!isUnfold" label="上级评语" align="center" prop="leaderComment" v-if="flow.status != 0"/>
            <el-table-column width="85" label="上级评分" align="center" prop="leaderScoring" :render-header="addRedStar" v-if="flow.status == 0">
              <template slot-scope="scope">
                <el-form-item :prop="'performanceItem.'+scope.$index+'.leaderScoring'" :rules="{required: true,message: ' ',trigger: 'blur'}">
                  <el-input  v-model="scope.row.leaderScoring" v-only-number="{max:saMarkMax,min:0,precision:1}" size="mini"/>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column :show-overflow-tooltip="!isUnfold" label="上级评语" align="center" prop="leaderComment" :render-header="addRedStar" v-if="flow.status == 0">
              <template slot-scope="scope">
                <el-form-item :prop="'performanceItem.'+scope.$index+'.leaderComment'" :rules="{required: true,message: ' ',trigger: 'blur'}">
                  <el-input size="mini" type="textarea" v-model="scope.row.leaderComment"/>
                </el-form-item>
              </template>
            </el-table-column>
          </el-table>
        </el-form>
      </div>
    </el-card>

    <el-dialog title="" :visible.sync="turnDownOpen" width="1000px" :close-on-click-modal="false" :show-close="false">
      <el-form size="mini" label-position="right" ref="flow" :model="flow" :rules="flowRules" label-width="80px">
        <el-form-item label="驳回原因" prop="result">
          <el-input type="textarea" v-model="flow.result"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="btnTurnDownClose">取 消</el-button>
        <el-button size="mini" type="primary" @click="btnTurnDownConfirm">确 定</el-button>
      </span>
    </el-dialog>

  </div>
</template>

<script>
import { getPerformance} from "@/api/business/ehr/pm/performance";
import { getFlow} from "@/api/business/ehr/pm/flow";
import { savePerformance,superiorevaluation} from "@/api/business/ehr/pm/pmmark";

export default {
  name: "AwaitMarkPmDetail",
  dicts: ['ehr_pm_aspect','ehr_pm_role','ehr_pm_group'],
  data() {
    return {
      //遮罩层
      loading: true,
      //表单
      form:{},
      //流程数据
      flow:{},
      //提交规则
      rules:{
        comment: [
          { required: true, message: " ", trigger: "blur" },
        ],
      },
      //流程数据规则
      flowRules:{
        result: [
          { required: true, message: "驳回原因不能为空", trigger: "blur" },
        ],
      },
      //是否展开
      isUnfold:false,
      //是否显驳回弹出层
      turnDownOpen:false,
    };
  },
  computed: {
    //自评分最大值
    saMarkMax: function () {
      return this.form.staffDivide == 'C1' ? 150 : 100
    }
	},
  created() {
    console.log("this.$route.query",this.$route.query);
    this.fetchPerformance(this.$route.query.performanceId);
    this.fetchFlow(this.$route.query.flowId);
  },
  methods: {
    //查询详情
    async fetchPerformance(id){
      this.loading = true;
      await getPerformance(id).then(res => {
        if (res.code === 200) {
          this.form = res.data;
          this.id = res.data.id;
         }
         this.loading = false;
      })
    },
    //查询流程详情
    async fetchFlow(id){
      this.loading = true;
      await getFlow(id).then(res => {
        if (res.code === 200) {
          this.flow = res.data;
         }
         this.loading = false;
      })
    },
    //展开/收起
    btnUnfold(){
      this.isUnfold = !this.isUnfold;
    },
    //合计
    getSummaries(param){
      const { columns, data } = param;
      let ldMark = 0;
      if(this.form.ldMark){
        ldMark = this.form.ldMark;
      }else{
        ldMark = data.reduce((sum, e) => sum + Number(e.leaderScoring || 0) * (Number(e.weight || 0) / 100), 0);
        ldMark = ldMark.toFixed(1);
      }
      return ['合计','','',this.form.weight,'','','',this.form.saMark,'',ldMark];
    },
    //驳回
    btnTurnDown(){
      this.turnDownOpen = true;
    },
    //驳回取消
    btnTurnDownClose(){
      this.turnDownOpen = false;
    },
    //驳回确认
    async btnTurnDownConfirm(){
      this.$refs["flow"].validate(async valid => {
        if (valid) {
          //保存绩效数据
          savePerformance(this.form);
          this.loading = true;
          this.turnDownOpen = false;
          this.flow.status = 1;
          //保存流程数据
          await superiorevaluation(this.flow).then(res => {
            if (res.code === 200) {
              this.fetchPerformance(this.$route.query.performanceId);
              this.fetchFlow(this.$route.query.flowId);
              this.$modal.msgSuccess("已确认");
            }
            this.loading = false;
          })
        }
      });
    },
    //评写完成
    async btnverify(){
      this.$refs["dataForm"].validate(async (valid, obj) => {
        if (valid) {
          //保存绩效数据
          savePerformance(this.form);
          this.loading = true;
          this.flow.status = 2;
          this.flow.result = "已评分";
          //保存流程数据
          await superiorevaluation(this.flow).then(res => {
            if (res.code === 200) {
              this.fetchPerformance(this.$route.query.performanceId);
              this.fetchFlow(this.$route.query.flowId);
              this.$modal.msgSuccess("已确认");
            }
            this.loading = false;
          })
        } else {
          this.$modal.msgWarning("评分或评语不能为空！");
          return false;
        }
      });
    },
    //返回
    btnBack(){
      this.$router.back();
    },
    //必选标识
    addRedStar(h, { column }) {
      return [
        h('span', { style: 'color: #F56C6C' }, '*'),
        h('span', ' ' + column.label)
      ];
    },
  }
};
</script>

<style lang="scss" scoped>
</style>