ch3chi-commons-vue 1.2.0 → 1.8.1

package/src/stores/VueSessionStoreInstaller.ts

@@ -0,0 +1,22 @@
+import { App } from 'vue';
+import HasPermission from '../components/HasPermission.vue';
+import { SESSION_STORE_KEY } from '../auth/keys';
+import { UserSessionActions } from './ViewStore';
+import {createPermissionDirectives} from "../directive/PermissionDirective";
+
+/**
+ * VueSessionStoreInstaller 是一個 Vue 插件，用於全域註冊與提供使用者會話相關的功能。
+ * 它會將傳入的 sessionStore 實例注入到 Vue 應用中，並註冊一個權限檢查的組件和指令。
+ */
+export default {
+  install(app: App, options: { sessionStore: UserSessionActions }) {
+    // 1. 全域提供 sessionStore 實例
+    app.provide(SESSION_STORE_KEY, options.sessionStore);
+
+    // 2. 註冊全域組件
+    app.component('HasPermission', HasPermission);
+
+    // 3. (選配) 如果你也想保留指令版，也可以在這裡一起註冊
+    app.directive('permission', createPermissionDirectives(options));
+  }
+};

package/src/types/turnstile.d.ts

@@ -0,0 +1,8 @@
+interface Turnstile {
+  render: (el: HTMLElement, options: { sitekey: string, callback: (token: string) => void }) => void;
+  // 根據實際 API 補充其他方法
+}
+
+interface Window {
+  turnstile?: Turnstile;
+}

package/src/utils/CToolUtils.ts

@@ -0,0 +1,133 @@
+import dayjs from "dayjs";
+import _ from "lodash";
+import * as yup from "yup";
+
+/**
+ * 空函式
+ */
+export const voidFunction = () => {}
+
+/**
+ * 延遲指定毫秒數
+ * @param ms 毫秒數
+ */
+export const delay = (ms: number) => new Promise(resolve => setTimeout(resolve, ms));
+
+/**
+ * 從 params 中挑選有值的屬性並指派到 payload 中
+ * @param payload
+ * @param params
+ */
+export const pickAndAssign = (payload: Record<string, any>, params: Record<string, any>) =>
+  _.assign(payload, _.pickBy(params, _.identity));
+
+/**
+ * 寫入 Vue ref 物件的值
+ * @param refObj
+ * @param value
+ */
+export const writeVueRefValue = (refObj: any, value: any) => {
+  if(_.isNil(refObj) || !('value' in refObj)) {
+    return;
+  }
+  refObj.value = value;
+}
+
+/**
+ * Lodash 擴充工具
+ */
+export const lodashExTools = {
+  // 安全取得物件屬性值
+  getVal: (obj: any, path: string | null | undefined, defaultValue?: any) => {
+    if(_.isNil(path) || _.isEmpty(path)) {
+      return defaultValue;
+    }
+    return _.get(obj, path, defaultValue);
+  }
+};
+
+/**
+ * 檢查是否有相同的檔案
+ * @param fileList 檔案列表
+ * @param file 要檢查的檔案
+ */
+export const checkHasSameFile = (fileList: File[], file: File) => {
+  return fileList.some(item => item.name === file.name
+    && item.size === file.size
+    && item.type === file.type
+    && item.lastModified === file.lastModified);
+}
+
+/**
+ * 格式化物件中的所有日期屬性為指定格式的字串。
+ * @param obj
+ */
+export function formatDatesInObject(obj: any): any {
+  if (_.isNil(obj)) {
+    return obj;
+  }
+  // 如果是 FormData，直接回傳，不處理
+  if (obj instanceof FormData) {
+    return obj;
+  }
+
+  // 如果是 Date 或 dayjs 物件，進行格式化
+  if (dayjs.isDayjs(obj) || obj instanceof Date) {
+    // 格式化日期成字串
+    // console.log(`format date: ${obj} ISO string => ${dayjs(obj).toISOString()}`);
+    // console.log(`format date: ${obj} with timezone => ${dayjs(obj).tz('Asia/Taipei').toISOString()}`);
+    // console.log(`format date: ${obj} pattern => ${dayjs(obj).format('YYYY-MM-DDTHH:mm:ssZ')}`);
+    // return dayjs(obj).toISOString();
+    return dayjs(obj).format('YYYY-MM-DDTHH:mm:ss');
+  }
+
+  // 如果是陣列，遞迴處理每個元素
+  if (_.isArray(obj)) {
+    return obj.map(item => formatDatesInObject(item));
+  }
+
+  // 如果是物件，遞迴處理每個屬性值
+  if (_.isObject(obj)) {
+    return _.mapValues(obj, value => formatDatesInObject(value));
+  }
+
+  // 其他類型直接回傳
+  return obj;
+}
+
+/**
+ * 建立一個日期區間驗證器，用於 yup 的 test 方法中。
+ * @param startDateKey
+ * @param endDateKey
+ * @param startDateMessage
+ * @param endDateMessage
+ */
+export function makeDateRangeValidator({
+  startDateKey, endDateKey, startDateMessage, endDateMessage
+}: {startDateKey: string, endDateKey: string, startDateMessage: string, endDateMessage: string}) {
+  return function (this: yup.TestContext, formValues: Record<string, any>) {
+    const startsAt = formValues[startDateKey];
+    const endsAt = formValues[endDateKey];
+    if (startsAt == null && endsAt == null) {
+      return true;
+    }
+    const errors: yup.ValidationError[] = [];
+
+    if (startsAt && endsAt && (startsAt > endsAt)) {
+      errors.push(this.createError({
+        path: startDateKey,
+        message: startDateMessage
+      }));
+      errors.push(this.createError({
+        path: endDateKey,
+        message: endDateMessage
+      }));
+    }
+    if (errors.length > 0) {
+      // 注意：這裡我們回傳一個新的 ValidationError 實例，它包裹了所有收集到的錯誤
+      return new yup.ValidationError(errors);
+    }
+    return true;
+  }
+}
+

