feat(projects): 工作台部分组件调成真实数据

src/views/workbench/modules/workbench-module-card.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, inject } from 'vue';
+import { inject } from 'vue';
 
 defineOptions({ name: 'WorkbenchModuleCard' });
 
@@ -12,31 +12,25 @@ interface Props {
   icon?: string;
   badgeCount?: number;
   editing?: boolean;
-  collapsed?: boolean;
   hasSettings?: boolean;
 }
 
-const props = withDefaults(defineProps<Props>(), {
+withDefaults(defineProps<Props>(), {
   icon: undefined,
   badgeCount: undefined,
   editing: false,
-  collapsed: false,
   hasSettings: false
 });
 
 const emit = defineEmits<{
-  (e: 'toggle-collapse'): void;
   (e: 'hide'): void;
   (e: 'open-settings'): void;
   (e: 'refresh'): void;
-  (e: 'navigate'): void;
 }>();
-
-const showBody = computed(() => !props.collapsed);
 </script>
 
 <template>
-  <section class="module-card" :class="{ 'is-editing': editing, 'is-collapsed': collapsed }">
+  <section class="module-card" :class="{ 'is-editing': editing }">
     <header class="module-card__head">
       <span v-if="editing" class="module-drag-handle" title="拖动调整位置">
         <SvgIcon icon="mdi:drag-vertical" />
@@ -49,21 +43,9 @@ const showBody = computed(() => !props.collapsed);
         <ElButton v-if="editing && hasSettings" link size="small" title="模块设置" @click="emit('open-settings')">
           <SvgIcon icon="mdi:cog-outline" />
         </ElButton>
-        <ElButton
-          v-if="!editing"
-          link
-          size="small"
-          :title="collapsed ? '展开' : '折叠'"
-          @click="emit('toggle-collapse')"
-        >
-          <SvgIcon :icon="collapsed ? 'mdi:chevron-down' : 'mdi:chevron-up'" />
-        </ElButton>
         <ElButton v-if="!editing" link size="small" title="刷新" @click="emit('refresh')">
           <SvgIcon icon="mdi:refresh" />
         </ElButton>
-        <ElButton v-if="!editing" link size="small" title="跳详情" @click="emit('navigate')">
-          <SvgIcon icon="mdi:open-in-new" />
-        </ElButton>
         <ElButton v-if="!editing && enterEditing" link size="small" title="编辑工作台布局" @click="enterEditing()">
           <SvgIcon icon="mdi:view-dashboard-edit-outline" />
         </ElButton>
@@ -73,7 +55,7 @@ const showBody = computed(() => !props.collapsed);
       </div>
     </header>
 
-    <div v-show="showBody" class="module-card__body">
+    <div class="module-card__body">
       <slot />
     </div>
   </section>
@@ -84,7 +66,7 @@ const showBody = computed(() => !props.collapsed);
   background: var(--el-bg-color);
   border: 1px solid var(--el-border-color-lighter);
   border-radius: 10px;
-  min-height: 180px;
+  height: 100%;
   display: flex;
   flex-direction: column;
   overflow: hidden;
@@ -98,10 +80,6 @@ const showBody = computed(() => !props.collapsed);
   border-color: var(--el-color-primary-light-5);
 }
 
-.module-card.is-collapsed {
-  min-height: auto;
-}
-
 .module-card__head {
   display: flex;
   align-items: center;
@@ -111,10 +89,6 @@ const showBody = computed(() => !props.collapsed);
   background: var(--el-fill-color-blank);
 }
 
-.module-card.is-collapsed .module-card__head {
-  border-bottom: none;
-}
-
 .module-drag-handle {
   cursor: grab;
   color: var(--el-text-color-secondary);
@@ -153,7 +127,10 @@ const showBody = computed(() => !props.collapsed);
 
 .module-card__body {
   flex: 1;
+  min-height: 0;
   padding: 14px;
   overflow: auto;
+  display: flex;
+  flex-direction: column;
 }
 </style>