@dt-frames/ui 1.0.0 → 1.0.1

package/src/theme/header/components/theme-drawer/index.ts

@@ -1,7 +0,0 @@
-import MenuType from './menu-type.vue'
-import Feature from './feature.vue'
-
-export {
-    MenuType,
-    Feature
-}

package/src/theme/header/components/theme-drawer/menu-type.vue

@@ -1,40 +0,0 @@
-<template>
-    <div class="dt-menu-type__wrap">
-        <template v-for="item in menuTypeList" :key="item.title">
-            <Tooltip :title="item.title" placement="bottom">
-                <div
-                    @click="changeMenuType(item)"
-                    :class="[
-                        'dt-menu-type__item',
-                        `dt-menu-type__item--${ item.type }`,
-                        {
-                            [`dt-menu-type__item--active`]: getMenuType === item.type && getMenuMode === item.mode
-                        }
-                    ]"
-                >
-                    <div class="dt-sidebar-menu-type"></div>
-                </div>
-            </Tooltip>
-        </template>
-    </div>
-</template>
-
-<script lang="ts" setup>
-    import { unref, ref } from 'vue'
-    import { HandlerEnum, menuTypeList } from '../../const'
-    import { useMenu } from '@dt-frames/core'
-    import { Tooltip } from 'ant-design-vue'
-    import { baseHandler } from '../handler';
-
-    
-    const { getMenuType, getMenuMode } = useMenu()
-    const defMenuType = ref(unref(getMenuType))
-
-    function changeMenuType(item) {
-        // document.getElementsByTagName('html')[0].style.setProperty('--primary',color);
-
-        defMenuType.value = item.type
-
-        baseHandler(HandlerEnum.CHANGE_LAYOUT, item)
-    }
-</script>

package/src/theme/header/components/theme-drawer/select-item.vue

@@ -1,46 +0,0 @@
-<template>
-    <div class="dt-feature-item">
-        <span> {{ title }}</span>
-        <Select
-            v-bind="getBindValue"
-            class="select-item"
-            @change="handleChange"
-            :disabled="disabled"
-            size="small"
-            :options="options"
-        />
-    </div>
-</template>
-
-<script lang="ts" setup>
-    import { PropType, computed } from 'vue'
-    import { Select } from 'ant-design-vue'
-    import { HandlerEnum } from '../../const'
-    import { baseHandler } from '../handler';
-
-    type OptType = {
-        label: string
-        value: any
-        [key: string]: string | number | boolean
-    }
-
-    const props = defineProps({
-        event: { type: Number as PropType<HandlerEnum> },
-        disabled: { type: Boolean },
-        title: { type: String },
-        def: { type: [String, Number] as PropType<string | number> },
-        initValue: { type: [String, Number] as PropType<string | number> },
-        options: {
-            type: Array as PropType<OptType[]>,
-            default: () => [],
-        }
-    })
-
-    const getBindValue = computed(() => {
-        return props.def ? { value: props.def, defaultValue: props.initValue || props.def } : {};
-    })
-
-    function handleChange(e) {
-        props.event && baseHandler(props.event, e);
-    }
-</script>

package/src/theme/header/components/theme-drawer/switch-item.vue

@@ -1,39 +0,0 @@
-<template>
-    <div class="dt-feature-item">
-        <span>{{ props.title }}</span>
-        <Switch
-            v-bind="getBindValue"
-            :disabled="disabled"
-            @change="handleChange"
-            checkedChildren="开"
-            unCheckedChildren="关"
-        ></Switch>
-    </div>
-    
-</template>
-
-<script lang="ts" setup>
-    import { Switch } from 'ant-design-vue'
-    import { computed, PropType } from 'vue';
-    import { HandlerEnum } from '../../const';
-    import { baseHandler } from '../handler';
-
-    const props = defineProps({
-        event: {
-            type: Number as PropType<HandlerEnum>
-        },
-        disabled: { type: Boolean },
-        title: { type: String },
-        def: {
-            type: Boolean,
-        }
-    })
-
-    const getBindValue = computed(() => {
-        return props.def ? { checked: props.def } : {};
-    })
-
-    function handleChange(e) {
-        props.event && baseHandler(props.event, e)
-    }
-</script>

package/src/theme/header/components/theme-drawer/theme-color.vue

@@ -1,26 +0,0 @@
-<template>
-    <div class="dt-theme-picker">
-        <template>
-
-        </template>
-    </div>
-    
-</template>
-
-<script lang="ts" setup>
-    import { PropType } from 'vue';
-    import { HandlerEnum } from '../../const';
-
-    const props = defineProps({
-        colorList: {
-            type: Array as PropType<string[]>,
-            default: []
-        },
-        event: {
-            type: Number as PropType<HandlerEnum>
-        },
-        def: {
-            type: String
-        }
-    })
-</script>

package/src/theme/header/components/trigger.vue

