爲了快速編寫信息提示代碼,封裝如下
core\helper中增加swalMessage.ts,代碼如下
代碼
import Swal from "sweetalert2"
declare interface SwalMessage {
success(title:string,msg:string);
error(title:string,msg:string);
info(title:string,msg:string);
question(title:string,msg:string);
confirm(title:string,msg:string, callback: any);
}
export default {
success(title:string,msg:string=''){
return Swal.fire({
title: title,
text: msg,
icon: "success",
buttonsStyling: false,
confirmButtonText: "確定",
heightAuto: false,
timer:1500,
customClass: {
confirmButton: "btn fw-semobold btn-light-primary",
},
})
},
error(title:string,msg:string=''){
return Swal.fire({
title: title,
text: msg,
icon: "error",
buttonsStyling: false,
confirmButtonText: "確定",
heightAuto: false,
timer:1500,
customClass: {
confirmButton: "btn fw-semobold btn-light-danger",
},
})
},
info(title:string,msg:string=''){
return Swal.fire({
title: title,
text: msg,
icon: "info",
buttonsStyling: false,
confirmButtonText: "確定",
heightAuto: false,
timer:1500,
customClass: {
confirmButton: "btn fw-semobold btn-light-info",
},
})
},
question(title:string,msg:string=''){
return Swal.fire({
title: title,
text: msg,
icon: "question",
buttonsStyling: false,
confirmButtonText: "確定",
heightAuto: false,
timer:1500,
customClass: {
confirmButton: "btn fw-semobold btn-light-info",
},
})
},
confirm(title, msg, callback: any){
return Swal.fire({
title: title,
icon: "question",
text: msg,
showCloseButton: true,
showCancelButton: true,
focusConfirm: false,
confirmButtonText: `確定`,
cancelButtonText: `取消`,
}).then((result)=>{
if (result.value) {
callback();
}
})
},
}
使用
swalMessage.success('登錄成功!').then(f=>{
//提示完成後,繼續執行的代碼
})
swalMessage.confirm('確定刪除?','一旦操作,不可恢復',function (){
ApiService.delete(url.InfoGroupDelete+'?id='+id)
.then(({data}) => {
//當爲確認的時候執行的代碼
swalMessage.success("操作成功!")
})
.catch(({response}) => {
});
})