发现规则

src/components/collapseView/index.vue

@@ -31,7 +31,7 @@ const addClick = (item) => {
 const viewClick = (item, index) => {
   const { isView, list } = item
   if (isView) {
-    emit("view", item);
+    emit("view", {item: item, index: index});
   } else {
     if(list.length <= 0) return
     emit("view", index);
@@ -79,7 +79,7 @@ const childDelete = (item) => {
             </el-icon>
           </div>
           <div class="name">{{ item.dataarea }}</div>
-          <el-icon color="rgba(212, 48, 48, 1)" :size="16" v-if="item.isDelete" @click.stop="mainDeletion(item)"
+          <el-icon color="rgba(212, 48, 48, 1)" :size="16" v-if="item.isDelete && fatherIndex === index" @click.stop="mainDeletion(item)"
             style="margin-right: 17px;">
             <circle-close-filled />
           </el-icon>

src/views/ruleConfig/Discover/modules/AddDomain.vue

@@ -116,18 +116,20 @@ watch(
 
 <template>
   <div>
-    <el-form ref="formRef" :model="form" :rules="rules" label-width="100px" :disabled="readOnly">
+    <el-form ref="formRef" :model="form" :rules="rules" label-width="110px" :disabled="readOnly">
+      <div class="formBox">
         <el-form-item label="数据域名称" prop="dataarea" required>
         <el-input v-model="form.dataarea" :placeholder="!readOnly ? '请输入数据域名称' : ''"></el-input>
         </el-form-item>
         <el-form-item label="备注">
           <el-input type="textarea" rows="4" v-model="form.remark" :placeholder="!readOnly ? '请输入备注' : ''"></el-input>
         </el-form-item>
+      </div>
     </el-form>
     <div class="btn">
-      <el-button type="primary" style="width: 150px;" @click="readOnly = false" v-if="readOnly">编辑</el-button>
-      <el-button type="info" style="width: 150px;" @click="cancel" v-if="!readOnly">取消</el-button>
-      <el-button type="primary" style="width: 150px;" @click="confirm" v-if="!readOnly">确认</el-button>
+      <el-button type="primary" style="width: 80px;" @click="readOnly = false" v-if="readOnly">编辑</el-button>
+      <el-button type="primary" style="width: 80px;" @click="confirm" v-if="!readOnly">确认</el-button>
+      <el-button style="width: 80px;" @click="cancel" v-if="!readOnly">取消</el-button>
     </div>
   </div>
 </template>

src/views/ruleConfig/Discover/modules/AddRules.vue

 <script setup lang="ts" name="AddRules">
 import { onMounted, reactive, ref, toRefs, watch } from "vue";
-import { Switch } from "view-ui-plus";
 import type { FormInstance } from "element-plus";
 import { ElMessage } from "element-plus";
 import { getDictinaryTypes } from "@/api/ruleConfig/discover";
@@ -107,7 +106,7 @@ const reset = () => {
     matchingway: "",
     defaulttype: "0",
     remark: "",
-    testString: ""
+    testString: "",
   };
 };
 
@@ -174,7 +173,7 @@ const testRegexFun = () => {
     discoverway: discoverway,
     matchingway: matchingway,
     regex: regex,
-    subRuleidList: subRuleidList.value
+    subRuleidList: subRuleidList.value,
     testString: ruleexample,
   };
   formRef.value?.validate((valid) => {
@@ -237,32 +236,43 @@ onMounted(() => {
 
 <template>
   <div>
-    <el-form ref="formRef" :model="form" :rules="rules" label-width="110px" :disabled="readOnly">
+    <el-form ref="formRef" :model="form" :rules="rules" label-width="110px" :disabled="readOnly" :label-position="props.type === 'add'?'left':''">
+      <div class="formBox">
+        <el-form-item label="数据域" v-if="props.type === 'add'">
+          <div style="color: rgba(33, 103, 217, 1);" v-if="!readOnly">{{ form.type }}</div>
+        </el-form-item>
         <el-form-item label="发现规则名" prop="name" required>
           <el-input v-model="form.name" :placeholder="!readOnly ? '请输入发现规则名' : ''"></el-input>
         </el-form-item>
-      <el-form-item label="数据域">
-        <div>{{ form.type }}</div>
+        <el-form-item label="数据域" v-if="props.type === 'edit'">
+          <div style="margin-left: 10px;" v-if="!readOnly">{{ form.type }}</div>
+          <div class="is-disabled" v-if="readOnly" style="width: 100%;height: 100%;">
+            <div class="el-input__wrapper" style="height: 100%;color: rgb(53, 64, 79);">{{ form.type }}</div>
+          </div>
         </el-form-item>
         <el-form-item label="发现方式" prop="flag" required>
-        <div style="width: 100%;background: #F3F5FA;">
+          <div style="width: 100%;background: #F3F5FA;" v-if="!readOnly">
             <el-select v-model="form.flag">
               <el-option v-for="item in discoverTypeList" :key="item.value" :label="item.label" :value="item.value">
               </el-option>
             </el-select>
           </div>
+          <div class="is-disabled" v-if="readOnly" style="width: 100%;height: 100%;">
+            <div class="el-input__wrapper" v-for="(item,index) in discoverTypeList.filter(f => f.value === form.flag)"
+              :key="index" style="height: 100%;color: rgb(53, 64, 79);">{{ item.label }}</div>
+          </div>
         </el-form-item>
         <el-form-item label="发现规则类型">
-        <el-radio-group v-model="form.discoverway" v-if="!readOnly">
+          <el-radio-group style="margin-left: 10px;" v-model="form.discoverway" v-if="!readOnly">
             <el-radio :label="item.value"
               v-for="(item,index) in form.flag !== '1' ? singleDiscoverRuleType : singleDiscoverRuleType.slice(0,1)"
               :key="index">{{ item.label }}</el-radio>
           </el-radio-group>
-        <el-radio-group v-model="form.discoverway" v-if="readOnly">
-          <el-radio :label="item.value"
-            v-for="(item,index) in singleDiscoverRuleType.filter(f => f.value=== form.discoverway)"
-            :key="index">{{ item.label }}</el-radio>
-        </el-radio-group>
+          <div class="is-disabled" v-if="readOnly" style="width: 100%;height: 100%;">
+            <div class="el-input__wrapper"
+              v-for="(item,index) in singleDiscoverRuleType.filter(f => f.value === form.discoverway)" :key="index"
+              style="height: 100%;color: rgb(53, 64, 79);">{{ item.label }}</div>
+          </div>
         </el-form-item>
         <el-form-item label="正则表达式" prop="regex" required
           :rules="[{ required: true, message: '请输入正则表达式', trigger:'blur' }]" v-if="form.discoverway === '01'">
@@ -294,27 +304,28 @@ onMounted(() => {
         <el-form-item label="测试">
           <div style="width: 100%;display: flex;align-items: center;">
             <el-input v-model="form.testString" style="flex: 1;" :placeholder="!readOnly ? '请输入测试' : ''"></el-input>
-          <el-button type="primary" @click="testRegexFun">测试</el-button>
+            <el-button type="primary" v-if="!readOnly" @click="testRegexFun">测试</el-button>
+          </div>
+        </el-form-item>
+        <el-form-item label="默认规则">
+          <div class="is-disabled" v-if="readOnly" style="width: 100%;height: 100%;">
+            <div class="el-input__wrapper" style="height: 100%;color: rgb(53, 64, 79);">
+              {{ form.defaulttype === '1' ? '是':'否' }}</div>
           </div>
+          <el-radio-group v-model="form.defaulttype" v-if="!readOnly" style="margin-left: 10px;">
+            <el-radio label="0">否</el-radio>
+            <el-radio label="1">是</el-radio>
+          </el-radio-group>
         </el-form-item>
         <el-form-item label="备注">
           <el-input v-model="form.remark" :placeholder="!readOnly ? '请输入备注' : ''"></el-input>
         </el-form-item>
-      <el-form-item label="默认规则">
-        <Switch true-value="1" false-value="0" v-model="form.defaulttype" :disabled="readOnly">
-          <template #open>
-            <span>是</span>
-          </template>
-          <template #close>
-            <span>否</span>
-          </template>
-        </Switch>
-      </el-form-item>
+      </div>
     </el-form>
     <div class="btn">
-      <el-button type="primary" style="width: 150px;" @click="readOnly = false" v-if="readOnly">编辑</el-button>
-      <el-button type="info" style="width: 150px;" @click="cancel" v-if="!readOnly">取消</el-button>
-      <el-button type="primary" style="width: 150px;" @click="confirm" v-if="!readOnly">确认</el-button>
+      <el-button type="primary" style="width: 80px;" @click="readOnly = false" v-if="readOnly">编辑</el-button>
+      <el-button type="primary" style="width: 80px;" @click="confirm" v-if="!readOnly">确认</el-button>
+      <el-button style="width: 80px;" @click="cancel" v-if="!readOnly">取消</el-button>
     </div>
 
     <Modal v-model="modalData.show" :icon="modalData.icon" :cancel="false" :text="modalData.text"
@@ -324,7 +335,7 @@ onMounted(() => {
 
 <style lang="scss" scoped>
 .el-form-item {
-  margin-bottom: 8px;
+  margin-bottom: 20px;
 }
 .btn {
   padding: 20px;