108 lines
3.2 KiB
Vue
108 lines
3.2 KiB
Vue
<script setup>
|
|
import { onMounted, inject, ref } from 'vue';
|
|
import { useRoute } from 'vue-router';
|
|
|
|
import CardList from 'src/components/ui/CardList.vue';
|
|
import VnList from 'src/components/ui/VnList.vue';
|
|
|
|
import { formatDateTitle } from 'src/lib/filters.js';
|
|
|
|
const jApi = inject('jApi');
|
|
|
|
const route = useRoute();
|
|
|
|
const accessLogs = ref([]);
|
|
const user = ref(null);
|
|
|
|
const getUser = async () => {
|
|
try {
|
|
if (!route.params.id) return;
|
|
const [data] = await jApi.query(
|
|
`SELECT u.id, u.name user, u.nickname, u.email, c.phone, r.name role
|
|
FROM account.user u
|
|
JOIN account.role r ON r.id = u.role
|
|
LEFT JOIN vn.client c ON c.id = u.id
|
|
WHERE u.id = #user`,
|
|
{ user: route.params.id }
|
|
);
|
|
user.value = data;
|
|
} catch (error) {
|
|
console.error('Error getting user:', error);
|
|
}
|
|
};
|
|
|
|
const getAccessLogs = async () => {
|
|
try {
|
|
accessLogs.value = await jApi.query(
|
|
`SELECT u.stamp, a.platform, a.browser, a.version, a.javascript, a.cookies
|
|
FROM visitUser u
|
|
JOIN visitAccess c ON c.id = u.accessFk
|
|
JOIN visitAgent a ON a.id = c.agentFk
|
|
WHERE u.userFk = #user
|
|
ORDER BY u.stamp DESC
|
|
LIMIT 8`,
|
|
{ user: route.params.id }
|
|
);
|
|
} catch (error) {
|
|
console.error('Error getting access logs:', error);
|
|
}
|
|
};
|
|
|
|
onMounted(async () => {
|
|
getUser();
|
|
getAccessLogs();
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<QPage class="vn-w-xs">
|
|
<CardList
|
|
v-if="user"
|
|
:key="index"
|
|
:clickable="false"
|
|
rounded
|
|
class="q-mb-md"
|
|
>
|
|
<template #content>
|
|
<span class="text-bold text-h5 q-mb-sm">
|
|
{{ user?.nickname }}
|
|
</span>
|
|
<span>#{{ user?.id }} - {{ user.user }} </span>
|
|
<span>{{ user?.role }} </span>
|
|
<span>{{ user?.email }} </span>
|
|
<span>{{ user?.phone }} </span>
|
|
</template>
|
|
</CardList>
|
|
<VnList :rows="accessLogs">
|
|
<CardList
|
|
v-for="(accessLog, index) in accessLogs"
|
|
:key="index"
|
|
:clickable="false"
|
|
>
|
|
<template #content>
|
|
<span>
|
|
{{
|
|
formatDateTitle(accessLog.stamp, {
|
|
showTime: true,
|
|
shortDay: true,
|
|
shortMonth: true,
|
|
showSeconds: true
|
|
})
|
|
}}
|
|
</span>
|
|
<span
|
|
v-if="
|
|
accessLog.platform &&
|
|
accessLog.browser &&
|
|
accessLog.version
|
|
"
|
|
>
|
|
{{ accessLog.platform }} - {{ accessLog.browser }} -
|
|
{{ accessLog.version }}
|
|
</span>
|
|
</template>
|
|
</CardList>
|
|
</VnList>
|
|
</QPage>
|
|
</template>
|