<template>
  <view>
    <Navbar title="审批详情" />
    <div class="content">
      <Title title="监理人员信息" />
      <TableTitle :tableTitleList="tableTitleList" />
      <u-list :height="dateList.length > 0 ? '200px' : '10px'">
        <u-list-item v-for="(item, index) in dateList" :key="index">
          <div class="list-wrapper">
            <div class="list-item">{{ item.name }}</div>
            <div class="list-item" style="width: 50%" />
            <div class="list-item item-see" @click="handleSee(item)">查看</div>
          </div>
        </u-list-item>
      </u-list>
      <u-divider v-if="dateList.length == 0" text="暂无数据"></u-divider>

      <Title title="企业资质" />
      <Preview :dataList="unitQualificationUrlList" />
      <Title title="安全协议书" />
      <Preview :dataList="securityAgreementUrlList" />
      <Title title="监理规划" />
      <Preview :dataList="supervisionPlanUrlList" />
      <Title title="实施细则" />
      <Preview :dataList="enforcementRegulationUrlList" />
      <Title title="审批意见" />
      <u--textarea
        v-model="textareaValue"
        placeholder="请输入内容"
        count
        height="105"
        :disabled="isDetail"
        @blur="filter"
      />
      <Title title="审批记录" />
      <Steps :data="ApprovalRecordList" />
      <tabbar-btn
        v-if="!isDetail"
        @reject="reject"
        @handlePermit="handlePermit"
        @handleEnd="handleEnd"
        :showBtn="opt.finalCheck != 0 ? true : false"
      />
    </div>
  </view>
</template>

<script>
import TableTitle from 'pages/component/TableTitle'
import Steps from 'pages/component/Steps'
import TabbarBtn from './component/TabbarBtn'
import { listSupervisorPerson, selectFile, approvalHistory, submitPersonApproval } from '@/api/project'
import { filterInput } from '@/utils/regular'

