<template>
  <div class="component-business-info">
    <div class="business-info-mod">
      <!-- 店铺审核状态 -->
      <div class="audit-status">
        <!-- status 0 未审核 1已通过 -1未通过 2平台下线 3 平台下线待审核 -->
        <!-- supplierStatus 店铺状态(-1:已删除 0: 停业中 1:营业中 2:平台下线 3:待审核 4:店铺申请中 5.审核失败) -->
        <div
          v-if="shopAuditStatus"
          class="audit-item"
        >
          <span class="week">{{ $t('multishop.shopInformation.auditStatus') }}：</span>
          <span v-if="shopAuditStatus.status === -1">{{ $t('multishop.shopInformation.failed') }}</span>
          <span v-if="shopAuditStatus.status === 0">{{ $t('multishop.shopInformation.unreviewed') }}</span>
          <span v-if="shopAuditStatus.status === 1">{{ $t('multishop.shopInformation.passed') }}</span>
          <span v-if="shopAuditStatus.status === 2">{{ $t('multishop.shopInformation.onlinePendingReview') }}</span>
        </div>
        <div
          v-if="shopDetail"
          class="audit-item"
        >
          <span class="week">{{ $t('multishop.shopInformation.accountStatus') }}：</span>
          <span v-if="shopDetail.accountStatus === 0">{{ $t('multishop.shopInformation.disable') }}</span>
          <span v-if="shopDetail.accountStatus === 1">{{ $t('multishop.shopInformation.enable') }}</span>
          <span v-if="shopDetail.accountStatus === -1">{{ $t('multishop.shopInformation.delete') }}</span>
        </div>
        <div
          v-if="shopDetail"
          class="audit-item"
        >
          <span class="week">{{ $t('multishop.shopInformation.shopStatus') }}：</span>
          <span v-if="shopDetail.supplierStatus === -1">{{ $t('multishop.shopInformation.deleted') }}</span>
          <span v-if="shopDetail.supplierStatus === 0">{{ $t('multishop.shopInformation.closed') }}</span>
          <span v-if="shopDetail.supplierStatus === 1">{{ $t('multishop.shopInformation.inOperation') }}</span>
          <span v-if="shopDetail.supplierStatus === 2">{{ $t('multishop.shopInformation.onlinePendingReview') }}</span>
          <span v-if="shopDetail.supplierStatus === 3">{{ $t('multishop.shopInformation.storeOpenPendingReview') }}</span>
          <span v-if="shopDetail.supplierStatus === 4">{{ $t('multishop.shopInformation.shopApplication') }}</span>
          <span v-if="shopDetail.supplierStatus === 5">{{ $t('multishop.shopInformation.onlineReviewed') }}</span>
          <span v-if="shopDetail.supplierStatus === 6">上线审核失败</span>
        </div>
        <el-button
          v-if="shopDetail.supplierStatus === 2 && paySettlementType!==1"
          v-permission="['shop:shopDetail:applyOnline']"
          type="primary"
          @click="offlineManageHandle"
        >
          {{ $t('multishop.shopInformation.applyOnline') }}
        </el-button>
      </div>
      <el-form
        ref="formDataRef"
        v-loading="pageLoading"
        label-width="140px"
        :model="formData"
        @submit.prevent
      >
        <div class="ci-wrapper">
          <div class="left-wrap">
            <el-form-item
              :label="$t('multishop.shopInformation.supplierName') + ':'"
              required
            >
              {{ formData.supplierName }}
            </el-form-item>
            <el-form-item
              :label="$t('multishop.shopInformation.contactName') + ':'"
              required
            >
              {{ formData.contactName }}
            </el-form-item>
            <el-form-item
              :label="$t('multishop.shopInformation.contactPhone') + ':'"
              required
            >
              {{ formData.contactPhone }}
            </el-form-item>
            <el-form-item :label="$t('multishop.shopInformation.intro') + ':'">
              <span v-if="formData.intro"> {{ formData.intro }} </span>
              <span
                v-else
                class="noyet-wrap"
              >{{ $t('multishop.shopInformation.noYet') }}</span>
            </el-form-item>
          </div>
        </div>
      </el-form>
    </div>

    <div class="footer">
      <div class="foot-box">
        <el-button
          v-permission="['shop:shopDetail:save']"
          type="primary"
          @click="modifyBasicInfor"
        >
          {{ $t('multishop.shopInformation.modification') }}
        </el-button>
      </div>
    </div>
    <!-- 下架管理 -->
    <offline-manage
      v-if="offlineManageVisible"
      ref="offlineDataRef"
      @rereapply-data-submit="reReapplyDataSubmit"
    />
  </div>
