chore: 脚手架

packages/@core/base/typings/src/basic.d.ts

@@ -12,6 +12,10 @@ interface BasicUserInfo {
    * 头像
    */
   avatar: string;
+  /**
+   * 用户权限
+   */
+  permissions: string[];
   /**
    * 用户昵称
    */
@@ -19,11 +23,11 @@ interface BasicUserInfo {
   /**
    * 用户角色
    */
-  roles?: string[];
+  roles: string[];
   /**
    * 用户id
    */
-  userId: string;
+  userId: number | string;
   /**
    * 用户名
    */

packages/@core/preferences/src/config.ts

@@ -88,7 +88,7 @@ const defaultPreferences: Preferences = {
     colorPrimary: 'hsl(231 98% 65%)',
     colorSuccess: 'hsl(144 57% 58%)',
     colorWarning: 'hsl(42 84% 61%)',
-    mode: 'dark',
+    mode: 'auto',
     radius: '0.5',
     semiDarkMenu: true,
   },

packages/effects/access/src/accessible.ts

@@ -24,6 +24,12 @@ async function generateAccessible(
 
   // 动态添加到router实例内
   accessibleRoutes.forEach((route) => {
+    /**
+     * 外链不应该被添加到路由 由menu处理
+     */
+    if (/^http(s)?:\/\//.test(route.path)) {
+      return;
+    }
     router.addRoute(route);
   });
 

packages/effects/access/src/use-access.ts

@@ -28,7 +28,13 @@ function useAccess() {
    */
   function hasAccessByCodes(codes: string[]) {
     const userCodesSet = new Set(accessStore.accessCodes);
-
+    /**
+     * 管理员权限
+     */
+    if (userCodesSet.has('*:*:*')) {
+      return true;
+    }
+    // 其他 判断是否存在
     const intersection = codes.filter((item) => userCodesSet.has(item));
     return intersection.length > 0;
   }

packages/effects/common-ui/src/authentication/login.vue

@@ -1,11 +1,17 @@
 <script setup lang="ts">
 import type { AuthenticationProps, LoginEmits } from './typings';
 
-import { computed, reactive } from 'vue';
+import { computed, reactive, watch } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { $t } from '@vben/locales';
 import {
+  Select,
+  SelectContent,
+  SelectGroup,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
   VbenButton,
   VbenCheckbox,
   VbenInput,
@@ -15,13 +21,31 @@ import {
 import Title from './auth-title.vue';
 import ThirdPartyLogin from './third-party-login.vue';
 
-interface Props extends AuthenticationProps {}
+interface Props extends AuthenticationProps {
+  /**
+   * @zh_CN 验证码图片base64
+   */
+  captchaBase64?: string;
+  /**
+   * 租户信息options
+   */
+  tenantOptions?: { companyName: string; domain?: string; tenantId: string }[];
+  /**
+   * @zh_CN 是否启用验证码
+   */
+  useCaptcha?: boolean;
+  /**
+   * @zh_CN 是否启用租户
+   */
+  useTenant?: boolean;
+}
 
 defineOptions({
   name: 'AuthenticationLogin',
 });
 
-withDefaults(defineProps<Props>(), {
+const props = withDefaults(defineProps<Props>(), {
+  captchaBase64: '',
   codeLoginPath: '/auth/code-login',
   forgetPasswordPath: '/auth/forget-password',
   loading: false,
@@ -35,11 +59,16 @@ withDefaults(defineProps<Props>(), {
   showRememberMe: true,
   showThirdPartyLogin: true,
   subTitle: '',
+  tenantOptions: () => [],
   title: '',
   usernamePlaceholder: '',
 });
 
 const emit = defineEmits<{
+  /**
+   * 验证码点击
+   */
+  captchaClick: [];
   submit: LoginEmits['submit'];
 }>();
 
@@ -47,15 +76,28 @@ const router = useRouter();
 
 const REMEMBER_ME_KEY = `REMEMBER_ME_USERNAME_${location.hostname}`;
 
-const localUsername = localStorage.getItem(REMEMBER_ME_KEY) || '';
+const localUsername = localStorage.getItem(REMEMBER_ME_KEY) || 'admin';
 
 const formState = reactive({
-  password: '',
+  code: '',
+  password: 'admin123',
   rememberMe: !!localUsername,
   submitted: false,
+  // 默认租户
+  tenantId: '000000',
   username: localUsername,
 });
 
+/**
+ * 默认选中第一项租户
+ */
+const stop = watch(props.tenantOptions, (options) => {
+  if (options.length > 0) {
+    formState.tenantId = options[0]!.tenantId;
+    stop();
+  }
+});
+
 const usernameStatus = computed(() => {
   return formState.submitted && !formState.username ? 'error' : 'default';
 });
@@ -64,6 +106,10 @@ const passwordStatus = computed(() => {
   return formState.submitted && !formState.password ? 'error' : 'default';
 });
 
+const captchaStatus = computed(() => {
+  return formState.submitted && !formState.code ? 'error' : 'default';
+});
+
 function handleSubmit() {
   formState.submitted = true;
 
@@ -74,13 +120,21 @@ function handleSubmit() {
     return;
   }
 
+  // 验证码
+  if (props.useCaptcha && captchaStatus.value !== 'default') {
+    return;
+  }
+
   localStorage.setItem(
     REMEMBER_ME_KEY,
     formState.rememberMe ? formState.username : '',
   );
 
   emit('submit', {
+    code: formState.code,
+    grantType: 'password',
     password: formState.password,
+    tenantId: formState.tenantId,
     username: formState.username,
   });
 }
@@ -88,6 +142,18 @@ function handleSubmit() {
 function handleGo(path: string) {
   router.push(path);
 }
+
+/**
+ * 重置验证码
+ */
+function resetCaptcha() {
+  emit('captchaClick');
+  formState.code = '';
+  // todo 获取焦点
+  // VbenInput并没有提供focus方法
+}
+
+defineExpose({ resetCaptcha });
 </script>
 
 <template>
@@ -101,6 +167,26 @@ function handleGo(path: string) {
       </template>
     </Title>
 
+    <!-- 租户 -->
+    <div v-if="useTenant" class="mb-6">
+      <Select v-model="formState.tenantId">
+        <SelectTrigger>
+          <SelectValue placeholder="选择公司" />
+        </SelectTrigger>
+        <SelectContent>
+          <SelectGroup>
+            <SelectItem
+              v-for="item in tenantOptions"
+              :key="item.tenantId"
+              :value="item.tenantId"
+            >
+              {{ item.companyName }}
+            </SelectItem>
+          </SelectGroup>
+        </SelectContent>
+      </Select>
+    </div>
+
     <VbenInput
       v-model="formState.username"
       :autofocus="false"
@@ -123,6 +209,27 @@ function handleGo(path: string) {
       type="password"
     />
 
+    <!-- 图片验证码 -->
+    <div v-if="useCaptcha" class="flex">
+      <div class="flex-1">
+        <VbenInput
+          v-model="formState.code"
+          :error-tip="$t('authentication.captchaTip')"
+          :label="$t('authentication.captcha')"
+          :placeholder="$t('authentication.captcha')"
+          :status="captchaStatus"
+          name="code"
+          required
+          type="text"
+        />
+      </div>
+      <img
+        :src="captchaBase64"
+        class="h-[38px] w-[115px] rounded-r-md"
+        @click="emit('captchaClick')"
+      />
+    </div>
+
     <div class="mb-6 mt-4 flex justify-between">
       <div v-if="showRememberMe" class="flex-center">
         <VbenCheckbox v-model:checked="formState.rememberMe" name="rememberMe">

packages/effects/common-ui/src/authentication/typings.ts

@@ -3,6 +3,7 @@ interface AuthenticationProps {
    * @zh_CN 验证码登录路径
    */
   codeLoginPath?: string;
+
   /**
    * @zh_CN 忘记密码路径
    */
@@ -32,6 +33,7 @@ interface AuthenticationProps {
    * @zh_CN 是否显示验证码登录
    */
   showCodeLogin?: boolean;
+
   /**
    * @zh_CN 是否显示忘记密码
    */
@@ -66,7 +68,6 @@ interface AuthenticationProps {
    * @zh_CN 登录框标题
    */
   title?: string;
-
   /**
    * @zh_CN 用户名占位符
    */
@@ -74,8 +75,12 @@ interface AuthenticationProps {
 }
 
 interface LoginAndRegisterParams {
+  code?: string;
+  grantType: string;
   password: string;
+  tenantId: string;
   username: string;
+  uuid?: string;
 }
 
 interface LoginCodeParams {

packages/effects/hooks/src/use-app-config.ts

@@ -15,9 +15,26 @@ export function useAppConfig(
     ? window._VBEN_ADMIN_PRO_APP_CONF_
     : (env as VbenAdminProAppConfigRaw);
 
-  const { VITE_GLOB_API_URL } = config;
+  const {
+    VITE_GLOB_API_URL,
+    VITE_GLOB_APP_CLIENT_ID,
+    VITE_GLOB_ENABLE_ENCRYPT,
+    VITE_GLOB_RSA_PRIVATE_KEY,
+    VITE_GLOB_RSA_PUBLIC_KEY,
+    VITE_GLOB_WEBSOCKET_ENABLE,
+  } = config;
 
   return {
+    // 后端地址
     apiURL: VITE_GLOB_API_URL,
+    // 客户端key
+    clientId: VITE_GLOB_APP_CLIENT_ID,
+    enableEncrypt: VITE_GLOB_ENABLE_ENCRYPT === 'true',
+    // RSA私钥
+    rsaPrivateKey: VITE_GLOB_RSA_PRIVATE_KEY,
+    // RSA公钥
+    rsaPublicKey: VITE_GLOB_RSA_PUBLIC_KEY,
+    // 是否开启websocket
+    websocketEnable: VITE_GLOB_WEBSOCKET_ENABLE === 'true',
   };
 }

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

@@ -99,7 +99,8 @@ class RequestClient {
         const authorization = this.makeAuthorization?.(config);
         if (authorization) {
           const { token } = authorization.tokenHandler?.() ?? {};
-          config.headers[authorization.key || 'Authorization'] = token;
+          config.headers[authorization.key || 'Authorization'] =
+            `Bearer ${token}`;
         }
 
         const requestHeader = this.makeRequestHeaders?.(config);

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

@@ -43,13 +43,9 @@ interface RequestClientOptions extends CreateAxiosDefaults {
 }
 
 interface HttpResponse<T = any> {
-  /**
-   * 0 表示成功 其他表示失败
-   * 0 means success, others means fail
-   */
   code: number;
   data: T;
-  message: string;
+  msg: string;
 }
 
 export type {
@@ -60,3 +56,44 @@ export type {
   RequestClientOptions,
   RequestContentType,
 };
+
+export type ErrorMessageMode = 'message' | 'modal' | 'none' | undefined;
+export type SuccessMessageMode = ErrorMessageMode;
+
+/**
+ * 拓展axios的请求配置
+ */
+declare module 'axios' {
+  interface AxiosRequestConfig {
+    /** 是否加密请求参数  */
+    encrypt?: boolean;
+    /**
+     * 错误弹窗类型
+     */
+    errorMessageMode?: ErrorMessageMode;
+    /**
+     * 是否格式化日期
+     */
+    formatDate?: boolean;
+    /**
+     * 是否返回原生axios响应
+     */
+    isReturnNativeResponse?: boolean;
+    /**
+     * 是否需要转换响应 即只获取{code, msg, data}中的data
+     */
+    isTransformResponse?: boolean;
+    /**
+     * param添加到url后
+     */
+    joinParamsToUrl?: boolean;
+    /**
+     * 加入时间戳
+     */
+    joinTime?: boolean;
+    /**
+     * 成功弹窗类型
+     */
+    successMessageMode?: SuccessMessageMode;
+  }
+}

packages/locales/src/langs/en-US.json

@@ -51,7 +51,12 @@
       "unauthorized": "Unauthorized. Please log in to continue.",
       "forbidden": "Forbidden. You do not have permission to access this resource.",
       "notFound": "Not Found. The requested resource could not be found.",
-      "internalServerError": "Internal Server Error. Something went wrong on our end. Please try again later."
+      "internalServerError": "Internal Server Error. Something went wrong on our end. Please try again later.",
+      "apiRequestFailed": "The interface request failed, please try again later!",
+      "operationSuccess": "Operation Success",
+      "operationFailed": "Operation failed",
+      "errorTip": "Error Tip",
+      "successTip": "Success Tip"
     }
   },
   "widgets": {
@@ -95,8 +100,10 @@
     "loginSubtitle": "Enter your account details to manage your projects",
     "username": "Username",
     "password": "Password",
+    "captcha": "Captcha",
     "usernameTip": "Please enter username",
     "passwordTip": "Please enter password",
+    "captchaTip": "Please enter captcha",
     "rememberMe": "Remember Me",
     "createAnAccount": "Create an Account",
     "createAccount": "Create Account",

packages/locales/src/langs/zh-CN.json

@@ -1,10 +1,10 @@
 {
   "page": {
     "core": {
-      "login": "登陆",
+      "login": "登录",
       "register": "注册",
-      "codeLogin": "验证码登陆",
-      "qrcodeLogin": "二维码登陆",
+      "codeLogin": "验证码登录",
+      "qrcodeLogin": "二维码登录",
       "forgetPassword": "忘记密码"
     },
     "dashboard": {
@@ -51,7 +51,12 @@
       "unauthorized": "登录认证过期。请重新登录后继续。",
       "forbidden": "禁止访问, 您没有权限访问此资源。",
       "notFound": "未找到, 请求的资源不存在。",
-      "internalServerError": "内部服务器错误，请稍后再试。"
+      "internalServerError": "内部服务器错误，请稍后再试。",
+      "apiRequestFailed": "请求出错，请稍候重试",
+      "operationSuccess": "操作成功",
+      "operationFailed": "操作失败",
+      "errorTip": "错误提示",
+      "successTip": "成功提示"
     }
   },
   "widgets": {
@@ -95,8 +100,10 @@
     "loginSubtitle": "请输入您的帐户信息以开始管理您的项目",
     "username": "账号",
     "password": "密码",
+    "captcha": "验证码",
     "usernameTip": "请输入用户名",
     "passwordTip": "请输入密码",
+    "captchaTip": "请输入验证码",
     "rememberMe": "记住账号",
     "createAnAccount": "创建一个账号",
     "createAccount": "创建账号",

packages/stores/src/modules/user.ts

@@ -5,6 +5,10 @@ interface BasicUserInfo {
    * 头像
    */
   avatar: string;
+  /**
+   * 用户权限
+   */
+  permissions: string[];
   /**
    * 用户昵称
    */
@@ -12,11 +16,11 @@ interface BasicUserInfo {
   /**
    * 用户角色
    */
-  roles?: string[];
+  roles: string[];
   /**
    * 用户id
    */
-  userId: string;
+  userId: number | string;
   /**
    * 用户名
    */

packages/types/global.d.ts

@@ -8,11 +8,33 @@ declare module 'vue-router' {
 }
 
 export interface VbenAdminProAppConfigRaw {
+  // 后端接口地址
   VITE_GLOB_API_URL: string;
+  // 客户端ID
+  VITE_GLOB_APP_CLIENT_ID: string;
+  // # 全局加密开关(即开启了加解密功能才会生效 不是全部接口加密 需要和后端对应)
+  VITE_GLOB_ENABLE_ENCRYPT: string;
+  // RSA请求解密私钥
+  VITE_GLOB_RSA_PRIVATE_KEY: string;
+  // RSA请求加密公钥
+  VITE_GLOB_RSA_PUBLIC_KEY: string;
+  // 是否开启websocket  注意从配置文件获取的类型为string
+  VITE_GLOB_WEBSOCKET_ENABLE: string;
 }
 
 export interface ApplicationConfig {
+  // 后端接口地址
   apiURL: string;
+  // 客户端key
+  clientId: string;
+  // 全局加密开关(即开启了加解密功能才会生效 不是全部接口加密 需要和后端对应)
+  enableEncrypt: boolean;
+  // RSA响应解密私钥
+  rsaPrivateKey: string;
+  // RSA请求加密公钥
+  rsaPublicKey: string;
+  // 是否开启websocket
+  websocketEnable: boolean;
 }
 
 declare global {

packages/types/src/user.d.ts

@@ -3,18 +3,9 @@ import type { BasicUserInfo } from '@vben-core/typings';
 /** 用户信息 */
 interface UserInfo extends BasicUserInfo {
   /**
-   * 用户描述
+   * 拓展使用
    */
-  desc: string;
-  /**
-   * 首页地址
-   */
-  homePath: string;
-
-  /**
-   * accessToken
-   */
-  token: string;
+  [key: string]: any;
 }
 
 export type { UserInfo };

packages/utils/src/helpers/generate-routes-backend.ts

@@ -61,6 +61,11 @@ function convertRoutes(
             ? normalizePath
             : `${normalizePath}.vue`
         ];
+      if (!route.component) {
+        console.error(`未找到对应组件: ${component}`);
+        // 默认为404页面
+        route.component = layoutMap.NotFoundComponent;
+      }
     }
 
     return route;