feat: 优化菜单折叠按钮

scripts/vite/color.ts

@@ -4,7 +4,7 @@ const arcoLevels = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
 export const arcoToUnoColor = (arcoColorName: string): { [id: string]: string } => {
   const colors = {};
   for (let i = 0; i < 10; i++) {
-    colors[unoLevels[i]] = `rgb(var(--${arcoColorName}-${arcoLevels[i]}))`;
+    colors[unoLevels[i]] = `rgba(var(--${arcoColorName}-${arcoLevels[i]}), 1)`;
   }
   return colors;
 };

src/App.vue

@@ -19,7 +19,6 @@ const menuStore = useMenuStore();
 
 const hasAuth = computed(() => {
   return route.matched.every(item => {
-    console.log('i', item);
     const needAuth = item.meta.auth;
     const userAuth = userStore.auth;
     if (needAuth?.includes('*')) {

src/components/AnBreadcrumb/bread-page.vue

@@ -7,7 +7,7 @@
           <a-link>需要帮助？</a-link>
           <a-button size="mini" @click="router.push({ path: route.path, query: { s: Math.random() }, force: true })">
             <template #icon>
-              <i class="icon-park-outline-refresh"></i>
+              <i class="icon-park-outline-redo"></i>
             </template>
           </a-button>
         </div>

src/pages/_layout/index.vue

@@ -57,10 +57,14 @@
           <Menu />
         </a-scrollbar>
         <template #trigger="{ collapsed }">
-          <i
-            :class="collapsed ? `icon-park-outline-expand-left` : 'icon-park-outline-expand-right'"
-            class="text-gray-400 text-base hover:text-gray-700"
-          ></i>
+          <div class="w-full h-full py-1 px-1" @click.stop>
+            <span
+              class="inline-block w-10 h-full rounded flex items-center justify-center hover:bg-gray-100 text-base text-gray-400"
+              @click="() => (isCollapsed = !isCollapsed)"
+            >
+              <i :class="collapsed ? `icon-park-outline-expand-left` : 'icon-park-outline-expand-right'"></i>
+            </span>
+          </div>
         </template>
       </a-layout-sider>
       <a-layout class="layout-content flex-1">

src/pages/system/user/index.vue

@@ -32,7 +32,7 @@ const { component: PasswordModal, open } = useFormModal({
 
 const usernameRender: TableColumnRender = ({ record }) => (
   <div class="flex items-center gap-4 w-full overflow-hidden">
-    <a-avatar size={32}>
+    <a-avatar size={32} class="bg-brand-500!">
       {record.avatar?.startsWith('/') ? <img src={record.avatar} alt="" /> : record.nickname?.[0]}
     </a-avatar>
     <div class="w-full flex-1 overflow-hidden">