<template>
  <el-tabs v-loading="loading" style="padding:10px">
    <el-tab-pane :label="title">
      <correction-form v-if="mode === 'create'" />

      <el-collapse v-else v-model="activeNames">
        <el-collapse-item title="业务经理修正申请详情" name="1">
          <correction-detail :detail="detail" />
        </el-collapse-item>
        <el-collapse-item name="2" title="待审核" v-if="String(detail.status) === '1' && powers.includes('043')">
          <wait-approval @confirm="handleConfirm" />
        </el-collapse-item>
      </el-collapse>
    </el-tab-pane>
  </el-tabs>
</template>

<script>
import CorrectionForm from './components/correctionForm.vue'
import CorrectionDetail from './components/correctionDetail.vue'
import asyncRequest from '@/apis/service/dataCorrection/managerCorrection'
import WaitApproval from './components/waitApproval.vue'
export default {
  name: '',
  components: {
    CorrectionDetail,
    CorrectionForm,
    WaitApproval
  },
  data() {
    return {
      detail: null,
      loading: false,
      activeNames: ['1', '2']
    }
  },
  computed: {
    mode() {
      return this.$route.query.mode || 'create'
    },
    title() {
      const mapTitle = {
        update: '业务经理修正申请详情',
        create: '新建业务经理修正申请'
      }
      return mapTitle[this.mode]
    },
    powers() {
      const { btnList } = this.$store.getters;
      const tran =
        btnList.find(i => i.menu_route == "managerCorrectionDetail") || {};
      const { action } = tran ?? {};
      return action ?? [];
    }
  },
  mounted() {
    if (this.mode === 'create') return
    this.initData()
  },
  methods: {
    async handleConfirm(data) {
      this.loading = true
      const res = await asyncRequest.status({
        id: this.$route.query.id,
        ...data
      })
      this.loading = false

      if (res && res.code === 0 && res.data) {
        this.initData()
      } else if (res && res.code >= 100 && res.code <= 104) {
        await this.logout()
      } else {
        this.$message.warning(res.message)
      }
    },
    async initData() {
      this.loading = true
      const res = await asyncRequest.detail({ id: this.$route.query.id })
      this.loading = false

      if (res && res.code === 0 && res.data) {
        this.detail = res.data
      } else if (res && res.code >= 100 && res.code <= 104) {
        await this.logout()
      } else {
        this.$message.warning(res.message)
      }
    }
  }
}
</script>
