134 lines
3.0 KiB
Vue
134 lines
3.0 KiB
Vue
<template>
|
|
<modal-form
|
|
ref="$modal"
|
|
:loading="loading"
|
|
:title="langTitle"
|
|
:error="error"
|
|
:disable-save-button="v$.$invalid"
|
|
@submit="doSubmit"
|
|
@hidden="clearContents"
|
|
>
|
|
<b-tabs
|
|
content-class="mt-3"
|
|
pills
|
|
>
|
|
<admin-permissions-global-form
|
|
:form="v$"
|
|
:global-permissions="globalPermissions"
|
|
/>
|
|
|
|
<admin-permissions-station-form
|
|
:form="v$"
|
|
:stations="stations"
|
|
:station-permissions="stationPermissions"
|
|
/>
|
|
</b-tabs>
|
|
</modal-form>
|
|
</template>
|
|
|
|
<script setup>
|
|
import ModalForm from "~/components/Common/ModalForm.vue";
|
|
import {computed, ref} from "vue";
|
|
import {baseEditModalProps, useBaseEditModal} from "~/functions/useBaseEditModal";
|
|
import {useTranslate} from "~/vendor/gettext";
|
|
import {required} from '@vuelidate/validators';
|
|
import AdminPermissionsGlobalForm from "./Form/GlobalForm";
|
|
import AdminPermissionsStationForm from "./Form/StationForm";
|
|
import {forEach, map} from 'lodash';
|
|
|
|
const props = defineProps({
|
|
...baseEditModalProps,
|
|
stations: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
globalPermissions: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
stationPermissions: {
|
|
type: Object,
|
|
required: true
|
|
}
|
|
});
|
|
|
|
const emit = defineEmits(['relist']);
|
|
|
|
const $modal = ref(); // Template Ref
|
|
|
|
const {
|
|
loading,
|
|
error,
|
|
isEditMode,
|
|
v$,
|
|
clearContents,
|
|
create,
|
|
edit,
|
|
doSubmit,
|
|
close
|
|
} = useBaseEditModal(
|
|
props,
|
|
emit,
|
|
$modal,
|
|
{
|
|
'name': {required},
|
|
'permissions': {
|
|
'global': {},
|
|
'station': {},
|
|
}
|
|
},
|
|
{
|
|
'name': '',
|
|
'permissions': {
|
|
'global': [],
|
|
'station': [],
|
|
}
|
|
},
|
|
{
|
|
populateForm(data, formRef) {
|
|
formRef.value = {
|
|
name: data.name,
|
|
permissions: {
|
|
global: data.permissions.global,
|
|
station: map(data.permissions.station, (permissions, stationId) => {
|
|
return {
|
|
'station_id': stationId,
|
|
'permissions': permissions
|
|
};
|
|
})
|
|
}
|
|
};
|
|
},
|
|
getSubmittableFormData(formValue) {
|
|
let form = {
|
|
name: formValue.name,
|
|
permissions: {
|
|
global: formValue.permissions.global,
|
|
station: {}
|
|
}
|
|
};
|
|
|
|
forEach(formValue.permissions.station, (row) => {
|
|
form.permissions.station[row.station_id] = row.permissions;
|
|
});
|
|
|
|
return form;
|
|
},
|
|
}
|
|
);
|
|
|
|
const {$gettext} = useTranslate();
|
|
|
|
const langTitle = computed(() => {
|
|
return isEditMode.value
|
|
? $gettext('Edit Role')
|
|
: $gettext('Add Role');
|
|
});
|
|
|
|
defineExpose({
|
|
create,
|
|
edit,
|
|
close
|
|
});
|
|
</script>
|