From 94b93ea7e7f83c678b1413fc9fc8642e69213647 Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期二, 18 六月 2024 14:49:57 +0800
Subject: [PATCH] 版本更新
---
src/layouts/default/menu/index.vue | 378 ++++++++++++++++++++++++++++-------------------------
1 files changed, 201 insertions(+), 177 deletions(-)
diff --git a/src/layouts/default/menu/index.vue b/src/layouts/default/menu/index.vue
index cd1e773..bd9982c 100644
--- a/src/layouts/default/menu/index.vue
+++ b/src/layouts/default/menu/index.vue
@@ -1,202 +1,226 @@
<script lang="tsx">
- import type { PropType, CSSProperties } from 'vue';
+import type { PropType, CSSProperties } from 'vue';
- import { computed, defineComponent, unref, toRef } from 'vue';
- import { BasicMenu } from '/@/components/Menu';
- import { SimpleMenu } from '/@/components/SimpleMenu';
- import { AppLogo } from '/@/components/Application';
+import { computed, defineComponent, unref, toRef } from 'vue';
+import { BasicMenu } from '/@/components/Menu';
+import { SimpleMenu } from '/@/components/SimpleMenu';
+import { AppLogo } from '/@/components/Application';
- import { MenuModeEnum, MenuSplitTyeEnum } from '/@/enums/menuEnum';
+import { MenuModeEnum, MenuSplitTyeEnum } from '/@/enums/menuEnum';
- import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
- import { ScrollContainer } from '/@/components/Container';
+import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
+import { ScrollContainer } from '/@/components/Container';
- import { useGo } from '/@/hooks/web/usePage';
- import { useSplitMenu } from './useLayoutMenu';
- import { openWindow } from '/@/utils';
- import { propTypes } from '/@/utils/propTypes';
- import { isUrl } from '/@/utils/is';
- import { useRootSetting } from '/@/hooks/setting/useRootSetting';
- import { useAppInject } from '/@/hooks/web/useAppInject';
- import { useDesign } from '/@/hooks/web/useDesign';
+import { useGo } from '/@/hooks/web/usePage';
+import { useSplitMenu } from './useLayoutMenu';
+import { openWindow } from '/@/utils';
+import { propTypes } from '/@/utils/propTypes';
+import { isNullOrUnDef, isUrl } from '/@/utils/is';
+import { useRootSetting } from '/@/hooks/setting/useRootSetting';
+import { useAppInject } from '/@/hooks/web/useAppInject';
+import { useDesign } from '/@/hooks/web/useDesign';
+import { getEntity } from '/@/api/tigerapi/system';
- export default defineComponent({
- name: 'LayoutMenu',
- props: {
- theme: propTypes.oneOf(['light', 'dark']),
+export default defineComponent({
+ name: 'LayoutMenu',
+ props: {
+ theme: propTypes.oneOf(['light', 'dark']),
- splitType: {
- type: Number as PropType<MenuSplitTyeEnum>,
- default: MenuSplitTyeEnum.NONE,
- },
-
- isHorizontal: propTypes.bool,
- // menu Mode
- menuMode: {
- type: [String] as PropType<MenuModeEnum | null>,
- default: '',
- },
+ splitType: {
+ type: Number as PropType<MenuSplitTyeEnum>,
+ default: MenuSplitTyeEnum.NONE,
},
- setup(props) {
- const go = useGo();
- const {
- getMenuMode,
- getMenuType,
- getMenuTheme,
- getCollapsed,
- getCollapsedShowTitle,
- getAccordion,
- getIsHorizontal,
- getIsSidebarType,
- getSplit,
- } = useMenuSetting();
- const { getShowLogo } = useRootSetting();
+ isHorizontal: propTypes.bool,
+ // menu Mode
+ menuMode: {
+ type: [String] as PropType<MenuModeEnum | null>,
+ default: '',
+ },
+ },
+ setup(props) {
+ const go = useGo();
- const { prefixCls } = useDesign('layout-menu');
+ const {
+ getMenuMode,
+ getMenuType,
+ getMenuTheme,
+ getCollapsed,
+ getCollapsedShowTitle,
+ getAccordion,
+ getIsHorizontal,
+ getIsSidebarType,
+ getSplit,
+ } = useMenuSetting();
+ const { getShowLogo } = useRootSetting();
- const { menusRef } = useSplitMenu(toRef(props, 'splitType'));
+ const { prefixCls } = useDesign('layout-menu');
- const { getIsMobile } = useAppInject();
+ const { menusRef } = useSplitMenu(toRef(props, 'splitType'));
- const getComputedMenuMode = computed(() =>
- unref(getIsMobile) ? MenuModeEnum.INLINE : props.menuMode || unref(getMenuMode),
+ const { getIsMobile } = useAppInject();
+
+ const getComputedMenuMode = computed(() =>
+ unref(getIsMobile) ? MenuModeEnum.INLINE : props.menuMode || unref(getMenuMode),
+ );
+
+ const getComputedMenuTheme = computed(() => props.theme || unref(getMenuTheme));
+
+ const getIsShowLogo = computed(() => unref(getShowLogo) && unref(getIsSidebarType));
+
+ const getUseScroll = computed(() => {
+ return (
+ !unref(getIsHorizontal) &&
+ (unref(getIsSidebarType) ||
+ props.splitType === MenuSplitTyeEnum.LEFT ||
+ props.splitType === MenuSplitTyeEnum.NONE)
);
+ });
- const getComputedMenuTheme = computed(() => props.theme || unref(getMenuTheme));
-
- const getIsShowLogo = computed(() => unref(getShowLogo) && unref(getIsSidebarType));
-
- const getUseScroll = computed(() => {
- return (
- !unref(getIsHorizontal) &&
- (unref(getIsSidebarType) ||
- props.splitType === MenuSplitTyeEnum.LEFT ||
- props.splitType === MenuSplitTyeEnum.NONE)
- );
- });
-
- const getWrapperStyle = computed((): CSSProperties => {
- return {
- height: `calc(100% - ${unref(getIsShowLogo) ? '48px' : '0px'})`,
- };
- });
-
- const getLogoClass = computed(() => {
- return [
- `${prefixCls}-logo`,
- unref(getComputedMenuTheme),
- {
- [`${prefixCls}--mobile`]: unref(getIsMobile),
- },
- ];
- });
-
- const getCommonProps = computed(() => {
- const menus = unref(menusRef);
- return {
- menus,
- beforeClickFn: beforeMenuClickFn,
- items: menus,
- theme: unref(getComputedMenuTheme),
- accordion: unref(getAccordion),
- collapse: unref(getCollapsed),
- collapsedShowTitle: unref(getCollapsedShowTitle),
- onMenuClick: handleMenuClick,
- };
- });
- /**
- * click menu
- * @param menu
- */
-
- function handleMenuClick(path: string) {
- if (path.split('/').length > 1 && path.split('/')[2] == 'LC') {
- const id = { ID: path.split('/')[1] };
- go(`/${path.split('/')[1]}/${path.split('/')[2]}/${encodeURI(JSON.stringify(id))}`);
- } else {
- go(path);
- }
- }
-
- /**
- * before click menu
- * @param menu
- */
- async function beforeMenuClickFn(path: string) {
- if (!isUrl(path)) {
- return true;
- }
- openWindow(path);
- return false;
- }
-
- function renderHeader() {
- if (!unref(getIsShowLogo) && !unref(getIsMobile)) return null;
-
- return (
- <AppLogo
- showTitle={!unref(getCollapsed)}
- class={unref(getLogoClass)}
- theme={unref(getComputedMenuTheme)}
- />
- );
- }
-
- function renderMenu() {
- const { menus, ...menuProps } = unref(getCommonProps);
- // console.log(menus);
- if (!menus || !menus.length) return null;
- return !props.isHorizontal ? (
- <SimpleMenu {...menuProps} isSplitMenu={unref(getSplit)} items={menus} />
- ) : (
- <BasicMenu
- {...(menuProps as any)}
- isHorizontal={props.isHorizontal}
- type={unref(getMenuType)}
- showLogo={unref(getIsShowLogo)}
- mode={unref(getComputedMenuMode as any)}
- items={menus}
- />
- );
- }
-
- return () => {
- return (
- <>
- {renderHeader()}
- {unref(getUseScroll) ? (
- <ScrollContainer style={unref(getWrapperStyle)}>{() => renderMenu()}</ScrollContainer>
- ) : (
- renderMenu()
- )}
- </>
- );
+ const getWrapperStyle = computed((): CSSProperties => {
+ return {
+ height: `calc(100% - ${unref(getIsShowLogo) ? '48px' : '0px'})`,
};
- },
- });
-</script>
-<style lang="less">
- @prefix-cls: ~'@{namespace}-layout-menu';
- @logo-prefix-cls: ~'@{namespace}-app-logo';
+ });
- .@{prefix-cls} {
- &-logo {
- height: @header-height;
- padding: 10px 4px 10px 10px;
+ const getLogoClass = computed(() => {
+ return [
+ `${prefixCls}-logo`,
+ unref(getComputedMenuTheme),
+ {
+ [`${prefixCls}--mobile`]: unref(getIsMobile),
+ },
+ ];
+ });
- img {
- width: 150px; //@logo-width;
- height: @logo-width;
+ const getCommonProps = computed(() => {
+ const menus = unref(menusRef);
+ return {
+ menus,
+ beforeClickFn: beforeMenuClickFn,
+ items: menus,
+ theme: unref(getComputedMenuTheme),
+ accordion: unref(getAccordion),
+ collapse: unref(getCollapsed),
+ collapsedShowTitle: unref(getCollapsedShowTitle),
+ onMenuClick: handleMenuClick,
+ };
+ });
+ /**
+ * click menu
+ * @param menu
+ */
+
+ function handleMenuClick(path: string) {
+ if (path.split('/').length > 2 && path.split('/')[2] == 'LC') {
+ getEntity({
+ sqlcmd: `ASSEMBLY_NAME ='${path.split('/')[1]}'`,
+ entityName: 'SYS_LOW_CODE',
+ }).then((data) => {
+ var searchForms = JSON.parse(data.Data.Items[0].SEARCH_FORM_JSON);
+ let colSlots = [] as string[];
+ for (const i in searchForms) {
+ if (!isNullOrUnDef(searchForms[i]['colSlot'])) {
+ colSlots.push('form-' + searchForms[i]['colSlot']);
+ }
+ }
+
+ var _cruds = JSON.parse(data.Data.Items[0].FORM_JSON);
+ let crudColSlots = [] as string[];
+ for (const i in _cruds) {
+ if (!isNullOrUnDef(_cruds[i]['colSlot'])) {
+ crudColSlots.push(_cruds[i]['colSlot']);
+ }
+ }
+ const id = { ID: path.split('/')[1], colSlots: colSlots, crudColSlots: crudColSlots };
+ go(`/${path.split('/')[1]}/${path.split('/')[2]}/${encodeURI(JSON.stringify(id))}`);
+ });
+ } else if (path.split('/').length > 2 && path.split('/')[2] == 'High') {
+ const id = { Name: path.split('/')[1] };
+ go(`/${path.split('/')[1]}/${path.split('/')[2]}/${encodeURI(JSON.stringify(id))}`);
+ } else {
+ go(path);
}
}
- &--mobile {
- .@{logo-prefix-cls} {
- &__title {
- opacity: 1;
- }
+ /**
+ * before click menu
+ * @param menu
+ */
+ async function beforeMenuClickFn(path: string) {
+ if (!isUrl(path)) {
+ return true;
+ }
+ openWindow(path);
+ return false;
+ }
+
+ function renderHeader() {
+ if (!unref(getIsShowLogo) && !unref(getIsMobile)) return null;
+
+ return (
+ <AppLogo
+ showTitle={!unref(getCollapsed)}
+ class={unref(getLogoClass)}
+ theme={unref(getComputedMenuTheme)}
+ />
+ );
+ }
+
+ function renderMenu() {
+ const { menus, ...menuProps } = unref(getCommonProps);
+ // console.log(menus);
+ if (!menus || !menus.length) return null;
+ return !props.isHorizontal ? (
+ <SimpleMenu {...menuProps} isSplitMenu={unref(getSplit)} items={menus} />
+ ) : (
+ <BasicMenu
+ {...(menuProps as any)}
+ isHorizontal={props.isHorizontal}
+ type={unref(getMenuType)}
+ showLogo={unref(getIsShowLogo)}
+ mode={unref(getComputedMenuMode as any)}
+ items={menus}
+ />
+ );
+ }
+
+ return () => {
+ return (
+ <>
+ {renderHeader()}
+ {unref(getUseScroll) ? (
+ <ScrollContainer style={unref(getWrapperStyle)}>{() => renderMenu()}</ScrollContainer>
+ ) : (
+ renderMenu()
+ )}
+ </>
+ );
+ };
+ },
+});
+</script>
+<style lang="less">
+@prefix-cls: ~'@{namespace}-layout-menu';
+@logo-prefix-cls: ~'@{namespace}-app-logo';
+
+.@{prefix-cls} {
+ &-logo {
+ height: @header-height;
+ padding: 10px 4px 10px 10px;
+
+ img {
+ width: 150px; //@logo-width;
+ height: @logo-width;
+ }
+ }
+
+ &--mobile {
+ .@{logo-prefix-cls} {
+ &__title {
+ opacity: 1;
}
}
}
+}
</style>
--
Gitblit v1.9.3