From 2120e26220bec674cd38bfd7536e2f4fab9bd8f8 Mon Sep 17 00:00:00 2001 From: MTrun <1262327911@qq.com> Date: Mon, 20 Dec 2021 17:38:44 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=AE=8C=E6=88=90dialog=E5=8A=A8?= =?UTF-8?q?=E6=80=81=E5=B0=81=E8=A3=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/enums/pluginEnum.ts | 6 ++ src/utils/plugin.ts | 80 ++++++++++++++----- .../project/items/components/Card/index.vue | 19 +++-- 3 files changed, 81 insertions(+), 24 deletions(-) create mode 100644 src/enums/pluginEnum.ts diff --git a/src/enums/pluginEnum.ts b/src/enums/pluginEnum.ts new file mode 100644 index 00000000..67f5141a --- /dev/null +++ b/src/enums/pluginEnum.ts @@ -0,0 +1,6 @@ +export enum DialogEnum { + delete = 'delete', + warning = 'warning', + error = 'error', + success = 'success' +} diff --git a/src/utils/plugin.ts b/src/utils/plugin.ts index 9cd12611..503f2815 100644 --- a/src/utils/plugin.ts +++ b/src/utils/plugin.ts @@ -1,43 +1,85 @@ import { icon } from '@/plugins' +import { DialogEnum } from '@/enums/pluginEnum' import { dialogIconSize, maskClosable } from '@/settings/designSetting' +import { DialogReactive } from 'naive-ui' const { InformationCircleIcon } = icon.ionicons5 import { renderIcon } from '@/utils' /** - * * render 弹出确认框 + * * render 对话框 * @param { Function } dialogFn dialog函数,暂时必须从页面传过来 * @param { Object} params 配置参数 */ - export const goDialog = ( - dialogFn: Function, +export const goDialog = ( params: { // 基本 - type: 'delete' + type: DialogEnum message?: string + // 回调 onPositiveCallback?: Function onNegativeCallback?: Function - // 渲染函数 - render?: boolean - contentFn?: Function - actionFn?: Function - } + // 异步 + promise?: boolean + promiseResCallback?: Function + promiseRejCallback?: Function + }, + dialogFn?: Function ) => { - const { type, message, onPositiveCallback, onNegativeCallback } = params - const tip = { - delete: '是否删除此数据' + const { + type, + message, + onPositiveCallback, + onNegativeCallback, + promise, + promiseResCallback, + promiseRejCallback + } = params + + const typeObj = { + // 自定义 + delete: { + fn: dialogFn || window['$dialog'].warning, + message: message || '是否删除此数据?' + }, + // 原有 + warning: { + fn: window['$dialog'].warning, + message: message || '是否执行此操作?' + }, + error: { + fn: window['$dialog'].error, + message: message || '是否执行此操作?' + }, + success: { + fn: window['$dialog'].success, + message: message || '是否执行此操作?' + } } - const instance = dialogFn({ + + const d: DialogReactive = (typeObj as any)[type]['fn']({ title: '提示', icon: renderIcon(InformationCircleIcon, { size: dialogIconSize }), - content: message || tip[type] || '', + content: (typeObj as any)[type]['message'], positiveText: '确定', negativeText: '取消', maskClosable: maskClosable, - onPositiveClick: () => { - onPositiveCallback && onPositiveCallback(instance) + onPositiveClick: async () => { + // 执行异步 + if (promise && onPositiveCallback) { + d.loading = true + try { + const res = await onPositiveCallback() + promiseResCallback && promiseResCallback(res) + } catch (err) { + promiseRejCallback && promiseRejCallback(err) + } + d.loading = false + return + } + onPositiveCallback && onPositiveCallback(d) }, - onNegativeClick: () => { - onNegativeCallback && onNegativeCallback(instance) + onNegativeClick: async () => { + onNegativeCallback && onNegativeCallback(d) } }) -} \ No newline at end of file +} diff --git a/src/views/project/items/components/Card/index.vue b/src/views/project/items/components/Card/index.vue index ae7ca0d2..a2712e57 100644 --- a/src/views/project/items/components/Card/index.vue +++ b/src/views/project/items/components/Card/index.vue @@ -4,7 +4,11 @@