@kengic/vue 0.30.1-beta.96 → 0.31.1

package/component/KgImage/KgImage.tsx

@@ -1,73 +0,0 @@
-import { Icon } from '@iconify/vue';
-import { Image } from 'ant-design-vue';
-import { computed, defineComponent, ExtractPropTypes, unref } from 'vue';
-import './KgImage.less';
-import { useKg } from '../../config';
-import { imageProps } from '../../util/ant-design-vue';
-import { renderSlot, renderSlotList } from '../../util/tsx.helper';
-
-export const getProps = () => ({
-    ...imageProps(),
-});
-
-export type KgImageProps = Partial<ExtractPropTypes<ReturnType<typeof getProps>>>;
-
-// 图片
-export default defineComponent({
-    name: 'KgImage',
-    inheritAttrs: false,
-    props: getProps(),
-    setup(props, { attrs, slots }) {
-        const kg = useKg();
-
-        //region DATA
-        //----------------------------------------------------------------------------------------------------
-        const props$$ = computed(() => {
-            const _props = { ...unref(attrs), ...props } as KgImageProps;
-
-            _props.id = attrs.id as any;
-
-            _props.wrapperClassName = _props.wrapperClassName ? `${_props.wrapperClassName} kg-image` : 'kg-image';
-
-            _props.width = _props.width !== undefined ? _props.width : 100;
-            _props.height = _props.height !== undefined ? _props.height : 100;
-
-            // 完整的图片地址, 不包含域名和端口,
-            _props.src = `${kg.publicPath}/sys/common/static/${props.src ?? ''}`;
-
-            _props.onClick = (event) => {
-                event.preventDefault();
-                event.stopPropagation();
-            };
-
-            _props.fallback =
-                _props.fallback !== undefined
-                    ? _props.fallback
-                    : 'data:image/png;base64,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';
-
-            return _props;
-        });
-        //endregion
-
-        return () => (
-            <Image {...props$$.value}>
-                {{
-                    ...renderSlotList({ slotRecord: slots, excludeSlotList: ['previewMask'] }),
-                    previewMask: () => {
-                        if (slots['previewMask']) {
-                            return renderSlot({ slotRecord: slots, name: 'previewMask' });
-                        }
-
-                        return (
-                            <Icon
-                                icon={'ant-design:eye-outlined'}
-                                width={18}
-                                height={18}
-                            />
-                        );
-                    },
-                }}
-            </Image>
-        );
-    },
-});

package/component/KgLayoutHeader/KgLayoutHeader.Locale.tsx

@@ -1,118 +0,0 @@
-import { Dropdown, Menu } from 'ant-design-vue';
-import { computed, defineComponent, ExtractPropTypes, ref, unref, watchEffect } from 'vue';
-import './KgLayoutHeader.less';
-import cs_CZ from '../../asset/flag/cs_CZ.png';
-import en from '../../asset/flag/en.png';
-import es_ES from '../../asset/flag/es_ES.png';
-import fr_FR from '../../asset/flag/fr_FR.png';
-import km_KH from '../../asset/flag/km_KH.png';
-import ko_KR from '../../asset/flag/ko_KR.png';
-import vi_VN from '../../asset/flag/vi_VN.png';
-import zh_CN from '../../asset/flag/zh_CN.png';
-import { localeList } from '../../i18n';
-import { DropMenu, LocaleType, useLocale } from '../../project';
-
-export const getProps = () => ({
-    /**
-     * 是否显示语言文本.
-     *
-     * @default false.
-     */
-    showText: { type: Boolean, default: true },
-});
-
-export type KgLayoutHeaderLocaleProps = Partial<ExtractPropTypes<ReturnType<typeof getProps>>>;
-
-export default defineComponent({
-    name: 'KgLayoutHeaderLocale',
-    props: getProps(),
-    setup(props) {
-        //region DATA
-        //----------------------------------------------------------------------------------------------------
-        const selectedKeys = ref<string[]>([]);
-
-        /**
-         * 所有国旗.
-         */
-        const getFlags = computed<Record<string, string>>(() => ({
-            cs_CZ: cs_CZ,
-            en: en,
-            es_ES: es_ES,
-            fr_FR: fr_FR,
-            km_KH: km_KH,
-            ko_KR: ko_KR,
-            vi_VN: vi_VN,
-            zh_CN: zh_CN,
-        }));
-        //----------------------------------------------------------------------------------------------------
-        //endregion
-
-        const { changeLocale, getLocale } = useLocale();
-
-        //region FUNCTION
-        //----------------------------------------------------------------------------------------------------
-        async function toggleLocale(lang: LocaleType | string) {
-            await changeLocale(lang as LocaleType);
-            selectedKeys.value = [lang as string];
-            window.location.reload();
-        }
-
-        function handleMenuEvent(menu: DropMenu) {
-            if (unref(getLocale) === menu.event) {
-                return;
-            }
-
-            toggleLocale(menu.event as string);
-        }
-        //----------------------------------------------------------------------------------------------------
-        //endregion
-
-        //region WATCH
-        //----------------------------------------------------------------------------------------------------
-        watchEffect(() => {
-            selectedKeys.value = [unref(getLocale)];
-        });
-        //----------------------------------------------------------------------------------------------------
-        //endregion
-
-        return () => (
-            <Dropdown
-                placement="bottomRight"
-                trigger="click"
-                overlayClassName="app-locale-picker-overlay"
-            >
-                {{
-                    default: () => (
-                        <span class="cursor-pointer flex items-center kg-layout-header--item--locale">
-                            <img
-                                src={getFlags.value[selectedKeys.value[0]]}
-                                alt={selectedKeys.value[0]}
-                                style="width: 30px; height: 20px; border-radius: 3px; margin: 6px 6px"
-                            />
-                        </span>
-                    ),
-                    overlay: () => (
-                        <Menu
-                            class="jeecg-basic-dropdown-menu"
-                            selectedKeys={selectedKeys.value}
-                        >
-                            {localeList.map((item) => (
-                                <Menu.Item
-                                    key={item.event}
-                                    onClick={() => handleMenuEvent(item)}
-                                >
-                                    <img
-                                        src={getFlags.value[item.event]}
-                                        alt=""
-                                        style="width: 27px; height: 18px; border-radius: 3px; margin: 0px 8px 0 0"
-                                    />
-                                    <span>{item.text}</span>
-                                </Menu.Item>
-                            ))}
-                        </Menu>
-                    ),
-                }}
-            </Dropdown>
-        );
-    },
-});

