From 2e498916abb38cf77f50d85edf57cf67368a3f65 Mon Sep 17 00:00:00 2001
From: alighassami <alighassami@yahoo.com>
Date: Wed, 24 Nov 2021 16:24:03 +0330
Subject: [PATCH] add permission

---
 .../VerticalNavMenu-permission.vue            | 359 +++++++++++++
 .../navMenuItems-permission.js                | 474 ++++++++++++++++++
 .../vertical-nav-menu/navMenuItems.js         |   7 +
 src/router.js                                 |   9 +
 src/views/permission/Access.vue               | 150 ++++++
 5 files changed, 999 insertions(+)
 create mode 100644 src/layouts/components/vertical-nav-menu/VerticalNavMenu-permission.vue
 create mode 100644 src/layouts/components/vertical-nav-menu/navMenuItems-permission.js
 create mode 100644 src/views/permission/Access.vue

diff --git a/src/layouts/components/vertical-nav-menu/VerticalNavMenu-permission.vue b/src/layouts/components/vertical-nav-menu/VerticalNavMenu-permission.vue
new file mode 100644
index 0000000..136fb25
--- /dev/null
+++ b/src/layouts/components/vertical-nav-menu/VerticalNavMenu-permission.vue
@@ -0,0 +1,359 @@
+
+
+<template>
+  <div class="parentx">
+
+    <vs-sidebar
+      class="v-nav-menu items-no-padding"
+      v-model="isVerticalNavMenuActive"
+      ref="verticalNavMenu"
+      default-index="-1"
+      :click-not-close="clickNotClose"
+      :reduce-not-rebound="reduceNotRebound"
+      :parent="parent"
+      :hiddenBackground="clickNotClose"
+      :reduce="reduce"
+      v-hammer:swipe="onMenuSwipe">
+
+      <div @mouseenter="mouseEnter" @mouseleave="mouseLeave">
+
+        <!-- Header -->
+        <div class="header-sidebar flex items-end justify-between" slot="header">
+
+          <!-- Logo -->
+          <router-link tag="div" class="cursor-pointer flex space-x-4 space-y-4" to="/">
+              <img src="../../../assets/images/logo/logo.png" width="40"/>
+              <span class="vx-logo-text text-primary text-xl font-bold" v-show="isMouseEnter || !reduce" v-if="title">{{ title }}</span>
+          </router-link>
+          <!-- /Logo -->
+
+          <!-- Menu Buttons -->
+          <div>
+            <!-- Close Button -->
+            <template v-if="showCloseButton">
+              <feather-icon icon="XIcon" class="m-0 cursor-pointer" @click="$store.commit('TOGGLE_IS_VERTICAL_NAV_MENU_ACTIVE', false)" />
+            </template>
+
+            <!-- Toggle Buttons -->
+            <template v-else-if="!showCloseButton && !verticalNavMenuItemsMin">
+<!--              <feather-icon-->
+<!--                id="btnVNavMenuMinToggler"-->
+<!--                class="mr-0 cursor-pointer"-->
+<!--                :icon="reduce ? 'CircleIcon' : 'DiscIcon'"-->
+<!--                svg-classes="stroke-current text-primary"-->
+<!--                @click="toggleReduce(!reduce)" />-->
+            </template>
+          </div>
+          <!-- /Menu Toggle Buttons -->
+        </div>
+        <!-- /Header -->
+
+        <!-- Header Shadow -->
+        <div class="shadow-bottom" v-show="showShadowBottom" />
+
+        <!-- Menu Items -->
+        <keep-alive>
+          <component :is="scrollbarTag" ref="verticalNavMenuPs" class="scroll-area-v-nav-menu pt-2" :settings="settings" @ps-scroll-y="psSectionScroll" @scroll="psSectionScroll" :key="$vs.rtl">
+            <template v-for="(item, index) in menuItemsUpdated">
+
+              <!-- Group Header -->
+              <span v-if="item.header && !verticalNavMenuItemsMin" class="navigation-header truncate" :key="`header-${index}`">
+              {{ $t(item.i18n) || item.header }}
+            </span>
+              <!-- /Group Header -->
+
+              <template v-else-if="!item.header">
+
+                <!-- Nav-Item -->
+                <v-nav-menu-item
+                  v-if="!item.submenu"
+                  :key="`item-${index}`"
+                  :index="index"
+                  :to="item.slug !== 'external' ? item.url : null"
+                  :href="item.slug === 'external' ? item.url : null"
+                  :icon="item.icon" :target="item.target"
+                  :isDisabled="item.isDisabled"
+                  :slug="item.slug">
+                  <span v-show="!verticalNavMenuItemsMin" class="truncate">{{ $t(item.i18n) || item.name }}</span>
+                  <vs-chip class="ml-auto" :color="item.tagColor" v-if="item.tag && (isMouseEnter || !reduce)">{{ item.tag }}</vs-chip>
+                </v-nav-menu-item>
+
+                <!-- Nav-Group -->
+                <template v-else>
+                  <v-nav-menu-group
+                    :key="`group-${index}`"
+                    :openHover="openGroupHover"
+                    :group="item"
+                    :groupIndex="index"
+                    :open="isGroupActive(item)" />
+                </template>
+                <!-- /Nav-Group -->
+              </template>
+            </template>
+          </component>
+        </keep-alive>
+
+        <!-- /Menu Items -->
+      </div>
+    </vs-sidebar>
+
+    <!-- Swipe Gesture -->
+    <div
+      v-if="!isVerticalNavMenuActive"
+      class="v-nav-menu-swipe-area"
+      v-hammer:swipe="onSwipeAreaSwipe" />
+    <!-- /Swipe Gesture -->
+  </div>
+</template>
+
+
+<script>
+import VuePerfectScrollbar from 'vue-perfect-scrollbar'
+import VNavMenuGroup from './VerticalNavMenuGroup.vue'
+import VNavMenuItem from './VerticalNavMenuItem.vue'
+
+
+import Logo from '../Logo.vue'
+import state from "@/store/state";
+import menu_items from "@/layouts/components/vertical-nav-menu/navMenuItems";
+
+export default {
+  name: 'v-nav-menu',
+  components: {
+    VNavMenuGroup,
+    VNavMenuItem,
+    VuePerfectScrollbar,
+    Logo
+  },
+  props: {
+    logo:             { type: String },
+    openGroupHover:   { type: Boolean, default: false },
+    parent:           { type: String },
+    reduceNotRebound: { type: Boolean, default: true },
+    navMenuItems:     { type: Array,   required: true },
+    title:            { type: String }
+  },
+  data: () => ({
+    clickNotClose       : false, // disable close navMenu on outside click
+    isMouseEnter        : false,
+    reduce              : false, // determines if navMenu is reduce - component property
+    showCloseButton     : false, // show close button in smaller devices
+    settings            : {      // perfectScrollbar settings
+      maxScrollbarLength: 60,
+      wheelSpeed        : 1,
+      swipeEasing       : true
+    },
+    showShadowBottom    : false
+  }),
+  computed: {
+    menuItemsUpdated () {
+      let new_item = []
+      const clone = this.navMenuItems.slice()
+      const per = this.$store.state.permissions
+      if(per != undefined){
+          clone.map(item=>item.items.map(menus=>{
+            const names = ["public"]
+            if(menus.submenu){
+              let submenu = menus.submenu.filter(menu =>(menu.permission_id && per.includes(menu.permission_id)) || names.includes(menu.permission_id))
+              menus.submenu = submenu
+              if(submenu.length) new_item.push(menus)
+            }else{
+              if((menus.permission_id && per.includes(menus.permission_id)) || names.includes(menus.permission_id)){
+                new_item.push(menus)
+              }
+            }
+          }))
+          return new_item
+      }
+    },
+    isGroupActive () {
+      return (item) => {
+        const path        = this.$route.fullPath
+        const routeParent = this.$route.meta ? this.$route.meta.parent : undefined
+        let open          = false
+
+        const func = (item) => {
+          if (item.submenu) {
+            item.submenu.forEach((item) => {
+              if (item.url && (path === item.url || routeParent === item.slug)) { open = true } else if (item.submenu) { func(item) }
+            })
+          }
+        }
+        func(item)
+        return open
+      }
+    },
+    isVerticalNavMenuActive: {
+      get ()    { return this.$store.state.isVerticalNavMenuActive },
+      set (val) { this.$store.commit('TOGGLE_IS_VERTICAL_NAV_MENU_ACTIVE', val) }
+    },
+    layoutType () { return this.$store.state.mainLayoutType },
+    reduceButton: {
+      get ()    { return this.$store.state.reduceButton },
+      set (val) { this.$store.commit('TOGGLE_REDUCE_BUTTON', val) }
+    },
+    isVerticalNavMenuReduced () { return Boolean(this.reduce && this.reduceButton) },
+    verticalNavMenuItemsMin ()  { return this.$store.state.verticalNavMenuItemsMin },
+    scrollbarTag ()             { return this.$store.getters.scrollbarTag          },
+    windowWidth ()              { return this.$store.state.windowWidth             }
+  },
+  watch: {
+    '$route' () {
+      if (this.isVerticalNavMenuActive && this.showCloseButton) this.$store.commit('TOGGLE_IS_VERTICAL_NAV_MENU_ACTIVE', false)
+    },
+    reduce (val) {
+      const verticalNavMenuWidth = val ? 'reduced' : this.$store.state.windowWidth < 1200 ? 'no-nav-menu' : 'default'
+      this.$store.dispatch('updateVerticalNavMenuWidth', verticalNavMenuWidth)
+
+      setTimeout(function () {
+        window.dispatchEvent(new Event('resize'))
+      }, 100)
+    },
+    layoutType ()   { this.setVerticalNavMenuWidth() },
+    reduceButton () { this.setVerticalNavMenuWidth() },
+    windowWidth ()  { this.setVerticalNavMenuWidth() }
+  },
+  methods: {
+    onMenuSwipe (event) {
+      if (event.direction === 4 && this.$vs.rtl) {
+
+        // Swipe Right
+        if (this.isVerticalNavMenuActive && this.showCloseButton) this.isVerticalNavMenuActive = false
+
+      } else if (event.direction === 2 && !this.$vs.rtl) {
+
+        // Swipe Left
+        if (this.isVerticalNavMenuActive && this.showCloseButton) this.isVerticalNavMenuActive = false
+      }
+    },
+    onSwipeAreaSwipe (event) {
+
+      if (event.direction === 4 && !this.$vs.rtl) {
+
+        // Swipe Right
+        if (!this.isVerticalNavMenuActive && this.showCloseButton) this.isVerticalNavMenuActive = true
+      } else if (event.direction === 2 && this.$vs.rtl) {
+
+        // Swipe Left
+        if (!this.isVerticalNavMenuActive && this.showCloseButton) this.isVerticalNavMenuActive = true
+      }
+    },
+    psSectionScroll () {
+      const scroll_el = this.$refs.verticalNavMenuPs.$el || this.$refs.verticalNavMenuPs
+      this.showShadowBottom = scroll_el.scrollTop > 0
+    },
+    mouseEnter () {
+      if (this.reduce) this.$store.commit('UPDATE_VERTICAL_NAV_MENU_ITEMS_MIN', false)
+      this.isMouseEnter = true
+    },
+    mouseLeave () {
+      if (this.reduce) this.$store.commit('UPDATE_VERTICAL_NAV_MENU_ITEMS_MIN', true)
+      this.isMouseEnter = false
+    },
+    setVerticalNavMenuWidth () {
+
+      if (this.windowWidth > 1200) {
+        if (this.layoutType === 'vertical') {
+
+          // Set reduce
+          this.reduce = !!this.reduceButton
+
+          // Open NavMenu
+          this.$store.commit('TOGGLE_IS_VERTICAL_NAV_MENU_ACTIVE', true)
+
+          // Set Menu Items Only Icon Mode
+          const verticalNavMenuItemsMin = !!(this.reduceButton && !this.isMouseEnter)
+          this.$store.commit('UPDATE_VERTICAL_NAV_MENU_ITEMS_MIN', verticalNavMenuItemsMin)
+
+          // Menu Action buttons
+          this.clickNotClose   = true
+          this.showCloseButton = false
+
+          const verticalNavMenuWidth   = this.isVerticalNavMenuReduced ? 'reduced' : 'default'
+          this.$store.dispatch('updateVerticalNavMenuWidth', verticalNavMenuWidth)
+
+          return
+        }
+      }
+
+      // Close NavMenu
+      this.$store.commit('TOGGLE_IS_VERTICAL_NAV_MENU_ACTIVE', false)
+
+      // Reduce button
+      if (this.reduceButton) this.reduce = false
+
+      // Menu Action buttons
+      this.showCloseButton = true
+      this.clickNotClose   = false
+
+      // Update NavMenu Width
+      this.$store.dispatch('updateVerticalNavMenuWidth', 'no-nav-menu')
+
+      // Remove Only Icon in Menu
+      this.$store.commit('UPDATE_VERTICAL_NAV_MENU_ITEMS_MIN', false)
+
+
+      // if(this.layoutType === 'vertical' || (this.layoutType === 'horizontal' && this.windowWidth < 1200))
+      // if (this.windowWidth < 1200) {
+
+      //   // Close NavMenu
+      //   this.$store.commit('TOGGLE_IS_VERTICAL_NAV_MENU_ACTIVE', false)
+
+      //   // Reduce button
+      //   if (this.reduceButton) this.reduce = false
+
+      //   // Menu Action buttons
+      //   this.showCloseButton = true
+      //   this.clickNotClose   = false
+
+      //   // Update NavMenu Width
+      //   this.$store.dispatch('updateVerticalNavMenuWidth', 'no-nav-menu')
+
+      //   // Remove Only Icon in Menu
+      //   this.$store.commit('UPDATE_VERTICAL_NAV_MENU_ITEMS_MIN', false)
+
+      // } else {
+
+      //   // Set reduce
+      //   this.reduce = this.reduceButton ? true : false
+
+      //   // Open NavMenu
+      //   this.$store.commit('TOGGLE_IS_VERTICAL_NAV_MENU_ACTIVE', true)
+
+      //   // Set Menu Items Only Icon Mode
+      //   const verticalNavMenuItemsMin = (this.reduceButton && !this.isMouseEnter) ? true : false
+      //   this.$store.commit('UPDATE_VERTICAL_NAV_MENU_ITEMS_MIN', verticalNavMenuItemsMin)
+
+      //   // Menu Action buttons
+      //   this.clickNotClose   = true
+      //   this.showCloseButton = false
+
+      //   const verticalNavMenuWidth   = this.isVerticalNavMenuReduced ? "reduced" : "default"
+      //   this.$store.dispatch('updateVerticalNavMenuWidth', verticalNavMenuWidth)
+      // }
+    },
+    toggleReduce (val) {
+      this.reduceButton = val
+      this.setVerticalNavMenuWidth()
+    }
+  },
+  mounted () {
+    this.setVerticalNavMenuWidth()
+  }
+}
+
+</script>
+
+
+<style lang="scss">
+@import "@/assets/scss/vuexy/components/verticalNavMenu.scss";
+
+.cursor-pointer.navbar-fuzzy-search.mr-8.feather-icon.select-none.relative{
+  display: none !important;
+}
+[dir] .v-nav-menu .scroll-area-v-nav-menu {
+  padding-bottom: 3em;
+}
+
+
+</style>
diff --git a/src/layouts/components/vertical-nav-menu/navMenuItems-permission.js b/src/layouts/components/vertical-nav-menu/navMenuItems-permission.js
new file mode 100644
index 0000000..20cbb34
--- /dev/null
+++ b/src/layouts/components/vertical-nav-menu/navMenuItems-permission.js
@@ -0,0 +1,474 @@
+import state from '../../../store/state'
+//export default
+const menu_items = [
+  {
+    header: 'Apps',
+    icon: 'PackageIcon',
+    i18n: 'کاربری',
+    items: [
+        {
+            url: null,
+            icon: 'PenToolIcon',
+            i18n: 'صفات',
+            submenu: [
+                {
+                    url: '/variant/add',
+                    name: 'addGroupVariant',
+                    slug: 'add-group-variant',
+                    i18n: 'ساخت صفات',
+                    permission_id: 'attribute.create'
+                },
+                {
+                    url: '/variant/list',
+                    name: 'listVariant',
+                    slug: 'listVariant',
+                    i18n: 'لیست صفات',
+                    permission_id: 'attribute.list'
+                },
+                {
+                  url: '/variant/group-add',
+                  name: 'editVariant',
+                  slug: 'edit-variant',
+                  i18n: 'لیست گروه صفات',
+                  permission_id: 'group.list'
+                }
+            ]
+        },
+        {
+            url: null,
+            name: 'category',
+            icon: 'GridIcon',
+            i18n: 'دسته ها',
+            submenu: [
+                {
+                    url: '/category/list',
+                    name: 'categoryList',
+                    slug: 'add-category',
+                    i18n: 'لیست دسته',
+                    permission_id: 'collection.create'
+                },
+                {
+                    url: '/category/add',
+                    name: 'categoryAdd',
+                    slug: 'add-category',
+                    i18n: 'ساخت دسته',
+                    permission_id: 'collection.list'
+                }
+            ]
+        },
+        {
+            url: null,
+            name: 'adv',
+            icon: 'Volume2Icon',
+            i18n: 'آگهی ها',
+            submenu: [
+                {
+                    url: '/adv/list',
+                    name: 'advList',
+                    slug: 'adv-list',
+                    i18n: 'لیست آگهی های ثبت شده',
+                    permission_id: 'adv.list'
+                },
+                {
+                    url: '/adv/expired',
+                    name: 'advExpired',
+                    slug: 'adv-expired',
+                    i18n: 'درخواست آگهی های منقضی',
+                    permission_id: 'request.report'
+                },
+                {
+                    url: '/adv/malicious',
+                    name: 'advMalicious',
+                    slug: 'adv-malicious',
+                    i18n: 'لیست آگهی های مخرب',
+                    permission_id: 'bad_adv.manage'
+                },
+                {
+                  url: '/adv/delete/report',
+                  name: 'advDeleteReport',
+                  slug: 'adv-delete-report',
+                  i18n: 'گزارشات آگهی های مخرب',
+                  permission_id: 'bad_adv.manage'
+                },
+                {
+                  url: '/adv/reason-ad',
+                  name: 'adv-delete',
+                  slug: 'adv-delete',
+                  i18n: 'دلایل حذف آگهی',
+                  permission_id: 'adv.report_delete'
+                },
+                {
+                    url: '/adv/report/chart',
+                    name: 'advDeleteChart',
+                    slug: 'adv-delete-chart',
+                    i18n: 'نمودار آگهی ها',
+                    permission_id: 'adv.report'
+                }
+            ]
+        },
+        {
+            url: null,
+            name: 'User',
+            icon: 'UsersIcon',
+            i18n: 'کاربران',
+            submenu: [
+                {
+                    url: '/user/list',
+                    name: 'List',
+                    slug: 'user-list',
+                    i18n: 'لیست کاربران',
+                    permission_id:'user.list'
+                },
+                // {
+                //     url: '/user/add',
+                //     name: 'AddUser',
+                //     slug: 'add-user',
+                //     i18n: 'افزودن کاربر',
+                //     permission_id:'user.create'
+                // },
+                {
+                    url: '/users/report',
+                    name: 'usersReport',
+                    slug: 'users-report',
+                    i18n: 'گزارشات فعالیت کاربران',
+                    permission_id:'user.report'
+                },
+                {
+                  url: '/user/access',
+                  name: 'user-access',
+                  slug: 'user-access',
+                  i18n: 'دسترسی ها',
+                  permission_id:'permission.create'
+                },
+                {
+                    url: '/user/report',
+                    name: 'userReport',
+                    slug: 'user-report',
+                    i18n: 'گزارش فعالیت یک کاربر خاص',
+                },
+                {
+                    url: '/users/chart',
+                    name: 'usersChart',
+                    slug: 'users-chart',
+                    i18n: 'نمودار ها و گزارشات کاربران',
+                    permission_id:'user.report'
+                },
+            ]
+        },
+        {
+            url: null,
+            name: 'customer',
+            icon: 'UserIcon',
+            i18n: 'مشتریان',
+            submenu: [
+                {
+                    url: '/customer/list',
+                    name: 'customerList',
+                    slug: 'customer-list',
+                    i18n: 'لیست مشتریان',
+                    permission_id: 'customer.list'
+                },
+                {
+                    url: '/customer/request',
+                    name: 'customerRequest',
+                    slug: 'customer-request',
+                    i18n: 'درخواست های احراز هویت',
+                    permission_id: 'customer.report_auth'
+                },
+                {
+                    url: '/customer/activate',
+                    name: 'customerActivate',
+                    slug: 'customer-activate',
+                    i18n: 'مدیریت فعال سازی اکانت',
+                    permission_id: 'customer.report_active'
+                },
+                // {
+                //     url: '/customer/edit',
+                //     name: 'customerEdit',
+                //     slug: 'customer-edit',
+                //     i18n: 'ویرایش اطلاعات مشتریان',
+                //     permission_id: 'customer.update'
+                // },
+                {
+                    url: '/customer/report',
+                    name: 'customerReport',
+                    slug: 'customer-report',
+                    i18n: 'گزارش ها و اطلاعات مشتریان',
+                    permission_id: 'public'
+                }
+            ]
+        },
+        {
+            url: null,
+            name: 'scores',
+            icon: 'GiftIcon',
+            i18n: 'امتیازات',
+            submenu: [
+                {
+                    url: '/customers/scores',
+                    name: 'customersScores',
+                    slug: 'customers-scores',
+                    i18n: 'گزارش امتیازات مشتریان',
+                    permission_id: 'exchange.show'
+                },
+                {
+                    url: '/customers/scores/chart',
+                    name: 'customersScoresReport',
+                    slug: 'customers-scores-report',
+                    i18n: 'نمودار های گزارشات امتیاز مشتریان',
+                    permission_id: 'transaction.report'
+                },
+                {
+                    url: '/customer/change-score',
+                    name: 'customerChangeScore',
+                    slug: 'customer-change-score',
+                    i18n: 'تبدیل امتیاز پرداختی به وجه',
+                    permission_id: 'exchange.report'
+                },
+            ]
+        },
+        {
+          url: null,
+          icon: 'DollarSignIcon',
+          i18n: 'هزینه ها',
+          submenu: [
+            {
+              url: '/costs/assign-price',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'لیست امکانات ارتقا',
+              permission_id: 'price_rule.ip'
+            },
+            {
+              url: '/costs/allocation-price',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'تخصیص به امکانات ارتقا',
+              // permission_id: 'price_rule.ip'
+            },
+            {
+              url: '/costs/store-price',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'لیست قیمت گذاری فروشگاه',
+              permission_id: 'price_rule.store'
+            },
+            {
+              url: '/costs/store/create',
+              name: 'categoryStore',
+              slug: 'store-category',
+              i18n: 'تخصیص هزینه به فروشگاه ها',
+              // permission_id: 'price_rule.store'
+            },
+            {
+              url: '/costs/list-price-ad',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'لیست قیمت بسته های آگهی',
+              permission_id: 'price_rule.ipc'
+            },
+            {
+              url: '/costs/ipc/create',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'افزودن هزینه به بسته ها',
+              // permission_id: 'price_rule.ipc'
+            },
+            {
+              url: '/costs/list-price-category',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'لیست هزینه دسته',
+              permission_id: 'price_rule.collection'
+            },
+            {
+              url: '/costs/collection/create',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'افزودن هزینه دسته',
+              // permission_id: 'price_rule.collection'
+            },
+            {
+              url: '/costs/list-return-documents',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'لیست اسناد برگشت وجه',
+              permission_id: 'findoc.report'
+            },
+            {
+              url: '/costs/chart-documents',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'نمودار اسناد برگشت وجه',
+              permission_id: 'findoc.report'
+            },
+            {
+              url: '/costs/deposit-documents',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'لیست گزارشات اسناد واریزی',
+              permission_id: 'transaction.report'
+            },
+            {
+              url: '/costs/customer-creditor',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'لیست مشتریان بستانکار',
+              permission_id: 'transaction.report'
+            },
+            {
+              url: '/costs/chart-deposit-documents',
+              name: 'categoryList',
+              slug: 'list-category',
+              i18n: 'نمودارهای گزارشات اسناد واریزی',
+              permission_id: 'transaction.report'
+            },
+
+          ]
+        },
+        {
+          url: null,
+          icon: 'MessageSquareIcon',
+          i18n: 'دیدگاه ها',
+          submenu: [
+            {
+              url: '/opinions/list-manager',
+              name: 'orderList',
+              slug: 'order-list',
+              i18n: 'لیست دیدگاه ها ',
+              permission_id: 'comment.report'
+            },
+            {
+             url: '/opinions/charts',
+             name: 'orderList',
+             slug: 'order-list',
+             i18n: 'گزارشات و نمودارهای دیدگاه ها',
+             permission_id: 'comment.report'
+            },
+          ]
+        },
+        {
+          url: null,
+          icon: 'FileTextIcon',
+          i18n: 'وبلاگ',
+          submenu: [
+            {
+              url: '/blog/list',
+              name: 'List',
+              slug: 'app-user-list',
+              i18n: 'لیست نوشته ها',
+              permission_id: 'post.list'
+            },
+            {
+                  url: '/blog/add',
+                  name: 'AddCustomer',
+                  slug: 'add-customer',
+                  i18n: 'افزودن نوشته',
+            },
+            {
+                  url: '/blog/edit',
+                  name: 'AddCustomer',
+                  slug: 'add-customer',
+                  i18n: 'ویرایش نوشته'
+            },
+            {
+                  url: '/blog-chart',
+                  name: 'AddCustomer',
+                  slug: 'add-customer',
+                  i18n: 'نمودارهای نوشته های سایت',
+                  permission_id: 'post',
+            },
+            // {
+            //   url: '/apps/user/user-edit/268',
+            //   name: 'Edit',
+            //   slug: 'app-user-edit',
+            //   i18n: 'Edit'
+            // }
+          ]
+        },
+        {
+          url: null,
+          icon: 'ShoppingCartIcon',
+          i18n: 'فروشگاه',
+          submenu: [
+            {
+              url: '/store/list',
+              name: 'List',
+              slug: 'app-fee-list',
+              i18n: 'لیست فروشگاه ها',
+              permission_id: 'store.create'
+            },
+            {
+              url: '/store/create',
+              name: 'List',
+              slug: 'app-bag-list',
+              i18n: 'ثبت فروشگاه',
+              permission_id: 'store.create'
+            },
+            {
+              url: '/store/edit',
+              name: 'List',
+              slug: 'app-debit-list',
+              i18n: 'ویرایش فروشگاه'
+            },
+            {
+              url: '/store/chart',
+              name: 'List',
+              slug: 'app-debit-list',
+              i18n: 'نمودارهای فروشگاه ها',
+              permission_id: 'store.report'
+            },
+            // {
+            //   url: '/apps/user/user-edit/268',
+            //   name: 'Edit',
+            //   slug: 'app-user-edit',
+            //   i18n: 'Edit'
+            // }
+          ]
+        },
+        {
+          url: '/ipc/list',
+          icon: 'BoxIcon',
+          i18n: 'بسته',
+          name: 'list-ipc',
+          slug: 'list-ipc',
+          permission_id: 'ipc.list',
+        },
+        {
+            url: '/files',
+            icon: 'FolderIcon',
+            name: 'files',
+            slug: 'files',
+            i18n: 'فایل ها',
+            permission_id: 'file.list'
+        },
+        {
+            url: '/system/introduction-number',
+            icon: 'MonitorIcon',
+            i18n: 'معرفی به سیستم',
+            permission_id: 'public'
+        },
+        {
+            url: '/marketer/list',
+            icon: 'UserPlusIcon',
+            i18n: 'بازاریاب',
+            permission_id: 'access.report'
+        },
+        {
+            url: '/inbox/message',
+            icon: 'InboxIcon',
+            i18n: 'صندوق ورودی',
+            permission_id: 'contact.report'
+        },
+        {
+            url: '/activity/list',
+            icon: 'ActivityIcon',
+            i18n: 'فعالیت های من',
+            permission_id: 'public'
+        }
+    ]
+  },
+]
+
+
+export default menu_items
diff --git a/src/layouts/components/vertical-nav-menu/navMenuItems.js b/src/layouts/components/vertical-nav-menu/navMenuItems.js
index 0597e55..18739da 100644
--- a/src/layouts/components/vertical-nav-menu/navMenuItems.js
+++ b/src/layouts/components/vertical-nav-menu/navMenuItems.js
@@ -26,6 +26,13 @@ export default [
     slug: "personel",
     icon: "AlignJustifyIcon",
     i18n: "اطلاعات پرسنلی",
+  },
+  {
+    url: "/permission",
+    name: "permission",
+    slug: "permission",
+    icon: "AlignJustifyIcon",
+    i18n: "سطح دسترسی",
   }
 ]
 
