init

2025-12-02 10:37:49 +08:00
commit 1f645dad3e
1183 changed files with 147673 additions and 0 deletions
--- a/src/components/Upload/Excel.vue
+++ b/src/components/Upload/Excel.vue
@@ -0,0 +1,165 @@
+<!-- excel 导入组件 -->
+<template>
+  <el-dialog :title="prop.title" v-model="state.upload.open" :close-on-click-modal="false" draggable>
+    <el-upload
+        ref="uploadRef"
+        :limit="1"
+        accept=".xlsx, .xls"
+        :headers="headers"
+        :action="baseURL + other.adaptationUrl(url)"
+        :disabled="state.upload.isUploading"
+        :on-progress="handleFileUploadProgress"
+        :on-success="handleFileSuccess"
+        :on-error="handleFileError"
+        :auto-upload="false"
+        drag
+    >
+      <i class="el-icon-upload"></i>
+      <div class="el-upload__text">
+        {{ $t('excel.operationNotice') }}
+        <em>{{ $t('excel.clickUpload') }}</em>
+      </div>
+      <template #tip>
+        <div class="el-upload__tip text-center">
+          <span>{{ $t('excel.fileFormat') }}</span>
+          <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
+                   @click="downExcelTemp" v-if="tempUrl"
+          >{{ $t('excel.downloadTemplate') }}
+          </el-link>
+        </div>
+      </template>
+    </el-upload>
+    <template #footer>
+      <el-button type="primary" @click="submitFileForm">{{ $t('common.confirmButtonText') }}</el-button>
+      <el-button @click="state.upload.open = false">{{ $t('common.cancelButtonText') }}</el-button>
+    </template>
+  </el-dialog>
+
+  <!--校验失败错误数据-->
+  <el-dialog :title="$t('excel.validationFailureData')" v-model="state.errorVisible">
+    <el-table :data="state.errorData">
+      <el-table-column property="lineNum" :label="$t('excel.lineNumbers')" width="100"></el-table-column>
+      <el-table-column property="errors" :label="$t('excel.misDescription')" show-overflow-tooltip>
+        <template v-slot="scope">
+          <el-tag type="danger" v-for="error in scope.row.errors" :key="error">{{ error }}</el-tag>
+        </template>
+      </el-table-column>
+    </el-table>
+  </el-dialog>
+</template>
+
+<script setup lang="ts" name="upload-excel">
+import {useMessage} from '/@/hooks/message';
+import other from '/@/utils/other';
+import {Session} from '/@/utils/storage';
+
+const emit = defineEmits(['sizeChange', 'refreshDataList']);
+const prop = defineProps({
+  url: {
+    type: String,
+  },
+  title: {
+    type: String,
+  },
+  tempUrl: {
+    type: String,
+  },
+});
+
+const uploadRef = ref();
+
+const state = reactive({
+  errorVisible: false,
+  errorData: [],
+  dialog: {
+    title: '',
+    isShowDialog: false,
+  },
+  upload: {
+    open: false,
+    isUploading: false,
+  },
+});
+
+/**
+ * 下载模板文件
+ */
+const downExcelTemp = async () => {
+  try {
+    await other.downBlobFile(other.adaptationUrl(prop.tempUrl), {}, 'temp.xlsx');
+  } catch (error) {
+    useMessage().error('模板下载失败，请先维护模板文件');
+  }
+};
+
+/**
+ * 上传进度条变化事件
+ */
+const handleFileUploadProgress = () => {
+  state.upload.isUploading = true;
+};
+
+/**
+ * 上传失败事件处理
+ */
+const handleFileError = () => {
+  useMessage().error('上传失败,数据格式不合法!');
+  state.upload.open = false;
+};
+
+/**
+ * 上传成功事件处理
+ * @param {any} response - 上传成功的响应结果
+ */
+const handleFileSuccess = (response: any) => {
+  state.upload.isUploading = false;
+  state.upload.open = false;
+  uploadRef.value.clearFiles();
+
+  // 校验失败
+  if (response.code === 1) {
+    useMessage().error('导入失败，以下数据不合法');
+    state.errorVisible = true;
+    state.errorData = response.data;
+    uploadRef.value.clearFiles();
+    // 刷新表格
+    emit?.('refreshDataList');
+  } else {
+    useMessage().success(response.msg ? response.msg : '导入成功');
+    // 刷新表格
+    emit?.('refreshDataList');
+  }
+};
+
+/**
+ * 提交表单，触发上传
+ */
+const submitFileForm = () => {
+  uploadRef.value.submit();
+};
+
+/**
+ * 显示上传文件对话框，并清除上传信息
+ */
+const show = () => {
+  state.upload.isUploading = false;
+  state.upload.open = true;
+};
+
+/**
+ * 计算请求头部信息
+ */
+const headers = computed(() => {
+  return {
+    Authorization: 'Bearer ' + Session.getToken(),
+    'TENANT-ID': Session.getTenant(),
+  };
+});
+
+// 暴露变量
+defineExpose({
+  show,
+});
+</script>
+
+<style scoped></style>