feat: 上传模版

src/views/obj/obj/component/addComponent.vue

@@ -10,11 +10,10 @@
   <div class="step-row">
     <el-button type="primary" @click="active--" v-if="active > 0">上一步</el-button>
     <el-button type="primary" @click="handleSave">{{ stepArray.length - 1 === active ? '提交' : '下一步' }}</el-button>
-    <el-button type="primary" @click="visible=true" v-if="stepArray.length - 1 === active">导入接口配置</el-button>
+    <el-button type="primary"  v-if="stepArray.length - 1 === active" @click="visible=true">导入接口配置</el-button>
   </div>
-
   <el-dialog v-model="visible" title="接口导入配置" width="600">
-    <setting-file v-model:visible="visible"/>
+    <setting-file v-model:visible="visible" :rowId="rowId" @reload="reload"/>
   </el-dialog>
 
 </template>
@@ -52,6 +51,10 @@ const nextStep = (step:number) => {
   }
 }
 
+const reload=()=>{
+  comRef.value.queryList()
+}
+
 const handleSave=()=>{
   comRef.value.submitForm()
 }

src/views/obj/obj/component/metricsList.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-table :data="listData" border size="small" style="margin:10px 0">
+  <el-table :data="listData" border size="small" style="margin:10px 0" max-height="450">
     <el-table-column label="指标ID" align="center" prop="metricsId" width="80"/>
     <el-table-column label="指标分类" align="left" width="160">
       <template #default="scope">

src/views/obj/obj/component/settingFile.vue

@@ -1,12 +1,16 @@
 <template>
-  <el-upload class="upload-demo" drag action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15" multiple>
-    <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+  <el-upload class="upload-demo" :headers="upload.headers" drag :action="upload.url" multiple :on-success="handleFileSuccess">
+    <el-icon class="el-icon--upload">
+      <upload-filled/>
+    </el-icon>
     <div class="el-upload__text">
-      将文件拖到此处,或<el-button type="primary" link>点击上传</el-button>
+      将文件拖到此处,或
+      <el-button type="primary" link>点击上传</el-button>
     </div>
     <template #tip>
       <div class="el-upload__tip">
-        仅允许导入xls,xlsx格式文件.<el-button type="primary" link>下载模版</el-button>
+        仅允许导入xls,xlsx格式文件.
+        <el-button type="primary" link @click="downTemplate">下载模版</el-button>
       </div>
     </template>
   </el-upload>
@@ -16,14 +20,37 @@
   </div>
 </template>
 <script setup lang="ts">
-import { UploadFilled } from '@element-plus/icons-vue'
+import {UploadFilled} from '@element-plus/icons-vue'
+import { getToken } from "@/utils/auth";
+const {proxy} = getCurrentInstance()
 const emit = defineEmits(['update:visible'])
 const props = defineProps({
-  visible: Boolean
+  visible: Boolean,
+  rowId: {type: Number, default: null}
 })
+
+const upload = reactive({
+  headers: { Authorization: "Bearer " + getToken() },
+  url: import.meta.env.VITE_APP_BASE_API + "/obj/metrics/importData"
+});
+
+function downTemplate(){
+    proxy.download("obj/metrics/export", {
+      objId: props.rowId
+    }, `config_${new Date().getTime()}.xlsx`);
+}
+
+function handleFileSuccess(res){
+  if(res.code === 200){
+    proxy.$emit("reload")
+    return proxy.$message.success(res.msg)
+  }
+  proxy.$message.error(res.msg)
+}
+
 </script>
 <style scoped lang="scss">
-.setting-btn{
+.setting-btn {
   margin: 20px -20px 0 -20px;
   border-top: 1px solid #f1f1f1;
   padding-top: 20px;

src/views/obj/obj/component/step4.vue

@@ -59,7 +59,7 @@ const submitForm=()=>{
   emit("nextStep", 1)
 }
 
-defineExpose({submitForm})
+defineExpose({submitForm,queryList})
 
 </script>
 <style scoped lang="scss">