{"version":3,"sources":["webpack:///./src/SuperAdmin/roles.vue","webpack:///src/SuperAdmin/roles.vue","webpack:///./src/SuperAdmin/roles.vue?95eb","webpack:///./src/SuperAdmin/roles.vue?e1cc","webpack:///./node_modules/core-js/modules/es.object.keys.js","webpack:///./src/SuperAdmin/roles.vue?c418"],"names":["render","_vm","this","_c","_self","staticClass","form","id","_v","on","$event","stopPropagation","preventDefault","onSubmit","apply","arguments","attrs","$v","name","$dirty","$error","model","value","$model","callback","$$v","$set","expression","permissionsData","permissions","isDisabled","_m","totalRecords","isLoading","enabled","searchFn","dropdownAllowAll","perPageDropdown","rows","columns","onPageChange","onSortChange","onColumnFilter","onPerPageChange","scopedSlots","_u","key","fn","props","column","field","editRole","row","_e","staticRenderFns","toast","position","Vue","ascIcon","descIcon","mixins","data","roles","allSelected","numberOfRoles","serverParams","columnFilters","sort","type","page","perPage","label","filterable","sortable","validations","required","methods","selectAllPermissions","loadItems","API","getAllPermissions","console","e","window","top","behavior","permissions_edit","timeout","showProgressBar","closeOnClick","pauseOnHover","resetForm","Object","self","updateParams","newProps","params","searchTerm","computed","beforeMount","mounted","component","$","toObject","nativeKeys","fails","FAILS_ON_PRIMITIVES","target","stat","forced","keys","it"],"mappings":"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","file":"js/chunk-b4e398fa.67a152be.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('section',{staticClass:\"tables new-updated-design\"},[_c('vue-snotify'),_c('div',{staticClass:\"row\"},[_c('div',{staticClass:\"col-md-12 d-flex align-items-stretch grid-margin\"},[_c('div',{staticClass:\"row flex-grow\"},[_c('div',{staticClass:\"col-12 grid-margin\"},[_c('div',{staticClass:\"card\"},[_c('div',{staticClass:\"card-header\"},[(_vm.form.id == '')?_c('h4',{staticClass:\"card-title\"},[_vm._v(\"Add New Role\")]):_c('h4',{staticClass:\"card-title\"},[_vm._v(\"Update Role\")])]),_c('div',{staticClass:\"card-body new-card-body\"},[_c('form',{staticClass:\"forms-sample\",on:{\"submit\":function($event){$event.stopPropagation();$event.preventDefault();return _vm.onSubmit.apply(null, arguments)}}},[_c('div',{staticClass:\"row\"},[_c('div',{staticClass:\"col-lg-6 col-md-6\"},[_c('b-form-group',{attrs:{\"label\":\"Name*\",\"label-for\":\"name\"}},[_c('b-form-input',{attrs:{\"type\":\"text\",\"id\":\"name\",\"name\":\"name\",\"placeholder\":\"Name\",\"state\":_vm.$v.form.name.$dirty ? !_vm.$v.form.name.$error : null,\"aria-describedby\":\"input-1-live-feedback\"},model:{value:(_vm.$v.form.name.$model),callback:function ($$v) {_vm.$set(_vm.$v.form.name, \"$model\", $$v)},expression:\"$v.form.name.$model\"}}),_c('b-form-invalid-feedback',{attrs:{\"id\":\"input-1-live-feedback\"}},[_vm._v(\"This is a required field. \")])],1)],1),_c('div',{staticClass:\"col-lg-6 col-md-6\"},[_c('b-form-group',{attrs:{\"label\":\"Permissions\",\"label-for\":\"permissions\"}},[_c('v-select',{attrs:{\"multiple\":\"\",\"options\":_vm.permissionsData},model:{value:(_vm.form.permissions),callback:function ($$v) {_vm.$set(_vm.form, \"permissions\", $$v)},expression:\"form.permissions\"}})],1)],1)]),_c('b-button',{staticClass:\"mr-2 mt-2\",attrs:{\"type\":\"submit\",\"disabled\":_vm.isDisabled,\"variant\":\"success\"}},[(_vm.form.id == '')?_c('span',[_vm._v(\"Submit\")]):_c('span',[_vm._v(\"Update\")])])],1)])])])])])]),_c('div',{staticClass:\"row\"},[_c('div',{staticClass:\"col-lg-12 grid-margin stretch-card\"},[_c('div',{staticClass:\"card\"},[_vm._m(0),_c('div',{staticClass:\"card-body new-card-body\"},[_c('vue-good-table',{attrs:{\"mode\":\"remote\",\"totalRows\":_vm.totalRecords,\"isLoading\":_vm.isLoading,\"search-options\":{enabled: true,searchFn: _vm.searchFn},\"pagination-options\":{\n  enabled: true,\n    dropdownAllowAll: false,\n  perPageDropdown: [10, 20, 50, 100, 200],\n},\"rows\":_vm.rows,\"columns\":_vm.columns},on:{\"on-page-change\":_vm.onPageChange,\"on-sort-change\":_vm.onSortChange,\"on-column-filter\":_vm.onColumnFilter,\"on-per-page-change\":_vm.onPerPageChange,\"update:isLoading\":function($event){_vm.isLoading=$event},\"update:is-loading\":function($event){_vm.isLoading=$event},\"on-search\":_vm.searchFn},scopedSlots:_vm._u([{key:\"table-row\",fn:function(props){return [(props.column.field === 'action')?_c('span',{staticClass:\"text-nowrap\"},[_c('b-button',{staticClass:\"mr-1 btn-info text-white\",attrs:{\"size\":\"sm\"},on:{\"click\":function($event){return _vm.editRole(props.row.id)}}},[_vm._v(\" Edit \")])],1):_vm._e()]}}])})],1)])])]),_c('div')],1)\n}\nvar staticRenderFns = [function (){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"card-header\"},[_c('h4',{staticClass:\"card-title\"},[_vm._v(\"Roles\")])])\n}]\n\nexport { render, staticRenderFns }","<template>\r\n    <section class=\"tables new-updated-design\">\r\n        <vue-snotify></vue-snotify>\r\n        <div class=\"row\">\r\n            <div class=\"col-md-12 d-flex align-items-stretch grid-margin\">\r\n                <div class=\"row flex-grow\">\r\n                    <div class=\"col-12 grid-margin\">\r\n                        <div class=\"card\">\r\n                            <div class=\"card-header\">\r\n                                <h4 class=\"card-title\" v-if=\"form.id == ''\">Add New Role</h4>\r\n                                <h4 class=\"card-title\" v-else>Update Role</h4>\r\n                            </div>\r\n                            <div class=\"card-body new-card-body\">\r\n                                <form class=\"forms-sample\" @submit.stop.prevent=\"onSubmit\">\r\n                                    <div class=\"row\">\r\n                                        <div class=\"col-lg-6 col-md-6\">\r\n                                            <b-form-group label=\"Name*\" label-for=\"name\">\r\n                                                <b-form-input\r\n                                                        type=\"text\"\r\n                                                        id=\"name\"\r\n                                                        name=\"name\"\r\n                                                        placeholder=\"Name\"\r\n                                                        v-model=\"$v.form.name.$model\"\r\n                                                        :state=\"$v.form.name.$dirty ? !$v.form.name.$error : null\"\r\n                                                        aria-describedby=\"input-1-live-feedback\"\r\n                                                >\r\n                                                </b-form-input>\r\n                                                <b-form-invalid-feedback id=\"input-1-live-feedback\">This is a required\r\n                                                    field.\r\n                                                </b-form-invalid-feedback>\r\n                                            </b-form-group>\r\n                                        </div>\r\n                                        <div class=\"col-lg-6 col-md-6\">\r\n\r\n                                            <b-form-group label=\"Permissions\" label-for=\"permissions\">\r\n                                                <v-select multiple v-model=\"form.permissions\"\r\n                                                          :options=\"permissionsData\">\r\n                                                    <!--                                            <v-btn @click=\"selectAllPermissions($event)\">Select all</v-btn>-->\r\n                                                </v-select>\r\n                                            </b-form-group>\r\n                                        </div>\r\n                                    </div>\r\n                                    <b-button type=\"submit\" :disabled=\"isDisabled\" variant=\"success\" class=\"mr-2 mt-2\">\r\n                                        <span v-if=\"form.id == ''\">Submit</span>\r\n                                        <span v-else>Update</span>\r\n                                    </b-button>\r\n                                </form>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n\r\n        <div class=\"row\">\r\n            <!--            <vue-snotify></vue-snotify>-->\r\n            <div class=\"col-lg-12 grid-margin stretch-card\">\r\n                <div class=\"card\">\r\n                    <div class=\"card-header\">\r\n                        <h4 class=\"card-title\">Roles</h4>\r\n                    </div>\r\n                    <div class=\"card-body new-card-body\">\r\n                        <vue-good-table\r\n                                mode=\"remote\"\r\n                                @on-page-change=\"onPageChange\"\r\n                                @on-sort-change=\"onSortChange\"\r\n                                @on-column-filter=\"onColumnFilter\"\r\n                                @on-per-page-change=\"onPerPageChange\"\r\n                                :totalRows=\"totalRecords\"\r\n                                :isLoading.sync=\"isLoading\"\r\n                                @on-search=\"searchFn\"\r\n                                :search-options=\"{enabled: true,searchFn: searchFn}\"\r\n                                :pagination-options=\"{\r\n    enabled: true,\r\n      dropdownAllowAll: false,\r\n    perPageDropdown: [10, 20, 50, 100, 200],\r\n  }\"\r\n                                :rows=\"rows\"\r\n                                :columns=\"columns\">\r\n                            <template slot=\"table-row\" slot-scope=\"props\">\r\n                                                             <span\r\n                                                                     v-if=\"props.column.field === 'action'\"\r\n                                                                     class=\"text-nowrap\"\r\n                                                             >\r\n                                                                 <b-button size=\"sm\" @click=\"editRole(props.row.id)\"\r\n                                                                           class=\"mr-1 btn-info text-white\">\r\n                                                                Edit\r\n                                                            </b-button>\r\n                                                             </span>\r\n                            </template>\r\n                        </vue-good-table>\r\n\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div></div>\r\n    </section>\r\n</template>\r\n\r\n<script>\r\n    import Vue from \"vue\";\r\n    import SortedTablePlugin from \"vue-sorted-table\";\r\n    import API from '@/api'\r\n    import {validationMixin} from \"vuelidate\";\r\n    import {required, minLength, email, sameAs} from \"vuelidate/lib/validators\";\r\n    import Snotify, {SnotifyPosition} from 'vue-snotify'\r\n\r\n    const options = {\r\n        toast: {\r\n            position: SnotifyPosition.rightTop,\r\n        }\r\n    }\r\n    Vue.use(Snotify, options)\r\n    Vue.use(SortedTablePlugin, {\r\n        ascIcon: '<i class=\"ti-arrow-down\"></i>',\r\n        descIcon: '<i class=\"ti-arrow-up\"></i>'\r\n    });\r\n    export default {\r\n        name: 'Clients',\r\n        mixins: [validationMixin],\r\n        data() {\r\n            return {\r\n                form: {\r\n                    name: \"\",\r\n                    id: \"\",\r\n                    permissions: []\r\n                },\r\n                roles: [],\r\n                allSelected: false,\r\n                permissionsData: [],\r\n                numberOfRoles: \"\",\r\n                isDisabled: false,\r\n                serverParams: {\r\n                    // a map of column filters example: {name: 'john', age: '20'}\r\n                    columnFilters: {},\r\n                    sort: [\r\n                        {\r\n                            field: 'id', // example: 'name'\r\n                            type: 'desc' // 'asc' or 'desc'\r\n                        }\r\n                    ],\r\n\r\n                    page: 1, // what page I want to show\r\n                    perPage: 10 // how many items I'm showing per page\r\n                },\r\n                columns: [\r\n                    {\r\n                        label: 'Name',\r\n                        field: 'name',\r\n                        filterable: true\r\n                    },\r\n                    {\r\n                        label: 'Action',\r\n                        field: \"action\",\r\n                        sortable: false,\r\n                    },\r\n                ],\r\n                isLoading: false,\r\n                rows: [],\r\n                totalRecords: 0,\r\n            };\r\n        }, validations: {\r\n            form: {\r\n                name: {\r\n                    required,\r\n                },\r\n            }\r\n        },\r\n        methods: {\r\n            selectAllPermissions() {\r\n\r\n                if (this.allSelected === false) {\r\n\r\n                    this.permissionsData.forEach(permission => {\r\n                        this.form.permissions.push(permission.name);\r\n                    });\r\n                } else {\r\n                    this.form.permissions = [];\r\n                }\r\n\r\n\r\n            },\r\n            loadItems() {\r\n                API.getroles(this.serverParams,\r\n                    data => {\r\n                        this.totalRecords = data.totalRecords;\r\n                        this.rows = data.data.data;\r\n\r\n                    },\r\n                    err => {\r\n                    }\r\n                )\r\n            },\r\n            getAllPermissions() {\r\n                API.getAllPermissions(\r\n                    data => {\r\n                        data.forEach((value, index) => {\r\n                            this.permissionsData.push(value.name);\r\n                        });\r\n                        console.log(this.permissionsData)\r\n                    },\r\n                    err => {\r\n                    }\r\n                )\r\n            },\r\n\r\n            editRole(e) {\r\n                this.form.permissions = [];\r\n                window.scrollTo({top: 0, behavior: 'smooth'});\r\n                API.get_edit_roles(\r\n                    e, data => {\r\n                        this.form.name = data.name;\r\n                        this.form.id = data.id;\r\n                        let permissions_edit = data.permissions;\r\n                        permissions_edit.forEach(core => {\r\n                            this.form.permissions.push(core.name);\r\n                        });\r\n                    },\r\n                    err => {\r\n                    }\r\n                )\r\n            },\r\n            onSubmit() {\r\n                this.$v.form.$touch();\r\n                if (this.$v.form.$anyError) {\r\n                    return;\r\n                }\r\n                this.isDisabled = true;\r\n                if (this.form.name != '') {\r\n                    API.add_edit_roles(\r\n                        this.form,\r\n                        data => {\r\n                            this.$snotify.success(data, {\r\n                                timeout: 2000,\r\n                                showProgressBar: false,\r\n                                closeOnClick: true,\r\n                                pauseOnHover: true,\r\n                            });\r\n                            this.form.name = '';\r\n                            this.form.id = '';\r\n                            this.allSelected = false;\r\n                            this.form.permissions = [];\r\n                            this.$v.form.$reset();\r\n                            this.loadItems();\r\n                            this.isDisabled = false;\r\n                        },\r\n                        err => {\r\n                            this.isDisabled = false;\r\n                        }\r\n                    )\r\n                } else {\r\n                    this.$snotify.warning('Please fill required fields', {\r\n                        timeout: 2000,\r\n                        showProgressBar: false,\r\n                        closeOnClick: true,\r\n                        pauseOnHover: true,\r\n                    });\r\n                    this.isDisabled = false;\r\n                }\r\n            }, resetForm() {\r\n                var self = this; //you need this because *this* will refer to Object.keys below`\r\n\r\n                //Iterate through each object field, key is name of the object field`\r\n                Object.keys(this.data.form).forEach(function (key, index) {\r\n                    self.data.form[key] = '';\r\n                });\r\n            },\r\n            updateParams(newProps) {\r\n                this.serverParams = Object.assign({}, this.serverParams, newProps);\r\n            },\r\n\r\n            onPageChange(params) {\r\n                this.updateParams({page: params.currentPage});\r\n                this.loadItems();\r\n            },\r\n\r\n            onPerPageChange(params) {\r\n                this.updateParams({perPage: params.currentPerPage});\r\n                this.loadItems();\r\n            },\r\n\r\n            onSortChange(params) {\r\n                console.log(params.sortType);\r\n                this.updateParams({\r\n                    sort: [{\r\n                        type: params[0].type,\r\n                        field: params[0].field,\r\n                    }],\r\n                });\r\n                this.loadItems();\r\n            },\r\n            searchFn(params) {\r\n                this.updateParams({searchTerm: params});\r\n                this.loadItems();\r\n            },\r\n            onColumnFilter(params) {\r\n                this.updateParams(params);\r\n                this.loadItems();\r\n            }\r\n        }, computed: {},\r\n        beforeMount() {\r\n            this.getAllPermissions();\r\n            this.loadItems();\r\n        },\r\n        mounted() {\r\n        }\r\n    }\r\n</script>\r\n\r\n<style>\r\n    .row .card .new-card-body {\r\n        padding: 1.25rem 1.437rem !important;\r\n    }\r\n    @media (max-width: 450px) {\r\n        .vgt-wrap__footer .footer__navigation__page-btn:nth-child(3) {\r\n            float: right;\r\n            margin-left: 8px;\r\n        }\r\n        .vgt-wrap__footer .footer__navigation__page-btn:nth-child(2) {\r\n            margin-left: 0px;\r\n            float: left;\r\n        }\r\n        .vgt-wrap__footer .footer__navigation__page-info {\r\n            width: 100%;\r\n            text-align: center;\r\n            margin: 0;\r\n        }\r\n        .vgt-pull-right {\r\n            float: inherit !important;\r\n        }\r\n    }\r\n    @media (max-width: 375px) {\r\n        .row .card .new-card-body {\r\n            padding: 1.25rem 1.437rem !important;\r\n        }\r\n    }\r\n</style>","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!./roles.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!./roles.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./roles.vue?vue&type=template&id=54d38514&\"\nimport script from \"./roles.vue?vue&type=script&lang=js&\"\nexport * from \"./roles.vue?vue&type=script&lang=js&\"\nimport style0 from \"./roles.vue?vue&type=style&index=0&id=54d38514&prod&lang=css&\"\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","var $ = require('../internals/export');\nvar toObject = require('../internals/to-object');\nvar nativeKeys = require('../internals/object-keys');\nvar fails = require('../internals/fails');\n\nvar FAILS_ON_PRIMITIVES = fails(function () { nativeKeys(1); });\n\n// `Object.keys` method\n// https://tc39.es/ecma262/#sec-object.keys\n$({ target: 'Object', stat: true, forced: FAILS_ON_PRIMITIVES }, {\n  keys: function keys(it) {\n    return nativeKeys(toObject(it));\n  }\n});\n","export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./roles.vue?vue&type=style&index=0&id=54d38514&prod&lang=css&\""],"sourceRoot":""}