<template>
  <div class="app-container home">
    <el-form ref="form" :model="form" label-width="80px">
      <h3 style="color: #409EFF;background: #f6f6f6;padding: 15px;border-radius: 10px">工程出入场
        <el-button type="primary"
                   plain
                   :style="{marginTop:'-8px',float: 'right',marginRight:'10px;',fontSize:'18px'}"
                   @click="admissionRequest"
                   v-hasPermi="['system:entrance:apply']"
                   v-if="this.enterStatus === '草稿'"
        >入场申请
        </el-button>
        <el-button
          type="primary"
          plain
          :style="{marginTop:'-8px',float: 'right',marginRight:'10px;',fontSize:'18px'}"
          v-if="this.enterStatus === '已通过' && this.exitStatus === '草稿' && this.$store.state.user.userType === '02'"
          @click="appearance"
          v-hasPermi="['system:complete:btn']"
        >完工申请
        </el-button>
        <el-button
          type="primary"
          plain
          :style="{marginTop:'-8px',float: 'right',marginRight:'10px;',fontSize:'18px'}"
          @click="appearance"
          v-if="this.enterStatus === '已通过' && this.exitStatus === '草稿'&& this.$store.state.user.userType === '03'"
          v-hasPermi="['system:complete:btn']"
        >出场申请
        </el-button>
      </h3>

      <el-table :data="enterList" border style="width: 100%;text-align: center;margin-top: 10px;">
        <el-table-column prop="enterStatus" label="入场审批状态" align="center"></el-table-column>
        <el-table-column prop="turnDownReason" label="驳回原因" align="center"></el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="scope">
            <el-button type="text" size="small"
                       @click="lookEnter(scope.row)"
            >查看
            </el-button>
            <el-button type="text" size="small"
                       v-if="scope.row.enterStatus === '草稿' || scope.row.enterStatus === '已撤回' || scope.row.enterStatus === '已驳回' "
                       @click="editEnter(scope.row)"
            >编辑
            </el-button>
            <el-button type="text" size="small"
                       v-else-if="scope.row.enterStatus === '待审批'"
                       @click="revokeEnter(scope.row)"
            >撤回
            </el-button>
            <el-button type="text" size="small"
                       v-else-if="scope.row.enterStatus === '待提交'"
                       @click="submitApproval(scope.row,1)"
            >提交审核
            </el-button>
            <el-button
              size="mini"
              type="text"
              :style="{color:'#ff9040'}"
              @click="handleAuditRecord(scope.row)"
              v-hasPermi="['system:audit:query']"
            >审核记录
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <div v-if="this.$store.state.user.thisIds.intoStatus == '3'">
        <el-table :data="exitList" border style="width: 100%;text-align: center;margin-top: 10px"
                  v-if="this.$store.state.user.userType != '01'"
        >
          <el-table-column prop="exitStatus" :label="checkStatus(this.$store.state.user.userType)+`审批状态`" align="center"></el-table-column>
          <el-table-column prop="turnDownReason" label="驳回原因" align="center"></el-table-column>
          <el-table-column label="操作" align="center">
            <template slot-scope="scope">
              <el-button type="text" size="small"
                         @click="lookExit(scope.row)"
              >查看
              </el-button>
              <el-button type="text" size="small"
                         v-if="scope.row.exitStatus === '草稿' || scope.row.exitStatus === '已撤回' || scope.row.exitStatus === '已驳回' "
                         @click="editExit(scope.row)"
              >编辑
              </el-button>
              <el-button type="text" size="small"
                         v-else-if="scope.row.exitStatus === '待审批'" @click="revokeExit(scope.row)"
              >撤回
              </el-button>
              <el-button type="text" size="small"
                         v-else-if="scope.row.exitStatus === '待提交'"
                         @click="submitApproval(scope.row,2)"
              >提交审核
              </el-button>
              <el-button type="text" size="small" v-hasPermi="['system:audit:query']" :style="{color:'#ff9040'}"
                         @click="handleAuditRecord(scope.row)"
              >审核记录
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <h3 style="color: #409EFF;background: #f6f6f6;padding: 15px;border-radius: 10px">工程基础信息</h3>
      <el-row :gutter="gutter">
        <el-col :span="7">
          <el-form-item label="工程名称：" label-width="130px" prop="">
            <el-input v-model="form.proName" style="width: 300px" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="工程负责人：" label-width="130px" prop="">
            <el-input v-model="form.proLeader" style="width: 300px" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="负责人联系方式：" label-width="130px" prop="">
            <el-input v-model="form.proLeaderPhone" style="width: 300px" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="gutter">
        <el-col :span="7">
          <el-form-item label="工程类型：" label-width="130px" prop="">
            <el-input v-model="form.proType" style="width: 300px" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="计划开工日期：" label-width="130px" prop="">
            <el-input v-model="form.startDate" style="width: 300px" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="计划竣工日期：" label-width="130px" prop="">
            <el-input v-model="form.endDate" style="width: 300px" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="gutter">
        <el-col :span="7">
          <el-form-item label="监理单位：" label-width="130px" prop="">
            <el-input v-model="form.unitName" style="width: 300px" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="总监姓名：" label-width="130px" prop="">
            <el-input v-model="form.directorName" style="width: 300px" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="总监联系方式：" label-width="130px" prop="">
            <el-input v-model="form.directorPhone" style="width: 300px" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="gutter">
        <el-col :span="7">
          <el-form-item label="工程地址：" label-width="130px" prop="">
            <el-input v-model="form.address" style="width: 300px" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <div v-if="this.$store.state.user.userType != '01'">
        <h3 style="color: #409EFF;background: #f6f6f6;padding: 15px;border-radius: 10px">入场材料示例模板</h3>
        <div style="display: flex;flex-direction: row;flex-wrap: wrap;">
          <div v-for="(item, index) in materialList" class="icon-item-wrapper" :key="index" style="padding: 10px;display: flex;flex-direction: row;align-items: center">
            <span style="font-size: 18px">{{ index + 1 }}.</span>
            <div @click="downloadFile(item.value,'')" title="点击下载示例模板">
               {{ item.label }}
            </div>
          </div>
        </div>
      </div>
    </el-form>
  </div>
