fix

resources/js/Home/views/Home.vue

@@ -2,20 +2,21 @@
     <v-container>
         <v-row class="reverse">
             <v-col xl="8" lg="8" offset-xl="2" offset-lg="2" class="fade-in fast delay-01">
-                <big-section-title title_fa="سیستم مدیریت یک پارچه" title_en="Integrated Management System" desc="هر آنچه مربوط به مدیریت مجموعه ی شما می باشد." />
+                <big-section-title title_fa="سیستم مدیریت یک پارچه" title_en="Integrated Management System"
+                                   desc="هر آنچه مربوط به مدیریت مجموعه ی شما می باشد."/>
             </v-col>
         </v-row>
         <v-row>
             <a
-                :href="module.href"
+                :href="module.hasModule ? module.href : 'javascript:void(0)'"
                 :class="'flex fade-in fast ' + module.main_class"
-                v-for="( module ,key ) in getModules"
+                v-for="( module ,key ) in modules"
                 :key="key"
                 :style="`animation-delay: ${key * 0.1}s;`"
             >
-
                 <icon-tile
                     :theme="module.title_class +' Shadowed'"
+                    :class="module.hasModule ? '' : 'has-blur'"
                     :TitleEn="module.title_en"
                     :TitleFa="module.title_fa"
                     :GradientBegin="module.gradient_begin"
@@ -35,35 +36,44 @@
 </template>
 
 
-
 <script>
-import Tile from "@Global/components/Tiles/Tile";
-import IconTile from '@Global/components/Tiles/Icon-Tile';
-import { mapGetters, mapActions } from "vuex";
-import routes from '@Global/utils/common/routes';
-import BigSectionTitle from '@Global/components/Dividers/Section-Title-Big';
+    import IconTile from '@Global/components/Tiles/Icon-Tile';
+    import {mapGetters, mapActions} from "vuex";
+    import routes from '@Global/utils/common/routes';
+    import BigSectionTitle from '@Global/components/Dividers/Section-Title-Big';
 
-
-export default {
-    data: () => ({
-        hostname : window.location.hostname,
-        originHostName : routes.originHostName()
-    }),
-    components: {
-        IconTile,
-        BigSectionTitle
-    },
-    computed: {
-        ...mapGetters("rolePermission", ["getModules"]),
-        ...mapGetters("auth", ["getAuthUser"]),
-    },
-    methods: {
-        ...mapActions("rolePermission", ["loadModules"]),
-    },
-    created() {
-        this.loadModules({ home_page: true });
-    }
-};
+    export default {
+        data: () => ({
+            hostname: window.location.hostname,
+            originHostName: routes.originHostName()
+        }),
+        components: {
+            IconTile,
+            BigSectionTitle
+        },
+        computed: {
+            ...mapGetters("rolePermission", ["getModules", "getAllModules"]),
+            ...mapGetters("auth", ["getAuthUser"]),
+            modules() {
+                let modules = this.getAllModules.filter(x => x.load_in_home === "yes");
+                return modules.map(x => {
+                    if (this.getModules.map(y => y.id).includes(x.id)) {
+                        x.hasModule = true;
+                    } else {
+                        x.hasModule = false;
+                    }
+                    return x;
+                });
+            }
+        },
+        methods: {
+            ...mapActions("rolePermission", ["loadModules", "loadAllModules"]),
+        },
+        created() {
+            this.loadModules();
+            this.loadAllModules();
+        }
+    };
 </script>
 
 <style scoped lang="scss">