diff --git a/config/database.php b/config/database.php
index b42d9b3..aeabec6 100644
--- a/config/database.php
+++ b/config/database.php
@@ -56,7 +56,7 @@ return [
             'collation' => 'utf8mb4_unicode_ci',
             'prefix' => '',
             'prefix_indexes' => true,
-            'strict' => true,
+            'strict' => false,
             'engine' => null,
             'options' => extension_loaded('pdo_mysql') ? array_filter([
                 PDO::MYSQL_ATTR_SSL_CA => env('MYSQL_ATTR_SSL_CA'),
diff --git a/config/filesystems.php b/config/filesystems.php
index 45a038f..f8839a7 100644
--- a/config/filesystems.php
+++ b/config/filesystems.php
@@ -73,12 +73,13 @@ return [
         ],
 
         'media' => [
-            'driver' => 'minio',
+            'driver' => 's3',
             'key' => env('MINIO_KEY', 'your minio server key'),
             'secret' => env('MINIO_SECRET', 'your minio server secret'),
             'region' => 'us-east-1',
             'bucket' => env('MINIO_BUCKET','your minio bucket name'),
-            'endpoint' => env('MINIO_ENDPOINT','http://localhost:8000')
+            'endpoint' => env('MINIO_ENDPOINT','http://localhost:8000'),
+            'url' => 'https://cdn.willaspace.com/'. env('MINIO_BUCKET')
         ],
 
     ],
diff --git a/resources/js/Global/components/Inputs/AutoCompleteWrapper.vue b/resources/js/Global/components/Inputs/AutoCompleteWrapper.vue
new file mode 100644
index 0000000..249541d
--- /dev/null
+++ b/resources/js/Global/components/Inputs/AutoCompleteWrapper.vue
@@ -0,0 +1,37 @@
+<template>
+    <div>
+        <slot :filter="filter"></slot>
+    </div>
+</template>
+
+<script>
+    let cancelId;
+
+    export default {
+        name: "AutoCompleteWrapper",
+        props: {
+            callback: {
+                type: Function,
+            },
+        },
+        methods: {
+            filter(e) {
+                clearTimeout(cancelId);
+                if (
+                    e.target.value &&
+                    e.target.value.length > 1 &&
+                    e.code !== "Tab" &&
+                    e.code !== "Enter"
+                ) {
+                    cancelId = setTimeout(() => {
+                        this.$emit('filter', e.target.value);
+                        this.callback(e.target.value);
+                    }, 400);
+                }
+            },
+        },
+    };
+</script>
+
+<style>
+</style>
diff --git a/resources/js/Global/components/Inputs/Code-Editor.vue b/resources/js/Global/components/Inputs/Code-Editor.vue
index b7fad66..f650d89 100644
--- a/resources/js/Global/components/Inputs/Code-Editor.vue
+++ b/resources/js/Global/components/Inputs/Code-Editor.vue
@@ -1,53 +1,70 @@
 <template>
-    <prism-editor class="my-editor LTR height-300 " v-model="code" :highlight="highlighter" line-numbers></prism-editor>
+  <prism-editor
+    class="my-editor LTR height-300"
+    v-model="code"
+    :highlight="highlighter"
+    line-numbers
+  ></prism-editor>
 </template>
 
 <script>
-    // import Prism Editor
-    import { PrismEditor } from 'vue-prism-editor';
-    import 'vue-prism-editor/dist/prismeditor.min.css'; // import the styles somewhere
+// import Prism Editor
+import { PrismEditor } from "vue-prism-editor";
+import "vue-prism-editor/dist/prismeditor.min.css"; // import the styles somewhere
 
-    // import highlighting library (you can use any library you want just return html string)
-    import { highlight, languages } from 'prismjs/components/prism-core';
-    import 'prismjs/components/prism-clike';
-    import 'prismjs/components/prism-javascript';
-    import 'prismjs/themes/prism-tomorrow.css'; // import syntax highlighting styles
+// import highlighting library (you can use any library you want just return html string)
+import { highlight, languages } from "prismjs/components/prism-core";
+import "prismjs/components/prism-clike";
+import "prismjs/components/prism-javascript";
+import "prismjs/components/prism-css";
+import "prismjs/themes/prism-tomorrow.css"; // import syntax highlighting styles
 
-    export default {
-        components: {
-            PrismEditor,
-        },
-        data: () => ({ code: 'console.log("Hello World")' }),
-        methods: {
-            highlighter(code) {
-                return highlight(code, languages.js); // languages.<insert language> to return html with markup
-            },
-        },
-    };
+export default {
+  components: {
+    PrismEditor,
+  },
+  props: ["value", "language"],
+  data: () => ({}),
+  methods: {
+    highlighter(code) {
+      return highlight(code, languages[this.language]); // languages.<insert language> to return html with markup
+    },
+  },
+  computed: {
+    code: {
+      get() {
+        return this.value;
+      },
+      set(e) {
+        this.$emit("input", e);
+      },
+    },
+  },
+};
 </script>
 
 <style>
-    .height-300 {
-        height: 300px;
-    }
-    /* required class */
-    .my-editor {
-        /* we dont use `language-` classes anymore so thats why we need to add background and text color manually */
-        background: #f5f2f0;
-        border: 1px solid #dcdcdc;
-        border-left: 10px solid #dcdcdc;
-        color: #5a6268;
-        border-radius: 5px;
+.height-300 {
+  height: 300px;
+}
+/* required class */
+.my-editor {
+  /* we dont use `language-` classes anymore so thats why we need to add background and text color manually */
+  background: #f5f2f0;
+  border: 1px solid #dcdcdc;
+  border-left: 10px solid #dcdcdc;
+  color: #5a6268;
+  border-radius: 5px;
 
-        /* you must provide font-family font-size line-height. Example: */
-        font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
-        font-size: 14px;
-        line-height: 1.5;
-        padding: 5px;
-    }
+  /* you must provide font-family font-size line-height. Example: */
+  font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
+  font-size: 14px;
+  line-height: 1.5;
+  padding: 5px;
+}
 
-    /* optional class for removing the outline */
-    .prism-editor__textarea:focus {
-        outline: none;
-    }
+/* optional class for removing the outline */
+.prism-editor__textarea:focus {
+  outline: none;
+}
 </style>
diff --git a/resources/js/Global/components/Inputs/TooltipButton.vue b/resources/js/Global/components/Inputs/TooltipButton.vue
new file mode 100644
index 0000000..e373c08
--- /dev/null
+++ b/resources/js/Global/components/Inputs/TooltipButton.vue
@@ -0,0 +1,106 @@
+<template>
+  <v-tooltip
+    :top="top"
+    :bottom="bottom"
+    :left="left"
+    :right="right"
+    :color="tooltipColor"
+    :transition="transition"
+  >
+    <template v-slot:activator="{ on }">
+      <v-btn
+        slot="activator"
+        fab
+        :color="buttonColor"
+        :dark="dark"
+        :light="light"
+        v-on="on"
+        @click="$emit('click')"
+        :small="small"
+        :large="large"
+        :x-large="xLarge"
+        :x-small="xSmall"
+      >
+        <v-icon dark>{{ icon }}</v-icon>
+      </v-btn>
+    </template>
+    <span>{{ text }}</span>
+  </v-tooltip>
+</template>
+
+<script>
+export default {
+  name: "tooltipButton",
+  props: {
+    icon: {
+      type: String,
+      default: "WMi-user",
+    },
+    buttonColor: {
+      type: String,
+      default: "black",
+    },
+    text: {
+      type: String,
+      default: "متن پیش فرض",
+    },
+    tooltipColor: {
+      type: String,
+      default: "black",
+    },
+    top: {
+      type: Boolean,
+      default: function () {
+        return !this.bottom && !this.left && !this.right ? true : false;
+      },
+    },
+    bottom: {
+      type: Boolean,
+      default: false,
+    },
+    left: {
+      type: Boolean,
+      default: false,
+    },
+    right: {
+      type: Boolean,
+      default: false,
+    },
+    transition: {
+      type: String,
+      default: "fade-transition",
+    },
+    dark: {
+      type: Boolean,
+      default: function () {
+        return !this.light ? true : false;
+      },
+    },
+    light: {
+      type: Boolean,
+      default: false,
+    },
+    small: {
+      type: Boolean,
+      default: function () {
+        return !this.large && !this.xSmall && !this.xLarge ? true : false;
+      },
+    },
+    large: {
+      type: Boolean,
+      default: false,
+    },
+    xSmall: {
+      type: Boolean,
+      default: false,
+    },
+    xLarge: {
+      type: Boolean,
+      default: false,
+    },
+  },
+};
+</script>
+
+<style>
+</style>
\ No newline at end of file
diff --git a/resources/js/Global/mixins/commingSoon.js b/resources/js/Global/mixins/commingSoon.js
index e91a81b..0453f11 100644
--- a/resources/js/Global/mixins/commingSoon.js
+++ b/resources/js/Global/mixins/commingSoon.js
@@ -10,7 +10,8 @@ var CommingSoonArray = [
     "blog-post",
     "blog-setting",
     "client_export",
-    "blog-videos"
+    "blog-videos",
+    "roll-staff",
 ];
 const commingSoon = {
     methods: {
diff --git a/resources/js/Global/plugins/globalComponent.js b/resources/js/Global/plugins/globalComponent.js
index 898fc05..fcc3dd1 100644
--- a/resources/js/Global/plugins/globalComponent.js
+++ b/resources/js/Global/plugins/globalComponent.js
@@ -1,8 +1,8 @@
-import Vue from 'vue';
+import Vue from "vue";
 
 // global Styles
 
-import "@riophae/vue-treeselect/dist/vue-treeselect.css";//for tree select
+import "@riophae/vue-treeselect/dist/vue-treeselect.css"; //for tree select
 import "@Global/scss/style.scss";
 
 // global Components
@@ -86,11 +86,11 @@ Vue.component("we-hint-text", HintText);
 import HintBlock from "@Global/components/Blocks/Hint.vue";
 Vue.component("hint-block", HintBlock);
 
-import PersianDate from '@Global/components/Inputs/PersianDate'
+import PersianDate from "@Global/components/Inputs/PersianDate";
 Vue.component("we-persian-date", PersianDate);
 
-
-
+import TooltipButton from "@Global/components/Inputs/TooltipButton";
+Vue.component("tooltip-button", TooltipButton);
 
 Vue.component("wm-breadcrumbs", Breadcrumbs);
 Vue.component("wm-dialog", Dialog);
@@ -99,14 +99,12 @@ Vue.component("wm-helper", Helper);
 Vue.component("we-no-items", NoItems);
 Vue.component("we-loading", Loading);
 
-
 //setTime
 import store from "@Global/store/index";
-store.dispatch('common/setCurrentTime');
+store.dispatch("common/setCurrentTime");
 
 //jalali => 0.6MB
+import moment from "moment"
+moment.locale('fa');
 import jalaliMoment from "vue-jalali-moment"
-import momment from "moment"
-import Wireframe from "@Global/components/Blocks/Wireframe";
-momment.locale('fa');
-Vue.use(jalaliMoment);
+Vue.use(jalaliMoment,{moment});
diff --git a/resources/js/Global/plugins/veeValidate.js b/resources/js/Global/plugins/veeValidate.js
index 4c0f9cf..c09e85a 100644
--- a/resources/js/Global/plugins/veeValidate.js
+++ b/resources/js/Global/plugins/veeValidate.js
@@ -5,4 +5,16 @@ import fa from "@Global/utils/vee-validate/locale/fa";
 import "@Global/utils/vee-validate/newRules";
 Vue.use(VeeValidate);
 
+const phoneRule = {
+    getMessage(field, args) {
+      return `The ${field} must be either a valid phone number`;
+    },
+    validate(value, args) {
+      const PHONE_REG = /^0\d{2,3}\d{8}$/;
+      return PHONE_REG.test(value);
+    }
+};
+
+VeeValidate.Validator.extend('phone', phoneRule);
+
 Validator.localize("fa", fa);
diff --git a/resources/js/Global/utils/date/jalali-date.js b/resources/js/Global/utils/date/jalali-date.js
index af6380d..b4e74a4 100644
--- a/resources/js/Global/utils/date/jalali-date.js
+++ b/resources/js/Global/utils/date/jalali-date.js
@@ -1,9 +1,9 @@
 import moment from "jalali-moment";
 
 const convertToJalali = function (date = null, format = "jYYYY/jMM/jDD", defaultDate = 'مشخص نشده است.' ) {
-    return date ? moment(date).format(format) : defaultDate ;
+    return date ? moment(date).locale('fa').format(format) : defaultDate ;
 };
 const convertNowToJalali = function (date = null, format = "jYYYY/jMM/jDD" ) {
-    return date ? moment(date).format(format) : moment(new Date()).format(format) ;
+    return date ? moment(date).locale('fa').format(format) : moment(new Date()).locale('fa').format(format) ;
 };
 export { convertToJalali, convertNowToJalali };