From fda6156df53c224207d642020cb7e4bdc40d419a Mon Sep 17 00:00:00 2001
From: liuzhiyuan <>
Date: Sat, 11 Oct 2025 18:07:36 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=95=B0=E6=8D=AE=E4=B8=AD=E5=8F=B0?=
 =?UTF-8?q?=E5=9F=BA=E7=A1=80=E7=AE=A1=E7=90=86=20=E4=B8=8D=E5=88=86?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/base/cleaningRules.ts                 |  46 ++
 src/api/base/inspectRules.ts                  |  24 +
 src/layout/components/Menu/src/Menu.vue       |  12 +-
 src/layout/components/ToolHeader.vue          |   2 +-
 src/utils/dict.ts                             |   4 +
 src/views/Login/Login.vue                     |   2 +-
 src/views/Login/Login_v1.vue                  |   2 +-
 .../base/category/cleaningRules/index.vue     | 670 +++++++++++++++++
 .../base/category/dataApiService/index.vue    | 320 ++++++++
 src/views/base/category/dataAsset/index.vue   | 320 ++++++++
 src/views/base/category/dataElement/index.vue | 320 ++++++++
 src/views/base/project/manage/index.vue       | 513 +++++++++++++
 src/views/base/rules/cleaning/index.vue       | 694 ++++++++++++++++++
 src/views/base/rules/inspect/index.vue        | 550 ++++++++++++++
 src/views/dataAsset/assetMap/index.vue        |   0
 src/views/dataAsset/dataLink/index.vue        |   0
 src/views/dataAsset/dataQuery/index.vue       |   0
 .../dataPlan/standardDataElement/index.vue    | 498 +++++++++++++
 src/views/dataService/apiManage/index.vue     |   0
 vite.config.ts                                |  32 +-
 20 files changed, 3989 insertions(+), 20 deletions(-)
 create mode 100644 src/api/base/cleaningRules.ts
 create mode 100644 src/api/base/inspectRules.ts
 create mode 100644 src/views/base/category/cleaningRules/index.vue
 create mode 100644 src/views/base/category/dataApiService/index.vue
 create mode 100644 src/views/base/category/dataAsset/index.vue
 create mode 100644 src/views/base/category/dataElement/index.vue
 create mode 100644 src/views/base/project/manage/index.vue
 create mode 100644 src/views/base/rules/cleaning/index.vue
 create mode 100644 src/views/base/rules/inspect/index.vue
 create mode 100644 src/views/dataAsset/assetMap/index.vue
 create mode 100644 src/views/dataAsset/dataLink/index.vue
 create mode 100644 src/views/dataAsset/dataQuery/index.vue
 create mode 100644 src/views/dataPlan/standardDataElement/index.vue
 create mode 100644 src/views/dataService/apiManage/index.vue

diff --git a/src/api/base/cleaningRules.ts b/src/api/base/cleaningRules.ts
new file mode 100644
index 0000000..63b9797
--- /dev/null
+++ b/src/api/base/cleaningRules.ts
@@ -0,0 +1,46 @@
+import request from '@/config/axios'
+
+// 获取规则类目列表
+export const getAttCleanCatList = (params) => {
+  return request.get({
+    url: '/v2/att/attCleanCat/list',
+    params
+  })
+}
+// 添加规则类目
+export const saveAttCleanCat = (data) => {
+  return request.post({ url: '/v2/att/attCleanCat', data })
+}
+
+// 更新规则类目
+export const updateAttCleanCat = (data) => {
+  return request.put({ url: '/v2/att/attCleanCat', data })
+}
+
+// 删除规则类目
+export const deleteAttCleanCat = (id) => {
+  return request.delete({ url: `/v2/att/attCleanCat/${id}`})
+}
+
+// 获取规则列表
+export const getAttCleanRuleList = (params) => {
+  return request.get({
+    url: '/v2/att/attCleanRule/list',
+    params
+  })
+}
+
+// 添加规则
+export const saveAttCleanRule = (data) => {
+  return request.post({ url: '/v2/att/attCleanRule', data })
+}
+
+// 更新规则
+export const updateAttCleanRule = (data) => {
+  return request.put({ url: '/v2/att/attCleanRule', data })
+}
+
+// 删除规则
+export const deleteAttCleanRule = (id) => {
+  return request.delete({ url: `/v2/att/attCleanRule/${id}`})
+}
\ No newline at end of file
diff --git a/src/api/base/inspectRules.ts b/src/api/base/inspectRules.ts
new file mode 100644
index 0000000..7a521e2
--- /dev/null
+++ b/src/api/base/inspectRules.ts
@@ -0,0 +1,24 @@
+import request from '@/config/axios'
+
+// 获取规则列表
+export const getAttAuditRuleList = (params) => {
+  return request.get({
+    url: '/v2/att/attAuditRule/list',
+    params
+  })
+}
+
+// 添加规则
+export const addAttAuditRule = (data) => {
+  return request.post({ url: '/v2/att/attAuditRule', data })
+}
+
+// 更新规则
+export const updateAttAuditRule = (data) => {
+  return request.put({ url: '/v2/att/attAuditRule', data })
+}
+
+// 删除规则
+export const deleteAttAuditRule = (id) => {
+  return request.delete({ url: `/v2/att/attAuditRule/${id}`})
+}
\ No newline at end of file
diff --git a/src/layout/components/Menu/src/Menu.vue b/src/layout/components/Menu/src/Menu.vue
index 325136f..3821168 100644
--- a/src/layout/components/Menu/src/Menu.vue
+++ b/src/layout/components/Menu/src/Menu.vue
@@ -149,18 +149,22 @@ $prefix-cls: #{$namespace}-menu;
     width: 100% !important;
     border-right: none;
     border-radius: var(--left-menu-border-radius);
-    padding: 20px;
-
+    padding: 10px;
     // 设置选中时子标题的颜色
     .is-active {
       & > .#{$elNamespace}-sub-menu__title {
         //color: var(--left-menu-text-active-color) !important;
       }
     }
-
+    .#{$elNamespace}-menu-item{
+      height: 50px;
+      border-radius: 10px !important;
+    }
     // 设置子菜单悬停的高亮和背景色
     .#{$elNamespace}-sub-menu__title,
     .#{$elNamespace}-menu-item {
+      height: 50px;
+      border-radius:  10px !important;
       &:hover {
         color: var(--left-menu-text-active-color) !important;
         background-color: var(--left-menu-bg-active-color) !important;
@@ -169,9 +173,9 @@ $prefix-cls: #{$namespace}-menu;
 
     // 设置选中时的高亮背景和高亮颜色
     .#{$elNamespace}-menu-item.is-active {
+      border-radius:  10px !important;
       color: var(--left-menu-text-active-color) !important;
       background-color: var(--left-menu-bg-active-color) !important;
-
       &:hover {
         background-color: var(--left-menu-bg-active-color) !important;
       }
diff --git a/src/layout/components/ToolHeader.vue b/src/layout/components/ToolHeader.vue
index f85e4f2..eb71b64 100644
--- a/src/layout/components/ToolHeader.vue
+++ b/src/layout/components/ToolHeader.vue
@@ -59,7 +59,7 @@ export default defineComponent({
               <Collapse class="custom-hover" color="var(--top-header-text-color)"></Collapse>
             ) : undefined} **/}
             {/** {breadcrumb.value ? <Breadcrumb class="lt-md:hidden"></Breadcrumb> : undefined} **/}
-            <div className="h-full flex items-center" style="padding-left: 90px;font-weight: bold">AI大模型科创实践平台</div>
+            <div className="h-full flex items-center" style="padding-left: 90px;font-weight: bold">AI大模型数据中台</div>
           </div>
         ) : undefined}
         <div class="h-full flex items-center">
diff --git a/src/utils/dict.ts b/src/utils/dict.ts
index 7fc72eb..ddef7e8 100644
--- a/src/utils/dict.ts
+++ b/src/utils/dict.ts
@@ -258,4 +258,8 @@ export enum DICT_TYPE {
   LLM_PROMPT_TEMPLATE_FRAMEWORK = "llm_prompt_template_framework",
   LLM_VARIABLE_IDENTIFIER = "llm_variable_identifier",
   PLATFORM_VERSION_INFO = "platform_version_info",
+
+  // ======== 基础管理模块 ===========
+  ATT_RULE_AUDIT_Q_DIMENSION = 'att_rule_audit_q_dimension' // 质量维度
+
 }
