chore update

src/components/base/AppList.vue

@@ -138,8 +138,7 @@ defineExpose({ refetch, tableRef })
                   clearable
                   @change="search"
                   style="width: 200px"
-                  v-if="item.type === 'input'"
-                />
+                  v-if="item.type === 'input'" />
                 <!-- select -->
                 <el-select
                   v-model="params[item.prop]"
@@ -147,14 +146,12 @@ defineExpose({ refetch, tableRef })
                   filterable
                   clearable
                   @change="search"
-                  v-if="item.type === 'select'"
-                >
+                  v-if="item.type === 'select'">
                   <el-option
                     :label="option[item.labelKey] || option.label"
                     :value="option[item.valueKey] || option.value"
                     v-for="(option, index) in item.options"
-                    :key="index"
-                  />
+                    :key="index" />
                 </el-select>
               </template>
             </el-form-item>
@@ -178,8 +175,7 @@ defineExpose({ refetch, tableRef })
           :data="dataList"
           v-loading="loading"
           v-bind="$attrs"
-          ref="tableRef"
-        >
+          ref="tableRef">
           <el-table-column align="center" v-bind="item || {}" v-for="item in columns" :key="item.prop">
             <template #default="scope" v-if="item.slots || item.computed">
               <slot :name="item.slots" v-bind="scope" v-if="item.slots"></slot>
@@ -205,21 +201,13 @@ defineExpose({ refetch, tableRef })
         @size-change="pageSizeChange"
         @current-change="fetchList()"
         :hide-on-single-page="true"
-        v-if="hasPagination"
-      >
+        v-if="hasPagination">
       </el-pagination>
     </div>
   </div>
 </template>
 
 <style lang="scss">
-// .table-list {
-//   height: 100%;
-//   display: flex;
-//   flex-direction: column;
-//   box-sizing: border-box;
-// }
-
 .table-list-hd {
   display: flex;
   margin-bottom: 20px;
@@ -229,9 +217,6 @@ defineExpose({ refetch, tableRef })
 }
 .table-list-filter {
   flex: 1;
-  // padding: 30px 30px 10px;
-  // background: #f8f8f8;
-  // border-radius: 12px;
 }
 .table-list-buttons {
   margin-bottom: 20px;
@@ -239,9 +224,7 @@ defineExpose({ refetch, tableRef })
     display: none;
   }
 }
-// .table-list-bd {
-//   flex: 1;
-// }
+
 .table-list-ft {
   padding: 10px 0;
   display: flex;
@@ -254,8 +237,21 @@ defineExpose({ refetch, tableRef })
 .el-table-column--selection .cell {
   padding: 0 14px !important;
 }
-.el-button a {
-  margin: -8px -15px;
-  padding: 8px 15px;
+.table-list {
+  .el-button {
+    a {
+      margin: -8px -15px;
+      padding: 8px 15px;
+    }
+    &.is-text {
+      padding: 8px;
+    }
+    &.is-text + .is-text {
+      margin-left: 0;
+    }
+    &.is-plain {
+      --el-button-border-color: var(--el-button-bg-color);
+    }
+  }
 }
 </style>

src/components/layout/Aside.vue

@@ -19,10 +19,17 @@ const currentSubmenu = computed(() => {
 
 function findMenu(path: string, menus: IMenuItem[]) {
   return menus.find(item => {
-    if (item.children && item.children.find(item => item.path === path)) {
+    if (
+      item.children &&
+      item.children.find(item => {
+        const regExp = new RegExp(`^${item.path}`)
+        return regExp.test(path)
+      })
+    ) {
       return item
     }
-    return item.path === path
+    const regExp = new RegExp(`^${item.path}`)
+    return regExp.test(path)
   })
 }
 </script>

src/components/layout/Index.vue

@@ -30,15 +30,12 @@ withDefaults(defineProps<Props>(), {
 
 <style lang="scss">
 .app-layout {
-  min-width: 1000px;
   min-height: 100vh;
-  margin: 0 auto;
   background-color: #ecf2f7;
   display: flex;
 }
 .app-layout-container {
-  // min-height: calc(100vh - 66px);
   flex: 1;
-  display: flex;
+  overflow: hidden;
 }
 </style>

src/components/layout/Main.vue

@@ -4,26 +4,13 @@ export default { name: 'AppMain' }
 
 <template>
   <section class="app-main">
-    <div class="app-main-inner">
-      <router-view></router-view>
-    </div>
+    <router-view></router-view>
   </section>
 </template>
 
 <style>
 .app-main {
-  position: relative;
-  flex: 1;
   padding: 10px;
   overflow: hidden;
 }
-.app-main-inner {
-  height: 100%;
-  margin: 0 auto;
-}
-.app-main-container::after {
-  content: '';
-  display: table;
-  clear: both;
-}
 </style>

src/modules/metadata/event/views/Index.vue

+<script setup lang="ts">
+// 列表配置
+const listOptions = computed(() => {
+  return {
+    filters: [
+      { type: 'input', prop: 'name', placeholder: '请输入事件名称' },
+      {
+        type: 'select',
+        prop: 'type',
+        placeholder: '请选择事件所属连接'
+      }
+    ],
+    columns: [
+      { label: '序号', type: 'index', width: 60 },
+      { label: '事件ID', prop: 'id' },
+      { label: '事件名称', prop: 'name' },
+      { label: '所属连接', prop: 'name' },
+      { label: '属性字段数量', prop: 'name' },
+      { label: '状态', prop: 'name' },
+      { label: '更新人', prop: 'name' },
+      { label: '更新时间', prop: 'name' },
+      { label: '操作', slots: 'table-x', width: 300 }
+    ],
+    data: [{}, {}]
+  }
+})
+</script>
+
 <template>
-  <AppCard></AppCard>
+  <AppCard>
+    <AppList v-bind="listOptions">
+      <template #table-x>
+        <el-button type="primary" plain>查看</el-button>
+        <el-button type="primary" plain>编辑</el-button>
+        <el-button type="primary" plain>删除</el-button>
+        <el-button type="primary" plain>字段</el-button>
+      </template>
+    </AppList>
+  </AppCard>
 </template>

src/modules/metadata/user/views/Index.vue

@@ -18,7 +18,7 @@ const listOptions = computed(() => {
       { label: '状态', prop: 'name' },
       { label: '更新人', prop: 'name' },
       { label: '更新时间', prop: 'name' },
-      { label: '操作', slots: 'table-x' }
+      { label: '操作', slots: 'table-x', width: 240 }
     ],
     data: [{}, {}]
   }