66 lines
1.5 KiB
Vue
66 lines
1.5 KiB
Vue
|
<template>
|
||
|
<div>
|
||
|
<MkStickyContainer>
|
||
|
<template #header><XHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||
|
<MkSpacer :content-max="600">
|
||
|
<XEditor :role="role" @created="created" @updated="updated"/>
|
||
|
</MkSpacer>
|
||
|
</MkStickyContainer>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script lang="ts" setup>
|
||
|
import { computed } from 'vue';
|
||
|
import XHeader from './_header_.vue';
|
||
|
import XEditor from './roles.editor.vue';
|
||
|
import MkInput from '@/components/MkInput.vue';
|
||
|
import MkSelect from '@/components/MkSelect.vue';
|
||
|
import MkTextarea from '@/components/MkTextarea.vue';
|
||
|
import MkFolder from '@/components/MkFolder.vue';
|
||
|
import MkSwitch from '@/components/MkSwitch.vue';
|
||
|
import MkButton from '@/components/MkButton.vue';
|
||
|
import FormSlot from '@/components/form/slot.vue';
|
||
|
import * as os from '@/os';
|
||
|
import { i18n } from '@/i18n';
|
||
|
import { definePageMetadata } from '@/scripts/page-metadata';
|
||
|
import { useRouter } from '@/router';
|
||
|
|
||
|
const router = useRouter();
|
||
|
|
||
|
const props = defineProps<{
|
||
|
id?: string;
|
||
|
}>();
|
||
|
|
||
|
let role = $ref(null);
|
||
|
|
||
|
if (props.id) {
|
||
|
role = await os.api('admin/roles/show', {
|
||
|
roleId: props.id,
|
||
|
});
|
||
|
}
|
||
|
|
||
|
function created(r) {
|
||
|
router.push('/admin/roles/' + r.id);
|
||
|
}
|
||
|
|
||
|
function updated() {
|
||
|
router.push('/admin/roles/' + role.id);
|
||
|
}
|
||
|
|
||
|
const headerActions = $computed(() => []);
|
||
|
|
||
|
const headerTabs = $computed(() => []);
|
||
|
|
||
|
definePageMetadata(computed(() => role ? {
|
||
|
title: i18n.ts._role.edit + ': ' + role.name,
|
||
|
icon: 'ti ti-badge',
|
||
|
} : {
|
||
|
title: i18n.ts._role.new,
|
||
|
icon: 'ti ti-badge',
|
||
|
}));
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss" module>
|
||
|
|
||
|
</style>
|