<template>
  <el-dialog
    :title="!this.taskForm.taskId == '' ? $t('处理') : $t('详情')"
    :close-on-click-modal="false"
    :visible.sync="visible"
    :append-to-body="true">
    <el-form :model="taskForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="" label-width="80px">
      <el-form-item :label="$t('申请开票')">
        <el-table :data="devList" border style="width: 100%;">
          <el-table-column label="作业单位" align="center" prop="workUnit" :formatter="workUnitFormat"/>
          <el-table-column label="作业区域" align="center" prop="workArea" :formatter="workAreaFormat"/>
          <el-table-column label="单元号" align="center" prop="unitNumber" :formatter="unitNumberFormat"/>
          <el-table-column label="楼层位置" align="center" prop="floorLocation" :formatter="floorLocationFormat"/>
          <el-table-column label=" 作业开始时间" align="center" prop="workStartTime" width="100">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.workStartTime, '{y}-{m}-{d}') }}</span>
            </template>
          </el-table-column>
          <el-table-column label="作业结束时间" align="center" prop="workEndTime" width="100">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.workEndTime, '{y}-{m}-{d}') }}</span>
            </template>
          </el-table-column>
          <el-table-column label="联系人" align="center" prop="contact" :show-overflow-tooltip="true"/>
          <el-table-column label="联系方式" align="center" prop="phonenumber" :show-overflow-tooltip="true"/>
          <el-table-column label="状态" align="center" prop="status" width="100" :formatter="statusFormat"/>
        </el-table>
      </el-form-item>
      <el-form-item :label="$t('申请时间')" prop="creattime">
        <el-input v-model="dataForm.creattime" disabled></el-input>
      </el-form-item>
    </el-form>
    <form ref="downloadForm" :action="downloadAction" target="FORMSUBMIT">
      <input name="approveId" v-model="dataForm.id"  hidden  />
      <input name="processId" v-model="dataForm.processId"  hidden  />
    </form>
    <span slot="footer" class="dialog-footer">
      <el-button v-if="this.taskForm.taskId == ''" @click="visible = false">{{$t('message.return')}}</el-button>
      <el-button v-if="!this.taskForm.taskId == ''" type="primary" @click="dataFormSubmit(1)" :disabled="submitDisabled">{{$t('通过')}}</el-button>
      <el-button v-if="!this.taskForm.taskId == ''" type="danger" @click="dataFormSubmit(0)" :disabled="submitDisabled">{{$t('拒绝')}}</el-button>
    </span>
    <div>
      <span>{{$t('流转详情')}}</span>
      <el-table :data="historyList" border v-loading="historyLoading" style="width: 100%;">
        <el-table-column prop="taskName" header-align="center" align="center" :label="$t('流程进度')"></el-table-column>
        <el-table-column prop="userName" header-align="center" align="center" :label="$t('姓名')"></el-table-column>
        <el-table-column prop="taskCreateTime" header-align="center" align="center" :label="$t('开始时间')"></el-table-column>
        <el-table-column prop="taskEndTime" header-align="center" align="center" :label="$t('结束时间')"></el-table-column>
        <el-table-column prop="comment" header-align="center" align="center" :label="$t('审批意见')"></el-table-column>
      </el-table>
    </div>
    <record v-if="recordVisible" ref="recordDeal"></record>
  </el-dialog>
</template>

<script>
  import {getToken} from "@/utils/auth";
  import {getHistorylist} from "@/api/ehs/approvedanger";
  import record from "./spec-itemDetail";
  import {getInvoice, listInvoice} from "@/api/invoice/invoice";

