@oinone/kunlun-vue-admin-layout 6.2.0

package/src/tags/resolve/internal/typing.ts

@@ -0,0 +1,6 @@
+import { CreateMaskWidgetProps } from '../typing';
+
+export interface DslDefinitionTypeProps extends CreateMaskWidgetProps {
+  dslNodeType?: string;
+  widget?: string;
+}

package/src/tags/resolve/internal/widget-resolve.ts

@@ -0,0 +1,57 @@
+import { Constructor } from '@oinone/kunlun-shared';
+import { getWidgetNotNull, RenderWidget, ViewWidget, VueWidget } from '@oinone/kunlun-vue-widget';
+import { BaseMaskOptions, BaseMaskWidget, BaseMaskWidgetProps } from '../../../basic';
+import { InternalMaskWidget } from '../typing';
+import { DslDefinitionTypeProps } from './typing';
+
+function createNormalItem(
+  widgets: VueWidget[],
+  parentHandle: string,
+  props: BaseMaskWidgetProps,
+  consumer: (parentWidget: VueWidget) => VueWidget
+) {
+  const parentWidget = getWidgetNotNull(parentHandle);
+  const currentWidget = consumer(parentWidget);
+  widgets.push(currentWidget);
+  return currentWidget;
+}
+
+export function createMaskWidgetByDslNodeType(props: DslDefinitionTypeProps): RenderWidget | undefined {
+  const { parentHandle, dslNodeType, widget } = props;
+  let options: BaseMaskOptions;
+  if (dslNodeType === InternalMaskWidget.Widget) {
+    options = { dslNodeType };
+  } else {
+    options = { dslNodeType, widget };
+  }
+  let usingViewWidget = false;
+  let constructor: Constructor<BaseMaskWidget> | Constructor<ViewWidget> | undefined = BaseMaskWidget.Selector(options);
+  if (!constructor) {
+    constructor = ViewWidget.Selector({
+      tagName: dslNodeType,
+      widget
+    });
+    if (constructor) {
+      usingViewWidget = true;
+    } else {
+      return undefined;
+    }
+  }
+  let widgetRef: VueWidget | undefined;
+  const widgets: VueWidget[] = [];
+  const widgetInstance = createNormalItem(widgets, parentHandle, props, (parentWidget) => {
+    if (usingViewWidget) {
+      widgetRef = parentWidget.createWidget(constructor as Constructor<ViewWidget>, undefined, {
+        dslNode: props
+      });
+    } else {
+      widgetRef = parentWidget.createWidget(constructor as Constructor<BaseMaskWidget>, undefined, props);
+    }
+    return widgetRef;
+  });
+  return {
+    handle: widgetInstance.getHandle(),
+    widget: widgetRef!,
+    widgets
+  };
+}

package/src/tags/resolve/typing.ts

@@ -0,0 +1,39 @@
+import { DslDefinition } from '@oinone/kunlun-dsl';
+import { BaseMaskWidgetProps } from '../../basic';
+
+export interface CreateMaskWidgetProps extends BaseMaskWidgetProps {
+  automatic?: boolean;
+  template?: DslDefinition;
+  parentHandle: string;
+  slotName?: string;
+  slotContext?: Record<string, unknown>;
+}
+
+export enum InternalMaskWidget {
+  /**
+   * 根标签
+   */
+  Mask = 'mask',
+
+  /**
+   * 通用组件
+   */
+  Widget = 'widget',
+
+  // region 布局组件
+
+  Header = 'header',
+  Container = 'container',
+  Content = 'content',
+  Block = 'block',
+
+  // endregion
+
+  // region 功能性组件
+
+  Sidebar = 'sidebar',
+  Breadcrumb = 'breadcrumb',
+  MultiTabs = 'multi-tabs'
+
+  // endregion
+}

package/src/tags/resolve/widget-resolve.ts

