From 5680500d9fa289f8633a5bec7205fdb337147ff5 Mon Sep 17 00:00:00 2001
From: hongxilin <17663930442@163.com>
Date: Thu, 1 Jan 2026 18:01:13 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E5=9B=9E=E8=BD=A6=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2=E5=8A=9F=E8=83=BD=EF=BC=8C=E4=BD=BF=E7=94=A8pinia?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=E6=9D=83=E9=99=90=EF=BC=8C=E5=9C=A8=E6=A8=A1?=
 =?UTF-8?q?=E5=9D=97=E6=9C=9F=E9=99=90=E7=9A=84DeepMate=E5=92=8C=E6=B7=B1?=
 =?UTF-8?q?=E5=BA=A6=E6=8E=A2=E7=B4=A2=E8=A1=A8=E6=A0=BC=E4=B8=AD=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E5=BD=92=E5=B1=9E=E5=AD=97=E6=AE=B5=EF=BC=8C=E6=96=B0?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=9F=A5=E7=9C=8B=E5=BD=92=E5=B1=9E=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=EF=BC=8C=E5=8C=BA=E5=88=86=E6=80=BB=E9=83=A8=E5=92=8C?=
 =?UTF-8?q?=E5=B8=82=E5=9C=BA=E6=9D=83=E9=99=90=E3=80=82=20=E6=88=91?=
 =?UTF-8?q?=E4=B8=8D=E5=B0=8F=E5=BF=83=E6=95=B4=E7=90=86=E4=BA=86=E4=B8=80?=
 =?UTF-8?q?=E4=B8=8B=E4=BB=A3=E7=A0=81=EF=BC=8C=E5=8F=AF=E8=83=BD=E4=BC=9A?=
 =?UTF-8?q?=E5=87=BA=E7=8E=B0=E5=A4=A7=E9=87=8F=E5=86=B2=E7=AA=81=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package-lock.json                         | 136 ++++++
 package.json                              |   1 +
 src/api/userPermissions.js                |  27 ++
 src/layout/Layout.vue                     | 210 +++++----
 src/main.js                               |   2 +
 src/router/index.js                       |   6 +
 src/store/permission.js                   |  19 +
 src/views/UserPermissions/Module.vue      |  44 +-
 src/views/UserPermissions/invitedLook.vue | 712 ++++++++++++++++++++++++++++++
 9 files changed, 1055 insertions(+), 102 deletions(-)
 create mode 100644 src/store/permission.js
 create mode 100644 src/views/UserPermissions/invitedLook.vue

diff --git a/package-lock.json b/package-lock.json
index 8d32e57..9da5d1e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
         "axios": "^1.13.2",
         "element-plus": "^2.11.8",
         "normalize.css": "^8.0.1",
+        "pinia": "^3.0.4",
         "vue": "^3.5.24",
         "vue-router": "^4.6.3"
       },
@@ -984,6 +985,30 @@
       "integrity": "sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g==",
       "license": "MIT"
     },
+    "node_modules/@vue/devtools-kit": {
+      "version": "7.7.9",
+      "resolved": "https://registry.npmmirror.com/@vue/devtools-kit/-/devtools-kit-7.7.9.tgz",
+      "integrity": "sha512-PyQ6odHSgiDVd4hnTP+aDk2X4gl2HmLDfiyEnn3/oV+ckFDuswRs4IbBT7vacMuGdwY/XemxBoh302ctbsptuA==",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/devtools-shared": "^7.7.9",
+        "birpc": "^2.3.0",
+        "hookable": "^5.5.3",
+        "mitt": "^3.0.1",
+        "perfect-debounce": "^1.0.0",
+        "speakingurl": "^14.0.1",
+        "superjson": "^2.2.2"
+      }
+    },
+    "node_modules/@vue/devtools-shared": {
+      "version": "7.7.9",
+      "resolved": "https://registry.npmmirror.com/@vue/devtools-shared/-/devtools-shared-7.7.9.tgz",
+      "integrity": "sha512-iWAb0v2WYf0QWmxCGy0seZNDPdO3Sp5+u78ORnyeonS6MT4PC7VPrryX2BpMJrwlDeaZ6BD4vP4XKjK0SZqaeA==",
+      "license": "MIT",
+      "dependencies": {
+        "rfdc": "^1.4.1"
+      }
+    },
     "node_modules/@vue/reactivity": {
       "version": "3.5.24",
       "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.5.24.tgz",
@@ -1145,6 +1170,15 @@
         "proxy-from-env": "^1.1.0"
       }
     },
+    "node_modules/birpc": {
+      "version": "2.9.0",
+      "resolved": "https://registry.npmmirror.com/birpc/-/birpc-2.9.0.tgz",
+      "integrity": "sha512-KrayHS5pBi69Xi9JmvoqrIgYGDkD6mcSe/i6YKi3w5kekCLzrX4+nawcXqrj2tIp50Kw/mT/s3p+GVK0A0sKxw==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
     "node_modules/call-bind-apply-helpers": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
@@ -1170,6 +1204,21 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/copy-anything": {
+      "version": "4.0.5",
+      "resolved": "https://registry.npmmirror.com/copy-anything/-/copy-anything-4.0.5.tgz",
+      "integrity": "sha512-7Vv6asjS4gMOuILabD3l739tsaxFQmC+a7pLZm02zyvs8p977bL3zEgq3yDk5rn9B0PbYgIv++jmHcuUab4RhA==",
+      "license": "MIT",
+      "dependencies": {
+        "is-what": "^5.2.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/mesqueeb"
+      }
+    },
     "node_modules/csstype": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.0.tgz",
@@ -1501,6 +1550,24 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/hookable": {
+      "version": "5.5.3",
+      "resolved": "https://registry.npmmirror.com/hookable/-/hookable-5.5.3.tgz",
+      "integrity": "sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ==",
+      "license": "MIT"
+    },
+    "node_modules/is-what": {
+      "version": "5.5.0",
+      "resolved": "https://registry.npmmirror.com/is-what/-/is-what-5.5.0.tgz",
+      "integrity": "sha512-oG7cgbmg5kLYae2N5IVd3jm2s+vldjxJzK1pcu9LfpGuQ93MQSzo0okvRna+7y5ifrD+20FE8FvjusyGaz14fw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/mesqueeb"
+      }
+    },
     "node_modules/lodash": {
       "version": "4.17.21",
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
@@ -1569,6 +1636,12 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/mitt": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmmirror.com/mitt/-/mitt-3.0.1.tgz",
+      "integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==",
+      "license": "MIT"
+    },
     "node_modules/nanoid": {
       "version": "3.3.11",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
@@ -1599,6 +1672,12 @@
       "integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg==",
       "license": "MIT"
     },