diff --git a/src/views/Login/Login.vue b/src/views/Login/Login.vue
index e4632d9..a2cde39 100644
--- a/src/views/Login/Login.vue
+++ b/src/views/Login/Login.vue
@@ -144,7 +144,7 @@ onMounted(() => {
       >
         <div class="header">
           <span class="icon"></span>
-          <h3 class="login-title">AI大模型科创实践平台</h3>
+          <h3 class="login-title">AI大模型数据中台</h3>
         </div>
         <el-form-item prop="userType">
           <el-select v-model="loginData.loginForm.userType">
diff --git a/src/views/Login/Login_v1.vue b/src/views/Login/Login_v1.vue
index 42f128c..a28aa4d 100644
--- a/src/views/Login/Login_v1.vue
+++ b/src/views/Login/Login_v1.vue
@@ -166,7 +166,7 @@ const handleLogin = async (params) => {
       <div class="login" v-show="formType == 'login'">
         <div class="tit">
           <p>欢迎登录</p>
-          <p>AI大模型科创实践平台</p>
+          <p>AI大模型数据中台</p>
         </div>
         <el-form
           ref="formLogin"
diff --git a/src/views/base/category/cleaningRules/index.vue b/src/views/base/category/cleaningRules/index.vue
new file mode 100644
index 0000000..abef944
--- /dev/null
+++ b/src/views/base/category/cleaningRules/index.vue
@@ -0,0 +1,670 @@
+<template>
+  <el-card shadow="never" class="b-r-top-15 m-b-10">
+    <div class="main-content">
+      <!-- 主内容区域 -->
+      <div class="main">
+        <!-- 搜索和新增区域 -->
+        <div class="search-container">
+          <!-- 第一行：搜索框和搜索、重置按钮 -->
+          <el-row :gutter="20">
+            <el-col :span="5">
+              <el-input
+                v-model="searchForm.dataTypeName"
+                placeholder="请输入数据类别名称"
+                :prefix-icon="Search"
+                class="search-input"
+              />
+            </el-col>
+            <el-col :span="5">
+              <el-select
+                v-model="searchForm.parentId"
+                placeholder="请选择上级"
+                class="search-input"
+              >
+                <el-option label="全部" value="" />
+                <!-- 动态加载所有可用的父节点 -->
+                <el-option
+                  v-for="item in allParents"
+                  :key="item.id"
+                  :label="item.name"
+                  :value="item.id.toString()"
+                />
+              </el-select>
+            </el-col>
+            <el-col :span="4">
+              <el-button type="primary" @click="handleSearch" class="search-btn">查询</el-button>
+              <el-button @click="handleReset" class="reset-btn">重置</el-button>
+            </el-col>
+          </el-row>
+        </div>
+        <!-- 树形表格区域 -->
+        <div class="table-container">
+          <el-button type="primary" class="add-btn mb-1" @click="handleAdd">+ 新增</el-button>
+          <el-button @click="toggleExpand" class="expand-btn mb-1">展开/折叠</el-button>
+          <el-table
+            ref="dataTable"
+            :data="tableData"
+            v-loading="loading"
+            max-height="calc(100vh - 240px)"
+            show-header
+            :header-cell-style="{ background: '#f2f3f5', color: '#6b7785', fontWeight: 'bold' }"
+            row-key="id"
+            :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+            :default-expand-all="isAllExpanded"
+          >
+            <!-- 表格列定义根据接口字段调整 -->
+            <el-table-column
+              prop="name"
+              label="数据类别名称"
+              width="200"
+            />
+            <el-table-column
+              prop="description"
+              label="描述"
+              min-width="200"
+            />
+            <el-table-column
+              prop="validFlag"
+              label="状态"
+              width="120"
+            >
+              <template #default="scope">
+                <el-switch
+                  v-model="scope.row.validFlag"
+                  active-color="#13ce66"
+                  inactive-color="#ff4d4f"
+                  :disabled="!scope.row.editable"
+                  @change="handleStatusChange(scope.row)"
+                />
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="remark"
+              label="备注"
+              min-width="150"
+            />
+            <el-table-column
+              label="操作"
+              width="280"
+            >
+              <template #default="scope">
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn"
+                  @click="handleEdit(scope.row)"
+                >
+                  修改
+                </el-button>
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn"
+                  @click="handleAddChild(scope.row)"
+                  :disabled="getLevel(scope.row) >= 2"
+                >+ 新增子节点
+                  <template v-if="getLevel(scope.row) >= 2">
+                    <el-tooltip effect="dark" content="最多只能添加三级节点" placement="top">
+                      <el-icon class="icon"><InfoCircle /></el-icon>
+                    </el-tooltip>
+                  </template>
+                </el-button>
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn" 
+                  style="color: #ff4d4f"
+                  @click="handleDelete(scope.row)"
+                >
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+    </div>
+  </el-card>
+
+  <!-- 添加/修改弹窗 -->
+  <el-dialog
+    v-model="dialogVisible"
+    :title="dialogTitle"
+    width="700px"
+    :close-on-click-modal="false"
+  >
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="130px"
+    >
+      <el-form-item label="数据类别名称" prop="name">
+        <el-input
+          v-model="formData.name"
+          placeholder="请输入数据类别名称"
+          maxlength="50"
+        />
+      </el-form-item>
+      <el-form-item label="上级类别" prop="parentId">
+        <el-select
+          v-model="formData.parentId"
+          placeholder="请选择上级类别"
+        >
+          <el-option label="无上级" value="0" />
+          <el-option
+            v-for="item in filteredParents"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+            :disabled="formData.id && (item.id === formData.id || isChildOf(formData.id, item.id))"
+          />
+        </el-select>
+        <div v-if="formData.parentId !== '0' && parentLevel >= 2" class="text-warning text-sm mt-1">
+          警告：当前选择的上级已是二级节点，新增后将成为三级节点，不能再添加子节点
+        </div>
+      </el-form-item>
+      <el-form-item label="描述" prop="description">
+        <el-input
+          v-model="formData.description"
+          placeholder="请输入描述"
+          type="textarea"
+          rows="3"
+          maxlength="200"
+        />
+      </el-form-item>
+      <el-form-item label="状态" prop="validFlag">
+        <el-switch
+          v-model="formData.validFlag"
+          active-color="#13ce66"
+          inactive-color="#ff4d4f"
+        />
+      </el-form-item>
+      <el-form-item label="备注" prop="remark">
+        <el-input
+          v-model="formData.remark"
+          placeholder="请输入备注"
+          type="textarea"
+          rows="2"
+          maxlength="100"
+        />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button @click="dialogVisible = false">取消</el-button>
+      <el-button type="primary" @click="handleSubmit">确定</el-button>
+    </template>
+  </el-dialog>
+
+  <!-- 确认删除弹窗 -->
+  <el-dialog
+    v-model="deleteDialogVisible"
+    title="确认删除"
+    width="400px"
+    :close-on-click-modal="false"
+  >
+    <p>确定要删除该数据类别吗？删除后不可恢复。</p>
+    <template #footer>
+      <el-button @click="deleteDialogVisible = false">取消</el-button>
+      <el-button type="primary" style="background-color: #ff4d4f; border-color: #ff4d4f" @click="confirmDelete">确定删除</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted, computed, watch } from 'vue';
+import { Search } from "@element-plus/icons-vue";
+import { getAttCleanCatList, saveAttCleanCat, deleteAttCleanCat, updateAttCleanCat } from '@/api/base/cleaningRules';
+import { ElMessage } from 'element-plus';
+
+// 表格引用
+const dataTable = ref(null);
+// 新增展开状态跟踪
+const isAllExpanded = ref(false);  // 控制默认展开状态
+
+// 搜索表单数据
+const searchForm = ref({
+  dataTypeName: '',
+  parentId: '',
+  description: ''
+});
+
+// 表格数据 - 树形结构
+const tableData = ref([]);
+// 所有可作为父节点的列表
+const allParents = ref([]);
+
+// 加载状态
+const loading = ref(false);
+
+// 弹窗相关
+const dialogVisible = ref(false);
+const dialogTitle = ref('新增数据类别');
+const formRef = ref(null);
+const formData = ref({
+  id: '',
+  name: '',
+  parentId: '0',
+  description: '',
+  validFlag: true,
+  remark: ''
+});
+const formRules = reactive({
+  name: [
+    { required: true, message: '请输入数据类别名称', trigger: 'blur' },
+    { max: 50, message: '名称长度不能超过50个字符', trigger: 'blur' }
+  ]
+});
+
+// 删除弹窗
+const deleteDialogVisible = ref(false);
+const currentDeleteId = ref('');
+
+// 计算属性：过滤只能作为父节点的选项（仅限1级和2级节点）
+const filteredParents = computed(() => {
+  return allParents.value.filter(item => getLevel(item) < 2);
+});
+
+// 计算当前选中父节点的层级
+const parentLevel = computed(() => {
+  if (formData.value.parentId === '0') return -1;
+  
+  const parent = allParents.value.find(item => item.id == formData.value.parentId);
+  return parent ? getLevel(parent) : -1;
+});
+
+// 处理搜索
+const handleSearch = () => {
+  console.log('搜索条件:', searchForm.value);
+  getList();
+};
+
+// 处理重置
+const handleReset = () => {
+  searchForm.value = {
+    dataTypeName: '',
+    parentId: '',
+    description: ''
+  };
+  getList();
+};
+
+// 获取节点层级（0表示一级节点，1表示二级节点，2表示三级节点）
+const getLevel = (node) => {
+  // 递归计算层级的辅助函数
+  const calculateLevel = (currentNode, currentLevel) => {
+    // 如果是根节点（parentId为0），返回当前层级
+    if (currentNode.parentId === 0 || currentNode.parentId === '0') {
+      return currentLevel;
+    }
+    
+    // 查找父节点
+    const parent = allParents.value.find(item => {
+      // 处理可能的类型不匹配问题
+      return item.id.toString() === currentNode.parentId.toString();
+    });
+    
+    // 如果找不到父节点，视为根节点
+    if (!parent) {
+      return currentLevel;
+    }
+    
+    // 递归计算父节点层级，层级+1
+    return calculateLevel(parent, currentLevel + 1);
+  };
+  
+  // 从0开始计算层级（根节点为0级）
+  return calculateLevel(node, 0);
+};
+
+// 将扁平数据转换为树形结构
+const buildTree = (items) => {
+  // 复制数据并添加必要的属性
+  const treeItems = items.map(item => ({
+    ...item,
+    editable: true,  // 假设所有项都可编辑
+    children: []     // 初始化子节点数组
+  }));
+  
+  const idToItem = {};
+  
+  // 创建ID到节点的映射，处理ID可能为字符串或数字的情况
+  treeItems.forEach(item => {
+    idToItem[item.id.toString()] = item;
+  });
+  
+  const tree = [];
+  
+  // 构建树形结构
+  treeItems.forEach(item => {
+    if (item.parentId === 0 || item.parentId === '0') {
+      // 根节点
+      tree.push(item);
+    } else {
+      // 找到父节点并添加为子节点
+      const parent = idToItem[item.parentId.toString()];
+      if (parent) {
+        parent.children.push(item);
+      } else {
+        // 如果找不到父节点，作为根节点处理
+        tree.push(item);
+      }
+    }
+  });
+  
+  return tree;
+};
+
+// 扁平化所有节点，用于父节点选择
+const flattenTree = (tree) => {
+  let result = [];
+  tree.forEach(item => {
+    result.push(item);
+    if (item.children && item.children.length) {
+      result = result.concat(flattenTree(item.children));
+    }
+  });
+  return result;
+};
+
+// 获取列表数据 - 从接口获取并转换为树形结构
+const getList = async () => {
+  try {
+    loading.value = true;
+    // 构造查询参数，合并搜索条件
+    const params = {
+      name: searchForm.value.dataTypeName,
+      parentId: searchForm.value.parentId || undefined,
+      description: searchForm.value.description
+    };
+    
+    // 调用接口获取数据
+    const response = await getAttCleanCatList(params);
+    
+    if (Array.isArray(response)) {
+      // 将扁平数据转换为树形结构
+      tableData.value = buildTree(response);
+      // 生成所有可作为父节点的列表
+      allParents.value = flattenTree(tableData.value);
+    } else {
+      tableData.value = [];
+      allParents.value = [];
+      console.error('获取数据失败');
+    }
+  } catch (error) {
+    console.error('获取数据出错:', error);
+    tableData.value = [];
+    allParents.value = [];
+  } finally {
+    loading.value = false;
+  }
+};
+
+// 展开/折叠所有节点
+const toggleExpand = () => {
+  if (!dataTable.value || !tableData.value.length) return;
+  
+  // 切换展开状态
+  isAllExpanded.value = !isAllExpanded.value;
+  
+  // 递归展开或折叠所有行
+  const toggleAllRows = (rows, expanded) => {
+    if (!rows || !rows.length) return;
+    
+    rows.forEach(row => {
+      dataTable.value.toggleRowExpansion(row, expanded);
+      if (row.children && row.children.length) {
+        toggleAllRows(row.children, expanded);
+      }
+    });
+  };
+  
+  // 执行展开/折叠操作
+  toggleAllRows(tableData.value, isAllExpanded.value);
+};
+
+// 打开新增弹窗
+const handleAdd = () => {
+  dialogTitle.value = '新增数据类别';
+  formData.value = {
+    id: '',
+    name: '',
+    parentId: '0',
+    description: '',
+    validFlag: true,
+    remark: ''
+  };
+  dialogVisible.value = true;
+};
+
+// 打开新增子节点弹窗
+const handleAddChild = (row) => {
+  // 检查当前节点层级，如果已经是二级节点则不能添加子节点
+  const currentLevel = getLevel(row);
+  if (currentLevel >= 2) {
+    ElMessage.warning('最多只能添加三级节点');
+    return;
+  }
+  
+  dialogTitle.value = `新增"${row.name}"的子节点`;
+  formData.value = {
+    id: '',
+    name: '',
+    parentId: row.id,
+    description: '',
+    validFlag: true,
+    remark: ''
+  };
+  dialogVisible.value = true;
+};
+
+// 打开编辑弹窗
+const handleEdit = (row) => {
+  dialogTitle.value = '修改数据类别';
+  formData.value = {
+    id: row.id,
+    name: row.name,
+    parentId: row.parentId.toString(),
+    description: row.description || '',
+    validFlag: row.validFlag,
+    remark: row.remark || ''
+  };
+  dialogVisible.value = true;
+};
+
+// 提交表单
+const handleSubmit = async () => {
+  if (!formRef.value) return;
+  
+  try {
+    // 表单验证
+    await formRef.value.validate();
+    
+    // 检查层级限制
+    if (formData.value.parentId !== '0') {
+      const parent = allParents.value.find(item => item.id.toString() === formData.value.parentId.toString());
+      if (parent) {
+        const parentLevel = getLevel(parent);
+        // 如果父节点已是二级节点，新增后将超过三级限制
+        if (parentLevel >= 2) {
+          ElMessage.warning('最多只能添加三级节点');
+          return;
+        }
+      }
+    }
+    
+    // 构造提交数据
+    const submitData = {
+      ...formData.value
+    };
+    
+    let response;
+    if (submitData.id) {
+      // 编辑操作，调用updateAttCleanCat方法
+      response = await updateAttCleanCat(submitData);
+    } else {
+      // 新增操作，调用saveAttCleanCat方法
+      response = await saveAttCleanCat(submitData);
+    }
+    
+    // 假设接口返回成功
+    if (response > 0) {
+      ElMessage.success(submitData.id ? '修改成功' : '新增成功');
+      dialogVisible.value = false;
+      // 重新获取列表数据
+      getList();
+    } else {
+      ElMessage.error(submitData.id ? '修改失败' : '新增失败');
+    }
+  } catch (error) {
+    if (error.name === 'Error') {
+      ElMessage.error(error.message);
+    }
+    return false;
+  }
+};
+
+// 打开删除确认弹窗
+const handleDelete = (row) => {
+  currentDeleteId.value = row.id;
+  deleteDialogVisible.value = true;
+};
+
+// 确认删除
+const confirmDelete = async () => {
+  try {
+    const response = await deleteAttCleanCat(currentDeleteId.value);
+    
+    if (response > 0) {
+      ElMessage.success('删除成功');
+      deleteDialogVisible.value = false;
+      // 重新获取列表数据
+      getList();
+    } else {
+      ElMessage.error('删除失败');
+    }
+  } catch (error) {
+    ElMessage.error('删除出错: ' + error.message);
+  }
+};
+
+// 状态切换 - 调用updateAttCleanCat方法
+const handleStatusChange = async (row) => {
+  try {
+    // 保存原始状态，用于出错时回滚
+    const originalStatus = row.validFlag;
+    
+    // 构造更新数据，只包含必要字段
+    const updateData = {
+      id: row.id,
+      validFlag: row.validFlag
+    };
+    
+    // 调用更新接口
+    const response = await updateAttCleanCat(updateData);
+    
+    if (response > 0) {
+      ElMessage.success('状态更新成功');
+    } else {
+      // 接口调用失败，回滚状态
+      row.validFlag = originalStatus;
+      ElMessage.error('状态更新失败');
+    }
+  } catch (error) {
+    // 出错时回滚状态
+    row.validFlag = !row.validFlag;
+    ElMessage.error('状态更新出错: ' + error.message);
+  }
+};
+
+// 检查是否是子节点（用于避免循环引用）
+const isChildOf = (childId, parentId) => {
+  const parent = allParents.value.find(item => item.id.toString() === parentId.toString());
+  if (!parent || !parent.children || !parent.children.length) {
+    return false;
+  }
+  
+  // 检查直接子节点
+  if (parent.children.some(child => child.id.toString() === childId.toString())) {
+    return true;
+  }
+  
+  // 递归检查间接子节点
+  for (const child of parent.children) {
+    if (isChildOf(childId, child.id)) {
+      return true;
+    }
+  }
+  
+  return false;
+};
+
+// 监听父节点变化
+watch(() => formData.value.parentId, () => {
+  // 父节点变化时不需要特别处理，parentLevel计算属性会自动更新
+});
+
+// 组件挂载时获取数据
+onMounted(() => {
+  getList();
+});
+</script>
+
+<style scoped>
+/* 样式保持不变 */
+.main-content {
+  display: flex;
+  flex: 1;
+  overflow: hidden;
+}
+
+.main {
+  flex: 1;
+  overflow-y: auto;
+}
+
+.search-container {
+  padding:0 15px;
+  background-color: #ffffff;
+  border-radius: 4px;
+}
+
+.search-input {
+  width: 100%;
+}
+
+.search-btn {
+  margin-right: 10px;
+}
+
+.table-container {
+  background-color: #fff;
+  border-radius: 4px;
+  padding: 15px;
+}
+
+.add-btn {
+  margin-right: 10px;
+}
+
+.expand-btn {
+  margin-right: 10px;
+}
+
+.operation-btn {
+  margin-right: 5px;
+}
+
+.mb-1 {
+  margin-bottom: 8px;
+}
+
+.text-warning {
+  color: #e6a23c;
+}
+
+.icon {
+  margin-left: 5px;
+  font-size: 14px;
+}
+</style>
diff --git a/src/views/base/category/dataApiService/index.vue b/src/views/base/category/dataApiService/index.vue
new file mode 100644
index 0000000..cdfddab
--- /dev/null
+++ b/src/views/base/category/dataApiService/index.vue
@@ -0,0 +1,320 @@
+<template>
+  <el-card shadow="never" class="b-r-top-15 m-b-10">
+    <div class="main-content">
+      <!-- 主内容区域 -->
+      <div class="main">
+        <!-- 搜索和新增区域 -->
+        <div class="search-container">
+          <!-- 第一行：搜索框和搜索、重置按钮 -->
+          <el-row :gutter="20">
+            <el-col :span="5">
+              <el-input
+                v-model="searchForm.dataTypeName"
+                placeholder="请输入数据类别名称"
+                :prefix-icon="Search"
+                class="search-input"
+              />
+            </el-col>
+            <el-col :span="5">
+              <el-select
+                v-model="searchForm.parentId"
+                placeholder="请选择上级"
+                class="search-input"
+              >
+                <el-option label="全部" value="" />
+                <el-option label="无上级" value="0" />
+              </el-select>
+            </el-col>
+            <el-col :span="4">
+              <el-button type="primary" @click="handleSearch" class="search-btn">查询</el-button>
+              <el-button @click="handleReset" class="reset-btn">重置</el-button>
+            </el-col>
+          </el-row>
+        </div>
+        <!-- 树形表格区域 -->
+        <div class="table-container">
+          <el-button type="primary" class="add-btn mb-1">+ 新增</el-button>
+          <el-button @click="toggleExpand" class="expand-btn mb-1">展开/折叠</el-button>
+          <el-table
+            ref="dataTable"
+            :data="tableData"
+            v-loading="loading"
+            height="500"
+            show-header
+            :header-cell-style="{ background: '#f2f3f5', color: '#6b7785', fontWeight: 'bold' }"
+            row-key="id"
+            :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+            :default-expand-all="isAllExpanded"
+          >
+            <!-- 表格列定义保持不变 -->
+            <el-table-column
+              prop="dataTypeName"
+              label="数据类别名称"
+              width="200"
+            />
+            <el-table-column
+              prop="description"
+              label="描述"
+              min-width="200"
+            />
+            <el-table-column
+              prop="status"
+              label="状态"
+              width="120"
+            >
+              <template #default="scope">
+                <el-switch
+                  v-model="scope.row.status"
+                  active-color="#13ce66"
+                  inactive-color="#ff4d4f"
+                  :disabled="!scope.row.editable"
+                />
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="remark"
+              label="备注"
+              min-width="150"
+            />
+            <el-table-column
+              label="操作"
+              width="280"
+            >
+              <template #default="scope">
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn"
+                  @click="handleEdit(scope.row)"
+                >
+                  修改
+                </el-button>
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn"
+                  @click="handleAddChild(scope.row)"
+                >
+                  + 新增
+                </el-button>
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn" 
+                  style="color: #ff4d4f"
+                  @click="handleDelete(scope.row)"
+                >
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <Pagination
+            :total="total"
+            v-model:page="queryParams.pageNo"
+            v-model:limit="queryParams.pageSize"
+            @pagination="getList"
+          />
+        </div>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script setup>
+import { ref, reactive, nextTick } from 'vue';
+import { Search } from "@element-plus/icons-vue";
+
+// 表格引用
+const dataTable = ref(null);
+// 新增展开状态跟踪
+const isAllExpanded = ref(false);  // 控制默认展开状态
+
+// 查询参数
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  serviceName: ''
+})
+
+// 搜索表单数据
+const searchForm = ref({
+  dataTypeName: '',
+  parentId: '',
+  description: ''
+});
+
+// 表格数据 - 树形结构
+const tableData = ref([
+  {
+    id: 1,
+    dataTypeName: '水文监测',
+    description: '辽河流域水文要素监测数据',
+    status: true,
+    remark: '-',
+    editable: true,
+  },
+  {
+    id: 2,
+    dataTypeName: '防洪抗旱',
+    description: '防汛抗旱指挥调度相关数据',
+    status: true,
+    remark: '-',
+    editable: true,
+    children: [
+      {
+        id: 21,
+        dataTypeName: '旱情监测',
+        description: '干旱监测评估数据',
+        status: true,
+        remark: '-',
+        editable: true,
+        children: [
+          {
+            id: 211,
+            dataTypeName: '土壤墒情',
+            description: '土壤含水量监测',
+            status: true,
+            remark: '-',
+            editable: true,
+          },
+          {
+            id: 212,
+            dataTypeName: '作物旱情',
+            description: '农作物受旱情况',
+            status: true,
+            remark: '-',
+            editable: true,
+          }
+        ]
+      },
+      {
+        id: 22,
+        dataTypeName: '抢险救灾',
+        description: '防汛抢险救灾数据',
+        status: true,
+        remark: '-',
+        editable: true,
+      }
+    ]
+  }
+]);
+
+// 分页相关数据
+const total = ref(10);
+const loading = ref(false);
+
+// 处理搜索
+const handleSearch = () => {
+  console.log('搜索条件:', searchForm.value);
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 处理重置
+const handleReset = () => {
+  searchForm.value = {
+    dataTypeName: '',
+    parentId: '',
+    description: ''
+  };
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 获取列表数据
+const getList = () => {
+  console.log('分页参数:', queryParams);
+  // 实际项目中这里会调用接口获取数据
+};
+
+// 展开/折叠所有节点 - 修复版本
+const toggleExpand = () => {
+  if (!dataTable.value) return;
+  
+  // 切换展开状态
+  isAllExpanded.value = !isAllExpanded.value;
+  
+  // 递归展开或折叠所有行
+  const toggleAllRows = (rows, expanded) => {
+    if (!rows || !rows.length) return;
+    
+    rows.forEach(row => {
+      dataTable.value.toggleRowExpansion(row, expanded);
+      if (row.children && row.children.length) {
+        toggleAllRows(row.children, expanded);
+      }
+    });
+  };
+  
+  // 执行展开/折叠操作
+  toggleAllRows(tableData.value, isAllExpanded.value);
+};
+
+// 编辑操作
+const handleEdit = (row) => {
+  console.log('编辑:', row);
+};
+
+// 新增子节点
+const handleAddChild = (row) => {
+  console.log('新增子节点:', row);
+};
+
+// 删除操作
+const handleDelete = (row) => {
+  console.log('删除:', row);
+};
+</script>
+
+<style scoped>
+/* 样式保持不变 */
+.main-content {
+  display: flex;
+  flex: 1;
+  overflow: hidden;
+}
+
+.main {
+  flex: 1;
+  overflow-y: auto;
+}
+
+.search-container {
+  margin-bottom: 20px;
+  padding: 15px;
+  background-color: #ffffff;
+  border-radius: 4px;
+}
+
+.search-input {
+  width: 100%;
+}
+
+.search-btn {
+  margin-right: 10px;
+}
+
+.table-container {
+  background-color: #fff;
+  border-radius: 4px;
+  padding: 15px;
+}
+
+.add-btn {
+  margin-right: 10px;
+}
+
+.expand-btn {
+  margin-right: 10px;
+}
+
+.operation-btn {
+  margin-right: 5px;
+}
+
+.mb-1 {
+  margin-bottom: 8px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/base/category/dataAsset/index.vue b/src/views/base/category/dataAsset/index.vue
new file mode 100644
index 0000000..cdfddab
--- /dev/null
+++ b/src/views/base/category/dataAsset/index.vue
@@ -0,0 +1,320 @@
+<template>
+  <el-card shadow="never" class="b-r-top-15 m-b-10">
+    <div class="main-content">
+      <!-- 主内容区域 -->
+      <div class="main">
+        <!-- 搜索和新增区域 -->
+        <div class="search-container">
+          <!-- 第一行：搜索框和搜索、重置按钮 -->
+          <el-row :gutter="20">
+            <el-col :span="5">
+              <el-input
+                v-model="searchForm.dataTypeName"
+                placeholder="请输入数据类别名称"
+                :prefix-icon="Search"
+                class="search-input"
+              />
+            </el-col>
+            <el-col :span="5">
+              <el-select
+                v-model="searchForm.parentId"
+                placeholder="请选择上级"
+                class="search-input"
+              >
+                <el-option label="全部" value="" />
+                <el-option label="无上级" value="0" />
+              </el-select>
+            </el-col>
+            <el-col :span="4">
+              <el-button type="primary" @click="handleSearch" class="search-btn">查询</el-button>
+              <el-button @click="handleReset" class="reset-btn">重置</el-button>
+            </el-col>
+          </el-row>
+        </div>
+        <!-- 树形表格区域 -->
+        <div class="table-container">
+          <el-button type="primary" class="add-btn mb-1">+ 新增</el-button>
+          <el-button @click="toggleExpand" class="expand-btn mb-1">展开/折叠</el-button>
+          <el-table
+            ref="dataTable"
+            :data="tableData"
+            v-loading="loading"
+            height="500"
+            show-header
+            :header-cell-style="{ background: '#f2f3f5', color: '#6b7785', fontWeight: 'bold' }"
+            row-key="id"
+            :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+            :default-expand-all="isAllExpanded"
+          >
+            <!-- 表格列定义保持不变 -->
+            <el-table-column
+              prop="dataTypeName"
+              label="数据类别名称"
+              width="200"
+            />
+            <el-table-column
+              prop="description"
+              label="描述"
+              min-width="200"
+            />
+            <el-table-column
+              prop="status"
+              label="状态"
+              width="120"
+            >
+              <template #default="scope">
+                <el-switch
+                  v-model="scope.row.status"
+                  active-color="#13ce66"
+                  inactive-color="#ff4d4f"
+                  :disabled="!scope.row.editable"
+                />
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="remark"
+              label="备注"
+              min-width="150"
+            />
+            <el-table-column
+              label="操作"
+              width="280"
+            >
+              <template #default="scope">
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn"
+                  @click="handleEdit(scope.row)"
+                >
+                  修改
+                </el-button>
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn"
+                  @click="handleAddChild(scope.row)"
+                >
+                  + 新增
+                </el-button>
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn" 
+                  style="color: #ff4d4f"
+                  @click="handleDelete(scope.row)"
+                >
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <Pagination
+            :total="total"
+            v-model:page="queryParams.pageNo"
+            v-model:limit="queryParams.pageSize"
+            @pagination="getList"
+          />
+        </div>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script setup>
+import { ref, reactive, nextTick } from 'vue';
+import { Search } from "@element-plus/icons-vue";
+
+// 表格引用
+const dataTable = ref(null);
+// 新增展开状态跟踪
+const isAllExpanded = ref(false);  // 控制默认展开状态
+
+// 查询参数
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  serviceName: ''
+})
+
+// 搜索表单数据
+const searchForm = ref({
+  dataTypeName: '',
+  parentId: '',
+  description: ''
+});
+
+// 表格数据 - 树形结构
+const tableData = ref([
+  {
+    id: 1,
+    dataTypeName: '水文监测',
+    description: '辽河流域水文要素监测数据',
+    status: true,
+    remark: '-',
+    editable: true,
+  },
+  {
+    id: 2,
+    dataTypeName: '防洪抗旱',
+    description: '防汛抗旱指挥调度相关数据',
+    status: true,
+    remark: '-',
+    editable: true,
+    children: [
+      {
+        id: 21,
+        dataTypeName: '旱情监测',
+        description: '干旱监测评估数据',
+        status: true,
+        remark: '-',
+        editable: true,
+        children: [
+          {
+            id: 211,
+            dataTypeName: '土壤墒情',
+            description: '土壤含水量监测',
+            status: true,
+            remark: '-',
+            editable: true,
+          },
+          {
+            id: 212,
+            dataTypeName: '作物旱情',
+            description: '农作物受旱情况',
+            status: true,
+            remark: '-',
+            editable: true,
+          }
+        ]
+      },
+      {
+        id: 22,
+        dataTypeName: '抢险救灾',
+        description: '防汛抢险救灾数据',
+        status: true,
+        remark: '-',
+        editable: true,
+      }
+    ]
+  }
+]);
+
+// 分页相关数据
+const total = ref(10);
+const loading = ref(false);
+
+// 处理搜索
+const handleSearch = () => {
+  console.log('搜索条件:', searchForm.value);
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 处理重置
+const handleReset = () => {
+  searchForm.value = {
+    dataTypeName: '',
+    parentId: '',
+    description: ''
+  };
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 获取列表数据
+const getList = () => {
+  console.log('分页参数:', queryParams);
+  // 实际项目中这里会调用接口获取数据
+};
+
+// 展开/折叠所有节点 - 修复版本
+const toggleExpand = () => {
+  if (!dataTable.value) return;
+  
+  // 切换展开状态
+  isAllExpanded.value = !isAllExpanded.value;
+  
+  // 递归展开或折叠所有行
+  const toggleAllRows = (rows, expanded) => {
+    if (!rows || !rows.length) return;
+    
+    rows.forEach(row => {
+      dataTable.value.toggleRowExpansion(row, expanded);
+      if (row.children && row.children.length) {
+        toggleAllRows(row.children, expanded);
+      }
+    });
+  };
+  
+  // 执行展开/折叠操作
+  toggleAllRows(tableData.value, isAllExpanded.value);
+};
+
+// 编辑操作
+const handleEdit = (row) => {
+  console.log('编辑:', row);
+};
+
+// 新增子节点
+const handleAddChild = (row) => {
+  console.log('新增子节点:', row);
+};
+
+// 删除操作
+const handleDelete = (row) => {
+  console.log('删除:', row);
+};
+</script>
+
+<style scoped>
+/* 样式保持不变 */
+.main-content {
+  display: flex;
+  flex: 1;
+  overflow: hidden;
+}
+
+.main {
+  flex: 1;
+  overflow-y: auto;
+}
+
+.search-container {
+  margin-bottom: 20px;
+  padding: 15px;
+  background-color: #ffffff;
+  border-radius: 4px;
+}
+
+.search-input {
+  width: 100%;
+}
+
+.search-btn {
+  margin-right: 10px;
+}
+
+.table-container {
+  background-color: #fff;
+  border-radius: 4px;
+  padding: 15px;
+}
+
+.add-btn {
+  margin-right: 10px;
+}
+
+.expand-btn {
+  margin-right: 10px;
+}
+
+.operation-btn {
+  margin-right: 5px;
+}
+
+.mb-1 {
+  margin-bottom: 8px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/base/category/dataElement/index.vue b/src/views/base/category/dataElement/index.vue
new file mode 100644
index 0000000..cdfddab
--- /dev/null
+++ b/src/views/base/category/dataElement/index.vue
@@ -0,0 +1,320 @@
+<template>
+  <el-card shadow="never" class="b-r-top-15 m-b-10">
+    <div class="main-content">
+      <!-- 主内容区域 -->
+      <div class="main">
+        <!-- 搜索和新增区域 -->
+        <div class="search-container">
+          <!-- 第一行：搜索框和搜索、重置按钮 -->
+          <el-row :gutter="20">
+            <el-col :span="5">
+              <el-input
+                v-model="searchForm.dataTypeName"
+                placeholder="请输入数据类别名称"
+                :prefix-icon="Search"
+                class="search-input"
+              />
+            </el-col>
+            <el-col :span="5">
+              <el-select
+                v-model="searchForm.parentId"
+                placeholder="请选择上级"
+                class="search-input"
+              >
+                <el-option label="全部" value="" />
+                <el-option label="无上级" value="0" />
+              </el-select>
+            </el-col>
+            <el-col :span="4">
+              <el-button type="primary" @click="handleSearch" class="search-btn">查询</el-button>
+              <el-button @click="handleReset" class="reset-btn">重置</el-button>
+            </el-col>
+          </el-row>
+        </div>
+        <!-- 树形表格区域 -->
+        <div class="table-container">
+          <el-button type="primary" class="add-btn mb-1">+ 新增</el-button>
+          <el-button @click="toggleExpand" class="expand-btn mb-1">展开/折叠</el-button>
+          <el-table
+            ref="dataTable"
+            :data="tableData"
+            v-loading="loading"
+            height="500"
+            show-header
+            :header-cell-style="{ background: '#f2f3f5', color: '#6b7785', fontWeight: 'bold' }"
+            row-key="id"
+            :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+            :default-expand-all="isAllExpanded"
+          >
+            <!-- 表格列定义保持不变 -->
+            <el-table-column
+              prop="dataTypeName"
+              label="数据类别名称"
+              width="200"
+            />
+            <el-table-column
+              prop="description"
+              label="描述"
+              min-width="200"
+            />
+            <el-table-column
+              prop="status"
+              label="状态"
+              width="120"
+            >
+              <template #default="scope">
+                <el-switch
+                  v-model="scope.row.status"
+                  active-color="#13ce66"
+                  inactive-color="#ff4d4f"
+                  :disabled="!scope.row.editable"
+                />
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="remark"
+              label="备注"
+              min-width="150"
+            />
+            <el-table-column
+              label="操作"
+              width="280"
+            >
+              <template #default="scope">
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn"
+                  @click="handleEdit(scope.row)"
+                >
+                  修改
+                </el-button>
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn"
+                  @click="handleAddChild(scope.row)"
+                >
+                  + 新增
+                </el-button>
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn" 
+                  style="color: #ff4d4f"
+                  @click="handleDelete(scope.row)"
+                >
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <Pagination
+            :total="total"
+            v-model:page="queryParams.pageNo"
+            v-model:limit="queryParams.pageSize"
+            @pagination="getList"
+          />
+        </div>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script setup>
+import { ref, reactive, nextTick } from 'vue';
+import { Search } from "@element-plus/icons-vue";
+
+// 表格引用
+const dataTable = ref(null);
+// 新增展开状态跟踪
+const isAllExpanded = ref(false);  // 控制默认展开状态
+
+// 查询参数
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  serviceName: ''
+})
+
+// 搜索表单数据
+const searchForm = ref({
+  dataTypeName: '',
+  parentId: '',
+  description: ''
+});
+
+// 表格数据 - 树形结构
+const tableData = ref([
+  {
+    id: 1,
+    dataTypeName: '水文监测',
+    description: '辽河流域水文要素监测数据',
+    status: true,
+    remark: '-',
+    editable: true,
+  },
+  {
+    id: 2,
+    dataTypeName: '防洪抗旱',
+    description: '防汛抗旱指挥调度相关数据',
+    status: true,
+    remark: '-',
+    editable: true,
+    children: [
+      {
+        id: 21,
+        dataTypeName: '旱情监测',
+        description: '干旱监测评估数据',
+        status: true,
+        remark: '-',
+        editable: true,
+        children: [
+          {
+            id: 211,
+            dataTypeName: '土壤墒情',
+            description: '土壤含水量监测',
+            status: true,
+            remark: '-',
+            editable: true,
+          },
+          {
+            id: 212,
+            dataTypeName: '作物旱情',
+            description: '农作物受旱情况',
+            status: true,
+            remark: '-',
+            editable: true,
+          }
+        ]
+      },
+      {
+        id: 22,
+        dataTypeName: '抢险救灾',
+        description: '防汛抢险救灾数据',
+        status: true,
+        remark: '-',
+        editable: true,
+      }
+    ]
+  }
+]);
+
+// 分页相关数据
+const total = ref(10);
+const loading = ref(false);
+
+// 处理搜索
+const handleSearch = () => {
+  console.log('搜索条件:', searchForm.value);
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 处理重置
+const handleReset = () => {
+  searchForm.value = {
+    dataTypeName: '',
+    parentId: '',
+    description: ''
+  };
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 获取列表数据
+const getList = () => {
+  console.log('分页参数:', queryParams);
+  // 实际项目中这里会调用接口获取数据
+};
+
+// 展开/折叠所有节点 - 修复版本
+const toggleExpand = () => {
+  if (!dataTable.value) return;
+  
+  // 切换展开状态
+  isAllExpanded.value = !isAllExpanded.value;
+  
+  // 递归展开或折叠所有行
+  const toggleAllRows = (rows, expanded) => {
+    if (!rows || !rows.length) return;
+    
+    rows.forEach(row => {
+      dataTable.value.toggleRowExpansion(row, expanded);
+      if (row.children && row.children.length) {
+        toggleAllRows(row.children, expanded);
+      }
+    });
+  };
+  
+  // 执行展开/折叠操作
+  toggleAllRows(tableData.value, isAllExpanded.value);
+};
+
+// 编辑操作
+const handleEdit = (row) => {
+  console.log('编辑:', row);
+};
+
+// 新增子节点
+const handleAddChild = (row) => {
+  console.log('新增子节点:', row);
+};
+
+// 删除操作
+const handleDelete = (row) => {
+  console.log('删除:', row);
+};
+</script>
+
+<style scoped>
+/* 样式保持不变 */
+.main-content {
+  display: flex;
+  flex: 1;
+  overflow: hidden;
+}
+
+.main {
+  flex: 1;
+  overflow-y: auto;
+}
+
+.search-container {
+  margin-bottom: 20px;
+  padding: 15px;
+  background-color: #ffffff;
+  border-radius: 4px;
+}
+
+.search-input {
+  width: 100%;
+}
+
+.search-btn {
+  margin-right: 10px;
+}
+
+.table-container {
+  background-color: #fff;
+  border-radius: 4px;
+  padding: 15px;
+}
+
+.add-btn {
+  margin-right: 10px;
+}
+
+.expand-btn {
+  margin-right: 10px;
+}
+
+.operation-btn {
+  margin-right: 5px;
+}
+
+.mb-1 {
+  margin-bottom: 8px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/base/project/manage/index.vue b/src/views/base/project/manage/index.vue
new file mode 100644
index 0000000..efb2f54
--- /dev/null
+++ b/src/views/base/project/manage/index.vue
@@ -0,0 +1,513 @@
+<template>
+  <el-card shadow="never" class="b-r-top-15 m-b-10">
+    <div class="main-content">
+      <!-- 主内容区域 -->
+      <div class="main">
+        <!-- 搜索和新增区域 -->
+        <div class="search-container">
+          <!-- 第一行：搜索框和搜索、重置按钮 -->
+          <el-row :gutter="20">
+            <el-col :span="5">
+              <el-input
+                v-model="searchForm.projectName"
+                placeholder="请输入项目名称"
+                :prefix-icon="Search"
+                class="search-input"
+              />
+            </el-col>
+            <el-col :span="5">
+              <el-select
+                v-model="searchForm.manager"
+                placeholder="请选择负责人"
+                class="search-input"
+              >
+                <el-option label="全部" value="" />
+                <el-option label="管理员" value="管理员" />
+                <el-option label="测试" value="测试" />
+              </el-select>
+            </el-col>
+            <el-col :span="5">
+              <el-select
+                v-model="searchForm.status"
+                placeholder="请选择状态"
+                class="search-input"
+              >
+                <el-option label="全部" value="" />
+                <el-option label="启用" value="1" />
+                <el-option label="禁用" value="0" />
+              </el-select>
+            </el-col>
+            <el-col :span="4">
+              <el-button type="primary"  @click="handleSearch">查询</el-button>
+              <el-button @click="handleReset" >重置</el-button>
+            </el-col>
+          </el-row>
+        </div>
+        <!-- 表格区域 -->
+        <div class="table-container">
+          <el-button type="primary" class="mb-1" @click="handleAdd">+ 新增</el-button>
+          <el-button type="warning" class="mb-1">修改</el-button>
+          <el-button type="danger" class="mb-1">删除</el-button>
+          <el-table
+            ref="dataTable"
+            :data="tableData"
+            v-loading="loading"
+            height="500"
+            show-header
+            :header-cell-style="{ background: '#f2f3f5', color: '#6b7785', fontWeight: 'bold' }"
+            row-key="id"
+          >
+            <el-table-column
+              type="selection"
+              width="55"
+            />
+            <el-table-column
+              prop="id"
+              label="编号"
+              width="80"
+            />
+            <el-table-column
+              prop="projectName"
+              label="项目名称"
+              min-width="150"
+            />
+            <el-table-column
+              prop="description"
+              label="项目描述"
+              min-width="200"
+            />
+            <el-table-column
+              prop="manager"
+              label="负责人"
+              width="120"
+            />
+            <el-table-column
+              prop="contact"
+              label="联系方式"
+              width="150"
+            />
+            <el-table-column
+              prop="status"
+              label="状态"
+              width="120"
+            >
+              <template #default="scope">
+                <el-switch
+                  v-model="scope.row.status"
+                  active-color="#409eff"
+                  inactive-color="#c0c4cc"
+                  :active-value="true"
+                  :inactive-value="false"
+                />
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="remark"
+              label="备注"
+              min-width="150"
+            />
+            <el-table-column
+              label="操作"
+              width="180"
+              align="center"
+            >
+              <template #default="scope">
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn"
+                  style="color: #409eff"
+                  @click="handleEdit(scope.row)"
+                >
+                  修改
+                </el-button>
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn" 
+                  style="color: #ff4d4f"
+                  @click="handleDelete(scope.row)"
+                >
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <Pagination
+            :total="total"
+            v-model:page="queryParams.pageNo"
+            v-model:limit="queryParams.pageSize"
+            @pagination="getList"
+          />
+        </div>
+      </div>
+    </div>
+  </el-card>
+
+  <!-- 新增/编辑项目弹框 -->
+  <el-dialog 
+    v-model="dialogVisible" 
+    :title="dialogTitle"
+    width="800px"
+    :close-on-click-modal="false"
+  >
+    <el-form 
+      :model="formData" 
+      ref="formRef"
+      :rules="formRules"
+      label-width="100px"
+      class="demo-ruleForm"
+    >
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="项目名称" prop="projectName">
+            <el-input v-model="formData.projectName" placeholder="请输入项目名称" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="负责人" prop="manager">
+            <el-select v-model="formData.manager" placeholder="请选择">
+              <el-option label="管理员" value="管理员" />
+              <el-option label="测试" value="测试" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="联系方式" prop="contact">
+            <el-input v-model="formData.contact" placeholder="请输入联系方式" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="状态">
+            <el-radio-group v-model="formData.status">
+              <el-radio :label="true">启用</el-radio>
+              <el-radio :label="false">禁用</el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      
+      <el-form-item label="项目描述">
+        <el-input 
+          v-model="formData.description" 
+          placeholder="请输入项目描述" 
+          type="textarea" 
+          rows="3"
+        />
+      </el-form-item>
+      
+      <el-form-item label="备注">
+        <el-input 
+          v-model="formData.remark" 
+          placeholder="请输入备注" 
+          type="textarea" 
+          rows="3"
+        />
+      </el-form-item>
+    </el-form>
+    
+    <template #footer>
+      <el-button @click="dialogVisible = false">取消</el-button>
+      <el-button type="primary" @click="handleSubmit">确定</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted } from 'vue';
+import { Search } from "@element-plus/icons-vue";
+
+// 表格引用
+const dataTable = ref(null);
+// 表单引用
+const formRef = ref(null);
+
+// 查询参数
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  projectName: ''
+})
+
+// 搜索表单数据
+const searchForm = ref({
+  projectName: '',
+  manager: '',
+  status: ''
+});
+
+// 表格数据
+const tableData = ref([
+  {
+    id: 94,
+    projectName: '1',
+    description: '-',
+    manager: '管理员',
+    contact: '19851942681',
+    status: true,
+    remark: '-'
+  },
+  {
+    id: 93,
+    projectName: '测试',
+    description: '-',
+    manager: '管理员',
+    contact: '19851942681',
+    status: true,
+    remark: '-'
+  },
+  {
+    id: 92,
+    projectName: '666',
+    description: '12312',
+    manager: '测试',
+    contact: '19851942682',
+    status: true,
+    remark: '123'
+  },
+  {
+    id: 91,
+    projectName: 'test',
+    description: '-',
+    manager: '管理员',
+    contact: '19851942681',
+    status: false,
+    remark: '-'
+  },
+  {
+    id: 90,
+    projectName: 'ddd',
+    description: 'dasd',
+    manager: '测试',
+    contact: '19851942682',
+    status: false,
+    remark: 'absd'
+  },
+  {
+    id: 89,
+    projectName: 'wwsys1',
+    description: '-',
+    manager: '管理员',
+    contact: '19851942681',
+    status: false,
+    remark: '-'
+  },
+  {
+    id: 88,
+    projectName: '123123123',
+    description: '-',
+    manager: '管理员',
+    contact: '19851942681',
+    status: true,
+    remark: '-'
+  },
+  {
+    id: 87,
+    projectName: 'test23131',
+    description: '-',
+    manager: '测试',
+    contact: '19851942682',
+    status: true,
+    remark: '-'
+  },
+  {
+    id: 86,
+    projectName: 'test123',
+    description: '-',
+    manager: '测试',
+    contact: '19851942682',
+    status: true,
+    remark: '-'
+  },
+  {
+    id: 85,
+    projectName: '千数项目guo',
+    description: '-',
+    manager: '管理员',
+    contact: '19851942681',
+    status: true,
+    remark: '-'
+  }
+]);
+
+// 分页相关数据
+const total = ref(94);
+const loading = ref(false);
+
+// 弹框相关数据
+const dialogVisible = ref(false);
+const dialogTitle = ref('新增项目');
+const formData = ref({
+  id: null,
+  projectName: '',
+  manager: '',
+  contact: '',
+  status: false,  // 默认禁用
+  description: '',
+  remark: ''
+});
+
+// 表单验证规则
+const formRules = ref({
+  projectName: [
+    { required: true, message: '请输入项目名称', trigger: 'blur' }
+  ],
+  manager: [
+    { required: true, message: '请选择负责人', trigger: 'change' }
+  ]
+});
+
+// 处理搜索
+const handleSearch = () => {
+  console.log('搜索条件:', searchForm.value);
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 处理重置
+const handleReset = () => {
+  searchForm.value = {
+    projectName: '',
+    manager: '',
+    status: ''
+  };
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 获取列表数据
+const getList = () => {
+  console.log('分页参数:', queryParams);
+  // 实际项目中这里会调用接口获取数据
+};
+
+// 新增项目
+const handleAdd = () => {
+  // 重置表单数据
+  formData.value = {
+    id: null,
+    projectName: '',
+    manager: '',
+    contact: '',
+    status: false,  // 默认禁用
+    description: '',
+    remark: ''
+  };
+  dialogTitle.value = '新增项目';
+  dialogVisible.value = true;
+  // 重置表单验证
+  if (formRef.value) {
+    formRef.value.resetFields();
+  }
+};
+
+// 编辑项目
+const handleEdit = (row) => {
+  console.log('编辑:', row);
+  // 填充表单数据
+  formData.value = {
+    id: row.id,
+    projectName: row.projectName,
+    manager: row.manager,
+    contact: row.contact,
+    status: row.status,
+    description: row.description,
+    remark: row.remark
+  };
+  dialogTitle.value = '编辑项目';
+  dialogVisible.value = true;
+  // 重置表单验证
+  if (formRef.value) {
+    formRef.value.resetFields();
+  }
+};
+
+// 删除操作
+const handleDelete = (row) => {
+  console.log('删除:', row);
+};
+
+// 提交表单
+const handleSubmit = () => {
+  // 表单验证
+  formRef.value.validate((valid) => {
+    if (valid) {
+      if (formData.value.id) {
+        // 编辑操作
+        console.log('编辑提交:', formData.value);
+        // 这里添加编辑接口调用逻辑
+        // 调用成功后更新表格数据并关闭弹框
+        const index = tableData.value.findIndex(item => item.id === formData.value.id);
+        if (index !== -1) {
+          tableData.value.splice(index, 1, { ...formData.value });
+        }
+      } else {
+        // 新增操作
+        console.log('新增提交:', formData.value);
+        // 这里添加新增接口调用逻辑
+        // 调用成功后添加到表格数据并关闭弹框
+        const newId = Math.max(...tableData.value.map(item => item.id)) + 1;
+        tableData.value.unshift({
+          ...formData.value,
+          id: newId
+        });
+        total.value++;
+      }
+      dialogVisible.value = false;
+    } else {
+      console.log('表单验证失败');
+      return false;
+    }
+  });
+};
+</script>
+
+<style scoped>
+.main-content {
+  display: flex;
+  flex: 1;
+  overflow: hidden;
+}
+
+.main {
+  flex: 1;
+  overflow-y: auto;
+}
+
+.search-container {
+  padding: 0 15px;
+  background-color: #ffffff;
+  border-radius: 4px;
+}
+
+.search-input {
+  width: 100%;
+}
+
+.table-container {
+  background-color: #fff;
+  border-radius: 4px;
+  padding: 15px;
+}
+
+.mb-1 {
+  margin-bottom: 8px;
+}
+
+.text-right {
+  text-align: right;
+}
+
+/* 表单样式调整 */
+::v-deep .el-form-item {
+  margin-bottom: 25px;
+}
+
+::v-deep .el-dialog__body {
+  padding: 20px;
+}
+</style>
diff --git a/src/views/base/rules/cleaning/index.vue b/src/views/base/rules/cleaning/index.vue
new file mode 100644
index 0000000..915a876
--- /dev/null
+++ b/src/views/base/rules/cleaning/index.vue
@@ -0,0 +1,694 @@
+<template>
+  <el-card shadow="never" class="b-r-top-15 m-b-10">
+    <div class="main-content">
+      <!-- 左侧导航菜单 -->
+      <el-aside width="240px" class="sidebar">
+        <!-- 导航头部搜索框 -->
+        <div class="sidebar-header">
+          <el-input
+            v-model="searchKeyword"
+            placeholder="请输入规则类型"
+            :prefix-icon="Search"
+            class="sidebar-search"
+          />
+        </div>
+        
+        <!-- 动态导航菜单 -->
+        <el-menu
+          :default-active="activeMenu"
+          class="quality-menu"
+          background-color="#ffffff"
+          text-color="#1D2129"
+          active-text-color="#165DFF"
+          :unique-opened="true"
+        >
+          <!-- 动态生成菜单 -->
+          <template v-for="menu in filteredMenus" :key="menu.index">
+            <!-- 有子菜单的情况 -->
+            <el-sub-menu v-if="menu.children && menu.children.length" :index="menu.index">
+              <template #title>
+                <span><el-icon><list /></el-icon>{{ menu.title }}</span>
+              </template>
+              <!-- 二级菜单 -->
+              <template v-for="subMenu in menu.children" :key="subMenu.index">
+                <el-sub-menu v-if="subMenu.children && subMenu.children.length" :index="subMenu.index" style="margin-left: 25px;">
+                  <template #title>
+                    <span><el-icon><list /></el-icon>{{ subMenu.title }}</span>
+                  </template>
+                  <!-- 三级菜单项 -->
+                  <el-menu-item 
+                    v-for="item in subMenu.children" 
+                    :key="item.index" 
+                    :index="item.index"
+                    @click="handleMenuClick(item)"
+                  >
+                    <span><el-icon><list /></el-icon>{{ item.title }}</span>
+                  </el-menu-item>
+                </el-sub-menu>
+                <el-menu-item v-else :index="subMenu.index" @click="handleMenuClick(subMenu)" class="second-level-menu-item">
+                  <span><el-icon><list /></el-icon>{{ subMenu.title }}</span>
+                </el-menu-item>
+              </template>
+            </el-sub-menu>
+            <!-- 没有子菜单的情况 -->
+            <el-sub-menu v-else :index="menu.index" @click="handleMenuClick(menu)">
+              <template #title>
+                <span><el-icon><list /></el-icon>{{ menu.title }}</span>
+              </template>
+            </el-sub-menu>
+          </template>
+        </el-menu>
+      </el-aside>
+
+      <!-- 主内容区域 -->
+      <el-main class="main">
+        <!-- 搜索区域 -->
+        <div class="search-container">
+          <el-row :gutter="20">
+            <el-col :span="5">
+              <el-input
+                v-model="searchForm.name"
+                placeholder="请输入规则名称"
+                prefix-icon="Search"
+                class="search-input"
+              />
+            </el-col>
+            <el-col :span="5">
+              <el-input
+                v-model="searchForm.code"
+                placeholder="请输入规则编码"
+                prefix-icon="Search"
+                class="search-input"
+              />
+            </el-col>
+            <el-col :span="4">
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+              <el-button @click="handleReset">重置</el-button>
+            </el-col>
+          </el-row>
+        </div>
+
+        <!-- 表格区域 -->
+        <div class="table-container">
+          <el-button type="primary" @click="handleAddRule">新增规则</el-button>
+          <el-table
+            :data="tableData"
+            v-loading="loading"  
+            height="500" 
+            show-header=true 
+            :header-cell-style="{ background: '#f2f3f5', color: '#6b7785', fontWeight: 'bold' }"
+          >
+            <el-table-column
+              prop="ruleCode"
+              label="规则编码"
+              width="100"
+            />
+            <el-table-column
+              prop="ruleName"
+              label="规则名称"
+              width="180"
+            />
+            <el-table-column
+              prop="qualityDimension"
+              label="规则类型"
+              width="120"
+            />
+            <el-table-column
+              prop="ruleDescription"
+              label="规则描述"
+              min-width="200"
+            />
+            <el-table-column
+              prop="useScenario"
+              label="使用场景"
+              min-width="200"
+            />
+            <el-table-column
+              prop="example"
+              label="示例"
+              min-width="200"
+            >
+              <template #default="scope">
+                <div v-html="scope.row.example"></div>
+              </template>
+            </el-table-column>
+            <el-table-column
+              label="操作"
+              width="120"
+            >
+              <template #default="scope">
+                <el-button size="small" type="link" class="operation-btn" @click="handleEditRule(scope.row)">编辑</el-button>
+                <el-button size="small" type="link" class="operation-btn" style="color: #ff4d4f" @click="handleDeleteRule(scope.row)">删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <Pagination
+            :total="total"
+            v-model:page="queryParams.pageNo"
+            v-model:limit="queryParams.pageSize"
+            @pagination="getList"
+          />
+        </div>
+      </el-main>
+    </div>
+  </el-card>
+
+  <!-- 规则表单弹窗 -->
+  <el-dialog
+    v-model="dialogVisible"
+    :title="dialogTitle"
+    width="600px"
+    :before-close="handleDialogClose"
+  >
+    <el-form
+      ref="ruleFormRef"
+      :model="ruleForm"
+      :rules="ruleFormRules"
+      label-width="100px"
+      class="rule-form"
+    >
+      <el-form-item label="规则编码" prop="ruleCode">
+        <el-input v-model="ruleForm.ruleCode" placeholder="请输入规则编码" />
+      </el-form-item>
+      <el-form-item label="规则名称" prop="ruleName">
+        <el-input v-model="ruleForm.ruleName" placeholder="请输入规则名称" />
+      </el-form-item>
+      <!-- 修改为规则类型，使用级联选择器 -->
+      <el-form-item label="规则类型" prop="qualityDimension">
+        <el-cascader
+          v-model="ruleForm.qualityDimension"
+          :options="cascaderOptions"
+          :props="cascaderProps"
+          placeholder="请选择规则类型"
+          clearable
+          @change="handleCascaderChange"
+        />
+      </el-form-item>
+      <el-form-item label="规则描述" prop="ruleDescription">
+        <el-input
+          v-model="ruleForm.ruleDescription"
+          placeholder="请输入规则描述"
+          type="textarea"
+          rows="3"
+        />
+      </el-form-item>
+      <el-form-item label="使用场景" prop="useScenario">
+        <el-input
+          v-model="ruleForm.useScenario"
+          placeholder="请输入使用场景"
+          type="textarea"
+          rows="3"
+        />
+      </el-form-item>
+      <el-form-item label="示例" prop="example">
+        <el-input
+          v-model="ruleForm.example"
+          placeholder="请输入示例，可包含HTML标签"
+          type="textarea"
+          rows="3"
+        />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button @click="dialogVisible = false">取消</el-button>
+      <el-button type="primary" @click="handleSaveRule">保存</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { ref, reactive, computed, onMounted, getCurrentInstance } from 'vue';
+import { Search, List } from "@element-plus/icons-vue";
+import { getAttCleanCatList, getAttCleanRuleList, saveAttCleanRule, updateAttCleanRule, deleteAttCleanRule } from '@/api/base/cleaningRules'
+
+// 获取组件实例，用于表单验证
+const { proxy } = getCurrentInstance();
+
+// 查询参数
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  name: '',
+  code: ''
+})
+
+// 当前激活的菜单
+const activeMenu = ref('');
+
+// 导航菜单数据
+const menuData = ref([]);
+// 级联选择器选项
+const cascaderOptions = ref([]);
+// 级联选择器配置
+const cascaderProps = {
+  value: 'index',
+  label: 'title',
+  children: 'children',
+  checkStrictly: true // 可以选择任意层级
+};
+// 菜单加载状态
+const menuLoading = ref(false);
+
+// 从接口获取菜单数据并转换为树形结构
+const loadMenuData = async () => {
+  try {
+    menuLoading.value = true;
+    const response = await getAttCleanCatList();
+    // 假设接口返回格式为 { data: [...] }
+    const flatData = response || [];
+    
+    // 将扁平数据转换为树形结构
+    menuData.value = convertToTree(flatData);
+    // 级联选择器使用相同的数据
+    cascaderOptions.value = JSON.parse(JSON.stringify(menuData.value));
+    
+    // 设置默认激活的第一个菜单项
+    if (menuData.value.length > 0) {
+      activeMenu.value = menuData.value[0].index;
+    }
+  } catch (error) {
+    console.error('获取菜单数据失败:', error);
+  } finally {
+    menuLoading.value = false;
+  }
+};
+
+// 将扁平数组转换为树形结构
+const convertToTree = (items) => {
+  // 首先将所有项按id映射，方便查找
+  const map = {};
+  const tree = [];
+  
+  // 先创建所有节点的映射
+  items.forEach(item => {
+    map[item.id] = {
+      index: item.code,  // 使用code作为索引值
+      title: item.name,  // 使用name作为标题
+      id: item.id,
+      parentId: item.parentId,
+      children: []
+    };
+  });
+  
+  // 构建树形结构
+  items.forEach(item => {
+    const node = map[item.id];
+    if (item.parentId === 0) {
+      // 根节点
+      tree.push(node);
+    } else {
+      // 找到父节点并添加到其子节点中
+      const parent = map[item.parentId];
+      if (parent) {
+        parent.children.push(node);
+      } else {
+        // 如果找不到父节点，作为根节点处理
+        tree.push(node);
+      }
+    }
+  });
+  
+  // 按sortOrder排序
+  const sortByOrder = (nodes) => {
+    if (!nodes || !nodes.length) return;
+    
+    nodes.sort((a, b) => (a.sortOrder || 0) - (b.sortOrder || 0));
+    nodes.forEach(node => {
+      if (node.children && node.children.length) {
+        sortByOrder(node.children);
+      }
+    });
+  };
+  
+  sortByOrder(tree);
+  
+  return tree;
+};
+
+// 导航搜索关键词
+const searchKeyword = ref('');
+
+// 根据搜索关键词过滤菜单
+const filteredMenus = computed(() => {
+  if (!searchKeyword.value) return menuData.value;
+  
+  const filterMenu = (menus) => {
+    return menus.filter(menu => {
+      // 如果标题匹配，保留整个菜单项
+      if (menu.title.includes(searchKeyword.value)) {
+        return true;
+      }
+      
+      // 如果有子菜单，递归过滤
+      if (menu.children && menu.children.length) {
+        const filteredChildren = filterMenu(menu.children);
+        if (filteredChildren.length > 0) {
+          menu.children = filteredChildren;
+          return true;
+        }
+      }
+      
+      return false;
+    });
+  };
+  
+  return filterMenu(JSON.parse(JSON.stringify(menuData.value)));
+});
+
+// 搜索表单数据
+const searchForm = ref({
+  name : '',
+  code : ''
+});
+
+// 表格数据
+const tableData = ref([]);
+// 分页总数
+const total = ref(0);
+// 表格加载状态
+const loading = ref(false);
+
+// 规则表单弹窗相关
+const dialogVisible = ref(false);
+const dialogTitle = ref('新增规则');
+const currentRuleId = ref('');
+const ruleFormRef = ref(null);
+
+// 规则表单数据
+const ruleForm = reactive({
+  ruleCode: '',
+  ruleName: '',
+  qualityDimension: [], // 级联选择器使用数组存储选择的路径
+  ruleDescription: '',
+  useScenario: '',
+  example: ''
+});
+
+// 表单验证规则
+const ruleFormRules = ref({
+  ruleCode: [
+    { required: true, message: '请输入规则编码', trigger: 'blur' }
+  ],
+  ruleName: [
+    { required: true, message: '请输入规则名称', trigger: 'blur' }
+  ],
+  qualityDimension: [
+    { required: true, message: '请选择规则类型', trigger: 'change' }
+  ],
+  ruleDescription: [
+    { required: true, message: '请输入规则描述', trigger: 'blur' }
+  ]
+});
+
+// 处理级联选择器变化
+const handleCascaderChange = (value) => {
+  // value是选中的路径数组，如 [一级索引, 二级索引, 三级索引]
+  console.log('选择的规则类型:', value);
+  // 可以在这里处理选择变化后的逻辑
+};
+
+// 获取规则列表数据
+const getList = async () => {
+  try {
+    loading.value = true;
+    // 构建查询参数
+    const params = {
+      ...queryParams,
+      name: searchForm.value.name,
+      code: searchForm.value.code,
+    };
+    
+    const response = await getAttCleanRuleList(params);
+    // 假设接口返回格式为 { data: { list: [], total: 0 } }
+    tableData.value = response.data.list || [];
+    // 处理表格数据中的规则类型，将编码转换为级联选择器需要的数组格式
+    tableData.value.forEach(item => {
+      // 这里需要根据实际数据结构处理，将字符串格式的规则类型转换为级联数组
+      // 如果后端返回的是完整路径，如 "code1,code2,code3"，可以这样处理:
+      if (typeof item.qualityDimension === 'string') {
+        item.qualityDimensionPath = item.qualityDimension.split(',');
+      }
+    });
+    total.value = response.data.total || 0;
+  } catch (error) {
+    console.error('获取规则列表失败:', error);
+  } finally {
+    loading.value = false;
+  }
+};
+
+// 处理菜单点击
+const handleMenuClick = (menu) => {
+  activeMenu.value = menu.index;
+  // 重置页码，重新加载数据
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 处理搜索
+const handleSearch = () => {
+  // 重置页码，重新加载数据
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 处理重置
+const handleReset = () => {
+  searchForm.value = {
+    name: '',
+    code: ''
+  };
+  // 重置页码，重新加载数据
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 处理新增规则
+const handleAddRule = () => {
+  dialogTitle.value = '新增规则';
+  currentRuleId.value = '';
+  // 重置表单
+  Object.keys(ruleForm).forEach(key => {
+    ruleForm[key] = key === 'qualityDimension' ? [] : '';
+  });
+  dialogVisible.value = true;
+};
+
+// 处理编辑规则
+const handleEditRule = (row) => {
+  dialogTitle.value = '编辑规则';
+  currentRuleId.value = row.id;
+  // 填充表单数据
+  Object.keys(ruleForm).forEach(key => {
+    if (key === 'qualityDimension') {
+      // 处理规则类型，将字符串转换为级联数组
+      ruleForm[key] = typeof row[key] === 'string' ? row[key].split(',') : [];
+    } else {
+      ruleForm[key] = row[key] || '';
+    }
+  });
+  dialogVisible.value = true;
+};
+
+// 处理删除规则
+const handleDeleteRule = async (row) => {
+  try {
+    await proxy.$confirm('确定要删除这条规则吗？', '确认删除', {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning'
+    });
+    
+    await deleteAttCleanRule(row.id);
+    proxy.$message.success('删除成功');
+    // 重新加载数据
+    getList();
+  } catch (error) {
+    if (error !== 'cancel') {
+      console.error('删除规则失败:', error);
+      proxy.$message.error('删除失败，请重试');
+    }
+  }
+};
+
+// 保存规则（新增或编辑）
+const handleSaveRule = async () => {
+  try {
+    // 表单验证
+    await ruleFormRef.value.validate();
+    
+    // 处理级联选择器的值，转换为后端需要的格式（如逗号分隔的字符串）
+    const ruleData = {
+      ...ruleForm,
+      qualityDimension: ruleForm.qualityDimension.join(',')
+    };
+    
+    if (currentRuleId.value) {
+      // 编辑操作
+      await updateAttCleanRule({
+        id: currentRuleId.value,
+        ...ruleData
+      });
+      proxy.$message.success('更新成功');
+    } else {
+      // 新增操作
+      await saveAttCleanRule(ruleData);
+      proxy.$message.success('新增成功');
+    }
+    
+    dialogVisible.value = false;
+    // 重新加载数据
+    getList();
+  } catch (error) {
+    if (error.name !== 'Error') {
+      // 表单验证失败不显示错误提示
+      return;
+    }
+    console.error('保存规则失败:', error);
+    proxy.$message.error('保存失败，请重试');
+  }
+};
+
+// 关闭弹窗
+const handleDialogClose = () => {
+  // 重置表单验证状态
+  ruleFormRef.value.resetFields();
+  dialogVisible.value = false;
+};
+
+// 在组件挂载时加载菜单和表格数据
+onMounted(() => {
+  loadMenuData().then(() => {
+    getList();
+  });
+});
+</script>
+
+<style scoped>
+.main-content {
+  display: flex;
+  flex: 1;
+  overflow: hidden;
+}
+
+.sidebar {
+  background-color: #ffffff;
+  border-right: 1px solid #e5e7eb;
+  display: flex;
+  flex-direction: column;
+}
+
+/* 侧边栏头部搜索样式 */
+.sidebar-header {
+  padding: 16px;
+  border-bottom: 1px solid #f0f0f0;
+}
+
+.sidebar-header {
+  padding: 15px;
+  border-bottom: 1px solid #f0f0f0;
+}
+
+.sidebar-search {
+  width: 100%;
+  --el-input-height: 32px;
+  background-color: #f5f7fa;
+  border-color: #e5e7eb;
+}
+
+.sidebar-search .el-input__wrapper {
+  box-shadow: none;
+}
+
+/* 菜单样式调整 */
+.quality-menu {
+  border-right: none;
+  flex: 1;
+}
+
+.quality-menu :deep(.el-sub-menu__title),
+.quality-menu :deep(.el-menu-item) {
+  height: 40px;
+  line-height: 40px;
+  font-size: 14px;
+  color: #1D2129;
+}
+
+.quality-menu :deep(.el-sub-menu__title:hover),
+.quality-menu :deep(.el-menu-item:hover) {
+  background-color: #f7f8fa;
+}
+
+.quality-menu :deep(.el-menu-item.is-active) {
+  background-color: #e8f3ff !important;
+  color: #165DFF !important;
+  font-weight: 500;
+}
+
+/* 一级菜单 */
+.quality-menu :deep(.el-sub-menu:first-child .el-sub-menu__title) {
+  font-weight: 500;
+  padding-left: 22px !important;
+}
+
+/* 二级菜单 - 有子菜单的 */
+.quality-menu :deep(.el-sub-menu .el-sub-menu__title) {
+  padding-left: 22px !important;
+  font-size: 14px;
+  color: #4E5969;
+}
+
+/* 二级菜单项 - 没有子菜单的 */
+.second-level-menu-item {
+  padding-left: 32px !important;
+}
+
+/* 三级菜单项 */
+.quality-menu :deep(.el-menu-item) {
+  padding-left: 70px !important;
+  font-size: 14px;
+  color: #4E5969;
+}
+
+.quality-menu :deep(.el-icon.el-sub-menu__icon-arrow) {
+  margin-top: -4px;
+  color: #86909C;
+}
+
+/* 主内容区域样式 */
+.main {
+  flex: 1;
+  padding: 20px;
+  overflow-y: auto;
+}
+
+.search-container {
+  padding: 0 15px;
+  background-color: #ffffff;
+  border-radius: 4px;
+}
+
+.search-input {
+  width: 100%;
+}
+
+.table-container {
+  border-radius: 4px;
+  padding: 16px;
+  background-color: #ffffff;
+}
+
+.operation-btn {
+  padding: 0 5px;
+}
+
+/* 表单样式 */
+.rule-form {
+  margin-top: 20px;
+}
+
+.rule-form .el-form-item {
+  margin-bottom: 15px;
+}
+</style>
diff --git a/src/views/base/rules/inspect/index.vue b/src/views/base/rules/inspect/index.vue
new file mode 100644
index 0000000..02ad7b1
--- /dev/null
+++ b/src/views/base/rules/inspect/index.vue
@@ -0,0 +1,550 @@
+<template>
+  <el-card shadow="never" class="b-r-top-15 m-b-10">
+    <div class="main-content">
+      <!-- 左侧导航菜单 -->
+      <el-aside width="200px" class="sidebar">
+        <!-- 导航头部搜索框 -->
+        <div class="sidebar-header">
+          <el-input v-model="searchKeyword" placeholder="请输入规则类型" :prefix-icon="Search" class="sidebar-search" />
+        </div>
+
+        <!-- 导航菜单 -->
+        <el-menu
+default-active="" class="quality-menu" background-color="#ffffff" text-color="#333"
+          active-text-color="#165DFF" :unique-opened="true" :default-openeds="['quality-dimensions']"
+          @open="handleMenuOpen" @close="handleMenuClose">
+          <el-sub-menu index="quality-dimensions">
+            <template #title>
+              <span>质量维度</span>
+              <el-icon class="arrow-icon" :class="{ 'rotate': isQualityDimensionsOpen }"/>
+            </template>
+            <!-- 使用字典数据动态生成质量维度子菜单，添加点击事件 -->
+            <el-menu-item 
+              v-for="(item, index) in qualityDimensionList" 
+              :key="item.value" 
+              :index="index" 
+              class="menu-item"
+              @click="handleDimensionClick(item.value)">
+              {{ item.label }}
+            </el-menu-item>
+          </el-sub-menu>
+        </el-menu>
+      </el-aside>
+
+      <!-- 主内容区域 -->
+      <el-main class="main">
+        <!-- 搜索区域 -->
+        <div class="search-container">
+          <el-row :gutter="20">
+            <el-col :span="5">
+              <el-input v-model="searchForm.name" placeholder="请输入规则名称" class="search-input" />
+            </el-col>
+            <el-col :span="5">
+              <el-input v-model="searchForm.code" placeholder="请输入规则编码" class="search-input" />
+            </el-col>
+            <el-col :span="4">
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+              <el-button @click="handleReset">重置</el-button>
+            </el-col>
+          </el-row>
+        </div>
+
+        <!-- 表格区域 -->
+        <div class="table-container">
+          <el-button type="primary" class="add-btn mb-1" @click="openAddDialog">+ 新增</el-button>
+          <el-table
+:data="tableData" v-loading="loading" height="500" :show-header="true"
+            :header-cell-style="{ background: '#f2f3f5', color: '#6b7785', fontWeight: 'bold' }">
+            <el-table-column prop="code" label="规则编码" width="100" />
+            <el-table-column prop="name" label="规则名称" width="180" />
+            <el-table-column prop="qualityDim" label="质量维度" width="120">
+              <template #default="scope">
+                <el-tag :type="getDimensionTagType(scope.row.qualityDim)" size="small">
+                  {{ getDictLabel(DICT_TYPE.ATT_RULE_AUDIT_Q_DIMENSION, scope.row.qualityDim) }}
+                </el-tag>
+              </template>
+            </el-table-column>
+            <el-table-column prop="description" label="规则描述" min-width="200" />
+            <el-table-column prop="useCase" label="使用场景" min-width="200" />
+            <el-table-column prop="example" label="示例" min-width="200">
+              <template #default="scope">
+                <div v-html="scope.row.example"></div>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作" width="120">
+              <template #default="scope">
+                <el-button
+size="small" type="text" class="operation-btn"
+                  @click="openEditDialog(scope.row)">编辑</el-button>
+                <el-button 
+                  size="small" 
+                  type="text" 
+                  class="operation-btn" 
+                  style="color: #ff4d4f"
+                  @click="handleDelete(scope.row.id)">删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <Pagination
+:total="total" v-model:page="queryParams.pageNo" v-model:limit="queryParams.pageSize"
+            @pagination="getList" />
+        </div>
+      </el-main>
+    </div>
+  </el-card>
+
+  <!-- 新增/编辑规则弹窗 -->
+  <el-dialog v-model="dialogVisible" :title="dialogTitle" width="600px" :before-close="handleDialogClose">
+    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-width="100px" class="rule-form">
+      <el-form-item label="规则编码" prop="code">
+        <el-input v-model="ruleForm.code" placeholder="请输入规则编码" />
+      </el-form-item>
+      <el-form-item label="规则名称" prop="name">
+        <el-input v-model="ruleForm.name" placeholder="请输入规则名称" />
+      </el-form-item>
+      <el-form-item label="质量维度" prop="qualityDim">
+        <el-select v-model="ruleForm.qualityDim" placeholder="请选择质量维度">
+          <el-option v-for="item in qualityDimensionList" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="规则描述" prop="description">
+        <el-input v-model="ruleForm.description" placeholder="请输入规则描述" type="textarea" :rows="3" />
+      </el-form-item>
+      <el-form-item label="使用场景" prop="useCase">
+        <el-input v-model="ruleForm.useCase" placeholder="请输入使用场景" type="textarea" :rows="3" />
+      </el-form-item>
+      <el-form-item label="示例" prop="example">
+        <el-input v-model="ruleForm.example" placeholder="请输入示例，支持HTML格式" type="textarea" :rows="3" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button @click="dialogVisible = false">取消</el-button>
+      <el-button type="primary" @click="handleSave">保存</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { DICT_TYPE, getDictLabel, getDictObj, getIntDictOptions } from '@/utils/dict'
+import { ref, reactive, watch, onMounted, nextTick } from 'vue';
+import { Search, Delete } from "@element-plus/icons-vue";
+import { ElMessage, ElLoading, ElMessageBox } from 'element-plus';
+import { getAttAuditRuleList, addAttAuditRule, updateAttAuditRule, deleteAttAuditRule } from '@/api/base/inspectRules'
+
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  serviceName: '',
+  // 匹配表格的prop字段
+  name: '',
+  code: '',
+  // 新增质量维度筛选参数
+  qualityDim: ''
+})
+
+// 导航搜索关键词
+const searchKeyword = ref('');
+
+// 搜索表单数据 - 匹配表格字段
+const searchForm = ref({
+  name: '',
+  code: ''
+});
+
+// 质量维度字典列表
+const qualityDimensionList = ref([]);
+
+// 表格数据 - 从API获取
+const tableData = ref([]);
+
+// 分页相关数据
+const total = ref(0);
+const loading = ref(false);
+
+// 监控子菜单展开状态
+const isQualityDimensionsOpen = ref(true);
+
+// 弹窗相关变量
+const dialogVisible = ref(false);
+const dialogTitle = ref('');
+const isEditMode = ref(false);
+const currentRuleId = ref('');
+const ruleFormRef = ref(null);
+
+// 表单数据 - 根据表格prop调整字段名
+const ruleForm = reactive({
+  code: '',
+  name: '',
+  qualityDim: '',
+  description: '',
+  useCase: '',
+  example: ''
+});
+
+// 表单验证规则 - 匹配新的字段名
+const rules = reactive({
+  code: [
+    { required: true, message: '请输入规则编码', trigger: 'blur' }
+  ],
+  name: [
+    { required: true, message: '请输入规则名称', trigger: 'blur' }
+  ],
+  qualityDim: [
+    { required: true, message: '请选择质量维度', trigger: 'change' }
+  ],
+  description: [
+    { required: true, message: '请输入规则描述', trigger: 'blur' }
+  ]
+});
+
+// 初始化时获取数据
+onMounted(() => {
+  qualityDimensionList.value = getIntDictOptions(DICT_TYPE.ATT_RULE_AUDIT_Q_DIMENSION) || [];
+  // 页面加载时获取表格数据
+  getList();
+});
+
+// 监听菜单展开状态变化
+watch(
+  () => isQualityDimensionsOpen.value,
+  (newVal) => {
+    console.log('质量维度菜单展开状态:', newVal);
+  }
+);
+
+// 处理质量维度菜单点击事件
+const handleDimensionClick = (dimensionValue) => {
+  // 将维度值设置到查询参数中
+  queryParams.qualityDim = dimensionValue;
+  // 重置页码
+  queryParams.pageNo = 1;
+  // 重新获取列表数据
+  getList();
+};
+
+// 清除质量维度筛选
+const clearDimensionFilter = () => {
+  queryParams.qualityDim = '';
+  queryParams.pageNo = 1;
+  getList();
+};
+
+// 打开新增弹窗
+const openAddDialog = () => {
+  isEditMode.value = false;
+  dialogTitle.value = '新增规则';
+  // 重置表单
+  resetForm();
+  dialogVisible.value = true;
+};
+
+// 打开编辑弹窗
+const openEditDialog = (row) => {
+  isEditMode.value = true;
+  dialogTitle.value = '编辑规则';
+  currentRuleId.value = row.id; // 使用id作为唯一标识
+  
+  // 填充表单数据 - 匹配表格字段
+  ruleForm.code = row.code;
+  ruleForm.name = row.name;
+  ruleForm.qualityDim = +row.qualityDim;
+  ruleForm.description = row.description;
+  ruleForm.useCase = row.useCase;
+  ruleForm.example = row.example;
+  
+  dialogVisible.value = true;
+};
+
+// 处理删除操作
+const handleDelete = async (id) => {
+  try {
+    // 显示确认对话框
+    const confirmResult = await ElMessageBox.confirm(
+      '确定要删除这条规则吗？此操作不可撤销。',
+      '删除确认',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+        icon: Delete
+      }
+    );
+
+    if (confirmResult === 'confirm') {
+      // 显示加载状态
+      const deleteLoading = ElLoading.service({
+        lock: true,
+        text: '正在删除规则...',
+        background: 'rgba(255, 255, 255, 0.7)'
+      });
+
+      // 调用删除接口，传递id参数
+      const response = await deleteAttAuditRule(id);
+      
+      if (response >= 1) {
+        ElMessage.success('规则删除成功');
+        // 重新获取列表数据
+        getList();
+      } else {
+        ElMessage.error('规则删除失败');
+      }
+
+      // 关闭加载状态
+      deleteLoading.close();
+    }
+  } catch (error) {
+    // 如果是取消操作，不显示错误信息
+    if (error !== 'cancel') {
+      console.error('删除规则失败:', error);
+      ElMessage.error('删除规则失败，请稍后重试');
+    }
+  }
+};
+
+// 关闭弹窗
+const handleDialogClose = () => {
+  resetForm();
+  dialogVisible.value = false;
+};
+
+// 重置表单
+const resetForm = () => {
+  if (ruleFormRef.value) {
+    ruleFormRef.value.resetFields();
+  }
+  // 清空表单数据
+  ruleForm.code = '';
+  ruleForm.name = '';
+  ruleForm.qualityDim = '';
+  ruleForm.description = '';
+  ruleForm.useCase = '';
+  ruleForm.example = '';
+  currentRuleId.value = '';
+};
+
+// 保存规则
+const handleSave = async () => {
+  // 表单验证
+  const valid = await ruleFormRef.value.validate();
+  if (!valid) return;
+  
+  // 添加加载状态
+  const saveLoading = ElLoading.service({
+    lock: true,
+    text: isEditMode.value ? '正在更新规则...' : '正在添加规则...',
+    background: 'rgba(255, 255, 255, 0.7)'
+  });
+  
+  try {
+    if (isEditMode.value) {
+      // 编辑模式 - 调用更新接口，传入id参数
+      const response = await updateAttAuditRule({
+        id: currentRuleId.value,  // 增加id参数
+        ...ruleForm
+      });
+      
+      if (response >= 1) {
+        ElMessage.success('规则更新成功');
+        // 关闭弹窗
+        dialogVisible.value = false;
+        // 刷新列表数据
+        getList();
+      } else {
+        ElMessage.error('规则更新失败');
+      }
+    } else {
+      // 新增模式 - 调用新增接口
+      const response = await addAttAuditRule(ruleForm);
+      if(response < 1) {
+        ElMessage.error('新增失败');
+        return;
+      }
+      ElMessage.success('规则新增成功');
+      // 关闭弹窗
+      dialogVisible.value = false;
+      // 重置表单
+      resetForm();
+      // 重新获取列表数据
+      getList();
+    }
+  } catch (error) {
+    ElMessage.error(isEditMode.value ? '更新规则失败，请稍后重试' : '新增规则失败，请稍后重试');
+  } finally {
+    // 关闭加载状态
+    saveLoading.close();
+  }
+};
+
+// 处理搜索
+const handleSearch = () => {
+  // 将搜索条件同步到查询参数
+  queryParams.name = searchForm.value.name;
+  queryParams.code = searchForm.value.code;
+  // 重置页码，从第一页开始搜索
+  queryParams.pageNo = 1;
+  // 调用接口获取数据
+  getList();
+};
+
+// 处理重置
+const handleReset = () => {
+  searchForm.value = {
+    name: '',
+    code: ''
+  };
+  // 重置查询参数
+  queryParams.name = '';
+  queryParams.code = '';
+  queryParams.pageNo = 1;
+  // 清除维度筛选
+  clearDimensionFilter();
+};
+
+// 从API获取列表数据方法
+const getList = async () => {
+  loading.value = true;
+  try {
+    // 调用API获取数据，包含质量维度筛选条件
+    const response = await getAttAuditRuleList(queryParams);
+    console.log(response)
+    tableData.value = response.list || [];
+    total.value = response.total || 0;
+
+  } catch (error) {
+    console.error('获取规则列表失败:', error);
+    ElMessage.error('获取数据失败，请稍后重试');
+    tableData.value = [];
+    total.value = 0;
+  } finally {
+    loading.value = false;
+  }
+};
+
+// 根据质量维度获取标签类型
+const getDimensionTagType = (dimensionValue) => {
+  const tagTypes = {
+    '1': 'primary',
+    '2': 'success',
+    '3': 'warning',
+    '4': 'info',
+    '5': 'info'
+  };
+  return tagTypes[dimensionValue] || 'info';
+};
+
+// 菜单展开/折叠事件
+const handleMenuOpen = (key, keyPath) => {
+  if (key === 'quality-dimensions') {
+    isQualityDimensionsOpen.value = true;
+  }
+};
+
+const handleMenuClose = (key, keyPath) => {
+  if (key === 'quality-dimensions') {
+    isQualityDimensionsOpen.value = false;
+  }
+};
+</script>
+
+<style scoped>
+.main-content {
+  display: flex;
+  flex: 1;
+  overflow: hidden;
+}
+
+.sidebar {
+  background-color: #ffffff;
+  border-right: 1px solid #e5e7eb;
+  display: flex;
+  flex-direction: column;
+}
+
+.sidebar-header {
+  padding: 15px;
+  border-bottom: 1px solid #f0f0f0;
+}
+
+.sidebar-search {
+  width: 100%;
+  --el-input-height: 32px;
+  background-color: #f5f7fa;
+  border-color: #e5e7eb;
+}
+
+.sidebar-search .el-input__wrapper {
+  box-shadow: none;
+}
+
+.quality-menu {
+  height: 100%;
+  border-right: none;
+  padding-top: 0;
+}
+
+.el-sub-menu .el-sub-menu__title {
+  padding-left: 20px !important;
+  height: 44px;
+  line-height: 44px;
+  font-size: 14px;
+}
+
+.el-menu-item.menu-item {
+  padding-left: 60px !important;
+  height: 40px;
+  line-height: 40px;
+  font-size: 13px;
+  cursor: pointer;
+}
+
+.el-menu-item.menu-item.is-active {
+  background-color: #e8f3ff !important;
+  color: #165DFF !important;
+  font-weight: 500;
+}
+
+.arrow-icon {
+  transition: transform 0.2s ease;
+  margin-left: auto;
+}
+
+.rotate {
+  transform: rotate(90deg);
+}
+
+.main {
+  flex: 1;
+  padding: 20px;
+  overflow-y: auto;
+}
+
+.search-container {
+  padding: 0 15px;
+  background-color: #ffffff;
+  border-radius: 4px;
+}
+
+.search-input {
+  width: 100%;
+}
+
+.table-container {
+  background-color: #fff;
+  border-radius: 4px;
+  padding: 15px;
+}
+
+.operation-btn {
+  padding: 0 5px;
+}
+
+.rule-form {
+  margin-top: 15px;
+}
+
+/* 筛选标签样式 */
+.filter-tag {
+  line-height: 1;
+}
+</style>
diff --git a/src/views/dataAsset/assetMap/index.vue b/src/views/dataAsset/assetMap/index.vue
new file mode 100644
index 0000000..e69de29
diff --git a/src/views/dataAsset/dataLink/index.vue b/src/views/dataAsset/dataLink/index.vue
new file mode 100644
index 0000000..e69de29
diff --git a/src/views/dataAsset/dataQuery/index.vue b/src/views/dataAsset/dataQuery/index.vue
new file mode 100644
index 0000000..e69de29
diff --git a/src/views/dataPlan/standardDataElement/index.vue b/src/views/dataPlan/standardDataElement/index.vue
new file mode 100644
index 0000000..757005e
--- /dev/null
+++ b/src/views/dataPlan/standardDataElement/index.vue
@@ -0,0 +1,498 @@
+<template>
+  <el-card shadow="never" class="b-r-top-15 m-b-10">
+    <div class="main-content">
+      <!-- 左侧导航菜单 -->
+      <el-aside width="240px" class="sidebar">
+        <!-- 导航头部搜索框 -->
+        <div class="sidebar-header">
+          <el-input
+            v-model="searchKeyword"
+            placeholder="请输入规则类型"
+            :prefix-icon="Search"
+            class="sidebar-search"
+          />
+        </div>
+        
+        <!-- 动态导航菜单 -->
+        <el-menu
+          :default-active="activeMenu"
+          class="quality-menu"
+          background-color="#ffffff"
+          text-color="#1D2129"
+          active-text-color="#165DFF"
+          :unique-opened="true"
+        >
+          <!-- 动态生成菜单 -->
+          <template v-for="menu in filteredMenus" :key="menu.index">
+            <!-- 有子菜单的情况 -->
+            <el-sub-menu v-if="menu.children && menu.children.length" :index="menu.index">
+              <template #title>
+                <span><el-icon><list /></el-icon>{{ menu.title }}</span>
+              </template>
+              <!-- 二级菜单 -->
+              <template v-for="subMenu in menu.children" :key="subMenu.index">
+                <el-sub-menu v-if="subMenu.children && subMenu.children.length" :index="subMenu.index" style="margin-left: 25px;">
+                  <template #title>
+                    <span><el-icon><list /></el-icon>{{ subMenu.title }}</span>
+                  </template>
+                  <!-- 三级菜单项 -->
+                  <el-menu-item 
+                    v-for="item in subMenu.children" 
+                    :key="item.index" 
+                    :index="item.index"
+                    @click="handleMenuClick(item)"
+                  >
+                    <span><el-icon><list /></el-icon>{{ item.title }}</span>
+                  </el-menu-item>
+                </el-sub-menu>
+                <el-menu-item v-else :index="subMenu.index" @click="handleMenuClick(subMenu)" class="second-level-menu-item">
+                  <span><el-icon><list /></el-icon>{{ subMenu.title }}</span>
+                </el-menu-item>
+              </template>
+            </el-sub-menu>
+            <!-- 没有子菜单的情况 -->
+            <el-menu-item v-else :index="menu.index" @click="handleMenuClick(menu)">
+              <span><el-icon><list /></el-icon>{{ menu.title }}</span>
+            </el-menu-item>
+          </template>
+        </el-menu>
+      </el-aside>
+
+      <!-- 主内容区域 -->
+      <el-main class="main">
+        <!-- 搜索区域 -->
+        <div class="search-container">
+          <el-row :gutter="20">
+            <el-col :span="5">
+              <el-input
+                v-model="searchForm.ruleType"
+                placeholder="请输入规则类型"
+                prefix-icon="Search"
+                class="search-input"
+              />
+            </el-col>
+            <el-col :span="5">
+              <el-input
+                v-model="searchForm.ruleName"
+                placeholder="请输入规则名称"
+                prefix-icon="Search"
+                class="search-input"
+              />
+            </el-col>
+            <el-col :span="5">
+              <el-input
+                v-model="searchForm.ruleCode"
+                placeholder="请输入规则编码"
+                prefix-icon="Search"
+                class="search-input"
+              />
+            </el-col>
+            <el-col :span="4">
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+              <el-button @click="handleReset">重置</el-button>
+            </el-col>
+          </el-row>
+        </div>
+
+        <!-- 表格区域 -->
+        <div class="table-container">
+          <el-table
+            :data="tableData"
+            v-loading="loading"  
+            height="500" 
+            show-header=true 
+            :header-cell-style="{ background: '#f2f3f5', color: '#6b7785', fontWeight: 'bold' }"
+          >
+            <el-table-column
+              prop="ruleCode"
+              label="规则编码"
+              width="100"
+            />
+            <el-table-column
+              prop="ruleName"
+              label="规则名称"
+              width="180"
+            />
+            <el-table-column
+              prop="qualityDimension"
+              label="质量维度"
+              width="120"
+            >
+              <template #default="scope">
+                <el-tag
+                  :type="getDimensionTagType(scope.row.qualityDimension)"
+                  size="small"
+                >
+                  {{ scope.row.qualityDimension }}
+                </el-tag>
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="ruleDescription"
+              label="规则描述"
+              min-width="200"
+            />
+            <el-table-column
+              prop="useScenario"
+              label="使用场景"
+              min-width="200"
+            />
+            <el-table-column
+              prop="example"
+              label="示例"
+              min-width="200"
+            >
+              <template #default="scope">
+                <div v-html="scope.row.example"></div>
+              </template>
+            </el-table-column>
+            <el-table-column
+              label="操作"
+              width="120"
+            >
+              <template #default>
+                <el-button size="small" type="link" class="operation-btn">编辑</el-button>
+                <el-button size="small" type="link" class="operation-btn" style="color: #ff4d4f">删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <Pagination
+            :total="total"
+            v-model:page="queryParams.pageNo"
+            v-model:limit="queryParams.pageSize"
+            @pagination="getList"
+          />
+        </div>
+      </el-main>
+    </div>
+  </el-card>
+</template>
+
+<script setup>
+import { ref, reactive, computed, onMounted } from 'vue';
+import { Search, List } from "@element-plus/icons-vue";
+import { getAttCleanCatList } from '@/api/base/cleaningRules'
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  serviceName: ''
+})
+
+// 当前激活的菜单
+const activeMenu = ref('');
+
+// 导航菜单数据
+const menuData = ref([]);
+// 加载状态
+const menuLoading = ref(false);
+
+// 从接口获取菜单数据并转换为树形结构
+const loadMenuData = async () => {
+  try {
+    menuLoading.value = true;
+    const response = await getAttCleanCatList();
+    // 假设接口返回格式为 { data: [...] }
+    const flatData = response || [];
+    
+    // 将扁平数据转换为树形结构
+    menuData.value = convertToTree(flatData);
+    
+    // 设置默认激活的第一个菜单项
+    if (menuData.value.length > 0) {
+      activeMenu.value = menuData.value[0].index;
+    }
+  } catch (error) {
+    console.error('获取菜单数据失败:', error);
+  } finally {
+    menuLoading.value = false;
+  }
+};
+
+// 将扁平数组转换为树形结构
+const convertToTree = (items) => {
+  // 首先将所有项按id映射，方便查找
+  const map = {};
+  const tree = [];
+  
+  // 先创建所有节点的映射
+  items.forEach(item => {
+    map[item.id] = {
+      index: item.code,  // 使用code作为索引值
+      title: item.name,  // 使用name作为标题
+      id: item.id,
+      parentId: item.parentId,
+      children: []
+    };
+  });
+  
+  // 构建树形结构
+  items.forEach(item => {
+    const node = map[item.id];
+    if (item.parentId === 0) {
+      // 根节点
+      tree.push(node);
+    } else {
+      // 找到父节点并添加到其子节点中
+      const parent = map[item.parentId];
+      if (parent) {
+        parent.children.push(node);
+      } else {
+        // 如果找不到父节点，作为根节点处理
+        tree.push(node);
+      }
+    }
+  });
+  
+  // 按sortOrder排序
+  const sortByOrder = (nodes) => {
+    if (!nodes || !nodes.length) return;
+    
+    nodes.sort((a, b) => (a.sortOrder || 0) - (b.sortOrder || 0));
+    nodes.forEach(node => {
+      if (node.children && node.children.length) {
+        sortByOrder(node.children);
+      }
+    });
+  };
+  
+  sortByOrder(tree);
+  
+  return tree;
+};
+
+// 在组件挂载时加载菜单数据
+onMounted(() => {
+  loadMenuData();
+});
+
+// 导航搜索关键词
+const searchKeyword = ref('');
+
+// 根据搜索关键词过滤菜单
+const filteredMenus = computed(() => {
+  if (!searchKeyword.value) return menuData.value;
+  
+  const filterMenu = (menus) => {
+    return menus.filter(menu => {
+      // 如果标题匹配，保留整个菜单项
+      if (menu.title.includes(searchKeyword.value)) {
+        return true;
+      }
+      
+      // 如果有子菜单，递归过滤
+      if (menu.children && menu.children.length) {
+        const filteredChildren = filterMenu(menu.children);
+        if (filteredChildren.length > 0) {
+          menu.children = filteredChildren;
+          return true;
+        }
+      }
+      
+      return false;
+    });
+  };
+  
+  return filterMenu(JSON.parse(JSON.stringify(menuData.value)));
+});
+
+// 搜索表单数据
+const searchForm = ref({
+  ruleType: '',
+  ruleName: '',
+  ruleCode: ''
+});
+
+// 表格数据
+const tableData = ref([
+  {
+    ruleCode: '311',
+    ruleName: '多字段组合唯一性校验',
+    qualityDimension: '一致性',
+    ruleDescription: '检查字段组合在全表中是否唯一',
+    useScenario: '检查字段组合在全表中是否唯一',
+    example: '<ul><li>同一用户在某一天只能有一条记录</li></ul>'
+  },
+  {
+    ruleCode: '110',
+    ruleName: '数值字段精度校验',
+    qualityDimension: '完整性',
+    ruleDescription: '检查小数位数是否符合业务定义（如保留2位）',
+    useScenario: '检查小数位数是否符合业务定义（如保留2位）',
+    example: '<ul><li>金额字段小数点后最多保留2位</li></ul>'
+  },
+  {
+    ruleCode: '107',
+    ruleName: '字段字符类型校验',
+    qualityDimension: '完整性',
+    ruleDescription: '检查字段值是否为期望的字符组成（字母、数字等）',
+    useScenario: '检查字段值是否为期望的字符组成（字母、数字等）',
+    example: '<ul><li>手机号码段应为纯数字，出现字母则为异常</li></ul>'
+  }
+]);
+
+// 分页相关数据
+const total = ref(3);
+const loading = ref(false);
+
+// 处理菜单点击
+const handleMenuClick = (menu) => {
+  activeMenu.value = menu.index;
+  console.log('选中菜单:', menu);
+  // 这里可以根据菜单项加载对应的表格数据
+};
+
+// 处理搜索
+const handleSearch = () => {
+  console.log('搜索条件:', searchForm.value);
+};
+
+// 处理重置
+const handleReset = () => {
+  searchForm.value = {
+    ruleType: '',
+    ruleName: '',
+    ruleCode: ''
+  };
+};
+
+// 根据质量维度获取标签类型
+const getDimensionTagType = (dimension) => {
+  const tagTypes = {
+    '准确性': 'primary',
+    '一致性': 'success',
+    '规范性': 'warning',
+    '时效性': 'info',
+    '完整性': 'info'
+  };
+  return tagTypes[dimension] || 'default';
+};
+
+// 分页事件处理
+const getList = () => {
+  console.log('分页查询:', queryParams);
+};
+</script>
+
+<style scoped>
+.main-content {
+  display: flex;
+  flex: 1;
+  overflow: hidden;
+}
+
+.sidebar {
+  background-color: #ffffff;
+  border-right: 1px solid #e5e7eb;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+
+/* 侧边栏头部搜索样式 */
+.sidebar-header {
+  padding: 16px;
+  border-bottom: 1px solid #f0f0f0;
+}
+
+.sidebar-search {
+  width: 100%;
+}
+
+.sidebar-search :deep(.el-input__wrapper) {
+  background-color: #f7f8fa;
+  box-shadow: none;
+  border-radius: 4px;
+}
+
+.sidebar-search :deep(.el-input__inner) {
+  color: #1D2129;
+  font-size: 14px;
+}
+
+/* 菜单样式调整 */
+.quality-menu {
+  border-right: none;
+  flex: 1;
+}
+
+.quality-menu :deep(.el-sub-menu__title),
+.quality-menu :deep(.el-menu-item) {
+  height: 40px;
+  line-height: 40px;
+  font-size: 14px;
+  color: #1D2129;
+}
+
+.quality-menu :deep(.el-sub-menu__title:hover),
+.quality-menu :deep(.el-menu-item:hover) {
+  background-color: #f7f8fa;
+}
+
+.quality-menu :deep(.el-menu-item.is-active) {
+  background-color: #e8f3ff !important;
+  color: #165DFF !important;
+  font-weight: 500;
+}
+
+/* 一级菜单 */
+.quality-menu :deep(.el-sub-menu:first-child .el-sub-menu__title) {
+  font-weight: 500;
+  padding-left: 16px !important;
+}
+
+/* 二级菜单 - 有子菜单的 */
+.quality-menu :deep(.el-sub-menu .el-sub-menu__title) {
+  padding-left: 42px !important;
+  font-size: 14px;
+  color: #4E5969;
+}
+
+/* 二级菜单项 - 没有子菜单的 */
+.second-level-menu-item {
+  padding-left: 32px !important;
+}
+
+/* 三级菜单项 */
+.quality-menu :deep(.el-menu-item) {
+  padding-left: 70px !important;
+  font-size: 14px;
+  color: #4E5969;
+}
+
+.quality-menu :deep(.el-icon.el-sub-menu__icon-arrow) {
+  margin-top: -4px;
+  color: #86909C;
+}
+
+/* 主内容区域样式 */
+.main {
+  flex: 1;
+  padding: 20px;
+  overflow-y: auto;
+  background-color: #f7f8fa;
+}
+
+.search-container {
+  margin-bottom: 20px;
+  padding: 15px;
+  background-color: #ffffff;
+  border-radius: 4px;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+}
+
+.search-input {
+  width: 100%;
+}
+
+.table-container {
+  background-color: #fff;
+  border-radius: 4px;
+  padding: 16px;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+}
+
+.operation-btn {
+  padding: 0 5px;
+}
+</style>
diff --git a/src/views/dataService/apiManage/index.vue b/src/views/dataService/apiManage/index.vue
new file mode 100644
index 0000000..e69de29
diff --git a/vite.config.ts b/vite.config.ts
index d78484d..4d2ceab 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -30,19 +30,25 @@ export default ({command, mode}: ConfigEnv): UserConfig => {
             open: env.VITE_OPEN === 'true',
             // 本地跨域代理. 目前注释的原因：暂时没有用途，server 端已经支持跨域
             proxy: {
-              ['/admin-api']: {
-                target: env.VITE_BASE_URL,
-                ws: false,
-                changeOrigin: true,
-                rewrite: (path) => path.replace(new RegExp(`^/admin-api`), ''),
-              },
-              ['/novaurl']: {
-                target: 'https://w97nf9wdef.execute-api.us-east-1.amazonaws.com/huada_navo_api/call_navo_api',
-                ws: false,
-                secure: false,
-                changeOrigin: true,
-                rewrite: (path) => path.replace(new RegExp(`^/novaurl`), ''),
-              },
+                ['/admin-api/v2']: {
+                    target: 'http://192.168.5.2:48080',
+                    ws: false,
+                    changeOrigin: true,
+                    rewrite: (path) => path.replace(/^\/admin-api\/v2/, ''),
+                },
+                ['/admin-api']: {
+                    target: 'http://192.168.5.2:48080',
+                    ws: false,
+                    changeOrigin: true,
+                    // rewrite: (path) => path.replace(new RegExp(`^/admin-api`), ''),
+                },
+                ['/novaurl']: {
+                    target: 'https://w97nf9wdef.execute-api.us-east-1.amazonaws.com/huada_navo_api/call_navo_api',
+                    ws: false,
+                    secure: false,
+                    changeOrigin: true,
+                    rewrite: (path) => path.replace(new RegExp(`^/novaurl`), ''),
+                },
             },
         },
         // 项目使用的vite插件。 单独提取到build/vite/plugin中管理