update 新增修改操作 改为 buttonLoading 有效防止重复提交 减少全局loading闪屏 用户体验极佳
This commit is contained in:
@ -251,7 +251,7 @@
|
|||||||
#end
|
#end
|
||||||
</el-form>
|
</el-form>
|
||||||
<div slot="footer" class="dialog-footer">
|
<div slot="footer" class="dialog-footer">
|
||||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||||
<el-button @click="cancel">取 消</el-button>
|
<el-button @click="cancel">取 消</el-button>
|
||||||
</div>
|
</div>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
@ -273,6 +273,8 @@ export default {
|
|||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
// 按钮loading
|
||||||
|
buttonLoading: false,
|
||||||
// 遮罩层
|
// 遮罩层
|
||||||
loading: true,
|
loading: true,
|
||||||
// 显示搜索条件
|
// 显示搜索条件
|
||||||
@ -441,6 +443,7 @@ export default {
|
|||||||
submitForm() {
|
submitForm() {
|
||||||
this.#[[$]]#refs["form"].validate(valid => {
|
this.#[[$]]#refs["form"].validate(valid => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
|
this.buttonLoading = true;
|
||||||
#foreach ($column in $columns)
|
#foreach ($column in $columns)
|
||||||
#if($column.htmlType == "checkbox")
|
#if($column.htmlType == "checkbox")
|
||||||
this.form.$column.javaField = this.form.${column.javaField}.join(",");
|
this.form.$column.javaField = this.form.${column.javaField}.join(",");
|
||||||
@ -451,12 +454,18 @@ export default {
|
|||||||
this.#[[$modal]]#.msgSuccess("修改成功");
|
this.#[[$modal]]#.msgSuccess("修改成功");
|
||||||
this.open = false;
|
this.open = false;
|
||||||
this.getList();
|
this.getList();
|
||||||
|
}).finally(() => {
|
||||||
|
// 防止异常loading不关闭
|
||||||
|
this.buttonLoading = false;
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
add${BusinessName}(this.form).then(response => {
|
add${BusinessName}(this.form).then(response => {
|
||||||
this.#[[$modal]]#.msgSuccess("新增成功");
|
this.#[[$modal]]#.msgSuccess("新增成功");
|
||||||
this.open = false;
|
this.open = false;
|
||||||
this.getList();
|
this.getList();
|
||||||
|
}).finally(() => {
|
||||||
|
// 防止异常loading不关闭
|
||||||
|
this.buttonLoading = false;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -305,7 +305,7 @@
|
|||||||
#end
|
#end
|
||||||
</el-form>
|
</el-form>
|
||||||
<div slot="footer" class="dialog-footer">
|
<div slot="footer" class="dialog-footer">
|
||||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||||
<el-button @click="cancel">取 消</el-button>
|
<el-button @click="cancel">取 消</el-button>
|
||||||
</div>
|
</div>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
@ -322,6 +322,8 @@ export default {
|
|||||||
#end
|
#end
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
// 按钮loading
|
||||||
|
buttonLoading: false,
|
||||||
// 遮罩层
|
// 遮罩层
|
||||||
loading: true,
|
loading: true,
|
||||||
// 导出遮罩层
|
// 导出遮罩层
|
||||||
@ -493,6 +495,7 @@ export default {
|
|||||||
submitForm() {
|
submitForm() {
|
||||||
this.#[[$]]#refs["form"].validate(valid => {
|
this.#[[$]]#refs["form"].validate(valid => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
|
this.buttonLoading = true;
|
||||||
#foreach ($column in $columns)
|
#foreach ($column in $columns)
|
||||||
#if($column.htmlType == "checkbox")
|
#if($column.htmlType == "checkbox")
|
||||||
this.form.$column.javaField = this.form.${column.javaField}.join(",");
|
this.form.$column.javaField = this.form.${column.javaField}.join(",");
|
||||||
@ -506,12 +509,18 @@ export default {
|
|||||||
this.#[[$modal]]#.msgSuccess("修改成功");
|
this.#[[$modal]]#.msgSuccess("修改成功");
|
||||||
this.open = false;
|
this.open = false;
|
||||||
this.getList();
|
this.getList();
|
||||||
|
}).finally(() => {
|
||||||
|
// 防止异常loading不关闭
|
||||||
|
this.buttonLoading = false;
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
add${BusinessName}(this.form).then(response => {
|
add${BusinessName}(this.form).then(response => {
|
||||||
this.#[[$modal]]#.msgSuccess("新增成功");
|
this.#[[$modal]]#.msgSuccess("新增成功");
|
||||||
this.open = false;
|
this.open = false;
|
||||||
this.getList();
|
this.getList();
|
||||||
|
}).finally(() => {
|
||||||
|
// 防止异常loading不关闭
|
||||||
|
this.buttonLoading = false;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user