Skip to content

Commit 4fc213d

Browse files
tacxoutacxou
committed
feat: update role access labels to French and enhance modal button integration across components
1 parent b3d23ba commit 4fc213d

File tree

9 files changed

+157
-76
lines changed

9 files changed

+157
-76
lines changed

‎apps/web/src/composables/useModalButtons.ts‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
export const useModalButtons = () => {
2+
const cancelButton = ref({
3+
color: 'negative',
4+
label: 'Annuler',
5+
push: true,
6+
})
7+
8+
const saveButton = ref({
9+
color: 'positive',
10+
label: 'Enregistrer',
11+
push: true,
12+
})
13+
14+
const cancelDeleteButton = ref({
15+
color: 'positive',
16+
label: 'Annuler',
17+
push: true,
18+
})
19+
20+
const deleteButton = ref({
21+
color: 'negative',
22+
label: 'Supprimer',
23+
push: true,
24+
})
25+
26+
const confirmButton = ref({
27+
color: 'orange-8',
28+
label: 'Ok !',
29+
push: true,
30+
})
31+
32+
return {
33+
cancelButton,
34+
saveButton,
35+
cancelDeleteButton,
36+
deleteButton,
37+
confirmButton,
38+
}
39+
}

‎apps/web/src/composables/useRolesSchema.ts‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@ export const AC_ACTIONS = [
66
]
77

88
export const AC_ACTION_SUGGESTIONS = [
9-
{ label: "R", value: ["read"] },
10-
{ label: "R/W", value: ["read", "create", "update"] },
11-
{ label: "R/W/D", value: ["read", "create", "update", "delete"] },
9+
{ label: "Lecture", value: ["read"] },
10+
{ label: "Lecture/Écriture", value: ["read", "create", "update"] },
11+
{ label: "Lecture/Écriture/Suppression", value: ["read", "create", "update", "delete"] },
1212
]
1313

