feat:格式化

2025-12-07 01:46:48 +08:00 · 2025-04-14 19:50:49 +08:00
parent e4b3f2f4c7
commit 78fdd51de8
5 changed files with 268 additions and 200 deletions
--- a/src/views/knowledge/detail/components/words/Index.vue
+++ b/src/views/knowledge/detail/components/words/Index.vue
@@ -7,8 +7,45 @@
      <!-- 自动题词 -->
      <li class="flex" :class="activeIndex === index ? 'active' : ''" v-for="(item, index) in splitOptions" :key="index" @click="handleClick(index)">
        <div>
-          <svg v-if="index === 0" t="1744335709188" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2464" width="32" height="32"><path d="M933.868272 511.691752a140.807706 140.807706 0 0 1 90.131728-131.067068 525.562914 525.562914 0 0 0-57.334136-138.64997 139.882962 139.882962 0 0 1-184.948826-184.948826A525.562914 525.562914 0 0 0 643.067068 0a140.376159 140.376159 0 0 1-262.134136 0A525.562914 525.562914 0 0 0 242.282962 57.334136a139.882962 139.882962 0 0 1-184.948826 184.948826A506.698134 506.698134 0 0 0 0 380.932932a140.376159 140.376159 0 0 1 0 262.134136 525.562914 525.562914 0 0 0 57.334136 138.64997 139.882962 139.882962 0 0 1 184.948826 184.948826 525.562914 525.562914 0 0 0 138.64997 57.334136 140.376159 140.376159 0 0 1 262.134136 0 525.562914 525.562914 0 0 0 138.64997-57.334136 139.882962 139.882962 0 0 1 184.948826-184.948826 506.698134 506.698134 0 0 0 57.334136-138.64997A140.807706 140.807706 0 0 1 933.868272 511.691752zM511.691752 652.437809A140.437809 140.437809 0 1 1 652.437809 511.691752 140.499458 140.499458 0 0 1 511.691752 652.437809z" fill="#1D85ED" p-id="2465"></path></svg>
-          <svg v-if="index === 1" t="1744335834635" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7994" width="32" height="32"><path d="M746 181.1c10.3 0 19.4 6.1 23.3 15.6l1 2.3 1.2 2.2 110.4 210c2.9 8.6 0.9 18.3-5.3 25l-0.6 0.7-0.6 0.7-344.5 401.9c-6.4 6.7-14.1 7.7-18.2 7.7s-11.7-1-18.2-7.7L150.1 437.6l-0.6-0.7-0.6-0.7c-6.2-6.8-8.2-16.4-5.3-25l110.4-210 1.2-2.2 1-2.3c3.9-9.5 13.1-15.6 23.3-15.6H746m0-54.6H279.4c-32.3 0-61.4 19.5-73.8 49.3L93.8 388.7c-11.9 28.7-6 61.6 14.9 84.4l345.2 402.7c15.8 17.3 37.3 25.9 58.9 25.9 21.5 0 43-8.6 58.9-25.9l345.2-402.7c20.9-22.9 26.8-55.8 14.9-84.4l-112-212.9c-12.3-29.8-41.5-49.3-73.8-49.3z" p-id="7995" fill="#d81e06"></path><path d="M513.9 524.6c-19.1 0-37.5-8.1-50.4-22.2l-97.7-106.7c-10.2-11.1-9.4-28.4 1.7-38.5 11.1-10.2 28.4-9.4 38.5 1.7l97.7 106.7c3.6 3.9 7.9 4.5 10.2 4.5 2.3 0 6.6-0.6 10.2-4.5l95.5-104.2c10.2-11.1 27.4-11.9 38.5-1.7 11.1 10.2 11.9 27.4 1.7 38.5l-95.5 104.2c-13 14.1-31.3 22.2-50.4 22.2z" p-id="7996" fill="#d81e06"></path></svg>
+          <svg
+            v-if="index === 0"
+            t="1744335709188"
+            class="icon"
+            viewBox="0 0 1024 1024"
+            version="1.1"
+            xmlns="http://www.w3.org/2000/svg"
+            p-id="2464"
+            width="32"
+            height="32"
+          >
+            <path
+              d="M933.868272 511.691752a140.807706 140.807706 0 0 1 90.131728-131.067068 525.562914 525.562914 0 0 0-57.334136-138.64997 139.882962 139.882962 0 0 1-184.948826-184.948826A525.562914 525.562914 0 0 0 643.067068 0a140.376159 140.376159 0 0 1-262.134136 0A525.562914 525.562914 0 0 0 242.282962 57.334136a139.882962 139.882962 0 0 1-184.948826 184.948826A506.698134 506.698134 0 0 0 0 380.932932a140.376159 140.376159 0 0 1 0 262.134136 525.562914 525.562914 0 0 0 57.334136 138.64997 139.882962 139.882962 0 0 1 184.948826 184.948826 525.562914 525.562914 0 0 0 138.64997 57.334136 140.376159 140.376159 0 0 1 262.134136 0 525.562914 525.562914 0 0 0 138.64997-57.334136 139.882962 139.882962 0 0 1 184.948826-184.948826 506.698134 506.698134 0 0 0 57.334136-138.64997A140.807706 140.807706 0 0 1 933.868272 511.691752zM511.691752 652.437809A140.437809 140.437809 0 1 1 652.437809 511.691752 140.499458 140.499458 0 0 1 511.691752 652.437809z"
+              fill="#1D85ED"
+              p-id="2465"
+            ></path>
+          </svg>
+          <svg
+            v-if="index === 1"
+            t="1744335834635"
+            class="icon"
+            viewBox="0 0 1024 1024"
+            version="1.1"
+            xmlns="http://www.w3.org/2000/svg"
+            p-id="7994"
+            width="32"
+            height="32"
+          >
+            <path
+              d="M746 181.1c10.3 0 19.4 6.1 23.3 15.6l1 2.3 1.2 2.2 110.4 210c2.9 8.6 0.9 18.3-5.3 25l-0.6 0.7-0.6 0.7-344.5 401.9c-6.4 6.7-14.1 7.7-18.2 7.7s-11.7-1-18.2-7.7L150.1 437.6l-0.6-0.7-0.6-0.7c-6.2-6.8-8.2-16.4-5.3-25l110.4-210 1.2-2.2 1-2.3c3.9-9.5 13.1-15.6 23.3-15.6H746m0-54.6H279.4c-32.3 0-61.4 19.5-73.8 49.3L93.8 388.7c-11.9 28.7-6 61.6 14.9 84.4l345.2 402.7c15.8 17.3 37.3 25.9 58.9 25.9 21.5 0 43-8.6 58.9-25.9l345.2-402.7c20.9-22.9 26.8-55.8 14.9-84.4l-112-212.9c-12.3-29.8-41.5-49.3-73.8-49.3z"
+              p-id="7995"
+              fill="#d81e06"
+            ></path>
+            <path
+              d="M513.9 524.6c-19.1 0-37.5-8.1-50.4-22.2l-97.7-106.7c-10.2-11.1-9.4-28.4 1.7-38.5 11.1-10.2 28.4-9.4 38.5 1.7l97.7 106.7c3.6 3.9 7.9 4.5 10.2 4.5 2.3 0 6.6-0.6 10.2-4.5l95.5-104.2c10.2-11.1 27.4-11.9 38.5-1.7 11.1 10.2 11.9 27.4 1.7 38.5l-95.5 104.2c-13 14.1-31.3 22.2-50.4 22.2z"
+              p-id="7996"
+              fill="#d81e06"
+            ></path>
+          </svg>
        </div>
        <div class="block">
          <h3>{{ item.title }}</h3>
