{"version":3,"sources":["webpack:///./src/views/Company/Users/mapUserToRole.vue","webpack:///src/views/Company/Users/mapUserToRole.vue","webpack:///./src/views/Company/Users/mapUserToRole.vue?cd24","webpack:///./src/views/Company/Users/mapUserToRole.vue?c1b4"],"names":["render","_vm","this","_c","_self","staticClass","_v","_s","$t","$route","query","username","staticStyle","directives","name","rawName","value","groupId","expression","on","$event","$$selectedVal","Array","prototype","filter","call","target","options","o","selected","map","val","_value","multiple","attrs","_l","groups","group","i","key","domProps","id","groupRolesLoader","_e","toggleBranchListDropdown","tags","newTags","model","tag","callback","$$v","searchInp","composing","nativeOn","toggleChckBox","filteredList","filteredList2","filteredList3","isButtonDisabled","mapRoles","require","staticRenderFns","$","components","MasterLayout","VueTagsInput","PulseLoader","data","firstName","lastName","phoneNumber","email","showLoader","backgroundUrl","role","branches","branch","groupRoles","company","options2","options3","combinedOptions","showRoles","forcePasswordChange","selectAll","selectAllCheckbox","categories","categoryId","stage","allRoles","rolesCategory","watch","combinedArray","handler","newSelectedArray","deep","computed","userName","sortedList","ch","created","document","mounted","beforeDestroy","methods","nextStage","getRoleCategories","get","configObject","then","res","b","catch","error","getAllRoles","checkAll","validEmail","getUserRoles","el","copiedResponse","twoThirdOfArr","getBranches","getRoleGroups","getGroupRoles","message","type","duration","roleIds","roles","branchId","post","component"],"mappings":"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AQ,QAA+B,MAAQ,mBAEloIC,EAAkB,G,mGC4JtB,IAAIC,EAAI,IAEO,OACfhD,gBACAiD,YACAC,oBACAC,iBACAC,oBAEAC,OACA,OACAC,eACAC,cACAC,iBACAC,WACAb,oBACAc,cACAC,kBACAC,kBACAC,YACAC,sBACAxC,UACAnB,uBACA4D,cACAC,aACAnD,WACAoD,YACAC,YACAnD,YACAoD,mBACAjC,OACAH,QACAM,aACA+B,aACAC,uBACAzC,oBACA0C,aACAC,qBACAC,cACAC,qCACAC,gBACA7E,cACA8E,YAEAC,qBAGAC,OACAb,WACA,WACA,qBACA,yBACA,oBACA,qBAGAM,aACA,SACA,sDACA,MAGA,OAFA,qBACA,aAGA,IACAQ,uBACA/D,kBAEA,gBACA,cAGAZ,UACA,wCAIA,qBAEA,kBALA,sBAOA4B,MACAgD,aACA,SACA,IACA,eACA/C,cACAgD,iBAGAhD,cACAgD,YAGA,aACAA,MAEA,MACAA,KAEA,kBAGAC,SAEAC,UACAC,WACA,oEAEA1C,eACA,0BAIA,OAHA2C,cACA,oBAEA,gBACAC,8DAGA3C,gBACA,2BAIA,OAHA0C,cACA,oBAEA,gBACAC,8DAGA1C,gBACA,2BAIA,OAHAyC,cACA,oBAEA,gBACAC,+DAIAC,UACA,iCACA,iBAEA,8BACA,qBACA,yBACA,oBACA,oBAEAC,8CAEAC,UACA,6BACA,0CAEA,kCACA,uCACA,sBAEA,qDAIAC,kBACAC,SACAC,aACArF,mBACA,uBAEAsF,oBACA,mBACA,WACAC,IACA,qCACAC,qBAEAC,KAAAC,IACAA,mBACA,0CACA,EACAC,2CACA,EACA,GAEA,yBAEAC,MAAAC,IACA,sBAGAC,cACA,mBACA,WACAP,IAAA,0BAAAC,qBACAC,KAAAC,IACAA,mBACA,0CACA,EACAC,2CACA,EACA,GAEA,uBAEAC,MAAAC,IACA,sBAGAE,YACA,SACA,kBACA,iCACAtF,iBAGA,gBACA,aAEAe,2BACA,0DAEAU,iBACA,qBACA,+CAEA,OACA,uCAGA,CAEA,8CACA,MACA,0BAIA,kDAIA8D,cACA,iEAKAC,eACA,WACAV,IACA,mFACAC,qBAEAC,KAAAC,IACAA,mBACA,0CACA,EACAC,2CACA,EACA,GAEAD,mBACAQ,cACAA,iBAEA,kBACA,KACA,KACA,KACAC,kBACA,iBACA,MACA5F,YAIA,eACA4F,aACAA,YAEAC,kBACA,2BACA,KACAzC,UAEAC,YAIA,eACA,gBACA,gBAEA,sCACA,iCACA,6BAIA,oBAEAgC,MAAAC,QAEAQ,cACA,WACAd,IACA,yCACA,4BACA,4BACA,kBAEAC,qBAEAC,KAAAC,IACAA,mBACA,0CACA,EACAC,2CACA,EACA,GAEA,uBAEAC,MAAAC,QAEAS,gBACA,mBACA,WACAf,IACA,yDACAC,qBAEAC,KAAAC,IAEAA,mBACA,0CACA,EACAC,2CACA,EACA,GAEA,0BACA,qBAEAC,MAAAC,IACA,sBAGAU,gBACA,yBACA,WACAhB,IACA,wDACAC,qBAEAC,KAAAC,IACA,kBACA,yBACAA,mBACAQ,cACAA,iBAEA,kBACA,KACA,KACA,KACAC,kBACA,iBACA,MACA5F,YAIA,eACA4F,aACAA,YAEAC,kBACA,2BACA,KACAzC,UAEAC,YAIA,eACA,gBACA,gBAEA,wCAEAgC,MAAAC,IACA,sBAGAtD,YAEA,GADAvC,mBACA,6BAMA,YALA,kBACAwG,qCACAC,aACAC,eAKA,SACA,iCACA,iCACAC,eAIA,OACAxD,iCACAG,kBACAsD,QACAC,eAKA,yBACAnE,oBACA,WACAoE,KACA,8CACA,4BACA,4BACA,kBAEA/D,EACAyC,qBAEAC,KAAA,KACA,kBACAe,+DACAC,eACAC,eAEA,mBAAAhH,uBAEAgD,oBACA,2BAEAkD,MAAAC,IACA,kBACAW,gCACAC,aACAC,eAEA,yBACAhE,yBCjmBqX,I,YCOjXqE,EAAY,eACd,EACAnI,EACA6D,GACA,EACA,KACA,KACA,MAIa,aAAAsE,E","file":"js/chunk-2d0c4712.f7fca18f.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('MasterLayout',[_c('div',{staticClass:\"new-staff\"},[_c('div',{staticClass:\"add_new_bank_account_header\"},[_c('p',[_vm._v(_vm._s(_vm.$t(\"text.cUsers.subTitle\"))+\" (\"+_vm._s(_vm.$route.query.username)+\")\")])]),_vm._v(\" \"),_c('div',{staticClass:\"cover\"},[_c('div',{staticClass:\"row\"},[_c('div',{staticClass:\"input__group__block mt-4 ml-3\",staticStyle:{\"width\":\"50%\",\"margin\":\"0\"}},[_c('label',{staticClass:\"required\"},[_c('span',{staticClass:\"mylabel\"},[_vm._v(\" \"+_vm._s(_vm.$t(\"text.cUsers.selectGrp\"))+\" \")])]),_vm._v(\" \"),_c('div',{staticClass:\"price_change_input_wrapper\"},[_c('select',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.groupId),expression:\"groupId\"}],on:{\"change\":function($event){var $$selectedVal = Array.prototype.filter.call($event.target.options,function(o){return o.selected}).map(function(o){var val = \"_value\" in o ? o._value : o.value;return val}); _vm.groupId=$event.target.multiple ? $$selectedVal : $$selectedVal[0]}}},[_c('option',{attrs:{\"value\":\"select group\",\"disabled\":\"\",\"selected\":\"\"}},[_vm._v(\"\\n                \"+_vm._s(_vm.$t(\"text.cUsers.selectGrp\"))+\"\\n              \")]),_vm._v(\" \"),_vm._l((_vm.groups),function(group,i){return _c('option',{key:i,domProps:{\"value\":group.id}},[_vm._v(\"\\n                \"+_vm._s(group.name)+\"\\n              \")])})],2)])])]),_vm._v(\" \"),_c('div',{staticClass:\"mt-3\"},[(!_vm.groupRolesLoader)?_c('div',{staticClass:\"mt-4\"},[_c('label',[_vm._v(\" \"+_vm._s(_vm.$t(\"text.cUsers.availableRoles\")))]),_vm._v(\" \"),_c('div',{staticClass:\"price_change_input_wrapper\"},[_c('div',{staticStyle:{\"padding\":\"5px\"},on:{\"click\":_vm.toggleBranchListDropdown}},[_c('vue-tags-input',{attrs:{\"tags\":_vm.tags},on:{\"tags-changed\":(newTags) => (_vm.tags = newTags)},model:{value:(_vm.tag),callback:function ($$v) {_vm.tag=$$v},expression:\"tag\"}})],1),_vm._v(\" \"),_c('div',{},[_c('div',{staticClass:\"search__wrapper\"},[_c('div',{staticClass:\"row align-items-center\"},[_c('div',{staticClass:\"col-md-10\"},[_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.searchInp),expression:\"searchInp\"}],attrs:{\"type\":\"text\",\"placeholder\":_vm.$t('text.iUsers.search'),\"name\":\"search\"},domProps:{\"value\":(_vm.searchInp)},on:{\"input\":function($event){if($event.target.composing)return;_vm.searchInp=$event.target.value}}})]),_vm._v(\" \"),_c('div',{staticClass:\"col-md-2 text-right\"},[_c('i',{staticClass:\"fa fa-search mr-3\",staticStyle:{\"color\":\"#b6b6b6\"},attrs:{\"aria-hidden\":\"true\"}})])])]),_vm._v(\" \"),_c('div',{staticClass:\"row justify-content-center mt-3\",staticStyle:{\"width\":\"100%\",\"margin\":\"0 auto\"}},[_c('div',{staticClass:\"col-md-4\"},[_c('div',{},[_c('b-form-group',{attrs:{\"label\":\"\"},nativeOn:{\"click\":function($event){return _vm.toggleChckBox($event)}}},[_c('b-form-checkbox-group',{attrs:{\"options\":_vm.filteredList,\"name\":\"flavour-2a\",\"stacked\":\"\"},model:{value:(_vm.selected),callback:function ($$v) {_vm.selected=$$v},expression:\"selected\"}})],1)],1)]),_vm._v(\" \"),_c('div',{staticClass:\"col-md-4\"},[_c('b-form-group',{attrs:{\"label\":\"\"},nativeOn:{\"click\":function($event){return _vm.toggleChckBox($event)}}},[_c('b-form-checkbox-group',{attrs:{\"options\":_vm.filteredList2,\"name\":\"flavour-2a\",\"stacked\":\"\"},model:{value:(_vm.selected),callback:function ($$v) {_vm.selected=$$v},expression:\"selected\"}})],1)],1),_vm._v(\" \"),_c('div',{staticClass:\"col-md-4\"},[_c('b-form-group',{attrs:{\"label\":\"\"},nativeOn:{\"click\":function($event){return _vm.toggleChckBox($event)}}},[_c('b-form-checkbox-group',{attrs:{\"options\":_vm.filteredList3,\"name\":\"flavour-2a\",\"stacked\":\"\"},model:{value:(_vm.selected),callback:function ($$v) {_vm.selected=$$v},expression:\"selected\"}})],1)],1)])])])]):_vm._e(),_vm._v(\" \"),(_vm.groupRolesLoader)?_c('pulse-loader',{staticClass:\"py-5\",attrs:{\"size\":\"15px\"}}):_vm._e()],1),_vm._v(\" \"),_c('div',{staticClass:\"text-center mt-4 pb-4\"},[_c('button',{staticClass:\"ep-btn ep-primary\",attrs:{\"disabled\":_vm.isButtonDisabled},on:{\"click\":function($event){return _vm.mapRoles($event)}}},[_vm._v(\"\\n          Add roles\\n        \")]),_vm._v(\" \"),_c('img',{staticClass:\"ml-3 loader\",staticStyle:{\"display\":\"none\"},attrs:{\"src\":require(\"@/assets/img/git_loader.gif\"),\"width\":\"35px\"}})])])])])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <MasterLayout>\r\n    <div class=\"new-staff\">\r\n      <div class=\"add_new_bank_account_header\">\r\n        <p>{{ $t(\"text.cUsers.subTitle\") }} ({{ $route.query.username }})</p>\r\n      </div>\r\n      <div class=\"cover\">\r\n        <div class=\"row\">\r\n          <div\r\n            class=\"input__group__block mt-4 ml-3\"\r\n            style=\"width: 50%; margin: 0\"\r\n          >\r\n            <label class=\"required\">\r\n              <span class=\"mylabel\"> {{ $t(\"text.cUsers.selectGrp\") }} </span>\r\n            </label>\r\n            <div class=\"price_change_input_wrapper\">\r\n              <select v-model=\"groupId\">\r\n                <option value=\"select group\" disabled selected>\r\n                  {{ $t(\"text.cUsers.selectGrp\") }}\r\n                </option>\r\n                <option :value=\"group.id\" v-for=\"(group, i) in groups\" :key=\"i\">\r\n                  {{ group.name }}\r\n                </option>\r\n              </select>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"mt-3\">\r\n          <div class=\"mt-4\" v-if=\"!groupRolesLoader\">\r\n            <label> {{ $t(\"text.cUsers.availableRoles\") }}</label>\r\n            <div class=\"price_change_input_wrapper\">\r\n              <div @click=\"toggleBranchListDropdown\" style=\"padding: 5px\">\r\n                <vue-tags-input\r\n                  v-model=\"tag\"\r\n                  :tags=\"tags\"\r\n                  @tags-changed=\"(newTags) => (tags = newTags)\"\r\n                />\r\n              </div>\r\n\r\n              <div class=\"\">\r\n                <div class=\"search__wrapper\">\r\n                  <div class=\"row align-items-center\">\r\n                    <div class=\"col-md-10\">\r\n                      <input\r\n                        type=\"text\"\r\n                        :placeholder=\"$t('text.iUsers.search')\"\r\n                        v-model=\"searchInp\"\r\n                        name=\"search\"\r\n                      />\r\n                    </div>\r\n                    <div class=\"col-md-2 text-right\">\r\n                      <i\r\n                        class=\"fa fa-search mr-3\"\r\n                        aria-hidden=\"true\"\r\n                        style=\"color: #b6b6b6\"\r\n                      ></i>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n                <!-- <div class=\"row mt-3\" style=\"width: 100%; margin: 0 auto\">\r\n                  <div class=\"col-md-4\">\r\n                    <div class=\"d-flex align-items-center\" styl=\"height:50px\">\r\n                      <input\r\n                        type=\"checkbox\"\r\n                        class=\"mr-2\"\r\n                        @click=\"checkAll\"\r\n                        id=\"selectAllCheckbox\"\r\n                      />\r\n                      <span class=\"primary-color\">Select All Roles</span>\r\n                    </div>\r\n                  </div>\r\n                </div> -->\r\n                <div\r\n                  class=\"row justify-content-center mt-3\"\r\n                  style=\"width: 100%; margin: 0 auto\"\r\n                >\r\n                  <div class=\"col-md-4\">\r\n                    <div class=\"\">\r\n                      <b-form-group\r\n                        label=\"\"\r\n                        v-on:click.native=\"toggleChckBox($event)\"\r\n                      >\r\n                        <b-form-checkbox-group\r\n                          v-model=\"selected\"\r\n                          :options=\"filteredList\"\r\n                          name=\"flavour-2a\"\r\n                          stacked\r\n                        >\r\n                        </b-form-checkbox-group>\r\n                      </b-form-group>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-4\">\r\n                    <b-form-group\r\n                      label=\"\"\r\n                      v-on:click.native=\"toggleChckBox($event)\"\r\n                    >\r\n                      <b-form-checkbox-group\r\n                        v-model=\"selected\"\r\n                        :options=\"filteredList2\"\r\n                        name=\"flavour-2a\"\r\n                        stacked\r\n                      >\r\n                      </b-form-checkbox-group>\r\n                    </b-form-group>\r\n                  </div>\r\n                  <div class=\"col-md-4\">\r\n                    <b-form-group\r\n                      label=\"\"\r\n                      v-on:click.native=\"toggleChckBox($event)\"\r\n                    >\r\n                      <b-form-checkbox-group\r\n                        v-model=\"selected\"\r\n                        :options=\"filteredList3\"\r\n                        name=\"flavour-2a\"\r\n                        stacked\r\n                      >\r\n                      </b-form-checkbox-group>\r\n                    </b-form-group>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <pulse-loader\r\n            size=\"15px\"\r\n            v-if=\"groupRolesLoader\"\r\n            class=\"py-5\"\r\n          ></pulse-loader>\r\n        </div>\r\n        <div class=\"text-center mt-4 pb-4\">\r\n          <button\r\n            :disabled=\"isButtonDisabled\"\r\n            class=\"ep-btn ep-primary\"\r\n            @click=\"mapRoles($event)\"\r\n          >\r\n            Add roles\r\n          </button>\r\n          <img\r\n            src=\"@/assets/img/git_loader.gif\"\r\n            style=\"display: none\"\r\n            width=\"35px\"\r\n            class=\"ml-3 loader\"\r\n          />\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </MasterLayout>\r\n</template>\r\n\r\n<script>\r\nimport MasterLayout from \"@/views/Company/MasterLayout.vue\";\r\nimport configObject from \"@/config\";\r\nimport backgroundUrl from \"@/assets/img/retain.jpg\";\r\nimport VueTagsInput from \"@johmun/vue-tags-input\";\r\nimport PulseLoader from \"vue-spinner/src/PulseLoader.vue\";\r\n\r\nimport JQuery from \"jquery\";\r\nlet $ = JQuery;\r\n\r\nexport default {\r\n  name: \"AddStaff\",\r\n  components: {\r\n    MasterLayout,\r\n    VueTagsInput,\r\n    PulseLoader,\r\n  },\r\n  data() {\r\n    return {\r\n      firstName: null,\r\n      lastName: null,\r\n      phoneNumber: null,\r\n      email: null,\r\n      isButtonDisabled: false,\r\n      showLoader: true,\r\n      backgroundUrl,\r\n      role: \"selectRole\",\r\n      branches: [],\r\n      branch: \"selectBranch\",\r\n      groups: [],\r\n      groupId: \"select group\",\r\n      groupRoles: [],\r\n      company: null,\r\n      options: [],\r\n      options2: [],\r\n      options3: [],\r\n      selected: [],\r\n      combinedOptions: [],\r\n      tag: \"\",\r\n      tags: [],\r\n      searchInp: \"\",\r\n      showRoles: false,\r\n      forcePasswordChange: false,\r\n      groupRolesLoader: false,\r\n      selectAll: false,\r\n      selectAllCheckbox: false,\r\n      categories: [],\r\n      categoryId: \"select functional level\",\r\n      stage: \"addUser\",\r\n      username: null,\r\n      allRoles: [],\r\n\r\n      rolesCategory: null,\r\n    };\r\n  },\r\n  watch: {\r\n    company(company) {\r\n      if (company !== null) {\r\n        this.getRoleGroups();\r\n        this.getRoleCategories();\r\n        this.getUserRoles();\r\n        this.getAllRoles();\r\n      }\r\n    },\r\n    selectAll(value) {\r\n      let selected = [];\r\n      let combinedArray = [...this.options, ...this.options2, ...this.options3];\r\n      if (!value) {\r\n        this.selected = selected;\r\n        this.tags = selected;\r\n        return;\r\n      }\r\n      if (value) {\r\n        combinedArray.forEach(function (opt) {\r\n          selected.push(opt.text);\r\n        });\r\n        this.selected = selected;\r\n        this.tags = selected;\r\n      }\r\n    },\r\n    groupId() {\r\n      if (this.$route.query.rolesCategory == \"N/A\") {\r\n        this.getGroupRoles();\r\n        return;\r\n      }\r\n      this.getGroupRoles();\r\n\r\n      this.selected = [];\r\n    },\r\n    tags: {\r\n      handler(newTags, oldTags) {\r\n        let newSelectedArray = [];\r\n        try {\r\n          if (newTags[0].tiClasses) {\r\n            newTags.forEach((tg) => {\r\n              newSelectedArray.push(tg.text);\r\n            });\r\n          } else {\r\n            newTags.forEach((tg) => {\r\n              newSelectedArray.push(tg);\r\n            });\r\n          }\r\n          if (newTags.length < 1) {\r\n            newSelectedArray = [];\r\n          }\r\n        } catch {\r\n          newSelectedArray = [];\r\n        }\r\n        this.selected = newSelectedArray;\r\n      },\r\n    },\r\n    deep: true,\r\n  },\r\n  computed: {\r\n    userName() {\r\n      return `${this.userDetails.firstName} ${this.userDetails.lastName}`;\r\n    },\r\n    filteredList() {\r\n      const sortedList = [...this.options];\r\n      sortedList.sort((a, b) => {\r\n        return a.name > b.name ? 1 : -1;\r\n      });\r\n      return sortedList.filter((ch, i) =>\r\n        ch.text.toLowerCase().includes(this.searchInp.toLowerCase())\r\n      );\r\n    },\r\n    filteredList2() {\r\n      const sortedList = [...this.options2];\r\n      sortedList.sort((a, b) => {\r\n        return a.name > b.name ? 1 : -1;\r\n      });\r\n      return sortedList.filter((ch, i) =>\r\n        ch.text.toLowerCase().includes(this.searchInp.toLowerCase())\r\n      );\r\n    },\r\n    filteredList3() {\r\n      const sortedList = [...this.options3];\r\n      sortedList.sort((a, b) => {\r\n        return a.name > b.name ? 1 : -1;\r\n      });\r\n      return sortedList.filter((ch, i) =>\r\n        ch.text.toLowerCase().includes(this.searchInp.toLowerCase())\r\n      );\r\n    },\r\n  },\r\n  created() {\r\n    this.$eventHub.$on(\"company\", (company) => {\r\n      this.company = company;\r\n    });\r\n    if (this.$route.query.companyId) {\r\n      this.getRoleGroups();\r\n      this.getRoleCategories();\r\n      this.getUserRoles();\r\n      this.getAllRoles();\r\n    }\r\n    document.title = \"Create User:: Epump Company\";\r\n  },\r\n  mounted() {\r\n    if (this.$route.query.username) {\r\n      this.username = this.$route.query.username;\r\n    }\r\n    if (this.$route.query.rolesCategory) {\r\n      if (this.$route.query.rolesCategory == \"N/A\") {\r\n        this.rolesCategory = \"\";\r\n      } else {\r\n        this.rolesCategory = this.$route.query.rolesCategory;\r\n      }\r\n    }\r\n  },\r\n  beforeDestroy() {},\r\n  methods: {\r\n    nextStage($event) {\r\n      $event.preventDefault();\r\n      this.stage = \"mapRoles\";\r\n    },\r\n    getRoleCategories() {\r\n      this.showLoader = true;\r\n      this.axios\r\n        .get(\r\n          `${configObject.apiBaseUrl}/Role/Categories`,\r\n          configObject.authConfig()\r\n        )\r\n        .then((res) => {\r\n          res.data.sort((a, b) => {\r\n            return a.name.toLowerCase() > b.name.toLowerCase()\r\n              ? 1\r\n              : b.name.toLowerCase() > a.name.toLowerCase()\r\n              ? -1\r\n              : 0;\r\n          });\r\n          this.categories = res.data;\r\n        })\r\n        .catch((error) => {\r\n          this.showLoader = false;\r\n        });\r\n    },\r\n    getAllRoles() {\r\n      this.showLoader = true;\r\n      this.axios\r\n        .get(`${configObject.apiBaseUrl}/Role`, configObject.authConfig())\r\n        .then((res) => {\r\n          res.data.sort((a, b) => {\r\n            return a.name.toLowerCase() > b.name.toLowerCase()\r\n              ? 1\r\n              : b.name.toLowerCase() > a.name.toLowerCase()\r\n              ? -1\r\n              : 0;\r\n          });\r\n          this.allRoles = res.data;\r\n        })\r\n        .catch((error) => {\r\n          this.showLoader = false;\r\n        });\r\n    },\r\n    checkAll(e) {\r\n      let selected = [];\r\n      if (e.target.checked) {\r\n        this.combinedOptions.forEach((el) => {\r\n          selected.push(el.text);\r\n        });\r\n      }\r\n      this.selected = selected;\r\n      this.tags = selected;\r\n    },\r\n    toggleBranchListDropdown() {\r\n      this.showBranchListDropDown = !this.showBranchListDropDown;\r\n    },\r\n    toggleChckBox($event) {\r\n      if ($event.target.checked) {\r\n        const getIndex = this.selected.indexOf($event.target.value);\r\n\r\n        if (getIndex === -1) {\r\n          this.selected.push($event.target.value);\r\n          //   this.tags.push($event.target.value)\r\n        }\r\n      } else {\r\n        // document.querySelector(\"#selectAllCheckbox\").checked = false\r\n        const getIndex = this.selected.indexOf($event.target.value);\r\n        if (getIndex > -1) {\r\n          this.selected.splice(getIndex, 1);\r\n          //   this.tags.splice(getIndex, 1);\r\n        }\r\n      }\r\n      if (this.selected.length == this.combinedOptions.length) {\r\n        // document.querySelector(\"#selectAllCheckbox\").checked = true\r\n      }\r\n    },\r\n    validEmail(email) {\r\n      if (/^\\w+([\\.-]?\\w+)*@\\w+([\\.-]?\\w+)*(\\.\\w{2,3})+$/.test(email)) {\r\n        return true;\r\n      }\r\n      return false;\r\n    },\r\n    getUserRoles() {\r\n      this.axios\r\n        .get(\r\n          `${configObject.apiBaseUrl}/Company/UserRoleCategoryRoles/${this.$route.query.username}`,\r\n          configObject.authConfig()\r\n        )\r\n        .then((res) => {\r\n          res.data.sort((a, b) => {\r\n            return a.name.toLowerCase() > b.name.toLowerCase()\r\n              ? 1\r\n              : b.name.toLowerCase() > a.name.toLowerCase()\r\n              ? -1\r\n              : 0;\r\n          });\r\n          res.data.forEach((el) => {\r\n            el.text = el.name;\r\n            el.value = el.name;\r\n          });\r\n          let copiedResponse = [...res.data];\r\n          let options = [];\r\n          let options2 = [];\r\n          let options3 = [];\r\n          copiedResponse.forEach((br, index) => {\r\n            let dataLengthFirstOneThird = copiedResponse.length / 3;\r\n            if (index <= dataLengthFirstOneThird) {\r\n              options.push(br);\r\n            }\r\n          });\r\n\r\n          let twoThirdOfArr = copiedResponse.splice(\r\n            copiedResponse.length / 3 + 1,\r\n            copiedResponse.length - 1\r\n          );\r\n          twoThirdOfArr.forEach((br, index) => {\r\n            let dataHalfList = parseInt(twoThirdOfArr.length / 2);\r\n            if (index <= dataHalfList) {\r\n              options2.push(br);\r\n            } else {\r\n              options3.push(br);\r\n            }\r\n          });\r\n\r\n          this.options = options;\r\n          this.options2 = options2;\r\n          this.options3 = options3;\r\n\r\n          this.combinedOptions = [...options, ...options2, ...options3];\r\n          this.combinedOptions.forEach((el) => {\r\n            this.selected.push(el.name);\r\n          });\r\n          // this.disableSelectAll = true\r\n          // document.querySelector(\"#selectAllCheckbox\").checked = true\r\n          this.roles = res.data;\r\n        })\r\n        .catch((error) => {});\r\n    },\r\n    getBranches() {\r\n      this.axios\r\n        .get(\r\n          `${configObject.apiBaseUrl}/Company/Branches/${\r\n            this.$route.query.companyId\r\n              ? this.$route.query.companyId\r\n              : this.company.id\r\n          }`,\r\n          configObject.authConfig()\r\n        )\r\n        .then((res) => {\r\n          res.data.sort((a, b) => {\r\n            return a.name.toLowerCase() > b.name.toLowerCase()\r\n              ? 1\r\n              : b.name.toLowerCase() > a.name.toLowerCase()\r\n              ? -1\r\n              : 0;\r\n          });\r\n          this.branches = res.data;\r\n        })\r\n        .catch((error) => {});\r\n    },\r\n    getRoleGroups() {\r\n      this.showLoader = true;\r\n      this.axios\r\n        .get(\r\n          `${configObject.apiBaseUrl}/Role/Groups/${this.rolesCategory}`,\r\n          configObject.authConfig()\r\n        )\r\n        .then((res) => {\r\n          let index = 0;\r\n          res.data.sort((a, b) => {\r\n            return a.name.toLowerCase() > b.name.toLowerCase()\r\n              ? 1\r\n              : b.name.toLowerCase() > a.name.toLowerCase()\r\n              ? -1\r\n              : 0;\r\n          });\r\n          this.groupId = res.data[0].id;\r\n          this.groups = res.data;\r\n        })\r\n        .catch((error) => {\r\n          this.showLoader = false;\r\n        });\r\n    },\r\n    getGroupRoles() {\r\n      this.groupRolesLoader = true;\r\n      this.axios\r\n        .get(\r\n          `${configObject.apiBaseUrl}​/Role/GroupRoles/${this.groupId}`,\r\n          configObject.authConfig()\r\n        )\r\n        .then((res) => {\r\n          this.showRoles = true;\r\n          this.groupRolesLoader = false;\r\n          res.data.forEach((el) => {\r\n            el.text = el.name;\r\n            el.value = el.name;\r\n          });\r\n          let copiedResponse = [...res.data];\r\n          let options = [];\r\n          let options2 = [];\r\n          let options3 = [];\r\n          copiedResponse.forEach((br, index) => {\r\n            let dataLengthFirstOneThird = copiedResponse.length / 3;\r\n            if (index <= dataLengthFirstOneThird) {\r\n              options.push(br);\r\n            }\r\n          });\r\n\r\n          let twoThirdOfArr = copiedResponse.splice(\r\n            copiedResponse.length / 3 + 1,\r\n            copiedResponse.length - 1\r\n          );\r\n          twoThirdOfArr.forEach((br, index) => {\r\n            let dataHalfList = parseInt(twoThirdOfArr.length / 2);\r\n            if (index <= dataHalfList) {\r\n              options2.push(br);\r\n            } else {\r\n              options3.push(br);\r\n            }\r\n          });\r\n\r\n          this.options = options;\r\n          this.options2 = options2;\r\n          this.options3 = options3;\r\n\r\n          this.combinedOptions = [...options, ...options2, ...options3];\r\n        })\r\n        .catch((error) => {\r\n          this.showLoader = false;\r\n        });\r\n    },\r\n    mapRoles($event) {\r\n      $event.preventDefault();\r\n      if (this.groupId == \"select group\") {\r\n        this.$toast.open({\r\n          message: \"Please select a role group\",\r\n          type: \"error\",\r\n          duration: 3000,\r\n        });\r\n        return;\r\n      }\r\n\r\n      let roleIds = [];\r\n      this.combinedOptions.forEach((opt) => {\r\n        if (this.selected.includes(opt.value)) {\r\n          roleIds.push(opt.id);\r\n        }\r\n      });\r\n\r\n      let data = {\r\n        email: this.$route.query.username,\r\n        role: this.groupId,\r\n        roles: roleIds,\r\n        branchId: null,\r\n      };\r\n\r\n      // return\r\n\r\n      this.isButtonDisabled = true;\r\n      $(\".loader\").show();\r\n      this.axios\r\n        .post(\r\n          `${configObject.apiBaseUrl}/Company/AddUserToRole/${\r\n            this.$route.query.companyId\r\n              ? this.$route.query.companyId\r\n              : this.company.id\r\n          }`,\r\n          data,\r\n          configObject.authConfig()\r\n        )\r\n        .then(() => {\r\n          this.$toast.open({\r\n            message: `Successfully mapped roles to user (${this.username})`,\r\n            type: \"success\",\r\n            duration: 5000,\r\n          });\r\n          this.$router.push({ name: \"company_users\" });\r\n\r\n          $(\".loader\").hide();\r\n          this.isButtonDisabled = false;\r\n        })\r\n        .catch((error) => {\r\n          this.$toast.open({\r\n            message: error.response.data.message,\r\n            type: \"error\",\r\n            duration: 5000,\r\n          });\r\n          this.isButtonDisabled = false;\r\n          $(\".loader\").hide();\r\n        });\r\n    },\r\n  },\r\n};\r\n</script>\r\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./mapUserToRole.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./mapUserToRole.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./mapUserToRole.vue?vue&type=template&id=7c628448&\"\nimport script from \"./mapUserToRole.vue?vue&type=script&lang=js&\"\nexport * from \"./mapUserToRole.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}