@iankibetsh/shframework 1.4.5 → 1.4.6

package/dist/dist/library.mjs.css

@@ -1,36 +1,4 @@
 
-.sh-phone{
-  display: flex;
-  width: 100%;
-  align-items: center;
-  padding: 0 0.25rem;
-}
-.phone-country{
-  width: 2rem;
-  border: none;
-  align-self: center;
-  outline: none !important;
-  padding: 0.4rem;
-  border-right: 1px solid #0003;
-}
-.phone-number{
-  width: calc(100% - 2.2rem);
-  border: none;
-  align-self: center;
-  outline: none;
-  margin-bottom: 0;
-  padding: 0.4rem;
-}
-.sh-phone img{
-  padding: 0.125rem;
-  width: 2rem;
-  height: 2rem;
-}
-.phone-number::placeholder{
-  font-weight: 300;
-  opacity: 0.5;
-}
-
 .colored-toast.swal2-icon-success {
   background-color: #a5dc86 !important;
 }
@@ -63,19 +31,68 @@
   color: white;
 }
 
-.sh-selected-item{
-  line-height: unset!important;
+.sh-phone{
+  display: flex;
+  width: 100%;
+  align-items: center;
+  padding: 0 0.25rem;
 }
-.sh-suggestion-input{
-  padding: 0.375rem 0.75rem;
+.phone-country{
+  width: 2rem;
+  border: none;
+  align-self: center;
+  outline: none !important;
+  padding: 0.4rem;
+  border-right: 1px solid #0003;
 }
-.sh-suggest{
-  margin-bottom: 1rem;
+.phone-number{
+  width: calc(100% - 2.2rem);
+  border: none;
+  align-self: center;
+  outline: none;
+  margin-bottom: 0;
+  padding: 0.4rem;
 }
-.sh-suggest-control::after{
-  margin-top: auto;
-  margin-bottom: auto;
-  margin-right: 0.255em;
+.sh-phone img{
+  padding: 0.125rem;
+  width: 2rem;
+  height: 2rem;
+}
+.phone-number::placeholder{
+  font-weight: 300;
+  opacity: 0.5;
+}
+
+.permissions-main {
+  background: #edeff2;
+}
+.permissions-main div#permissions-nav {
+  padding: 0;
+}
+.permissions-main div#permissions-nav ul {
+  padding-left: 0;
+  max-height: 400px;
+  overflow-y: auto;
+}
+.permissions-main div#permissions-nav ul li.active {
+  border-right: none !important;
+  position: relative;
+  top: 0;
+  left: 0;
+  background: white;
+  border-radius: 10px 0 0 10px;
+}
+.permissions-main div#permissions-nav ul li {
+  list-style: none;
+  padding-inline-start: 10px;
+  display: flex;
+  gap: 5px;
+}
+.permissions-main div#permissions-nav ul li label {
+  padding: 8px 0;
+  cursor: pointer;
+  height: 100%;
+  flex-grow: 1;
 }
 
 :root {
@@ -99,6 +116,21 @@
   }
 }
 
+.sh-selected-item{
+  line-height: unset!important;
+}
+.sh-suggestion-input{
+  padding: 0.375rem 0.75rem;
+}
+.sh-suggest{
+  margin-bottom: 1rem;
+}
+.sh-suggest-control::after{
+  margin-top: auto;
+  margin-bottom: auto;
+  margin-right: 0.255em;
+}
+
 .sh-forgot-link, .sh-register-link{
   cursor: pointer;
 }

package/dist/library.js

@@ -9,8 +9,8 @@ var NProgress = require('nprogress');
 var vue = require('vue');
 var Editor = require('@tinymce/tinymce-vue');
 var _ = require('lodash');
-var pinia = require('pinia');
 var vueRouter = require('vue-router');
+var pinia = require('pinia');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -2555,10 +2555,10 @@ const _hoisted_7$5 = { class: "row" };
 const _hoisted_8$3 = { class: "fg-label control-label text-capitalize control-bel col-md-12 request-form-label mb-2" };
 const _hoisted_9$4 = { class: "col-md-12" };
 const _hoisted_10$3 = ["data-cy", "placeholder", "name", "onFocus", "onChange"];
-const _hoisted_11$2 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
-const _hoisted_12$2 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
-const _hoisted_13$2 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
-const _hoisted_14$2 = ["data-cy", "name", "onFocus", "onUpdate:modelValue"];
+const _hoisted_11$3 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
+const _hoisted_12$3 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
+const _hoisted_13$3 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
+const _hoisted_14$3 = ["data-cy", "name", "onFocus", "onUpdate:modelValue"];
 const _hoisted_15$2 = ["disabled", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
 const _hoisted_16$2 = ["name", "onFocus", "onUpdate:modelValue"];
 const _hoisted_17$2 = ["name", "onFocus", "onUpdate:modelValue"];
@@ -2663,7 +2663,7 @@ function render$5(_ctx, _cache, $props, $setup, $data, $options) {
                     class: vue.normalizeClass([_ctx.form_errors[field] == null ? ' field_' + field:'is-invalid ' + field, "form-control"]),
                     "onUpdate:modelValue": $event => ((_ctx.form_elements[field]) = $event),
                     type: "number"
-                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_11$2)), [
+                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_11$3)), [
                     [vue.vModelText, _ctx.form_elements[field]]
                   ])
                 : vue.createCommentVNode("v-if", true),
@@ -2677,7 +2677,7 @@ function render$5(_ctx, _cache, $props, $setup, $data, $options) {
                     class: vue.normalizeClass([_ctx.form_errors[field] == null ? ' field_' + field:'is-invalid ' + field, "form-control"]),
                     "onUpdate:modelValue": $event => ((_ctx.form_elements[field]) = $event),
                     type: "password"
-                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_12$2)), [
+                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_12$3)), [
                     [vue.vModelText, _ctx.form_elements[field]]
                   ])
                 : vue.createCommentVNode("v-if", true),
@@ -2692,7 +2692,7 @@ function render$5(_ctx, _cache, $props, $setup, $data, $options) {
                     "onUpdate:modelValue": $event => ((_ctx.form_elements[field]) = $event),
                     type: "email",
                     required: ""
-                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_13$2)), [
+                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_13$3)), [
                     [vue.vModelText, _ctx.form_elements[field]]
                   ])
                 : vue.createCommentVNode("v-if", true),
@@ -2705,7 +2705,7 @@ function render$5(_ctx, _cache, $props, $setup, $data, $options) {
                     onFocus: $event => ($options.removeErrors(field)),
                     class: vue.normalizeClass([_ctx.form_errors[field] == null ? ' field_' + field:'is-invalid ' + field, "form-control active"]),
                     "onUpdate:modelValue": $event => ((_ctx.form_elements[field]) = $event)
-                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_14$2)), [
+                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_14$3)), [
                     [vue.vModelText, _ctx.form_elements[field]]
                   ])
                 : vue.createCommentVNode("v-if", true),
@@ -3616,16 +3616,16 @@ const _hoisted_9$3 = [
   _hoisted_4$6
 ];
 const _hoisted_10$2 = { class: "record_counts" };