1414
export default function useRolesSchema() {
@@ -30,7 +30,7 @@ export default function useRolesSchema() {
3030
},
3131
"access": {
3232
"type": "array",
33-
"description": "Permissions",
33+
"description": "Accès aux ressources",
3434
"items": {
3535
"type": "object",
3636
"properties": {
@@ -90,7 +90,7 @@ export default function useRolesSchema() {
9090
"elements": [
9191
{
9292
"type": "Control",
93-
"label": "Access",
93+
"label": "Accès aux ressources",
9494
"scope": "#/properties/access",
9595
"options": {
9696
"format": "array-table",

‎apps/web/src/jsonforms/composables/controls/useArrayTableControl.ts‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,9 @@ export const useArrayTableControl = ({
5353
}: UseArrayTableControlOptions) => {
5454
const control = useQuasarControl(jsonFormsControl, (v) => v ?? clearValue, debounceWait)
5555
const { $http } = useNuxtApp()
56+
const $q = useQuasar()
57+
58+
const { cancelButton, saveButton, cancelDeleteButton, deleteButton, confirmButton } = useModalButtons()
5659

5760
const rows = computed<Record<string, any>[]>(() => {
5861
const value = control.control.value.data
@@ -205,8 +208,17 @@ export const useArrayTableControl = ({
205208
}
206209

207210
const removeRow = (index: number) => {
208-
const nextRows = rows.value.filter((_, rowIndex) => rowIndex !== index)
209-
control.onChange(nextRows)
211+
$q.dialog({
212+
title: 'Supprimer l\'élément',
213+
message: 'Êtes-vous sûr de vouloir supprimer cet élément ?',
214+
persistent: true,
215+
ok: deleteButton.value,
216+
cancel: cancelDeleteButton.value,
217+
})
218+
.onOk(() => {
219+
const nextRows = rows.value.filter((_, rowIndex) => rowIndex !== index)
220+
control.onChange(nextRows)
221+
})
210222
}
211223

212224
const formatCellValue = (value: unknown): string => {

‎apps/web/src/jsonforms/controls/acl.vue‎

Lines changed: 59 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,64 @@
11
<template lang="pug">
2-
control-wrapper(
3-
v-bind="controlWrapper"
4-
:styles="styles"
5-
:is-focused="isFocused"
6-
:applied-options="appliedOptions"
7-
v-model:is-hovered="isHovered"
8-
)
9-
q-select(
10-
:model-value="selectedKey"
11-
:label="computedLabel"
12-
:options="normalizedOptions"
13-
:placeholder="appliedOptions.placeholder"
14-
:disable="!control.enabled && !isReadonly"
15-
:readonly="isReadonly"
16-
clear-icon="mdi-close"
17-
:required="control.required"
18-
:hint="control.description"
19-
:hide-hint="persistentHint()"
20-
:error="control.errors !== ''"
21-
:error-message="control.errors"
22-
:clearable="isClearable"
23-
option-label="label"
24-
option-value="key"
25-
emit-value
26-
map-options
27-
outlined
28-
stack-label
29-
dense
30-
@focus="isFocused = true"
31-
@blur="isFocused = false"
32-
@update:model-value="onUpdate"
33-
v-bind="quasarProps('q-select')"
2+
control-wrapper(
3+
v-bind="controlWrapper"
4+
:styles="styles"
5+
:is-focused="isFocused"
6+
:applied-options="appliedOptions"
7+
v-model:is-hovered="isHovered"
348
)
9+
q-select(
10+
:model-value="selectedKey"
11+
:label="computedLabel"
12+
:options="normalizedOptions"
13+
:placeholder="appliedOptions.placeholder"
14+
:disable="!control.enabled && !isReadonly"
15+
:readonly="isReadonly"
16+
clear-icon="mdi-close"
17+
:required="control.required"
18+
:hint="control.description"
19+
:hide-hint="persistentHint()"
20+
:error="control.errors !== ''"
21+
:error-message="control.errors"
22+
:clearable="isClearable"
23+
option-label="label"
24+
option-value="key"
25+
emit-value
26+
map-options
27+
outlined
28+
stack-label
29+
dense
30+
@focus="isFocused = true"
31+
@blur="isFocused = false"
32+
@update:model-value="onUpdate"
33+
v-bind="quasarProps('q-select')"
34+
)
35+
template(#before v-if="appliedOptions?.addons?.before && appliedOptions.addons.before.length")
36+
field-addons(
37+
position="before"
38+
:items="appliedOptions.addons.before"
39+
:control-id="control.id"
40+
)
41+
template(#prepend)
42+
field-addons(
43+
v-if="appliedOptions?.addons?.prepend && appliedOptions.addons.prepend.length"
44+
position="prepend"
45+
:items="appliedOptions.addons.prepend"
46+
:control-id="control.id"
47+
)
48+
template(#append)
49+
field-addons(
50+
v-if="appliedOptions?.addons?.append && appliedOptions.addons.append.length"
51+
position="append"
52+
:items="appliedOptions.addons.append"
53+
:control-id="control.id"
54+
)
55+
template(#after)
56+
field-addons(
57+
v-if="appliedOptions?.addons?.after && appliedOptions.addons.after.length"
58+
position="after"
59+
:items="appliedOptions.addons.after"
60+
:control-id="control.id"
61+
)
3562
</template>
3663

3764
<script lang="ts">

‎apps/web/src/jsonforms/controls/enum-and-suggestion.vue‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -44,9 +44,8 @@
4444
dense
4545
v-bind="quasarProps('q-select')"
4646
)
47-
template(#before)
47+
template(#before v-if="appliedOptions?.addons?.before && appliedOptions.addons.before.length")
4848
field-addons(
49-
v-if="appliedOptions?.addons?.before && appliedOptions.addons.before.length"
5049
position="before"
5150
:items="appliedOptions.addons.before"
5251
:control-id="control.id"

‎apps/web/src/jsonforms/controls/input.vue‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -36,9 +36,8 @@
3636

3737
v-bind="quasarProps('q-input')"
3838
)
39-
template(#before)
39+
template(#before v-if="appliedOptions?.addons?.before && appliedOptions.addons.before.length")
4040
field-addons(
41-
v-if="appliedOptions?.addons?.before && appliedOptions.addons.before.length"
4241
position="before"
4342
:items="appliedOptions.addons.before"
4443
:control-id="control.id"

‎apps/web/src/jsonforms/layouts/array-table.vue‎

Lines changed: 33 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -6,21 +6,25 @@
66
:applied-options="appliedOptions"
77
v-model:is-hovered="isHovered"
88
)
9-
.q-mb-sm
10-
q-btn(
11-
label="Ajouter"
12-
icon="mdi-plus"
13-
color="primary"
14-
unelevated
15-
dense
16-
:disable="!canEdit"
17-
@click="openCreateDialog"
18-
)
9+
q-card(bordered flat square)
10+
q-card-section.q-pa-none.q-ma-none
11+
q-toolbar(bordered dense flat style="height: 32px; line-height: 32px;")
12+
q-toolbar-title {{ controlWrapper.label }}
13+
q-btn(
14+
icon="mdi-plus"
15+
unelevated
16+
dense
17+
round
18+
flat
19+
:disable="!canEdit"
20+
@click="openCreateDialog"
21+
)
1922

2023
q-table(
21-
flat
2224
bordered
2325
dense
26+
square
27+
flat
2428
:rows="tableRows"
2529
:columns="tableColumns"
2630
row-key="__rowIndex"
@@ -36,6 +40,7 @@
3640
flat
3741
dense
3842
round
43+
size="sm"
3944
:disable="!canEdit"
4045
@click="openEditByIndex(props.row.__rowIndex)"
4146
)
@@ -45,6 +50,7 @@
4550
flat
4651
dense
4752
round
53+
size="sm"
4854
:disable="!canEdit"
4955
@click="removeRow(props.row.__rowIndex)"
5056
)
@@ -55,10 +61,10 @@
5561

5662
q-dialog(v-model="dialogOpen" persistent)
5763
q-card(style="min-width: 560px; max-width: 90vw;")
58-
q-card-section
59-
.text-h6 {{ editedIndex === null ? 'Ajouter un élément' : "Modifier l'élément" }}
64+
q-toolbar.bg-primary.text-white(bordered dense flat style="height: 32px; line-height: 32px;")
65+
q-toolbar-title {{ editedIndex === null ? 'Ajouter un élément' : "Modifier l'élément" }}
6066

61-
q-card-section
67+
q-card-section.q-mt-sm
6268
.column.q-gutter-sm
6369
json-forms(
6470
:data="editedRow"
@@ -70,11 +76,15 @@
7076
)
7177

7278
q-card-actions(align="right")
73-
q-btn(flat label="Annuler" @click="closeDialog")
79+
q-space
7480
q-btn(
75-
color="primary"
76-
unelevated
77-
label="Enregistrer"
81+
v-bind="cancelButton"
82+
@click="closeDialog"
83+
)
84+
q-btn(
85+
color="positive"
86+
push
87+
:label="editedIndex === null ? 'Ajouter' : 'Enregistrer'"
7888
:disable="!canEdit"
7989
@click="saveRow"
8090
)
@@ -85,7 +95,7 @@ import { type ControlElement } from '@jsonforms/core'
8595
import { defineComponent, computed } from 'vue'
8696
import { JsonForms, rendererProps, useJsonFormsControl, type RendererProps } from '@jsonforms/vue'
8797
import { QBtn, QCard, QCardActions, QCardSection, QDialog, QTable, QTd } from 'quasar'
88-
import { ControlWrapper } from '../common'
98+
import { ControlWrapper, FieldAddons } from '../common'
8999
import { determineClearValue } from '../utils'
90100
import { useArrayTableControl, type ArrayTableField } from '../composables'
91101
@@ -100,6 +110,7 @@ const controlRenderer = defineComponent({
100110
QCard,
101111
QCardSection,
102112
QCardActions,
113+
FieldAddons,
103114
JsonForms,
104115
},
105116
props: {
@@ -108,6 +119,7 @@ const controlRenderer = defineComponent({
108119
setup(props: RendererProps<ControlElement>) {
109120
const jsonFormsControl = useJsonFormsControl(props)
110121
const clearValue = determineClearValue([])
122+
const { cancelButton, saveButton } = useModalButtons()
111123
const api = useArrayTableControl({
112124
jsonFormsControl,
113125
clearValue,
@@ -181,6 +193,8 @@ const controlRenderer = defineComponent({
181193
tableColumns,
182194
openEditByIndex,
183195
dialogSchema,
196+
cancelButton,
197+
saveButton,
184198
dialogUiSchema,
185199
dialogRenderers,
186200
onDialogChange,

‎apps/web/src/pages/identities/table.vue‎

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -417,21 +417,14 @@ export default defineNuxtComponent({
417417
},
418418
419419
async deleteIdentity(identity: Record<string, any>) {
420+
const { deleteButton, cancelDeleteButton } = useModalButtons()
420421
this.$q
421422
.dialog({
422423
title: 'Confirmation',
423424
message: 'Voulez-vous vraiment supprimer cette identité ?',
424425
persistent: true,
425-
ok: {
426-
push: true,
427-
color: 'positive',
428-
label: 'Supprimer',
429-
},
430-
cancel: {
431-
push: true,
432-
color: 'negative',
433-
label: 'Annuler',
434-
},
426+
ok: deleteButton.value,
427+
cancel: cancelDeleteButton.value,
435428
})
436429
.onOk(() => {
437430
this.$http

‎apps/web/src/pages/identities/table/[_id]/index.vue‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -384,6 +384,7 @@ export default defineNuxtComponent({
384384
})
385385
},
386386
async switchAccountStatus() {
387+
const { confirmButton } = useModalButtons()
387388
if (!this.hasPermission('/management/identities', 'update')) {
388389
return
389390
}
@@ -411,10 +412,7 @@ export default defineNuxtComponent({
411412
title: 'Information',
412413
message: "L'identité n'a jamais été synchronisée. Impossible de changer le statut.",
413414
persistent: true,
414-
ok: {
415-
color: 'warning',
416-
label: 'OK !',
417-
},
415+
ok: confirmButton.value,
418416
})
419417
return
420418
}

0 commit comments

Comments
 (0)