@@ -0,0 +1,64 @@
+import { CastHelper } from '@oinone/kunlun-shared';
+import { RenderWidget } from '@oinone/kunlun-vue-widget';
+import { unref } from 'vue';
+import { BaseMaskWidgetProps } from '../../basic';
+import { defaultMaskContext } from '../context';
+import { createMaskWidgetByDslNodeType } from './internal';
+import { InternalMaskWidget } from './typing';
+
+export type CreateMaskWidgetFunction<T extends BaseMaskWidgetProps = BaseMaskWidgetProps> = (
+  props: T
+) => RenderWidget | undefined;
+
+export function createMaskWidget(tag: string, props: BaseMaskWidgetProps): RenderWidget | undefined {
+  const fn = createMaskWidgetFunctionMap.get(tag);
+  if (!fn) {
+    console.error(`Invalid mask tag. value = ${tag}`);
+    return undefined;
+  }
+  Object.keys(defaultMaskContext).forEach((key) => {
+    const value = props[key];
+    if (key in props) {
+      props[key] = unref(value);
+    }
+  });
+  if (props.automatic == null) {
+    props.automatic = true;
+  }
+  return fn(props);
+}
+
+const createMaskWidgetFunctionMap = new Map<string, CreateMaskWidgetFunction>();
+
+export function registerMaskWidgetFunction<T extends BaseMaskWidgetProps = BaseMaskWidgetProps>(
+  tag: string,
+  fn?: CreateMaskWidgetFunction<T>
+): boolean {
+  const isInternal = Object.values(InternalMaskWidget).findIndex((v) => v === tag) !== -1;
+  if (isInternal) {
+    console.warn(`The widget name is internal widget. value = ${tag}`);
+    return false;
+  }
+  createMaskWidgetFunctionMap.set(tag, CastHelper.cast(fn || createMaskWidgetByDslNodeType));
+  return true;
+}
+
+function registerInternalWidgetFunction<T extends BaseMaskWidgetProps = BaseMaskWidgetProps>(
+  widget: string,
+  fn: CreateMaskWidgetFunction<T>
+) {
+  createMaskWidgetFunctionMap.set(widget, CastHelper.cast(fn));
+}
+
+registerInternalWidgetFunction(InternalMaskWidget.Mask, createMaskWidgetByDslNodeType);
+
+registerInternalWidgetFunction(InternalMaskWidget.Widget, createMaskWidgetByDslNodeType);
+
+registerInternalWidgetFunction(InternalMaskWidget.Header, createMaskWidgetByDslNodeType);
+registerInternalWidgetFunction(InternalMaskWidget.Container, createMaskWidgetByDslNodeType);
+registerInternalWidgetFunction(InternalMaskWidget.Content, createMaskWidgetByDslNodeType);
+registerInternalWidgetFunction(InternalMaskWidget.Block, createMaskWidgetByDslNodeType);
+
+registerInternalWidgetFunction(InternalMaskWidget.Sidebar, createMaskWidgetByDslNodeType);
+registerInternalWidgetFunction(InternalMaskWidget.Breadcrumb, createMaskWidgetByDslNodeType);
+registerInternalWidgetFunction(InternalMaskWidget.MultiTabs, createMaskWidgetByDslNodeType);

package/src/template/default-mask.ts

@@ -0,0 +1,51 @@
+export const DefaultMask = `<mask>
+    <multi-tabs />
+    <header>
+        <widget widget="app-switcher" />
+        <block>
+            <widget widget="notification" />
+            <widget widget="divider" />
+            <widget widget="language" />
+            <widget widget="divider" />
+            <widget widget="user" />
+        </block>
+    </header>
+    <container>
+        <sidebar>
+            <widget widget="nav-menu" height="100%" />
+        </sidebar>
+        <content>
+            <breadcrumb />
+            <block width="100%">
+                <widget width="100%" widget="main-view" />
+            </block>
+        </content>
+    </container>
+</mask>`;
+
+export const InlineMultiTabsMaskXML = `<mask>
+    <header>
+        <widget widget="app-switcher" />
+        <block>
+            <widget widget="notification" />
+            <widget widget="divider" />
+            <widget widget="language" />
+            <widget widget="divider" />
+            <widget widget="user" />
+        </block>
+    </header>
+    <container>
+        <sidebar>
+            <widget widget="nav-menu" height="100%" />
+        </sidebar>
+        <block height="100%" flex="1 0 0" flexDirection="column" alignContent="flex-start" flexWrap="nowrap" overflow="hidden">
+            <multi-tabs inline="true" />
+            <content>
+                <breadcrumb />
+                <block width="100%">
+                    <widget width="100%" widget="main-view" />
+                </block>
+            </content>
+        </block>
+    </container>
+</mask>`;

package/src/template/index.ts

