index.ts 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. import { ref } from "vue";
  2. import reDrawer from "./index.vue";
  3. import { useTimeoutFn } from "@vueuse/core";
  4. import { withInstall } from "@pureadmin/utils";
  5. import type {
  6. EventType,
  7. ArgsType,
  8. DrawerProps,
  9. DrawerOptions,
  10. ButtonProps
  11. } from "./type";
  12. const drawerStore = ref<Array<DrawerOptions>>([]);
  13. /** 打开抽屉 */
  14. const addDrawer = (options: DrawerOptions) => {
  15. const open = () =>
  16. drawerStore.value.push(Object.assign(options, { visible: true }));
  17. if (options?.openDelay) {
  18. useTimeoutFn(() => {
  19. open();
  20. }, options.openDelay);
  21. } else {
  22. open();
  23. }
  24. };
  25. /** 关闭抽屉 */
  26. const closeDrawer = (options: DrawerOptions, index: number, args?: any) => {
  27. drawerStore.value[index].visible = false;
  28. options.closeCallBack && options.closeCallBack({ options, index, args });
  29. const closeDelay = options?.closeDelay ?? 200;
  30. useTimeoutFn(() => {
  31. drawerStore.value.splice(index, 1);
  32. }, closeDelay);
  33. };
  34. /**
  35. * @description 更改抽屉自身属性值
  36. * @param value 属性值
  37. * @param key 属性,默认`title`
  38. * @param index 弹框索引(默认`0`,代表只有一个弹框,对于嵌套弹框要改哪个弹框的属性值就把该弹框索引赋给`index`)
  39. */
  40. const updateDrawer = (value: any, key = "title", index = 0) => {
  41. drawerStore.value[index][key] = value;
  42. };
  43. /** 关闭所有弹框 */
  44. const closeAllDrawer = () => {
  45. drawerStore.value = [];
  46. };
  47. const ReDrawer = withInstall(reDrawer);
  48. export type { EventType, ArgsType, DrawerOptions, DrawerProps, ButtonProps };
  49. export {
  50. ReDrawer,
  51. drawerStore,
  52. addDrawer,
  53. closeDrawer,
  54. updateDrawer,
  55. closeAllDrawer
  56. };