mixin dialog and modal

package-lock.json

@@ -10875,6 +10875,11 @@
             "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=",
             "dev": true
         },
+        "vee-validate": {
+            "version": "2.2.15",
+            "resolved": "https://registry.npmjs.org/vee-validate/-/vee-validate-2.2.15.tgz",
+            "integrity": "sha512-4TOsI8XwVkKVLkg8Nhmy+jyoJrR6XcTRDyxBarzcCvYzU61zamipS1WsB6FlDze8eJQpgglS4NXAS6o4NDPs1g=="
+        },
         "vendors": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.2.tgz",

package.json

@@ -29,6 +29,7 @@
         "graphql-tag": "^2.10.1",
         "jalali-moment": "^3.3.3",
         "loadash": "^1.0.0",
+        "vee-validate": "^2.2.15",
         "vue-apexcharts": "^1.4.0",
         "vue-apollo": "^3.0.0-alpha.3",
         "vue-chartjs": "^3.4.0",

public/mix-manifest.json

@@ -1,7 +1,7 @@
 {
-    "/js/vue/Authentication/app.js": "/js/vue/Authentication/app.js?id=edc3c72e1006f0f5c9a9",
+    "/js/vue/Authentication/app.js": "/js/vue/Authentication/app.js?id=75e2b3f58f212d5e8f48",
-    "/js/vue/Home/app.js": "/js/vue/Home/app.js?id=72ca373c83375a1dbe0b",
+    "/js/vue/Home/app.js": "/js/vue/Home/app.js?id=49fd19f4521a4eb26375",
-    "/js/vue/Modules/CRM/app.js": "/js/vue/Modules/CRM/app.js?id=03592ff04d0ec3cea27b",
+    "/js/vue/Modules/CRM/app.js": "/js/vue/Modules/CRM/app.js?id=54352e041f006e06e650",
-    "/js/vue/Modules/Reservation/app.js": "/js/vue/Modules/Reservation/app.js?id=65d80bc6799294ce9444",
+    "/js/vue/Modules/Reservation/app.js": "/js/vue/Modules/Reservation/app.js?id=043db3597a61bd6c17ce",
-    "/js/vue/User/app.js": "/js/vue/User/app.js?id=e08d6d83816bb1be1a4d"
+    "/js/vue/User/app.js": "/js/vue/User/app.js?id=8d1ceb454e7e8e475706"
 }

resources/js/Global/components/Misc/Dialog.vue

@@ -4,25 +4,25 @@
             <v-card-title class="red lighten-5" primary-title>
                 <WM-PartTitle
                     class="WM-Margin-T-20"
-                    :TitleFa="getAlertProperties.title || defaultMessage[type].title"
+                    :TitleFa="getDialogProperties.title || defaultMessage[type].title"
-                    :TitleEn="getAlertProperties.titleEn || defaultMessage[type].titleEn"
+                    :TitleEn="getDialogProperties.titleEn || defaultMessage[type].titleEn"
-                    :Color="getAlertProperties.color || defaultMessage[type].color"
+                    :Color="getDialogProperties.color || defaultMessage[type].color"
                 ></WM-PartTitle>
             </v-card-title>
             <v-card-text>
-                <div class="WM-Align-R WM-Margin-T-10">{{ getAlertProperties.message || defaultMessage[type].message }}</div>
+                <div class="WM-Align-R WM-Margin-T-10">{{ getDialogProperties.message || defaultMessage[type].message }}</div>
             </v-card-text>
 
             <v-divider></v-divider>
             <v-card-actions>
                 <v-spacer></v-spacer>
-                <v-btn :color="getAlertProperties.cancelButtonColor || defaultMessage[type].cancelButtonColor" @click="cancel" depressed dark>
+                <v-btn :color="getDialogProperties.cancelButtonColor || defaultMessage[type].cancelButtonColor" @click="cancel" depressed dark>
                     <v-icon dark right>fas fa-times</v-icon>