</template>

<script>
import { getAuditRecord, revokeEnter, getIndexBasicInfo, revokeExit } from '@/api/pro/approval_cons'
import { retractApproval } from '@/api/terminalEquipment/deviceInformation'
import { getParams, hideSensitiveInfo } from '@/utils/bonus'
import { getMaterialList, downloadFile } from '@/api/tool/select'
import { encryptCBC } from '@/utils/aescbc'
import { submitApproval } from '@/api/pro/admissionRequest'

export default {
  name: 'indexOther',
  props: {
    uuid: {
      type: String,
      default: ''
    }
  },
  watch: {
    '$props.uuid': function() {
      this.init()
    }
  },
  data() {
    return {
      gutter: 21,
      enterList: [],
      exitList: [],
      materialList: [],
      exitStatus: '',
      enterStatus: '',
      status: 0,
      form: {
        name: '',
        proName: '',
        proLeader: '',
        proLeaderPhone: '',
        proType: '',
        startDate: '',
        endDate: '',
        unitName: '',
        directorName: '',
        directorPhone: '',
        address: ''
      }
    }
  },
  created() {
    if (this.$store.state.user.userType !== '00') {
      this.init()
      if (this.$store.state.user.userType !== '01') {
        this.getMaterialList()
      }
    }
  },
  methods: {
    downloadFile,
    checkStatus(userType){
      return userType === '02' ? '完工' : '出场'
    },
    /**
     * 初始化数据  工程基础信息，工程出入场审核数据
     */
    init() {
      this.loading = true
      const params = {
        uuid: this.$props.uuid === '' ? this.$store.state.user.thisIds.uuid : this.$props.uuid,
        userType: this.$store.state.user.userType
      }
      this.getBasicInfo(params)
      this.getEnterAuditRecord(params)
      this.getExitAuditRecord(params)
      this.loading = false
    },
    getMaterialList() {
      getMaterialList({}).then(response => {
        this.materialList = response.data
      })
    },

    getBasicInfo(params) {
      getIndexBasicInfo(params).then(response => {
        this.form = {}
        this.form = response
        this.form.proLeaderPhone = hideSensitiveInfo(response.proLeaderPhone)
        if (this.form.directorPhone) {
          this.form.directorPhone = hideSensitiveInfo(response.directorPhone)
        }

        this.loading = false
      })
    },
    getEnterAuditRecord(params) {
      params.type = '入场'
      getAuditRecord(params).then(response => {
        this.enterList = []
        if (response.rows.length > 0) {
          this.enterList = response.rows
        } else {
          this.enterList.push({
            enterStatus: '草稿',
            turnDownReason: '无'
          })
        }
        this.enterStatus = this.enterList[0].enterStatus
      })
    },
    getExitAuditRecord(params) {
      params.type = '出场'
      getAuditRecord(params).then(response => {
        this.exitList = []
        if (response.rows.length > 0) {
          this.exitList = response.rows
        } else {
          this.exitList.push({
            exitStatus: '草稿',
            turnDownReason: ''
          })
        }
        this.exitStatus = this.exitList[0].exitStatus
      })
    },
    // 出场/完工申请页面跳转
    appearance() {
      let path
      if (this.$store.state.user.userType === '02') {
        path = '/pro/apply/consCompleteApply/'
      } else if (this.$store.state.user.userType === '03') {
        path = '/pro/apply/subAppearingApply/'
      }
      this.$router.push(path + encryptCBC(JSON.stringify({
        type: 'add'
      })))
    },
    // 入场申请页面跳转
    admissionRequest() {
      let path
      if (this.$store.state.user.userType === '01') {
        path = '/pro/apply/supervisorEnterApply/'
      } else {
        path = '/pro/apply/consEnterApply/'
      }
      this.$router.push(path + encryptCBC(JSON.stringify({
        type: 'add'
      })))
    },
    /**
     * 编辑入场申请
     * @param row
     */
    editEnter(row) {
      let path
      console.log("this.$store.state.user.userType="+this.$store.state.user.userType)
      console.log("row"+JSON.stringify(row))
      if (this.$store.state.user.userType === '01') {
        path = '/pro/apply/supervisorEnterApply/'
      } else {
        path = '/pro/apply/consEnterApply/'
      }
      this.$router.push(path + encryptCBC(JSON.stringify({
        type: 'edit', taskId: row.taskId,
      })))
    },
    /**
     * 撤回入场申请
     * @param row
     */
    revokeEnter(row) {
      let taskType
      let reasonForWithdrawal
      if (this.$store.state.user.userType === '02') {
        taskType = '2'
        reasonForWithdrawal = '撤回@@撤回@@撤回@@撤回@@撤回'
      } else if (this.$store.state.user.userType === '03') {
        taskType = '3'
        reasonForWithdrawal = '撤回@@撤回@@撤回@@撤回@@撤回'
      } else if (this.$store.state.user.userType === '01') {
        taskType = '1'
        reasonForWithdrawal = '撤回'
      }
      const params = {
        uuid: row.uuid,
        taskId: row.taskId,
        procInstId: row.procInsId,
        taskType: taskType,
        reasonForWithdrawal: reasonForWithdrawal
      }
      this.$modal.confirm('是否撤回当前入场申请的数据项？').then(function() {
        return retractApproval(params)
      }).then(() => {
        const param = {
          uuid: this.$store.state.user.thisIds.uuid,
          userType: this.$store.state.user.userType
        }
        this.getEnterAuditRecord(param)
        this.$modal.msgSuccess('撤回成功')
      }).catch(() => {
      })
    },
    /**
     * 查看入场申请
     * @param row
     */
    lookEnter(row) {
      let path
      if (this.$store.state.user.userType === '01') {
        path = '/pro/apply/supervisorEnterApply/'
      } else {
        path = '/pro/apply/consEnterApply/'
      }
      this.$router.push(path + encryptCBC(JSON.stringify({
        type: 'view', taskId: row.taskId
      })))
    },
    /**
     * 编辑出场申请
     * @param row
     */
    editExit(row) {
      let path
      if (this.$store.state.user.userType === '02') {
        path = '/pro/apply/consCompleteApply/'
      } else if (this.$store.state.user.userType === '03') {
        path = '/pro/apply/subAppearingApply/'
      }
      this.$router.push(path + encryptCBC(JSON.stringify({
        type: 'edit', taskId: row.taskId
      })))
    },
    /**
     * 撤回出场申请
     * @param row
     */
    revokeExit(row) {
      const params = {
        uuid: row.uuid,
        taskId: row.taskId,
        procInstId: row.procInsId,
        taskType: this.$store.state.user.userType === '02' ? '9' : '12'
      }
      let text = this.$store.state.user.userType === '02' ? '是否撤回当前完工申请的数据项？' : '是否撤回当前出场申请的数据项？'
      this.$modal.confirm(text).then(function() {
        return retractApproval(params)
      }).then(() => {
        const param = {
          uuid: this.$store.state.user.thisIds.uuid,
          userType: this.$store.state.user.userType
        }
        this.getExitAuditRecord(param)
        this.$modal.msgSuccess('撤回成功')
      }).catch(() => {
      })
    },
    /**
     * 查看出场申请
     * @param row
     */
    lookExit(row) {
      let path
      if (this.$store.state.user.userType === '02') {
        path = '/pro/apply/consCompleteApply/'
      } else if (this.$store.state.user.userType === '03') {
        path = '/pro/apply/subAppearingApply/'
      }
      this.$router.push(path + encryptCBC(JSON.stringify({
        type: 'view', taskId: row.taskId
      })))
    },
    /** 审核记录按钮操作 */
    handleAuditRecord(row) {
      this.$router.push('/flow/auditRecord/' + encryptCBC(JSON.stringify({
        taskId: row.taskId,
        taskType: '存在'
      })))
    },
    getParams,
    submitApproval(row, type) {
      let taskType;
      if (type === 1){
        this.$store.state.user.userType === '01' ? taskType = '1' : this.$store.state.user.userType === '02' ? taskType = '2' : taskType = '3'
      }else{
        this.$store.state.user.userType === '02' ? taskType = '9' : taskType = '12'
      }
      const param = {
        ...this.getParams(),
        taskType: taskType,
        taskId: row.taskId,
        uuid: row.uuid,
      }
      submitApproval(param).then(response => {
        console.log("response="+JSON.stringify(response))
        if (response.code === 200) {
          if (response.msg === '此审核类型未配置相对应的审核流，请联系管理员配置后再次提交'){
            this.$modal.msgError(response.msg)
          }else{
            this.$modal.msgSuccess('提交成功')
          }
          const params = {
            uuid: this.$props.uuid === '' ? this.$store.state.user.thisIds.uuid : this.$props.uuid,
            userType: this.$store.state.user.userType
          }
          this.getEnterAuditRecord(params)
          this.getExitAuditRecord(params)
        } else {
          this.$message.error(response.msg)
        }
      }).catch((error) =>{
        console.log("error="+JSON.stringify(error))
      })
    }
  }
}
</script>

<style scoped>
.icon-item-wrapper div {
  color: blue;
  cursor: pointer;
  font-size: 18px;

}

.icon-item-wrapper div:hover {
  color: #00afff;
  text-decoration: underline;
}
</style>

