@kengic/vue 0.30.1-beta.96 → 0.31.1

package/component/KgButton/KgButton.less

@@ -1,187 +0,0 @@
-.kg-button {
-    overflow: hidden;
-
-    > .ant-spin-nested-loading {
-        > .ant-spin-container {
-            display: flex;
-            align-items: center;
-
-            .ant-btn {
-                margin-right: 4px;
-                margin-bottom: 4px;
-
-                &.ant-dropdown-trigger {
-                    display: flex;
-                    align-items: center;
-                }
-
-                &.ant-btn-background-ghost,
-                &.ant-btn-background-ghost:hover,
-                &.ant-btn-background-ghost:active,
-                &.ant-btn-background-ghost:focus {
-                    background: #fff !important;
-                }
-            }
-        }
-    }
-}
-
-.kg-button.kg-button--invisible {
-    display: none;
-}
-
-.kg-button-dropdown {
-    .ant-dropdown-menu-item {
-        padding: 0px !important;
-
-        .kg-button-item {
-            width: 100%;
-            color: #000000d9;
-            padding: 5px 8px;
-            box-shadow: none;
-            text-shadow: none;
-            text-align: left;
-            min-width: 100px;
-
-            &:hover {
-                box-shadow: none;
-                text-shadow: none;
-            }
-
-            &[disabled],
-            &[disabled]:hover,
-            &[disabled]:focus,
-            &[disabled]:active {
-                color: rgba(0, 0, 0, 0.25);
-            }
-
-            &.ant-btn-background-ghost.ant-btn-primary {
-                color: #1890ff;
-            }
-
-            &.ant-btn-background-ghost.ant-btn-dangerous {
-                color: #ed6f6f;
-                border-color: #ed6f6f;
-
-                &[disabled],
-                &[disabled]:hover,
-                &[disabled]:focus,
-                &[disabled]:active {
-                    color: rgba(0, 0, 0, 0.25);
-                    border-color: #d9d9d9;
-                }
-            }
-
-            > .ant-upload {
-                width: 100%;
-            }
-        }
-    }
-}
-
-.ant-btn.kg-button-item {
-    --ant-warning-color: #fa8c16;
-    --ant-warning-color-hover: #ffa940;
-    --ant-warning-color-active: #d46b08;
-
-    border-radius: 4px;
-    display: inline-flex !important;
-    align-items: center !important;
-
-    &.ant-btn-loading {
-        .ant-btn-loading-icon {
-            display: none !important;
-        }
-    }
-
-    // 没有权限,
-    &.kg-button-item--no-auth {
-        display: none !important;
-    }
-
-    // 隐藏按钮,
-    &.kg-button-item--invisible {
-        display: none !important;
-    }
-
-    // YELLOW
-    &.kg-button-item--yellow {
-        border-color: var(--ant-warning-color);
-        color: var(--ant-warning-color);
-
-        &:hover,
-        &:focus {
-            border-color: var(--ant-warning-color-hover);
-            background: var(--ant-warning-color-hover);
-        }
-
-        &[disabled],
-        &[disabled]:hover,
-        &[disabled]:focus,
-        &[disabled]:active {
-            color: rgba(0, 0, 0, 0.25);
-            border-color: #d9d9d9;
-            background: #f5f5f5;
-        }
-
-        // primary
-        &.ant-btn-primary {
-            border-color: var(--ant-warning-color);
-            background: var(--ant-warning-color);
-            color: #fff;
-
-            &:hover,
-            &:focus {
-                border-color: var(--ant-warning-color-hover);
-                background: var(--ant-warning-color-hover);
-            }
-
-            &[disabled],
-            &[disabled]:hover,
-            &[disabled]:focus,
-            &[disabled]:active {
-                color: rgba(0, 0, 0, 0.25);
-                border-color: #d9d9d9;
-                background: #f5f5f5;
-            }
-        }
-
-        // ghost
-        &.ant-btn-primary.ant-btn-background-ghost {
-            border-color: var(--ant-warning-color);
-            background: #fff;
-            color: var(--ant-warning-color);
-
-            &:hover,
-            &:focus {
-                border-color: var(--ant-warning-color-hover);
-                color: var(--ant-warning-color-hover);
-            }
-
-            &:active {
-                border-color: var(--ant-warning-color-active);
-                color: var(--ant-warning-color-active);
-            }
-
-            &[disabled],
-            &[disabled]:hover,
-            &[disabled]:focus,
-            &[disabled]:active {
-                color: rgba(0, 0, 0, 0.25);
-                border-color: #d9d9d9;
-                background: #f5f5f5;
-            }
-        }
-    }
-
-    & > span.icon {
-        vertical-align: middle;
-        line-height: 0;
-        padding-right: 8px;
-    }
-}
-
-// 上传按钮
-span.kg-button-item {
-    padding: 0px !important;
-}

