添加订单转换导入导出功能

src/api/order.ts

@@ -123,3 +123,24 @@ export const convertOrderReSend = (id: any) => {
     headers: formHeader
   })
 }
+
+/** 导入 */
+export const excelFileOrderImportExcel = (params: any) => {
+  return axios.get('/api/excelFileOrder/importExcel', {
+    params,
+    headers: formHeader
+  })
+}
+
+/** 导出 */
+export const excelFileOrderExportExcel = (excelOrderId: any) => {
+  return axios.post(
+    '/api/excelFileOrder/exportExcel',
+    {},
+    {
+      params: { excelOrderId },
+      headers: formHeader,
+      responseType: 'blob'
+    }
+  )
+}

src/views/comment-excel/components/SetDataAreaTitle/SetDataAreaTitle.vue

@@ -84,7 +84,7 @@ const setNumFlag = () => {
 
     if (!cell) return
     Reflect.set(cell, 'numFlag', 'Y')
-    // !cell.numTitle && Reflect.set(cell, 'numTitle', '尺码')
+    !cell.numTitle && Reflect.set(cell, 'numTitle', '尺码')
   }
 }
 

src/views/order/orderChange/OrderChange.vue

@@ -23,6 +23,7 @@
       <vxe-toolbar>
         <template #buttons>
           <el-button type="danger" @click="removeRows">删除</el-button>
+          <el-button type="primary" @click="importVisible = true">导入</el-button>
         </template>
       </vxe-toolbar>
       <vxe-table
@@ -44,7 +45,7 @@
         </vxe-column>
         <vxe-column field="status_dictText" title="订单状态" width="120"></vxe-column>
         <vxe-column field="createTime" title="创建时间" width="180"></vxe-column>
-        <vxe-column field="action" title="操作" width="120">
+        <vxe-column field="action" title="操作" width="140">
           <template #default="{ row }">
             <el-link style="font-size: 12px" type="primary" @click="toDetail(row)">查看</el-link>
             <el-link
@@ -63,6 +64,9 @@
               @click="confirmOrderStatus(row)"
               >确认</el-link
             >
+            <el-link class="ml-1" style="font-size: 12px" type="primary" @click="exportTmp(row)"
+              >导出</el-link
+            >
           </template>
         </vxe-column>
       </vxe-table>
@@ -152,11 +156,53 @@
       >
     </template>
   </vxe-modal>
+
+  <vxe-modal
+    v-model="importVisible"
+    title="导入"
+    width="500px"
+    show-footer
+    @hide="imporModalHide"
+  >
+    <el-form ref="importFormInstance" :model="importForm" :rules="importRules">
+      <el-form-item label="客户名称" prop="customerId">
+        <!-- <el-input v-model="importForm.customerName"></el-input> -->
+        <el-input v-model="importForm.customerName" disabled>
+          <template #append>
+            <el-button :icon="MoreFilled" @click="visible = true" />
+          </template>
+        </el-input>
+      </el-form-item>
+      <el-form-item label="文件" prop="filePath">
+        <el-upload
+          action=""
+          ref="upload"
+          accept=".xlsx,.xls"
+          :on-remove="handleRemove"
+          :auto-upload="false"
+          :on-exceed="handleExceed"
+          :limit="1"
+          :on-change="changeUpload"
+        >
+          <el-button type="primary">上传文件</el-button>
+          <template #tip>
+            <div class="el-upload__tip">选择你要上传的excel文件，仅支持xlsx、xls格式</div>
+          </template>
+        </el-upload>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button @click="importVisible = false">取消</el-button>
+      <el-button type="primary" @click="submitImport">确认</el-button>
+    </template>
+  </vxe-modal>
+
+  <CustomerModal v-model:visible="visible" @confirm="confirmCustomer" />
 </template>
 
 <script lang="ts" setup>
