<template>

  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    switchFullscreen
    :okButtonProps="{ class:{'jee-hidden': true} }"
    @cancel="handleCancel"
    cancelText="关闭">

    <a-spin :spinning="confirmLoading">
      <a-descriptions :title="model.taskName" :column="3" :bordered="true" size="small">
        <a-descriptions-item label="任务状态"><a-tag :color="model.taskStateColor">{{model.taskStateText}}</a-tag></a-descriptions-item>
        <a-descriptions-item label="开始时间">{{model.taskStartTime}}</a-descriptions-item>
        <a-descriptions-item label="结束时间">{{model.taskEndTime}}</a-descriptions-item>
        <a-descriptions-item label="客户总数" :span="3">{{model.customerCount}}</a-descriptions-item>
        <a-descriptions-item label="描述"><span v-html="model.description"></span></a-descriptions-item>
<!--        <a-descriptions-item label="待稽核数">{{model.checkCount}}</a-descriptions-item>-->
      </a-descriptions>
    </a-spin>

  </j-modal>

</template>

<script>

export default {
  name: 'TaskDetail',
  data () {
    return {
      description: '详情页面',
      title: '详情页面',
      width: 960,
      visible: false,
      disableSubmit: false,
      model:{
      },
      confirmLoading: false,
    }
  },
  methods: {
    handleCancel () {
      this.visible = false;
    },
    detail (record) {
      this.model = Object.assign({}, record);
      this.getTaskState(this.model.taskState);
      this.visible = true;
    },
    getTaskState(taskState) {
      if (taskState === 0) {
        this.model.taskStateColor = '#fadb14';
        this.model.taskStateText = '未开始';
      } else if (taskState === 1) {
        this.model.taskStateColor = '#1890ff';
        this.model.taskStateText = '稽核中';
      } else if (taskState === 2) {
        this.model.taskStateColor = '#52c41a';
        this.model.taskStateText = '稽核完成';
      }
    },
  }
}
</script>

<style scoped>

</style>