-                    {{getAlertProperties.cancelButtonText || defaultMessage[type].cancelButtonText}}
+                    {{getDialogProperties.cancelButtonText || defaultMessage[type].cancelButtonText}}
                 </v-btn>
-                <v-btn :color="getAlertProperties.confirmButtonColor || defaultMessage[type].confirmButtonColor" depressed dark @click="confirm">
+                <v-btn :color="getDialogProperties.confirmButtonColor || defaultMessage[type].confirmButtonColor" depressed dark @click="confirm">
                     <v-icon dark right>fas fa-trash-alt</v-icon>
-                    {{getAlertProperties.confirmButtonText || defaultMessage[type].confirmButtonText}}
+                    {{getDialogProperties.confirmButtonText || defaultMessage[type].confirmButtonText}}
                 </v-btn>
             </v-card-actions>
         </v-card>
@@ -35,10 +35,10 @@ export default {
     data: () => ({
         defaultMessage: {
             delete: {
-                onConfirm: function() {
+                success: function() {
                     return "";
                 },
-                onCancel: function() {
+                close: function() {
                     return "";
                 },
                 message:
@@ -55,7 +55,7 @@ export default {
         type: 'delete'
     }),
     watch: {
-        getAlertType(type) {
+        getDialogType(type) {
             if (["delete"].includes(type)) {
                 this.type = type;
             } else {
@@ -64,34 +64,33 @@ export default {
         }
     },
     computed:{
-        ...mapGetters('modal', ['getAlertType', 'getAlertProperties', 'isModal']),
+        ...mapGetters('modal', ['getDialogType', 'getDialogProperties', 'isModal']),
         modal: {
             get() {
-                return this.isModal("modal/alert");
+                return this.isModal("modal/dialog");
             },
             set(value) {
                 if (value) {
-                    this.openModal("modal/alert");
+                    this.$_openModal("modal/dialog");
                 } else {
-                    this.closeModal("modal/alert");
+                    this.$_closeModal("modal/dialog");
                 }
             }
         }
     },
     methods: {
-        ...mapActions('modal', ['closeModal']),
         async confirm() {
             
-            if(typeof this.getAlertProperties.onConfirm == 'function') {
+            if(typeof this.getDialogProperties.success == 'function') {
-                await this.getAlertProperties.onConfirm();
+                await this.getDialogProperties.success();
             }
-            this.closeModal('modal/alert');
+            this.$_closeModal('modal/dialog');
         },
         async cancel() {
-            if(typeof this.getAlertProperties.onCancel == 'function') {
+            if(typeof this.getDialogProperties.close == 'function') {
-                await this.getAlertProperties.onCancel();
+                await this.getDialogProperties.close();
             }
-            this.closeModal('modal/alert');
+            this.$_closeModal('modal/dialog');
         }
     }
 };

resources/js/Global/mixins/commingSoon.js

@@ -0,0 +1,32 @@
+var CommingSoonArray = [
+    "document",
+    "discount",
+    "transaction",
+    "email",
+    "sms",
+
+    
+    "crm-setting",
+    "crm-client-filter",
+    "crm-statistics",
+    "crm-myRequest",
+    "crm-myTasks",
+    
+    "user-list-filter",
+    "user-roles",
+    
+    "main-reservation",
+    
+];
+const commingSoon = {
+    methods: {
+        $_inCommingSoon(option) {
+            if(process.env.MIX_PUSHER_APP_PRODUCT == 'false' || !CommingSoonArray.includes(option)) {
+                return true;
+            }
+            return false;
+        }
+    }
+};
+
+export { commingSoon };

resources/js/Global/mixins/hasRole.js

@@ -0,0 +1,6 @@
+import { mapActions } from 'vuex'
+const hasRole = {
+    
+};
+
+export {hasRole}

resources/js/Global/mixins/modal.js

@@ -0,0 +1,17 @@
+import { mapActions, mapGetters } from "vuex";
+const modal = {
+    methods: {
+        ...mapActions("modal", ["openModal", "closeModal", "dialog"]),
+        $_openModal(options) {
+            this.openModal(options);
+        },
+        $_closeModal(options) {
+            this.closeModal(options);
+        },
+        $_dialog(options) {
+            this.dialog(options);
+        }
+    },
+};
+
+export { modal };

resources/js/Global/store/modules/modal/actions.js

@@ -18,9 +18,9 @@ export default {
         state.properties = null;
     },
 
-    openAlert:({state, commit}, properties) => {
+    dialog:({state, commit}, properties) => {
-        state.modal.alert = true;
+        state.modal.dialog = true;
-        commit('SET_ALERT_TYPE', properties.type);
+        commit('SET_DIALOG_TYPE', properties.type);
-        commit('SET_ALERT_PROPERTIES', properties);
+        commit('SET_DIALOG_PROPERTIES', properties);
     }
 };

resources/js/Global/store/modules/modal/getters.js

@@ -7,7 +7,7 @@ export default {
             return rootState.modal[modalArray[0]];
         }
     },
-    getAlertProperties:(state) => state.alertProperties,
+    getDialogProperties:(state) => state.dialogProperties,
-    getAlertType:(state) => state.alertType,
+    getDialogType:(state) => state.dialogType,
 
 };

resources/js/Global/store/modules/modal/mutations.js

@@ -7,11 +7,11 @@ export default {
 		state.properties = properties;
    },
 
-   //Alert
+   //Dialog
-   SET_ALERT_TYPE(state, type = 'delete') {
+   SET_DIALOG_TYPE(state, type = 'delete') {
-      state.alertType = type;
+      state.dialogType = type;
    },
-   SET_ALERT_PROPERTIES(state, properties = {}) {
+   SET_DIALOG_PROPERTIES(state, properties = {}) {
-      state.alertProperties = properties;
+      state.dialogProperties = properties;
    }
 };

resources/js/Global/store/modules/modal/state.js

@@ -3,8 +3,8 @@ export default {
     result: null,
 
     modal:{
-        alert: false,
+        dialog: false,
     },
-    alertProperties: {},
+    dialogProperties: {},
-    alertType: {}
+    dialogType: {}
 };

resources/js/Global/utils/alert/Alert.js

@@ -1,9 +0,0 @@
-const WMAlert =  {
-    delete(Options) {
-       let text =  Options.text ? Options.text : 'آیا از حذف آیتم مطمئن هستید؟ امکان بازگشت وجود نخواهد نداشت.       ';
-       let removeCallBack =  Options.remove ? Options.remove : function () {} ;
-    },
-    success(){
-
-    }
-}

resources/js/Global/utils/vee-validate/locale/fa.js

@@ -0,0 +1,159 @@
+! function(n, e) {
+    "object" == typeof exports && "undefined" != typeof module ? module.exports = e() : "function" == typeof define && define.amd ? define(e) : ((n = n || self).__vee_validate_locale__fa = n.__vee_validate_locale__fa || {}, n.__vee_validate_locale__fa.js = e())
+}(this, function() {
+    "use strict";
+
+    function r(n) {
+        var e = {
+            Byte: "بايت",
+            KB: "كيلوبايت",
+            GB: "گیگابايت",
+            PB: "پتابايت"
+        };
+        return function(n) {
+            var e = 1024,
+                t = 0 === (n = Number(n) * e) ? 0 : Math.floor(Math.log(n) / Math.log(e));
+            return 1 * (n / Math.pow(e, t)).toFixed(2) + " " + ["Byte", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"][t]
+        }(n).replace(/(Byte|KB|GB|PB)/, function(n) {
+            return e[n]
+        })
+    }
+    var n, e = {
+        name: "fa",
+        messages: {
+            _default: function(n) {
+                return "مقدار " + n + " معتبر نیست"
+            },
+            after: function(n, e) {
+                return n + " باید بعد از تاریخ " + e[0] + " باشد"
+            },
+            alpha: function(n) {
+                return n + " فقط می تواند از حروف تشکیل شود"
+            },
+            alpha_dash: function(n) {
+                return n + " فقط می تواند از حروف، اعداد، خط فاصله و زیرخط تشکیل شود"
+            },
+            alpha_num: function(n) {
+                return n + " فقط میتواند از حروف و اعداد تشکیل شود"
+            },
+            alpha_spaces: function(n) {
+                return n + " فقط می تواند از حروف و فاصله تشکیل شود"
+            },
+            before: function(n, e) {
+                return n + " باید قبل از تاریخ " + e[0] + " باشد"
+            },
+            between: function(n, e) {
+                return n + " باید بین " + e[0] + " و " + e[1] + " کارکتر باشد"
+            },
+            confirmed: function(n) {
+                return n + " با تاییدیه اش مطابقت ندارد"
+            },
+            credit_card: function(n) {
+                return n + " غیر معتبر است"
+            },
+            date_between: function(n, e) {
+                return n + " باید بین تاریخ " + e[0] + " and " + e[1] + " باشد"
+            },
+            date_format: function(n, e) {
+                return n + " باید در قالب " + e[0] + " باشد"
+            },
+            decimal: function(n, e) {
+                void 0 === e && (e = []);
+                var t = e[0];
+                return void 0 === t && (t = "*"), n + " باید یک مقدار عددی " + ("*" === t ? "" : " با حداکثر " + t + " اعشار") + " باشد"
+            },
+            digits: function(n, e) {
+                return n + " باید یک مقدار عددی و دقیقاً " + e[0] + " رقم باشد"
+            },
+            dimensions: function(n, e) {
+                return n + " باید در اندازه " + e[0] + " پیکسل عرض و " + e[1] + " پیکسل ارتفاع باشد"
+            },
+            email: function(n) {
+                return n + " باید یک پست الکترونیک معتبر باشد"
+            },
+            excluded: function(n) {
+                return n + "باید یک مقدار معتبر باشد"
+            },
+            ext: function(n) {
+                return n + " باید یک فایل معتبر باشد"
+            },
+            image: function(n) {
+                return n + " باید یک تصویر باشد"
+            },
+            included: function(n) {
+                return n + " باید یک مقدار معتبر باشد"
+            },
+            ip: function(n) {
+                return n + " باید یک آدرس آی پی معتبر باشد"
+            },
+            max: function(n, e) {
+                return n + " نباید بیشتر از " + e[0] + " کارکتر باشد"
+            },
+            max_value: function(n, e) {
+                return "مقدار " + n + " باید " + e[0] + " یا کمتر باشد"
+            },
+            mimes: function(n) {
+                return n + " باید از نوع معتبر باشد"
+            },
+            min: function(n, e) {
+                return n + " باید حداقل " + e[0] + " کارکتر باشد"
+            },
+            min_value: function(n, e) {
+                return "مقدار " + n + " باید " + e[0] + " یا بیشتر باشد"
+            },
+            numeric: function(n) {
+                return n + " فقط می تواند عددی باشد"
+            },
+            regex: function(n) {
+                return "قالب " + n + " قابل قبول نیست"
+            },
+            required: function(n) {
+                return n + " الزامی است"
+            },
+            size: function(n, e) {
+                var t = e[0];
+                return "حجم " + n + " کمتر از " + r(t) + " باشد"
+            },
+            url: function(n) {
+                return n + " باید یک تارنمای معتبر باشد"
+            },
+            digits_between: function(n, e) {
+                return n + " باید بین " + e[0] + " و " + e[1] + " کارکتر باشد"
+            },
+            digits_between: function(n, e) {
+                return n + " باید بین " + e[0] + " و " + e[1] + " کارکتر باشد"
+            },
+        },
+        attributes: {
+            email: "ایمیل",
+            name: "نام",
+            phone: "شماره ی تلفن",
+            duplicatephone0: "شماره ی تلفن",
+            duplicatephone1: "شماره ی تلفن",
+            duplicatephone2: "شماره ی تلفن",
+            duplicatephone3: "شماره ی تلفن",
+            duplicatephone4: "شماره ی تلفن",
+            duplicatephone5: "شماره ی تلفن",
+            duplicatephone6: "شماره ی تلفن",
+            duplicatephone7: "شماره ی تلفن",
+            duplicatephone8: "شماره ی تلفن",
+            duplicatephone9: "شماره ی تلفن",
+            duplicatephone10: "شماره ی تلفن",
+            duplicateAddress0: "آدرس",
+            duplicateAddress1: "آدرس",
+            duplicateAddress2: "آدرس",
+            duplicateAddress3: "آدرس",
+            duplicateAddress4: "آدرس",
+            duplicateAddress5: "آدرس",
+            duplicateAddress6: "آدرس",
+            duplicateAddress7: "آدرس",
+            duplicateAddress8: "آدرس",
+            duplicateAddress9: "آدرس",
+            duplicateAddress10: "آدرس",
+        },
+        custom: {
+            
+        }
+    };
+    return "undefined" != typeof VeeValidate && VeeValidate.Validator.localize(((n = {})[e.name] = e, n)), e
+});

resources/js/Global/utils/vee-validate/newRules.js

@@ -0,0 +1,12 @@
+import { Validator } from "vee-validate";
+
+const isBetween = (value, { min, max } = {}) => {
+	return Number(min) <= value.length && Number(max) >= value.length;
+};
+
+// The first param is called 'min', and the second is called 'max'.
+const paramNames = ['min', 'max'];
+
+Validator.extend('digits_between', isBetween, {
+paramNames //  pass it in the extend options.
+});

resources/js/Home/app.js

@@ -4,7 +4,9 @@ import router from './router'
 import store from './store'
 import VueScrollReveal from 'vue-scroll-reveal'
 import Vuetify from 'vuetify'
-import { global } from '../Global/mixins/global';
+import { global } from "@Global/mixins/global";
+import { modal } from "@Global/mixins/modal";
+import { commingSoon } from "@Global/mixins/commingSoon";
 
 import 'popper.js'
 import 'bootstrap-v4-rtl'
@@ -76,7 +78,9 @@ Vue.use(VueScrollReveal, {
     distance: '10px',
     mobile: false
 });
-Vue.mixin(global);
+Vue.mixin({
+	methods: { ...global["methods"], ...modal["methods"], ...commingSoon["methods"] }
+});
 
 import { TokenService } from "@Global/services/storage.services";
 import ApiService from "@Global/services/api.services";

resources/js/Home/views/Home.vue

@@ -20,12 +20,12 @@
             </router-link> -->
             <a href="/CRM/Home" class="flex lg8 xs12">
                 <wm-tile TileClass="Inline LTR Padd10" TitleEn="CRM" TitleFa=" مدیریت ارتباط با مشتری " Desc=" کالاها، خدمات، تخفیفات، فروش وِیژه و ... "
-                         GradientBegin="d6e7de"  GradientEnd="fff2f3" ImageURL="Members.png" ImageHeight="220px" Quantity="1250" >
+                         GradientBegin="d6e7de"  GradientEnd="fff2f3" ImageURL="Members.png" ImageHeight="220px" >
                 </wm-tile>
             </a>
-            <a href="/Reservation/Home" class="flex lg4 xs12">
+            <a href="/Reservation/Home" v-if="$_inCommingSoon('main-reservation')" class="flex lg4 xs12">
                 <wm-tile TileClass="Padd10" TitleEn="Reservations" TitleFa=" سیستم رزرو وقت " Desc=" کالاها، خدمات، تخفیفات، فروش وِیژه و ... "
-                         GradientBegin="fff"  GradientEnd="f7f7f7" ImageURL="Clock.png" ImageHeight="150px"  Quantity="1250" >
+                         GradientBegin="fff"  GradientEnd="f7f7f7" ImageURL="Clock.png" ImageHeight="150px"  >
                 </wm-tile>
             </a>
         </v-layout>