package/dist/api/ApiService.d.ts

@@ -1,233 +0,0 @@
-import { AxiosProgressEvent, AxiosRequestConfig, AxiosResponse, RawAxiosResponseHeaders } from 'axios';
-import { AccessToken } from '../model/TokenUser';
-/**
- * ApiEndpoint 定義 API 端點的結構
- */
-export interface ApiEndpoint {
-    path: string;
-    method: string;
-    isAuthenticated?: boolean;
-    security?: string[];
-    withCredentials?: boolean;
-    isRefreshTokenEndpoint?: boolean;
-    errorMessageMap?: Record<number, string>;
-    noSpinner?: boolean;
-    headers?: Record<string, string>;
-    metaData?: Record<string, any>;
-}
-/**
- * CreateEndpointOptions 定義建立 ApiEndpoint 時的選項
- * 通常用於設定預設值
- */
-export interface CreateEndpointOptions {
-    isAuthenticated?: boolean;
-    security?: string[];
-    headers?: Record<string, string>;
-}
-/**
- * ApiRequest 定義 API 請求的結構
- */
-export declare class ApiRequest {
-    endpointKey: string;
-    headers?: Record<string, string>;
-    pathParam?: Record<string, any>;
-    queryParam?: Record<string, any>;
-    postBody?: Record<string, any> | FormData;
-    isDownloadMode?: boolean;
-    downloadFileName?: string;
-    onUploadProgress?: (progressEvent: AxiosProgressEvent) => void;
-    axiosConfig?: AxiosRequestConfig;
-    noSpinner?: boolean;
-    constructor(data: ApiRequest);
-}
-/**
- * ApiResponse 定義 API 回應的結構
- */
-export declare class ApiResponse {
-    httpStatus: number;
-    status?: number;
-    message?: string;
-    data?: any;
-    nativeError?: any;
-    paging?: Record<string, any>;
-    blobData?: Blob;
-    headers?: RawAxiosResponseHeaders;
-    details?: any;
-    axiosResponse?: AxiosResponse;
-    constructor(data?: Partial<ApiResponse>);
-    isOk(): boolean;
-}
-/**
- * ApiRejectError 定義 API 呼叫失敗時的自訂錯誤
- * 此物件給 ApiService.call 呼叫後，並且回傳 Promise.reject() 使用
- */
-export declare class ApiRejectError extends Error {
-    response: ApiResponse;
-    type?: string;
-    constructor(response: ApiResponse);
-    notFound(): this;
-}
-/**
- * ApiService 提供呼叫後端 API 的功能
- */
-export declare class ApiService {
-    private static _options;
-    private static _apiEndpoints;
-    private static _customHeaders;
-    private static _customHeaderProvider?;
-    private static _customErrorMessageMap;
-    private static _accessToken?;
-    private static _accessTokenProvider?;
-    private static _refreshTokenPromise?;
-    private static _axiosInstance?;
-    private static _failedRequestQueue;
-    private static _isRefreshing;
-    static set accessToken(token: AccessToken);
-    static set accessTokenProvider(provider: () => Promise<AccessToken | undefined>);
-    static getAccessToken(): Promise<AccessToken | undefined>;
-    /**
-     * 靜態方法，新增全域自訂標頭
-     * @param key
-     * @param value
-     */
-    static addHeader(key: string, value: string): void;
-    /**
-     * 靜態方法，移除全域自訂標頭
-     * @param key
-     */
-    static removeHeader(key: string): void;
-    /**
-     * 靜態方法，設定自訂標頭提供者
-     * @param provider
-     */
-    static customHeaderProvider(provider: (endpoint: ApiEndpoint, header: Record<string, any>) => Promise<Record<string, string>>): void;
-    constructor();
-    /**
-     * 靜態方法，配置 ApiService
-     * 為方便管理，建議在專案啟動時呼叫此方法註冊所有端點
-     * 可以配置
-     * - debugMode: 是否啟用除錯模式
-     * - baseUrl: API 伺服器的基礎 URL
-     * - contextPath: API 的上下文路徑
-     * - proxyEnable: 是否啟用代理
-     * - proxyBaseUrl: 代理的基礎 URL
-     * - showSpinnerFunc: 顯示全域載入動畫的函式
-     * - hideSpinnerFunc: 隱藏全域載入動畫的函式
-     * - showErrorToastFunc: 顯示全域錯誤提示的函式
-     * - endpoints: 預設註冊的 API 端點
-     * - customHeaders: 全域自訂標頭
-     * - customErrorMessageMap: 全域自訂錯誤訊息對應
-     * - createEndpointOptions: 建立端點時的預設選項
-     * - refreshTokenFunc: 刷新存取權杖的函式
-     * - onAuthenticateFailed: 認證失敗時的回調函式
-     * @param config
-     */
-    static configure(config: {
-        debugMode?: boolean;
-        baseUrl?: string;
-        contextPath?: string;
-        proxyEnable?: boolean;
-        proxyBaseUrl?: string;
-        showSpinnerFunc?: () => void;
-        hideSpinnerFunc?: () => void;
-        showErrorToastFunc?: (param: {
-            title?: string;
-            content?: string;
-        }) => void;
-        endpoints: Record<string, ApiEndpoint>;
-        customHeaders?: Record<string, string>;
-        customHeaderProvider?: (endpoint: ApiEndpoint, header: Record<string, any>) => Promise<Record<string, string>>;
-        customErrorMessageMap?: Record<number, string>;
-        createEndpointOptions?: CreateEndpointOptions;
-        refreshTokenFunc?: () => Promise<AccessToken>;
-        onAuthenticateFailed?: (param: {
-            apiEndpoint: ApiEndpoint;
-            apiRequest: ApiRequest;
-        }) => void;
-    }): void;
-    /**
-     * 靜態方法，新增單一 API 端點
-     * @param key
-     * @param endpoint
-     */
-    static addEndpoints(key: string, endpoint: ApiEndpoint): void;
-    /**
-     * 靜態方法，方便直接呼叫 API
-     * @param request
-     */
-    static call(request: ApiRequest): Promise<ApiResponse>;
-    /**
-     * 靜態方法，方便直接下載檔案
-     * @param request
-     */
-    static download(request: ApiRequest): Promise<void>;
-    /**
-     * 取得指定的 API 端點資訊
-     * @param endpointKey
-     */
-    getEndpoint(endpointKey: string): ApiEndpoint | undefined;
-    /**
-     * 取得完整的 API URL
-     * @param endpointKey
-     */
-    getFullUrl(endpointKey: string): string | undefined;
-    /**
-     * 組合完整的 API URL
-     * @param endpoint
-     */
-    makeBaseUrl(endpoint: ApiEndpoint): string | undefined;
-    /**
-     * 呼叫 API
-     * @param request
-     */
-    callApi(request: ApiRequest): Promise<ApiResponse>;
-    /**
-     * 下載檔案
-     * @param request
-     */
-    downloadFile(request: ApiRequest): Promise<void>;
-    /**
-     * 決定下載檔案名稱
-     * @param request
-     * @param response
-     */
-    resolveExportFileName(request: ApiRequest, response: ApiResponse): string;
-    /**
-     * 解碼 RFC 2047 編碼的字串
-     * @param str RFC 2047 編碼的字串
-     */
-    decodeRfc2047(str: string): string;
-    /**
-     * 檢查是否啟用 Bearer Token 認證
-     */
-    private static hasBearerAuth;
-    /**
-     * 設定 axios 攔截器
-     */
-    private static setupAxiosInterceptors;
-    /**
-     * 設定認證相關的 interceptors
-     */
-    private static setupAuthInterceptorsOnBearerAuth;
-    /**
-     * 刷新 access token
-     */
-    static refreshToken(): Promise<AccessToken>;
-    /**
-     * 檢查並刷新 token（如果需要）
-     */
-    private static refreshTokenIfNeeded;
-    /**
-     * 處理佇列中的失敗請求
-     */
-    private static processFailedRequestQueue;
-    /**
-     * 處理認證失敗
-     */
-    private static handleAuthenticationFailed;
-    /**
-     * 取得 axios 實例
-     */
-    private static getAxiosInstance;
-}
-export declare const __ApiServiceDefine__: ApiEndpoint;