+    "node_modules/perfect-debounce": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmmirror.com/perfect-debounce/-/perfect-debounce-1.0.0.tgz",
+      "integrity": "sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA==",
+      "license": "MIT"
+    },
     "node_modules/picocolors": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
@@ -1618,6 +1697,36 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/pinia": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmmirror.com/pinia/-/pinia-3.0.4.tgz",
+      "integrity": "sha512-l7pqLUFTI/+ESXn6k3nu30ZIzW5E2WZF/LaHJEpoq6ElcLD+wduZoB2kBN19du6K/4FDpPMazY2wJr+IndBtQw==",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/devtools-api": "^7.7.7"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/posva"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.5.0",
+        "vue": "^3.5.11"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/pinia/node_modules/@vue/devtools-api": {
+      "version": "7.7.9",
+      "resolved": "https://registry.npmmirror.com/@vue/devtools-api/-/devtools-api-7.7.9.tgz",
+      "integrity": "sha512-kIE8wvwlcZ6TJTbNeU2HQNtaxLx3a84aotTITUuL/4bzfPxzajGBOoqjMhwZJ8L9qFYDU/lAYMEEm11dnZOD6g==",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/devtools-kit": "^7.7.9"
+      }
+    },
     "node_modules/postcss": {
       "version": "8.5.6",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
@@ -1652,6 +1761,12 @@
       "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
       "license": "MIT"
     },
+    "node_modules/rfdc": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmmirror.com/rfdc/-/rfdc-1.4.1.tgz",
+      "integrity": "sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==",
+      "license": "MIT"
+    },
     "node_modules/rollup": {
       "version": "4.53.2",
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.53.2.tgz",
@@ -1703,6 +1818,27 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/speakingurl": {
+      "version": "14.0.1",
+      "resolved": "https://registry.npmmirror.com/speakingurl/-/speakingurl-14.0.1.tgz",
+      "integrity": "sha512-1POYv7uv2gXoyGFpBCmpDVSNV74IfsWlDW216UPjbWufNf+bSU6GdbDsxdcxtfwb4xlI3yxzOTKClUosxARYrQ==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/superjson": {
+      "version": "2.2.6",
+      "resolved": "https://registry.npmmirror.com/superjson/-/superjson-2.2.6.tgz",
+      "integrity": "sha512-H+ue8Zo4vJmV2nRjpx86P35lzwDT3nItnIsocgumgr0hHMQ+ZGq5vrERg9kJBo5AWGmxZDhzDo+WVIJqkB0cGA==",
+      "license": "MIT",
+      "dependencies": {
+        "copy-anything": "^4"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/tinyglobby": {
       "version": "0.2.15",
       "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.15.tgz",
diff --git a/package.json b/package.json
index d24fb47..7ed72ef 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
     "axios": "^1.13.2",
     "element-plus": "^2.11.8",
     "normalize.css": "^8.0.1",
+    "pinia": "^3.0.4",
     "vue": "^3.5.24",
     "vue-router": "^4.6.3"
   },
diff --git a/src/api/userPermissions.js b/src/api/userPermissions.js
index 57df0ce..741d0cc 100644
--- a/src/api/userPermissions.js
+++ b/src/api/userPermissions.js
@@ -163,3 +163,30 @@ export function setEnvApi(params) {
     data: params,
   });
 }
+
+// 登录-获取权限接口
+export function getPermissionApi(params) {
+  return request({
+    url: base_url + "/admin/auth/info",
+    method: "post",
+    data: params,
+  });
+}
+
+// 用户邀请-获取用户邀请列表接口
+export function getInvitedListApi(params) {
+  return request({
+    url: base_url + "/admin/invite/list",
+    method: "post",
+    data: params,
+  });
+}
+
+// 用户邀请--创建导出
+export function exportInvitedApi(params) {
+  return request({
+    url: base_url + "/admin/invite/export/create",
+    method: "post",
+    data: params,
+  });
+}
\ No newline at end of file
diff --git a/src/layout/Layout.vue b/src/layout/Layout.vue
index 7e3302d..c2d6d5b 100644
--- a/src/layout/Layout.vue
+++ b/src/layout/Layout.vue
@@ -1,28 +1,17 @@
+<!-- @format -->
+
 <template>
-  <el-container style="min-height: 100vh;">
-    <el-aside 
-      class="sidebar"
-      v-if="!$route.meta.hiddenSidebar"
-    >
+  <el-container style="min-height: 100vh">
+    <el-aside class="sidebar" v-if="!$route.meta.hiddenSidebar">
       <!-- 侧边栏头部 -->
       <div class="sidebar-header">
-        <img src="../assets/images/deepChart.png" class="sidebar-logo">
+        <img src="../assets/images/deepChart.png" class="sidebar-logo" />
         <span class="sidebar-title">DeepChart</span>
       </div>
 
       <!-- 侧边栏菜单 -->
-      <el-menu
-        class="sidebar-menu"
-        background-color="transparent"
-        router
-        :default-active="lastActivePath"
-        :unique-opened="true"
-      >
-        <el-sub-menu 
-          v-for="parentRoute in filteredSidebarRoutes" 
-          :key="parentRoute.name"
-          :index="`/${parentRoute.path}`"
-        >
+      <el-menu class="sidebar-menu" background-color="transparent" router :default-active="lastActivePath" :unique-opened="true">
+        <el-sub-menu v-for="parentRoute in filteredSidebarRoutes" :key="parentRoute.name" :index="`/${parentRoute.path}`">
           <!-- 父目录 -->
           <template #title>
             <el-icon>
@@ -32,13 +21,7 @@
           </template>
 
           <!-- 子目录 -->