@@ -0,0 +1,26 @@
+import { DslDefinition, XMLParse } from '@oinone/kunlun-dsl';
+import { MultiTabsRuntimeManifestMergedConfigManager } from '@oinone/kunlun-engine';
+import { SPI } from '@oinone/kunlun-spi';
+import { debugConsole } from '@oinone/kunlun-shared';
+import { MaskEditorContext, MaskEditorToken } from '../spi';
+import { InlineMultiTabsMaskXML, DefaultMask } from './default-mask';
+
+export function getDefaultMaskTemplate(): DslDefinition {
+  let maskTemplate = DefaultMask;
+
+  if (MultiTabsRuntimeManifestMergedConfigManager.isInline()) {
+    maskTemplate = InlineMultiTabsMaskXML;
+  }
+  debugConsole.log('使用默认mask', maskTemplate);
+  return maskTemplateEdit({ isDefault: true }, XMLParse.INSTANCE.parse(maskTemplate));
+}
+
+export function maskTemplateEdit(context: MaskEditorContext, dsl: DslDefinition): DslDefinition {
+  const editors = SPI.RawInstantiates(MaskEditorToken);
+  for (const editor of editors) {
+    dsl = editor.edit(context, dsl);
+  }
+  return dsl;
+}
+
+export { InlineMultiTabsMaskXML, DefaultMask };

package/src/theme/index.ts

@@ -0,0 +1 @@
+export const DEFAULT_PREFIX = 'oio';

package/src/typing/constant.ts

@@ -0,0 +1,3 @@
+import { genStaticPath } from '@oinone/kunlun-engine';
+
+export const DEFAULT_APPLICATION_LOGO = () => genStaticPath('default.png');

package/src/typing/index.ts

@@ -0,0 +1,3 @@
+export * from './constant';
+export * from './menu';
+export * from './stream-symble';

package/src/typing/menu.ts

@@ -0,0 +1,15 @@
+import { IMenu } from '@oinone/kunlun-meta';
+
+export interface RuntimeMenu extends IMenu {
+  title: string;
+}
+
+export interface MenuUrlParameters {
+  selectedKeys: string[];
+  openKeys: string[];
+}
+
+export interface MenuUrlParameterOptions {
+  selectedKeys?: string[];
+  openKeys?: string[];
+}

package/src/typing/stream-symble.ts

@@ -0,0 +1,14 @@
+/**
+ * 菜单折叠
+ */
+export const MenuCollapsedSymbol = Symbol('__menu_collapsed__');
+
+/**
+ * 修改用户
+ */
+export const pamirsUserSymbol = Symbol('__pamirsUserSymbol__');
+
+/**
+ * 新增应用
+ */
+export const appFinderSymbol = Symbol('__appFinderSymbol__');

package/src/util/HomepageUtils.ts

@@ -0,0 +1,41 @@
+import { generatorViewActionQueryParameter, ViewActionCache } from '@oinone/kunlun-engine';
+import { getRouterInstance, Router } from '@oinone/kunlun-router';
+import {
+  getUnauthorizedAction,
+  unauthorizedActionName,
+  urlHomepageModelName
+} from './unauthorized-action';
+import { IURLAction, ViewActionTarget } from "@oinone/kunlun-meta";
+
+export async function gotoHomepage(module: string, moduleName: string, urlHomePage?: IURLAction, router: Router = getRouterInstance()) {
+  let homepage = await ViewActionCache.getHomepage(module);
+  if (!homepage) {
+    if (urlHomePage && urlHomePage.target === ViewActionTarget.Inner) {
+      homepage = getUnauthorizedAction({
+        moduleName,
+        model: urlHomepageModelName,
+        target: urlHomePage.target,
+        name: encodeURI(urlHomePage.url)
+      });
+    } else if (urlHomePage && urlHomePage.target === ViewActionTarget.OpenWindow) {
+      window.open(urlHomePage.url, '_blank');
+      return false;
+    } else {
+      homepage = getUnauthorizedAction({
+        moduleName,
+        name: unauthorizedActionName
+      });
+    }
+  }
+
+  router.push({
+    segments: [
+      {
+        path: 'page',
+        extra: { preserveParameter: false },
+        parameters: generatorViewActionQueryParameter(homepage, { moduleName, usingLastedUrlParameters: false })
+      }
+    ]
+  });
+  return true;
+}

