<template>
  <div>
    <!-- 执行顺序 -->
    <Alert class="equip_alert">
      <div>
        <table class="tableClass">
          <tbody>
            <tr>
              <th colspan="4" style="text-align: center;font-size: 15px">
                改进/纠正/预防措施
              </th>
            </tr>
            <tr>
              <th>问题</th>
              <td>{{obj.problemDisplay?obj.problemDisplay:''}}</td>
              <th>纠正/预防措施</th>
              <td>{{obj.measuresDisplay?obj.measuresDisplay:''}}</td>
            </tr>
            <tr>
              <th>截止日期</th>
              <td>{{obj.closingDate?$dateformat(obj.closingDate,'yyyy-mm-dd'):''}}</td>
              <th>编制人</th>
              <td>{{obj.compactor?obj.compactor:''}}</td>
            </tr>
            <tr>
              <th>编制日期</th>
              <td>{{obj.compilateDate?$dateformat(obj.compilateDate,'yyyy-mm-dd'):''}}</td>
              <th>负责人</th>
              <td>{{obj.charger?obj.charger:''}}</td>
            </tr>
            <tr>
              <th>检查人</th>
              <td>{{obj.checker?obj.checker:''}}</td>
              <th>备注</th>
              <td>{{obj.remark?obj.remark:''}}</td>
            </tr>
            <tr>
              <th>登记人</th>
              <td>{{obj.operator?obj.operator:''}}</td>
              <th>登记日期</th>
              <td>{{obj.ctime?$dateformat(obj.ctime,'yyyy-mm-dd'):''}}</td>
            </tr>
          </tbody>
        </table>
      </div>
      <Form v-show="obj.lmsFrameFileList!=''" :label-width="90" inline style="margin-top:10px;margin-left: -50px">
        <Form-item label="附件" style="width: 98.6%;">
          <div v-for="item in obj.lmsFrameFileList" :key="item" class="file-upload-list">
            <div>
              <div class="file-upload-list-cover">
                <Icon type="ios-eye-outline" @click.native="_handleView(item)" />
                <Icon type="ios-cloud-download-outline" @click.native="_downloadFile(item)" />
              </div>
            </div>
            {{ item.fileName }}
          </div>
        </Form-item>
      </Form>
      <Modal title="查看图片" v-model="visible" footer-hide>
        <img :src="objectKey" v-if="visible" style="width: 100%">
      </Modal>
      <Form inline :label-width="80">
        <FormItem label="审批意见：" style="width:70%;margin-top: 10px">
          <Input name="reason" placeholder="请输入审批意见..." size="large" value="同意" />
        </FormItem>
        <div align="left" style="margin-top: 12px;display: inline-block;">
          <Button type="success" style="margin-left: 15px" @click="_approve('pass','确定通过？')">
            同意
          </Button>
          <Button style="margin-left: 15px" type="error" @click="_approve('back','确定驳回？')">
            驳回
          </Button>
        </div>
      </Form>
    </Alert>
  </div>
</template>
<script>
import global from '../../../api/config'
import { ProblemApprove } from '../../../api'
export default {
  components: {},
  data() {
    return {
      obj: {},
      id: {},
      showModal: false,
      visible: false,
      objectKey: ''
    }
  },
  mounted() {
    this.id = this.$route.query.id
    this._problemApprove()
  },
  methods: {
    _problemApprove: async function() {
      const obj = await ProblemApprove.getById(this.id)
      if (obj) {
        this.obj = obj
      }
      if (obj.lmsFrameFileList) {
        this.obj.lmsFrameFileList = obj.lmsFrameFileList
      } else {
        this.obj.lmsFrameFileList = []
      }
    },
    _approve(status, content) {
      this.$Modal.confirm({
        title: '提示',
        content: content,
        onOk: () => {
          const data = {}
          data.taskId = $('#flowFrame', parent.document).attr('data-tid')
          data.status = status
          data.reason = $('input[name="reason"]').val()
          this._approveOk(data)
        }
      })
    },
    _approveOk: async function(data) {
      const result = await ProblemApprove.approve(data)
      if (result) {
        this.$Message.success('审批成功！')
        setTimeout(() => {
          parent.location.replace(global.webURL + '/sys/workflow/flow_task')
        }, 200)
      }
    },
    _handleView(data) {
      this.objectKey = data.objectKey
      if (
        this.objectKey.indexOf('jpg') > -1 ||
        this.objectKey.indexOf('png') > -1 ||
        this.objectKey.indexOf('jpeg') > -1
      ) {
        this.visible = true
      } else {
        this.$message.warning({
          content: '非图片文件无法查看，请下载查看',
          duration: 3
        })
        this.visible = false
      }
    },
    _downloadFile(file) {
      // 下载文件
      this.$Modal.confirm({
        title: '提示',
        content: '确定要下载？',
        onOk: () => {
          const url =
            global.baseURL +
            '/res/v1/frame_problem_improve/downLoadFile?id=' +
            file.id
          window.open(url)
        }
      })
    },
    _cancel() {
      this.showModal = false
    }
  }
}
</script>