-const _hoisted_11$1 = {
+const _hoisted_11$2 = {
   key: 0,
   "aria-label": "Page navigation"
 };
-const _hoisted_12$1 = { class: "pagination" };
-const _hoisted_13$1 = {
+const _hoisted_12$2 = { class: "pagination" };
+const _hoisted_13$2 = {
   key: 0,
   class: "page-link"
 };
-const _hoisted_14$1 = {
+const _hoisted_14$2 = {
   key: 1,
   class: "page-link"
 };
@@ -3668,8 +3668,8 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
           vue.createElementVNode("span", _hoisted_10$2, " of " + vue.toDisplayString($props.pagination_data.record_count) + " items", 1 /* TEXT */)
         ]),
         ($props.pagination_data != null)
-          ? (vue.openBlock(), vue.createElementBlock("nav", _hoisted_11$1, [
-              vue.createElementVNode("ul", _hoisted_12$1, [
+          ? (vue.openBlock(), vue.createElementBlock("nav", _hoisted_11$2, [
+              vue.createElementVNode("ul", _hoisted_12$2, [
                 vue.createElementVNode("li", {
                   class: vue.normalizeClass([$options.getActivePage === 1 ? 'disabled' : '' , "page-item"])
                 }, [
@@ -3684,9 +3684,9 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
                     key: page
                   }, [
                     ($options.getActivePage === page)
-                      ? (vue.openBlock(), vue.createElementBlock("a", _hoisted_13$1, vue.toDisplayString(page), 1 /* TEXT */))
+                      ? (vue.openBlock(), vue.createElementBlock("a", _hoisted_13$2, vue.toDisplayString(page), 1 /* TEXT */))
                       : (['..','...'].includes(page))
-                        ? (vue.openBlock(), vue.createElementBlock("a", _hoisted_14$1, vue.toDisplayString(page), 1 /* TEXT */))
+                        ? (vue.openBlock(), vue.createElementBlock("a", _hoisted_14$2, vue.toDisplayString(page), 1 /* TEXT */))
                         : (vue.openBlock(), vue.createElementBlock("a", {
                             key: 2,
                             onClick: $event => ($options.changeTableKey('page',page)),
@@ -4193,20 +4193,20 @@ const _hoisted_7$2 = {
 const _hoisted_8$2 = { class: "col-12 mb-3" };
 const _hoisted_9$2 = { class: "sh-search-bar" };
 const _hoisted_10$1 = ["placeholder"];
-const _hoisted_11 = {
+const _hoisted_11$1 = {
   key: 0,
   class: "text-center"
 };
-const _hoisted_12 = /*#__PURE__*/vue.createElementVNode("div", {
+const _hoisted_12$1 = /*#__PURE__*/vue.createElementVNode("div", {
   class: "spinner-border",
   role: "status"
 }, [
   /*#__PURE__*/vue.createElementVNode("span", { class: "visually-hidden" }, "Loading...")
 ], -1 /* HOISTED */);
-const _hoisted_13 = [
-  _hoisted_12
+const _hoisted_13$1 = [
+  _hoisted_12$1
 ];
-const _hoisted_14 = {
+const _hoisted_14$1 = {
   key: 1,
   class: "alert alert-danger"
 };
@@ -4376,9 +4376,9 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
     ($options.hasDefaultSlot)
       ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
           ($data.loading === 'loading')
-            ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_11, _hoisted_13))
+            ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_11$1, _hoisted_13$1))
             : ($data.loading === 'error')
-              ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14, [
+              ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14$1, [
                   vue.createElementVNode("span", _hoisted_15, vue.toDisplayString($data.loading_error), 1 /* TEXT */)
                 ]))
               : vue.createCommentVNode("v-if", true),
@@ -4984,6 +4984,192 @@ return (_ctx, _cache) => {
 
 script$4.__file = "src/lib/components/ShDynamicTabs.vue";
 
+const _withScopeId$1 = n => (vue.pushScopeId("data-v-0d4fa0ac"),n=n(),vue.popScopeId(),n);
+const _hoisted_1$3 = { class: "row permissions-main d-flex" };
+const _hoisted_2$3 = {
+  id: "permissions-nav",
+  class: "col-md-2 d-flex align-items-center py-4"
+};
+const _hoisted_3$3 = ["disabled", "checked"];
+const _hoisted_4$3 = ["onClick"];
+const _hoisted_5$3 = {
+  id: "permissions-content",
+  class: "col-md-10 py-4 pe-4 ps-0"
+};
+const _hoisted_6$2 = { class: "p-2 rounded-2 bg-white h-100" };
+const _hoisted_7$1 = {
+  key: 0,
+  class: "alert alert-info"
+};
+const _hoisted_8$1 = { key: 1 };
+const _hoisted_9$1 = { class: "row row-cols-4" };
+const _hoisted_10 = { class: "col py-3" };
+const _hoisted_11 = ["value"];
+const _hoisted_12 = {
+  key: 0,
+  class: "w-100 row"
+};
+const _hoisted_13 = { class: "col-md-3" };
+const _hoisted_14 = /*#__PURE__*/ _withScopeId$1(() => /*#__PURE__*/vue.createElementVNode("i", { class: "bi-check" }, null, -1 /* HOISTED */));
+
+var script$3 = {
+  __name: 'ManagePermissions',
+  setup(__props) {
+
+const route = vueRouter.useRoute();
+const modules = vue.ref([]);
+const selectedModule = vue.ref('tasks');
+const modulePermissions = vue.ref(null);
+
+const selectedPermissions = vue.ref([]);
+const permissionsChanged = vue.ref(false);
+const departmentId = route.params.id;
+const setModule = module=>{
+  (selectedModule.value !== module) && (selectedModule.value = module) && getModulePermissions();
+};
+vue.onMounted(() => {
+  getDepartmentModules();
+});
+const getDepartmentModules = ()=>{
+  shApis.doGet(`admin/departments/department/list-all-modules/admin`).then(res=>{
+    modules.value = res.data.modules;
+    selectedModule.value = res.data.modules[0];
+    getModulePermissions();
+  });
+};
+const loading = vue.ref(false);
+const getModulePermissions = () => {
+  loading.value = true;
+  modulePermissions.value = null;
+  shApis.doGet(`admin/departments/department/get-module-permissions/${selectedModule.value}?department_id=${departmentId}`).then(res=>{
+    loading.value = false;
+    modulePermissions.value = reformatModulePermissions(res.data.permissions);
+    selectedPermissions.value = res.data.selectedPermissions ?? [];
+    permissionsChanged.value = false;
+  });
+};
+function reformatModulePermissions(mPs){
+let mpModules = {};
+  mPs.map(mp=>{
+    const arr = mp.split('.');
+    const key = arr[0];
+    if(typeof mpModules[key] == 'undefined'){
+      mpModules[key]=[];
+    }
+    mpModules[key].push(mp);
+  });
+  return mpModules
+}
+const setPermissionsChanged = ()=>{
+  permissionsChanged.value = true;
+  return true
+};
+const checkAllPermissions = ()=>{
+  if(selectedPermissions.value.length > 0) {
+    selectedPermissions.value = [];
+  } else {
+    console.log(modulePermissions.value);
+    const all = modulePermissions.value;
+    Object.keys(all).map(key=>{
+      all[key].map(permission=>{
+        selectedPermissions.value.push(permission);
+      });
+    });
+  }
+  permissionsChanged.value = true;
+};
+const getLabel = permission => {
+  const arr = permission.split('.');
+  return arr[arr.length - 1].replaceAll('_',' ')
+};
+const getPermissionStyle = permission => {
+  return {
+    paddingLeft: `${(permission.split('.').length-1) * 20}px`
+  }
+};
+
+return (_ctx, _cache) => {
+  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$3, [
+    vue.createElementVNode("div", _hoisted_2$3, [
+      (vue.openBlock(), vue.createElementBlock("ul", {
+        class: "d-flex flex-column w-100 ps-2",
+        key: selectedModule.value ? selectedModule.value:0
+      }, [
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(modules.value, (module) => {
+          return (vue.openBlock(), vue.createElementBlock("li", {
+            class: vue.normalizeClass(selectedModule.value === module && 'active'),
+            key: selectedModule.value
+          }, [
+            vue.createElementVNode("input", {
+              onClick: _cache[0] || (_cache[0] = $event => (checkAllPermissions())),
+              disabled: selectedModule.value !== module,
+              checked: selectedPermissions.value.length > 0 && selectedModule.value === module,
+              type: "checkbox"
+            }, null, 8 /* PROPS */, _hoisted_3$3),
+            vue.createElementVNode("label", {
+              class: "text-capitalize",
+              onClick: $event => (setModule(module))
+            }, vue.toDisplayString(module.replaceAll('_',' ')), 9 /* TEXT, PROPS */, _hoisted_4$3)
+          ], 2 /* CLASS */))
+        }), 128 /* KEYED_FRAGMENT */))
+      ]))
+    ]),
+    vue.createElementVNode("div", _hoisted_5$3, [
+      vue.createElementVNode("div", _hoisted_6$2, [
+        (loading.value)
+          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$1, " loading ... "))
+          : (vue.openBlock(), vue.createElementBlock("div", _hoisted_8$1, [
+              vue.createElementVNode("div", _hoisted_9$1, [
+                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(modulePermissions.value, (permissions) => {
+                  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_10, [
+                    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(permissions, (permission) => {
+                      return (vue.openBlock(), vue.createElementBlock("label", {
+                        onClick: setPermissionsChanged,
+                        class: "text-capitalize list-group-item pb-1 text-capitalize",
+                        style: vue.normalizeStyle(getPermissionStyle(permission))
+                      }, [
+                        vue.withDirectives(vue.createElementVNode("input", {
+                          "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => ((selectedPermissions).value = $event)),
+                          value: permission,
+                          type: "checkbox"
+                        }, null, 8 /* PROPS */, _hoisted_11), [
+                          [vue.vModelCheckbox, selectedPermissions.value]
+                        ]),
+                        vue.createTextVNode(" " + vue.toDisplayString(getLabel(permission)), 1 /* TEXT */)
+                      ], 4 /* STYLE */))
+                    }), 256 /* UNKEYED_FRAGMENT */))
+                  ]))
+                }), 256 /* UNKEYED_FRAGMENT */))
+              ]),
+              (permissionsChanged.value)
+                ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12, [
+                    vue.createElementVNode("div", _hoisted_13, [
+                      vue.createVNode(script$8, {
+                        url: `admin/departments/department/permissions/${vue.unref(departmentId)}/${selectedModule.value}`,
+                        data: {permissions: selectedPermissions.value},
+                        class: "btn btn-primary d-block"
+                      }, {
+                        default: vue.withCtx(() => [
+                          _hoisted_14,
+                          vue.createTextVNode(" Save")
+                        ]),
+                        _: 1 /* STABLE */
+                      }, 8 /* PROPS */, ["url", "data"])
+                    ])
+                  ]))
+                : vue.createCommentVNode("v-if", true)
+            ]))
+      ])
+    ])
+  ]))
+}
+}
+
+};
+
+script$3.__scopeId = "data-v-0d4fa0ac";
+script$3.__file = "src/lib/components/core/Departments/department/ManagePermissions.vue";
+
 const useUserStore = pinia.defineStore('user-store', {
   state: () => ({
     user: null,
@@ -5080,19 +5266,19 @@ const useUserStore = pinia.defineStore('user-store', {
   }
 });
 
-const _hoisted_1$3 = /*#__PURE__*/vue.createElementVNode("h5", null, "Departments", -1 /* HOISTED */);
-const _hoisted_2$3 = { class: "card sh-departments-card shadow" };
-const _hoisted_3$3 = { class: "card-body" };
-const _hoisted_4$3 = {
+const _hoisted_1$2 = /*#__PURE__*/vue.createElementVNode("h5", null, "Departments", -1 /* HOISTED */);
+const _hoisted_2$2 = { class: "card sh-departments-card shadow" };
+const _hoisted_3$2 = { class: "card-body" };
+const _hoisted_4$2 = {
   "data-bs-toggle": "modal",
   ref: "addDeptBtn",
   href: "#sh-department_modal",
   class: "btn btn-info btn-sm"
 };
-const _hoisted_5$3 = /*#__PURE__*/vue.createElementVNode("i", { class: "fa fa-plus" }, null, -1 /* HOISTED */);
+const _hoisted_5$2 = /*#__PURE__*/vue.createElementVNode("i", { class: "fa fa-plus" }, null, -1 /* HOISTED */);
 
 
-var script$3 = {
+var script$2 = {
   __name: 'Departments',
   setup(__props) {
 
@@ -5115,11 +5301,11 @@ function departmentAdded (response) {
 
 return (_ctx, _cache) => {
   return (vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
-    _hoisted_1$3,
-    vue.createElementVNode("div", _hoisted_2$3, [
-      vue.createElementVNode("div", _hoisted_3$3, [
-        vue.createElementVNode("a", _hoisted_4$3, [
-          _hoisted_5$3,
+    _hoisted_1$2,
+    vue.createElementVNode("div", _hoisted_2$2, [
+      vue.createElementVNode("div", _hoisted_3$2, [
+        vue.createElementVNode("a", _hoisted_4$2, [
+          _hoisted_5$2,
           vue.createTextVNode(" ADD DEPARTMENT")
         ], 512 /* NEED_PATCH */),
         vue.createVNode(script$6, {
@@ -5158,14 +5344,14 @@ return (_ctx, _cache) => {
 
 };
 
-script$3.__file = "src/lib/components/core/Departments/Departments.vue";
+script$2.__file = "src/lib/components/core/Departments/Departments.vue";
 
-const _hoisted_1$2 = {
+const _hoisted_1$1 = {
   key: 0,
   class: "card sh-department-view shadow"
 };
-const _hoisted_2$2 = { class: "card-body" };
-const _hoisted_3$2 = /*#__PURE__*/vue.createElementVNode("a", {
+const _hoisted_2$1 = { class: "card-body" };
+const _hoisted_3$1 = /*#__PURE__*/vue.createElementVNode("a", {
   href: "#addModule",
   class: "btn btn-info btn-sm",
   "data-bs-toggle": "modal"
@@ -5173,11 +5359,11 @@ const _hoisted_3$2 = /*#__PURE__*/vue.createElementVNode("a", {
   /*#__PURE__*/vue.createElementVNode("i", { class: "bi-plus" }),
   /*#__PURE__*/vue.createTextVNode(" ADD Module")
 ], -1 /* HOISTED */);
-const _hoisted_4$2 = { class: "text-primary text-capitalize" };
-const _hoisted_5$2 = ["value"];
-const _hoisted_6$2 = /*#__PURE__*/vue.createElementVNode("i", { class: "fa fa-save" }, null, -1 /* HOISTED */);
+const _hoisted_4$1 = { class: "text-primary text-capitalize" };
+const _hoisted_5$1 = ["value"];
+const _hoisted_6$1 = /*#__PURE__*/vue.createElementVNode("i", { class: "fa fa-save" }, null, -1 /* HOISTED */);
 
-var script$2 = {
+var script$1 = {
   __name: 'Department',
   setup(__props) {
 
@@ -5271,9 +5457,9 @@ function submitPermissions() {
 
 return (_ctx, _cache) => {
   return (vue.unref(department))
-    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
-        vue.createElementVNode("div", _hoisted_2$2, [
-          _hoisted_3$2,
+    ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
+        vue.createElementVNode("div", _hoisted_2$1, [
+          _hoisted_3$1,
           vue.createElementVNode("h5", null, "Department #" + vue.toDisplayString(vue.unref(department).id) + " - " + vue.toDisplayString(vue.unref(department).name) + " Allowed Modules", 1 /* TEXT */),
           vue.createVNode(script$6, {
             actions: {
@@ -5330,7 +5516,7 @@ return (_ctx, _cache) => {
             default: vue.withCtx(() => [
               (vue.unref(getModule))
                 ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
-                    vue.createElementVNode("h5", _hoisted_4$2, "Permissions for " + vue.toDisplayString(vue.unref(getModule).module), 1 /* TEXT */),
+                    vue.createElementVNode("h5", _hoisted_4$1, "Permissions for " + vue.toDisplayString(vue.unref(getModule).module), 1 /* TEXT */),
                     (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(modulePermissions), (permission) => {
                       return (vue.openBlock(), vue.createElementBlock("div", {
                         key: permission,
@@ -5343,7 +5529,7 @@ return (_ctx, _cache) => {
                             type: "checkbox",
                             "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => (vue.isRef(selectedPermissions) ? (selectedPermissions).value = $event : selectedPermissions = $event)),
                             value: permission
-                          }, null, 8 /* PROPS */, _hoisted_5$2), [
+                          }, null, 8 /* PROPS */, _hoisted_5$1), [
                             [vue.vModelCheckbox, vue.unref(selectedPermissions)]
                           ]),
                           vue.createTextVNode(" " + vue.toDisplayString(getPermissionLabel(permission)), 1 /* TEXT */)
@@ -5354,7 +5540,7 @@ return (_ctx, _cache) => {
                       onClick: submitPermissions,
                       class: "btn btn-info"
                     }, [
-                      _hoisted_6$2,
+                      _hoisted_6$1,
                       vue.createTextVNode(" Submit")
                     ])
                   ], 64 /* STABLE_FRAGMENT */))
@@ -5370,123 +5556,7 @@ return (_ctx, _cache) => {
 
 };
 
-script$2.__file = "src/lib/components/core/Departments/department/Department.vue";
-
-const _hoisted_1$1 = { class: "row permissions-main d-flex" };
-const _hoisted_2$1 = {
-  id: "permissions-nav",
-  class: "col-md-2 shadow d-flex align-items-center"
-};
-const _hoisted_3$1 = /*#__PURE__*/vue.createElementVNode("input", { type: "checkbox" }, null, -1 /* HOISTED */);
-const _hoisted_4$1 = ["onClick"];
-const _hoisted_5$1 = {
-  id: "permissions-content",
-  class: "col-md-10"
-};
-const _hoisted_6$1 = {
-  key: 0,
-  class: "alert alert-info"
-};
-const _hoisted_7$1 = {
-  key: 1,
-  class: "d-flex justify-content-evenly"
-};
-const _hoisted_8$1 = { class: "col-md-3 list-group" };
-const _hoisted_9$1 = { class: "p-2 text-capitalize list-group-item pb-0 text-capitalize" };
-const _hoisted_10 = /*#__PURE__*/vue.createElementVNode("input", { type: "checkbox" }, null, -1 /* HOISTED */);
-
-var script$1 = {
-  __name: 'ManagePermissions',
-  setup(__props) {
-
-const route = vueRouter.useRoute();
-const tabs = vue.ref(null);
-vue.ref(0);
-const modules = vue.ref([]);
-const selectedModule = vue.ref('tasks');
-const modulePermissions = vue.ref(null);
-const setModule = module=>{
-  selectedModule.value = module;
-  getModulePermissions();
-};
-vue.onMounted(() => {
-  console.log(tabs.value.querySelectorAll('li'));
-  getDepartmentModules();
-});
-const getDepartmentModules = ()=>{
-  shApis.doGet(`admin/departments/department/list-modules/${route.params.id}?all=1`).then(res=>{
-    modules.value = res.data.data;
-    selectedModule.value = res.data.data[0];
-    getModulePermissions();
-  });
-};
-const loading = vue.ref(false);
-const getModulePermissions = () => {
-  loading.value = true;
-  modulePermissions.value = null;
-  shApis.doGet(`admin/departments/department/get-module-permissions/${selectedModule.value.module}`).then(res=>{
-    loading.value = false;
-    modulePermissions.value = reformatModulePermissions(res.data.permissions);
-  });
-};
-function reformatModulePermissions(mPs){
-let mpModules = {};
-  mPs.map(mp=>{
-    const arr = mp.split('.');
-    const key = arr[0];
-    if(typeof mpModules[key] == 'undefined'){
-      mpModules[key]=[];
-    }
-    mpModules[key].push(mp);
-  });
-  return mpModules
-}
-
-return (_ctx, _cache) => {
-  return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
-    vue.createElementVNode("div", _hoisted_2$1, [
-      vue.createElementVNode("ul", {
-        ref_key: "tabs",
-        ref: tabs,
-        class: "d-flex flex-column w-100"
-      }, [
-        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(modules.value, (module) => {
-          return (vue.openBlock(), vue.createElementBlock("li", {
-            class: vue.normalizeClass(selectedModule.value.id === module.id && 'active'),
-            key: module.id
-          }, [
-            _hoisted_3$1,
-            vue.createElementVNode("label", {
-              class: "text-capitalize",
-              onClick: $event => (setModule(module))
-            }, vue.toDisplayString(module.module.replaceAll('_',' ')), 9 /* TEXT, PROPS */, _hoisted_4$1)
-          ], 2 /* CLASS */))
-        }), 128 /* KEYED_FRAGMENT */))
-      ], 512 /* NEED_PATCH */)
-    ]),
-    vue.createElementVNode("div", _hoisted_5$1, [
-      (loading.value)
-        ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$1, " loading ... "))
-        : (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$1, [
-            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(modulePermissions.value, (permissions) => {
-              return (vue.openBlock(), vue.createElementBlock("div", _hoisted_8$1, [
-                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(permissions, (permission) => {
-                  return (vue.openBlock(), vue.createElementBlock("label", _hoisted_9$1, [
-                    _hoisted_10,
-                    vue.createTextVNode(" " + vue.toDisplayString(permission), 1 /* TEXT */)
-                  ]))
-                }), 256 /* UNKEYED_FRAGMENT */))
-              ]))
-            }), 256 /* UNKEYED_FRAGMENT */))
-          ]))
-    ])
-  ]))
-}
-}
-
-};
-
-script$1.__file = "src/lib/components/core/Departments/department/ManagePermissions.vue";
+script$1.__file = "src/lib/components/core/Departments/department/Department.vue";
 
 const _withScopeId = n => (vue.pushScopeId("data-v-2911509a"),n=n(),vue.popScopeId(),n);
 const _hoisted_1 = {
@@ -5650,15 +5720,15 @@ const ShFrontend = {
       });
       options.router.addRoute({
         path: '/sh-departments',
-        component: script$3
+        component: script$2
       });
       options.router.addRoute({
         path: '/sh-departments/permissions/:id',
-        component: script$2
+        component: script$1
       });
       options.router.addRoute({
         path: '/sh-departments/manage-permissions/:id',
-        component: script$1
+        component: script$3
       });
     }
     //filter unwanted config items from options to be put in local storage
@@ -5671,6 +5741,7 @@ const ShFrontend = {
 };
 
 exports.Countries = countries;
+exports.ManagePermissions = script$3;
 exports.ShAutoForm = script$e;
 exports.ShCanvas = script$a;
 exports.ShConfirmAction = script$8;

package/dist/library.mjs

@@ -2,11 +2,11 @@ import Axios from 'axios';
 import moment from 'moment';
 import Swal from 'sweetalert2';
 import NProgress from 'nprogress';
-import { openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, withDirectives, Fragment, renderList, vModelSelect, vModelText, resolveComponent, withModifiers, createVNode, ref, onMounted, unref, normalizeClass, createBlock, resolveDynamicComponent, inject, mergeProps, normalizeStyle, renderSlot, normalizeProps, guardReactiveProps, withCtx, createStaticVNode, shallowRef, computed, isRef, vModelCheckbox, watch, pushScopeId, popScopeId } from 'vue';
+import { openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, withDirectives, Fragment, renderList, vModelSelect, vModelText, resolveComponent, withModifiers, createVNode, ref, onMounted, unref, normalizeClass, createBlock, resolveDynamicComponent, inject, mergeProps, normalizeStyle, renderSlot, normalizeProps, guardReactiveProps, withCtx, createStaticVNode, shallowRef, vModelCheckbox, pushScopeId, popScopeId, computed, isRef, watch } from 'vue';
 import Editor from '@tinymce/tinymce-vue';
 import _ from 'lodash';
-import { defineStore, storeToRefs } from 'pinia';
 import { useRoute, useRouter } from 'vue-router';
+import { defineStore, storeToRefs } from 'pinia';
 
 function setItem (key, value) {
   let toStore = value;
@@ -2542,10 +2542,10 @@ const _hoisted_7$5 = { class: "row" };
 const _hoisted_8$3 = { class: "fg-label control-label text-capitalize control-bel col-md-12 request-form-label mb-2" };
 const _hoisted_9$4 = { class: "col-md-12" };
 const _hoisted_10$3 = ["data-cy", "placeholder", "name", "onFocus", "onChange"];
-const _hoisted_11$2 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
-const _hoisted_12$2 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
-const _hoisted_13$2 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
-const _hoisted_14$2 = ["data-cy", "name", "onFocus", "onUpdate:modelValue"];
+const _hoisted_11$3 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
+const _hoisted_12$3 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
+const _hoisted_13$3 = ["data-cy", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
+const _hoisted_14$3 = ["data-cy", "name", "onFocus", "onUpdate:modelValue"];
 const _hoisted_15$2 = ["disabled", "placeholder", "name", "onFocus", "onUpdate:modelValue"];
 const _hoisted_16$2 = ["name", "onFocus", "onUpdate:modelValue"];
 const _hoisted_17$2 = ["name", "onFocus", "onUpdate:modelValue"];
@@ -2650,7 +2650,7 @@ function render$5(_ctx, _cache, $props, $setup, $data, $options) {
                     class: normalizeClass([_ctx.form_errors[field] == null ? ' field_' + field:'is-invalid ' + field, "form-control"]),
                     "onUpdate:modelValue": $event => ((_ctx.form_elements[field]) = $event),
                     type: "number"
-                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_11$2)), [
+                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_11$3)), [
                     [vModelText, _ctx.form_elements[field]]
                   ])
                 : createCommentVNode("v-if", true),
@@ -2664,7 +2664,7 @@ function render$5(_ctx, _cache, $props, $setup, $data, $options) {
                     class: normalizeClass([_ctx.form_errors[field] == null ? ' field_' + field:'is-invalid ' + field, "form-control"]),
                     "onUpdate:modelValue": $event => ((_ctx.form_elements[field]) = $event),
                     type: "password"
-                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_12$2)), [
+                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_12$3)), [
                     [vModelText, _ctx.form_elements[field]]
                   ])
                 : createCommentVNode("v-if", true),
@@ -2679,7 +2679,7 @@ function render$5(_ctx, _cache, $props, $setup, $data, $options) {
                     "onUpdate:modelValue": $event => ((_ctx.form_elements[field]) = $event),
                     type: "email",
                     required: ""
-                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_13$2)), [
+                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_13$3)), [
                     [vModelText, _ctx.form_elements[field]]
                   ])
                 : createCommentVNode("v-if", true),
@@ -2692,7 +2692,7 @@ function render$5(_ctx, _cache, $props, $setup, $data, $options) {
                     onFocus: $event => ($options.removeErrors(field)),
                     class: normalizeClass([_ctx.form_errors[field] == null ? ' field_' + field:'is-invalid ' + field, "form-control active"]),
                     "onUpdate:modelValue": $event => ((_ctx.form_elements[field]) = $event)
-                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_14$2)), [
+                  }, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_14$3)), [
                     [vModelText, _ctx.form_elements[field]]
                   ])
                 : createCommentVNode("v-if", true),
@@ -3603,16 +3603,16 @@ const _hoisted_9$3 = [
   _hoisted_4$6
 ];
 const _hoisted_10$2 = { class: "record_counts" };
-const _hoisted_11$1 = {
+const _hoisted_11$2 = {
   key: 0,
   "aria-label": "Page navigation"
 };
-const _hoisted_12$1 = { class: "pagination" };
-const _hoisted_13$1 = {
+const _hoisted_12$2 = { class: "pagination" };
+const _hoisted_13$2 = {
   key: 0,
   class: "page-link"
 };
-const _hoisted_14$1 = {
+const _hoisted_14$2 = {
   key: 1,
   class: "page-link"
 };
@@ -3655,8 +3655,8 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
           createElementVNode("span", _hoisted_10$2, " of " + toDisplayString($props.pagination_data.record_count) + " items", 1 /* TEXT */)
         ]),
         ($props.pagination_data != null)
-          ? (openBlock(), createElementBlock("nav", _hoisted_11$1, [
-              createElementVNode("ul", _hoisted_12$1, [
+          ? (openBlock(), createElementBlock("nav", _hoisted_11$2, [
+              createElementVNode("ul", _hoisted_12$2, [
                 createElementVNode("li", {
                   class: normalizeClass([$options.getActivePage === 1 ? 'disabled' : '' , "page-item"])
                 }, [
@@ -3671,9 +3671,9 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
                     key: page
                   }, [
                     ($options.getActivePage === page)
-                      ? (openBlock(), createElementBlock("a", _hoisted_13$1, toDisplayString(page), 1 /* TEXT */))
+                      ? (openBlock(), createElementBlock("a", _hoisted_13$2, toDisplayString(page), 1 /* TEXT */))
                       : (['..','...'].includes(page))
-                        ? (openBlock(), createElementBlock("a", _hoisted_14$1, toDisplayString(page), 1 /* TEXT */))
+                        ? (openBlock(), createElementBlock("a", _hoisted_14$2, toDisplayString(page), 1 /* TEXT */))
                         : (openBlock(), createElementBlock("a", {
                             key: 2,
                             onClick: $event => ($options.changeTableKey('page',page)),
@@ -4180,20 +4180,20 @@ const _hoisted_7$2 = {
 const _hoisted_8$2 = { class: "col-12 mb-3" };
 const _hoisted_9$2 = { class: "sh-search-bar" };
 const _hoisted_10$1 = ["placeholder"];
-const _hoisted_11 = {
+const _hoisted_11$1 = {
   key: 0,
   class: "text-center"
 };
-const _hoisted_12 = /*#__PURE__*/createElementVNode("div", {
+const _hoisted_12$1 = /*#__PURE__*/createElementVNode("div", {
   class: "spinner-border",
   role: "status"
 }, [
   /*#__PURE__*/createElementVNode("span", { class: "visually-hidden" }, "Loading...")
 ], -1 /* HOISTED */);
-const _hoisted_13 = [
-  _hoisted_12
+const _hoisted_13$1 = [
+  _hoisted_12$1
 ];
-const _hoisted_14 = {
+const _hoisted_14$1 = {
   key: 1,
   class: "alert alert-danger"
 };
@@ -4363,9 +4363,9 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
     ($options.hasDefaultSlot)
       ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
           ($data.loading === 'loading')
-            ? (openBlock(), createElementBlock("div", _hoisted_11, _hoisted_13))
+            ? (openBlock(), createElementBlock("div", _hoisted_11$1, _hoisted_13$1))
             : ($data.loading === 'error')
-              ? (openBlock(), createElementBlock("div", _hoisted_14, [
+              ? (openBlock(), createElementBlock("div", _hoisted_14$1, [
                   createElementVNode("span", _hoisted_15, toDisplayString($data.loading_error), 1 /* TEXT */)
                 ]))
               : createCommentVNode("v-if", true),
@@ -4971,6 +4971,192 @@ return (_ctx, _cache) => {
 
 script$4.__file = "src/lib/components/ShDynamicTabs.vue";
 
+const _withScopeId$1 = n => (pushScopeId("data-v-0d4fa0ac"),n=n(),popScopeId(),n);
+const _hoisted_1$3 = { class: "row permissions-main d-flex" };
+const _hoisted_2$3 = {
+  id: "permissions-nav",
+  class: "col-md-2 d-flex align-items-center py-4"
+};
+const _hoisted_3$3 = ["disabled", "checked"];
+const _hoisted_4$3 = ["onClick"];
+const _hoisted_5$3 = {
+  id: "permissions-content",
+  class: "col-md-10 py-4 pe-4 ps-0"
+};
+const _hoisted_6$2 = { class: "p-2 rounded-2 bg-white h-100" };
+const _hoisted_7$1 = {
+  key: 0,
+  class: "alert alert-info"
+};
+const _hoisted_8$1 = { key: 1 };
+const _hoisted_9$1 = { class: "row row-cols-4" };
+const _hoisted_10 = { class: "col py-3" };
+const _hoisted_11 = ["value"];
+const _hoisted_12 = {
+  key: 0,
+  class: "w-100 row"
+};
+const _hoisted_13 = { class: "col-md-3" };
+const _hoisted_14 = /*#__PURE__*/ _withScopeId$1(() => /*#__PURE__*/createElementVNode("i", { class: "bi-check" }, null, -1 /* HOISTED */));
+
+var script$3 = {
+  __name: 'ManagePermissions',
+  setup(__props) {
+
+const route = useRoute();
+const modules = ref([]);
+const selectedModule = ref('tasks');
+const modulePermissions = ref(null);
+
+const selectedPermissions = ref([]);
+const permissionsChanged = ref(false);
+const departmentId = route.params.id;
+const setModule = module=>{
+  (selectedModule.value !== module) && (selectedModule.value = module) && getModulePermissions();
+};
+onMounted(() => {
+  getDepartmentModules();
+});
+const getDepartmentModules = ()=>{
+  shApis.doGet(`admin/departments/department/list-all-modules/admin`).then(res=>{
+    modules.value = res.data.modules;
+    selectedModule.value = res.data.modules[0];
+    getModulePermissions();
+  });
+};
+const loading = ref(false);
+const getModulePermissions = () => {
+  loading.value = true;
+  modulePermissions.value = null;
+  shApis.doGet(`admin/departments/department/get-module-permissions/${selectedModule.value}?department_id=${departmentId}`).then(res=>{
+    loading.value = false;
+    modulePermissions.value = reformatModulePermissions(res.data.permissions);
+    selectedPermissions.value = res.data.selectedPermissions ?? [];
+    permissionsChanged.value = false;
+  });
+};
+function reformatModulePermissions(mPs){
+let mpModules = {};
+  mPs.map(mp=>{
+    const arr = mp.split('.');
+    const key = arr[0];
+    if(typeof mpModules[key] == 'undefined'){
+      mpModules[key]=[];
+    }
+    mpModules[key].push(mp);
+  });
+  return mpModules
+}
+const setPermissionsChanged = ()=>{
+  permissionsChanged.value = true;
+  return true
+};
+const checkAllPermissions = ()=>{
+  if(selectedPermissions.value.length > 0) {
+    selectedPermissions.value = [];
+  } else {
+    console.log(modulePermissions.value);
+    const all = modulePermissions.value;
+    Object.keys(all).map(key=>{
+      all[key].map(permission=>{
+        selectedPermissions.value.push(permission);
+      });
+    });
+  }
+  permissionsChanged.value = true;
+};
+const getLabel = permission => {
+  const arr = permission.split('.');
+  return arr[arr.length - 1].replaceAll('_',' ')
+};
+const getPermissionStyle = permission => {
+  return {
+    paddingLeft: `${(permission.split('.').length-1) * 20}px`
+  }
+};
+
+return (_ctx, _cache) => {
+  return (openBlock(), createElementBlock("div", _hoisted_1$3, [
+    createElementVNode("div", _hoisted_2$3, [
+      (openBlock(), createElementBlock("ul", {
+        class: "d-flex flex-column w-100 ps-2",
+        key: selectedModule.value ? selectedModule.value:0
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(modules.value, (module) => {
+          return (openBlock(), createElementBlock("li", {
+            class: normalizeClass(selectedModule.value === module && 'active'),
+            key: selectedModule.value
+          }, [
+            createElementVNode("input", {
+              onClick: _cache[0] || (_cache[0] = $event => (checkAllPermissions())),
+              disabled: selectedModule.value !== module,
+              checked: selectedPermissions.value.length > 0 && selectedModule.value === module,
+              type: "checkbox"
+            }, null, 8 /* PROPS */, _hoisted_3$3),
+            createElementVNode("label", {
+              class: "text-capitalize",
+              onClick: $event => (setModule(module))
+            }, toDisplayString(module.replaceAll('_',' ')), 9 /* TEXT, PROPS */, _hoisted_4$3)
+          ], 2 /* CLASS */))
+        }), 128 /* KEYED_FRAGMENT */))
+      ]))
+    ]),
+    createElementVNode("div", _hoisted_5$3, [
+      createElementVNode("div", _hoisted_6$2, [
+        (loading.value)
+          ? (openBlock(), createElementBlock("div", _hoisted_7$1, " loading ... "))
+          : (openBlock(), createElementBlock("div", _hoisted_8$1, [
+              createElementVNode("div", _hoisted_9$1, [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(modulePermissions.value, (permissions) => {
+                  return (openBlock(), createElementBlock("div", _hoisted_10, [
+                    (openBlock(true), createElementBlock(Fragment, null, renderList(permissions, (permission) => {
+                      return (openBlock(), createElementBlock("label", {
+                        onClick: setPermissionsChanged,
+                        class: "text-capitalize list-group-item pb-1 text-capitalize",
+                        style: normalizeStyle(getPermissionStyle(permission))
+                      }, [
+                        withDirectives(createElementVNode("input", {
+                          "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => ((selectedPermissions).value = $event)),
+                          value: permission,
+                          type: "checkbox"
+                        }, null, 8 /* PROPS */, _hoisted_11), [
+                          [vModelCheckbox, selectedPermissions.value]
+                        ]),
+                        createTextVNode(" " + toDisplayString(getLabel(permission)), 1 /* TEXT */)
+                      ], 4 /* STYLE */))
+                    }), 256 /* UNKEYED_FRAGMENT */))
+                  ]))
+                }), 256 /* UNKEYED_FRAGMENT */))
+              ]),
+              (permissionsChanged.value)
+                ? (openBlock(), createElementBlock("div", _hoisted_12, [
+                    createElementVNode("div", _hoisted_13, [
+                      createVNode(script$8, {
+                        url: `admin/departments/department/permissions/${unref(departmentId)}/${selectedModule.value}`,
+                        data: {permissions: selectedPermissions.value},
+                        class: "btn btn-primary d-block"
+                      }, {
+                        default: withCtx(() => [
+                          _hoisted_14,
+                          createTextVNode(" Save")
+                        ]),
+                        _: 1 /* STABLE */
+                      }, 8 /* PROPS */, ["url", "data"])
+                    ])
+                  ]))
+                : createCommentVNode("v-if", true)
+            ]))
+      ])
+    ])
+  ]))
+}
+}
+
+};
+
+script$3.__scopeId = "data-v-0d4fa0ac";
+script$3.__file = "src/lib/components/core/Departments/department/ManagePermissions.vue";
+
 const useUserStore = defineStore('user-store', {
   state: () => ({
     user: null,
@@ -5067,19 +5253,19 @@ const useUserStore = defineStore('user-store', {
   }
 });
 
-const _hoisted_1$3 = /*#__PURE__*/createElementVNode("h5", null, "Departments", -1 /* HOISTED */);
-const _hoisted_2$3 = { class: "card sh-departments-card shadow" };
-const _hoisted_3$3 = { class: "card-body" };
-const _hoisted_4$3 = {
+const _hoisted_1$2 = /*#__PURE__*/createElementVNode("h5", null, "Departments", -1 /* HOISTED */);
+const _hoisted_2$2 = { class: "card sh-departments-card shadow" };
+const _hoisted_3$2 = { class: "card-body" };
+const _hoisted_4$2 = {
   "data-bs-toggle": "modal",
   ref: "addDeptBtn",
   href: "#sh-department_modal",
   class: "btn btn-info btn-sm"
 };
-const _hoisted_5$3 = /*#__PURE__*/createElementVNode("i", { class: "fa fa-plus" }, null, -1 /* HOISTED */);
+const _hoisted_5$2 = /*#__PURE__*/createElementVNode("i", { class: "fa fa-plus" }, null, -1 /* HOISTED */);
 
 
-var script$3 = {
+var script$2 = {
   __name: 'Departments',
   setup(__props) {
 
@@ -5102,11 +5288,11 @@ function departmentAdded (response) {
 
 return (_ctx, _cache) => {
   return (openBlock(), createElementBlock(Fragment, null, [
-    _hoisted_1$3,
-    createElementVNode("div", _hoisted_2$3, [
-      createElementVNode("div", _hoisted_3$3, [
-        createElementVNode("a", _hoisted_4$3, [
-          _hoisted_5$3,
+    _hoisted_1$2,
+    createElementVNode("div", _hoisted_2$2, [
+      createElementVNode("div", _hoisted_3$2, [
+        createElementVNode("a", _hoisted_4$2, [
+          _hoisted_5$2,
           createTextVNode(" ADD DEPARTMENT")
         ], 512 /* NEED_PATCH */),
         createVNode(script$6, {
@@ -5145,14 +5331,14 @@ return (_ctx, _cache) => {
 
 };
 
-script$3.__file = "src/lib/components/core/Departments/Departments.vue";
+script$2.__file = "src/lib/components/core/Departments/Departments.vue";
 
-const _hoisted_1$2 = {
+const _hoisted_1$1 = {
   key: 0,
   class: "card sh-department-view shadow"
 };
-const _hoisted_2$2 = { class: "card-body" };
-const _hoisted_3$2 = /*#__PURE__*/createElementVNode("a", {
+const _hoisted_2$1 = { class: "card-body" };
+const _hoisted_3$1 = /*#__PURE__*/createElementVNode("a", {
   href: "#addModule",
   class: "btn btn-info btn-sm",
   "data-bs-toggle": "modal"
@@ -5160,11 +5346,11 @@ const _hoisted_3$2 = /*#__PURE__*/createElementVNode("a", {
   /*#__PURE__*/createElementVNode("i", { class: "bi-plus" }),
   /*#__PURE__*/createTextVNode(" ADD Module")
 ], -1 /* HOISTED */);
-const _hoisted_4$2 = { class: "text-primary text-capitalize" };
-const _hoisted_5$2 = ["value"];
-const _hoisted_6$2 = /*#__PURE__*/createElementVNode("i", { class: "fa fa-save" }, null, -1 /* HOISTED */);
+const _hoisted_4$1 = { class: "text-primary text-capitalize" };
+const _hoisted_5$1 = ["value"];
+const _hoisted_6$1 = /*#__PURE__*/createElementVNode("i", { class: "fa fa-save" }, null, -1 /* HOISTED */);
 
-var script$2 = {
+var script$1 = {
   __name: 'Department',
   setup(__props) {
 
@@ -5258,9 +5444,9 @@ function submitPermissions() {
 
 return (_ctx, _cache) => {
   return (unref(department))
-    ? (openBlock(), createElementBlock("div", _hoisted_1$2, [
-        createElementVNode("div", _hoisted_2$2, [
-          _hoisted_3$2,
+    ? (openBlock(), createElementBlock("div", _hoisted_1$1, [
+        createElementVNode("div", _hoisted_2$1, [
+          _hoisted_3$1,
           createElementVNode("h5", null, "Department #" + toDisplayString(unref(department).id) + " - " + toDisplayString(unref(department).name) + " Allowed Modules", 1 /* TEXT */),
           createVNode(script$6, {
             actions: {
@@ -5317,7 +5503,7 @@ return (_ctx, _cache) => {
             default: withCtx(() => [
               (unref(getModule))
                 ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-                    createElementVNode("h5", _hoisted_4$2, "Permissions for " + toDisplayString(unref(getModule).module), 1 /* TEXT */),
+                    createElementVNode("h5", _hoisted_4$1, "Permissions for " + toDisplayString(unref(getModule).module), 1 /* TEXT */),
                     (openBlock(true), createElementBlock(Fragment, null, renderList(unref(modulePermissions), (permission) => {
                       return (openBlock(), createElementBlock("div", {
                         key: permission,
@@ -5330,7 +5516,7 @@ return (_ctx, _cache) => {
                             type: "checkbox",
                             "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => (isRef(selectedPermissions) ? (selectedPermissions).value = $event : selectedPermissions = $event)),
                             value: permission
-                          }, null, 8 /* PROPS */, _hoisted_5$2), [
+                          }, null, 8 /* PROPS */, _hoisted_5$1), [
                             [vModelCheckbox, unref(selectedPermissions)]
                           ]),
                           createTextVNode(" " + toDisplayString(getPermissionLabel(permission)), 1 /* TEXT */)
@@ -5341,7 +5527,7 @@ return (_ctx, _cache) => {
                       onClick: submitPermissions,
                       class: "btn btn-info"
                     }, [
-                      _hoisted_6$2,
+                      _hoisted_6$1,
                       createTextVNode(" Submit")
                     ])
                   ], 64 /* STABLE_FRAGMENT */))
@@ -5357,123 +5543,7 @@ return (_ctx, _cache) => {
 
 };
 
-script$2.__file = "src/lib/components/core/Departments/department/Department.vue";
-
-const _hoisted_1$1 = { class: "row permissions-main d-flex" };
-const _hoisted_2$1 = {
-  id: "permissions-nav",
-  class: "col-md-2 shadow d-flex align-items-center"
-};
-const _hoisted_3$1 = /*#__PURE__*/createElementVNode("input", { type: "checkbox" }, null, -1 /* HOISTED */);
-const _hoisted_4$1 = ["onClick"];
-const _hoisted_5$1 = {
-  id: "permissions-content",
-  class: "col-md-10"
-};
-const _hoisted_6$1 = {
-  key: 0,
-  class: "alert alert-info"
-};
-const _hoisted_7$1 = {
-  key: 1,
-  class: "d-flex justify-content-evenly"
-};
-const _hoisted_8$1 = { class: "col-md-3 list-group" };
-const _hoisted_9$1 = { class: "p-2 text-capitalize list-group-item pb-0 text-capitalize" };
-const _hoisted_10 = /*#__PURE__*/createElementVNode("input", { type: "checkbox" }, null, -1 /* HOISTED */);
-
-var script$1 = {
-  __name: 'ManagePermissions',
-  setup(__props) {
-
-const route = useRoute();
-const tabs = ref(null);
-ref(0);
-const modules = ref([]);
-const selectedModule = ref('tasks');
-const modulePermissions = ref(null);
-const setModule = module=>{
-  selectedModule.value = module;
-  getModulePermissions();
-};
-onMounted(() => {
-  console.log(tabs.value.querySelectorAll('li'));
-  getDepartmentModules();
-});
-const getDepartmentModules = ()=>{
-  shApis.doGet(`admin/departments/department/list-modules/${route.params.id}?all=1`).then(res=>{
-    modules.value = res.data.data;
-    selectedModule.value = res.data.data[0];
-    getModulePermissions();
-  });
-};
-const loading = ref(false);
-const getModulePermissions = () => {
-  loading.value = true;
-  modulePermissions.value = null;
-  shApis.doGet(`admin/departments/department/get-module-permissions/${selectedModule.value.module}`).then(res=>{
-    loading.value = false;
-    modulePermissions.value = reformatModulePermissions(res.data.permissions);
-  });
-};
-function reformatModulePermissions(mPs){
-let mpModules = {};
-  mPs.map(mp=>{
-    const arr = mp.split('.');
-    const key = arr[0];
-    if(typeof mpModules[key] == 'undefined'){
-      mpModules[key]=[];
-    }
-    mpModules[key].push(mp);
-  });
-  return mpModules
-}
-
-return (_ctx, _cache) => {
-  return (openBlock(), createElementBlock("div", _hoisted_1$1, [
-    createElementVNode("div", _hoisted_2$1, [
-      createElementVNode("ul", {
-        ref_key: "tabs",
-        ref: tabs,
-        class: "d-flex flex-column w-100"
-      }, [
-        (openBlock(true), createElementBlock(Fragment, null, renderList(modules.value, (module) => {
-          return (openBlock(), createElementBlock("li", {
-            class: normalizeClass(selectedModule.value.id === module.id && 'active'),
-            key: module.id
-          }, [
-            _hoisted_3$1,
-            createElementVNode("label", {
-              class: "text-capitalize",
-              onClick: $event => (setModule(module))
-            }, toDisplayString(module.module.replaceAll('_',' ')), 9 /* TEXT, PROPS */, _hoisted_4$1)
-          ], 2 /* CLASS */))
-        }), 128 /* KEYED_FRAGMENT */))
-      ], 512 /* NEED_PATCH */)
-    ]),
-    createElementVNode("div", _hoisted_5$1, [
-      (loading.value)
-        ? (openBlock(), createElementBlock("div", _hoisted_6$1, " loading ... "))
-        : (openBlock(), createElementBlock("div", _hoisted_7$1, [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(modulePermissions.value, (permissions) => {
-              return (openBlock(), createElementBlock("div", _hoisted_8$1, [
-                (openBlock(true), createElementBlock(Fragment, null, renderList(permissions, (permission) => {
-                  return (openBlock(), createElementBlock("label", _hoisted_9$1, [
-                    _hoisted_10,
-                    createTextVNode(" " + toDisplayString(permission), 1 /* TEXT */)
-                  ]))
-                }), 256 /* UNKEYED_FRAGMENT */))
-              ]))
-            }), 256 /* UNKEYED_FRAGMENT */))
-          ]))
-    ])
-  ]))
-}
-}
-
-};
-
-script$1.__file = "src/lib/components/core/Departments/department/ManagePermissions.vue";
+script$1.__file = "src/lib/components/core/Departments/department/Department.vue";
 
 const _withScopeId = n => (pushScopeId("data-v-2911509a"),n=n(),popScopeId(),n);
 const _hoisted_1 = {
@@ -5637,15 +5707,15 @@ const ShFrontend = {
       });
       options.router.addRoute({
         path: '/sh-departments',
-        component: script$3
+        component: script$2
       });
       options.router.addRoute({
         path: '/sh-departments/permissions/:id',
-        component: script$2
+        component: script$1
       });
       options.router.addRoute({
         path: '/sh-departments/manage-permissions/:id',
-        component: script$1
+        component: script$3
       });
     }
     //filter unwanted config items from options to be put in local storage
@@ -5657,4 +5727,4 @@ const ShFrontend = {
   }
 };
 
-export { countries as Countries, script$e as ShAutoForm, script$a as ShCanvas, script$8 as ShConfirmAction, script$d as ShDropDownForm, script$4 as ShDynamicTabs, script$l as ShForm, ShFrontend, script$c as ShModal, script$b as ShModalForm, script$o as ShPhone, script$7 as ShSilentAction, script$6 as ShTable, script$5 as ShTabs, shApis, shRepo, ShStorage as shStorage, useUserStore };
+export { countries as Countries, script$3 as ManagePermissions, script$e as ShAutoForm, script$a as ShCanvas, script$8 as ShConfirmAction, script$d as ShDropDownForm, script$4 as ShDynamicTabs, script$l as ShForm, ShFrontend, script$c as ShModal, script$b as ShModalForm, script$o as ShPhone, script$7 as ShSilentAction, script$6 as ShTable, script$5 as ShTabs, shApis, shRepo, ShStorage as shStorage, useUserStore };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iankibetsh/shframework",
-  "version": "1.4.5",
+  "version": "1.4.6",
   "description": "Vue library for handling laravel backend",
   "main": "dist/library.js",
   "module": "dist/library.mjs",