Merge branch 'main' of https://github.com/vbenjs/vue-vben-admin

packages/effects/access/src/accessible.ts

@@ -53,6 +53,10 @@ async function generateRoutes(
 
   let resultRoutes: RouteRecordRaw[] = routes;
   switch (mode) {
+    case 'backend': {
+      resultRoutes = await generateRoutesByBackend(options);
+      break;
+    }
     case 'frontend': {
       resultRoutes = await generateRoutesByFrontend(
         routes,
@@ -61,10 +65,6 @@ async function generateRoutes(
       );
       break;
     }
-    case 'backend': {
-      resultRoutes = await generateRoutesByBackend(options);
-      break;
-    }
   }
 
   /**

packages/effects/layouts/src/authentication/toolbar.vue

@@ -3,6 +3,8 @@ import type { ToolbarType } from './types';
 
 import { computed } from 'vue';
 
+import { preferences } from '@vben/preferences';
+
 import {
   AuthenticationColorToggle,
   AuthenticationLayoutToggle,
@@ -41,7 +43,7 @@ const showTheme = computed(() => props.toolbarList.includes('theme'));
       <AuthenticationLayoutToggle v-if="showLayout" />
     </div>
     <!-- Always show Language and Theme toggles -->
-    <LanguageToggle v-if="showLanguage" />
-    <ThemeToggle v-if="showTheme" />
+    <LanguageToggle v-if="showLanguage && preferences.widget.languageToggle" />
+    <ThemeToggle v-if="showTheme && preferences.widget.themeToggle" />
   </div>
 </template>

packages/effects/layouts/src/widgets/color-toggle.vue

@@ -13,10 +13,11 @@ defineOptions({
   name: 'AuthenticationColorToggle',
 });
 
-function handleUpdate(value: BuiltinThemeType) {
+function handleUpdate(colorPrimary: string, type: BuiltinThemeType) {
   updatePreferences({
     theme: {
-      builtinType: value,
+      colorPrimary,
+      builtinType: type,
     },
   });
 }
@@ -30,7 +31,7 @@ function handleUpdate(value: BuiltinThemeType) {
       <template v-for="preset in COLOR_PRESETS" :key="preset.color">
         <VbenIconButton
           class="flex-center flex-shrink-0"
-          @click="handleUpdate(preset.type)"
+          @click="handleUpdate(preset.color, preset.type)"
         >
           <div
             :style="{ backgroundColor: preset.color }"

packages/effects/layouts/src/widgets/preferences/blocks/theme/builtin.vue

@@ -31,11 +31,30 @@ const builtinThemePresets = computed(() => {
 
 function typeView(name: BuiltinThemeType) {
   switch (name) {
+    case 'custom': {
+      return $t('preferences.theme.builtin.custom');
+    }
+    case 'deep-blue': {
+      return $t('preferences.theme.builtin.deepBlue');
+    }
+    case 'deep-green': {
+      return $t('preferences.theme.builtin.deepGreen');
+    }
     case 'default': {
       return $t('preferences.theme.builtin.default');
     }
-    case 'violet': {
-      return $t('preferences.theme.builtin.violet');
+    case 'gray': {
+      return $t('preferences.theme.builtin.gray');
+    }
+    case 'green': {
+      return $t('preferences.theme.builtin.green');
+    }
+
+    case 'neutral': {
+      return $t('preferences.theme.builtin.neutral');
+    }
+    case 'orange': {
+      return $t('preferences.theme.builtin.orange');
     }
     case 'pink': {
       return $t('preferences.theme.builtin.pink');
@@ -46,18 +65,11 @@ function typeView(name: BuiltinThemeType) {
     case 'sky-blue': {
       return $t('preferences.theme.builtin.skyBlue');
     }
-    case 'deep-blue': {
-      return $t('preferences.theme.builtin.deepBlue');
+    case 'slate': {
+      return $t('preferences.theme.builtin.slate');
     }
-
-    case 'green': {
-      return $t('preferences.theme.builtin.green');
-    }
-    case 'deep-green': {
-      return $t('preferences.theme.builtin.deepGreen');
-    }
-    case 'orange': {
-      return $t('preferences.theme.builtin.orange');
+    case 'violet': {
+      return $t('preferences.theme.builtin.violet');
     }
     case 'yellow': {
       return $t('preferences.theme.builtin.yellow');
@@ -65,18 +77,6 @@ function typeView(name: BuiltinThemeType) {
     case 'zinc': {
       return $t('preferences.theme.builtin.zinc');
     }
-    case 'neutral': {
-      return $t('preferences.theme.builtin.neutral');
-    }
-    case 'slate': {
-      return $t('preferences.theme.builtin.slate');
-    }
-    case 'gray': {
-      return $t('preferences.theme.builtin.gray');
-    }
-    case 'custom': {
-      return $t('preferences.theme.builtin.custom');
-    }
   }
 }
 

packages/effects/layouts/src/widgets/preferences/blocks/theme/theme.vue

@@ -37,14 +37,14 @@ function activeClass(theme: string): string[] {
 
 function nameView(name: string) {
   switch (name) {
-    case 'light': {
-      return $t('preferences.theme.light');
+    case 'auto': {
+      return $t('preferences.followSystem');
     }
     case 'dark': {
       return $t('preferences.theme.dark');
     }
-    case 'auto': {
-      return $t('preferences.followSystem');
+    case 'light': {
+      return $t('preferences.theme.light');
     }
   }
 }

packages/effects/plugins/src/vxe-table/use-vxe-grid.vue

@@ -277,6 +277,18 @@ onMounted(() => {
                   v-bind="slotProps"
                 ></slot>
               </template>
+              <template #reset-before="slotProps">
+                <slot name="reset-before" v-bind="slotProps"></slot>
+              </template>
+              <template #submit-before="slotProps">
+                <slot name="submit-before" v-bind="slotProps"></slot>
+              </template>
+              <template #expand-before="slotProps">
+                <slot name="expand-before" v-bind="slotProps"></slot>
+              </template>
+              <template #expand-after="slotProps">
+                <slot name="expand-after" v-bind="slotProps"></slot>
+              </template>
             </Form>
           </slot>
           <div