{"version":3,"file":"Users-Cjm1JjIX.js","sources":["../../../resources/js/views/admin/Users.vue"],"sourcesContent":["<script setup>\n    import AdminTabs from '@/layouts/AdminTabs.vue'\n    import userService from '@/services/userService'\n    import { useNotifyStore } from '@/stores/notify'\n    import { UseColorMode } from '@vueuse/components'\n    import Spinner from '@/components/Spinner.vue'\n    import SearchBox from '@/components/SearchBox.vue'\n\n    const $2fauth = inject('2fauth')\n    const notify = useNotifyStore()\n    const returnTo = useStorage($2fauth.prefix + 'returnTo', 'accounts')\n\n    const users = ref([])\n    const searched = ref('')\n    const isFetching = ref(false)\n\n    const visibleUsers = computed(() => {\n        return users.value.filter(\n            user => {\n                let ret = user.name.toLowerCase().includes(searchedObj.value.keywords)\n                    || user.email.toLowerCase().includes(searchedObj.value.keywords)\n\n                if (searchedObj.value.admin != undefined) {\n                    ret = ret && user.is_admin == searchedObj.value.admin\n                }\n                if (searchedObj.value.oauth != undefined) {\n                    ret = ret && user.oauth_provider == searchedObj.value.oauth\n                }\n\n                return ret\n            }\n        )\n    })\n\n    const searchedObj = computed(() => {\n        const obj = {\n            admin: undefined,\n            oauth: undefined,\n            keywords: searched.value.toLowerCase()\n        }\n        const searchedChunks = searched.value.toLowerCase().split(' ')\n        const regexAdmin = /admin:([01])/\n        const regexOAuth = /oauth:([a-zA-Z0-9])/\n\n        searchedChunks.forEach(chunk => {\n            if (chunk.match(regexAdmin)) {\n                obj.admin = parseInt(chunk.replace(regexAdmin, '$1'))\n                obj.keywords = obj.keywords.replace(chunk, '').trim()\n            }\n            if (chunk.match(regexOAuth)) {\n                obj.oauth = chunk.replace(regexOAuth, '$1')\n                obj.keywords = obj.keywords.replace(chunk, '').trim()\n            }\n        })\n\n        return obj\n    })\n\n    onMounted(() => {\n        fetchUsers()\n    })\n\n    /**\n     * \n     * @param {*} filter \n     */\n    function addFilter(filter) {\n        const regexAdmin = /admin:([01])/\n        const regexOAuth = /oauth:([a-zA-Z0-9]*)/\n\n        if (searched.value.match(regexAdmin) && filter.match(regexAdmin)) {\n            searched.value = searched.value.replace(regexAdmin, filter)\n        }\n        else if (searchedObj.value.oauth != undefined && filter.match(regexOAuth)) {\n            searched.value = searched.value.replace(regexOAuth, filter)\n        }\n        else searched.value = searched.value ? searched.value + ' ' + filter : filter\n    }\n\n    /**\n     * Gets all users from backend\n     */\n    function fetchUsers() {\n        isFetching.value = true\n\n        userService.getAll({returnError: true})\n        .then(response => {\n            users.value = response.data\n        })\n        .catch(error => {\n            notify.error(error)\n        })\n        .finally(() => {\n            isFetching.value = false\n        })\n    }\n\n    onBeforeRouteLeave((to) => {\n        if (! to.name.startsWith('admin.')) {\n            notify.clear()\n        }\n    })\n\n</script>\n\n<template>\n    <div>\n        <AdminTabs activeTab=\"admin.users\" />\n        <div class=\"options-tabs\">\n            <FormWrapper>\n                <h4 class=\"title is-4 has-text-grey-light\">{{ $t('admin.users') }}</h4>\n                <div class=\"is-size-7-mobile\">\n                    {{ $t('admin.users_legend')}}\n                </div>\n                <div class=\"mb-6 mt-3\">\n                    <RouterLink class=\"is-link mt-5\" :to=\"{ name: 'admin.createUser' }\">\n                        <FontAwesomeIcon :icon=\"['fas', 'plus-circle']\" /> {{ $t('admin.create_new_user') }}\n                    </RouterLink>\n                </div>\n                <!-- search -->\n                <div class=\"columns\">\n                    <div class=\"column pb-0\">\n                        <SearchBox v-model:keyword=\"searched\" :hasNoBackground=\"true\" :placeholder=\"$t('admin.search_user_placeholder')\" />\n                    </div>\n                </div>\n                <div class=\"level is-mobile mb-0\">\n                    <div class=\"level-item has-text-centered is-justify-content-end\">\n                        <p class=\"subtitle is-7\">\n                            {{ $t('admin.quick_filters_colons') }}\n                        </p>\n                    </div>\n                    <div class=\"level-item has-text-centered is-justify-content-start\">\n                        <div class=\"buttons\">\n                            <button type=\"button\" class=\"button is-small is-ghost p-0\" @click=\"addFilter('admin:1')\">admin</button>\n                            <button type=\"button\" class=\"button is-small is-ghost p-0\" @click=\"addFilter('oauth:github')\">github</button>\n                            <button type=\"button\" class=\"button is-small is-ghost p-0\" @click=\"addFilter('oauth:openid')\">openId</button>\n                        </div>\n                    </div>\n                </div>\n                <div v-if=\"visibleUsers.length > 0\">\n                    <div v-for=\"user in visibleUsers\" :key=\"user.id\" class=\"list-item is-size-5 is-size-6-mobile is-flex is-justify-content-space-between\">\n                        <UseColorMode v-slot=\"{ mode }\">\n                            <div class=\"has-ellipsis\">\n                                <span>{{ user.name }}</span>\n                                <!-- <FontAwesomeIcon v-if=\"token.value\" class=\"has-text-success\" :icon=\"['fas', 'check']\" /> {{ token.name }} -->\n                                <!-- set as admin link -->\n                                <!-- admin tag -->\n                                <span class=\"is-block has-ellipsis is-family-primary is-size-6 is-size-7-mobile has-text-grey\">{{ user.email }}</span>\n                                <!-- tag -->\n                                <div class=\"tags mt-2\">\n                                    <span v-if=\"user.is_admin\" class=\"tag is-rounded has-text-warning-dark\" :class=\"mode == 'dark' ? 'has-background-black-bis' : 'has-background-grey-lighter'\" >admin</span>\n                                    <span v-if=\"user.oauth_provider\" class=\"tag is-rounded  has-text-grey\" :class=\"mode == 'dark' ? 'has-background-black-bis' : 'has-background-grey-lighter'\" >oauth: {{ user.oauth_provider }}</span>\n                                </div>\n                            </div>\n                            <div class=\"ml-3\">\n                                <!-- manage link -->\n                                <RouterLink :to=\"{ name: 'admin.manageUser', params: { userId: user.id }}\" class=\"button is-small has-normal-radius\" :class=\"{'is-dark' : mode == 'dark'}\" :title=\"$t('commons.manage')\">\n                                    {{ $t('commons.manage') }}\n                                </RouterLink>\n\n                            </div>\n                        </UseColorMode>\n                    </div>\n                    <!-- <div class=\"mt-2 is-size-7 is-pulled-right\">\n                        {{ $t('settings.revoking_a_token_is_permanent')}}\n                    </div> -->\n                </div>\n                <div v-else class=\"mt-4 pl-3\">\n                    {{ $t('commons.no_result') }}\n                </div>\n                <Spinner :isVisible=\"isFetching && users.length === 0\" />\n                <!-- footer -->\n                <VueFooter :showButtons=\"true\">\n                    <ButtonBackCloseCancel :returnTo=\"{ name: returnTo }\" action=\"close\" />\n                </VueFooter>\n            </FormWrapper>\n        </div>\n    </div>\n</template>"],"names":["$2fauth","inject","notify","useNotifyStore","returnTo","useStorage","users","ref","searched","isFetching","visibleUsers","computed","user","ret","searchedObj","obj","searchedChunks","regexAdmin","regexOAuth","chunk","onMounted","fetchUsers","addFilter","filter","userService","response","error","onBeforeRouteLeave","to"],"mappings":"8/BAQI,MAAMA,EAAUC,EAAO,QAAQ,EACzBC,EAASC,EAAc,EACvBC,EAAWC,EAAWL,EAAQ,OAAS,WAAY,UAAU,EAE7DM,EAAQC,EAAI,CAAE,CAAA,EACdC,EAAWD,EAAI,EAAE,EACjBE,EAAaF,EAAI,EAAK,EAEtBG,EAAeC,EAAS,IACnBL,EAAM,MAAM,OACfM,GAAQ,CACJ,IAAIC,EAAMD,EAAK,KAAK,YAAa,EAAC,SAASE,EAAY,MAAM,QAAQ,GAC9DF,EAAK,MAAM,YAAW,EAAG,SAASE,EAAY,MAAM,QAAQ,EAEnE,OAAIA,EAAY,MAAM,OAAS,OAC3BD,EAAMA,GAAOD,EAAK,UAAYE,EAAY,MAAM,OAEhDA,EAAY,MAAM,OAAS,OAC3BD,EAAMA,GAAOD,EAAK,gBAAkBE,EAAY,MAAM,OAGnDD,CACvB,CACA,CACK,EAEKC,EAAcH,EAAS,IAAM,CAC/B,MAAMI,EAAM,CACR,MAAO,OACP,MAAO,OACP,SAAUP,EAAS,MAAM,YAAW,CAChD,EACcQ,EAAiBR,EAAS,MAAM,YAAa,EAAC,MAAM,GAAG,EACvDS,EAAa,eACbC,EAAa,sBAEnB,OAAAF,EAAe,QAAQG,GAAS,CACxBA,EAAM,MAAMF,CAAU,IACtBF,EAAI,MAAQ,SAASI,EAAM,QAAQF,EAAY,IAAI,CAAC,EACpDF,EAAI,SAAWA,EAAI,SAAS,QAAQI,EAAO,EAAE,EAAE,KAAI,GAEnDA,EAAM,MAAMD,CAAU,IACtBH,EAAI,MAAQI,EAAM,QAAQD,EAAY,IAAI,EAC1CH,EAAI,SAAWA,EAAI,SAAS,QAAQI,EAAO,EAAE,EAAE,KAAI,EAE1D,CAAA,EAEMJ,CACV,CAAA,EAEDK,EAAU,IAAM,CACZC,EAAU,CACb,CAAA,EAMD,SAASC,EAAUC,EAAQ,CACvB,MAAMN,EAAa,eACbC,EAAa,uBAEfV,EAAS,MAAM,MAAMS,CAAU,GAAKM,EAAO,MAAMN,CAAU,EAC3DT,EAAS,MAAQA,EAAS,MAAM,QAAQS,EAAYM,CAAM,EAErDT,EAAY,MAAM,OAAS,MAAaS,EAAO,MAAML,CAAU,EACpEV,EAAS,MAAQA,EAAS,MAAM,QAAQU,EAAYK,CAAM,EAEzDf,EAAS,MAAQA,EAAS,MAAQA,EAAS,MAAQ,IAAMe,EAASA,CAC/E,CAKI,SAASF,GAAa,CAClBZ,EAAW,MAAQ,GAEnBe,EAAY,OAAO,CAAC,YAAa,EAAI,CAAC,EACrC,KAAKC,GAAY,CACdnB,EAAM,MAAQmB,EAAS,IAC1B,CAAA,EACA,MAAMC,GAAS,CACZxB,EAAO,MAAMwB,CAAK,CACrB,CAAA,EACA,QAAQ,IAAM,CACXjB,EAAW,MAAQ,EACtB,CAAA,CACT,CAEI,OAAAkB,EAAoBC,GAAO,CACjBA,EAAG,KAAK,WAAW,QAAQ,GAC7B1B,EAAO,MAAK,CAEnB,CAAA"}