From 587c4be2f5247ebdb9fca647080b60fe5cd3ef75 Mon Sep 17 00:00:00 2001
From: caoqi <cq@datametatech.com>
Date: Mon, 24 Feb 2025 14:51:34 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BF=AE=E6=94=B9=E6=A3=80=E6=B5=8B?=
 =?UTF-8?q?=E6=9C=8D=E5=8A=A1=E5=90=8D=E7=A7=B0=E7=9A=84=E6=AD=A3=E5=88=99?=
 =?UTF-8?q?=E8=A1=A8=E8=BE=BE=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../layerManage/resource/LayerDetails.vue     | 284 ++++--------------
 1 file changed, 61 insertions(+), 223 deletions(-)

diff --git a/src/views/aiSupervision/layerManage/resource/LayerDetails.vue b/src/views/aiSupervision/layerManage/resource/LayerDetails.vue
index 506b0f5..1ce08f2 100644
--- a/src/views/aiSupervision/layerManage/resource/LayerDetails.vue
+++ b/src/views/aiSupervision/layerManage/resource/LayerDetails.vue
@@ -17,208 +17,93 @@
         </div>
       </div>
       <div class="middle">
-        <el-button type="primary" plain @click="dialogFormVisible = true"
-          >添加图层</el-button
-        >
+        <el-button type="primary" plain @click="dialogFormVisible = true">添加图层</el-button>
         <el-dialog :title="dialogTitle" :visible.sync="dialogFormVisible">
           <el-tabs v-model="activeName" type="card">
             <el-tab-pane label="基础字段" name="1">
               <el-form :model="editDataInfoForm">
-                <el-form-item
-                  label="服务类型"
-                  style="font-size: 1rem"
-                  :label-width="'120px'"
-                >
-                  <el-select
-                    style="width: 80%"
-                    v-model="editDataInfoForm.serviceType"
-                    placeholder="请选择"
-                  >
-                    <el-option
-                      v-for="item in serviceTypeOptions"
-                      :key="item.value"
-                      :label="item.label"
-                      :value="item.value"
-                    />
+                <el-form-item label="服务类型" style="font-size: 1rem" :label-width="'120px'">
+                  <el-select style="width: 80%" v-model="editDataInfoForm.serviceType" placeholder="请选择">
+                    <el-option v-for="item in serviceTypeOptions" :key="item.value" :label="item.label"
+                      :value="item.value" />
                   </el-select>
                 </el-form-item>
 
-                <el-form-item
-                  label="服务名称"
-                  prop="serviceName"
-                  style="font-size: 1rem"
-                  :label-width="'120px'"
-                  placeholder="服务名称由两部分构成：数据服务url(如/iserver/services/data-supermap_shuili/rest);服务名称(如namespace:layer1)"
-                >
-                  <el-input
-                    v-model.trim="editDataInfoForm.serviceName"
-                    style="width: 80%"
-                  ></el-input>
+                <el-form-item label="服务名称" prop="serviceName" style="font-size: 1rem" :label-width="'120px'"
+                  v-if="editDataInfoForm.serviceType === '081100'"
+                  placeholder="服务名称由两部分构成：数据服务url(如/iserver/services/data-supermap_shuili/rest);服务名称(如namespace:layer1)">
+                  <el-input v-model.trim="editDataInfoForm.serviceName" style="width: 80%"></el-input>
                 </el-form-item>
-                <el-form-item
-                  label="服务别名"
-                  prop="serviceNameAlias"
-                  style="font-size: 1rem"
-                  :label-width="'120px'"
-                >
-                  <el-input
-                    v-model.trim="editDataInfoForm.serviceNameAlias"
-                    style="width: 80%"
-                  ></el-input>
+                <el-form-item label="服务类型" style="font-size: 1rem" :label-width="'120px'" v-else>
+                  <el-input v-model.trim="editDataInfoForm.serviceName" style="width: 80%"></el-input>
                 </el-form-item>
