| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258 |
- import { h, unref } from 'vue'
- import type { App, Plugin } from 'vue'
- import { NIcon, NTag } from 'naive-ui'
- import { PageEnum } from '@/enums/pageEnum'
- import { isObject } from './is/index'
- import { cloneDeep } from 'lodash-es'
- /**
- * render 图标
- * */
- export function renderIcon(icon: any) {
- return () => h(NIcon, null, { default: () => h(icon) })
- }
- /**
- * font 图标(Font class)
- * */
- export function renderFontClassIcon(icon: string, iconName = 'iconfont') {
- return () => h('span', { class: [iconName, icon] })
- }
- /**
- * font 图标(Unicode)
- * */
- export function renderUnicodeIcon(icon: string, iconName = 'iconfont') {
- return () => h('span', { class: [iconName], innerHTML: icon })
- }
- /**
- * font svg 图标
- * */
- export function renderfontsvg(icon: any) {
- return () =>
- h(NIcon, null, {
- default: () =>
- h('svg', { class: `icon`, 'aria-hidden': 'true' }, h('use', { 'xlink:href': `#${icon}` }))
- })
- }
- /**
- * render new Tag
- * */
- const newTagColors = { color: '#f90', textColor: '#fff', borderColor: '#f90' }
- export function renderNew(type = 'warning', text = 'New', color: object = newTagColors) {
- return () =>
- h(
- NTag as any,
- {
- type,
- round: true,
- size: 'small',
- color
- },
- { default: () => text }
- )
- }
- /**
- * 递归组装菜单格式
- */
- export function generatorMenu(routerMap: Array<any>) {
- return filterRouter(routerMap).map((item) => {
- const isRoot = isRootRouter(item)
- if (isRoot) {
- console.log(item.children[0], 'isRoot')
- }
- const info = isRoot ? item.children[0] : item
- // console.log(item)
- const currentMenu = {
- ...info,
- ...info.meta,
- label: info.meta?.title,
- key: info.key,
- icon: info.meta?.icon
- }
- // 是否有子菜单,并递归处理
- if (info.children && info.children.length > 0) {
- // Recursion
- currentMenu.children = generatorMenu(info.children)
- }
- return currentMenu
- })
- }
- /**
- * 混合菜单
- * */
- export function generatorMenuMix(routerMap: Array<any>, routerName: string, location: string) {
- const cloneRouterMap = cloneDeep(routerMap)
- const newRouter = filterRouter(cloneRouterMap)
- if (location === 'header') {
- const firstRouter: any[] = []
- newRouter.forEach((item) => {
- const isRoot = isRootRouter(item)
- const info = isRoot ? item.children[0] : item
- info.children = undefined
- const currentMenu = {
- ...info,
- ...info.meta,
- label: info.meta?.title,
- key: info.name
- }
- firstRouter.push(currentMenu)
- })
- return firstRouter
- } else {
- // 混合菜单
- console.log('混合菜单')
- return getChildrenRouter(newRouter.filter((item) => item.name === routerName))
- }
- }
- /**
- * 递归组装子菜单
- * */
- export function getChildrenRouter(routerMap: Array<any>) {
- return filterRouter(routerMap).map((item) => {
- const isRoot = isRootRouter(item)
- const info = isRoot ? item.children[0] : item
- const currentMenu = {
- ...info,
- ...info.meta,
- label: info.meta?.title,
- key: info.name
- }
- // 是否有子菜单,并递归处理
- if (info.children && info.children.length > 0) {
- // Recursion
- currentMenu.children = getChildrenRouter(info.children)
- }
- return currentMenu
- })
- }
- /**
- * 判断根路由 Router
- * */
- export function isRootRouter(item: any) {
- return item.meta?.isRoot === true
- }
- /**
- * 排除Router
- * */
- export function filterRouter(routerMap: Array<any>) {
- return routerMap.filter((item) => {
- // console.log(
- // (item.meta?.hidden || false) != true &&
- // !['/:path(.*)*', PageEnum.REDIRECT, PageEnum.BASE_LOGIN].includes(item.path),
- // '过滤完之后的路由'
- // )
- return (
- (item.meta?.hidden || false) != true &&
- !['/:path(.*)*', PageEnum.REDIRECT, PageEnum.BASE_LOGIN].includes(item.path)
- )
- })
- }
- export const withInstall = <T>(component: T, alias?: string) => {
- const comp = component as any
- comp.install = (app: App) => {
- app.component(comp.name || comp.displayName, component as any)
- if (alias) {
- app.config.globalProperties[alias] = component
- }
- }
- return component as T & Plugin
- }
- /**
- * 找到对应的节点
- * */
- let result = null as any
- export function getTreeItem(data: any[], key?: string | number): any {
- data.map((item) => {
- if (item.key === key) {
- result = item
- } else {
- if (item.children && item.children.length) {
- getTreeItem(item.children, key)
- }
- }
- })
- return result
- }
- /**
- * 找到所有节点
- * */
- const treeAll: any[] = []
- export function getTreeAll(data: any[]): any[] {
- data.map((item) => {
- treeAll.push(item.key)
- if (item.children && item.children.length) {
- getTreeAll(item.children)
- }
- })
- return treeAll
- }
- export function deepMerge<T = any>(src: any = {}, target: any = {}): T {
- let key: string
- for (key in target) {
- src[key] = isObject(src[key]) ? deepMerge(src[key], target[key]) : (src[key] = target[key])
- }
- return src
- }
- /**
- * Sums the passed percentage to the R, G or B of a HEX color
- * @param {string} color The color to change
- * @param {number} amount The amount to change the color by
- * @returns {string} The processed part of the color
- */
- function addLight(color: string, amount: number) {
- const cc = parseInt(color, 16) + amount
- const c = cc > 255 ? 255 : cc
- return c.toString(16).length > 1 ? c.toString(16) : `0${c.toString(16)}`
- }
- /**
- * Lightens a 6 char HEX color according to the passed percentage
- * @param {string} color The color to change
- * @param {number} amount The amount to change the color by
- * @returns {string} The processed color represented as HEX
- */
- export function lighten(color: string, amount: number) {
- color = color.indexOf('#') >= 0 ? color.substring(1, color.length) : color
- amount = Math.trunc((255 * amount) / 100)
- return `#${addLight(color.substring(0, 2), amount)}${addLight(
- color.substring(2, 4),
- amount
- )}${addLight(color.substring(4, 6), amount)}`
- }
- /**
- * 判断是否 url
- * */
- export function isUrl(url: string) {
- return /^(http|https):\/\//g.test(url)
- }
- /** 递归清除空数据 */
- export function clearEmtryData(list: any[], key: string) {
- for (let i = 0; i < list.length; i++) {
- if (Array.isArray(list[i][key]) && !list[i][key].length) {
- list[i][key] = ''
- } else {
- list[i][key] = clearEmtryData(list[i][key], key)
- }
- }
- return list
- }
- /** 检测链接格式 */
- export function checkUrlType(urlType: string) {
- const subfix = (urlType || '').split('.').pop()
- if (subfix === 'wav' || subfix === 'mp3' || subfix === 'm4a') {
- return 'audio'
- }
- return 'video'
- }
|