@@ -18,15 +55,12 @@
      </li>
    </ul>
    <!-- 弹窗组件 -->
-    <custom-split-dialog
-      class="active"
-      ref="customTable">
-    </custom-split-dialog>
+    <custom-split-dialog class="active" ref="customTable"> </custom-split-dialog>
  </div>
 </template>

 <script>
-import CustomSplitDialog from './CustomWords.vue';
+import CustomSplitDialog from './CustomWords.vue'

 export default {
  name: 'splitConfig',
@@ -58,7 +92,7 @@ export default {
  filters: {},
  methods: {
    handleClick(index) {
-      this.activeIndex = index;
+      this.activeIndex = index
      if (index === 1) {
        this.$refs.customTable.init()
      } else {
@@ -72,7 +106,7 @@ export default {
 }
 </script>

-<style scoped lang='scss'>
+<style scoped lang="scss">
 .splitConfig {
  .title {
    font-size: 15px;
@@ -95,21 +129,20 @@ export default {
        font-size: 14px;
        color: #666;
      }
-      .block{
+      .block {
        margin-left: 20px;
        h3 {
          margin-bottom: 20px;
          font-size: 18px;
          color: #333;
        }
-        .tips{
-          color: #9E9E9E;
-        }
-
+        .tips {
+          color: #9e9e9e;
        }
      }
-    .active{
-      border: 1px solid #409EFF;
+    }
+    .active {
+      border: 1px solid #409eff;
    }
  }
 }
--- a/src/views/rules/Index.vue
+++ b/src/views/rules/Index.vue
@@ -1,47 +1,59 @@
 <script>
-import { deleteRule, getRuleList } from "@/api/rules/index";
-import EditPromptRule from "./components/edit-prompt-rule/Index.vue";
-import EditSplitRule from "./components/edit-split-rule/Index.vue";
-import AddRules from "./components/add-rules/index.vue";
-import Info from "./components/info/index.vue";
-import { h } from "vue";
+import { deleteRule, getRuleList } from '@/api/rules/index'
+import EditPromptRule from './components/edit-prompt-rule/Index.vue'
+import EditSplitRule from './components/edit-split-rule/Index.vue'
+import AddRules from './components/add-rules/index.vue'
+import Info from './components/info/index.vue'
+import { h } from 'vue'

 export default {
-  name: "rules",
+  name: 'rules',
  data() {
    return {
      columns: [],
      tableConfig: {
        columns: [
-          { prop: "ruleName", key: "规则名称" },
-          { prop: "ruleType", key: "规则类型" },
-          { prop: "createdDate", key: "创建时间" },
+          { prop: 'ruleName', key: '规则名称' },
+          { prop: 'ruleType', key: '规则类型' },
+          { prop: 'createdDate', key: '创建时间' },
          {
-            key: "操作",
+            key: '操作',
            render: (h, params) => {
-              return h("div", [
-                h("el-button", {
-                  props: { type: "text", size: "mini" },
+              return h('div', [
+                h(
+                  'el-button',
+                  {
+                    props: { type: 'text', size: 'mini' },
                    on: { click: () => this.handleInfoVisiable(params.row) }
-                }, "查看详情"),
-                h("el-button", {
-                  props: { type: "text", size: "mini" },
+                  },
+                  '查看详情'
+                ),
+                h(
+                  'el-button',
+                  {
+                    props: { type: 'text', size: 'mini' },
                    on: { click: () => this.handleEdit(params.row) }
-                }, "修改"),
-                h("el-button", {
-                  props: { type: "text", size: "mini" },
+                  },
+                  '修改'
+                ),
+                h(
+                  'el-button',
+                  {
+                    props: { type: 'text', size: 'mini' },
                    on: { click: () => this.handleDelete(params.row, params.index) }
-                }, "删除")
-              ]);
+                  },
+                  '删除'
+                )
+              ])
            }
          }
        ]
      },
      // 弹窗配置
      dialogOptions: {
-        title: "",
+        title: '',
        visible: false,
-        width: "50%",
+        width: '50%',
        currentComponent: void 0,
        currentRow: void 0
      },
@@ -53,17 +65,17 @@ export default {
      form: {
        query: true,
        pickerOptions: void 0,
-        ruleType: "",
-        ruleName: "",
+        ruleType: '',
+        ruleName: '',
        createdDate: []
      }
-    };
+    }
  },
  provide() {
    return {
      dialogOptions: this.dialogOptions,
      tableData: this.tableData
-    };
+    }
  },
  components: {
    EditPromptRule,
@@ -74,130 +86,129 @@ export default {
  computed: {
    // 当前的分页数据
    currentTableDate() {
-      let filteredData;
+      let filteredData
      // 过滤 table 列表,如果 form 相关项是空的，就不过滤
      if (this.form.query) {
        // 过滤 ruleType
        const map = {
-          1: "提示词规则",
-          2: "知识拆分规则"
-        };
+          1: '提示词规则',
+          2: '知识拆分规则'
+        }
        filteredData = this.tableData.filter(item => {
-          if (!this.form.ruleType) return true;
-          return map[item.ruleType] === this.form.ruleType;
-        });
+          if (!this.form.ruleType) return true
+          return map[item.ruleType] === this.form.ruleType
+        })

        // 过滤 ruleName
        filteredData = filteredData.filter(item => {
-          if (!this.form.ruleName) return true;
-          return item.ruleName === this.form.ruleName;
-        });
+          if (!this.form.ruleName) return true
+          return item.ruleName === this.form.ruleName
+        })

        // 过滤 createdDate
        filteredData = filteredData.filter(item => {
-          if (!this.form.createdDate.length) return true;
-          return item.createdDate >= this.form.createdDate[0] && item.createdDate <= this.form.createdDate[1];
-        });
+          if (!this.form.createdDate.length) return true
+          return item.createdDate >= this.form.createdDate[0] && item.createdDate <= this.form.createdDate[1]
+        })
      } else {
-        filteredData = this.tableData;
+        filteredData = this.tableData
      }

      // TODO: 分页数据
-      const start = (this.currentPage - 1) * 10;
-      const end = this.currentPage * 10;
+      const start = (this.currentPage - 1) * 10
+      const end = this.currentPage * 10

-      return filteredData.slice(start, end);
+      return filteredData.slice(start, end)
    },
    getTableData() {
      // 需要处理 规则类型， 因为规则类型都是数字，需要转换成中文
      return this.currentTableDate.map(item => ({
        ...item,
-        ruleType: item.ruleType === 1 ? "提示词规则" : "知识拆分规则"
-      }));
+        ruleType: item.ruleType === 1 ? '提示词规则' : '知识拆分规则'
+      }))
    },
    // 查询表单的 ruleTypeOptions
    ruleTypeOptions() {
      const map = {
-        1: "提示词规则",
-        2: "知识拆分规则"
-      };
+        1: '提示词规则',
+        2: '知识拆分规则'
+      }
      // 去重所有 ruleType， 然后映射成 option
