增加搜索功能，优化代码结构

public/config.js

@@ -3,19 +3,20 @@ var systemConfig = {
         lon: 112.52475547556074,
         lat: 37.86090299387082
     },
-    // 121 环境
+    // // 121 环境
     // proxyUrl: 'http://121.43.55.7:10011/proxy/?servertype={PROXYURL}&proxyToken=', // 应替换为121上nginx代理后的代理地址
+    // proxyUrl_arcgis: 'http://121.43.55.7:10011/proxy/?servertype={PROXYURL}&proxyToken=', // 应替换为121上nginx代理后的代理地址
     // single_map: "http://121.43.55.7:2112/",
 
-    // 政务网环境
+    // // 政务网环境
     // proxyUrl: 'http://10.235.245.174:10011/proxy/?servertype={PROXYURL}&proxyToken=',
     // proxyUrl_arcgis: 'http://10.235.245.174:10092/proxy/?servertype={PROXYURL}&proxyToken=',
     // single_map: "http://10.235.245.174:2107/",
 
-    // 本地测试环境
+    // // 本地测试环境
     proxyUrl: 'http://10.235.245.174:10011/proxy/?servertype={PROXYURL}&proxyToken=',
     proxyUrl_arcgis: 'http://10.235.245.174:10092/proxy/?servertype={PROXYURL}&proxyToken=',
-    single_map: "http://localhost:2107/", // "http://localhost:2112/",
+    single_map: "http://10.235.245.174:2107/", // "http://localhost:2112/",
 }
 
 // var system_name = "数据共享服务系统";

src/components/main/MainContainer.vue

@@ -33,10 +33,6 @@ export default {
 }
 </style>
 <style lang="less">
-#container {
-
-
-}
 .el-divider {
   margin: 1% 0;
 }

src/components/map/CesiumMap.vue