package/dist/auth/AuthorizationService.d.ts

@@ -1,56 +0,0 @@
-import { CMenuItem, MenuItem } from '../model/CMenuItem';
-/**
- * 提供選單項目的參數介面
- */
-type ProvideMenuByPermissionParams = {
-    roleCode: string;
-    permissions: string[];
-    picker?: (roleCode: string) => MenuItem[];
-};
-/**
- * AuthorizationService 類別負責處理權限相關的邏輯
- */
-export declare class AuthorizationService {
-    /**
-     * 角色權限映射表
-     * 定義角色對應多個權限項目
-     * @private
-     */
-    private static _rolePermissionMap;
-    /**
-     * 選單定義映射表
-     * 定義不同角色對應的選單結構
-     * @private
-     */
-    private static _menuDefineMap;
-    /**
-     * 設定角色權限映射
-     * @param map 角色權限映射物件
-     */
-    static set rolePermissionMap(map: Record<string, string[]>);
-    /**
-     * 設定選單定義映射
-     * @param map
-     */
-    static set menuDefineMap(map: Record<string, MenuItem[]>);
-    /**
-     * 配置角色與權限關係，以及選單定義映射
-     * @param config 配置物件
-     */
-    static configure(config: {
-        rolePermissionMap?: Record<string, string[]>;
-        menuDefineMap: Record<string, MenuItem[]>;
-    }): void;
-    /**
-     * 檢查角色列表是否包含所需的權限
-     * @param roleCodes
-     * @param requiredPermission
-     */
-    static hasPermissionByRole(roleCodes: string[], requiredPermission: string): boolean;
-    /**
-     * 根據角色列表提供選單項目
-     * @param param 配置參數
-     */
-    static provideMenuByPermission(param: ProvideMenuByPermissionParams): CMenuItem[];
-}
-export {};