-                <el-form-item
-                  label="服务地址"
-                  prop="serviceUrl"
-                  style="font-size: 1rem"
-                  :label-width="'120px'"
-                >
-                  <el-input
-                    v-model.trim="editDataInfoForm.serviceUrl"
-                    style="width: 80%"
-                  ></el-input>
+                <el-form-item label="服务别名" prop="serviceNameAlias" style="font-size: 1rem" :label-width="'120px'">
+                  <el-input v-model.trim="editDataInfoForm.serviceNameAlias" style="width: 80%"></el-input>
                 </el-form-item>
-                <el-form-item
-                  label="服务token"
-                  prop="serviceToken"
-                  style="font-size: 1rem"
-                  :label-width="'120px'"
-                >
-                  <el-input
-                    v-model.trim="editDataInfoForm.serviceToken"
-                    style="width: 80%"
-                  ></el-input>
+                <el-form-item label="服务地址" prop="serviceUrl" style="font-size: 1rem" :label-width="'120px'">
+                  <el-input v-model.trim="editDataInfoForm.serviceUrl" style="width: 80%"></el-input>
                 </el-form-item>
-                <el-form-item
-                  v-if="editDataInfoForm.serviceType === '030300'"
-                  label="服务索引"
-                  prop="serviceIndex"
-                  style="font-size: 1rem"
-                  :label-width="'120px'"
-                >
-                  <el-input
-                    v-model="editDataInfoForm.serviceIndex"
-                    style="width: 80%"
-                  ></el-input>
+                <el-form-item label="服务token" prop="serviceToken" style="font-size: 1rem" :label-width="'120px'">
+                  <el-input v-model.trim="editDataInfoForm.serviceToken" style="width: 80%"></el-input>
                 </el-form-item>
-                <el-form-item
-                  v-show="['030300'].includes(editDataInfoForm.serviceType)"
-                  label="样式选择"
-                  style="font-size: 1rem"
-                  :label-width="'120px'"
-                >
+                <el-form-item v-if="editDataInfoForm.serviceType === '030300'" label="服务索引" prop="serviceIndex"
+                  style="font-size: 1rem" :label-width="'120px'">
+                  <el-input v-model="editDataInfoForm.serviceIndex" style="width: 80%"></el-input>
+                </el-form-item>
+                <el-form-item v-show="['030300'].includes(editDataInfoForm.serviceType)" label="样式选择"
+                  style="font-size: 1rem" :label-width="'120px'">
                   <div class="styleBtn">
-                    <el-tag
-                      type="info"
-                      effect="plain"
-                      class="style-button"
-                      :class="{
-                        'style-button-none': editDataInfoForm.relationStyleName,
-                      }"
-                      @click="handleLayerStyleTypeChange"
-                    >
+                    <el-tag type="info" effect="plain" class="style-button" :class="{
+                      'style-button-none': editDataInfoForm.relationStyleName,
+                    }" @click="handleLayerStyleTypeChange">
                       {{
                         editDataInfoForm.relationStyleName
                           ? editDataInfoForm.relationStyleName
                           : "点击选择样式"
                       }}
                     </el-tag>
-                    <el-button
-                      style="margin-left: 15px"
-                      :disabled="editDataInfoForm.relationStyleName === ''"
-                      @click="
-                        editDataInfoForm.relationStyleName = '';
-                        editDataInfoForm.relationStyleId = '';
-                      "
-                      >取消选择样式</el-button
-                    >
+                    <el-button style="margin-left: 15px" :disabled="editDataInfoForm.relationStyleName === ''" @click="
+                      editDataInfoForm.relationStyleName = '';
+                    editDataInfoForm.relationStyleId = '';
+                    ">取消选择样式</el-button>
                   </div>
-                  <styleListDialogVue
-                    :visible="styleDialogVisible"
-                    :$currentStyleId="editDataInfoForm.relationStyleId"
-                    @closeDialog="styleDialogVisible = false"
-                    @confirm="handleConfirm"
-                  ></styleListDialogVue>
+                  <styleListDialogVue :visible="styleDialogVisible" :$currentStyleId="editDataInfoForm.relationStyleId"
+                    @closeDialog="styleDialogVisible = false" @confirm="handleConfirm"></styleListDialogVue>
                 </el-form-item>
               </el-form>
             </el-tab-pane>
             <el-tab-pane label="扩展字段" name="2">
               <div class="fn-btns">