export default {
  components: { TableTitle, Steps, TabbarBtn },
  data() {
    return {
      isLoading: false,
      opt: {},
      isDetail: false,
      tableTitleList: [{ title: '姓名' }, { width: '50%' }, { title: '详情' }],
      dateList: [],
      // 单位资质
      unitQualificationUrlList: [],
      // 安全协议书
      securityAgreementUrlList: [],
      // 监理规划
      supervisionPlanUrlList: [],
      // 实施细则
      enforcementRegulationUrlList: [],
      textareaValue: '', // 审批意见
      // 审批记录
      ApprovalRecordList: []
    }
  },
  onLoad(options) {
    console.log('🚀 ~ onLoad ~ options:', options)
    this.opt = JSON.parse(options.params)
    this.isDetail = this.opt.isDetail
    console.log('🚀 ~ onLoad ~ this.opt:', this.opt)
  },
  mounted() {
    this.getSupervisorPersonList()
    this.getSecurityAgreement()
    this.getUnitQualification()
    this.getSupervisionPlan()
    this.getEnforcementRegulation()
    this.getApprovalRecord()
  },
  methods: {
    // 查看
    handleSee(item) {
      console.log('🚀 ~ handleSee ~ item:', item)
      uni.navigateTo({
        url: `/pages/projectInfo/supervisorPersonDetails?id=${item.id}&uuid=${item.uuid}`
      })
    },
    // 驳回
    reject(val) {
      console.log('驳回原因-->父元素:', val)
      const params = {
        proId: this.opt.proId,
        supId: this.opt.supId,
        supUuid: this.opt.supUuid,
        taskId: this.opt.taskId,
        procInstId: this.opt.procInsId,
        finalCheck: this.opt.finalCheck,
        reason: this.textareaValue,
        agree: '2',
        rejectReason: val
      }
      if (this.isLoading) {
        uni.showToast({
          title: '请勿重复提交',
          icon: 'none'
        })
        return
      }
      this.isLoading = true
      console.log('🚀 ~ reject ~ params:', params)
      submitPersonApproval(params)
        .then(res => {
          console.log('驳回', res)
          if (res.code === 200) {
            uni.showToast({
              title: '驳回成功',
              icon: 'none'
            })
            setTimeout(() => {
              uni.navigateBack()
              this.isLoading = false
            }, 800)
          }
        })
        .catch(err => {
          console.log('🚀 ~ err:', err)
          setTimeout(() => {
            uni.navigateBack()
            this.isLoading = false
          }, 300)
        })
    },
    // 通过
    handlePermit() {
      if (this.isLoading) {
        uni.showToast({
          title: '请勿重复提交',
          icon: 'none'
        })
        return
      }
      this.isLoading = true
      const params = {
        proId: this.opt.proId,
        supId: this.opt.supId,
        supUuid: this.opt.supUuid,
        taskId: this.opt.taskId,
        procInstId: this.opt.procInsId,
        finalCheck: this.opt.finalCheck,
        reason: this.textareaValue,
        agree: '1'
      }
      console.log('🚀 ~ handlePermit ~ params:', params)
      submitPersonApproval(params)
        .then(res => {
          console.log('通过', res)
          if (res.code === 200) {
            uni.showToast({
              title: '审批成功',
              icon: 'none'
            })
            setTimeout(() => {
              uni.navigateBack()
              this.isLoading = false
            }, 800)
          }
        })
        .catch(err => {
          console.log('🚀 ~ err:', err)
          setTimeout(() => {
            uni.navigateBack()
            this.isLoading = false
          }, 300)
        })
    },
    // 终审
    handleEnd() {
      if (this.isLoading) {
        uni.showToast({
          title: '请勿重复提交',
          icon: 'none'
        })
        return
      }
      this.isLoading = true
      const params = {
        proId: this.opt.proId,
        supId: this.opt.supId,
        supUuid: this.opt.supUuid,
        taskId: this.opt.taskId,
        procInstId: this.opt.procInsId,
        finalCheck: this.opt.finalCheck,
        reason: this.textareaValue,
        agree: '3'
      }
      console.log('🚀 ~ handleEnd ~ params:', params)
      submitPersonApproval(params)
        .then(res => {
          console.log('通过', res)
          if (res.code === 200) {
            uni.showToast({
              title: '终审成功',
              icon: 'none'
            })
            setTimeout(() => {
              uni.navigateBack()
              this.isLoading = false
            }, 800)
          }
        })
        .catch(err => {
          console.log('🚀 ~ err:', err)
          setTimeout(() => {
            uni.navigateBack()
            this.isLoading = false
          }, 300)
        })
    },
    // 获取监理人员列表
    async getSupervisorPersonList() {
      const params = {
        proId: this.opt.proId,
        supId: this.opt.supId,
        supUuid: this.opt.supUuid
      }
      console.log('🚀 ~ getSupervisorPersonList ~ params:', params)
      const res = await listSupervisorPerson(params)
      console.log('监理人员列表', res)
      if (res.code === 200) {
        this.dateList = res.rows
      }
    },
    // 获取单位资质
    getUnitQualification() {
      const params = {
        id: this.opt.proId,
        classification: '1',
        fromType: '1',
        informationType: '1'
      }
      console.log('🚀 ~ getEnterpriseQualification ~ params:', params)
      selectFile(params).then(res => {
        console.log('单位资质', res)
        if (res.data && res.data.length > 0) {
          this.unitQualificationUrlList = res.data
        } else {
          this.unitQualificationUrlList = []
        }
      })
    },
    // 获取安全协议书
    getSecurityAgreement() {
      const params = {
        id: this.opt.proId,
        classification: '1',
        fromType: '1',
        informationType: '2'
      }
      // console.log('🚀 ~ 安全协议书 ~ params:', params)
      selectFile(params).then(res => {
        console.log('安全协议书', res)
        if (res.data && res.data.length > 0) {
          this.securityAgreementUrlList = res.data
        }
      })
    },
    // 获取监理规划
    getSupervisionPlan() {
      const params = {
        id: this.opt.proId,
        classification: '1',
        fromType: '1',
        informationType: '9'
      }
      console.log('🚀 ~ getEnterpriseQualification ~ params:', params)
      selectFile(params).then(res => {
        console.log('监理规划', res)
        if (res.data && res.data.length > 0) {
          this.supervisionPlanUrlList = res.data
        } else {
          this.supervisionPlanUrlList = []
        }
      })
    },
    // 获取实施细则
    getEnforcementRegulation() {
      const params = {
        id: this.opt.proId,
        classification: '1',
        fromType: '1',
        informationType: '10'
      }
      console.log('🚀 ~ getEnterpriseQualification ~ params:', params)
      selectFile(params).then(res => {
        console.log('实施细则', res)
        if (res.data && res.data.length > 0) {
          this.enforcementRegulationUrlList = res.data
        } else {
          this.enforcementRegulationUrlList = []
        }
      })
    },
    // 获取审批记录
    async getApprovalRecord() {
      const params = {
        taskId: this.opt.taskId
      }
      console.log('🚀 ~ getApprovalRecord ~ params:', params)
      const res = await approvalHistory(params)
      console.log('审批记录', res)
      if (res.code === 200) {
        this.ApprovalRecordList = res.data
        console.log('🚀 ~ getApprovalRecord ~ this.ApprovalRecordList:', this.ApprovalRecordList)
      }
    },
    filter() {
      this.textareaValue = filterInput(this.textareaValue)
    }
  }
}
</script>

<style lang="scss">
.content {
  padding: 0 20px;

  .list-wrapper {
    display: flex;
    justify-content: space-around;
    align-items: center;
    .list-item {
      margin: 8px 0;
      width: 25%;
      font-weight: 400;
      font-size: 12px;
      color: #0f274b;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .item-width {
      width: 33%;
    }

    .item-see {
      color: #3888ff;
    }
  }

  .bottom-btn {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;

    .btn {
      width: 60px;
      margin-right: 10px;
      &:last-child {
        margin-right: 20px;
      }
    }
  }
}
/deep/ .u-modal__content {
  padding: 12px !important;
}
</style>