package/component/KgButton/KgButton.model.tsx

@@ -1,39 +0,0 @@
-import { ExtractPropTypes, PropType } from 'vue';
-import { VarButton } from '../../api/WMS/models';
-import { KG__VAR_BUTTON__COLOR, KG__VAR_BUTTON__TYPE } from '../../model';
-
-export const getProps = () => ({
-    /** 按钮. */
-    kgButton: Object as PropType<VarButton>,
-
-    /** 颜色. */
-    kgColor: String as PropType<KG__VAR_BUTTON__COLOR | null>,
-
-    /** 是否禁用. */
-    kgDisabled: {
-        type: Boolean as PropType<boolean | null | undefined>,
-        default: undefined,
-    },
-
-    /** 图标. */
-    kgIcon: String as PropType<string | null>,
-
-    /** 是否正在加载. */
-    kgLoading: Boolean as PropType<boolean>,
-
-    /** 是否使用主要按钮样式. */
-    kgPrimary: { type: Boolean as PropType<boolean | null | undefined>, default: undefined },
-
-    /** 文本. */
-    kgText: String as PropType<string | null>,
-
-    /** 按钮类型. */
-    kgType: String as PropType<KG__VAR_BUTTON__TYPE | null>,
-
-    /** 变量名称. */
-    kgVarName: String as PropType<string | null>,
-
-    onKgClick: Function as PropType<(args?: any) => Promise<boolean>>,
-});
-
-export type IKgButtonItemProps = Partial<ExtractPropTypes<ReturnType<typeof getProps>>>;

package/component/KgButton/KgButton.store.ts

