From bcc384c0df9cc5da69479c5151dd6f2d4ec1e125 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=82=96=E6=99=8B=E9=A3=9E?= <378266566@qq.com>
Date: Mon, 12 May 2025 12:07:23 +0800
Subject: [PATCH] =?UTF-8?q?feat=20=E6=B5=8B=E7=82=B9=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E6=A8=A1=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/alert/exa/index.ts                |   4 +
 src/api/base/upload.ts                    |  13 ++
 src/components/Upload/src/UploadModal.vue |   1 +
 src/enums/appEnum.ts                      |   1 +
 src/views/exa/config/CreateBatchModal.vue | 144 ++++++++++++++++++----
 src/views/exa/config/index.vue            |   4 +-
 6 files changed, 141 insertions(+), 26 deletions(-)

diff --git a/src/api/alert/exa/index.ts b/src/api/alert/exa/index.ts
index 900ba93..ba7fe5f 100644
--- a/src/api/alert/exa/index.ts
+++ b/src/api/alert/exa/index.ts
@@ -73,3 +73,7 @@ export function getGroup() {
 export function deletePoint(ItemName: string) {
   return defHttp.delete({ url: `/alert/exa/delete?ItemName=${ItemName}` })
 }
+// 获取导入模板
+export function importTemplate() {
+  return defHttp.get({ url: '/alert/exa/get-import-template', responseType: 'blob' })
+}
diff --git a/src/api/base/upload.ts b/src/api/base/upload.ts
index 9fdb525..4975da4 100644
--- a/src/api/base/upload.ts
+++ b/src/api/base/upload.ts
@@ -18,3 +18,16 @@ export function uploadApi(params: UploadFileParams, onUploadProgress: (progressE
     params,
   )
 }
+
+/**
+ * @description: Upload interface
+ */
+export function uploadApi_EXA(params: UploadFileParams, onUploadProgress: (progressEvent: AxiosProgressEvent) => void) {
+  return defHttp.uploadFile<UploadApiResult>(
+    {
+      url: 'http://localhost:48080/admin-api/alert/exa/import',
+      onUploadProgress,
+    },
+    params,
+  )
+}
diff --git a/src/components/Upload/src/UploadModal.vue b/src/components/Upload/src/UploadModal.vue
index 5a3df6b..b852e98 100644
--- a/src/components/Upload/src/UploadModal.vue
+++ b/src/components/Upload/src/UploadModal.vue
@@ -132,6 +132,7 @@ async function uploadApiByItem(item: FileItem) {
     )
     item.status = UploadResultStatus.SUCCESS
     item.responseData = data
+    console.log(item)
     return {
       success: true,
       error: null,
diff --git a/src/enums/appEnum.ts b/src/enums/appEnum.ts
index 61534d4..b6fb930 100644
--- a/src/enums/appEnum.ts
+++ b/src/enums/appEnum.ts
@@ -70,4 +70,5 @@ export enum IconEnum {
   PASSWORD = 'ant-design:key-outlined',
   SETTING = 'ant-design:setting-outlined',
   SEND = 'ant-design:send-outlined',
+  ADDS = 'ant-design:plus-circle-outlined',
 }
diff --git a/src/views/exa/config/CreateBatchModal.vue b/src/views/exa/config/CreateBatchModal.vue
index 023a948..bc3a2f0 100644
--- a/src/views/exa/config/CreateBatchModal.vue
+++ b/src/views/exa/config/CreateBatchModal.vue
@@ -1,60 +1,156 @@
 <script lang="ts" setup>
 import { onBeforeMount, onMounted, ref, unref } from 'vue'
-import { UploadDragger, message } from 'ant-design-vue'
+import { Divider, UploadDragger, message } from 'ant-design-vue'
 import type { UploadChangeParam } from 'ant-design-vue'
 import { InboxOutlined } from '@ant-design/icons-vue'
-
+import { buildUUID } from '@/utils/uuid'
 import { useI18n } from '@/hooks/web/useI18n'
 import { useMessage } from '@/hooks/web/useMessage'
 import { BasicModal, useModalInner } from '@/components/Modal'
-import { createEXAPoint, getGroup } from '@/api/alert/exa'
+import { importTemplate } from '@/api/alert/exa'
+import { downloadByData } from '@/utils/file/download'
+import { uploadApi_EXA } from '@/api/base/upload'
+import { getAccessToken } from '@/utils/auth'
+import type { FileItem } from '@/components/Upload/src/typing'
+import { UploadResultStatus } from '@/components/Upload/src/typing'
 
 const emit = defineEmits(['success', 'register'])
 const { t } = useI18n()
 const { createMessage } = useMessage()
 
 const [registerCreateBatchModal, { setModalProps, closeModal }] = useModalInner(async () => {
+  setModalProps({
+    destroyOnClose: true,
+  })
+})
+const fileList = ref<File[]>([])
 
+const uploadParams = ref({
+  Authorization: `Bearer ${getAccessToken()}`,
+  // 'tenant-id': getTenantId(),
 })
-const fileList = ref([])
-function handleChange(info: UploadChangeParam) {
-  const status = info.file.status
-  if (status !== 'uploading')
-    console.log(info.file, info.fileList)
-
-  if (status === 'done')
-    message.success(`${info.file.name} file uploaded successfully.`)
-  else if (status === 'error')
-    message.error(`${info.file.name} file upload failed.`)
+function beforeUpload(file) {
+  const isLt30M = file.size / 1024 / 1024 < 30
+  if (!isLt30M) {
+    createMessage.warning(t('component.upload.maxSizeMultiple', [30]))
+    fileList.value = []
+
+    return false
+  }
+
+  // 判断上传文件格式
+
+  const extension = file.name.split('.')[1] === 'xls'
+
+  const extension2 = file.name.split('.')[1] === 'xlsx'
+
+  if (!extension && !extension2) {
+    createMessage.warning('导入文件只能是 xls、xlsx格式!')
+    fileList.value = []
+    console.log(fileList)
+
+    return false
+  }
+
+  return false
 }
+async function handleChange({ file, fileList }) {
+  console.log(file, 'file')
+  if (file.status === 'removed') {
+    fileList.value = []
+  }
+  else {
+    // const isLt30M = file.size / 1024 / 1024 < 30
+    // if (!isLt30M)
+    //   createMessage.warning(t('component.upload.maxSizeMultiple', [30]))
+    // else
+    fileList.value = [file]
+  }
+}
+
 function handleDrop(e: DragEvent) {
   console.log(e)
 }
+
+async function importPointTemplate() {
+  const data = await importTemplate()
+  downloadByData(data, 'EXA测点导入模板.xlsx')
+}
+
+async function handleSubmit() {
+  if (fileList.value.length <= 0) {
+    createMessage.warning('请选择上传的资源包')
+
+    return false
+  }
+
+  // 打开loding
+  setModalProps({ loading: true, confirmLoading: true })
+
+  // this.loading = true
+  const file: File = unref(fileList).value[0]
+  const item: FileItem = {
+    file,
+    size: file.size,
+    name: file.name,
+    percent: 0,
+    type: file.name.split('.').pop(),
+    uuid: buildUUID(),
+  }
+  try {
+    item.status = UploadResultStatus.UPLOADING
+    const { data } = await uploadApi_EXA?.(
+      {
+        data: {
+          ...(uploadParams.value || {}),
+        },
+        file: item.file,
+        name: 'file',
+        filename: file.name,
+      },
+      (progressEvent: ProgressEvent) => {
+        const complete = ((progressEvent.loaded / progressEvent.total) * 100) | 0
+        item.percent = complete
+      },
+    )
+    item.status = UploadResultStatus.SUCCESS
+    item.responseData = data
+    emit('success')
+    closeModal()
+    // 关闭loding
+    setModalProps({ loading: false, confirmLoading: false })
+    createMessage.success(`成功创建${data.data.createNames.length}个测点`)
+  }
+  catch (e) {
+    console.log(e)
+    item.status = UploadResultStatus.ERROR
+    closeModal()
+    // 关闭loding
+    setModalProps({ loading: false, confirmLoading: false })
+    createMessage.error(`创建失败,错误原因:${data.data.msg}`)
+  }
+}
 </script>
 
 <template>
   <BasicModal
-    v-bind="$attrs" :min-height="200" :title="t('action.createBatch')" @register="registerCreateBatchModal"
-    @ok="handleSubmit"
+    v-bind="$attrs" :min-height="100" width="300" :title="t('action.createBatch')"
+    @register="registerCreateBatchModal" @ok="handleSubmit"
   >
     <UploadDragger
-      v-model:fileList="fileList"
-      name="file"
-      :multiple="true"
-      action="/user/import/"
-      @change="handleChange"
-      @drop="handleDrop"
+      v-model:fileList="fileList" :max-count="1" accept=".xlsx,.xls" :multiple="false" :before-upload="beforeUpload"
+      @change="handleChange" @drop="handleDrop"
     >
       <p class="ant-upload-drag-icon">
         <inbox-outlined />
       </p>
       <p class="ant-upload-text">
-        Click or drag file to this area to upload
+        点击或拖拽到此区域实现上传
       </p>
       <p class="ant-upload-hint">
-        Support for a single or bulk upload. Strictly prohibit from uploading company data or other
-        band files
+        只支持上传单个excel文件,请尽量根据模板上传
       </p>
     </UploadDragger>
+    <Divider><span style="color: #0B55A4;cursor: pointer" @click="importPointTemplate">下载模板</span></Divider>
   </BasicModal>
 </template>
diff --git a/src/views/exa/config/index.vue b/src/views/exa/config/index.vue
index dcc7dfb..db13c37 100644
--- a/src/views/exa/config/index.vue
+++ b/src/views/exa/config/index.vue
@@ -114,7 +114,7 @@ async function handleDelete(record: Recordable) {
         <a-button v-auth="['system:role:create']" type="primary" :pre-icon="IconEnum.ADD" @click="handleCreate">
           {{ t('action.create') }}
         </a-button>
-        <a-button v-auth="['system:role:create']" type="primary" :pre-icon="IconEnum.ADD" @click="handleCreateBatch">
+        <a-button v-auth="['system:role:create']" type="primary" :pre-icon="IconEnum.ADDS" @click="handleCreateBatch">
           {{ t('action.createBatch') }}
         </a-button>
         <!-- <a-button v-auth="['system:role:create']" :pre-icon="IconEnum.EXPORT" @click="handleExport">
@@ -141,7 +141,7 @@ async function handleDelete(record: Recordable) {
       </template>
     </BasicTable>
     <EXAModal @register="registerModal" @success="reload" />
-    <CreateBatchModal @register="registerCreateBatchModal" />
+    <CreateBatchModal @register="registerCreateBatchModal" @success="reload" />
     <HistoryModal @register="registerHistoryModal" />
   </div>
 </template>