@@ -313,6 +313,28 @@ export default {
           systemConfig.single_map +
           "?dataType=twoD&mapserverType=cartodb&url=" +
           t;
+      } else if (type == "wms") {
+        // 原网址
+        // item.param != '' ? t = encodeURIComponent(url + "?" + item.param) : t = encodeURIComponent(url)
+        // 代理网址
+        t = item.proxyUrl + "622067E9-93E5-D8EC-E677-85B58A63C0C7";
+        item.param != ""
+          ? (t = encodeURIComponent(t + "&" + item.param))
+          : (t = encodeURIComponent(t));
+        // 代理网址
+        this.src =
+          systemConfig.single_map + "?dataType=twoD&mapserverType=wms&url=" + t;
+      } else if (type == "wfs") {
+        // 原网址
+        // item.param != '' ? t = encodeURIComponent(url + "?" + item.param) : t = encodeURIComponent(url)
+        // 代理网址
+        t = item.proxyUrl + "622067E9-93E5-D8EC-E677-85B58A63C0C7";
+        item.param != ""
+          ? (t = encodeURIComponent(t + "&" + item.param))
+          : (t = encodeURIComponent(t));
+        // 代理网址
+        this.src =
+          systemConfig.single_map + "?dataType=twoD&mapserverType=wfs&url=" + t;
       }
     },
     flyToPrimitive(obj) {

src/components/proxy/ConfigDetail.vue

@@ -1,21 +1,32 @@
 <template>
   <el-dialog
-      :model-value="show"
-      :title="title"
-      :width="500"
-      :close-on-click-modal="false"
-      :destroy-on-close="true"
-      :before-close="closeDialog"
+    :model-value="show"
+    :title="title"
+    :width="500"
+    :close-on-click-modal="false"
+    :destroy-on-close="true"
+    :before-close="closeDialog"
   >
-    <el-form ref="form" :model="formData" :rules="formDataRules" style="margin: 0 3%" :label-width="80">
-      <el-form-item label="ID：" v-show="false" >
-        <el-input v-model="formData.id" :disabled="true"/>
+    <el-form
+      ref="form"
+      :model="formData"
+      :rules="formDataRules"
+      style="margin: 0 3%"
+      :label-width="80"
+    >
+      <el-form-item label="ID：" v-show="false">
+        <el-input v-model="formData.id" :disabled="true" />
       </el-form-item>
       <el-form-item label="类型：" prop="type">
-        <el-select v-model="formData.type" placeholder="请选择类型" style="margin-right: 12px" default-first-option>
-          <template v-for="(item, index) in selectOptions" :key="index">
+        <el-select
+          v-model="formData.type"
+          placeholder="请选择类型"
+          style="margin-right: 12px"
+          default-first-option
+        >
+          <div v-for="(item, index) in selectOptions" :key="index">
             <el-option :label="item.label" :value="item.value" v-show="item.value!='ALL'"></el-option>
-          </template>
+          </div>
         </el-select>
       </el-form-item>
       <el-form-item label="标题：" prop="key">
@@ -24,49 +35,49 @@
       <el-form-item label="描述：" prop="content">
         <el-input v-model="formData.content" placeholder="请输入标题" />
       </el-form-item>
-      <el-form-item label="链接：" prop="url" >
+      <el-form-item label="链接：" prop="url">
         <el-input v-model="formData.url" placeholder="请输入链接" />
       </el-form-item>
     </el-form>
 
     <template #footer>
-      <el-button>取消</el-button>
+      <el-button @click="closeDialog">取消</el-button>
       <el-button type="primary" @click="save">保存</el-button>
     </template>
   </el-dialog>
 </template>
 
 <script>
-import {getCurrentInstance} from "vue";
+import { getCurrentInstance } from "vue";
 
 export default {
   data() {
     return {
-      title: '',
+      title: "",
       formData: {
-        id: '',
-        title: '',
-        url: '',
+        id: "",
+        title: "",
+        url: ""
       },
       formDataRules: {
-        "key": [
-          {required: true, message: '请输入标题', trigger: 'blur'},
-          {required: true, message: '请输入标题', trigger: 'change'},
+        key: [
+          { required: true, message: "请输入标题", trigger: "blur" },
+          { required: true, message: "请输入标题", trigger: "change" }
         ],
-        "type": [
-          {required: true, message: '请选择类型', trigger: 'blur'},
-          {required: true, message: '请选择类型', trigger: 'change'},
+        type: [
+          { required: true, message: "请选择类型", trigger: "blur" },
+          { required: true, message: "请选择类型", trigger: "change" }
         ],
-        "url": [
-          {required: true, message: '请输入链接', trigger: 'blur'},
-          {required: true, message: '请输入链接', trigger: 'change'},
+        url: [
+          { required: true, message: "请输入链接", trigger: "blur" },
+          { required: true, message: "请输入链接", trigger: "change" }
         ]
       },
       operations: {
         isEdit: false,
-        isAdd: false,
+        isAdd: false
       }
-    }
+    };
   },
   props: {
     show: Boolean,
@@ -76,51 +87,53 @@ export default {
     operation: String,
     selectOptions: Array,
     refresh: Function,
-    isEdit: Boolean
-  },
-  emits: ["update:show"],
-  setup(props, context) {
-    let app = getCurrentInstance();
-    const methods = {
-      updateShow(val) {
-        context.emit('update:show', val)
-      },
-    }
-    return methods;
+    isEdit: Boolean,
+    close: Function
   },
+  // emits: ["update:show"],
+  // setup(props, context) {
+  //   let app = getCurrentInstance();
+  //   const methods = {
+  //     updateShow(val) {
+  //       context.emit("update:show", val);
+  //     }
+  //   };
+  //   return methods;
+  // },
   watch: {
-    "item": function (val) {
+    item: function(val) {
       if (val) {
-        this.updateOperation(this.operation)
-        this.formData.type = this.dataType
+        this.updateOperation(this.operation);
+        this.formData.type = this.dataType;
       }
     }
   },
   methods: {
     closeDialog() {
-      this.updateShow(false)
+      // this.updateShow(false);
+      this.close();
     },
     updateOperation(val) {
       this.formData = this.$options.data().formData;
-      this.operations.isAdd = (val === 'Add');
-      this.operations.isEdit = (val === 'Edit');
+      this.operations.isAdd = val === "Add";
+      this.operations.isEdit = val === "Edit";
       if (this.operations.isAdd) {
-        this.title = '添加配置'
+        this.title = "添加配置";
       }
       if (this.operations.isEdit) {
-        this.title = '修改配置'
+        this.title = "修改配置";
         this.formData = JSON.parse(JSON.stringify(this.item));
       }
     },
     save() {
       let that = this;
-      this.$refs.form.validate(valid=>{
+      this.$refs.form.validate(valid => {
         if (that.operations.isAdd) {
-          that.addConfig()
+          that.addConfig();
         } else if (that.operations.isEdit) {
-          that.updateConfig()
+          that.updateConfig();
         }
-      })
+      });
     },
     addConfig() {
       let that = this;
@@ -129,19 +142,22 @@ export default {
         dataType: this.formData.type,
         key: this.formData.key,
         content: this.formData.content,
-        url: this.formData.url,
-      }
-      this.$request.postForm('/proxy_proxy/proxy_api/config/add', params).then(res=>{
-        if (res.code === 200) {
-          that.$message({message:'添加成功', type: 'success'});
-          that.refresh();
-          that.closeDialog();
-        } else {
-          that.$message({message:res.content, type: 'error'});
-        }
-      }).catch(err=>{
-        that.$message({message:err.message, type: 'error'});
-      });
+        url: this.formData.url
+      };
+      this.$request
+        .postForm("/proxy_proxy/proxy_api/config/add", params)
+        .then(res => {
+          if (res.code === 200) {
+            that.$message({ message: "添加成功", type: "success" });
+            that.refresh();
+            that.closeDialog();
+          } else {
+            that.$message({ message: res.content, type: "error" });
+          }
+        })
+        .catch(err => {
+          that.$message({ message: err.message, type: "error" });
+        });
     },
     updateConfig() {
       let that = this;
@@ -152,24 +168,26 @@ export default {
         key: this.formData.key,
         content: this.formData.content,
         index: this.formData.id,
-        url: this.formData.url,
-      }
-      this.$request.postForm('/proxy_proxy/proxy_api/config/update', params).then(res=>{
-        if (res.code === 200) {
-          that.$message({message:'修改成功', type: 'success'});
-          that.refresh();
-          that.closeDialog();
-        } else {
-          that.$message({message:res.content, type: 'error'});
-        }
-      }).catch(err=>{
-        that.$message({message:err.message, type: 'error'});
-      });
+        url: this.formData.url
+      };
+      this.$request
+        .postForm("/proxy_proxy/proxy_api/config/update", params)
+        .then(res => {
+          if (res.code === 200) {
+            that.$message({ message: "修改成功", type: "success" });
+            that.refresh();
+            that.closeDialog();
+          } else {
+            that.$message({ message: res.content, type: "error" });
+          }
+        })
+        .catch(err => {
+          that.$message({ message: err.message, type: "error" });
+        });
     }
   }
-}
+};
 </script>
 
 <style lang="less" scoped>
-
 </style>

src/components/proxy/ConfigManage.vue

@@ -1,69 +1,125 @@
 <template>
-  <div id="configManage">
-    <div class="functionBtn">
-      <el-select v-show="proxyType != 'INTEGRATION'" v-model="dataType" placeholder="请选择类型" style="margin-right: 12px"
-        default-first-option>
-        <el-option v-for="(item, index) in selectOptions" :key="index" :label="item.label"
-          :value="item.value"></el-option>
-      </el-select>
-      <el-button type="primary" round @click="handleDetailVisible('Add')">新增配置</el-button>
-      <el-button v-show="proxyType != 'INTEGRATION'" round @click="viewAllModel">全部预览</el-button>
-      <el-tooltip content="刷新" placement="right">
-        <el-button circle @click="refresh"><el-icon><IconPark-refresh /></el-icon></el-button>
-      </el-tooltip>
-    </div>
-    <div class="tableContent">
-      <el-table ref="table" :data="tableData" :max-height="maxHeight" v-loading="loading"
-        @current-change="(row) => { this.currRow = row }" border stripe>
-        <el-table-column prop="id" label="ID" width="60" align="center">
-          <template #default="scope">
-            <span>{{ scope.row.id + 1 }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column prop="key" label="标题" min-width="100">
-          <template #default="scope">
-            <span style="font-weight: bold;font-family: JetBrainsMono-Regular,serif">{{ scope.row.key }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column prop="content" label="描述" min-width="100" />
-        <el-table-column prop="proxyUrl" label="链接" min-width="350">
-          <template #default="scope">
-            <span style="font-family: JetBrainsMono-Regular,serif">{{ scope.row.proxyUrl }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column prop="operation" label="操作" min-width="120">
-          <template #default="scope">
-            <el-button type="primary" size="small" @click="handleDetailVisible('Edit', scope.row)">
-              <el-icon><IconPark-edit /></el-icon>
-              修改
-            </el-button>
-            <el-button size="small" @click="deleteConfig(scope.row)">
-              <el-icon><IconPark-delete /></el-icon>
-              删除
-            </el-button>
-            <el-button v-show="proxyType != 'INTEGRATION'" size="small" @click="view(scope.row)">
-              <el-icon><IconPark-preview-open /></el-icon>
-              预览
-            </el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <div class="pagination">
-        <el-pagination background layout="sizes, prev, pager, next, jumper, ->, total"
-          v-model:current-page="pageInfo.page" v-model:page-size="pageInfo.pageSize" :total="pageInfo.total" />
+  <div class="configManageContainer">
+    <div id="configManage">
+      <div class="functionBtn">
+        <el-select
+          v-show="proxyType != 'INTEGRATION'"
+          v-model="dataType"
+          placeholder="请选择类型"
+          style="margin-right: 12px"
+          default-first-option
+        >
+          <el-option
+            v-for="(item, index) in selectOptions"
+            :key="index"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
+        <el-input v-model="searchStr" style="width:150px;margin-right:20px;" placeholder="请输入查询关键字"></el-input>
+        <el-button type="primary" round @click="screenData()">查询</el-button>
+        <el-button type="primary" round @click="handleDetailVisible('Add')">新增配置</el-button>
+        <!-- <el-button v-show="proxyType != 'INTEGRATION'" round @click="viewAllModel">全部预览</el-button> -->
+        <el-tooltip content="刷新" placement="right">
+          <el-button circle @click="refresh">
+            <el-icon>
+              <IconPark-refresh />
+            </el-icon>
+          </el-button>
+        </el-tooltip>
+      </div>
+      <div class="tableContent">
+        <el-table
+          ref="table"
+          :data="tableData"
+          :max-height="maxHeight"
+          v-loading="loading"
+          @current-change="(row) => { this.currRow = row }"
+          border
+          stripe
+        >
+          <el-table-column prop="id" label="ID" width="60" align="center">
+            <template #default="scope">
+              <span>{{ scope.row.id + 1 }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="key" label="标题" min-width="100">
+            <template #default="scope">
+              <span
+                style="font-weight: bold;font-family: JetBrainsMono-Regular,serif"
+              >{{ scope.row.key }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="content" label="描述" min-width="100" />
+          <el-table-column prop="proxyUrl" label="链接" min-width="350">
+            <template #default="scope">
+              <span style="font-family: JetBrainsMono-Regular,serif">{{ scope.row.proxyUrl }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="operation" label="操作" min-width="120">
+            <template #default="scope">
+              <el-button
+                type="primary"
+                size="small"
+                @click="handleDetailVisible('Edit', scope.row)"
+              >
+                <el-icon>
+                  <IconPark-edit />
+                </el-icon>修改
+              </el-button>
+              <el-button size="small" @click="deleteConfig(scope.row)">
+                <el-icon>
+                  <IconPark-delete />
+                </el-icon>删除
+              </el-button>
+              <el-button v-show="proxyType != 'INTEGRATION'" size="small" @click="view(scope.row)">
+                <el-icon>
+                  <IconPark-preview-open />
+                </el-icon>预览
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="pagination">
+          <el-pagination
+            background
+            layout="prev, pager, next, jumper, ->, total"
+            v-model:current-page="pageInfo.page"
+            v-model::page-size="pageInfo.pageSize"
+            :total="pageInfo.total"
+          />
+        </div>
       </div>
     </div>
-  </div>
 
-  <ConfigDetail v-model:show="detailVisible" :operation="detailOperation" :item="currRow" :is-edit="detailIsEdit"
-    :select-options="selectOptions" :proxy-type="proxyType" :data-type="dataType" :refresh="getData">
-  </ConfigDetail>
+    <ConfigDetail
+      :show="detailVisible"
+      :operation="detailOperation"
+      :item="currRow"
+      :is-edit="detailIsEdit"
+      :select-options="selectOptions"
+      :proxy-type="proxyType"
+      :data-type="dataType"
+      :refresh="getData"
+      :close="configDetailClose"
+    ></ConfigDetail>
 
-  <CesiumMap v-if="isMapShow" :is-show="isMapShow" :type="mapType" :close="closeMap" :item="mapItem">
-  </CesiumMap>
+    <CesiumMap
+      v-if="isMapShow"
+      :is-show="isMapShow"
+      :type="mapType"
+      :close="closeMap"
+      :item="mapItem"
+    ></CesiumMap>
 
-  <AllCesiumMap v-if="isAllMapShow" :is-show="isAllMapShow" :type="allMapType" :close="closeMap" :item="tableData">
-  </AllCesiumMap>
+    <AllCesiumMap
+      v-if="isAllMapShow"
+      :is-show="isAllMapShow"
+      :type="allMapType"
+      :close="closeMap"
+      :item="tableData"
+    ></AllCesiumMap>
+  </div>
 </template>
 
 <script>
@@ -82,57 +138,57 @@ export default {
       pageInfo: {
         page: 1,
         pageSize: 10,
-        total: 0,
+        total: 0
       },
-      proxyType: '',
-      dataType: '',
+      proxyType: "",
+      dataType: "",
       selectOptions: [],
       dataTypes: {
         99: {
-          label: '数据',
-          value: 'UNKNOWN'
+          label: "数据",
+          value: "UNKNOWN"
         },
         0: {
-          label: '全部',
-          value: 'ALL'
+          label: "全部",
+          value: "ALL"
         },
         1: {
-          label: '地图',
-          value: 'MAP',
+          label: "地图",
+          value: "MAP"
         },
         2: {
-          label: '三维模型',
-          value: 'MODEL',
+          label: "三维模型",
+          value: "MODEL"
         },
         3: {
-          label: 'GLTF模型',
-          value: 'GLTF',
+          label: "GLTF模型",
+          value: "GLTF"
         }
       },
 
       routerParam: {
-        'publish_twoD': {
-          proxyType: 'PUBLISH',
-          dataTypes: [1],
+        publish_twoD: {
+          proxyType: "PUBLISH",
+          dataTypes: [1]
         },
-        'publish_threeD': {
-          proxyType: 'PUBLISH',
-          dataTypes: [2, 3],
-        },
-        'integration_data': {
-          proxyType: 'INTEGRATION',
-          dataTypes: [99],
+        publish_threeD: {
+          proxyType: "PUBLISH",
+          dataTypes: [2, 3]
         },
+        integration_data: {
+          proxyType: "INTEGRATION",
+          dataTypes: [99]
+        }
       },
 
       mapTypes: {
-        'MODEL': 1,
-        'GLTF': 2,
-        'MAP': 4
+        MODEL: 1,
+        GLTF: 2,
+        MAP: 4
       },
 
       detailVisible: false,
-      detailOperation: '',
+      detailOperation: "",
       detailIsEdit: false,
 
       isMapShow: false,
@@ -141,19 +197,21 @@ export default {
 
       allMapType: -1,
       isAllMapShow: false,
-    }
+
+      searchStr: ""
+    };
   },
   watch: {
-    "pageInfo.page": function () {
+    "pageInfo.page": function() {
       this.renderTable();
     },
-    "pageInfo.pageSize": function () {
+    "pageInfo.pageSize": function() {
       this.renderTable();
     },
-    "dataType": function () {
-      this.refresh()
+    dataType: function() {
+      this.refresh();
     },
-    "$route.name": function (val) {
+    "$route.name": function(val) {
       if (val) {
         this.initType();
         this.refresh();
@@ -163,10 +221,15 @@ export default {
   components: {
     ConfigDetail,
     CesiumMap,
-    AllCesiumMap,
+    AllCesiumMap
   },
   created() {
-    this.initType()
+    this.initType();
+    this.pageInfo = {
+      page: 1,
+      pageSize: 10,
+      total: 0
+    };
   },
   mounted() {
     let container = document.getElementById("configManage");
@@ -180,15 +243,15 @@ export default {
       if (!obj) {
         return;
       }
-      this.proxyType = obj.proxyType
-      this.dataType = '';
+      this.proxyType = obj.proxyType;
+      this.dataType = "";
       this.selectOptions = [];
       //this.selectOptions.push(this.dataTypes[0])
       for (let index of obj.dataTypes) {
-        this.selectOptions.push(this.dataTypes[index])
+        this.selectOptions.push(this.dataTypes[index]);
       }
       if (this.selectOptions.length > 0) {
-        this.dataType = this.selectOptions[0].value
+        this.dataType = this.selectOptions[0].value;
       }
     },
     refresh() {
@@ -198,9 +261,9 @@ export default {
       this.getData();
     },
     getData() {
-      if (!this.dataType || this.dataType == '') {
+      if (!this.dataType || this.dataType == "") {
         this.configData = [];
-        this.tableData = []
+        this.tableData = [];
         this.pageInfo.total = 0;
         return;
       }
@@ -208,81 +271,111 @@ export default {
       that.loading = true;
 
       let params = {
-        proxyType: this.proxyType,//"PUBLISH"
-        dataType: this.dataType,//"MAP"
-      }
-      this.$request.postForm('/proxy_proxy/proxy_api/config/getByType', params).then(res => {
-        that.configData = [];
-        if (res.code === 200) {
-          let num = 0;
+        proxyType: this.proxyType, //"PUBLISH"
+        dataType: this.dataType //"MAP"
+      };
+      this.$request
+        .postForm("/proxy_proxy/proxy_api/config/getByType", params)
+        .then(res => {
           that.configData = [];
-          that.pageInfo.total = 0;
-          // let t = []
-          if (res.content) {
-            that.configData = JSON.parse(JSON.stringify(res.content))
+          if (res.code === 200) {
+            let num = 0;
+            that.configData = [];
+            that.pageInfo.total = 0;
             // let t = []
-            that.configData.forEach(i => {
-              i.id = num++;
-              // if (i.type == "3dtiles") {
-              if (i.type.indexOf("arcgis") >= 0) {
-                i.proxyUrl = systemConfig.proxyUrl_arcgis.replace('{PROXYURL}', i.key);
-                // if (i.type.indexOf("arcgis-tile") >= 0) t.push(encodeURIComponent(i.proxyUrl + "622067E9-93E5-D8EC-E677-85B58A63C0C7"))
-              }
-              else if (i.type == "cartodb") {
-                let one = systemConfig.proxyUrl.replace('proxy/?', "proxy/{z}/{x}/{y}.png?");
-                i.proxyUrl = one.replace('{PROXYURL}', i.key);
-              }
-              else if (i.type == "xyz_jpg") {
-                let one = systemConfig.proxyUrl.replace('proxy/?', "proxy/{z}/{x}/{y}.jpg?");
-                i.proxyUrl = one.replace('{PROXYURL}', i.key);
-              }
-              else if (i.type == "xyz_png") {
-                let one = systemConfig.proxyUrl.replace('proxy/?', "proxy/{z}/{x}/{y}.png?");
-                i.proxyUrl = one.replace('{PROXYURL}', i.key);
-              }
-              else if (that.dataType == "MODEL") {
-                let one = systemConfig.proxyUrl.replace('proxy/?', "proxy/tileset.json?");
-                i.proxyUrl = one.replace('{PROXYURL}', i.key);
-              }
-              else {
-                i.proxyUrl = systemConfig.proxyUrl.replace('{PROXYURL}', i.key);
-              }
-            })
-            that.pageInfo.total = that.configData.length;
-            // console.log(JSON.stringify(t))
-          }
+            if (res.content) {
+              that.configData = JSON.parse(JSON.stringify(res.content));
+              // let t = []
+              that.configData.forEach(i => {
+                i.id = num++;
+                // if (i.type == "3dtiles") {
+                if (i.type.indexOf("arcgis") >= 0) {
+                  i.proxyUrl = systemConfig.proxyUrl_arcgis.replace(
+                    "{PROXYURL}",
+                    i.key
+                  );
+                  // if (i.type.indexOf("arcgis-tile") >= 0) t.push(encodeURIComponent(i.proxyUrl + "622067E9-93E5-D8EC-E677-85B58A63C0C7"))
+                } else if (i.type == "cartodb") {
+                  let one = systemConfig.proxyUrl.replace(
+                    "proxy/?",
+                    "proxy/{z}/{x}/{y}.png?"
+                  );
+                  i.proxyUrl = one.replace("{PROXYURL}", i.key);
+                } else if (i.type == "xyz_jpg") {
+                  let one = systemConfig.proxyUrl.replace(
+                    "proxy/?",
+                    "proxy/{z}/{x}/{y}.jpg?"
+                  );
+                  i.proxyUrl = one.replace("{PROXYURL}", i.key);
+                } else if (i.type == "xyz_png") {
+                  let one = systemConfig.proxyUrl.replace(
+                    "proxy/?",
+                    "proxy/{z}/{x}/{y}.png?"
+                  );
+                  i.proxyUrl = one.replace("{PROXYURL}", i.key);
+                } else if (that.dataType == "MODEL") {
+                  let one = systemConfig.proxyUrl.replace(
+                    "proxy/?",
+                    "proxy/tileset.json?"
+                  );
+                  i.proxyUrl = one.replace("{PROXYURL}", i.key);
+                } else {
+                  i.proxyUrl = systemConfig.proxyUrl.replace(
+                    "{PROXYURL}",
+                    i.key
+                  );
+                }
+              });
 
-          this.renderTable();
-        }
-        that.loading = false;
-      }).catch(err => {
-        that.loading = false;
-        that.$message({ message: err.message, type: 'error' });
-      })
+              that.configData = that.configData.filter(function(item) {
+                return that.searchStr == ""
+                  ? true
+                  : item.content.indexOf(that.searchStr.replace(/ /g, "")) >=
+                      0 ||
+                      item.key.indexOf(that.searchStr.replace(/ /g, "")) >= 0;
+              });
+
+              that.pageInfo.total = that.configData.length;
+              // console.log(JSON.stringify(t))
+            }
+            this.renderTable();
+          }
+          that.loading = false;
+        })
+        .catch(err => {
+          that.loading = false;
+          that.$message({ message: err.message, type: "error" });
+        });
+    },
+    screenData() {
+      this.getData();
     },
     renderTable() {
-      let start = (this.pageInfo.page - 1) * this.pageInfo.pageSize
-      let end = this.pageInfo.page * this.pageInfo.pageSize
-      this.tableData = this.configData.slice(start, end)
+      let start = (this.pageInfo.page - 1) * this.pageInfo.pageSize;
+      let end = this.pageInfo.page * this.pageInfo.pageSize;
+      this.tableData = this.configData.slice(start, end);
     },
     handleDetailVisible(operation, item) {
       this.detailOperation = operation;
       this.detailVisible = true;
       this.detailIsEdit = true;
-      if (operation === 'Add') {
-        this.currRow = { title: '', url: '' };
+      if (operation === "Add") {
+        this.currRow = { title: "", url: "" };
         this.detailIsEdit = false;
       } else {
         this.currRow = JSON.parse(JSON.stringify(item));
       }
     },
+    configDetailClose() {
+      this.detailVisible = false;
+    },
     viewAllModel() {
       let type = this.mapTypes[this.dataType];
       if (type) {
         this.allMapType = type;
         this.isAllMapShow = true;
       } else {
-        this.$message.error('该类型暂不支持预览');
+        this.$message.error("该类型暂不支持预览");
         return;
       }
     },
@@ -292,55 +385,62 @@ export default {
       // debugger;
       // console.log(item)
       // console.log(this.dataType)
-      this.mapItem = JSON.parse(JSON.stringify(item))
+      this.mapItem = JSON.parse(JSON.stringify(item));
       let type = this.mapTypes[this.dataType];
       if (type) {
         this.mapType = type;
         this.isMapShow = true;
       } else {
-        this.$message.error('该类型暂不支持预览');
+        this.$message.error("该类型暂不支持预览");
         return;
       }
     },
     closeMap() {
-      this.isMapShow = false
-      this.isAllMapShow = false
+      this.isMapShow = false;
+      this.isAllMapShow = false;
     },
     deleteConfig(item) {
       let that = this;
-      this.$msgbox.confirm('确定要删除：' + item.key + '吗?').then(() => {
+      this.$msgbox.confirm("确定要删除：" + item.key + "吗?").then(() => {
         let params = {
           proxyType: this.proxyType,
           dataType: this.dataType,
           index: item.id
-        }
-        that.$request.deleteForm('/proxy_proxy/proxy_api/config/delete', params).then(res => {
-          if (res.code === 200) {
-            that.$message({ message: '删除成功', type: 'success' });
-            that.getData();
-          } else {
-            that.$message({ message: res.content, type: 'error' });
-          }
-        }).catch(err => {
-          that.$message({ message: err.message, type: 'error' });
-        })
-      })
-
-    },
+        };
+        that.$request
+          .deleteForm("/proxy_proxy/proxy_api/config/delete", params)
+          .then(res => {
+            if (res.code === 200) {
+              that.$message({ message: "删除成功", type: "success" });
+              that.getData();
+            } else {
+              that.$message({ message: res.content, type: "error" });
+            }
+          })
+          .catch(err => {
+            that.$message({ message: err.message, type: "error" });
+          });
+      });
+    }
   }
-}
+};
 </script>
 
 <style lang="less" scoped>
-#configManage {
+.configManageContainer {
   width: 98%;
   height: 100%;
+}
+#configManage {
+  width: 100%;
+  height: 100%;
 
   .functionBtn {
     margin-top: 1%;
   }
 
   .tableContent {
+    // max-height: 500px;
     margin-top: 1%;
 
     .pagination {

src/main.js

@@ -22,6 +22,5 @@ install(app, 'IconPark')
 import request from '@/util/request'
 app.config.globalProperties.$request = request;
 
-
 export default app
 

src/views/HomeView.vue

@@ -9,7 +9,6 @@
 
 <script>
 import { defineAsyncComponent } from "vue";
-import Router from "@/router";
 
 export default {
   name: 'HomeView',