<template>
  <ChooseFile @upload="fileUpload" v-if="mode === 'upload'" />

  <ExcelOperate v-else-if="mode === 'edit'" />
</template>

<script lang="ts" setup>
import { ref, reactive, onMounted, onUnmounted } from 'vue'
import { useRoute } from 'vue-router'
import { getOrderFileById } from '@/api/order'

import ExcelOperate from './components/ExcelOperate/ExcelOperate.vue'
import ChooseFile from './components/ChooseFile/ChooseFile.vue'
import { useExcelStore } from '@/stores/excel'

const { setFileInfo, resetState } = useExcelStore()
const route = useRoute()
const mode = ref('')

const fileUpload = (info: any) => {
  setFileInfo(info)
  mode.value = 'edit'
}

onMounted(async () => {
  if (route.query?.fileId) {
    // 获取文件信息及客户信息
    const { data } = await getOrderFileById(route.query.fileId as string)
    setFileInfo(data.result)
    mode.value = 'edit'
  } else {
    mode.value = 'upload'
  }
})

onUnmounted(() => {
  resetState()
})
</script>
<style lang="scss" scoped></style>
