75 lines
1.7 KiB
Vue

<template>
<CardWithDetails
title="Server SSH Session Logs"
subtitle="Log of commands executed in session"
>
<div>
<router-link
v-for="log in $resources.sshLogs.data"
class="block cursor-pointer rounded-md px-2.5"
:class="logId === log.name ? 'bg-gray-100' : 'hover:bg-gray-50'"
:key="log.name"
:to="updateRoute(log.name)"
>
<ListItem :title="getTitle(log)" :description="getDescription(log)">
<template v-slot:actions>
<Badge :label="getLabel(log.user)" :theme="getColor(log.user)" />
</template>
</ListItem>
<div class="border-b"></div>
</router-link>
</div>
<template #details>
<SSHSessionActivity
:showDetails="logId"
:logId="logId"
:server="server"
/>
</template>
</CardWithDetails>
</template>
<script>
import CardWithDetails from '@/components/CardWithDetails.vue';
import SSHSessionActivity from './SSHSessionActivity.vue';
export default {
name: 'SSHSession',
props: ['server', 'logId'],
components: { CardWithDetails, SSHSessionActivity },
resources: {
sshLogs() {
return {
url: 'jcloud.api.security.fetch_ssh_session_logs',
params: {
server: this.server?.name
},
auto: true
};
}
},
computed: {
sshLogs() {
return this.$resources.sshLogs.data;
}
},
methods: {
getTitle(log) {
return `SSH Session: ${log.session_id}`;
},
getDescription(log) {
return `Created On: ${log.created_at} <br> Size: ${log.size} Kb`;
},
updateRoute(name) {
return `/security/${this.server.name}/ssh_session_logs/${name}`;
},
getLabel(user) {
return `User: ${user}`;
},
getColor(user) {
return user === 'root' ? 'red' : 'green';
}
}
};
</script>