<template>
  <div>
    <!--    项目审批-->
    <el-dialog v-model="showDialog" title="审核" width="500px">
      <div class="flex flex-justify-start flex-col">
        <div class="full-width flex flex-justify-start flex-align-center mb-20">
          <span>审核状态：</span>
          <el-radio-group v-model="approvalStatus">
            <el-radio :label="3">通过</el-radio>
            <el-radio :label="4">不通过</el-radio>
          </el-radio-group>
        </div>
        <el-input
          class="mt-20"
          type="textarea"
          :rows="5"
          v-model="approvalMsg"
          placeholder="请填写审核意见"
        />
        <div class="full-width flex flex-justify-end mt-20">
          <el-button plain type="primary" @click="showDialog = false"
            >取消
          </el-button>
          <el-button type="primary" @click="projectApproval">确定</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  props: {
    projectId: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      showDialog: false,
      approvalMsg: '',
      approvalStatus: 3
    }
  },
  methods: {
    show() {
      this.showDialog = true
    },
    /**
     * 管理员审批项目
     * approvalStatus === 4 审核不通过，需要填写原因
     */
    projectApproval() {
      if (this.approvalStatus === 4 && this.approvalMsg.length === 0) {
        this.$message.error('请填写审核意见')
        return
      }
      this.showDialog = false
      this.$api.project
        .approvalProject({
          id: this.projectId,
          reportType: this.approvalStatus,
          receiptMsg: this.approvalMsg
        })
        .then(res => {
          if (res.code === 200) {
            this.$message.success(res.msg)
            this.approvalStatus = 3
            this.approvalMsg = ''
            this.$emit('success')
          } else {
            this.$message.error(res.msg)
          }
        })
    }
  }
}
</script>

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