-          <el-menu-item
-            v-for="childRoute in parentRoute.filteredChildren"
-            :key="childRoute.name"
-            :index="`/${parentRoute.path}/${childRoute.path}`"
-            :to="`/${parentRoute.path}/${childRoute.path}`"
-            class="sidebar-child-container"
-          >
+          <el-menu-item v-for="childRoute in parentRoute.filteredChildren" :key="childRoute.name" :index="`/${parentRoute.path}/${childRoute.path}`" :to="`/${parentRoute.path}/${childRoute.path}`" class="sidebar-child-container">
             <el-icon class="sidebar-child-icon" />
             <span class="sidebar-child-text">{{ childRoute.meta.title }}</span>
           </el-menu-item>
@@ -46,11 +29,11 @@
       </el-menu>
 
       <div class="sidebar-logout" @click="handleLogout">
-        <el-icon style="bottom: -3px; "><SwitchButton /></el-icon>
+        <el-icon style="bottom: -3px"><SwitchButton /></el-icon>
         退出登录
       </div>
-      <div class="sidebar-set" @click="handleSet">
-        <el-icon style="bottom: -3px; "><Setting /></el-icon>
+      <div class="sidebar-set" @click="handleSet" v-if="permission != '1'">
+        <el-icon style="bottom: -3px"><Setting /></el-icon>
         设置
       </div>
     </el-aside>
@@ -59,7 +42,7 @@
     <el-dialog v-model="setValue" title="设置" width="500">
       <div class="refresh-time-container">
         <el-button type="danger">首页刷新时间</el-button>
-        <el-form-item label="刷新时间" style="margin-top: 20px; margin-bottom: 40px;">
+        <el-form-item label="刷新时间" style="margin-top: 20px; margin-bottom: 40px">
           <el-input-number v-model="refreshTime" :step="1" placeholder="请输入刷新时间" style="width: 200px">
             <template #suffix>
               <span>s</span>
@@ -67,7 +50,7 @@
           </el-input-number>
         </el-form-item>
         <el-button type="danger">Android下载链接配置</el-button>
-        <el-form-item label="编辑链接" style="margin-top: 20px; margin-bottom: 40px;">
+        <el-form-item label="编辑链接" style="margin-top: 20px; margin-bottom: 40px">
           <el-input v-model="Androidurl" style="width: 300px" placeholder="请输入最新Android下载链接" />
         </el-form-item>
       </div>
@@ -87,18 +70,24 @@
 </template>
 
 <script setup>
-import { computed, ref, watch } from 'vue'
-import { useRouter, useRoute } from 'vue-router'
-import { ElMessage } from 'element-plus';
-import { getEnvApi, setEnvApi} from '../api/userPermissions'
+import { computed, ref, watch, onMounted } from "vue";
+import { useRouter, useRoute } from "vue-router";
+import { ElMessage } from "element-plus";
+import { getEnvApi, setEnvApi } from "../api/userPermissions";
+import { usePermissionStore } from "../store/permission";
+const permissionStore = usePermissionStore();
 
-const router = useRouter()
-const route = useRoute()
+const router = useRouter();
+const route = useRoute();
 