package/dist/auth/PermissionDescriptor.d.ts

@@ -1,37 +0,0 @@
-/**
- * 權限：操作字串列舉
- */
-export declare enum PermissionAction {
-    NONE = "NONE",// 無操作
-    SIGN_IN = "SIGN_IN",// 登入
-    SIGN_OUT = "SIGN_OUT",// 登出
-    FORGOT_PASSWORD = "FORGOT_PASSWORD",// 忘記密碼
-    RESET_PASSWORD = "RESET_PASSWORD",// 重設個人密碼
-    CHANGE_PASSWORD = "CHANGE_PASSWORD",// 更改密碼
-    CREATE = "CREATE",// 建立資料
-    SEARCH = "SEARCH",// 查詢列表
-    READ = "READ",// 讀取資料
-    UPDATE = "UPDATE",// 更新資料
-    DELETE = "DELETE",// 刪除資料
-    EXPORT = "EXPORT"
-}
-/**
- * 權限描述類別
- */
-export declare class PermissionDescriptor {
-    module: string;
-    action: PermissionAction;
-    supportedActions: PermissionAction[];
-    constructor(data?: Partial<PermissionDescriptor> | string);
-    /**
-     * 檢查是否屬於同一個 module
-     * @param toCheckPermissions
-     */
-    checkModule(toCheckPermissions: string[]): boolean;
-    /**
-     * 檢查是否具有指定的權限
-     * @param toCheckPermissions
-     */
-    checkPermission(toCheckPermissions: string[]): boolean;
-}
-export declare const __PermissionStringDefine__: PermissionAction;