package/component/KgLayoutHeader/KgLayoutHeader.hooks.ts

@@ -1,31 +0,0 @@
-import { onBeforeUnmount, onMounted } from 'vue';
-
-/**
- * 监控页面顶部导航栏的尺寸.
- */
-export function useKgLayoutHeaderResizeObserver() {
-    let resizeObserver: ResizeObserver | null = null;
-
-    onMounted(() => {
-        const layoutHeaderCenterEl = document.querySelector('div.jeecg-layout-header-center');
-        if (layoutHeaderCenterEl) {
-            resizeObserver = new ResizeObserver((entries) => {
-                const left = layoutHeaderCenterEl.getBoundingClientRect().left;
-                const width = entries[0].borderBoxSize[0]?.inlineSize ?? 0;
-
-                const kgLayoutHeaderTeleportEl: HTMLDivElement | null = document.querySelector('#kg-layout-header-teleport');
-                if (kgLayoutHeaderTeleportEl) {
-                    kgLayoutHeaderTeleportEl.style.left = `${left}px`;
-                    kgLayoutHeaderTeleportEl.style.width = `${width}px`;
-                }
-            });
-            resizeObserver.observe(layoutHeaderCenterEl);
-        }
-    });
-
-    onBeforeUnmount(() => {
-        resizeObserver?.disconnect();
-    });
-
-    return {};
-}

package/component/KgLayoutHeader/KgLayoutHeader.less

@@ -1,14 +0,0 @@
-.app-locale-picker-overlay {
-    .ant-dropdown-menu-item {
-        min-width: 160px;
-
-        .ant-dropdown-menu-title-content {
-            display: flex;
-            align-items: center;
-        }
-    }
-}
-
-.kg-layout-header--item--locale.jeecg-layout-header-action__item {
-    border-right: 1px dashed #f0f0f0;
-}

package/component/KgLayoutHeader/index.ts

@@ -1,3 +0,0 @@
-export { default as KgLayoutHeaderLocale, type KgLayoutHeaderLocaleProps } from './KgLayoutHeader.Locale';
-
-export * from './KgLayoutHeader.hooks';

package/component/KgModal/KgModal.css