diff --git a/src/router.js b/src/router.js
index eff1701..e3dcf3f 100644
--- a/src/router.js
+++ b/src/router.js
@@ -95,6 +95,15 @@ const router = new Router({
                         parent: 'main'
                     }
                 },
+                {
+                    path: '/permission',
+                    name: 'permission',
+                    component: () => import('./views/permission/Access.vue'),
+                    meta: {
+                        rule: 'editor',
+                        parent: 'main'
+                    }
+                },
             ]
         },
         {
diff --git a/src/views/permission/Access.vue b/src/views/permission/Access.vue
new file mode 100644
index 0000000..8b79324
--- /dev/null
+++ b/src/views/permission/Access.vue
@@ -0,0 +1,150 @@
+<template>
+  <a-form :form="form" @submit="handleSubmit">
+    <vx-card title="دسترسی ها">
+      <ASpin type="loading" :spinning="loading">
+        <div class="grid grid-col-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-2 md:gap-2 xl:grid-cols-2 lg:gap-4 xl:gap-4">
+            <a-form-item label="سطح کاربر">
+              <a-select
+                v-decorator="['user_type', { initialValue:null,rules: [{ required: true, message: 'لطفاسطح دسترسی را انتخاب کنید' }] }]" @change="selectChange">
+                <a-select-option v-for="(item,key) in userTypes" :value="key">
+                  {{ item }}
+                </a-select-option>
+              </a-select>
+            </a-form-item>
+            <a-form-item label="نقش ها">
+              <a-tree
+                    v-model="rid"
+                    checkable
+                    default-expand-all
+                    style="width: 100%"
+                    :tree-data="treeData"
+                    :replace-fields="replaceFields"
+                    :auto-expand-parent="autoExpandParent"
+              />
+            </a-form-item>
+        </div>
+        <a-button type="primary" html-type="submit">
+           ثبت اطلاعات
+        </a-button>
+      </ASpin>
+    </vx-card>
+  </a-form>
+</template>
+
+<script>
+
+  import axios from '@/axios'
+
+  export default {
+    name: "Access",
+    data() {
+      return {
+        form: this.$form.createForm(this, {name: 'coordinated'}),
+        expandedKeys:[],
+        value: ['0-0-0'],
+        treeData:undefined,
+        userTypes: undefined,
+        autoExpandParent: false,
+        rid: [],
+        replaceFields: {
+          children: 'child',
+          title: 'title'
+        },
+        keyId: null,
+        getDataUserType:null
+      }
+    },
+
+    methods: {
+      async getPermission() {
+        try{
+          const {data} = await axios.get('admin/permission/rid')
+          this.treeData = Object.values(data)
+        }catch (e) {
+
+        }finally {
+
+        }
+      },
+      handleSubmit(e) {
+        e.preventDefault();
+        this.form.validateFields(async (err, values) => {
+          if (!err) {
+            try {
+              values.rid = this.rid
+              await this.$store.dispatch('access/save', values);
+              this.$ntSet()
+              setTimeout(()=>{
+                window.location.reload()
+              },500)
+            } catch (e) {
+              this.$ntSetError()
+            } finally {
+            }
+          }
+        });
+      },
+      async getUserType() {
+        const {data} = await axios.get('admin/user/type')
+        this.userTypes = data
+        console.log(this.userTypes,'user_type')
+      },
+      loadSyncOptionChange(){
+        let storageId = localStorage.getItem("contestId");
+        storageId = this.keyId;
+        localStorage.setItem("contestId", storageId);
+        let test = localStorage.getItem("contestId");
+        test = JSON.parse(localStorage.getItem("contestId"));
+        localStorage.setItem("contestId", test);
+        if(test != null){
+          this.$store.dispatch('access/getOneId',test).then(()=>{
+            this.rid = this.data.rid
+            this.form.setFieldsValue(this.data)
+          })
+        }else{
+          return false
+        }
+      },
+      selectChange(id){
+        this.keyId = id
+        this.loadSyncOptionChange()
+      }
+    },
+    computed: {
+      loading() {
+        return this.$store.state.access.loading;
+      },
+      data(){
+        console.log(this.$store.state.access.access_id,'hgghgh')
+        return this.$store.state.access.access_id
+      }
+    },
+    mounted() {
+      this.getUserType()
+      this.getPermission()
+      this.keyId = 1
+      this.loadSyncOptionChange()
+    }
+  }
+</script>
+
+
+<style>
+  [dir=rtl] .ant-tree-checkbox-inner::after{
+    right: 55%;
+    top: 35%;
+    border-left: 0 !important;
+    -webkit-transform: rotate(-45deg) scale(0) translate(50%, -50%);
+    transform: rotate(-45deg) scale(0) translate(50%, -50%);
+  }
+  [dir=rtl] .ant-tree-checkbox-checked .ant-tree-checkbox-inner::after{
+    border-left: 0 !important;
+    border-right: 2px solid #fff;
+  }
+  [dir=rtl] .ant-tree-checkbox-checked .ant-tree-checkbox-inner::after {
+    border-left: 0 !important;
+    border-right: 2px solid #fff;
+    -webkit-transform: rotate(-45deg) scale(1) translate(50%, -50%);
+    transform: rotate(25deg) scale(1) translate(50%, -50%);
+  }
+</style>