msyj-admin-local/src/modules/grading/components/ModifyLeaderGrading.vue

<template>
  <Modal
    class="modify-leader-grading"
    v-model="modalIsShow"
    title="科组长评档"
    :mask-closable="false"
    @on-visible-change="visibleChange"
  >
    <div class="leader-grading">
      <div class="leader-level">
        <h3>{{ LevelInfo.selectedLevel }}</h3>
      </div>
      <RadioGroup v-model="actionType">
        <div class="leader-aciton" v-if="standardVolume">
          <Radio label="sampling">设为标准卷</Radio>
        </div>
        <div class="leader-aciton" v-if="oneClickLevel">
          <Radio label="leveling" :disabled="noneedLevelOrReject"
            >一键定档</Radio
          >
        </div>
        <div class="leader-aciton" v-if="levelCallback">
          <Radio label="reject" :disabled="noneedLevelOrReject"
            >建议档位打回</Radio
          >
        </div>
      </RadioGroup>
      <div class="leader-markers">
        <CheckboxGroup v-model="selectedMarkers">
          <Checkbox
            v-for="(marker, index) in markers"
            :key="index"
            :label="marker.id"
            >{{ marker.name }}</Checkbox
          >
        </CheckboxGroup>
      </div>
    </div>

    <div slot="footer">
      <Button type="text" @click="cancel">取消</Button>
      <Button type="primary" :disabled="isSubmit" @click="submit">确认</Button>
    </div>
  </Modal>
</template>

<script>
import { leaderGradingPaper } from "@/api";

export default {
  name: "modify-leader-grading",
  props: {
    LevelInfo: {
      type: Object,
      default() {
        return {
          curPaperId: "",
          curLevel: "",
          selectedLevel: ""
        };
      }
    },
    markers: {
      type: Array,
      default() {
        return [];
      }
    }
  },
  data() {
    return {
      modalIsShow: false,
      isSubmit: false,
      standardVolume: false,
      oneClickLevel: false,
      levelCallback: false,
      noneedLevelOrReject: false,
      actionType: null,
      selectedMarkers: []
    };
  },
  methods: {
    initData(val) {
      this.noneedLevelOrReject =
        this.LevelInfo.curLevel === this.LevelInfo.selectedLevel;
      const user = this.$ls.get("user");
      this.standardVolume = user.standardVolume;
      this.levelCallback = user.levelCallback;
      this.oneClickLevel = user.oneClickLevel;
    },
    visibleChange(visible) {
      if (visible) {
        this.initData(this.instance);
      }
    },
    cancel() {
      this.modalIsShow = false;
    },
    open() {
      this.modalIsShow = true;
    },
    async submit() {
      if (!this.actionType) {
        this.$Message.error("请选择操作类型！");
        return;
      }
      if (this.actionType === "reject" && !this.selectedMarkers.length) {
        this.$Message.error("请指定评卷员！");
        return;
      }
      const datas = {
        action: this.actionType,
        level: this.LevelInfo.selectedLevel
      };
      if (this.actionType === "reject")
        datas.range = this.selectedMarkers.join();

      if (this.isSubmit) return;
      this.isSubmit = true;
      let result = true;
      await leaderGradingPaper(this.LevelInfo.curPaperId, datas).catch(() => {
        result = false;
      });
      this.isSubmit = false;

      if (!result) return;

      this.$Message.success("操作成功！");
      this.$emit("modified", datas);
      this.cancel();
    }
  }
};
</script>