export default {
  name: "invoice-detail",
  components: {record},
  data() {
    return {
      loading: true,
      // 总条数
      total: 0,
      approvedangerList: [],
      // 状态字典
      statusOptions: [],
      // 作业单位字典
      workUnitOptions: [],
      // 作业区域字典
      workAreaOptions: [],
      // 单元号字典
      unitNumberOptions: [],
      // 楼层字典
      floorLocationOptions: [],
      // 用户单位字典
      userUnitOptions: [],
      // 用户主管字典
      userMgOptions: [],
      // 作业类型字典
      workTypeOptions: [],
      // 风险等级字典
      riskLevelOptions: [],
      // 监护人单位字典
      guardianUnitOptions: [],
      recordVisible: false,
      // 遮罩层
      historyLoading: false,
      //显示详细列表
      IfDataIndex: false,
      //流转列表
      historyList: [],
      visible: false,
      devList: [],
      recordList: [],
      dataList: [],
      fileTips: '',
      showDelay: false,
      submitDisabled: false,
      dataListLoading:true,
      taskName: '',
      dataForm: {
        id: 0,
        userId: '',
        devId: '',
        devType: '',
        approveType: '',
        content: '',
        fileUrls: '',
        reUrls: '',
        status: '',
        creattime: '',
        plantCode: '',
        unit: '',
        devname: '',
        devno: '',
        files: [],
        delayDate: '',
        delayReason: '',
        delayMeasure: '',
        delayNotice: ''
      },
      taskForm: {
        comment: '',
        taskId: '',
        files: '',
        govDate: '',
        govFileList: []
      },
      // 查询参数
      queryParams: {
        processId: null,
      },
      doc: {
        file: "",
        // 是否显示弹出层（报告附件）
        open: false,
        // 弹出层标题（报告附件）
        title: "",
        // 是否禁用上传
        isUploading: false,
        // 是否更新已经存在的用户数据
        updateSupport: 0,
        // 报告附件上传位置编号
        ids: 0,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + "/sems/specfile/uploadFile",
        commonfileList: null,
        pType: 'traning',
        pId: null
      },
      dataRule: {
        approveType: [
          { required: true, message: this.$t('approveType') + this.$t('notEmpty'), trigger: 'blur' }
        ],
        content: [
          { required: true, message: this.$t('content') + this.$t('notEmpty'), trigger: 'blur' }
        ]
      },
      downloadAction: process.env.VUE_APP_BASE_API +'/sems/approve/exportPDF',
      approveOption: [],
      belong: '',
      fileList: [],
    };
  },
  watch: {
    // 根据名称筛选部门树
    deptName(val) {
      this.$refs.tree.filter(val);
    }
  },
  created() {

  },
  methods: {
    // 状态字典翻译
    statusFormat(row, column) {
      return this.selectDictLabel(this.statusOptions, row.status);
    },
    // 字典翻译
    workUnitFormat(row, column) {
      return this.selectDictLabel(this.workUnitOptions, row.workUnit);
    },
    // 字典翻译
    workAreaFormat(row, column) {
      return this.selectDictLabel(this.workAreaOptions, row.workArea);
    },
    // 字典翻译
    unitNumberFormat(row, column) {
      return this.selectDictLabel(this.unitNumberOptions, row.unitNumber);
    },
    // 字典翻译
    floorLocationFormat(row, column) {
      return this.selectDictLabel(this.floorLocationOptions, row.floorLocation);
    },
    // 字典翻译
    userMgFormat(row, column) {
      return this.selectDictLabel(this.userMgOptions, row.userMg);
    },
    // 字典翻译
    userUnitFormat(row, column) {
      return this.selectDictLabel(this.userUnitOptions, row.userUnit);
    },
    // 字典翻译
    workTypeFormat(row, column) {
      return this.selectDictLabel(this.workTypeOptions, row.workType);
    },
    // 字典翻译
    riskLevelFormat(row, column) {
      return this.selectDictLabel(this.riskLevelOptions, row.riskLevel);
    },
    // 字典翻译
    guardianUnitFormat(row, column) {
      return this.selectDictLabel(this.guardianUnitOptions, row.guardianUnit);
    },
    init (id, taskId, processId,taskName) {
      console.log(id)
      console.log("idididid")
      this.reset();
      this.fileList = [];
      this.getDicts("booking_work_status").then(response => {
        this.statusOptions = response.data;
      });
      this.getDicts("book_work_area").then(response => {
        this.workAreaOptions = response.data;
      });
      this.getDicts("book_unit_number").then(response => {
        this.unitNumberOptions = response.data;
      });
      this.getDicts("book_floor_location").then(response => {
        this.floorLocationOptions = response.data;
      });
      this.getDicts("book_user_mg").then(response => {
        this.userMgOptions = response.data;
      });
      this.getDicts("book_user_unit").then(response => {
        this.userUnitOptions = response.data;
      });
      this.getDicts("book_work_unit").then(response => {
        this.workUnitOptions = response.data;
      });
      this.getDicts("book_work_type").then(response => {
        this.workTypeOptions = response.data;
      });
      this.getDicts("book_risk_level").then(response => {
        this.riskLevelOptions = response.data;
      });
      this.getDicts("book_guardian_unit").then(response => {
        this.guardianUnitOptions = response.data;
      });
      this.dataForm.processId = processId
      this.taskName = taskName
      this.taskForm.taskId = taskId
      this.dataForm.id = id || 0
      this.visible = true
      this.queryParams.processId = processId;
      getHistorylist(this.queryParams).then(response => {
        console.log(response.rows)
        this.historyList = response.rows;
        this.historyLoading = false
      });
      getInvoice(id).then(response => {
        console.log(response)
        this.taskForm.businessKey = response.data.id
        this.dataForm.userId = response.data.userId
        this.dataForm.devId = response.data.devId
        this.dataForm.devType = response.data.devType
        // this.dataForm.approveType = response.data.approveType
        this.dataForm.approveType = '维修'
        this.dataForm.content = response.data.content
        this.dataForm.fileUrls = response.data.fileUrls
        this.dataForm.reUrls = response.data.reUrls
        this.dataForm.status = response.data.status
        this.dataForm.creattime = response.data.creattime
        this.dataForm.plantCode = response.data.plantCode
        this.dataForm.unit = response.data.unit
        this.dataForm.devname = response.data.devname
        this.dataForm.devno = response.data.devno
        this.dataForm.files = response.data.files
        this.devList = response.data.devList
        this.dataForm.delayDate = response.data.delayDate
        this.dataForm.delayReason = response.data.delayReason
        this.dataForm.delayMeasure = response.data.delayMeasure
        this.dataForm.delayNotice = <response className="data delayNotice"></response>
      });

    },
    // 设备类型：字典翻译
    devTypeFormat(row, column) {
      // return this.selectDictLabel(this.devTypeOptions, row.devType);
    },
    // 审批类型字典翻译
    approveTypeFormat(row, column) {
      return this.selectDictLabel(this.approveTypeOptions, row.approveType);
    },

    // 取消按钮
    cancel() {
      this.visible = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        userId: null,
        devId: null,
        devType: null,
        approveType: null,
        content: null,
        fileUrls: null,
        reUrls: null,
        status: 0,
        creattime: null,
        enddate: null,
        processId: null,
        govDate: null,
        delayDate: null,
        delayReason: null,
        delayMeasure: null,
        delayNotice: null,
        apNo: null,
        checkDate: null,
        reportId: null,
        monthId: null,
        delFlag: null,
        deptId: null
      };
      this.resetForm("form");
    },

    /** 提交按钮 */
    // 表单提交
    dataFormSubmit (val) {
      this.submitDisabled = true
      console.log(this.taskForm.govFileList)
      this.dataForm.files = []
      if (this.taskForm.govFileList.length > 0) {
        for (let i = 0; i < this.taskForm.govFileList.length; i++) {
          let obj = {}
          obj.fileName = this.taskForm.govFileList[i].response.fileName
          obj.fileUrl = this.taskForm.govFileList[i].response.url
          this.dataForm.files.push(obj)
        }
      }
      this.taskForm.condition = val
      this.taskForm.govFiles = this.dataForm.files
      handleApprove(this.taskForm).then(response => {
        this.submitDisabled = false
        this.msgSuccess(this.$t('处理成功'));
        this.visible = false;
        this.$emit('refreshDataList')
      });
      this.$nextTick(function () {
        this.comment = ''
      })
    },
    recordHandle(devList,dataForm){
      this.recordVisible = true
      this.$nextTick(() => {
        this.$refs.recordDeal.init(devList,dataForm);
      })
    },
}
}


</script>
