feature（上传Excel）

src/api/mapping.js

@@ -258,3 +258,8 @@ export function getSweetList(data) {
   const url = `/v1/biz/service-graph`
   return instance2.get(url, data)
 }
+// 上上传excel 表格接口
+export function uploadExcel(data) {
+  const url = `/v1/service/collect`
+  return instance2.post(url, data)
+}

src/views/service/Interface/components/InterfaceMap.vue

@@ -78,11 +78,24 @@
           </el-dropdown>
         </div>
       </el-col>
+      <el-col :span="2">
+        <el-upload
+          ref="upload"
+          class="comp-start-upload"
+          drag
+          action="#"
+          :auto-upload="false"
+          :multiple="false"
+          :show-file-list="false"
+          accept=".xls, .xlsx"
+          :on-change="handelUpload"
+        >
+          <el-button size="mini" icon="el-icon-upload2" type="primary">上传Excel</el-button>
+        </el-upload>
+      </el-col>
     </el-row>
 
     <div class="TableBox">
-      <!-- v-if="serveceMapList.length>0" -->
-      <!-- v-el-table-infinite-scroll="loadMore"  :height="tableHeight"-->
       <el-table
         v-loading="loading"
         :data="serveceMapList"
@@ -176,12 +189,6 @@
             <span v-if="scope.row.duration_stats!=undefined" style="display:flex;">
               {{ drawEchartsp99(scope.row, scope.$index, 'hundred') }}
               <div :id="`tiger-hundred-trend-index` + scope.$index" style="flex:1;padding-left:10px" class="tiger-trend-charts" />
-              <!-- <el-popover trigger="hover" placement="top">
-                        {{scope.row.duration_stats.p99!= undefined&&scope.row.duration_stats.p99.length>0?scope.row.duration_stats.p99[scope.row.duration_stats.p99.length-1]+'ms':''}}
-                        <div slot="reference" class="name-wrapper">
-                          <div class="P_box">{{scope.row.duration_stats.p99!= undefined&&scope.row.duration_stats.p99.length>0?scope.row.duration_stats.p99[scope.row.duration_stats.p99.length-1].toFixed(2)+'ms':'' }}</div>
-                        </div>
-                      </el-popover> -->
               <el-popover trigger="hover" placement="top">
                 {{ scope.row.duration_stats.p99!= undefined&&scope.row.duration_stats.p99.length>0?timeConversion(scope.row.duration_stats.p99[scope.row.duration_stats.p99.length-1]):'' }}
                 <div slot="reference" class="name-wrapper">
@@ -220,19 +227,10 @@
               icon="el-icon-star-on"
               @click.native.stop="handleFavor(scope.row)"
             />
-            <!-- <el-button
-                  style='color:#F56C6C'
-                  size="mini"
-                  type="text"
-                  icon="el-icon-delete"
-                  @click.native.stop="handleDelete(scope.row)"
-                >删除</el-button> -->
           </template>
         </el-table-column>
       </el-table>
     </div>
-    <!-- <div class="more" v-if="serveceMapList.length<tableCount" @click="loadMore">加载更多</div>
-        <div class="more nomore" v-if="loading==false&&serveceMapList.length>=tableCount">已加载完所有的数据！</div> -->
     <pagination
       v-show="tableCount>0"
       :total="tableCount"
@@ -352,7 +350,7 @@
 </template>
 
 <script>
-import { listUrlMapping, addUrlMapping, getUrlMapping, updateUrlMapping, delUrlMapping, favor, getUrlMappingRange } from '@/api/mapping'
+import { listUrlMapping, addUrlMapping, getUrlMapping, updateUrlMapping, delUrlMapping, favor, getUrlMappingRange, uploadExcel } from '@/api/mapping'
 import { listService } from '@/api/service'
 import { formatJson } from '@/utils'
 import storage from '@/utils/storage'
@@ -779,7 +777,7 @@ export default {
     submitForm: function() {
       this.$refs['form'].validate(valid => {
         if (valid) {
-          if (this.form.id !== undefined || this.form.id != 0) {
+          if (this.form.id !== undefined && this.form.id != 0) {
             updateUrlMapping(this.form, this.form.id).then(response => {
               if (response.code === 200) {
                 this.msgSuccess(response.msg)
@@ -1275,17 +1273,28 @@ export default {
       this.myChartList = []
       this.myChartboxList = []
       this.myChartBox2List = []
-    }
+    },
+    async handelUpload(file, fileList) {
+      const isLt5M = file.size / 1024 / 1024 < 5
+      if (isLt5M) {
+        let param = new FormData()
+        param.append('file', file.raw)
+        param.append('app_alias', this.appsItem.alias)
+        const res = await uploadExcel(param)
+        if (res.code == 200) {
+          this.$message.success('上传成功!')
+        }
+        await this.getList()
+      } else {
+        this.$message.error('上传文件不能超过5M!')
+        return false
+      }
+
+    },
   }
 }
 </script>
 <style lang="scss" scoped>
-// @font-face {
-//   font-family: 'iconfont';  /* Project id 4241886 */
-//   src: url('https://at.alicdn.com/t/c/font_4241886_44emlzl9ad4.woff2?t=1694073615647') format('woff2'),
-//        url('https://at.alicdn.com/t/c/font_4241886_44emlzl9ad4.woff?t=1694073615647') format('woff'),
-//        url('https://at.alicdn.com/t/c/font_4241886_44emlzl9ad4.ttf?t=1694073615647') format('truetype');
-// }
 .iconfont {
   font-family: "iconfont" !important;
   font-size: 20px;
@@ -1391,4 +1400,11 @@ export default {
   padding-left:10px !important;
   padding-right:10px !important;
 }
+.comp-start-upload ::v-deep .el-upload-dragger{
+  width: auto;
+  height: auto;
+  border:none;
+  border-radius: 0;
+  margin-left:10px;
+}
 </style>