Skip to content

Apply LjStatus across identity views (refs ligoj#110 ligoj#111) #59

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
fdaugan merged 1 commit into from
Jun 9, 2026
Merged

Apply LjStatus across identity views (refs ligoj#110 ligoj#111) #59

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 3 additions & 4 deletions ui/src/components/CompanyEditPanel.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,9 +66,8 @@
{{ form.locked ? 'mdi-lock' : 'mdi-lock-open-variant-outline' }}
</v-icon>
<div class="text-body-2 text-medium-emphasis">{{ t('group.locked') }}</div>
<v-chip size="small" :color="form.locked ? 'error' : 'success'" variant="tonal">
{{ form.locked ? t('user.statusLocked') : t('user.statusActive') }}
</v-chip>
<LjStatus :status="form.locked ? 'error' : 'ok'"
:tooltip="form.locked ? t('user.statusLocked') : t('user.statusActive')" />
</div>

<div v-if="form.count != null" class="d-flex align-center ga-3">
Expand Down Expand Up @@ -105,7 +104,7 @@
import { ref, computed, onMounted, onBeforeUnmount } from 'vue'
import { useApi, useErrorStore, useI18nStore } from '@ligoj/host'
import { TYPE_ICONS } from '../composables/delegateTypes.js'
import { VibrantConfirmDialog as LigojConfirmDialog, LjButton, LjAvailabilityField } from '@ligoj/host'
import { VibrantConfirmDialog as LigojConfirmDialog, LjButton, LjAvailabilityField, LjStatus } from '@ligoj/host'

const props = defineProps({
/**
Expand Down
8 changes: 3 additions & 5 deletions ui/src/views/CompanyListView.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,10 +37,8 @@
</template>
<template #cell.count="{ item }"><span class="mono">{{ item.count ?? '—' }}</span></template>
<template #cell.locked="{ item }">
<v-tooltip v-if="item.locked" :text="t('user.statusLocked')" location="top">
<template #activator="{ props: tt }"><v-icon v-bind="tt" color="error" size="19">mdi-lock</v-icon></template>
</v-tooltip>
<span v-else class="dash">—</span>
<LjStatus :status="item.locked ? 'error' : 'ok'"
:tooltip="item.locked ? t('user.statusLocked') : t('user.statusActive')" />
</template>
<template #actions="{ item }">
<v-menu location="bottom end">
Expand Down Expand Up @@ -79,7 +77,7 @@ import { ref, computed, onMounted } from 'vue'
import { useRoute } from 'vue-router'
import { useDataTable, useApi, useAppStore, useErrorStore, useI18nStore } from '@ligoj/host'
import { TYPE_ICONS } from '../composables/delegateTypes.js'
import { VibrantDataTable, VibrantConfirmDialog as LigojConfirmDialog, LjPageHeader, LjButton, LjSearch, LjDialog } from '@ligoj/host'
import { VibrantDataTable, VibrantConfirmDialog as LigojConfirmDialog, LjPageHeader, LjButton, LjSearch, LjDialog, LjStatus } from '@ligoj/host'
import CompanyEditPanel from '../components/CompanyEditPanel.vue'

const route = useRoute()
Expand Down
9 changes: 3 additions & 6 deletions ui/src/views/ContainerScopeView.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,10 +29,8 @@
</template>
<template #cell.dn="{ item }"><code class="dn">{{ item.dn || '—' }}</code></template>
<template #cell.locked="{ item }">
<v-tooltip v-if="item.locked" :text="t('user.statusLocked')" location="top">
<template #activator="{ props: tt }"><v-icon v-bind="tt" color="warning" size="19">mdi-lock</v-icon></template>
</v-tooltip>
<span v-else class="dash">—</span>
<LjStatus :status="item.locked ? 'warn' : 'ok'"
:tooltip="item.locked ? t('user.statusLocked') : t('user.statusActive')" />
</template>
<template #actions="{ item }">
<v-menu location="bottom end">
Expand Down Expand Up @@ -74,7 +72,7 @@
import { ref, computed, watch, onMounted } from 'vue'
import { useApi, useAppStore, useErrorStore, useI18nStore } from '@ligoj/host'
import { TYPE_ICONS } from '../composables/delegateTypes.js'
import { VibrantDataTable, VibrantConfirmDialog as LigojConfirmDialog, LjPageHeader, LjButton, LjSearch, LjSegmented, LjDialog, LjAvailabilityField } from '@ligoj/host'
import { VibrantDataTable, VibrantConfirmDialog as LigojConfirmDialog, LjPageHeader, LjButton, LjSearch, LjSegmented, LjDialog, LjAvailabilityField, LjStatus } from '@ligoj/host'

const api = useApi()
const appStore = useAppStore()
Expand Down Expand Up @@ -214,5 +212,4 @@ onMounted(() => {
.locked-note { display: flex; align-items: center; gap: 6px; margin: 6px 0 0 8px; font-size: 12px; color: var(--ink-3); }
.locked-note .v-icon { color: rgb(var(--v-theme-warning)); }
.dn { font-family: var(--mono); font-size: 12.5px; color: var(--ink-2); }
.dash { color: var(--ink-3); }
</style>
27 changes: 5 additions & 22 deletions ui/src/views/DelegateListView.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,14 +39,12 @@
</span>
</template>
<template #cell.canAdmin="{ item }">
<span class="bdot" :class="{ on: item.canAdmin }">
<v-tooltip activator="parent" :text="item.canAdmin ? t('delegate.adminGranted') : t('delegate.adminNotGranted')" location="top" />
</span>
<LjStatus :active="item.canAdmin"
:tooltip="item.canAdmin ? t('delegate.adminGranted') : t('delegate.adminNotGranted')" />
</template>
<template #cell.canWrite="{ item }">
<span class="bdot" :class="{ on: item.canWrite }">
<v-tooltip activator="parent" :text="item.canWrite ? t('delegate.writeGranted') : t('delegate.writeNotGranted')" location="top" />
</span>
<LjStatus :active="item.canWrite"
:tooltip="item.canWrite ? t('delegate.writeGranted') : t('delegate.writeNotGranted')" />
</template>
<template #actions="{ item }">
<v-menu location="bottom end">
Expand Down Expand Up @@ -79,7 +77,7 @@
import { ref, computed, onMounted } from 'vue'
import { useDataTable, useApi, useAppStore, useI18nStore } from '@ligoj/host'
import { TYPE_ICONS } from '../composables/delegateTypes.js'
import { VibrantDataTable, VibrantConfirmDialog as LigojConfirmDialog, LjPageHeader, LjButton, LjSearch } from '@ligoj/host'
import { VibrantDataTable, VibrantConfirmDialog as LigojConfirmDialog, LjPageHeader, LjButton, LjSearch, LjStatus } from '@ligoj/host'
import DelegateEditDialog from './DelegateEditDialog.vue'

const appStore = useAppStore()
Expand Down Expand Up @@ -171,19 +169,4 @@ onMounted(() => {
.rcv-name {
font-weight: 600;
}

/* Status dot: muted when off, vivid green with a glow when on. */
.bdot {
display: inline-block;
width: 10px;
height: 10px;
border-radius: 50%;
background: rgba(var(--v-theme-on-surface), .2);
transition: background .15s, box-shadow .15s;
}

.bdot.on {
background: #1d9d63;
box-shadow: 0 0 0 3px rgba(29, 157, 99, .18), 0 0 10px 1px rgba(29, 157, 99, .6);
}
</style>
8 changes: 3 additions & 5 deletions ui/src/views/GroupListView.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,10 +39,8 @@
</template>
<template #cell.count="{ item }"><span class="mono">{{ item.count ?? '—' }}</span></template>
<template #cell.locked="{ item }">
<v-tooltip v-if="item.locked" :text="t('user.statusLocked')" location="top">
<template #activator="{ props: tt }"><v-icon v-bind="tt" color="error" size="19">mdi-lock</v-icon></template>
</v-tooltip>
<span v-else class="dash">—</span>
<LjStatus :status="item.locked ? 'error' : 'ok'"
:tooltip="item.locked ? t('user.statusLocked') : t('user.statusActive')" />
</template>
<template #actions="{ item }">
<v-menu location="bottom end">
Expand Down Expand Up @@ -85,7 +83,7 @@ import { useRoute } from 'vue-router'
import { useDataTable, useApi, useAppStore, useErrorStore, useI18nStore } from '@ligoj/host'
import { TYPE_ICONS } from '../composables/delegateTypes.js'
import { useGroupMembersDialog } from '../composables/useGroupMembersDialog.js'
import { VibrantDataTable, VibrantConfirmDialog as LigojConfirmDialog, LjPageHeader, LjButton, LjSearch, LjDialog } from '@ligoj/host'
import { VibrantDataTable, VibrantConfirmDialog as LigojConfirmDialog, LjPageHeader, LjButton, LjSearch, LjDialog, LjStatus } from '@ligoj/host'
import GroupEditPanel from '../components/GroupEditPanel.vue'

const route = useRoute()
Expand Down
9 changes: 3 additions & 6 deletions ui/src/views/UserListView.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,11 +56,8 @@
</span>
</template>
<template #cell.locked="{ item }">
<v-tooltip :text="item.locked ? t('user.statusLocked') : t('user.statusActive')" location="top">
<template #activator="{ props: tt }">
<v-icon v-bind="tt" :color="item.locked ? 'error' : 'success'" size="19">{{ item.locked ? 'mdi-lock' : 'mdi-lock-open-variant' }}</v-icon>
</template>
</v-tooltip>
<LjStatus :status="item.locked ? 'error' : 'ok'"
:tooltip="item.locked ? t('user.statusLocked') : t('user.statusActive')" />
</template>
<template #actions="{ item }">
<v-menu location="bottom end">
Expand Down Expand Up @@ -106,7 +103,7 @@ import { useDataTable, useApi, useAppStore, useErrorStore, useI18nStore } from '
import { TYPE_ICONS } from '../composables/delegateTypes.js'
// Shared 2026 chrome: table, confirm dialog (aliased so <LigojConfirmDialog>
// tags need no change), page header, buttons, search — all from the host.
import { VibrantDataTable, VibrantConfirmDialog as LigojConfirmDialog, LjPageHeader, LjButton, LjSearch } from '@ligoj/host'
import { VibrantDataTable, VibrantConfirmDialog as LigojConfirmDialog, LjPageHeader, LjButton, LjSearch, LjStatus } from '@ligoj/host'
import UserEditDialog from './UserEditDialog.vue'

const appStore = useAppStore()
Expand Down
Loading