完善前端项目

vue/packages/effects/common-ui/src/ui/dashboard/typing.ts

@@ -37,6 +37,7 @@ interface WorkbenchQuickNavItem {
   icon: Component | string;
   title: string;
   url?: string;
+  authority: string[]; // 新增字段，控制哪些角色可以看到
 }
 
 export type {

vue/packages/effects/common-ui/src/ui/dashboard/workbench/workbench-quick-nav.vue

@@ -1,13 +1,20 @@
 <script setup lang="ts">
-import type { WorkbenchQuickNavItem } from '../typing';
+import type { WorkbenchQuickNavItem } from "../typing";
+
+import {
+  AccessControl,
+  useAccess,
+} from '../../../../../../effects/access/src/index';
+
+const { hasAccessByRoles } = useAccess();
 
 import {
   Card,
   CardContent,
   CardHeader,
   CardTitle,
-  VbenIcon,
-} from '@vben-core/shadcn-ui';
+  VbenIcon
+} from "@vben-core/shadcn-ui";
 
 interface Props {
   items?: WorkbenchQuickNavItem[];
@@ -15,42 +22,62 @@ interface Props {
 }
 
 defineOptions({
-  name: 'WorkbenchQuickNav',
+  name: "WorkbenchQuickNav"
 });
 
 withDefaults(defineProps<Props>(), {
-  items: () => [],
+  items: () => []
 });
 
-defineEmits(['click']);
+defineEmits(["click"]);
 </script>
 
 <template>
   <Card>
-    <CardHeader class="py-4">
+    <!-- 标题 -->
+    <CardHeader class="py-4 pb-0">
       <CardTitle class="text-lg">{{ title }}</CardTitle>
     </CardHeader>
-    <CardContent class="flex flex-wrap p-0">
+
+    <!-- 单行水平滑动卡片 -->
+    <CardContent class="scrollbar-hide flex gap-4 overflow-x-auto p-4">
       <template v-for="(item, index) in items" :key="item.title">
         <div
-          :class="{
-            'border-r-0': index % 3 === 2,
-            'border-b-0': index < 3,
-            'pb-4': index > 2,
-            'rounded-bl-xl': index === items.length - 3,
-            'rounded-br-xl': index === items.length - 1,
-          }"
-          class="flex-col-center border-border group w-1/3 cursor-pointer border-r border-t py-8 hover:shadow-xl"
+          v-if="hasAccessByRoles(item.authority)"
           @click="$emit('click', item)"
+          class="border-border flex h-32 w-40 flex-shrink-0 cursor-pointer flex-col items-center justify-center rounded-xl border transition-all duration-300 hover:shadow-xl"
         >
           <VbenIcon
-            :color="item.color"
             :icon="item.icon"
-            class="size-7 transition-all duration-300 group-hover:scale-125"
+            :color="item.color"
+            class="mb-2 size-7 transition-transform duration-300 group-hover:scale-125"
           />
-          <span class="text-md mt-2 truncate">{{ item.title }}</span>
+          <span class="text-md truncate text-center">{{ item.title }}</span>
+        </div>
+
+        <div
+          v-else
+          class="border-border flex h-32 w-40 flex-shrink-0 cursor-not-allowed flex-col items-center justify-center rounded-xl border bg-gray-300 opacity-50"
+        >
+          <VbenIcon
+            :icon="item.icon"
+            color="#9CA3AF"
+            class="mb-2 size-7"
+          />
+          <span class="text-md truncate text-center">{{ item.title }}</span>
         </div>
       </template>
     </CardContent>
   </Card>
 </template>
+
+<style scoped>
+.scrollbar-hide::-webkit-scrollbar {
+  display: none;
+}
+
+.scrollbar-hide {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+</style>

vue/packages/effects/request/src/request-client/request-client.ts

@@ -60,7 +60,7 @@ class RequestClient {
       },
       responseReturn: 'raw',
       // 默认超时时间
-      timeout: 10_000,
+      timeout: 30_000,
     };
     const { ...axiosConfig } = options;
     const requestConfig = merge(axiosConfig, defaultConfig);