fix : style des champs dans l'audit-log
This commit is contained in:
@@ -9,7 +9,8 @@
|
|||||||
<!-- Filtres -->
|
<!-- Filtres -->
|
||||||
<section class="mt-4 rounded border border-gray-200 bg-white p-4">
|
<section class="mt-4 rounded border border-gray-200 bg-white p-4">
|
||||||
<!-- Labels uniformes au-dessus : les composants Malio sont utilises sans
|
<!-- Labels uniformes au-dessus : les composants Malio sont utilises sans
|
||||||
leur `label` flottant interne pour ne pas mixer deux patterns de label. -->
|
leur `label` flottant interne pour ne pas mixer deux patterns de label.
|
||||||
|
A revoir une fois le composant calendar Malio développé -->
|
||||||
<div class="grid grid-cols-1 items-start gap-3 md:grid-cols-5">
|
<div class="grid grid-cols-1 items-start gap-3 md:grid-cols-5">
|
||||||
<!-- TODO(malio-ui): remplacer par un composant Malio quand la lib
|
<!-- TODO(malio-ui): remplacer par un composant Malio quand la lib
|
||||||
exposera un datetime picker. Cf. exception documentee dans
|
exposera un datetime picker. Cf. exception documentee dans
|
||||||
@@ -59,26 +60,20 @@
|
|||||||
v-model="performedByInput"
|
v-model="performedByInput"
|
||||||
icon-name="mdi:account-search"
|
icon-name="mdi:account-search"
|
||||||
input-class="text-sm"
|
input-class="text-sm"
|
||||||
group-class="h-10"
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<!-- TODO(malio-ui): remplacer par MalioSelect quand la lib
|
|
||||||
supportera de maniere fiable des options a valeur string
|
|
||||||
(cf. note Lesstime CLAUDE.md). Exception documentee dans
|
|
||||||
CLAUDE.md (section "Composants formulaires"). -->
|
|
||||||
<div>
|
<div>
|
||||||
<label class="mb-1 block text-xs font-medium text-gray-600">
|
<label class="mb-1 block text-xs font-medium text-gray-600">
|
||||||
{{ t('audit.filters.action') }}
|
{{ t('audit.filters.action') }}
|
||||||
</label>
|
</label>
|
||||||
<select
|
<div class="[&>div>div]:!mt-0">
|
||||||
v-model="actionValue"
|
<MalioSelect
|
||||||
class="h-[40px] w-full rounded-md border border-m-muted bg-white px-3 text-sm outline-none focus-visible:border-2 focus-visible:border-m-primary"
|
v-model="actionValue"
|
||||||
>
|
:options="actionOptions"
|
||||||
<option value="">{{ t('audit.filters.all_actions') }}</option>
|
text-field="text-sm"
|
||||||
<option v-for="opt in actionOptions" :key="opt.value" :value="opt.value">
|
text-value="text-sm"
|
||||||
{{ opt.label }}
|
/>
|
||||||
</option>
|
</div>
|
||||||
</select>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -204,11 +199,14 @@ const entityTypeOptions = computed(() =>
|
|||||||
// pas binder directement un `string | undefined` reactive.
|
// pas binder directement un `string | undefined` reactive.
|
||||||
const performedByInput = ref<string>('')
|
const performedByInput = ref<string>('')
|
||||||
|
|
||||||
// Action : MalioSelect ne gere pas fiablement des options a valeur string (cf.
|
// Action : '' = "toutes les actions". On declare l'option dans `actionOptions`
|
||||||
// note Lesstime CLAUDE.md). On utilise un `<select>` natif stylise comme les
|
// plutot que via `emptyOptionLabel` (qui n'inclut pas l'option vide dans
|
||||||
// inputs dates pour garder un look coherent. '' = "toutes les actions".
|
// `props.options`, donc `selectedLabel` reste vide). On evite aussi `value: null`
|
||||||
|
// car MalioSelect grise visuellement les options dont la valeur est `null`
|
||||||
|
// (Select.vue:137) — on utilise donc une chaine vide comme sentinelle.
|
||||||
const actionValue = ref<string>('')
|
const actionValue = ref<string>('')
|
||||||
const actionOptions = [
|
const actionOptions = [
|
||||||
|
{ value: '', label: t('audit.filters.all_actions') },
|
||||||
{ value: 'create', label: t('audit.action.create') },
|
{ value: 'create', label: t('audit.action.create') },
|
||||||
{ value: 'update', label: t('audit.action.update') },
|
{ value: 'update', label: t('audit.action.update') },
|
||||||
{ value: 'delete', label: t('audit.action.delete') },
|
{ value: 'delete', label: t('audit.action.delete') },
|
||||||
@@ -378,7 +376,7 @@ watch(selectedEntityTypes, values => {
|
|||||||
loadEntries()
|
loadEntries()
|
||||||
})
|
})
|
||||||
|
|
||||||
// Sync select action natif -> filters.action.
|
// Sync MalioSelect action -> filters.action.
|
||||||
watch(actionValue, value => {
|
watch(actionValue, value => {
|
||||||
if (watchersSuspended) return
|
if (watchersSuspended) return
|
||||||
filters.action = value === '' ? undefined : value
|
filters.action = value === '' ? undefined : value
|
||||||
|
|||||||
Reference in New Issue
Block a user