@@ -1,234 +0,0 @@
-.kg-modal {
-    overflow: hidden !important;
-}
-
-.kg-modal .ant-modal {
-    top: 0px;
-    max-width: 100% !important;
-    max-height: 100% !important;
-}
-
-.kg-modal .ant-modal .ant-modal-content {
-    height: 100%;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body {
-    overflow: auto;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .ant-row {
-    margin-left: 0 !important;
-    margin-right: 0 !important;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .ant-row > .ant-col:first-child {
-    padding-left: 0 !important;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .ant-row > .ant-col:last-child {
-    padding-right: 0 !important;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .resize-handle {
-    position: absolute;
-    background: transparent;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .resize-handle.resize-handle-top-left {
-    top: -8px;
-    left: -8px;
-    width: 8px;
-    height: 8px;
-    cursor: nwse-resize;
-    background: transparent;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .resize-handle.resize-handle-top {
-    top: -8px;
-    width: 100%;
-    height: 8px;
-    cursor: ns-resize;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .resize-handle.resize-handle-top-right {
-    top: -8px;
-    right: -8px;
-    width: 8px;
-    height: 8px;
-    cursor: nesw-resize;
-    background: transparent;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .resize-handle.resize-handle-right {
-    top: 0;
-    right: -8px;
-    width: 8px;
-    height: 100%;
-    cursor: ew-resize;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .resize-handle.resize-handle-bottom-right {
-    bottom: -8px;
-    right: -8px;
-    width: 8px;
-    height: 8px;
-    cursor: nwse-resize;
-    background: transparent;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .resize-handle.resize-handle-bottom {
-    bottom: -8px;
-    width: 100%;
-    height: 8px;
-    cursor: ns-resize;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .resize-handle.resize-handle-bottom-left {
-    bottom: -8px;
-    left: -8px;
-    width: 8px;
-    height: 8px;
-    cursor: nesw-resize;
-    background: transparent;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body > .resize-handle.resize-handle-left {
-    top: 0;
-    left: -8px;
-    width: 8px;
-    height: 100%;
-    cursor: ew-resize;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-close .ant-modal-close-x {
-    width: auto;
-    overflow: hidden;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-close .ant-modal-close-x .kg-modal--header--buttons--fullscreen {
-    width: 45px;
-    height: 45px;
-    margin-top: 1px;
-    margin-right: 1px;
-    border: none;
-    border-radius: 2px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    background: transparent;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-close .ant-modal-close-x .kg-modal--header--buttons--fullscreen:hover,
-.kg-modal .ant-modal .ant-modal-content .ant-modal-close .ant-modal-close-x .kg-modal--header--buttons--fullscreen:focus {
-    background: #f0f0f0 !important;
-    color: rgba(0, 0, 0, 0.85) !important;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-close .ant-modal-close-x > span {
-    width: 45px !important;
-    height: 45px !important;
-    line-height: 45px !important;
-    margin-top: 1px;
-    margin-right: 1px;
-    border-radius: 2px 5px 2px 2px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-close .ant-modal-close-x > span:hover {
-    background: #e81123 !important;
-    color: #fff !important;
-}
-
-/* 高度撑满屏幕 */
-.kg-modal.kg-modal--full-height .ant-modal {
-    height: calc(100% - 24px);
-}
-
-/* 全屏 */
-.kg-modal.kg-modal--fullscreen {
-    overflow: hidden;
-}
-
-.kg-modal.kg-modal--fullscreen .ant-modal {
-    top: 0 !important;
-    right: 0 !important;
-    bottom: 0 !important;
-    left: 0 !important;
-    width: 100% !important;
-    height: 100% !important;
-    max-width: 100% !important;
-    max-height: 100% !important;
-}
-
-.kg-modal.kg-modal--fullscreen .ant-modal .ant-modal-content {
-    height: 100%;
-    box-shadow: none !important;
-}
-
-.kg-modal.kg-modal--fullscreen .ant-modal .ant-modal-content > .ant-modal-header {
-    cursor: default !important;
-}
-
-.kg-modal.kg-modal--fullscreen .ant-modal .ant-modal-content > .ant-modal-body > .resize-handle {
-    cursor: default !important;
-}
-
-/* 有标签页 */
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body:has(.ant-tabs) {
-    padding: 0;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body:has(.ant-tabs):not(:has(+ .ant-modal-footer)) > .kg-var > .ant-spin-nested-loading > .ant-spin-container {
-    border-radius: 0 0 6px 6px !important;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body:has(.ant-tabs) > .ant-tabs {
-    height: 100%;
-    overflow: visible;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body:has(.ant-tabs) > .ant-tabs > .ant-tabs-nav {
-    position: absolute;
-    margin-bottom: 0px;
-    background: #fff;
-    width: fit-content;
-    height: 48px;
-    margin-top: -48px;
-    border-top-left-radius: 6px;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body:has(.ant-tabs) > .ant-tabs > .ant-tabs-nav .ant-tabs-nav-wrap {
-    margin-bottom: 0px;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body:has(.ant-tabs) > .ant-tabs > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab {
-    margin: 0 0 0 0px;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body:has(.ant-tabs) > .ant-tabs > .ant-tabs-nav .ant-tabs-tab {
-    padding: 8px 14px;
-    font-size: 16px;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body:has(.ant-tabs) > .ant-tabs > .ant-tabs-nav .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
-    text-shadow: none;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body:has(.ant-tabs) > .ant-tabs .ant-tabs-content {
-    height: 100%;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body:has(.ant-tabs):not(:has(+ .ant-modal-footer)) > .ant-tabs {
-    border-radius: 6px;
-}
-
-.kg-modal .ant-modal .ant-modal-content .ant-modal-body:has(.ant-tabs):not(:has(+ .ant-modal-footer)) > .ant-tabs .ant-tabs-tabpane .kg-var > .ant-spin-nested-loading > .ant-spin-container {
-    border-radius: 6px;
-}
-
-/* 正在拖拽 */
-body.kg-modal-dragging * {
-    user-select: none !important;
-}

package/component/KgModal/KgModal.model.ts

@@ -1,9 +0,0 @@
-/**
- * 弹窗边框宽度.
- */
-export const KG_MODAL_BORDER_WIDTH = 1;
-
-/**
- * 弹窗滚动条的宽度。
- */
-export const KG_MODAL_SCROLL_WIDTH = 17;