-import { onMounted, reactive, ref, watch } from 'vue'
-import { Setting } from '@element-plus/icons-vue'
+import { onMounted, reactive, ref, watch, nextTick } from 'vue'
+import { Setting, MoreFilled } from '@element-plus/icons-vue'
 import { cloneDeep } from 'lodash-es'
 import {
   confirmExcelFileOrderById,
@@ -165,9 +211,17 @@ import {
   getExcelFileOrderPage,
   unconvertExcelFileOrder,
   getConfByExcelOrderId,
-  saveConfExcelFileOrderPage
+  saveConfExcelFileOrderPage,
+  excelFileOrderExportExcel,
+  excelFileOrderImportExcel
 } from '@/api/order'
-import { ElMessage, ElMessageBox } from 'element-plus'
+import {
+  ElMessage,
+  ElMessageBox,
+  genFileId,
+  type FormInstance,
+  type UploadInstance
+} from 'element-plus'
 import type { VxeTableInstance } from 'vxe-table'
 import type { Recordable } from '@/types/global'
 import { filterRunData } from '@/utils/excel'
@@ -175,8 +229,15 @@ import { apiDictList } from '@/api/common'
 import ConfigForm from './components/ConfigForm.vue'
 import { useExcelChangeStore } from '@/stores/excel'
 import { storeToRefs } from 'pinia'
+import { saveAs } from 'file-saver'
+import { uploadFile } from '@/api/excel'
+import CustomerModal from '@/components/CustomerModal/CustomerModal.vue'
 
+const visible = ref(false)
+const uploadRef = ref<UploadInstance>()
+const importFormInstance = ref<FormInstance>()
 const loading = ref(false)
+const importVisible = ref(false)
 const excelChangeStore = useExcelChangeStore()
 const { getAllMapConfigs } = storeToRefs(excelChangeStore)
 /**查询参数 */
@@ -188,7 +249,15 @@ const queryParams = reactive({
   column: 'createTime',
   order: 'desc'
 })
-
+const importForm = reactive({
+  customerId: '',
+  customerName: '',
+  filePath: ''
+})
+const importRules = reactive({
+  customerId: { required: true, message: '请选择客户', trigger: 'change' },
+  filePath: { required: true, message: '请选择要导入的文件', trigger: 'change' }
+})
 const currentColConf = reactive({
   excelOrderFiledConfId: '',
   title: '',
@@ -380,6 +449,62 @@ const removeRows = async () => {
   }
 }
 
+const handleExceed = (files: any) => {
+  uploadRef.value!.clearFiles()
+  const file = files[0]
+  file.uid = genFileId()
+  uploadRef.value!.handleStart(file)
+}
+
+const handleRemove = () => {
+  importForm.filePath = ''
+}
+const confirmCustomer = (list: any) => {
+  const [item] = list
+  if (!item) return
+
+  importForm.customerId = item.customerId
+  importForm.customerName = item.customerName
+}
+
+/**导出 */
+const exportTmp = async (row: any) => {
+  const res = await excelFileOrderExportExcel(row.excelOrderId)
+  saveAs(new Blob([res.data]), `${row.customerId_dictText}-${Date.now()}.xlsx`)
+}
+
+const imporModalHide = () => {
+  Object.assign(importForm, {
+    customerId: '',
+    customerName: '',
+    filePath: ''
+  })
+}
+
+const changeUpload = (file: any) => {
+  const formData = new FormData()
+  formData.append('file', file.raw)
+
+  uploadFile(formData).then(({ data }) => {
+    if (data?.code === 200) {
+      importForm.filePath = data.message
+    } else {
+      return ElMessage.error('上传失败！')
+    }
+  })
+}
+const submitImport = async () => {
+  await importFormInstance.value?.validate()
+  const { data } = await excelFileOrderImportExcel(importForm)
+  if (data?.code == '200') {
+    ElMessage.success(data.msg || '导入成功！')
+    importVisible.value = false
+    onQuery()
+  } else {
+    ElMessage.error(data.msg || '导入失败')
+  }
+}
+
 const onReset = () => {
   queryParams.status = ''
 }