<template>
  <div>
    <Modal v-model="showDetailModal" title="仪器采购订单表详情" :width="1200">
      <div class="maxHeight">
        <table class="tableClass">
          <tbody>
            <tr>
              <th>申请单编号</th>
              <td>{{ obj.num }}</td>
              <th>状态</th>
              <td>{{ status }}</td>
            </tr>
            <tr>
              <th>申请时间</th>
              <td>{{ date.applyTime }}</td>
              <th>申请人</th>
              <td>{{ obj.applyName }}</td>
            </tr>
            <tr>
              <th>申请原因</th>
              <td colspan="3">
                {{ obj.applyReason }}
              </td>
            </tr>
          </tbody>
        </table>
        <!--主管审批意见(一，二级)-->
        <table class="tableClass">
          <tbody>
            <tr>
              <th>一级主管</th>
              <td>{{ obj.firstStepName }}</td>
              <th>一级主管意见</th>
              <td>{{ obj.firstStepAdvice }}</td>
              <th>一级主管签字时间</th>
              <td>{{ date.firstStepTime }}</td>
            </tr>
            <tr>
              <th>二级主管</th>
              <td>{{ obj.secondStepName }}</td>
              <th>二级主管意见</th>
              <td>{{ obj.secondStepAdvice }}</td>
              <th>二级主管签字时间</th>
              <td>{{ date.secondStepTime }}</td>
            </tr>
            <tr>
              <th>备注</th>
              <td colspan="5">
                {{ obj.remark }}
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <!--内容-->
      <Row>
        <!-- 表格 -->
        <Col span="24" style="margin-bottom: 10px;margin-top:10px" />
        <el-table
          :data="obj.lmsEquipPurchaseDetailVOList"
          stripe
          height="400"
          border
          size="small"
          style="width: 100%"
        >
          <el-table-column
            v-for="item in pageColumns"
            :key="item.key"
            show-overflow-tooltip
            sortable
            :prop="item.key"
            :label="item.title"
            :min-width="item.width"
            :fixed="item.fixed?item.fixed:undefined"
          />
        </el-table>
        </Col>
      </Row>
    </Modal>
  </div>
</template>
<script>
/**
 * 仪器采购订单表详情
 */
const dateFormat = require('dateformat')
export default {
  data() {
    return {
      obj: {},
      showDetailModal: false,
      status: '',
      pageColumns: [
        { title: '仪器名称', key: 'name', width: 130, fixed: 'left' },
        { title: '数量', key: 'counts', width: 100 },
        { title: '供应商名', key: 'supplierName', width: 160 },
        { title: '规格型号', key: 'spec', width: 160 },
        { title: '仪器单价', key: 'price', width: 160 },
        { title: '制造厂商', key: 'productPlace', width: 160 },
        { title: '相关标准', key: 'relatedStandards', width: 160 },
        { title: '备注', key: 'remark', width: 160 }
      ],
      date: {
        applyTime: '',
        firstStepTime: '',
        secondStepTime: '',
        registerTime: ''
      }
    }
  },
  methods: {
    _open(obj) {
      this.showDetailModal = true
      this.obj = obj
      if (obj.status === 0) {
        this.status = '草稿'
      } else if (obj.status === 1) {
        this.status = '待审批'
      } else if (obj.status === 2) {
        this.status = '审批通过'
      } else if (obj.status === 6) {
        this.status = '驳回'
      } else if (obj.status === 10) {
        this.status = '审批未通过'
      } else {
        this.status = ''
      }
      if (obj.applyTime !== undefined) {
        this.date.applyTime = dateFormat(obj.applyTime, 'yyyy-mm-dd')
      } else {
        this.date.applyTime = ''
      }
      if (obj.firstStepTime !== undefined) {
        this.date.firstStepTime = dateFormat(obj.firstStepTime, 'yyyy-mm-dd')
      } else {
        this.date.firstStepTime = ''
      }
      if (obj.secondStepTime !== undefined) {
        this.date.secondStepTime = dateFormat(obj.secondStepTime, 'yyyy-mm-dd')
      } else {
        this.date.secondStepTime = ''
      }
      if (obj.registerTime !== undefined) {
        this.date.registerTime = dateFormat(obj.registerTime, 'yyyy-mm-dd')
      } else {
        this.date.registerTime = ''
      }
    }
  }
}
</script>