package/src/util/MenuUtil.ts

@@ -0,0 +1,18 @@
+const MASK_CLASS = 'k-layout-mask';
+const COLLAPSED_CLASS = 'collapsed';
+
+/**
+ * 菜单收起util类
+ * 菜单收起后统一处理appSwitcher menu对应的变化
+ * */
+export function maskCollapsed(collapsed: boolean) {
+  const maskElement = document.getElementsByClassName(MASK_CLASS)[0];
+  if (!maskElement) {
+    throw new Error('mask element not found');
+  }
+  if (collapsed) {
+    maskElement.className = `${MASK_CLASS} ${COLLAPSED_CLASS}`;
+  } else {
+    maskElement.className = `${MASK_CLASS}`;
+  }
+}

package/src/util/index.ts

@@ -0,0 +1,3 @@
+export * from './HomepageUtils';
+export * from './MenuUtil';
+export * from './unauthorized-action';

package/src/util/unauthorized-action.ts

@@ -0,0 +1,98 @@
+import { ActionType, ActionContextType, ViewType, ViewMode, ViewActionTarget, deepClone } from '@oinone/kunlun-meta';
+import { DslDefinition, XMLParse, DslDefinitionType } from '@oinone/kunlun-dsl';
+import { MultiTabsRuntimeManifestMergedConfigManager, RuntimeViewAction } from '@oinone/kunlun-engine';
+import { getDefaultMaskTemplate } from '../template';
+
+function findNodeByType(dsl: DslDefinition, dslNodeType: DslDefinitionType | string): DslDefinition | null {
+  function findNode(node: DslDefinition, nodeType: DslDefinitionType | string) {
+    if (node.dslNodeType === nodeType) {
+      return node;
+    }
+
+    if (Array.isArray(node.widgets)) {
+      for (let i = 0; i < node.widgets.length; i++) {
+        const foundNode = findNode(node.widgets[i], nodeType);
+        if (foundNode) {
+          return foundNode;
+        }
+      }
+    }
+
+    return null;
+  }
+
+  return findNode(dsl, dslNodeType);
+}
+
+export const unauthorizedActionName = 'unauthorized';
+export const emptyHomepageModelName = '$$internal_empty_homepage_model';
+export const urlHomepageModelName = '$$internal_url_homepage_model';
+
+export const replaceStanderMainView = (dsl: DslDefinition) => {
+  const hasMainView = findNodeByType(dsl, 'main-view');
+  if (hasMainView) {
+    return dsl;
+  }
+
+  const __dsl = deepClone(dsl) as DslDefinition;
+
+  const content = findNodeByType(__dsl, 'content');
+  if (!content) {
+    return getDefaultMaskTemplate();
+  }
+
+  const widgetNode = findNodeByType(content, 'widget');
+  if (widgetNode) {
+    widgetNode.widget = 'main-view';
+  }
+
+  return __dsl;
+};
+
+export const getUnauthorizedAction = ({
+  moduleName,
+  model,
+  target,
+  name,
+  title
+}: {
+  moduleName: string;
+  model?: string;
+  target?: ViewActionTarget;
+  name: string;
+  title?: string;
+}): RuntimeViewAction => {
+  let t = target;
+
+  if (!t) {
+    if (MultiTabsRuntimeManifestMergedConfigManager.isEnabled(moduleName)) {
+      t = ViewActionTarget.OpenWindow;
+    } else {
+      t = ViewActionTarget.Router;
+    }
+  }
+
+  const _model = model || emptyHomepageModelName;
+
+  return {
+    title: title || '无权限访问',
+    moduleName,
+    model: _model,
+    modelName: unauthorizedActionName,
+    name,
+    actionType: ActionType.View,
+    contextType: ActionContextType.ContextFree,
+    target: t,
+    resModel: unauthorizedActionName,
+    resModelName: unauthorizedActionName,
+    resViewType: ViewType.Form,
+    resViewMode: ViewMode.Lookup,
+    resView: {
+      type: ViewType.Form,
+      model: _model,
+      name: unauthorizedActionName,
+      modelName: unauthorizedActionName,
+      template: XMLParse.INSTANCE.parse(`<view type="FORM"><element widget="UnauthorizedWidget"/></view>`)
+    }
+  };
+};