<template>
  <view>
    <Navbar title="审批详情" />
    <div class="content">
      <Title title="施工材料文件" />
      <Preview :dataList="materialFile" />
      <Title title="审批意见" />
      <u--textarea v-model="approvalOpinion" placeholder="请输入内容" count height="105" :disabled="isDetail" @blur="filter" />
      <Title title="审批记录" />
      <Steps :data="approvalRecordList" />
      <TabbarBtn
        v-if="!isDetail"
        :showBtn="opt.finalCheck != 0 ? true : false"
        @reject="reject"
        @handlePermit="handlePermit"
        @handleEnd="handleEnd"
      />
    </div>
  </view>
</template>

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

export default {
  components: { Steps, TabbarBtn },
  data() {
    return {
      opt: {},
      isLoading: false,
      isDetail: false,
      // 施工材料文件
      materialFile: [],
      // 审批意见
      approvalOpinion: '',
      // 审批记录
      approvalRecordList: []
    }
  },
  onLoad(opt) {
    this.opt = JSON.parse(opt.params)
    console.log('🚀 ~ onLoad ~ this.opt:', this.opt)
    this.isDetail = this.opt.isDetail
  },
  mounted() {
    this.getMaterialDetails()
    this.getApprovalRecord()
  },
  methods: {
    // 过滤输入框
    filter() {
      this.approvalOpinion = filterInput(this.approvalOpinion)
    },
    // 获取施工材料详情
    async getMaterialDetails() {
      const params = {
        uuid: this.opt.uuid
      }
      console.log('🚀 ~ getMaterialDetails ~ params:', params)
      const res = await getMaterialDetails(params)
      console.log('🚀 ~ 获取施工材料详情 ~ res:', res)
      if (res.code === 200) {
        this.materialFile = res.data.fileList
      }
    },
    // 驳回
    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.approvalOpinion,
        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.approvalOpinion,
        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.approvalOpinion,
        agree: '3'
      }
      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)
        })
    },
    // 获取审批记录
    async getApprovalRecord() {
      const params = {
        taskId: this.opt.taskId
      }
      // console.log('🚀 ~ 审批记录 ~ params:', params)
      const res = await approvalHistory(params)
      console.log('🚀 ~ 审批记录 ~ res:', res)
      if (res.code === 200) {
        this.approvalRecordList = res.data
      }
    }
  }
}
</script>

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