yuang-framework-ui-pc 1.1.2 → 1.1.3

package/es/ele-pro-layout/props.ts

@@ -1,255 +0,0 @@
-import type { PropType, ExtractPropTypes, InjectionKey } from 'vue';
-import type { StyleValue } from '../ele-app/types';
-import type { EleMenusProps, EleBreadcrumbProps, EleDropdownProps, EleBacktopProps } from '../ele-app/plus';
-import type { ContextMenus } from '../ele-tabs/types';
-import type { BreadcrumbSeparator as Separator } from '../ele-breadcrumb/types';
-import type { Layout, SidebarLayout, HeaderStyle, SidebarStyle, TabStyle, TabBar, Maximized } from '../ele-admin-layout/types';
-import type { MenuItem, TabItem, MenuItemTrigger, MenuI18n, BeforeClick, TabItemEventOption, BodySizeChangeOption, ProLayoutProvide } from './types';
-type TextEllipsisTooltip = EleMenusProps['textEllipsisTooltip'];
-type ProLayoutKey = InjectionKey<ProLayoutProvide>;
-
-/**
- * 属性
- */
-export const proLayoutProps = {
-  /** 高度 */
-  height: {
-    type: [String, Number],
-    default: null
-  },
-  /** 菜单数据 */
-  menus: Array as PropType<MenuItem[] | null>,
-  /** 页签数据 */
-  tabs: Array as PropType<TabItem[] | null>,
-  /** 是否折叠侧栏 */
-  collapse: Boolean,
-  /** 双侧栏一级是否紧凑风格 */
-  compact: Boolean,
-  /** 内容区是否最大化 */
-  maximized: [Boolean, String] as PropType<Maximized>,
-  /** 是否需要页签栏 */
-  tabBar: {
-    type: [Boolean, String] as PropType<TabBar>,
-    default: true
-  },
-  /** 是否需要面包屑导航 */
-  breadcrumb: {
-    type: [Boolean, Object] as PropType<boolean | EleBreadcrumbProps>,
-    default: true
-  },
-  /** 是否需要返回顶部 */
-  backTop: {
-    type: [Boolean, Object] as PropType<boolean | EleBacktopProps>,
-    default: true
-  },
-  /** 布局类型 */
-  layout: String as PropType<Layout>,
-  /** 侧栏布局类型 */
-  sidebarLayout: String as PropType<SidebarLayout>,
-  /** 顶栏风格 */
-  headerStyle: String as PropType<HeaderStyle>,
-  /** 侧栏风格 */
-  sidebarStyle: {
-    type: String as PropType<SidebarStyle>,
-    default: 'dark'
-  },
-  /** 页签风格 */
-  tabStyle: {
-    type: String as PropType<TabStyle>,
-    default: 'simple'
-  },
-  /** 是否固定顶栏 */
-  fixedHeader: {
-    type: Boolean,
-    default: true
-  },
-  /** 是否固定侧栏 */
-  fixedSidebar: {
-    type: Boolean,
-    default: true
-  },
-  /** 是否固定内容区 */
-  fixedBody: {
-    type: Boolean,
-    default: true
-  },
-  /** 图标是否置于顶栏 */
-  logoInHeader: Boolean,
-  /** 是否需要固定的主页页签 */
-  fixedHome: {
-    type: Boolean,
-    default: true
-  },
-  /** 主页路由地址 */
-  homePath: String,
-  /** 刷新路由地址 */
-  redirectPath: {
-    type: String,
-    default: '/redirect'
-  },
-  /** 内容区是否撑满 */
-  fluid: {
-    type: Boolean,
-    default: true
-  },
-  /** 返回键退出内容区最大化 */
-  compressOnEsc: Boolean,
-  /** 固定主体时切换路由自动滚到顶部 */
-  autoScrollTop: {
-    type: Boolean,
-    default: true
-  },
-  /** 顶栏菜单触发模式 */
-  navTrigger: String as PropType<MenuItemTrigger>,
-  /** 双侧栏一级菜单触发模式 */
-  boxTrigger: String as PropType<MenuItemTrigger>,
-  /** 侧栏菜单触发模式 */
-  itemTrigger: String as PropType<MenuItemTrigger>,
-  /** hover模式的菜单切换超时 */
-  menuHoverTimeout: {
-    type: Number,
-    default: 600
-  },
-  /** 菜单点击事件前钩子 */
-  beforeClick: Function as PropType<BeforeClick>,
-  /** 是否支持内嵌缓存 */
-  keepAlive: Boolean,
-  /** 内嵌切换动画 */
-  transitionName: String,
-  /** 内嵌进入动画延迟时间 */
-  transitionDelay: {
-    type: Number,
-    default: 250
-  },
-  /** 是否开启响应式 */
-  responsive: {
-    type: Boolean,
-    default: true
-  },
-  /** 国际化语言 */
-  locale: String,
-  /** 菜单标题国际化方法 */
-  i18n: Function as PropType<MenuI18n>,
-  /** 是否支持页签右键菜单 */
-  tabContextMenu: [Boolean, Object] as PropType<boolean | EleDropdownProps>,
-  /** 右键菜单 */
-  tabContextMenus: [Array, Function] as PropType<ContextMenus>,
-  /** 是否支持页签拖动排序 */
-  tabSortable: Boolean,
-  /** 顶栏菜单标题插槽名称 */
-  headerTitleSlot: {
-    type: String,
-    default: 'title'
-  },
-  /** 顶栏菜单图标插槽名称 */
-  headerIconSlot: {
-    type: String,
-    default: 'icon'
-  },
-  /** 侧栏菜单标题插槽名称 */
-  sidebarTitleSlot: {
-    type: String,
-    default: 'title'
-  },
-  /** 侧栏菜单图标插槽名称 */
-  sidebarIconSlot: {
-    type: String,
-    default: 'icon'
-  },
-  /** 双侧栏一级菜单标题插槽名称 */
-  sideboxTitleSlot: {
-    type: String,
-    default: 'title'
-  },
-  /** 双侧栏一级菜单图标插槽名称 */
-  sideboxIconSlot: {
-    type: String,
-    default: 'icon'
-  },
-  /** 顶栏样式 */
-  headerCustomStyle: Object as PropType<StyleValue>,
-  /** 侧栏样式 */
-  sidebarCustomStyle: Object as PropType<StyleValue>,
-  /** 双侧栏一级样式 */
-  sideboxCustomStyle: Object as PropType<StyleValue>,
-  /** 页签栏样式 */
-  tabsCustomStyle: Object as PropType<StyleValue>,
-  /** 内容区样式 */
-  contentCustomStyle: Object as PropType<StyleValue>,
-  /** logo样式 */
-  logoStyle: Object as PropType<StyleValue>,
-  /** logo文字样式 */
-  logoTitleStyle: Object as PropType<StyleValue>,
-  /** 顶栏菜单样式 */
-  headerMenusStyle: Object as PropType<StyleValue>,
-  /** 侧栏菜单样式 */
-  sidebarMenusStyle: Object as PropType<StyleValue>,
-  /** 双侧栏一级菜单样式 */
-  sideboxMenusStyle: Object as PropType<StyleValue>,
-  /** 顶栏菜单属性 */
-  headerMenuProps: Object as PropType<EleMenusProps>,
-  /** 侧栏菜单属性 */
-  sidebarMenuProps: Object as PropType<EleMenusProps>,
-  /** 双侧栏一级菜单属性 */
-  sideboxMenuProps: Object as PropType<EleMenusProps>,
-  /** 顶栏菜单是否省略多余的子项 */
-  ellipsis: {
-    type: Boolean,
-    default: true
-  },
-  /** 顶栏菜单省略项的属性 */
-  ellipsisProps: Object as PropType<EleMenusProps['ellipsisProps']>,
-  /** 顶栏子菜单触发方式 */
-  menuTrigger: String as PropType<EleMenusProps['menuTrigger']>,
-  /** 侧栏默认展开的菜单 */
-  sidebarOpeneds: Array as PropType<string[]>,
-  /** 侧栏是否只保持一个子菜单展开 */
-  uniqueOpened: {
-    type: Boolean,
-    default: true
-  },
-  /** 侧栏菜单是否彩色图标 */
-  colorfulIcon: Boolean,
-  /** 菜单 tooltip 主题 */
-  tooltipEffect: String as PropType<EleMenusProps['popperEffect']>,
-  /** 是否开启菜单文本溢出提示 */
-  menuTextEllipsisTooltip: [Boolean, Object] as PropType<TextEllipsisTooltip>,
-  /** 内容区最大时不带页签栏 */
-  expanded: Boolean,
-  /** 面包屑导航分隔符 */
-  breadcrumbSeparator: [String, Object, Function] as PropType<Separator>,
-  /** 返回顶部可见的滚动高度 */
-  backTopVisibilityHeight: Number,
-  /** 返回顶部的右边距 */
-  backTopRight: Number,
-  /** 返回顶部的下边距 */
-  backTopBottom: Number,
-  /** 返回顶部的目标选择器 */
-  backTopTarget: String
-};
-
-export type ProLayoutProps = ExtractPropTypes<typeof proLayoutProps>;
-
-/**
- * 事件
- */
-export const proLayoutEmits = {
-  'update:collapse': (_collapse: boolean) => true,
-  'update:maximized': (_maximized: boolean) => true,
-  tabAdd: (_data: TabItem) => true,
-  tabClick: (_option: TabItemEventOption) => true,
-  tabRemove: (_option: TabItemEventOption) => true,
-  tabContextMenu: (_option: TabItemEventOption) => true,
-  tabSortChange: (_data: TabItem[]) => true,
-  logoClick: (_isHome: boolean, _e: MouseEvent) => true,
-  headMenuOpen: (_index: string, _indexPath: string[]) => true,
-  headMenuClose: (_index: string, _indexPath: string[]) => true,
-  sideMenuOpen: (_index: string, _indexPath: string[]) => true,
-  sideMenuClose: (_index: string, _indexPath: string[]) => true,
-  bodySizeChange: (_option: BodySizeChangeOption) => true
-};
-
-/**
- * 共享数据key
- */
-export const PRO_LAYOUT_KEY = Symbol('proLayout') as ProLayoutKey;