package/dist/components/CAlert.vue.d.ts

@@ -1,17 +0,0 @@
-import { CAlertModalData } from './CAlertDefine';
-type __VLS_Props = {
-    id?: string;
-};
-declare function show(data?: CAlertModalData): void;
-declare function hide(): void;
-declare const _default: import('vue').DefineComponent<__VLS_Props, {
-    show: typeof show;
-    hide: typeof hide;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "c.modal.ok": (...args: any[]) => void;
-    "c.modal.cancel": (...args: any[]) => void;
-}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onC.modal.ok"?: ((...args: any[]) => any) | undefined;
-    "onC.modal.cancel"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
-export default _default;

package/dist/components/CAlertDefine.d.ts

@@ -1,14 +0,0 @@
-export interface CAlertModalData {
-    type?: CAlertModalType | string;
-    title?: string;
-    content?: string;
-    onCancel?: () => void;
-    onOk?: () => void;
-}
-export declare enum CAlertModalType {
-    Error = "error",// 警告類型
-    Alert = "alert",// 警告類型
-    Confirm = "confirm",// 確認類型
-    Info = "info"
-}
-export declare const __CAlertModelDefine__: CAlertModalData & CAlertModalType;

package/dist/components/CBSToast.vue.d.ts

@@ -1,6 +0,0 @@
-import { CAlertModalData } from '../components/CAlertDefine';
-declare function addToast(data: CAlertModalData): void;
-declare const _default: import('vue').DefineComponent<{}, {
-    addToast: typeof addToast;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-export default _default;

package/dist/components/CGlobalSpinner.vue.d.ts

@@ -1,13 +0,0 @@
-type __VLS_Props = {
-    show?: boolean;
-    color?: string;
-    delayMS?: number;
-    isDelay?: boolean;
-};
-declare function showSpinner(): void;
-declare function hide(): void;
-declare const _default: import('vue').DefineComponent<__VLS_Props, {
-    show: typeof showSpinner;
-    hide: typeof hide;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
-export default _default;

package/dist/components/CRowCheckBox.vue.d.ts

@@ -1,14 +0,0 @@
-import { ComputedRef } from 'vue';
-type __VLS_Props = {
-    align?: 'left' | 'center' | 'right';
-    rowData: Record<string, any>;
-    cancelable?: boolean;
-    disableComputed?: ComputedRef<boolean>;
-    readMode?: boolean;
-};
-declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:checked": (...args: any[]) => void;
-}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:checked"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
-export default _default;

package/dist/components/CRowTextInput.vue.d.ts

@@ -1,10 +0,0 @@
-type __VLS_Props = {
-    rowData: Record<string, any>;
-    dataName: string;
-};
-declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:textInput": (...args: any[]) => void;
-}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:textInput"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLInputElement>;
-export default _default;

package/dist/components/CTable.vue.d.ts

@@ -1,24 +0,0 @@
-import { Reactive } from 'vue';
-import { BaseFormDataModel } from '../model/BaseFormDataModel';
-import { QueryParameter } from '../model/QueryParameter';
-import { CTableColumn } from './CTableDefine';
-type CTableProps<T extends QueryParameter, V extends BaseFormDataModel> = {
-    queryParam?: Reactive<T>;
-    columns: CTableColumn[];
-    dataList?: V[];
-    disablePagination?: boolean;
-    multiSort?: boolean;
-    pageSizeOptions?: number[];
-    styleConfig?: Record<string, any>;
-};
-type __VLS_Props = CTableProps<QueryParameter, BaseFormDataModel>;
-declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "table-action": (...args: any[]) => void;
-    "page-change": (...args: any[]) => void;
-    "sort-change": (...args: any[]) => void;
-}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onTable-action"?: ((...args: any[]) => any) | undefined;
-    "onPage-change"?: ((...args: any[]) => any) | undefined;
-    "onSort-change"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
-export default _default;