chore: 移除 useTimeoutFn文件,使用 vueuse
This commit is contained in:
parent
feadf64ee3
commit
fa18365c21
|
|
@ -1,3 +1,5 @@
|
||||||
export * from './onMountedOrActivated';
|
export * from './onMountedOrActivated';
|
||||||
export * from './useAttrs';
|
export * from './useAttrs';
|
||||||
export * from './useRefs';
|
export * from './useRefs';
|
||||||
|
|
||||||
|
export { useTimeoutFn } from '@vueuse/core';
|
||||||
|
|
|
||||||
|
|
@ -19,8 +19,8 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import type { PropType } from 'vue';
|
import type { PropType } from 'vue';
|
||||||
import { defineComponent, reactive, onMounted, ref, toRef, toRefs } from 'vue';
|
import { defineComponent, reactive, onMounted, ref, toRef, toRefs } from 'vue';
|
||||||
|
import { useTimeoutFn } from '@vben/hooks';
|
||||||
import { Skeleton } from 'ant-design-vue';
|
import { Skeleton } from 'ant-design-vue';
|
||||||
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
|
|
||||||
import { useIntersectionObserver } from '/@/hooks/event/useIntersectionObserver';
|
import { useIntersectionObserver } from '/@/hooks/event/useIntersectionObserver';
|
||||||
|
|
||||||
interface State {
|
interface State {
|
||||||
|
|
|
||||||
|
|
@ -2,10 +2,10 @@
|
||||||
import { ref, unref, defineComponent, type PropType, type ExtractPropTypes } from 'vue';
|
import { ref, unref, defineComponent, type PropType, type ExtractPropTypes } from 'vue';
|
||||||
import { isNil } from 'lodash-es';
|
import { isNil } from 'lodash-es';
|
||||||
import { Skeleton } from 'ant-design-vue';
|
import { Skeleton } from 'ant-design-vue';
|
||||||
|
import { useTimeoutFn } from '@vben/hooks';
|
||||||
import { CollapseTransition } from '/@/components/Transition';
|
import { CollapseTransition } from '/@/components/Transition';
|
||||||
import CollapseHeader from './CollapseHeader.vue';
|
import CollapseHeader from './CollapseHeader.vue';
|
||||||
import { triggerWindowResize } from '/@/utils/event';
|
import { triggerWindowResize } from '/@/utils/event';
|
||||||
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
|
|
||||||
import { useDesign } from '/@/hooks/web/useDesign';
|
import { useDesign } from '/@/hooks/web/useDesign';
|
||||||
|
|
||||||
const collapseContainerProps = {
|
const collapseContainerProps = {
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,11 @@
|
||||||
import { MenuModeEnum } from '/@/enums/menuEnum';
|
import { MenuModeEnum } from '/@/enums/menuEnum';
|
||||||
import type { Menu as MenuType } from '/@/router/types';
|
import type { Menu as MenuType } from '/@/router/types';
|
||||||
import type { MenuState } from './types';
|
import type { MenuState } from './types';
|
||||||
|
|
||||||
import { computed, Ref, toRaw, unref } from 'vue';
|
import { computed, Ref, toRaw, unref } from 'vue';
|
||||||
|
import { useTimeoutFn } from '@vben/hooks';
|
||||||
import { uniq } from 'lodash-es';
|
import { uniq } from 'lodash-es';
|
||||||
import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
|
import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
|
||||||
import { getAllParentPath } from '/@/router/helper/menuHelper';
|
import { getAllParentPath } from '/@/router/helper/menuHelper';
|
||||||
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
|
|
||||||
|
|
||||||
export function useOpenKeys(
|
export function useOpenKeys(
|
||||||
menuState: MenuState,
|
menuState: MenuState,
|
||||||
|
|
@ -22,22 +20,23 @@ export function useOpenKeys(
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const native = unref(getIsMixSidebar);
|
const native = unref(getIsMixSidebar);
|
||||||
useTimeoutFn(
|
const handle = () => {
|
||||||
() => {
|
const menuList = toRaw(menus.value);
|
||||||
const menuList = toRaw(menus.value);
|
if (menuList?.length === 0) {
|
||||||
if (menuList?.length === 0) {
|
menuState.openKeys = [];
|
||||||
menuState.openKeys = [];
|
return;
|
||||||
return;
|
}
|
||||||
}
|
if (!unref(accordion)) {
|
||||||
if (!unref(accordion)) {
|
menuState.openKeys = uniq([...menuState.openKeys, ...getAllParentPath(menuList, path)]);
|
||||||
menuState.openKeys = uniq([...menuState.openKeys, ...getAllParentPath(menuList, path)]);
|
} else {
|
||||||
} else {
|
menuState.openKeys = getAllParentPath(menuList, path);
|
||||||
menuState.openKeys = getAllParentPath(menuList, path);
|
}
|
||||||
}
|
};
|
||||||
},
|
if (native) {
|
||||||
16,
|
handle();
|
||||||
!native,
|
} else {
|
||||||
);
|
useTimeoutFn(handle, 16);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const getOpenKeys = computed(() => {
|
const getOpenKeys = computed(() => {
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
import { Ref, unref, watchEffect } from 'vue';
|
import { Ref, unref, watchEffect } from 'vue';
|
||||||
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
|
import { useTimeoutFn } from '@vben/hooks';
|
||||||
|
|
||||||
export interface UseModalDragMoveContext {
|
export interface UseModalDragMoveContext {
|
||||||
draggable: Ref<boolean>;
|
draggable: Ref<boolean>;
|
||||||
|
|
|
||||||
|
|
@ -1,12 +1,9 @@
|
||||||
import type { Menu as MenuType } from '/@/router/types';
|
import type { Menu as MenuType } from '/@/router/types';
|
||||||
import type { MenuState } from './types';
|
import type { MenuState } from './types';
|
||||||
|
|
||||||
import { computed, Ref, toRaw, unref } from 'vue';
|
import { computed, Ref, toRaw, unref } from 'vue';
|
||||||
|
|
||||||
import { uniq } from 'lodash-es';
|
import { uniq } from 'lodash-es';
|
||||||
import { getAllParentPath } from '/@/router/helper/menuHelper';
|
import { getAllParentPath } from '/@/router/helper/menuHelper';
|
||||||
|
import { useTimeoutFn } from '@vben/hooks';
|
||||||
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
|
|
||||||
import { useDebounceFn } from '@vueuse/core';
|
import { useDebounceFn } from '@vueuse/core';
|
||||||
|
|
||||||
export function useOpenKeys(
|
export function useOpenKeys(
|
||||||
|
|
@ -20,25 +17,27 @@ export function useOpenKeys(
|
||||||
async function setOpenKeys(path: string) {
|
async function setOpenKeys(path: string) {
|
||||||
const native = !mixSider.value;
|
const native = !mixSider.value;
|
||||||
const menuList = toRaw(menus.value);
|
const menuList = toRaw(menus.value);
|
||||||
useTimeoutFn(
|
|
||||||
() => {
|
|
||||||
if (menuList?.length === 0) {
|
|
||||||
menuState.activeSubMenuNames = [];
|
|
||||||
menuState.openNames = [];
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const keys = getAllParentPath(menuList, path);
|
|
||||||
|
|
||||||
if (!unref(accordion)) {
|
const handle = () => {
|
||||||
menuState.openNames = uniq([...menuState.openNames, ...keys]);
|
if (menuList?.length === 0) {
|
||||||
} else {
|
menuState.activeSubMenuNames = [];
|
||||||
menuState.openNames = keys;
|
menuState.openNames = [];
|
||||||
}
|
return;
|
||||||
menuState.activeSubMenuNames = menuState.openNames;
|
}
|
||||||
},
|
const keys = getAllParentPath(menuList, path);
|
||||||
30,
|
|
||||||
native,
|
if (!unref(accordion)) {
|
||||||
);
|
menuState.openNames = uniq([...menuState.openNames, ...keys]);
|
||||||
|
} else {
|
||||||
|
menuState.openNames = keys;
|
||||||
|
}
|
||||||
|
menuState.activeSubMenuNames = menuState.openNames;
|
||||||
|
};
|
||||||
|
if (native) {
|
||||||
|
handle();
|
||||||
|
} else {
|
||||||
|
useTimeoutFn(handle, 30);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const getOpenKeys = computed(() => {
|
const getOpenKeys = computed(() => {
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,7 @@ import {
|
||||||
Ref,
|
Ref,
|
||||||
watchEffect,
|
watchEffect,
|
||||||
} from 'vue';
|
} from 'vue';
|
||||||
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
|
import { useTimeoutFn } from '@vben/hooks';
|
||||||
import { buildUUID } from '/@/utils/uuid';
|
import { buildUUID } from '/@/utils/uuid';
|
||||||
import { isFunction, isBoolean, isObject } from '/@/utils/is';
|
import { isFunction, isBoolean, isObject } from '/@/utils/is';
|
||||||
import { get, cloneDeep, merge } from 'lodash-es';
|
import { get, cloneDeep, merge } from 'lodash-es';
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
<script lang="tsx">
|
<script lang="tsx">
|
||||||
import type { Ref } from 'vue';
|
import type { Ref } from 'vue';
|
||||||
import { defineComponent, ref, computed, unref, reactive, watch, watchEffect } from 'vue';
|
import { defineComponent, ref, computed, unref, reactive, watch, watchEffect } from 'vue';
|
||||||
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
|
import { useTimeoutFn } from '@vben/hooks';
|
||||||
import { useEventListener } from '/@/hooks/event/useEventListener';
|
import { useEventListener } from '/@/hooks/event/useEventListener';
|
||||||
import { basicProps } from './props';
|
import { basicProps } from './props';
|
||||||
import { getSlot } from '/@/utils/helper/tsxHelper';
|
import { getSlot } from '/@/utils/helper/tsxHelper';
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
<script lang="tsx">
|
<script lang="tsx">
|
||||||
import type { MoveData, DragVerifyActionType } from './typing';
|
import type { MoveData, DragVerifyActionType } from './typing';
|
||||||
import { defineComponent, computed, unref, reactive, watch, ref } from 'vue';
|
import { defineComponent, computed, unref, reactive, watch, ref } from 'vue';
|
||||||
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
|
import { useTimeoutFn } from '@vben/hooks';
|
||||||
import BasicDragVerify from './DragVerify.vue';
|
import BasicDragVerify from './DragVerify.vue';
|
||||||
import { hackCss } from '/@/utils/domUtils';
|
import { hackCss } from '/@/utils/domUtils';
|
||||||
import { rotateProps } from './props';
|
import { rotateProps } from './props';
|
||||||
|
|
|
||||||
|
|
@ -1,45 +0,0 @@
|
||||||
import { ref, watch } from 'vue';
|
|
||||||
import { tryOnUnmounted } from '@vueuse/core';
|
|
||||||
import { isFunction } from '/@/utils/is';
|
|
||||||
|
|
||||||
export function useTimeoutFn(handle: Fn<any>, wait: number, native = false) {
|
|
||||||
if (!isFunction(handle)) {
|
|
||||||
throw new Error('handle is not Function!');
|
|
||||||
}
|
|
||||||
|
|
||||||
const { readyRef, stop, start } = useTimeoutRef(wait);
|
|
||||||
if (native) {
|
|
||||||
handle();
|
|
||||||
} else {
|
|
||||||
watch(
|
|
||||||
readyRef,
|
|
||||||
(maturity) => {
|
|
||||||
maturity && handle();
|
|
||||||
},
|
|
||||||
{ immediate: false },
|
|
||||||
);
|
|
||||||
}
|
|
||||||
return { readyRef, stop, start };
|
|
||||||
}
|
|
||||||
|
|
||||||
export function useTimeoutRef(wait: number) {
|
|
||||||
const readyRef = ref(false);
|
|
||||||
|
|
||||||
let timer: TimeoutHandle;
|
|
||||||
function stop(): void {
|
|
||||||
readyRef.value = false;
|
|
||||||
timer && window.clearTimeout(timer);
|
|
||||||
}
|
|
||||||
function start(): void {
|
|
||||||
stop();
|
|
||||||
timer = setTimeout(() => {
|
|
||||||
readyRef.value = true;
|
|
||||||
}, wait);
|
|
||||||
}
|
|
||||||
|
|
||||||
start();
|
|
||||||
|
|
||||||
tryOnUnmounted(stop);
|
|
||||||
|
|
||||||
return { readyRef, stop, start };
|
|
||||||
}
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import type { EChartsOption } from 'echarts';
|
import type { EChartsOption } from 'echarts';
|
||||||
import type { Ref } from 'vue';
|
import type { Ref } from 'vue';
|
||||||
import { useTimeoutFn } from '/@/hooks/core/useTimeout';
|
import { useTimeoutFn } from '@vben/hooks';
|
||||||
import { tryOnUnmounted, useDebounceFn } from '@vueuse/core';
|
import { tryOnUnmounted, useDebounceFn } from '@vueuse/core';
|
||||||
import { unref, nextTick, watch, computed, ref } from 'vue';
|
import { unref, nextTick, watch, computed, ref } from 'vue';
|
||||||
import { useEventListener } from '/@/hooks/event/useEventListener';
|
import { useEventListener } from '/@/hooks/event/useEventListener';
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue