feat(需求): ①账户域菜单/分组补筛选(名称/组长/类型) + 分组管理移除「数据权限分组」摘要卡 ②店铺密钥列表补筛选(备注/紫鸟账号) ③店铺数据记录两级分页常显 ④全站分组筛选下拉支持模糊搜索(el-select filterable,样式对齐蓝白42px)

admin-frontend-vue/src/pages/account/MenusPage.vue

@@ -29,6 +29,18 @@ interface MenuRow extends MenuManageNode {
 
 const loading = ref(false)
 const rows = ref<MenuManageNode[]>([])
+/** 筛选：菜单名称/类型（用户要求账户域子菜单补筛选条件）。 */
+const filterName = ref('')
+const filterType = ref('')
+const filteredMenuRows = computed<MenuRow[]>(() => {
+  const kw = (filterName.value || '').trim().toLowerCase()
+  const type = filterType.value || ''
+  return menuRows.value.filter((row) => {
+    const nameOk = !kw || (row.name || '').toLowerCase().includes(kw)
+    const typeOk = !type || row.menuType === type
+    return nameOk && typeOk
+  })
+})
 /** 展平视图：前序 + depth。 */
 const menuRows = computed<MenuRow[]>(() => {
   const out: MenuRow[] = []
@@ -197,6 +209,21 @@ onMounted(loadMenus)
       </div>
       <p class="columns-drag-tip">拖动每行左侧的手柄可调整同级菜单的显示顺序，松开后自动保存。</p>
 
+      <div class="form-row menus-filter-row">
+        <div class="form-group" style="min-width: 200px">
+          <label>菜单名称</label>
+          <input v-model="filterName" type="text" placeholder="输入菜单名称" />
+        </div>
+        <div class="form-group" style="min-width: 160px">
+          <label>菜单类型</label>
+          <select v-model="filterType">
+            <option value="">全部</option>
+            <option value="admin">后台</option>
+            <option value="app">软件</option>
+          </select>
+        </div>
+      </div>
+
       <div class="table-scroll columns-table-scroll">
         <table>
           <thead>
@@ -211,9 +238,9 @@ onMounted(loadMenus)
             </tr>
           </thead>
           <tbody>
-            <template v-if="menuRows.length">
+            <template v-if="filteredMenuRows.length">
               <tr
-                v-for="row in menuRows"
+                v-for="row in filteredMenuRows"
                 :key="row.id"
                 :class="{ 'is-column-dragging': dragState?.id === row.id }"
                 @dragover="onDragOver($event, row)"
@@ -255,7 +282,7 @@ onMounted(loadMenus)
               <td colspan="7" class="empty-tip">加载中...</td>
             </tr>
             <tr v-else>
-              <td colspan="7" class="empty-tip">暂无菜单，请先在上方新增</td>
+              <td colspan="7" class="empty-tip">{{ filterName || filterType ? '暂无匹配菜单' : '暂无菜单，请先在上方新增' }}</td>
             </tr>
           </tbody>
         </table>
@@ -327,6 +354,51 @@ h3 {
   font-size: 13px;
   color: #5b6f83;
 }
+.menus-filter-row {
+  margin: 0 0 16px;
+}
+.form-row {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-end;
+  gap: 14px 18px;
+}
+.form-group {
+  display: flex;
+  flex-direction: column;
+  gap: 7px;
+  margin-bottom: 0;
+}
+.form-group label {
+  color: #5b6f83;
+  font-size: 12.5px;
+  font-weight: 600;
+}
+.form-group input,
+.form-group select {
+  min-width: 0;
+  min-height: 42px;
+  padding: 8px 12px;
+  border: 1px solid #cbd9e6;
+  border-radius: 9px;
+  background: #f8fbfd;
+  color: #24384d;
+  font-size: 13.5px;
+  font-family: inherit;
+  color-scheme: light;
+  outline: none;
+  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
+}
+.form-group input:hover,
+.form-group select:hover {
+  border-color: #9fb7cd;
+}
+.form-group input:focus,
+.form-group select:focus {
+  background: #ffffff;
+  border-color: #5f85ad;
+  box-shadow: 0 0 0 3px rgba(95, 133, 173, 0.16);
+}
 .btn {
   display: inline-flex;
   align-items: center;