@@ -1,333 +0,0 @@
-import { ____ERROR____ } from '@kengic/core.core';
-import { isNil } from 'lodash-es';
-import { defineStore } from 'pinia';
-import { computed, ref, watch } from 'vue';
-import { VarButton } from '../../api/WMS/models';
-import { useKg } from '../../config';
-import { KG__VAR_BUTTON__TYPE, IKgStoreDefinition } from '../../model';
-import { useKgVar } from '../KgVar';
-
-export interface IUseKgButtonStoreGetters {
-    /**
-     * <p>当前按钮.</p>
-     * <p>同一时间最多只会有一个按钮处于「正在执行」状态, 比如点击了创建按钮, 则当前按钮就是创建按钮.</p>
-     */
-    currentButton: VarButton | null;
-
-    /**
-     * 获取按钮描述.
-     *
-     * @param param.varName 按钮变量名称.
-     */
-    getButtonDescription: (param: { varName: string | null | undefined }) => string;
-
-    /**
-     * 判断「当前按钮」是不是复制按钮.
-     */
-    isCopying: boolean;
-
-    /**
-     * 判断「当前按钮」是不是创建按钮.
-     */
-    isCreating: boolean;
-
-    /**
-     * <p>当前按钮的 click 事件是否被拦截.</p>
-     * <p>用户调用 kgVar.kgButton.onClick(listener) 监听了 click 事件, 并且回调函数返回了 true, 表示该 click 事件被用户拦截了.</p>
-     * <p>被拦截之后, 该按钮的默认逻辑不会执行(例如打开提交弹窗, 加载各种数据等等), 后续由用户自行处理.</p>
-     */
-    isCurrentButtonClickIntercepted: boolean;
-
-    /**
-     * <p>当前按钮是否正在请求后端接口.</p>
-     * <p>比如点击了创建按钮, 打开了创建弹窗, 此时「当前按钮」指的就是创建按钮. 当点击弹窗中的保存按钮时, 表示正在请求后端接口.</p>
-     */
-    isCurrentButtonRequesting: boolean;
-
-    /**
-     * 判断「当前按钮」是不是删除按钮.
-     */
-    isDeleting: boolean;
-
-    /**
-     * 判断「当前按钮」是不是更新按钮.
-     */
-    isUpdating: boolean;
-}
-
-export interface IUseKgButtonStoreActions {
-    /**
-     * <p>手动点击某个按钮.</p>
-     * <p>调用此方法相当于手动触发某个按钮的点击事件.</p>
-     *
-     * @param param.type 按钮类型.
-     * @param param.varName 按钮变量名称.
-     */
-    click(param: { type?: KG__VAR_BUTTON__TYPE; varName?: string }): void;
-
-    /**
-     * 重置状态.
-     */
-    dispose(): void;
-
-    /**
-     * 设置当前按钮.
-     *
-     * @param param.type 按钮类型.
-     * @param param.varName 按钮变量名称.
-     */
-    setCurrentButton(param: { type?: KG__VAR_BUTTON__TYPE; varName?: string | null } | null): Promise<void>;
-
-    /**
-     * 设置按钮的 click 事件是否被拦截.
-     *
-     * @param param.isIntercepted 是否拦截.
-     * @param param.type 按钮类型.
-     * @param param.varName 按钮变量名称.
-     */
-    setIsClickIntercepted(param: { isIntercepted: boolean; type?: KG__VAR_BUTTON__TYPE; varName?: string | null }): void;
-
-    /**
-     * 设置「当前按钮」是否正在请求后端接口
-     *
-     * @param param.isRequesting 是否正在请求后端接口.
-     */
-    setIsCurrentButtonRequesting(param: { isRequesting: boolean }): void;
-}
-
-/**
- * key 为界面标识, value 为该界面的状态管理定义.
- */
-const storeDefinitionRecord: Record<string, IKgStoreDefinition<IUseKgButtonStoreGetters, IUseKgButtonStoreActions>> = {};
-
-export function buildKgButtonStore(fid: string | null | undefined): IKgStoreDefinition<IUseKgButtonStoreGetters, IUseKgButtonStoreActions> {
-    if (!fid) {
-        throw new Error('界面标识不能为空');
-    }
-
-    if (!storeDefinitionRecord[fid]) {
-        storeDefinitionRecord[fid] = defineStore(`KgButton[${fid}]`, () => {
-            //region STATE
-            //----------------------------------------------------------------------------------------------------
-            /**
-             * <p>当前按钮.</p>
-             * <p>同一时间最多只会有一个按钮处于「正在执行」状态, 比如点击了创建按钮, 则当前按钮就是创建按钮.</p>
-             */
-            const currentButton$ = ref<VarButton | null>(null);
-
-            /**
-             * <p>按钮的 click 事件是否被拦截.</p>
-             * <p>用户调用 kgVar.kgButton.onClick(listener) 监听了 click 事件, 并且回调函数返回了 true, 表示该 click 事件被用户拦截了.</p>
-             * <p>被拦截之后, 该按钮的默认逻辑不会执行(例如打开提交弹窗, 加载各种数据等等), 后续由用户自行处理.</p>
-             * <p>key 为按钮的变量名.</p>
-             */
-            const isClickInterceptedRecord$ = ref<Record<string, boolean>>({});
-
-            /**
-             * <p>当前按钮是否正在请求后端接口.</p>
-             * <p>比如点击了创建按钮, 打开了创建弹窗, 此时「当前按钮」指的就是创建按钮. 当点击弹窗中的保存按钮时, 表示正在请求后端接口.</p>
-             */
-            const isCurrentButtonRequesting$ = ref<boolean>(false);
-            //----------------------------------------------------------------------------------------------------
-            //endregion
-
-            //region GETTERS
-            //----------------------------------------------------------------------------------------------------
-            const getButtonDescription$$ = computed<(param: { varName: string | null | undefined }) => string>(() => {
-                return (param) => {
-                    const { varName } = param ?? {};
-
-                    const kg = useKg();
-                    const kgVar = useKgVar(fid);
-
-                    const button = kgVar.store.getVarButtonMap[fid]?.find((i) => i.var_nam === varName);
-
-                    let description = kgVar.t2(varName);
-
-                    if (description === varName) {
-                        switch (button?.typ) {
-                            case KG__VAR_BUTTON__TYPE.SEARCH:
-                                return kg.t('kg.search');
-
-                            case KG__VAR_BUTTON__TYPE.CREATE:
-                                return kg.t('kg.create');
-
-                            case KG__VAR_BUTTON__TYPE.UPDATE:
-                                return kg.t('kg.update');
-
-                            case KG__VAR_BUTTON__TYPE.COPY:
-                                return kg.t('kg.copy');
-
-                            case KG__VAR_BUTTON__TYPE.DELETE:
-                                return kg.t('kg.delete');
-
-                            case KG__VAR_BUTTON__TYPE.EXPORT:
-                                return kg.t('kg.export');
-
-                            case KG__VAR_BUTTON__TYPE.IMPORT:
-                                return kg.t('kg.import');
-
-                            case KG__VAR_BUTTON__TYPE.IMPORT_TEMPLATE:
-                                return kg.t('kg.import-template');
-                        }
-                    }
-
-                    return description;
-                };
-            });
-            const currentButton$$ = computed<VarButton | null>(() => currentButton$.value);
-            const isCurrentButtonClickIntercepted$$ = computed<boolean>(() => isClickInterceptedRecord$.value[currentButton$.value?.var_nam ?? ''] ?? false);
-            const isCopying$$ = computed<boolean>(() => currentButton$.value?.typ === KG__VAR_BUTTON__TYPE.COPY);
-            const isCreating$$ = computed<boolean>(() => currentButton$.value?.typ === KG__VAR_BUTTON__TYPE.CREATE);
-            const isDeleting$$ = computed<boolean>(() => currentButton$.value?.typ === KG__VAR_BUTTON__TYPE.DELETE);
-            const isUpdating$$ = computed<boolean>(() => currentButton$.value?.typ === KG__VAR_BUTTON__TYPE.UPDATE);
-            const isCurrentButtonRequesting$$ = computed<boolean>(() => {
-                // 「当前按钮」为空
-                if (!currentButton$.value) {
-                    return false;
-                }
-
-                return isCurrentButtonRequesting$.value ?? false;
-            });
-            //----------------------------------------------------------------------------------------------------
-            //endregion
-
-            //region ACTIONS
-            //----------------------------------------------------------------------------------------------------
-            function click(param: { type?: KG__VAR_BUTTON__TYPE; varName?: string }): void {
-                // N/A 其他地方通过 $onAction 来监听这个动作
-            }
-
-            function dispose(): void {
-                currentButton$.value = null;
-                isClickInterceptedRecord$.value = {};
-                isCurrentButtonRequesting$.value = false;
-            }
-
-            function setCurrentButton(param: { type?: KG__VAR_BUTTON__TYPE; varName?: string | null } | null): Promise<void> {
-                if (isNil(param)) {
-                    currentButton$.value = null;
-                    isCurrentButtonRequesting$.value = false;
-                    return Promise.resolve();
-                }
-
-                const { varName, type } = param;
-
-                const kgVar = useKgVar(fid);
-
-                return new Promise((resolve) => {
-                    // 等待变量配置数据请求完成
-                    const stopWatch = watch(
-                        () => kgVar.store.getIsRequestedMap[fid!],
-                        (isRequested) => {
-                            if (isRequested) {
-                                setTimeout(() => {
-                                    stopWatch();
-
-                                    if (type && [KG__VAR_BUTTON__TYPE.CREATE, KG__VAR_BUTTON__TYPE.UPDATE, KG__VAR_BUTTON__TYPE.COPY, KG__VAR_BUTTON__TYPE.DELETE].includes(type)) {
-                                        const button = kgVar.store.getVarButtonMap[fid!]?.find((i) => i.typ === type) ?? null;
-                                        if (!button) {
-                                            ____ERROR____(`${fid} | KgButton.store.setCurrentButton() | 找不到类型为「${type}」的按钮.`, { fid: fid, param: param });
-                                            return resolve();
-                                        }
-
-                                        currentButton$.value = button;
-                                        return resolve();
-                                    }
-
-                                    // 必须传参
-                                    if (varName === undefined && (type === KG__VAR_BUTTON__TYPE.IMPORT || type === KG__VAR_BUTTON__TYPE.IMPORT_TEMPLATE || type === KG__VAR_BUTTON__TYPE.EXPORT || type === KG__VAR_BUTTON__TYPE.OTHER)) {
-                                        ____ERROR____(`${fid} | KgButton.store.setCurrentButton() | 参数 param.varName 不能为空.`, { fid: fid, param: param });
-                                        return resolve();
-                                    }
-
-                                    // 必须传参
-                                    if (varName === undefined && type === undefined) {
-                                        ____ERROR____(`${fid} | KgButton.store.setCurrentButton() | 参数 param.type 为 undefined 时, 参数 param.varName 不能为空.`, { fid: fid, param: param });
-                                        return resolve();
-                                    }
-
-                                    const varButton = kgVar.store.getVarButtonMap[fid!]?.find((i) => i.var_nam === varName) ?? null;
-                                    if (!varButton) {
-                                        ____ERROR____(`${fid} | KgButton.store.setCurrentButton() | 找不到变量名为「${varName}」的按钮.`, { fid: fid, param: param });
-                                        return resolve();
-                                    }
-
-                                    currentButton$.value = varButton;
-                                    return resolve();
-                                });
-                            }
-                        },
-                        { immediate: true },
-                    );
-                });
-            }
-
-            function setIsClickIntercepted(param: { isIntercepted: boolean; type?: KG__VAR_BUTTON__TYPE; varName?: string | null }): void {
-                const { varName, type, isIntercepted } = param ?? {};
-
-                const kgVar = useKgVar(fid);
-
-                if (type && [KG__VAR_BUTTON__TYPE.SEARCH, KG__VAR_BUTTON__TYPE.CREATE, KG__VAR_BUTTON__TYPE.UPDATE, KG__VAR_BUTTON__TYPE.COPY, KG__VAR_BUTTON__TYPE.DELETE].includes(type)) {
-                    const button = kgVar.store.getVarButtons(fid).find((i) => i.typ === type);
-                    if (!button) {
-                        ____ERROR____(`${fid} | KgButton.store.setIsClickIntercepted() | 找不到类型为「${type}」的按钮.`, { fid: fid, param: param });
-                        return;
-                    }
-
-                    isClickInterceptedRecord$.value[button?.var_nam ?? ''] = isIntercepted;
-                    return;
-                }
-
-                // 必须传参
-                if (varName === undefined && (type === KG__VAR_BUTTON__TYPE.IMPORT || type === KG__VAR_BUTTON__TYPE.IMPORT_TEMPLATE || type === KG__VAR_BUTTON__TYPE.EXPORT || type === KG__VAR_BUTTON__TYPE.OTHER)) {
-                    ____ERROR____(`${fid} | KgButton.store.setIsClickIntercepted() | 参数 param.varName 不能为空.`, {
-                        fid: fid,
-                        param: param,
-                    });
-                    return;
-                }
-
-                // 必须传参
-                if (varName === undefined && type === undefined) {
-                    ____ERROR____(`${fid} | KgButton.store.setIsClickIntercepted() | 参数 param.type 为 undefined 时, 参数 param.varName 不能为空.`, {
-                        fid: fid,
-                        param: param,
-                    });
-                    return;
-                }
-
-                isClickInterceptedRecord$.value[varName ?? ''] = isIntercepted;
-            }
-
-            function setIsCurrentButtonRequesting(param: { isRequesting: boolean }): void {
-                const { isRequesting } = param ?? {};
-
-                isCurrentButtonRequesting$.value = isRequesting;
-            }
-            //----------------------------------------------------------------------------------------------------
-            //endregion
-
-            return {
-                click: click,
-                currentButton: currentButton$$,
-                currentButtonMap: currentButton$,
-                dispose: dispose,
-                getButtonDescription: getButtonDescription$$,
-                isClickInterceptedRecord$: isClickInterceptedRecord$,
-                isCopying: isCopying$$,
-                isCreating: isCreating$$,
-                isCurrentButtonClickIntercepted: isCurrentButtonClickIntercepted$$,
-                isCurrentButtonRequesting: isCurrentButtonRequesting$$,
-                isCurrentButtonRequesting$: isCurrentButtonRequesting$,
-                isDeleting: isDeleting$$,
-                isUpdating: isUpdating$$,
-                setCurrentButton: setCurrentButton,
-                setIsClickIntercepted: setIsClickIntercepted,
-                setIsCurrentButtonRequesting: setIsCurrentButtonRequesting,
-            };
-        }) as any;
-    }
-
-    return storeDefinitionRecord[fid];
-}