package/es/ele-pro-layout/style/index.ts

@@ -1,2 +0,0 @@
-import '../../ele-admin-layout/style/index';
-import './index.scss';

package/es/ele-pro-layout/util.ts

@@ -1,277 +0,0 @@
-import { inject, computed } from 'vue';
-import type {
-  RouteLocationNormalizedLoaded,
-  RouteLocationMatched
-} from 'vue-router';
-import type { EleMenuItemProps } from '../ele-app/plus';
-import { findTree, mapTree, omit } from '../utils/core';
-import { LayoutProvide } from '../ele-admin-layout/types';
-import { LAYOUT_KEY } from '../ele-admin-layout/props';
-import { PRO_LAYOUT_KEY } from './props';
-import type {
-  MenuItem,
-  TabItem,
-  LevelItem,
-  MatchedResult,
-  ProLayoutProvide,
-  ResponsiveProps
-} from './types';
-
-/**
- * 根据菜单地址获取菜单
- * @param path 菜单地址
- * @param menus 菜单数据
- */
-export function findMenuByPath(path?: string, menus?: MenuItem[]) {
-  return path == null ? void 0 : findTree(menus, (d) => path === d.path);
-}
-
-/**
- * 根据路由地址获取页签
- * @param path 路由地址
- * @param tabs 页签数据
- */
-export function findTabByPath(path?: string, tabs?: TabItem[] | null) {
-  if (path != null && tabs != null) {
-    return tabs.find((d) => path === d.key || path === d.fullPath);
-  }
-}
-
-/**
- * 根据页签标识获取页签
- * @param key 页签标识
- * @param tabs 页签数据
- */
-export function findTabByKey(key?: string, tabs?: TabItem[] | null) {
-  if (key != null && tabs != null) {
-    return tabs.find((d) => key === d.key);
-  }
-}
-
-/**
- * 根据菜单地址获取菜单及所有父级
- * @param path 菜单地址
- * @param menus 菜单数据
- */
-export function getMatchedMenus(
-  path: string,
-  menus: MenuItem[],
-  parents?: MenuItem[]
-): MenuItem[] | undefined {
-  for (const m of menus) {
-    const p = parents ? [...parents, m] : [m];
-    if (m.path === path) {
-      return p;
-    } else if (m.children?.length) {
-      const result = getMatchedMenus(path, m.children, p);
-      if (result) {
-        return result;
-      }
-    }
-  }
-}
-
-/**
- * 获取路由匹配的菜单数据
- * @param route 路由信息
- * @param menus 菜单数据
- */
-export function getRouteMatched(
-  route: RouteLocationNormalizedLoaded,
-  menus: MenuItem[]
-): MatchedResult {
-  const { path, fullPath, meta } = route;
-  if (meta?.active) {
-    const m = findMenuByPath(fullPath, menus) ?? findMenuByPath(path, menus);
-    return {
-      active: meta.active as string,
-      activeOther: true,
-      title: m?.meta?.title ?? (meta.title as string),
-      matched: getMatchedMenus(meta.active as string, menus)
-    };
-  }
-  const fm = findMenuByPath(fullPath, menus);
-  if (fm) {
-    return {
-      active: fullPath,
-      title: fm.meta?.title ?? (meta.title as string),
-      matched: getMatchedMenus(fullPath, menus)
-    };
-  }
-  const m = findMenuByPath(path, menus);
-  return {
-    active: path,
-    title: m?.meta?.title ?? (meta.title as string),
-    matched: getMatchedMenus(path, menus)
-  };
-}
-
-/**
- * 获取面包屑导航数据
- * @param matched 匹配的菜单数据
- * @param activeOther 是否选中非本身
- * @param route 路由信息
- * @param menus 菜单数据
- * @param tabs 页签数据
- */
-export function getMatchedLevels(
-  matched: MenuItem[] | undefined,
-  activeOther: boolean | undefined,
-  route: RouteLocationNormalizedLoaded,
-  menus: MenuItem[],
-  tabs: TabItem[]
-): LevelItem[] {
-  const levels: LevelItem[] = [];
-  if (matched) {
-    matched.forEach((m) => {
-      if (m.meta && m.meta.title && m.meta.breadcrumb !== false) {
-        const title = findTabByPath(m.path, tabs)?.title || m.meta.title;
-        levels.push({ path: m.path, title });
-      }
-    });
-  }
-  if (activeOther) {
-    const { path, fullPath, meta } = route;
-    const notIn = !levels.length || fullPath !== levels[levels.length - 1].path;
-    if (notIn && meta.title) {
-      const m = findMenuByPath(fullPath, menus) ?? findMenuByPath(path, menus);
-      const t = findTabByPath(fullPath, tabs) ?? findTabByPath(path, tabs);
-      const title = t?.title || m?.meta?.title || (meta.title as string);
-      levels.push({ path: fullPath, title });
-    }
-  }
-  return levels;
-}
-
-/**
- * 获取路由对应的组件名称
- * @param matched 路由匹配数据
- */
-export function getMatchedComponents(matched: RouteLocationMatched[]) {
-  const components: string[] = [];
-  matched.forEach((m) => {
-    if (m.components?.default?.name) {
-      components.push(m.components.default.name);
-    }
-  });
-  return components;
-}
-
-/**
- * 返回路由对应的页签数据
- * @param route 路由信息
- * @param tabs 当前页签数据
- * @param homePath 主页地址
- * @param routeTitle 路由对应的标题
- */
-export function getRouteTab(
-  route: RouteLocationNormalizedLoaded,
-  tabs: TabItem[],
-  homePath: string | undefined,
-  routeTitle?: string
-): TabItem {
-  const { path, fullPath, meta, matched } = route;
-  const key = meta.tabUnique === false ? fullPath : path;
-  const t = findTabByPath(key, tabs);
-  // 标题
-  const title = t?.title || routeTitle;
-  // 是否是主页
-  const home = path === homePath || fullPath === homePath;
-  // 是否可关闭
-  const closable = t?.closable ?? meta.closable !== false;
-  // 路由对应的组件名
-  const components = getMatchedComponents(matched);
-  return { key, path, fullPath, title, closable, home, components, meta };
-}
-
-/**
- * 获取选中菜单的子级
- * @param menus 菜单数据
- * @param active 选中地址
- * @param childrenName 子级字段名称
- */
-export function getActiveChilds(
-  menus: MenuItem[],
-  active?: string,
-  childrenName?: string
-): MenuItem[] {
-  const field = childrenName || 'children';
-  if (!menus.length) {
-    return [];
-  }
-  if (!active) {
-    return menus[0][field] || [];
-  }
-  const m = menus.find((m) => m.path === active);
-  if (m == null) {
-    return menus[0][field] || [];
-  }
-  return m[field] || [];
-}
-
-/**
- * 拼接内嵌地址
- * @param routePath 路由地址含参数
- * @param iframeUrl 内嵌地址
- */
-export function getIframeSrc(routePath?: string, iframeUrl?: string) {
-  const [_path1, query1 = ''] = (routePath ?? '').split('?');
-  const [path2, query2 = ''] = (iframeUrl ?? '').split('?');
-  const params1 = new URLSearchParams(query1);
-  const params2 = new URLSearchParams(query2);
-  // @ts-ignore
-  for (const [key, value] of params2.entries()) {
-    params1.append(key, value);
-  }
-  const newQuery = params1.toString();
-  return `${path2}${newQuery ? `?${newQuery}` : ''}`;
-}
-
-/**
- * 菜单数据转换
- * @param menus 菜单数据
- * @param link 是否使用超链接
- */
-export function getMenuItems(
-  menus: MenuItem[],
-  link: boolean
-): EleMenuItemProps[] {
-  return mapTree<MenuItem, EleMenuItemProps>(menus, (m) => {
-    const { path, meta } = m;
-    const { hide, icon, title, props } = meta ?? {};
-    if (hide) {
-      return;
-    }
-    const item: EleMenuItemProps = {
-      title,
-      icon,
-      path: link ? path : void 0,
-      index: path,
-      ...omit(props, ['title', 'icon', 'path', 'index']),
-      meta
-    };
-    return item;
-  });
-}
-
-/**
- * 获取布局共享数据
- */
-export function useLayoutState(): LayoutProvide {
-  return inject(LAYOUT_KEY, {});
-}
-
-/**
- * 获取高级布局共享数据
- */
-export function useProLayoutState(): ProLayoutProvide {
-  return inject(PRO_LAYOUT_KEY, {});
-}
-
-/**
- * 获取是否开启布局响应
- */
-export function useResponsive(props: ResponsiveProps) {
-  const state = useProLayoutState();
-  return computed<boolean>(() => props.responsive ?? state.responsive ?? true);
-}