+// token
+const token = localStorage.getItem("token");
+//permission
+const permission = ref("-1");
 // 递归收集父路由
 const collectParentRoutes = (routes) => {
   let parentRoutes = [];
-  routes.forEach(route => {
+  routes.forEach((route) => {
     if (route.meta?.isParentNav === true && route.meta?.showSidebar === true) {
       parentRoutes.push(route);
     }
@@ -109,25 +98,57 @@ const collectParentRoutes = (routes) => {
   return parentRoutes;
 };
 
+const getPermission = async () => {
+  const result = await getPermissionApi({ token: token });
+  console.log("result", result);
+  permission.value = result.permission_level;
+};
+
 // 过滤侧边栏路由
 const filteredSidebarRoutes = computed(() => {
   const allParentRoutes = collectParentRoutes(router.options.routes);
-  return allParentRoutes.map(parentRoute => {
-    const filteredChildren = parentRoute.children?.filter(childRoute => 
-      childRoute.meta?.showSidebar === true
-    ) || [];
-    return { ...parentRoute, filteredChildren };
-  }).filter(parentRoute => parentRoute.filteredChildren.length > 0);
+
+  return allParentRoutes
+    .map((parentRoute) => {
+      const filteredChildren =
+        parentRoute.children?.filter((childRoute) => {
+          // 必须标记为显示侧边栏
+          if (childRoute.meta?.showSidebar !== true) return false;
+
+          if (permission.value == "1") {
+            // 权限为1只可以看到查看被邀请用户
+            return childRoute.name === "invitedLook";
+          } else {
+            return true;
+          }
+
+          /*
+          // 权限判断
+          if (permission.value == "2") {
+            // 权限为2可以看到全部
+            return true;
+          } else if (permission.value == "1") {
+            // 权限为1只可以看到查看被邀请用户
+            return childRoute.name === "invitedLook";
+          }
+          */
+
+          // 默认情况（如未登录或无权限字段），根据实际需求处理，这里暂时隐藏
+          return false;
+        }) || [];
+      return { ...parentRoute, filteredChildren };
+    })
+    .filter((parentRoute) => parentRoute.filteredChildren.length > 0);
 });
 
 // 计算所有侧边栏有效菜单集合
 const validMenuIndexes = computed(() => {
   const indexes = [];
-  filteredSidebarRoutes.value.forEach(parentRoute => {
+  filteredSidebarRoutes.value.forEach((parentRoute) => {
     // 收集父菜单
     indexes.push(`/${parentRoute.path}`);
     // 收集子菜单
-    parentRoute.filteredChildren.forEach(childRoute => {
+    parentRoute.filteredChildren.forEach((childRoute) => {
       indexes.push(`/${parentRoute.path}/${childRoute.path}`);
     });
   });
@@ -135,7 +156,7 @@ const validMenuIndexes = computed(() => {
 });
 
 // 存储最后一次选中的「有效侧边栏路径」
-const lastActivePath = ref('');
+const lastActivePath = ref("");
 
 // 初始化+监听路由变化，更新最后有效路径
 watch(
@@ -152,37 +173,34 @@ watch(
 // 退出登录
 const handleLogout = () => {
   try {
-    localStorage.removeItem('token');
-    router.push('/login');
-    ElMessage.success('退出登录成功');
+    localStorage.removeItem("token");
+    router.push("/login");
+    ElMessage.success("退出登录成功");
   } catch (error) {
-    ElMessage.error('退出登录失败，请重试');
+    ElMessage.error("退出登录失败，请重试");
   }
 };
 
-// token
-const token = localStorage.getItem('token')
-
 // 设置弹窗开关
-const setValue = ref(false) 
+const setValue = ref(false);
 
 // 首页刷新时间
-const refreshTime = ref('')
+const refreshTime = ref("");
 
 // 安卓最新安装包
-const Androidurl = ref('')
+const Androidurl = ref("");
 
 // 设置按钮
-const handleSet = async() => {
+const handleSet = async () => {
   const data1 = await getEnvApi({
     token: token,
-    key: 'SYNC_INTERVAL'
-  })
+    key: "SYNC_INTERVAL",
+  });
 
   const data2 = await getEnvApi({
     token: token,
-    key: 'DOWNLOAD_URL'
-  })
+    key: "DOWNLOAD_URL",
+  });
 
   refreshTime.value = data1;
   Androidurl.value = data2;
@@ -190,27 +208,31 @@ const handleSet = async() => {
 };
 
 // 确认修改按钮
-const setEnv = async() => {
-  try{
+const setEnv = async () => {
+  try {
     await setEnvApi({
       token: token,
-      key: 'SYNC_INTERVAL',
-      value: refreshTime.value
-    })
+      key: "SYNC_INTERVAL",
+      value: refreshTime.value,
+    });
 
     await setEnvApi({
       token: token,
-      key: 'DOWNLOAD_URL', 
-      value: Androidurl.value
-    })
+      key: "DOWNLOAD_URL",
+      value: Androidurl.value,
+    });
 
-    ElMessage.success('修改成功');
+    ElMessage.success("修改成功");
     setValue.value = false;
   } catch (error) {
-    ElMessage.error('修改失败');
+    ElMessage.error("修改失败");
     setValue.value = false;
   }
-}
+};
+
+onMounted(async () => {
+  permission.value = await permissionStore.getPermission();
+});
 </script>
 
 <style scoped>
@@ -223,7 +245,7 @@ const setEnv = async() => {
   height: calc(100vh - 20px);
   flex-shrink: 0;
   border-radius: 8px;
-  background: #FEE6E6;
+  background: #fee6e6;
   box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);
   overflow: hidden;
   position: relative;
@@ -266,7 +288,7 @@ const setEnv = async() => {
 /* 主内容区样式 */
 .main-content {
   padding: 20px;
-  background-color: #FEE6E6;
+  background-color: #fee6e6;
   height: calc(100vh - 20px);
   margin-left: 50px;
   margin-right: 24px;
@@ -296,10 +318,10 @@ const setEnv = async() => {
   width: 300px !important;
   height: 60px !important;
   margin-left: 2px !important;
-  background: #FEE6E6 !important;
+  background: #fee6e6 !important;
   position: relative;
   padding: 0 !important;
-  border-radius: 6.02px !important; 
+  border-radius: 6.02px !important;
   box-sizing: border-box !important;
 }
 
@@ -308,7 +330,7 @@ const setEnv = async() => {
   position: absolute;
   left: 48px;
   top: 50%;
-  transform: translateY(-50%); 
+  transform: translateY(-50%);
   font-size: 18px !important;
   color: inherit;
 }
@@ -332,13 +354,13 @@ const setEnv = async() => {
 
 /* 子目录选中态样式 */
 .sidebar-child-container.is-active {
-  background: #FFFFFF !important; /* 选中后容器变为白色 */
+  background: #ffffff !important; /* 选中后容器变为白色 */
 }
 
 /* 选中态文字样式 */
 .sidebar-child-container.is-active .sidebar-child-text {
-  color: #FF0000 !important; /* 选中后文字红色 */
-  font-weight: 500; 
+  color: #ff0000 !important; /* 选中后文字红色 */
+  font-weight: 500;
 }
 
 /* 覆盖Element Plus默认样式 */
@@ -348,7 +370,7 @@ const setEnv = async() => {
   padding: 0 !important;
 }
 .el-menu-item {
-  border: none !important; 
+  border: none !important;
 }
 .el-menu--vertical .el-menu-item {
   width: 300px !important;
@@ -357,46 +379,46 @@ const setEnv = async() => {
 /* 退出登录 */
 .sidebar-logout {
   position: absolute;
-  bottom: 30px; 
+  bottom: 30px;
   left: 10%;
-  
+
   color: #1f0303;
   font-family: "PingFang SC", sans-serif;
   font-size: 21.06px;
   font-style: normal;
   font-weight: 700;
   line-height: 33.1px;
-  
-  cursor: pointer; 
+
+  cursor: pointer;
   user-select: none;
-  transition: color 0.2s ease; 
+  transition: color 0.2s ease;
 }
 
 /* 退出登录hover效果 */
 .sidebar-logout:hover {
-  color: #FF0000;
+  color: #ff0000;
 }
 
 /* 设置 */
 .sidebar-set {
   position: absolute;
-  bottom: 30px; 
+  bottom: 30px;
   left: 60%;
-  
+
   color: #1f0303;
   font-family: "PingFang SC", sans-serif;
   font-size: 21.06px;
   font-style: normal;
   font-weight: 700;
   line-height: 33.1px;
-  
-  cursor: pointer; 
+
+  cursor: pointer;
   user-select: none;
-  transition: color 0.2s ease; 
+  transition: color 0.2s ease;
 }
 
 /* 设置hover效果 */
 .sidebar-set:hover {
-  color: #FF0000;
+  color: #ff0000;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/main.js b/src/main.js
index a7ee655..51289e8 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,4 +1,5 @@
 import { createApp } from 'vue'
+import { createPinia } from 'pinia'
 import App from './App.vue'
 import router from './router'
 // 导入 Element Plus 样式和组件
@@ -19,6 +20,7 @@ for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
 app.use(ElementPlus, {
   locale: zhCn,
 })
+app.use(createPinia())
 app.use(router)
 
 app.mount('#app')
diff --git a/src/router/index.js b/src/router/index.js
index 3548ed0..a496720 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -40,6 +40,12 @@ const routes = [
             component: () => import('../views/UserPermissions/Module.vue'),
             meta: { title: '模块期限', showSidebar: true }
           },
+          {
+            path: 'invitedLook',
+            name: 'invitedLook',
+            component: () => import('../views/UserPermissions/invitedLook.vue'),
+            meta: { title: '查看被邀请用户', showSidebar: true }
+          },
           // 深度探索--操作日志
           {
             path: 'logDeepexplore',
diff --git a/src/store/permission.js b/src/store/permission.js
new file mode 100644
index 0000000..d03a126
--- /dev/null
+++ b/src/store/permission.js
@@ -0,0 +1,19 @@
+/** @format */
+
+import { defineStore } from "pinia";
+import { ref } from "vue";
+import { getPermissionApi } from "../api/userPermissions";
+export const usePermissionStore = defineStore("permission", () => {
+  //permission
+  const permission = ref("-1");
+
+  async function getPermission() {
+    // token
+    const token = localStorage.getItem("token");
+    const result = await getPermissionApi({ token: token });
+    permission.value = result.permission_level;
+    return permission.value;
+  }
+
+  return { permission, getPermission };
+});
diff --git a/src/views/UserPermissions/Module.vue b/src/views/UserPermissions/Module.vue
index e7b6313..51ee602 100644
--- a/src/views/UserPermissions/Module.vue
+++ b/src/views/UserPermissions/Module.vue
@@ -2,7 +2,7 @@
   <div>
     <div class="page-container" v-show="taber == 'DeepMate'">
       <!-- 搜索区域 -->
-      <div class="search-container">
+      <div class="search-container" @keyup.enter="searchDM">
         <div class="search-form">
           <div class="search-item">
             <span class="form-label">账号</span>
@@ -23,6 +23,15 @@
             />
           </div>
           <div class="search-item">
+            <span class="form-label">归属</span>
+            <el-input 
+              v-model="searchFormDM.inviter" 
+              placeholder="请输入归属账号" 
+              clearable
+              style="height: 36px; width: 180px;"
+            />
+          </div>
+          <div class="search-item">
             <span class="form-label">客户类型</span> 
             <el-select 
               v-model="searchFormDM.user_role" 
@@ -97,6 +106,7 @@
         </el-table-column>
         <el-table-column prop="dccode" label="账号" align="center" header-align="center"/>
         <el-table-column prop="dcname" label="姓名" align="center" header-align="center"/>
+        <el-table-column prop="inviter" label="归属" align="center" header-align="center"/>
         <el-table-column prop="module_name" label="模块名称" align="center" header-align="center"/>
         <el-table-column prop="token_num" label="token数量" align="center" header-align="center"/>
         <el-table-column prop="updated_at" label="操作时间" align="center" header-align="center" sortable="custom"/>
@@ -173,7 +183,7 @@
 
     <div class="page-container" v-show="taber == 'DeepExplore'">
       <!-- 搜索区域 -->
-      <div class="search-containerDE">
+      <div class="search-containerDE" @keyup.enter="searchDE">
         <!-- 输入项区域 -->
         <div class="search-formDE">
           <div class="search-itemDE">
@@ -195,6 +205,15 @@
             />
           </div>
           <div class="search-itemDE">
+            <span class="form-labelDE">归属</span>
+            <el-input 
+              v-model="searchFormDE.inviter" 
+              placeholder="请输入归属账号" 
+              clearable
+              style="height: 36px; width: 180px;"
+            />
+          </div>
+          <div class="search-itemDE">
             <span class="form-labelDE">客户类型</span> 
             <el-select 
               v-model="searchFormDE.user_role" 
@@ -286,6 +305,7 @@
         </el-table-column>
         <el-table-column prop="dccode" label="账号" align="center" header-align="center"/>
         <el-table-column prop="dcname" label="姓名" align="center" header-align="center"/>
+        <el-table-column prop="inviter" label="归属" align="center" header-align="center"/>
         <el-table-column prop="name" label="指标名称" align="center" header-align="center" width="200">
           <template #default="scope">
             <el-tooltip 
@@ -510,6 +530,7 @@ const fetchRegionList = async () => {
 const searchFormDM = reactive({
   dccode: '',
   dcname: '',
+  inviter:'',
   market: '',
   user_role: ''
 });
@@ -534,6 +555,7 @@ const DMTableData = async () => {
       token: token,
       dccode: searchFormDM.dccode,
       dcname: searchFormDM.dcname,
+      inviter: searchFormDM.inviter,
       market: searchFormDM.market,
       user_role: searchFormDM.user_role,
       sort_order: sortOrderDM.value,
@@ -582,6 +604,7 @@ const searchDM = () => {
 const resetBnDM = () => {
   searchFormDM.dccode = '';
   searchFormDM.dcname = '';
+  searchFormDM.inviter = '';
   searchFormDM.market = '';
   searchFormDM.user_role = '';
   sortOrderDM.value = null;
@@ -602,6 +625,7 @@ const exportExcelDM = async () => {
     token: token,
     dccode: searchFormDM.dccode,
     dcname: searchFormDM.dcname,
+    inviter: searchFormDM.inviter,
     market: searchFormDM.market,
     user_role: searchFormDM.user_role,
     sort_order: sortOrderDM.value
@@ -784,6 +808,7 @@ const indicatorList = async () => {
 const searchFormDE = reactive({
   dccode: '',
   dcname: '',
+  inviter: '',
   market: '',
   user_role: '',
   indicator_id: ''
@@ -834,6 +859,7 @@ const DETableData = async () => {
       token: token,
       dccode: searchFormDE.dccode,
       dcname: searchFormDE.dcname,
+      inviter: searchFormDE.inviter,
       market: searchFormDE.market,
       user_role: searchFormDE.user_role,
       indicator_id: searchFormDE.indicator_id,
@@ -864,6 +890,7 @@ const searchDE = () => {
 const resetBnDE = () => {
   searchFormDE.dccode = '';
   searchFormDE.dcname = '';
+  searchFormDE.inviter = '';
   searchFormDE.market = '';
   searchFormDE.user_role = '';
   searchFormDE.indicator_id = '';
@@ -880,6 +907,7 @@ const exportExcelDE = async () => {
     token: token,
     dccode: searchFormDE.dccode,
     dcname: searchFormDE.dcname,
+    inviter: searchFormDE.inviter,
     market: searchFormDE.market,
     user_role: searchFormDE.user_role,
     indicator_id: searchFormDE.indicator_id,
@@ -1156,16 +1184,16 @@ const openDetail = async(dccode) => {
 /* 搜索区域 */
 .search-container {
   display: flex;
-  height: 67px;
+  height: auto;
   flex-direction: column;
   justify-content: center;
   align-items: flex-start;
-  gap: 10px;
+  gap: 12px;
   align-self: stretch;
   border-radius: 8px;
   background: #FEFAF9;
   box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25); 
-  padding: 0 15px;
+  padding: 15px;
   margin-bottom: 20px; 
 }
 
@@ -1175,7 +1203,8 @@ const openDetail = async(dccode) => {
   align-items: center;
   width: 100%;
   gap: 15px;
-  flex-wrap: nowrap;
+  flex-wrap: wrap;
+  row-gap: 8px;
 }
 
 /* 单个搜索项 */
@@ -1199,8 +1228,7 @@ const openDetail = async(dccode) => {
 .button-group {
   display: flex;
   align-items: center;
-  gap: 0px !important;
-  margin-left: auto;
+  gap: 10px !important;
 }
 
 /* 按钮样式 */
diff --git a/src/views/UserPermissions/invitedLook.vue b/src/views/UserPermissions/invitedLook.vue
new file mode 100644
index 0000000..aae3023
--- /dev/null
+++ b/src/views/UserPermissions/invitedLook.vue
@@ -0,0 +1,712 @@
+<!-- @format -->
+
+<template>
+  <div>
+    <div class="page-container">
+      <!-- 搜索区域 -->
+      <div class="search-container" @keyup.enter="search">
+        <div class="search-form">
+          <div class="search-group">
+            <div class="search-group1">
+              <div class="search-item">
+                <span class="form-label">账号</span>
+                <el-input v-model="searchForm.invitee" placeholder="请输入账号" clearable style="height: 36px; width: 140px" />
+              </div>
+              <div class="search-item">
+                <span class="form-label">姓名</span>
+                <el-input v-model="searchForm.username" placeholder="请输入姓名" clearable style="height: 36px; width: 180px" />
+              </div>
+              <div class="search-item">
+                <span class="form-label">手机号</span>
+                <el-input v-model="searchForm.phone" placeholder="请输入手机号" clearable style="height: 36px; width: 200px" />
+              </div>
+              <div class="search-item">
+                <span class="form-label">邮箱</span>
+                <el-input v-model="searchForm.email" placeholder="请输入邮箱" clearable style="height: 36px; width: 200px" />
+              </div>
+            </div>
+
+            <div class="search-group2">
+              <div class="search-item">
+                <span class="form-label">归属</span>
+                <el-input v-model="searchForm.inviter" placeholder="请输入归属账号" :disabled="permission=='1'" clearable style="height: 36px; width: 140px" />
+              </div>
+              <div class="search-item">
+                <span class="form-label">客户类型</span>
+                <el-select v-model="searchForm.user_role" placeholder="请选择客户类型" clearable style="height: 36px; width: 160px">
+                  <el-option label="非网" value="2" />
+                  <el-option label="会员" value="1" />
+                </el-select>
+              </div>
+              <div class="search-item">
+                <span class="form-label">地区</span>
+                <el-select v-model="searchForm.country" placeholder="请选择地区" clearable filterable style="height: 36px; width: 160px" :loading="isRegionLoading">
+                  <el-option v-for="region in regionList" :key="region.ID" :label="region.Name" :value="region.ID" />
+                </el-select>
+              </div>
+            </div>
+          </div>
+          <div class="button-group">
+            <el-button type="primary" @click="search">搜索</el-button>
+            <el-button type="success" @click="exportExcel">导出Excel列表</el-button>
+            <el-button color="#626aef" @click="exportList">查看导出列表</el-button>
+            <el-button type="primary" @click="resetBn">重置</el-button>
+          </div>
+        </div>
+      </div>
+
+      <!-- 数据 -->
+      <el-table :data="tableData" style="width: 100%; margin-top: 20px" header-cell-class-name="table-header" class="table-rounded" :loading="tableLoading">
+        <el-table-column prop="id" label="序号" align="center" header-align="center" width="80">
+          <template #default="scope">
+            {{ (currentPage - 1) * pageSizeDM + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="invitee" label="账号" align="center" header-align="center" />
+        <el-table-column prop="username" label="姓名" align="center" header-align="center" />
+        <el-table-column prop="inviter" label="归属" align="center" header-align="center" />
+        <el-table-column prop="email" label="邮箱" align="center" header-align="center" />
+        <el-table-column prop="dialing_code" label="手机区号" align="center" header-align="center" />
+        <el-table-column prop="phone" label="手机号" align="center" header-align="center" />
+        <el-table-column prop="country" label="地区" align="center" header-align="center" />
+        <el-table-column prop="regtime" label="注册时间" align="center" header-align="center" width="250" />
+      </el-table>
+
+      <!-- 分页组件 -->
+      <div class="demo-pagination-block">
+        <el-pagination
+          @size-change="handleSizeChangeDM"
+          @current-change="handleCurrentChangeDM"
+          :current-page="currentPage"
+          :page-sizes="[10, 20, 50, 100]"
+          :page-size="pageSizeDM"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="datatotalDM"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted, computed } from "vue";
+import { ElMessage } from "element-plus";
+import { getInvitedListApi, exportInvitedApi,marketListApi, indicatorListApi, userDMListApi, exportDeepMateApi, exitDMApi, userDEListApi, exportDeepExploreApi, exitDEApi, detailDEApi } from "../../api/userPermissions";
+import router from "../../router";
+import { useRoute } from "vue-router";
+import { usePermissionStore } from "../../store/permission";
+const permissionStore = usePermissionStore();
+
+// token
+const token = localStorage.getItem("token");
+//permission
+const permission = ref("-1");
+
+// 获取路由实例
+const route = useRoute();
+
+// 组件挂载时：获取地区列表 + 初始化表格数据
+onMounted(async () => {
+  permission.value=permissionStore.permission;
+  fetchRegionList();
+  getTableData();
+});
+
+// 地区下拉框
+const regionList = ref([]);
+const isRegionLoading = ref(false);
+
+// 获取地区列表
+const fetchRegionList = async () => {
+  try {
+    isRegionLoading.value = true;
+    const data = await marketListApi({
+      token: token,
+      app_form: "en",
+    });
+    regionList.value = data.list;
+  } catch (error) {
+    console.error("获取地区列表失败：", error);
+    regionList.value = [];
+  } finally {
+    isRegionLoading.value = false;
+  }
+};
+
+// 搜索表单
+const searchForm = reactive({
+  inviter: "",
+  invitee: "",
+  username: "",
+  phone: "",
+  email: "",
+  country: "",
+  user_role: "",
+});
+
+// 排序参数
+const sortOrder = ref(null);
+
+// 表格数据
+const tableData = ref([]);
+const tableLoading = ref(false);
+const datatotalDM = ref(0);
+
+// 分页参数
+const currentPage = ref(1);
+const pageSizeDM = ref(10);
+
+// 获取表格数据
+const getTableData = async () => {
+  try {
+    tableLoading.value = true;
+    const requestParams = {
+      token: token,
+      inviter: searchForm.inviter,
+      invitee: searchForm.invitee,
+      username: searchForm.username,
+      phone: searchForm.phone,
+      email: searchForm.email,
+      country: searchForm.country,
+      user_role: searchForm.user_role,
+      page: currentPage.value,
+      page_size: pageSizeDM.value,
+    };
+    const data = await getInvitedListApi(requestParams);
+    tableData.value = data.list;
+    datatotalDM.value = data.total;
+  } catch (error) {
+    console.error("获取表格数据失败：", error);
+    tableData.value = [];
+    datatotalDM.value = 0;
+  } finally {
+    tableLoading.value = false;
+  }
+};
+
+// 分页方法
+const handleSizeChangeDM = (val) => {
+  pageSizeDM.value = val;
+  getTableData();
+  console.log(`每页 ${val} 条`);
+};
+
+const handleCurrentChangeDM = (val) => {
+  currentPage.value = val;
+  getTableData();
+  console.log(`当前页: ${val}`);
+};
+
+
+// 搜索按钮
+const search = () => {
+  currentPage.value = 1;
+  getTableData();
+};
+
+// 重置按钮
+const resetBn = () => {
+  searchForm.inviter="",
+  searchForm.invitee="",
+  searchForm.username="",
+  searchForm.phone="",
+  searchForm.email="",
+  searchForm.country="",
+  searchForm.user_role="",
+  currentPage.value = 1;
+  pageSizeDM.value = 10;
+  getTableData();
+};
+
+// 导出Excel列表按钮
+const exportExcel = async () => {
+  const requestParams = {
+    token: token,
+    inviter: searchForm.inviter,
+    invitee: searchForm.invitee,
+    username: searchForm.username,
+    phone: searchForm.phone,
+    email: searchForm.email,
+    country: searchForm.country,
+    user_role: searchForm.user_role,
+  };
+  const data = await exportInvitedApi(requestParams);
+  if (data != "") {
+    ElMessage.success("已导出");
+  }
+};
+
+// 查看导出列表按钮
+const exportList = () => {
+  router.push({
+    path: "/userPermissions/export",
+  });
+};
+
+// 格式化日期
+const formatDate = (date) => {
+  if (!date) return "";
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  return `${year}/${month}/${day}`;
+};
+
+// 校验指标
+const checkmodel = () => {
+  if (indicator_id.value.length === 0) {
+    ElMessage.error("请至少选择一个指标");
+    return false;
+  }
+  return true;
+};
+
+// 校验时间
+const checkTime = () => {
+  if (timeType.value === "expire") {
+    // 到期时间
+    if (!expireTime.value) {
+      ElMessage.error("请选择到期时间");
+      return false;
+    }
+  } else if (timeType.value === "delay") {
+    // 延期时间
+    if (!delayValue.value || !delayUnit.value) {
+      ElMessage.error("延期时间必须填写完整(数值+单位)");
+      return false;
+    }
+    const delayNum = Number(delayValue.value);
+    if (isNaN(delayNum) || delayNum < 0) {
+      ElMessage.error("延期时间不能为负数，请输入有效正数");
+      return false;
+    }
+    if (delayNum === 0) {
+      ElMessage.error("延期时间不能为0，请输入有效正数");
+      return false;
+    }
+  } else {
+    ElMessage.error("请设置权限时间");
+    return false;
+  }
+  return true;
+};
+
+// 校验备注
+const checkRemark = () => {
+  if (!remark.value.trim()) {
+    ElMessage.error("请输入备注");
+    return false;
+  }
+  return true;
+};
+</script>
+
+<style scoped>
+/* 父容器 */
+.page-container {
+  position: relative;
+  min-height: 600px;
+}
+
+/* 搜索区域 */
+.search-container {
+  display: flex;
+  height: 120px;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+  gap: 10px;
+  align-self: stretch;
+  border-radius: 8px;
+  background: #fefaf9;
+  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
+  padding: 0 15px;
+  margin-bottom: 20px;
+}
+
+/* 搜索表单 */
+.search-form {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  gap: 15px;
+  flex-wrap: nowrap;
+}
+
+.search-group {
+}
+
+.search-group1 {
+  display: flex;
+  align-items: center;
+  gap: 15px;
+}
+
+.search-group2 {
+  display: flex;
+  margin-top: 15px;
+  align-items: center;
+  gap: 15px;
+}
+
+/* 单个搜索项 */
+.search-item {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+/* 搜索标签文字 */
+.form-label {
+  font-weight: 800 !important;
+  font-size: 15px;
+  text-align: left;
+  color: #333;
+  margin-top: 13px;
+  font-family: "SimHei", "Heiti SC", "Microsoft YaHei", sans-serif !important;
+}
+
+/* 按钮组 */
+.button-group {
+  display: flex;
+  align-items: center;
+  gap: 0px !important;
+  margin-left: auto;
+}
+
+/* 按钮样式 */
+.button-group .el-button {
+  padding: 6px 10px !important;
+  font-size: 14px !important;
+  height: 36px !important;
+}
+
+/* 表格样式 */
+.table-rounded {
+  border-radius: 12px !important;
+  overflow: hidden !important;
+  border: 1px solid #e4e7ed !important;
+  min-height: 700px;
+}
+
+.table-roundedDE {
+  border-radius: 12px !important;
+  overflow: hidden !important;
+  border: 1px solid #e4e7ed !important;
+  min-height: 650px;
+}
+
+.table-header {
+  text-align: center !important;
+  font-weight: 800 !important;
+  font-size: 15px !important;
+  color: #333 !important;
+  background-color: #f8f9fa !important;
+}
+
+.el-table__cell {
+  border-right: none !important;
+  border-bottom: 1px solid #e4e7ed !important;
+}
+
+.el-table__header th.el-table__cell {
+  border-right: none !important;
+  border-bottom: 1px solid #e4e7ed !important;
+}
+
+.el-table__row:hover .el-table__cell {
+  background-color: #fafafa !important;
+}
+
+/* 分页组件样式 */
+.demo-pagination-block {
+  display: flex;
+  width: 100%;
+  height: 44px;
+  padding: 0 16px;
+  align-items: center;
+  gap: 16px;
+  position: absolute;
+  margin-top: 10px;
+  border-radius: 0 0 3px 3px;
+  border-top: 1px solid #eaeaea;
+  background: #fefbfb;
+  box-sizing: border-box;
+}
+
+/* 添加/修改样式 */
+.form-item {
+  margin-bottom: 24px;
+  padding-left: 20px;
+  padding-right: 20px;
+  text-align: left;
+}
+
+.form-label {
+  display: block;
+  margin-bottom: 8px;
+  font-weight: 500;
+}
+
+.radio-group {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  align-items: flex-start;
+}
+
+.radio-item {
+  display: flex;
+  align-items: center;
+}
+
+.radio-item span {
+  margin-right: 8px;
+}
+
+.tip {
+  font-size: 12px;
+  color: #909399;
+  margin-top: 4px;
+}
+
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+  gap: 16px;
+  margin-top: 20px;
+}
+
+.inline-form-item {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+}
+
+.inline-form-item .form-label {
+  display: inline-block;
+  margin-bottom: 0;
+  width: 60px;
+  text-align: left;
+  padding-right: 12px;
+}
+
+.info-container {
+  display: flex;
+  align-items: center;
+  gap: 40px;
+  padding: 0 20px 18px;
+  color: #333;
+  font-size: 16px;
+}
+
+.info-item {
+  white-space: nowrap;
+}
+
+/* Tab容器 */
+.tab-group {
+  display: flex;
+  gap: 12px;
+  justify-content: flex-start;
+  margin: 4px 0;
+  padding-left: 2px;
+}
+
+/* Tab按钮 */
+.tab-btn {
+  width: 120px;
+  padding: 6px 0;
+  text-align: center;
+  border: 1px solid #ff0000;
+  border-radius: 4px;
+  background-color: #ffffff;
+  color: #ff0000;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.2s;
+  outline: none;
+}
+
+/* Tab选中样式 */
+.tab-btn.active {
+  background-color: #ff0000;
+  color: #ffffff;
+}
+
+/* hover效果优化 */
+.tab-btn:not(.active):hover {
+  background-color: #fff5f5;
+}
+
+/* 搜索区域（深度探索） */
+.search-containerDE {
+  display: flex;
+  height: auto;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+  gap: 12px;
+  align-self: stretch;
+  border-radius: 8px;
+  background: #fefaf9;
+  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
+  padding: 15px;
+  margin-bottom: 20px;
+}
+
+/* 搜索表单（深度探索） */
+.search-formDE {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  gap: 15px;
+  flex-wrap: wrap;
+  row-gap: 8px;
+}
+
+/* 单个搜索项（深度探索） */
+.search-itemDE {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+/* 搜索标签文字（深度探索） */
+.form-labelDE {
+  font-weight: 800 !important;
+  font-size: 15px;
+  text-align: left;
+  color: #333;
+  margin-top: 0;
+  font-family: "SimHei", "Heiti SC", "Microsoft YaHei", sans-serif !important;
+}
+
+/* 按钮组（深度探索） */
+.button-groupDE {
+  display: flex;
+  align-items: center;
+  gap: 10px !important;
+}
+
+/* 按钮样式（深度探索） */
+.button-groupDE .el-button {
+  padding: 6px 10px !important;
+  font-size: 14px !important;
+  height: 36px !important;
+}
+
+/* 文本溢出省略样式（深度探索） */
+.ellipsis-text {
+  display: inline-block;
+  width: 100%;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  vertical-align: middle;
+}
+
+/* 开通/编辑指标复选（深度探索） */
+.indicator-checkbox-group {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-top: 8px;
+  width: 100%;
+}
+
+.indicator-checkbox-item {
+  flex: 0 0 calc(20% - 5px);
+  box-sizing: border-box;
+  padding: 4px 0;
+}
+
+:deep(.el-checkbox__input.is-checked .el-checkbox__inner) {
+  background-color: #ff0000 !important;
+  border-color: #ff0000 !important;
+}
+
+:deep(.el-checkbox__input.is-checked .el-checkbox__inner::after) {
+  border-color: #fff !important;
+}
+
+:deep(.el-checkbox__input:hover .el-checkbox__inner) {
+  border-color: #ff0000 !important;
+}
+
+:deep(.el-checkbox__input:focus .el-checkbox__inner) {
+  box-shadow: 0 0 0 2px rgba(255, 0, 0, 0.2) !important;
+}
+
+:deep(.el-checkbox__label) {
+  color: #333 !important;
+  font-size: 14px !important;
+}
+
+/* 权限详情（深度探索） */
+.permission-detail-dialog {
+  --el-dialog-padding-primary: 15px;
+}
+
+.detail-container {
+  background-color: #fff1f0;
+  border-radius: 6px;
+  padding: 15px;
+}
+
+.hlid-item {
+  margin-bottom: 25px;
+}
+
+.label {
+  color: #666;
+  font-weight: 500;
+}
+
+.value {
+  color: #333;
+}
+
+.expire-section {
+  margin-top: 10px;
+}
+
+.section-title {
+  font-size: 16px;
+  color: #333;
+  margin-bottom: 10px;
+  font-weight: bold;
+}
+
+.indicator-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.indicator-item {
+  padding: 6px 0;
+  display: flex;
+  align-items: center;
+}
+
+.indicator-name {
+  color: #666;
+  font-size: 14px;
+}
+
+.expire-time {
+  color: #333;
+  font-size: 14px;
+  margin-left: 8px;
+}
+
+.expired-tag {
+  background-color: #ffccd5;
+  color: #f56c6c;
+  font-size: 12px;
+  padding: 2px 8px;
+  border-radius: 4px;
+  margin-left: 8px;
+}
+</style>