136 lines
4.0 KiB
Vue
136 lines
4.0 KiB
Vue
<script setup>
|
|
import { ref } from 'vue';
|
|
import { useI18n } from 'vue-i18n';
|
|
import { useRouter } from 'vue-router';
|
|
|
|
import CardList from 'src/components/ui/CardList.vue';
|
|
import VnSearchBar from 'src/components/ui/NewVnSearchBar.vue';
|
|
import VnList from 'src/components/ui/VnList.vue';
|
|
|
|
import { useAppStore } from 'stores/app';
|
|
import { storeToRefs } from 'pinia';
|
|
import { useUserStore } from 'stores/user';
|
|
|
|
const { t } = useI18n();
|
|
const router = useRouter();
|
|
const userStore = useUserStore();
|
|
const appStore = useAppStore();
|
|
const { isHeaderMounted } = storeToRefs(appStore);
|
|
const loading = ref(false);
|
|
const users = ref([]);
|
|
const filter = {
|
|
fields: ['id', 'name', 'nickname', 'active']
|
|
};
|
|
|
|
const onSearch = data => (users.value = data || []);
|
|
|
|
const supplantUser = async user => {
|
|
try {
|
|
await userStore.supplantUser(user);
|
|
await appStore.getMenuLinks();
|
|
router.push({ name: 'confirmedOrders' });
|
|
} catch (error) {
|
|
console.error('Error supplanting user:', error);
|
|
}
|
|
};
|
|
|
|
const usersExprBuilder = (param, value) => {
|
|
switch (param) {
|
|
case 'search':
|
|
return /^\d+$/.test(value)
|
|
? { id: value }
|
|
: {
|
|
or: [
|
|
{ name: { like: `%${value}%` } },
|
|
{ nickname: { like: `%${value}%` } }
|
|
]
|
|
};
|
|
case 'name':
|
|
case 'nickname':
|
|
return { [param]: { like: `%${value}%` } };
|
|
case 'roleFk':
|
|
return { [param]: value };
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<Teleport v-if="isHeaderMounted" to="#actions">
|
|
<VnSearchBar
|
|
url="/VnUsers/preview"
|
|
@on-search="onSearch"
|
|
@on-search-error="users = []"
|
|
:expr-builder="usersExprBuilder"
|
|
:filter="filter"
|
|
data-cy="usersViewSearchBar"
|
|
/>
|
|
</Teleport>
|
|
<QPage class="vn-w-xs">
|
|
<VnList
|
|
class="flex justify-center"
|
|
empty-message="noData"
|
|
empty-icon="refresh"
|
|
:loading="loading"
|
|
:rows="users"
|
|
data-cy="usersViewList"
|
|
>
|
|
<CardList
|
|
v-for="(user, index) in users"
|
|
:key="index"
|
|
:to="{ name: 'accessLog', params: { id: user.id } }"
|
|
data-cy="userViewCard"
|
|
>
|
|
<template #content>
|
|
<span class="text-bold q-mb-sm">
|
|
{{ user.nickname }}
|
|
</span>
|
|
<span>#{{ user.id }} - {{ user.name }} </span>
|
|
</template>
|
|
<template #actions>
|
|
<QBtn
|
|
v-if="user.active"
|
|
icon="people"
|
|
flat
|
|
rounded
|
|
@click.stop.prevent="supplantUser(user.name)"
|
|
data-cy="usersViewSupplantUserBtn"
|
|
>
|
|
<QTooltip>
|
|
{{ t('Impersonate user') }}
|
|
</QTooltip>
|
|
</QBtn>
|
|
<QBadge v-else color="negative">{{ t('Disabled') }}</QBadge>
|
|
</template>
|
|
</CardList>
|
|
</VnList>
|
|
</QPage>
|
|
</template>
|
|
|
|
<i18n lang="yaml">
|
|
en-US:
|
|
User management: User management
|
|
Disabled: Disabled
|
|
Impersonate user: Impersonate user
|
|
Access log: Access log
|
|
es-ES:
|
|
User management: Gestión de usuarios
|
|
Disabled: Desactivado
|
|
Impersonate user: Suplantar usuario
|
|
Access log: Registro de accesos
|
|
ca-ES:
|
|
User management: Gestió d'usuaris
|
|
Disabled: Deshabilitat
|
|
Impersonate user: Suplantar usuari
|
|
Access log: Registre d'accessos
|
|
fr-FR:
|
|
User management: Gestion des utilisateurs
|
|
Disabled: Désactivé
|
|
Impersonate user: Accès utilisateur
|
|
Access log: Journal des accès
|
|
pt-PT:
|
|
User management: Gestão de usuarios
|
|
Disabled: Desativado
|
|
Impersonate user: Suplantar usuario
|
|
Access log: Registro de acessos
|
|
</i18n>
|