-      return [...new Set(this.tableData.map(item => item.ruleType))].map(type => map[type]);
+      return [...new Set(this.tableData.map(item => item.ruleType))].map(type => map[type])
    },
    // 查询表单的 ruleNameOptions
    ruleNameOptions() {
-      const res = [...new Set(this.tableData.map(item => item.ruleName))];
-      return res;
+      const res = [...new Set(this.tableData.map(item => item.ruleName))]
+      return res
    }
  },
  watch: {
    form: {
-      handler() {
-      },
+      handler() {},
      deep: true
    }
  },
  beforeMount() {
    getRuleList().then(res => {
-      const { content } = res.content;
+      const { content } = res.content

-      this.tableData = content.list;
-    });
+      this.tableData = content.list
+    })
  },
  methods: {
    handleCurrentChange(val) {
-      this.currentPage = val;
+      this.currentPage = val
    },
    // 处理查看规则详情
    handleInfoVisiable(row) {
-      this.dialogOptions.title = "查看规则详情";
-      this.dialogOptions.currentComponent = "Info";
-      this.dialogOptions.visible = true;
-      this.dialogOptions.currentRow = row;
+      this.dialogOptions.title = '查看规则详情'
+      this.dialogOptions.currentComponent = 'Info'
+      this.dialogOptions.visible = true
+      this.dialogOptions.currentRow = row
    },
    // 处理修改规则
    handleEdit(row, index) {
-      this.dialogOptions.title = "修改规则";
-      this.dialogOptions.currentComponent = row.ruleType === "知识拆分规则" ? "EditPromptRule" : "EditSplitRule";
-      this.dialogOptions.visible = true;
-      this.dialogOptions.currentRow = row;
+      this.dialogOptions.title = '修改规则'
+      this.dialogOptions.currentComponent = row.ruleType === '知识拆分规则' ? 'EditPromptRule' : 'EditSplitRule'
+      this.dialogOptions.visible = true
+      this.dialogOptions.currentRow = row
    },
    // 处理删除规则
    handleDelete(row, index) {
      deleteRule([row.id])
        .then(() => {
          // 删除当前行
-          this.tableData.splice(index, 1);
+          this.tableData.splice(index, 1)
        })
        .catch(err => {
          this.$notify.error({
-            title: "删除失败",
-            message: h("i", { style: "color: teal" }, "删除时出现错误，稍后再试" + err)
-          });
-        });
+            title: '删除失败',
+            message: h('i', { style: 'color: teal' }, '删除时出现错误，稍后再试' + err)
+          })
+        })
    },
    // 处理查询
    handleQuery() {
-      this.form.query = true;
+      this.form.query = true
    },
    // 处理重置
    handleReset() {
      this.form = {
        query: true,
        pickerOptions: void 0,
-        ruleType: "",
-        ruleName: "",
+        ruleType: '',
+        ruleName: '',
        createdDate: []
-      };
+      }
    },
    // 处理新增
    handleAdd() {
-      this.dialogOptions.title = "新增规则";
-      this.dialogOptions.visible = true;
-      this.dialogOptions.currentComponent = "AddRules";
+      this.dialogOptions.title = '新增规则'
+      this.dialogOptions.visible = true
+      this.dialogOptions.currentComponent = 'AddRules'
    }
  }