-                <el-button type="primary" class="btn" @click="addRow"
-                  >添加</el-button
-                >
-                <el-button type="danger" class="btn" @click="deleteRow"
-                  >删除</el-button
-                >
+                <el-button type="primary" class="btn" @click="addRow">添加</el-button>
+                <el-button type="danger" class="btn" @click="deleteRow">删除</el-button>
               </div>
-              <el-table
-                max-height="400px"
-                :data="extendTable"
-                border
-                @selection-change="handleSelectionChange"
-              >
-                <el-table-column
-                  type="selection"
-                  width="50"
-                  align="center"
-                ></el-table-column>
+              <el-table max-height="400px" :data="extendTable" border @selection-change="handleSelectionChange">
+                <el-table-column type="selection" width="50" align="center"></el-table-column>
                 <el-table-column prop="field" label="字段名称">
                   <template slot-scope="scope">
-                    <el-input
-                      v-model="scope.row.field"
-                      :disabled="!scope.row.isEdit"
-                    ></el-input>
+                    <el-input v-model="scope.row.field" :disabled="!scope.row.isEdit"></el-input>
                   </template>
                 </el-table-column>
                 <el-table-column prop="alias" label="别名">
                   <template slot-scope="scope">
-                    <el-input
-                      v-model="scope.row.alias"
-                      :disabled="!scope.row.isEdit"
-                    ></el-input>
+                    <el-input v-model="scope.row.alias" :disabled="!scope.row.isEdit"></el-input>
                   </template>
                 </el-table-column>
                 <el-table-column prop="value" label="字段值">
                   <template slot-scope="scope">
-                    <el-input
-                      v-model="scope.row.value"
-                      :disabled="!scope.row.isEdit"
-                    ></el-input>
+                    <el-input v-model="scope.row.value" :disabled="!scope.row.isEdit"></el-input>
                   </template>
                 </el-table-column>
                 <el-table-column label="操作" width="200">
                   <template slot-scope="scope">
-                    <el-button
-                      v-if="scope.row.isEdit"
-                      type="primary"
-                      icon="el-icon-success"
-                      size="mini"
-                      @click="saveRow(scope.$index)"
-                      >保存</el-button
-                    >
-                    <el-button
-                      v-if="scope.row.isEdit"
-                      type="warning"
-                      icon="el-icon-error"
-                      size="mini"
-                      @click="cancelRow(scope.$index)"
-                      >取消</el-button
-                    >
-                    <el-button
-                      v-if="!scope.row.isEdit"
-                      type="primary"
-                      icon="el-icon-edit"
-                      size="mini"
-                      @click="editRow(scope.$index)"
-                      >编辑</el-button
-                    >
-                    <el-button
-                      v-if="!scope.row.isEdit"
-                      type="danger"
-                      icon="el-icon-delete-solid"
-                      size="mini"
-                      @click="deleteRow(scope.$index)"
-                      >删除</el-button
-                    >
+                    <el-button v-if="scope.row.isEdit" type="primary" icon="el-icon-success" size="mini"
+                      @click="saveRow(scope.$index)">保存</el-button>
+                    <el-button v-if="scope.row.isEdit" type="warning" icon="el-icon-error" size="mini"
+                      @click="cancelRow(scope.$index)">取消</el-button>
+                    <el-button v-if="!scope.row.isEdit" type="primary" icon="el-icon-edit" size="mini"
+                      @click="editRow(scope.$index)">编辑</el-button>
+                    <el-button v-if="!scope.row.isEdit" type="danger" icon="el-icon-delete-solid" size="mini"
+                      @click="deleteRow(scope.$index)">删除</el-button>
                   </template>
                 </el-table-column>
               </el-table>
@@ -226,22 +111,13 @@
             <el-tab-pane label="字段配置" v-if="showFieldExtend()" name="3">
               <div class="field-box">
                 <div class="field-filter">
-                  <el-input
-                    class="keyword-input"
-                    placeholder="请输入搜索字段"
-                    v-model="fieldValue"
-                    clearable
-                  >
+                  <el-input class="keyword-input" placeholder="请输入搜索字段" v-model="fieldValue" clearable>
                   </el-input>
                   <el-button class="search-btn">搜索</el-button>
                 </div>
               </div>
               <el-table max-height="400px" :data="fieldsTable" border>
