<template>
  <div>
    <descriptions :column="3">
      <descriptions-item label="分部">{{detail.organName}}</descriptions-item>
      <descriptions-item label="工作周期">{{$helpers.dayjs(detail.month).format('YYYY-MM')}}</descriptions-item>
      <descriptions-item label="乐团主管">{{detail.userName}}</descriptions-item>
      <descriptions-item label="处理意见">{{detail.memo}}</descriptions-item>
    </descriptions>
    <el-table
      :data="detail.inspectionItems || []"
      style="width: 100%;margin-top: 20px;"
      max-height="500px"
      :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
    >
      <el-table-column
        label="任务事项"
        prop="item"
      >
        <template slot-scope="scope">{{matterTypes[scope.row.item]}}</template>
      </el-table-column>
      <el-table-column
        label="任务次数"
        prop="times"
      />
      <el-table-column
        label="实际安排"
        prop="plannedTimes"
      />
    </el-table>
    <div slot="footer" style="text-align: right;margin-top: 20px;">
      <el-button type="primary" @click="$emit('close')">确认</el-button>
    </div>
  </div>
</template>
<script>
import { inspectionGetInfo } from '@/views/main/api'
import { matterTypes } from '@/views/main/constant'
export default {
  props: ['id'],
  data() {
    return {
      matterTypes,
      detail: {},
    }
  },
  mounted() {
    this.FetchDetail()
  },
  methods: {
    async FetchDetail() {
      try {
        const res = await inspectionGetInfo({
          id: this.id
        })
        this.detail = res.data
      } catch (error) {}
    }
  }
}
</script>
