You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
98 lines
3.5 KiB
98 lines
3.5 KiB
5 years ago
|
<template>
|
||
|
<v-dialog v-model="modal" width="40%" transition="slide-x-transition">
|
||
|
<v-card class="RTL">
|
||
|
<v-card-title class="red lighten-5" primary-title>
|
||
|
<WM-PartTitle
|
||
|
class="WM-Margin-T-20"
|
||
5 years ago
|
:TitleFa="getDialogProperties.title || defaultMessage[type].title"
|
||
|
:TitleEn="getDialogProperties.titleEn || defaultMessage[type].titleEn"
|
||
|
:Color="getDialogProperties.color || defaultMessage[type].color"
|
||
5 years ago
|
></WM-PartTitle>
|
||
|
</v-card-title>
|
||
|
<v-card-text>
|
||
5 years ago
|
<div class="WM-Align-R WM-Margin-T-10">{{ getDialogProperties.message || defaultMessage[type].message }}</div>
|
||
5 years ago
|
</v-card-text>
|
||
|
|
||
|
<v-divider></v-divider>
|
||
|
<v-card-actions>
|
||
|
<v-spacer></v-spacer>
|
||
5 years ago
|
<v-btn :color="getDialogProperties.cancelButtonColor || defaultMessage[type].cancelButtonColor" @click="cancel" depressed dark>
|
||
5 years ago
|
<v-icon dark right>fas fa-times</v-icon>
|
||
5 years ago
|
{{getDialogProperties.cancelButtonText || defaultMessage[type].cancelButtonText}}
|
||
5 years ago
|
</v-btn>
|
||
5 years ago
|
<v-btn :color="getDialogProperties.confirmButtonColor || defaultMessage[type].confirmButtonColor" depressed dark @click="confirm">
|
||
5 years ago
|
<v-icon dark right>fas fa-trash-alt</v-icon>
|
||
5 years ago
|
{{getDialogProperties.confirmButtonText || defaultMessage[type].confirmButtonText}}
|
||
5 years ago
|
</v-btn>
|
||
|
</v-card-actions>
|
||
|
</v-card>
|
||
|
</v-dialog>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import { mapActions, mapGetters } from 'vuex';
|
||
|
export default {
|
||
|
data: () => ({
|
||
|
defaultMessage: {
|
||
|
delete: {
|
||
5 years ago
|
success: function() {
|
||
5 years ago
|
return "";
|
||
|
},
|
||
5 years ago
|
close: function() {
|
||
5 years ago
|
return "";
|
||
|
},
|
||
|
message:
|
||
|
"آیا از حذف آیتم مطمئن هستید؟ امکان بازگشت وجود نخواهد داشت.",
|
||
|
title: " تایید حذف ",
|
||
|
titleEn: " Remove Confirmation ",
|
||
|
color: "red",
|
||
|
cancelButtonText: "انصراف",
|
||
|
confirmButtonText: "حذف",
|
||
|
cancelButtonColor: "cyan",
|
||
|
confirmButtonColor: "red"
|
||
|
},
|
||
|
},
|
||
|
type: 'delete'
|
||
|
}),
|
||
|
watch: {
|
||
5 years ago
|
getDialogType(type) {
|
||
5 years ago
|
if (["delete"].includes(type)) {
|
||
|
this.type = type;
|
||
|
} else {
|
||
|
this.type = "delete";
|
||
|
}
|
||
|
}
|
||
|
},
|
||
|
computed:{
|
||
5 years ago
|
...mapGetters('modal', ['getDialogType', 'getDialogProperties', 'isModal']),
|
||
5 years ago
|
modal: {
|
||
|
get() {
|
||
5 years ago
|
return this.isModal("modal/dialog");
|
||
5 years ago
|
},
|
||
|
set(value) {
|
||
|
if (value) {
|
||
5 years ago
|
this.$_openModal("modal/dialog");
|
||
5 years ago
|
} else {
|
||
5 years ago
|
this.$_closeModal("modal/dialog");
|
||
5 years ago
|
}
|
||
|
}
|
||
|
}
|
||
|
},
|
||
|
methods: {
|
||
|
async confirm() {
|
||
|
|
||
5 years ago
|
if(typeof this.getDialogProperties.success == 'function') {
|
||
|
await this.getDialogProperties.success();
|
||
5 years ago
|
}
|
||
5 years ago
|
this.$_closeModal('modal/dialog');
|
||
5 years ago
|
},
|
||
|
async cancel() {
|
||
5 years ago
|
if(typeof this.getDialogProperties.close == 'function') {
|
||
|
await this.getDialogProperties.close();
|
||
5 years ago
|
}
|
||
5 years ago
|
this.$_closeModal('modal/dialog');
|
||
5 years ago
|
}
|
||
|
}
|
||
|
};
|
||
|
</script>
|