<template>
  <div class="app-container">
    <el-button type="primary" @click="toExamine">批量审核</el-button>
    <el-button @click="onRevoke">撤销审核</el-button>
    <el-switch
      v-model="status"
      style="margin-left: 20px;"
      :active-value="1"
      :inactive-value="0"
      inactive-text="是否自动质控" @change="updateQualityControl">
    </el-switch>
    <el-table :row-class-name="tableRowClassName" v-loading="loading" :data="data" style="width: 100%" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55"></el-table-column>
      <el-table-column type="index" label="序号" width="80" />
      <el-table-column prop="" label="审核状态" width="100" show-overflow-tooltip>
        <template slot-scope="scope">
          <span v-if="scope.row.review == 1" style="color: orange;">撤销审核中</span>
          <span v-if="scope.row.review == 2" style="color: darkgreen;">审核通过</span>
          <span v-if="scope.row.review == 3" style="color: red;">审核未通过</span>
          <span v-if="scope.row.review == 0" >未审核</span>
        </template>
      </el-table-column>
      <el-table-column prop="sum_minus_points" label="病历得分" width="80" show-overflow-tooltip />
      <el-table-column prop="home_minus_points" label="首页得分" width="80" show-overflow-tooltip />
      <el-table-column prop="BLZT" label="病历状态" width="100" show-overflow-tooltip />
      <el-table-column prop="" label="住院号码" width="100" show-overflow-tooltip>
        <template slot-scope="scope">
          <el-button type="text" @click="toPage(scope.row)">{{ scope.row.AAA28 }}</el-button>
        </template>
      </el-table-column>
      <el-table-column prop="AAA01" label="姓名" width="100" show-overflow-tooltip />
      <el-table-column prop="CH" label="床号" width="100" show-overflow-tooltip />
      <el-table-column prop="AAA29" label="住院次数" width="100" show-overflow-tooltip />
      <el-table-column prop="dep_name" label="接收科室" width="140" show-overflow-tooltip />
      <el-table-column prop="JSR" label="接收人" width="140" show-overflow-tooltip />
      <el-table-column prop="AAB01" label="入院时间" width="140" show-overflow-tooltip />
      <el-table-column prop="AAC01" label="出院时间" width="140" show-overflow-tooltip />
      <el-table-column prop="ZKY" label="质控员" width="100" show-overflow-tooltip />
      <el-table-column prop="ZGQR" label="整改日期" width="140" show-overflow-tooltip />
      <el-table-column prop="ZKKS" label="质控科室" width="140" show-overflow-tooltip />
    </el-table>
    <el-dialog title="撤销审核申请" width="50%" :visible.sync="dialogVisible">
      <el-form ref="alertForm" :model="alertForm" label-width="120px" :rules="rules">
        <el-form-item label="撤销审核原因" prop="reason">
          <el-input v-model="alertForm.reason" type="textarea" placeholder="原因" />
        </el-form-item>
        <el-form-item>
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="addSubmit">确 定</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import { applyForReview, getBlZkList, updateQualityControl } from '@/api/qc';
export default {
  props: {
    data: {
      type: Array,
      default() {
        return [];
      },
      multipleSelection: [],
    },
    loading: {
      type: Boolean,
      default() {
        return false;
      },
    },
    status: {
      type: Number,
      default() {
        return false;
      },
    },
  },
  data() {
    return {
      dialogVisible: false,
      alertForm: {
        reason: "",
      },
      rules: {
        reason: [
          { required: true, message: '请填写撤销审核原因', trigger: 'blur' }
        ],
      },
    }
  },
  beforeDestroy() {
    localStorage.removeItem('getData');
  },
  methods: {
    tableRowClassName({row}) {
      console.log('>>>>><<<<<<<', row)
      if (row.selected) {
        return 'selected-row'
      }
      return ''
    },
    toPage(row) {
      const { ZYH } = row;
      localStorage.setItem('getData', ZYH);
      this.$router.push({ path: '/qc/caseViews' });
    },

    /**
     * 选中
     * @param val
     */
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },

    /**
     * 更新开关状态
     */
    updateQualityControl() {
      updateQualityControl({status: this.status}).then(res => {
        this.$message.success(res.msg || '更新成功');
      }).catch(error => {
        console.log(error);
      })
    },

    /**
     * 批量审核
     */
    toExamine() {
      var ZYH = this.multipleSelection.map(row => row['ZYH']);
      applyForReview({ ZYH: ZYH, status: 2 } ).then(res => {
        this.$message.success(res.msg || '申请成功');
        this.$parent.getList();
      }).catch(error => {
        console.log(error);
      })
    },

    /**
     * 撤销审核
     */
    onRevoke() {
      this.dialogVisible = true;
    },

    /**
     * 提交撤销审核原因
     */
    addSubmit() {
      var ZYH = this.multipleSelection.map(row => row['ZYH']);
      if (this.alertForm.reason === '') {
        this.$message.error('请填写撤销审核原因！');
        return false;
      }
      applyForReview({ ZYH: ZYH, status: 0, reason: this.alertForm.reason } ).then(res => {
        this.$message.success(res.msg || '撤销成功');
        this.dialogVisible = false;
        this.$parent.getList();
      }).catch(error => {
        console.log(error);
      })
    }
  },
};
</script>

<style lang="scss" scoped>
::v-deep.el-table {
  .selected-row {
    background-color:#ecf5ff !important;
  }
}
</style>