-};
+}
 </script>

 <template>
@@ -214,7 +225,7 @@ export default {
          <el-row>
            <!-- 规则类型 -->
            <el-col :span="8">
-              <el-form-item label="规则类型" >
+              <el-form-item label="规则类型">
                <el-select v-model="form.ruleType" placeholder="请选择规则类型">
                  <el-option v-for="item in ruleTypeOptions" :key="item" :label="item" :value="item"></el-option>
                </el-select>
@@ -231,9 +242,15 @@ export default {
            <!-- 创建时间 -->
            <el-col :span="8">
              <el-form-item label="创建时间">
-                <el-date-picker v-model="form.createdDate" type="daterange" unlink-panels range-separator="至"
-                                start-placeholder="开始日期" end-placeholder="结束日期"
-                                :picker-options="form.pickerOptions">
+                <el-date-picker
+                  v-model="form.createdDate"
+                  type="daterange"
+                  unlink-panels
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  :picker-options="form.pickerOptions"
+                >
                </el-date-picker>
              </el-form-item>
            </el-col>
@@ -256,8 +273,14 @@ export default {
      <!-- 分页 -->
      <el-row>
        <el-col :span="24" class="flex" style="justify-content: right;">
-          <el-pagination background layout="prev, pager, next" @current-change="handleCurrentChange"
-                         :current-page="currentPage" :hide-on-single-page="true" :total="tableData.length">
+          <el-pagination
+            background
+            layout="prev, pager, next"
+            @current-change="handleCurrentChange"
+            :current-page="currentPage"
+            :hide-on-single-page="true"
+            :total="tableData.length"
+          >
          </el-pagination>
        </el-col>
      </el-row>
@@ -265,8 +288,14 @@ export default {
    <!-- 规则详情弹窗 -->
    <el-drawer :visible.sync="dialogOptions.visible" size="50%" :title="dialogOptions.title">
      <!-- diglog 弹窗内容组件 -->
-      <component class="container" v-if="dialogOptions.visible" :is="dialogOptions.currentComponent" :data="tableData"
-                 :columns="columns" :currentRow="dialogOptions.currentRow" />
+      <component
+        class="container"
+        v-if="dialogOptions.visible"
+        :is="dialogOptions.currentComponent"
+        :data="tableData"
+        :columns="columns"
+        :currentRow="dialogOptions.currentRow"
+      />
    </el-drawer>
  </div>
 </template>
--- a/src/views/rules/components/add-rules/index.vue
+++ b/src/views/rules/components/add-rules/index.vue
@@ -20,15 +20,15 @@ export default {
  data() {
    return {
      activeName: 'first'
-    };
+    }
  },
  methods: {
    handleClick(tab, event) {
-      console.log(tab, event);
+      console.log(tab, event)
    }
  },
  beforeMount() {
-    console.log('add-rules beforeMount');
+    console.log('add-rules beforeMount')
  }
-};
+}
 </script>
--- a/src/views/rules/components/edit-prompt-rule/Index.vue
+++ b/src/views/rules/components/edit-prompt-rule/Index.vue
@@ -1,38 +1,38 @@
 <script>
-import { addPromptRule, getRuleDetail, updatePromptRule } from "@/api/rules/index";
+import { addPromptRule, getRuleDetail, updatePromptRule } from '@/api/rules/index'

 export default {
-  name: "EditPromptRule",
+  name: 'EditPromptRule',
  data() {
    return {
      // 规则名称、属性、属性描述、关键词、题词示例、提示词
      form: {
-        id: "",
-        ruleName: "",
-        createdDate: "",
+        id: '',
+        ruleName: '',
+        createdDate: '',
        ruleType: 2,
        ruleList: []
      }
-    };
+    }
  },
  props: {
    type: {
      type: String,
-      default: "edit"
+      default: 'edit'
    }
  },
-  inject: ["dialogOptions", "tableData"],
+  inject: ['dialogOptions', 'tableData'],
  methods: {
    handleAdd() {
      const payload = {
-        attribute: "",
-        attributeDesc: "",
-        keyword: "",
-        example: "",
-        prompt: ""
-      };
+        attribute: '',
+        attributeDesc: '',
+        keyword: '',
+        example: '',
+        prompt: ''
+      }

-      this.form.ruleList.push(payload);
+      this.form.ruleList.push(payload)
    },
    /**
     * 删除数据列表
@@ -41,68 +41,68 @@ export default {
    handleDelete(index) {
      if (index !== undefined) {
        // 确保 index 是数字
-        const numIndex = Number(index);
+        const numIndex = Number(index)
        if (!isNaN(numIndex)) {
-          this.form.ruleList.splice(numIndex, 1);
+          this.form.ruleList.splice(numIndex, 1)
        }
      }
    },
    save() {
-      console.log("save this form ", this.form);
+      console.log('save this form ', this.form)

      // 判断是新增还是更新，新增调用 addPromptRule，更新调用 updatePromptRule
-      if (this.type === "add") {
+      if (this.type === 'add') {
        // 配置对应表单
        // 添加时，需要删除 id
-        delete this.form.id;
+        delete this.form.id
        // 删除 createdDate
-        delete this.form.createdDate;
+        delete this.form.createdDate
        // 更新ruleType
-        this.form.ruleType = 2;
+        this.form.ruleType = 2

        addPromptRule(this.form)
          .then(() => {
-            this.dialogOptions.visible = false;
+            this.dialogOptions.visible = false
            // 可以添加成功提示
-            this.$message && this.$message.success("保存成功");
+            this.$message && this.$message.success('保存成功')

            // 向 tableData 最上面添加数据
-            this.tableData.unshift(this.form);
+            this.tableData.unshift(this.form)
          })
          .catch(err => {
-            console.error(`add prompt rule failed: ${err}`);
+            console.error(`add prompt rule failed: ${err}`)
            // 可以添加错误提示
-            this.$message && this.$message.error("保存失败");
-          });
+            this.$message && this.$message.error('保存失败')
+          })
      } else {
        updatePromptRule(this.form)
          .then(() => {
-            console.log("update prompt rule success");
-            this.dialogOptions.visible = false;
+            console.log('update prompt rule success')
+            this.dialogOptions.visible = false
            // 可以添加成功提示
-            this.$message && this.$message.success("保存成功");
+            this.$message && this.$message.success('保存成功')
          })
          .catch(err => {
-            console.error(`update prompt rule failed: ${err}`);
+            console.error(`update prompt rule failed: ${err}`)
            // 可以添加错误提示
-            this.$message && this.$message.error("保存失败");
-          });
+            this.$message && this.$message.error('保存失败')
+          })
      }
    }
  },
  beforeMount() {
    // 如果是新增，不去请求接口
-    if (this.type === "add") {
-      return;
+    if (this.type === 'add') {
+      return
    }
    // 获取当前行数据
-    const { currentRow } = this.dialogOptions;
+    const { currentRow } = this.dialogOptions

    // 获取规则详情
    getRuleDetail(currentRow.id)
      .then(res => {
-        const { content } = res.content;
-        console.log("origin query request", content);
+        const { content } = res.content
+        console.log('origin query request', content)

        // 一次性设置表单数据，确保响应式更新
        this.form = {
@@ -111,13 +111,13 @@ export default {
          ruleName: content.ruleName,
          createdDate: content.createdDate,
          ruleList: Array.isArray(content.ruleList) ? content.ruleList : []
-        };
+        }
      })
      .catch(err => {
-        console.error("获取规则详情失败:", err);
-      });
+        console.error('获取规则详情失败:', err)
+      })
  }
-};
+}
 </script>

 <template>
@@ -129,8 +129,12 @@ export default {

      <el-card>
        <el-tabs closable @tab-remove="handleDelete">
-          <el-tab-pane v-for="(item, index) in form.ruleList" :name="index.toString()" :key="index"
-                       :label="item.attribute ? item.attribute : `未命名${index + 1}`">
+          <el-tab-pane
+            v-for="(item, index) in form.ruleList"
+            :name="index.toString()"
+            :key="index"
+            :label="item.attribute ? item.attribute : `未命名${index + 1}`"
+          >
            <el-form-item label="属性">
              <el-input v-model="item.attribute"></el-input>
            </el-form-item>
--- a/src/views/rules/components/edit-split-rule/Index.vue
+++ b/src/views/rules/components/edit-split-rule/Index.vue
@@ -1,63 +1,63 @@
 <script>
-import { addSplitRule, getRuleDetail, updateSplitRule } from "@/api/rules/index";
+import { addSplitRule, getRuleDetail, updateSplitRule } from '@/api/rules/index'

 export default {
-  name: "EditSplitRule",
+  name: 'EditSplitRule',
  data() {
    return {
      // 表单数据有：规则名称、样式、提示词、备注
      form: {
-        id: "",
-        ruleName: "",
+        id: '',
+        ruleName: '',
        ruleType: 1,
        ruleList: []
      }
-    };
+    }
  },
  props: {
    type: {
      type: String,
-      default: "edit"
+      default: 'edit'
    }
  },
-  inject: ["dialogOptions", "tableData"],
+  inject: ['dialogOptions', 'tableData'],
  beforeMount() {
    // 如果是新增，不去请求接口
-    if (this.type === "add") {
-      return;
+    if (this.type === 'add') {
+      return
    }
    // 获取当前行数据
-    const { currentRow } = this.dialogOptions;
+    const { currentRow } = this.dialogOptions

    // 获取规则详情
    getRuleDetail(currentRow.id)
      .then(res => {
-        const { content } = res.content;
-        console.log("origin query request", content);
+        const { content } = res.content
+        console.log('origin query request', content)
        // 一次性设置表单数据，确保响应式更新
        this.form = {
          id: content.id,
          ruleName: content.ruleName,
          ruleType: content.ruleType,
          ruleList: Array.isArray(content.ruleList) ? content.ruleList : []
-        };
+        }
      })
      .catch(err => {
-        console.error("获取规则详情失败:", err);
-      });
+        console.error('获取规则详情失败:', err)
+      })
  },

  methods: {
    handleAdd() {
      // TODO: 新增数据到后端
      const payload = {
-        titleLevel: "",
-        ruleRegex: "",
-        description: ""
-      };
+        titleLevel: '',
+        ruleRegex: '',
+        description: ''
+      }

      // 使用数组方法添加元素，确保响应式更新
-      this.form.ruleList.push(payload);
+      this.form.ruleList.push(payload)
    },
    /**
     * 删除拆分规则
@@ -67,11 +67,11 @@ export default {
      // TODO: 删除数据到后端
      if (index !== undefined) {
        // 确保 index 是数字
-        const numIndex = Number(index);
+        const numIndex = Number(index)
        if (!isNaN(numIndex)) {
-          console.log(numIndex);
-          const payload = this.form.ruleList.splice(numIndex, 1);
-          console.log(...payload);
+          console.log(numIndex)
+          const payload = this.form.ruleList.splice(numIndex, 1)
+          console.log(...payload)
        }
      }
    },
@@ -81,49 +81,47 @@ export default {
     */
    handleSave() {
      // 使用正确的API保存数据到后端
-      console.log(`this.form`, this.form);
+      console.log(`this.form`, this.form)

      // 判断是新增还是更新，新增调用 addSplitRule，更新调用 updateSplitRule
-      if (this.type === "add") {
-
+      if (this.type === 'add') {
        // 配置对应表单
        // 添加时，需要删除 id
-        delete this.form.id;
+        delete this.form.id
        // 更新ruleType
-        this.form.ruleType = 1;
+        this.form.ruleType = 1

        addSplitRule(this.form)
          .then(() => {
-            this.dialogOptions.visible = false;
+            this.dialogOptions.visible = false

            // 可以添加成功提示
-            this.$message && this.$message.success("保存成功");
+            this.$message && this.$message.success('保存成功')
            // 向 tableData 最上面添加数据
-            this.tableData.unshift(this.form);
+            this.tableData.unshift(this.form)
          })
          .catch(err => {
-            console.error(`add split rule failed: ${err}`);
+            console.error(`add split rule failed: ${err}`)
            // 可以添加错误提示
-            this.$message && this.$message.error("保存失败");
-          });
+            this.$message && this.$message.error('保存失败')
+          })
      } else {
        updateSplitRule(this.form)
          .then(() => {
-            console.log("update split rule success");
-            this.dialogOptions.visible = false;
+            console.log('update split rule success')
+            this.dialogOptions.visible = false
            // 可以添加成功提示
-            this.$message && this.$message.success("保存成功");
+            this.$message && this.$message.success('保存成功')
          })
          .catch(err => {
-            console.error(`update split rule failed: ${err}`);
+            console.error(`update split rule failed: ${err}`)
            // 可以添加错误提示
-            this.$message && this.$message.error("保存失败");
-          });
+            this.$message && this.$message.error('保存失败')
+          })
      }
    }
-
  }
-};
+}
 </script>

 <template>
@@ -134,8 +132,12 @@ export default {
      </el-form-item>
      <el-card>
        <el-tabs closable @tab-remove="handleDelete">
-          <el-tab-pane v-for="(item, index) in form.ruleList" :name="index.toString()" :key="index"
-                       :label="item.ruleRegex ? item.ruleRegex : `未命名${index + 1}`">
+          <el-tab-pane
+            v-for="(item, index) in form.ruleList"
+            :name="index.toString()"
+            :key="index"
+            :label="item.ruleRegex ? item.ruleRegex : `未命名${index + 1}`"
+          >
            <el-form-item label="样式">
              <el-input v-model="item.titleLevel"></el-input>
            </el-form-item>