@@ -1,14 +0,0 @@
-<template>
-    <div :class="['dt-header-trigger', props.theme]" @click="toggleCollapsed">
-        <span v-if="getCollapsed" v-icon="'ic:baseline-format-indent-increase'"></span>
-        <span v-else v-icon="'ic:baseline-format-indent-decrease'"></span>
-    </div>
-</template>
-
-<script lang="ts" setup>
-    import { useMenu } from '@dt-frames/core'
-
-    const props = defineProps({ theme: String });
-    const { getCollapsed, toggleCollapsed } = useMenu();
-
-</script>

package/src/theme/header/components/user-info.vue

@@ -1,43 +0,0 @@
-<template>
-    <Popover placement="bottom" overlayClassName="user-info__popover" trigger="click">
-        <template #content>
-            <ul class="user-operate">
-                <li v-for="it in getUserActions" @click="it.handleClick">
-                    <span v-icon="it.icon"></span>
-                    {{ it.label }}
-                </li>
-                <li>
-                    <span v-icon="'mdi:account-cog'"></span>
-                    个人中心
-                </li>
-                <li>
-                    <span v-icon="'ic:baseline-key'"></span>
-                    修改密码
-                </li>
-                <li class="border-bottom"></li>
-                <li>
-                    <span v-icon="'ic:baseline-lock'"></span>
-                    锁定屏幕
-                </li>
-                <li>
-                    <span v-icon="'ant-design:logout-outlined'"></span>
-                    退出系统
-                </li>
-            </ul>
-        </template> 
-
-        <div class="userInfo">
-            <Avatar :src="getUserInfo.avatar" :size="28" />
-            <span class="name">{{ getUserInfo.realName }}</span>
-        </div>
-    </Popover>
-</template>
-
-<script setup lang="ts">
-    import { Popover, Avatar } from 'ant-design-vue';
-    import { useAuthStore, useHeader } from '@dt-frames/core';
-
-    const { getUserInfo } = useAuthStore()
-    const { getUserActions } = useHeader()
-
-</script>

package/src/theme/header/const/index.ts

@@ -1,40 +0,0 @@
-import { MenuMode, MenuType, Theme } from "@dt-frames/core";
-
-export const menuTypeList = [
-    {
-        title: '左侧菜单模式',
-        headTheme: Theme.LIGHT,
-        menuTheme: Theme.DARK,
-        mode: MenuMode.INLINE,
-        type: MenuType.SIDE,
-        split: false
-    },
-    {
-        title: '菜单混合模式',
-        headTheme: Theme.DARK,
-        menuTheme: Theme.LIGHT,
-        mode: MenuMode.INLINE,
-        type: MenuType.MIX,
-        split: true
-    },
-    {
-        title: '顶部菜单模式',
-        headTheme: Theme.DARK,
-        menuTheme: Theme.LIGHT,
-        mode: MenuMode.HORIZONTAL,
-        type: MenuType.TOP_MENU,
-        split: false
-    }
-]
-
-export enum HandlerEnum {
-    CHANGE_LAYOUT,
-    SHOW_BREADCRUMB,
-    SHOW_SEARCH,
-    SHOW_NOTICY,
-    SHOW_FULL_SCREEN,
-    SHOW_LOCAL,
-    SHOW_ROUTE_REUSE,
-    SHOW_FOOTER,
-    CONTENT_MODE
-}

package/src/theme/header/helper/menu-tree.ts

@@ -1,67 +0,0 @@
-/** =====================================
- *  定义一些菜单操作的方法
- *  =====================================*/
-import { Menus, useAuthStore } from "@dt-frames/core";
-import { trim } from 'lodash-es'
-
-function deleteChildrenProp( menu: any ) {
-    let obj = { ...menu };
-    delete obj.children;
-
-    return obj;
-}
-
-// 获取当前路由的面包屑
-export function getBreadCrumb(path: string, menus?: Menus[]) {
-    const { getMenus } = useAuthStore()
-    const _menus = menus || getMenus
-
-    let routes: Menus[] = []
-
-    let getParentByPath = ( menu: any, path: string = '' ) => {
-
-        if( menu.children && menu.children.length ) {
-            menu.children.forEach( (subMenu: any) => {
-                subMenu.parentMenus = 
-                    [...menu.parentMenus]
-                    .concat( [ deleteChildrenProp( subMenu ) ] );
-                    
-                getParentByPath( subMenu, path );
-            } )
-        }
-
-        if( menu.url === path ) {
-            routes = menu.parentMenus;
-        }
-    }
-
-    _menus.forEach( (menu: any) => {
-        menu.parentMenus = [ deleteChildrenProp( menu ) ];
-
-        getParentByPath( menu, path );
-    } );
-
-    return routes;
-}
-
-export function getFilterMenu( filter: string = '', flag: boolean = false) {
-    const { getMenus } = useAuthStore()
-
-    let _menus = [];
-
-    if( !trim(filter) && !flag ) return _menus;
-
-    let getTargetMenus = ( menusArr ) => {
-        menusArr.forEach( menu => {
-            if( menu.children && menu.children.length ) {
-                getTargetMenus( menu.children );
-            } else if( menu.label.indexOf( filter ) !== -1 || (flag && !trim(filter))){
-                _menus.push( menu );
-            }
-        } )
-    }
-
-    getTargetMenus( getMenus );
-
-    return _menus;
-}