</template>

<script setup>
import * as api from '@/api/multishop/shop-process.js'
import * as eventApi from '@/api/multishop/shop-event.js'
import { ElMessage } from 'element-plus'

const emit = defineEmits(['closeBrowse', 'businessClose'])

const offlineManageVisible = ref(false)

const allinPayStore = useAllinpayStore()
const paySettlementType = allinPayStore.paySettlementType // 是否开启通联支付 1：开启 0：关闭

onMounted(() => {
  queryShopAuditStatus()
  queryShopBasicInfo()
})

// 修改
const modifyBasicInfor = () => {
  emit('closeBrowse')
}

const pageLoading = ref(false)
const formData = ref({}) // 基本信息
/**
 * 查询基本信息
 */
const queryShopBasicInfo = () => {
  pageLoading.value = true
  api.getBasicInfo().then(data => {
    if (data.type) data.type = data.type.toString()
    data && (formData.value = data)
    if (paySettlementType === 1) {
      allinPayStore.companyInfoProcessStatus = data.companyInfoProcessStatus
      allinPayStore.idCardCollectProcessStatus = data.idCardCollectProcessStatus
      allinPayStore.supplierStatus = data.supplierStatus
      if ((data.companyInfoProcessStatus === 0 || data.companyInfoProcessStatus === 3)) {
        // 企业信息审核状态为未提交或者审核失败则请求工商审核信息
        api.getCompanyInfo().then(data => {
          if (data.newStatus !== 0) {
            // 最新审核状态不为待审核，则工商信息页修改为编辑状态
            emit('businessClose')
          }
        })
      }
    }
  }).finally(() => {
    pageLoading.value = false
  })
}

const shopAuditStatus = ref({})
const shopDetail = ref({})
/**
 * 店铺审核状态
 */
const queryShopAuditStatus = () => {
  api.getAuditingInfo().then(data => {
    shopAuditStatus.value = data
    shopDetail.value = data.supplierDetail
  })
}
/**
 * 店铺违规下线操作
 */
const offlineManageHandle = () => {
  offlineManageVisible.value = true
  getOfflineDetailInfo()
}
/**
 * 获取最新的店铺违规下线事件信息
 */
const offlineDataRef = ref(null)
const getOfflineDetailInfo = () => {
  eventApi.getOfflineHandleEvent().then(data => {
    nextTick(() => {
      offlineDataRef.value?.init(data)
    })
  })
}

let isSubmit = false
/**
 * 提交上线申请
 */
const reReapplyDataSubmit = (data) => {
  const param = {
    eventId: data.eventId,
    reapplyReason: data.reapplyReason // 申请理由
  }
  if (isSubmit) {
    return
  }
  isSubmit = true
  eventApi.auditApply(param).then(() => {
    offlineManageVisible.value = false
    ElMessage({
      message: $t('table.actionSuccess'),
      type: 'success',
      duration: 1000,
      onClose: () => queryShopAuditStatus()
    })
    isSubmit = false
  }).catch(() => {
    isSubmit = false
  })
}
</script>

<style scoped lang="scss">
@use "index";
</style>
