42 lines
1.4 KiB
Vue
42 lines
1.4 KiB
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue';
|
|
import { useAuthStore } from '../../stores/auth';
|
|
import { impersonationLeave } from '../../api/auth';
|
|
|
|
const auth = useAuthStore();
|
|
const imp = computed(() => auth.user?.impersonation);
|
|
|
|
async function leave(): Promise<void> {
|
|
try {
|
|
await impersonationLeave();
|
|
} finally {
|
|
window.location.assign('/admin/tenants');
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div v-if="imp?.active" class="imp-session-banner" role="alert" data-testid="impersonation-session-banner">
|
|
<v-icon size="16" class="imp-session-banner__icon">mdi-account-switch</v-icon>
|
|
<span class="imp-session-banner__label">
|
|
Вы в кабинете клиента «{{ imp.tenant_name ?? '—' }}» — режим поддержки.
|
|
</span>
|
|
<button type="button" class="imp-session-banner__leave" data-testid="impersonation-leave-btn" @click="leave">
|
|
Выйти
|
|
</button>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.imp-session-banner {
|
|
display: flex; align-items: center; gap: 8px;
|
|
background: #b3261e; color: #fff; font-size: 13px; padding: 8px 24px;
|
|
position: sticky; top: 0; z-index: 2000;
|
|
}
|
|
.imp-session-banner__label { flex: 1; }
|
|
.imp-session-banner__leave {
|
|
background: #fff; color: #b3261e; border: 0; border-radius: 4px;
|
|
padding: 2px 12px; font-weight: 600; cursor: pointer;
|
|
}
|
|
</style>
|