-                <el-table-column
-                  type="index"
-                  width="50"
-                  align="center"
-                ></el-table-column>
+                <el-table-column type="index" width="50" align="center"></el-table-column>
                 <el-table-column prop="field" label="字段名称">
                 </el-table-column>
                 <el-table-column prop="fieldName" label="字段别名">
@@ -251,18 +127,9 @@
                 </el-table-column>
                 <el-table-column prop="fieldType" label="字段类型">
                 </el-table-column>
-                <el-table-column
-                  prop="isShow"
-                  label="支持查询"
-                  width="80"
-                  align="center"
-                >
+                <el-table-column prop="isShow" label="支持查询" width="80" align="center">
                   <template slot-scope="scope">
-                    <el-checkbox
-                      v-model="scope.row.isShow"
-                      :true-label="1"
-                      :false-label="0"
-                    ></el-checkbox>
+                    <el-checkbox v-model="scope.row.isShow" :true-label="1" :false-label="0"></el-checkbox>
                   </template>
                 </el-table-column>
               </el-table>
@@ -271,34 +138,20 @@
 
           <div slot="footer" class="dialog-footer">
             <el-button @click="dialogFormVisible = false">取 消</el-button>
-            <el-button type="primary" @click="saveOrUpdateLayer"
-              >确 定</el-button
-            >
+            <el-button type="primary" @click="saveOrUpdateLayer">确 定</el-button>
           </div>
         </el-dialog>
         <div class="keyword-filter">
-          <el-input
-            class="keyword-input"
-            placeholder="请输入内容"
-            v-model="keyword"
-            clearable
-          >
+          <el-input class="keyword-input" placeholder="请输入内容" v-model="keyword" clearable>
           </el-input>
           <el-button class="search-btn">搜索</el-button>
         </div>
       </div>
       <div class="content">
         <el-table :data="tableData" stripe style="width: 100%">
-          <el-table-column
-            type="index"
-            :index="
-              (index) =>
-                index + (pageOptions.pageNum - 1) * pageOptions.pageSize + 1
-            "
-            label="序号"
-            width="50"
-            header-align="center"
-          ></el-table-column>
+          <el-table-column type="index" :index="(index) =>
+            index + (pageOptions.pageNum - 1) * pageOptions.pageSize + 1
+            " label="序号" width="50" header-align="center"></el-table-column>
           <el-table-column prop="id" label="图层资源目录编号" width="350">
           </el-table-column>
           <el-table-column prop="serviceNameAlias" label="图层资源名称">
@@ -307,28 +160,13 @@
           <el-table-column prop="createUser" label="创建人"> </el-table-column>
           <el-table-column label="操作">
             <template slot-scope="scope">
-              <el-button
-                size="mini"
-                @click="handleEdit(scope.$index, scope.row)"
-                >编辑</el-button
-              >
-              <el-button
-                size="mini"
-                type="danger"
-                @click="handleDelete(scope.row)"
-                >删除</el-button
-              >
+              <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
+              <el-button size="mini" type="danger" @click="handleDelete(scope.row)">删除</el-button>
             </template>
           </el-table-column>
         </el-table>
-        <el-pagination
-          background
-          layout="prev, pager, next"
-          :current-page.sync="pageOptions.pageNum"
-          :total="pageOptions.total"
-          :page-size="pageOptions.pageSize"
-          @current-change="getLayerList"
-        >
+        <el-pagination background layout="prev, pager, next" :current-page.sync="pageOptions.pageNum"
+          :total="pageOptions.total" :page-size="pageOptions.pageSize" @current-change="getLayerList">
         </el-pagination>
       </div>
     </el-container>
@@ -519,7 +357,7 @@ export default {
       });
     },
     async saveOrUpdateLayer() {
-      const reg = /^(?=.{1,100}$)[\u4e00-\u9fa5\w:]+$/;
+      const reg = /^(?=.{1,100}$)[\u4e00-\u9fa5\w:./-;]+$/;
       if (!reg.test(this.editDataInfoForm.serviceName)) {
         this.$message({
           type: "info",