forked from verdnatura/salix-front
113 lines
3.8 KiB
Vue
113 lines
3.8 KiB
Vue
<script setup>
|
|
import { ref } from 'vue';
|
|
import { useRouter } from 'vue-router';
|
|
import { useI18n } from 'vue-i18n';
|
|
|
|
import VnPaginate from 'components/ui/VnPaginate.vue';
|
|
import CardList from 'src/components/ui/CardList.vue';
|
|
import VnLv from 'src/components/ui/VnLv.vue';
|
|
|
|
import { toDateTimeFormat } from 'src/filters/date.js';
|
|
import axios from 'axios';
|
|
import useNotify from 'src/composables/useNotify.js';
|
|
import { useVnConfirm } from 'composables/useVnConfirm';
|
|
|
|
const { t } = useI18n();
|
|
const router = useRouter();
|
|
const { notify } = useNotify();
|
|
const { openConfirmationModal } = useVnConfirm();
|
|
|
|
const paginateRef = ref(null);
|
|
const filter = {
|
|
fields: ['id', 'created', 'userId'],
|
|
include: {
|
|
relation: 'user',
|
|
scope: {
|
|
fields: ['username'],
|
|
},
|
|
},
|
|
order: 'created DESC',
|
|
};
|
|
|
|
const urlPath = 'AccessTokens';
|
|
|
|
const refresh = () => paginateRef.value.fetch();
|
|
|
|
const navigate = (id) => router.push({ name: 'AccountSummary', params: { id } });
|
|
|
|
const killSession = async (id) => {
|
|
try {
|
|
await axios.delete(`${urlPath}/${id}`);
|
|
paginateRef.value.fetch();
|
|
notify(t('Session killed'), 'positive');
|
|
} catch (error) {
|
|
console.error('Error killing session', error);
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<QPage class="column items-center q-pa-md">
|
|
<div class="vn-card-list">
|
|
<VnPaginate
|
|
:data-key="urlPath"
|
|
ref="paginateRef"
|
|
:filter="filter"
|
|
:url="urlPath"
|
|
order="created DESC"
|
|
auto-load
|
|
>
|
|
<template #body="{ rows }">
|
|
<CardList
|
|
:key="row.id"
|
|
:title="row.user?.username"
|
|
@click="navigate(row.userId)"
|
|
v-for="row of rows"
|
|
>
|
|
<template #list-items>
|
|
<div style="flex-direction: column; width: 100%">
|
|
<VnLv
|
|
:label="t('connections.username')"
|
|
:value="row.user?.username"
|
|
>
|
|
</VnLv>
|
|
<VnLv
|
|
:label="t('connections.created')"
|
|
:value="toDateTimeFormat(row.created)"
|
|
>
|
|
</VnLv>
|
|
</div>
|
|
</template>
|
|
<template #actions>
|
|
<QBtn
|
|
class="q-mt-xs"
|
|
:label="t('connections.killSession')"
|
|
@click.stop="
|
|
openConfirmationModal(
|
|
t('Session will be killed'),
|
|
t('Are you sure you want to continue?'),
|
|
() => killSession(row.id)
|
|
)
|
|
"
|
|
outline
|
|
/>
|
|
</template>
|
|
</CardList>
|
|
</template>
|
|
</VnPaginate>
|
|
</div>
|
|
<QPageSticky position="bottom-right" :offset="[18, 18]">
|
|
<QBtn fab icon="refresh" color="primary" @click="refresh()">
|
|
<QTooltip>{{ t('connections.refresh') }}</QTooltip>
|
|
</QBtn>
|
|
</QPageSticky>
|
|
</QPage>
|
|
</template>
|
|
|
|
<i18n>
|
|
es:
|
|
Session killed: Sesión matada
|
|
Session will be killed: Se va a matar la sesión
|
|
Are you sure you want to continue?: ¿Seguro que quieres continuar?
|
|
</i18n>
|