mirror of
https://github.com/pure-admin/vue-pure-admin.git
synced 2025-06-07 08:57:19 +08:00
fix: 组件ReDrawer 增加按钮loading等功能
This commit is contained in:
parent
99d67ed1f7
commit
58ca706846
@ -6,12 +6,14 @@ import {
|
|||||||
closeDrawer,
|
closeDrawer,
|
||||||
drawerStore
|
drawerStore
|
||||||
} from "./index";
|
} from "./index";
|
||||||
import { computed } from "vue";
|
import { computed, ref } from "vue";
|
||||||
import { isFunction } from "@pureadmin/utils";
|
import { isFunction } from "@pureadmin/utils";
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: "ReDrawer"
|
name: "ReDrawer"
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const sureBtnMap = ref({});
|
||||||
|
|
||||||
const footerButtons = computed(() => {
|
const footerButtons = computed(() => {
|
||||||
return (options: DrawerOptions) => {
|
return (options: DrawerOptions) => {
|
||||||
return options?.footerButtons?.length > 0
|
return options?.footerButtons?.length > 0
|
||||||
@ -38,10 +40,26 @@ const footerButtons = computed(() => {
|
|||||||
bg: true,
|
bg: true,
|
||||||
popConfirm: options?.popConfirm,
|
popConfirm: options?.popConfirm,
|
||||||
btnClick: ({ drawer: { options, index } }) => {
|
btnClick: ({ drawer: { options, index } }) => {
|
||||||
const done = () =>
|
if (options?.sureBtnLoading) {
|
||||||
|
sureBtnMap.value[index] = Object.assign(
|
||||||
|
{},
|
||||||
|
sureBtnMap.value[index],
|
||||||
|
{
|
||||||
|
loading: true
|
||||||
|
}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
const closeLoading = () => {
|
||||||
|
if (options?.sureBtnLoading) {
|
||||||
|
sureBtnMap.value[index].loading = false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const done = () => {
|
||||||
|
closeLoading();
|
||||||
closeDrawer(options, index, { command: "sure" });
|
closeDrawer(options, index, { command: "sure" });
|
||||||
|
};
|
||||||
if (options?.beforeSure && isFunction(options?.beforeSure)) {
|
if (options?.beforeSure && isFunction(options?.beforeSure)) {
|
||||||
options.beforeSure(done, { options, index });
|
options.beforeSure(done, { options, index, closeLoading });
|
||||||
} else {
|
} else {
|
||||||
done();
|
done();
|
||||||
}
|
}
|
||||||
@ -131,6 +149,7 @@ function handleClose(
|
|||||||
<el-button
|
<el-button
|
||||||
v-else
|
v-else
|
||||||
v-bind="btn"
|
v-bind="btn"
|
||||||
|
:loading="key === 1 && sureBtnMap[index]?.loading"
|
||||||
@click="
|
@click="
|
||||||
btn.btnClick({
|
btn.btnClick({
|
||||||
drawer: { options, index },
|
drawer: { options, index },
|
||||||
|
@ -30,6 +30,8 @@ type DrawerProps = {
|
|||||||
closeOnClickModal?: boolean;
|
closeOnClickModal?: boolean;
|
||||||
/** 是否可以通过按下 ESC 关闭 Drawer ,默认 `true` */
|
/** 是否可以通过按下 ESC 关闭 Drawer ,默认 `true` */
|
||||||
closeOnPressEscape?: boolean;
|
closeOnPressEscape?: boolean;
|
||||||
|
/** 是否显示关闭按钮,默认 `true` */
|
||||||
|
showClose?: boolean;
|
||||||
/** `Drawer` 打开的延时时间,单位毫秒,默认 `0` */
|
/** `Drawer` 打开的延时时间,单位毫秒,默认 `0` */
|
||||||
openDelay?: number;
|
openDelay?: number;
|
||||||
/** `Drawer` 关闭的延时时间,单位毫秒,默认 `0` */
|
/** `Drawer` 关闭的延时时间,单位毫秒,默认 `0` */
|
||||||
@ -153,6 +155,8 @@ interface DrawerOptions extends DrawerProps {
|
|||||||
hideFooter?: boolean;
|
hideFooter?: boolean;
|
||||||
/** 确认按钮的 `PopConfirm` 气泡确认框相关配置 */
|
/** 确认按钮的 `PopConfirm` 气泡确认框相关配置 */
|
||||||
popConfirm?: PopConfirm;
|
popConfirm?: PopConfirm;
|
||||||
|
/** 点击确定按钮后是否开启 `loading` 加载动画 */
|
||||||
|
sureBtnLoading?: boolean;
|
||||||
/**
|
/**
|
||||||
* @description 自定义抽屉标题的内容渲染器
|
* @description 自定义抽屉标题的内容渲染器
|
||||||
* @see {@link https://element-plus.org/zh-CN/component/drawer.html#%E6%8F%92%E6%A7%BD}
|
* @see {@link https://element-plus.org/zh-CN/component/drawer.html#%E6%8F%92%E6%A7%BD}
|
||||||
@ -243,10 +247,12 @@ interface DrawerOptions extends DrawerProps {
|
|||||||
done: Function,
|
done: Function,
|
||||||
{
|
{
|
||||||
options,
|
options,
|
||||||
index
|
index,
|
||||||
|
closeLoading
|
||||||
}: {
|
}: {
|
||||||
options: DrawerOptions;
|
options: DrawerOptions;
|
||||||
index: number;
|
index: number;
|
||||||
|
closeLoading: Function;
|
||||||
}
|
}
|
||||||
) => void;
|
) => void;
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user