From 5ad61d6ad3a0ce12c7fe0808527069b09a7c9c0d Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期二, 16 九月 2025 17:31:05 +0800
Subject: [PATCH] 新增基础产品
---
src/views/fysp/scene/CompSceneImport.vue | 103 ++++++++++++++++++++++++++++++++++++++++++++-------
1 files changed, 88 insertions(+), 15 deletions(-)
diff --git a/src/views/fysp/scene/CompSceneImport.vue b/src/views/fysp/scene/CompSceneImport.vue
index 2bbc4bc..40f591b 100644
--- a/src/views/fysp/scene/CompSceneImport.vue
+++ b/src/views/fysp/scene/CompSceneImport.vue
@@ -1,5 +1,7 @@
<template>
- <el-button icon="Upload" type="success" @click="dialogVisible = true">鎵归噺瀵煎叆</el-button>
+ <el-button icon="Upload" type="success" @click="dialogVisible = true"
+ >鎵归噺瀵煎叆</el-button
+ >
<el-dialog
v-model="dialogVisible"
title="鍦烘櫙淇℃伅鎵归噺瀵煎叆"
@@ -9,31 +11,102 @@
<el-upload
class="upload-demo"
drag
- action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
- multiple
+ :limit="1"
+ v-model:file-list="fileList"
+ :auto-upload="false"
accept=".xlsx"
+ :on-change="handleChange"
+ :on-exceed="handleExceed"
>
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
<div class="el-upload__text">鎷栧姩鏂囦欢鎴�<em>鐐瑰嚮涓婁紶</em></div>
<template #tip>
- <!-- <div class="el-upload__tip">jpg/png files with a size less than 500kb</div> -->
+ <el-text type="danger" size="small">{{ errMsg }}</el-text>
</template>
</el-upload>
<template #footer>
- <div class="dialog-footer">
- <el-button @click="dialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary" @click="dialogVisible = false">纭畾</el-button>
- </div>
+ <el-row justify="space-between">
+ <el-button type="primary" plain @click="downloadTemplate"
+ >涓嬭浇妯℃澘</el-button
+ >
+ <div class="dialog-footer">
+ <el-button @click="handleClose">鍙栨秷</el-button>
+
+ <el-button type="primary" @click="uploadFile" :loading="loading"
+ >纭畾</el-button
+ >
+ </div>
+ </el-row>
</template>
</el-dialog>
</template>
-<script>
-export default {
- data() {
- return {
- dialogVisible: false
- };
+<script setup>
+import { ref } from 'vue';
+import sceneApi from '@/api/fysp/sceneApi';
+import { ElMessage } from 'element-plus';
+
+const dialogVisible = ref(false);
+const fileList = ref([]);
+const errMsg = ref('');
+const loading = ref(false);
+
+function handleChange(file) {
+ console.log(file);
+ const ext = file.name.split('.').pop();
+ if (ext !== 'xlsx') {
+ ElMessage.error('璇蜂笂浼燛xcel鏂囦欢');
+ fileList.value.splice(0, 1);
+ return;
}
-};
+ fileList.value = [file];
+}
+
+function handleExceed(files, fileList) {
+ ElMessage.error('鏈�澶氬彧鑳戒笂浼犱竴涓枃浠�');
+}
+
+function uploadFile() {
+ if (fileList.value.length === 0) {
+ ElMessage.error('璇蜂笂浼犳枃浠�');
+ return;
+ }
+ const formData = new FormData();
+ loading.value = true;
+ formData.append('file', fileList.value[0].raw);
+ errMsg.value = '';
+ sceneApi
+ .importScene(formData)
+ .then((res) => {
+ dialogVisible.value = false;
+ fileList.value = [];
+ })
+ .catch((err) => {
+ errMsg.value = err;
+ })
+ .finally(() => {
+ loading.value = false;
+ });
+}
+
+function downloadTemplate() {
+ // 鍒涘缓涓嬭浇閾炬帴
+ const link = document.createElement('a');
+ // 璁剧疆public鐩綍涓嬬殑鏂囦欢璺緞
+ link.href = '/鐜板満鐩戠鍦烘櫙淇℃伅瀵煎叆妯℃澘.xlsx';
+ // 璁剧疆涓嬭浇鏂囦欢鍚�
+ link.download = '鐜板満鐩戠鍦烘櫙淇℃伅瀵煎叆妯℃澘.xlsx';
+ // 灏嗛摼鎺ユ坊鍔犲埌椤甸潰
+ document.body.appendChild(link);
+ // 瑙﹀彂鐐瑰嚮涓嬭浇
+ link.click();
+ // 涓嬭浇瀹屾垚鍚庣Щ闄ら摼鎺�
+ document.body.removeChild(link);
+}
+
+function handleClose() {
+ dialogVisible.value = false;
+ fileList.value = [];
+ errMsg.value = '';
+}
</script>
--
Gitblit v1.9.3