updated role detail
This commit is contained in:
parent
60dd477afe
commit
fc575094ee
2 changed files with 158 additions and 110 deletions
|
|
@ -2,7 +2,8 @@ const ListsPageUser = () => import("@/modules/02_users/views/listsUser.vue");
|
|||
const PageManagementRole = () =>
|
||||
import("@/modules/02_users/views/managementRoleUser.vue");
|
||||
const ListsPageRole = () => import("@/modules/02_users/views/listsRole.vue");
|
||||
const ListsRoleDetail = () => import("@/modules/02_users/views/roleDetail.vue");
|
||||
const ListsPage2Role = () =>
|
||||
import("@/modules/02_users/views/permissionDetail.vue");
|
||||
|
||||
export default [
|
||||
{
|
||||
|
|
@ -44,7 +45,7 @@ export default [
|
|||
{
|
||||
path: "/roles/:id",
|
||||
name: "manageRolesId",
|
||||
component: ListsRoleDetail,
|
||||
component: ListsPage2Role,
|
||||
meta: {
|
||||
Auth: true,
|
||||
Key: [7],
|
||||
|
|
|
|||
|
|
@ -1,14 +1,17 @@
|
|||
<script setup>
|
||||
import { id } from "date-fns/locale";
|
||||
import { off } from "process";
|
||||
<script setup lang="ts">
|
||||
import { reactive, ref } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import type { FormRole } from "@/modules/02_users/interface/request/Main";
|
||||
|
||||
const router = useRouter();
|
||||
const formData = reactive<FormRole>({
|
||||
role: "",
|
||||
description: "",
|
||||
});
|
||||
|
||||
const columns = [];
|
||||
const columns = ref<any>([]);
|
||||
|
||||
const systemLists = ref([
|
||||
const systemLists = ref<any>([
|
||||
{
|
||||
key: "SYS_METADATA_KPI",
|
||||
name: "ข้อมูลการประเมิน",
|
||||
|
|
@ -1052,6 +1055,8 @@ const systemLists = ref([
|
|||
],
|
||||
},
|
||||
]);
|
||||
|
||||
function onSubmit() {}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -1069,106 +1074,141 @@ const systemLists = ref([
|
|||
จัดการสิทธิ์บทบาท
|
||||
</div>
|
||||
|
||||
<q-card flast bordered class="">
|
||||
<div class="col-12">
|
||||
<q-table
|
||||
flat
|
||||
bordered
|
||||
:rows="systemLists"
|
||||
:columns="columns"
|
||||
separator="cell"
|
||||
:pagination="{
|
||||
page: 1,
|
||||
rowsPerPage: 100,
|
||||
}"
|
||||
hide-bottom
|
||||
>
|
||||
<template v-slot:header>
|
||||
<q-tr>
|
||||
<q-th rowspan="2" colspan="3" style="font-size: 1rem"
|
||||
>รายการระบบ</q-th
|
||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
||||
<q-card flast bordered class="">
|
||||
<div class="col-12">
|
||||
<q-card>
|
||||
<q-card-section>
|
||||
<div class="row q-col-gutter-md">
|
||||
<div class="col-4">
|
||||
<q-input
|
||||
v-model="formData.role"
|
||||
outlined
|
||||
dense
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อบทบาท'}`,]"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
label="ชื่อบทบาท"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-8">
|
||||
<q-input
|
||||
v-model="formData.description"
|
||||
outlined
|
||||
dense
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกคำอิบาย'}`,]"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
label="คำอิบาย"
|
||||
type="textarea"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<q-table
|
||||
flat
|
||||
bordered
|
||||
:rows="systemLists"
|
||||
:columns="columns"
|
||||
separator="cell"
|
||||
:pagination="{
|
||||
page: 1,
|
||||
rowsPerPage: 100,
|
||||
}"
|
||||
hide-bottom
|
||||
>
|
||||
<template v-slot:header>
|
||||
<q-tr>
|
||||
<q-th rowspan="2" colspan="3" style="font-size: 1rem"
|
||||
>รายการระบบ</q-th
|
||||
>
|
||||
<q-th colspan="2" style="font-size: 1rem"
|
||||
>สิทธิ์การเข้าถึงข้อมูล</q-th
|
||||
>
|
||||
<q-th colspan="5" style="text-align: center; font-size: 1rem"
|
||||
>สิทธิ์การใช้งาน</q-th
|
||||
>
|
||||
</q-tr>
|
||||
<q-tr>
|
||||
<q-th
|
||||
>OWNER<br />
|
||||
เจ้าของระบบ</q-th
|
||||
>
|
||||
<q-th>OFFICER <br />(การเจ้าหน้าที่)</q-th>
|
||||
<q-th>CREATE <br />(มีสิทธิในการสร้างข้อมูล)</q-th>
|
||||
<q-th>LIST<br />(มีสิทธิในการดูรายการข้อมูล)</q-th>
|
||||
<q-th>GET<br />(มีสิทธิในการดูรายละเอียดข้อมูล)</q-th>
|
||||
<q-th>UPDATE<br />(มีสิทธิในการแก้ไขข้อมูล)</q-th>
|
||||
<q-th>DELETE<br />(มีสิทธิในการลบข้อมูล)</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr>
|
||||
<q-td auto-width colspan="3">
|
||||
<q-checkbox v-model="props.row.selected" />
|
||||
<strong>{{ props.row.name }}</strong>
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.owner" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.officer" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.create" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.list" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.get" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.update" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.delete" />
|
||||
</q-td>
|
||||
</q-tr>
|
||||
<q-tr
|
||||
v-if="props.row.selected && props.row.children"
|
||||
v-for="(item, index) in props.row.children"
|
||||
:key="index"
|
||||
>
|
||||
<q-th colspan="2" style="font-size: 1rem"
|
||||
>สิทธิ์การเข้าถึงข้อมูล</q-th
|
||||
>
|
||||
<q-th colspan="5" style="text-align: center; font-size: 1rem"
|
||||
>สิทธิ์การใช้งาน</q-th
|
||||
>
|
||||
</q-tr>
|
||||
<q-tr>
|
||||
<q-th
|
||||
>OWNER<br />
|
||||
เจ้าของระบบ</q-th
|
||||
>
|
||||
<q-th>OFFICER <br />(การเจ้าหน้าที่)</q-th>
|
||||
<q-th>CREATE <br />(มีสิทธิในการสร้างข้อมูล)</q-th>
|
||||
<q-th>LIST<br />(มีสิทธิในการดูรายการข้อมูล)</q-th>
|
||||
<q-th>GET<br />(มีสิทธิในการดูรายละเอียดข้อมูล)</q-th>
|
||||
<q-th>UPDATE<br />(มีสิทธิในการแก้ไขข้อมูล)</q-th>
|
||||
<q-th>DELETE<br />(มีสิทธิในการลบข้อมูล)</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr>
|
||||
<q-td auto-width colspan="3">
|
||||
<q-checkbox v-model="props.row.selected" />
|
||||
<strong>{{ props.row.name }}</strong>
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.owner" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.officer" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.create" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.list" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.get" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.update" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="props.row.delete" />
|
||||
</q-td>
|
||||
</q-tr>
|
||||
<q-tr
|
||||
v-if="props.row.selected && props.row.children"
|
||||
v-for="(item, index) in props.row.children"
|
||||
:key="index"
|
||||
>
|
||||
<q-td></q-td>
|
||||
<q-td auto-width colspan="2">
|
||||
<q-checkbox v-model="item.selected" />
|
||||
{{ item.name }}
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.owner" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.officer" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.create" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.list" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.get" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.update" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.delete" />
|
||||
</q-td>
|
||||
</q-tr>
|
||||
<!-- <q-tr
|
||||
<q-td></q-td>
|
||||
<q-td auto-width colspan="2">
|
||||
<q-checkbox v-model="item.selected" />
|
||||
{{ item.name }}
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.owner" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.officer" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.create" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.list" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.get" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.update" />
|
||||
</q-td>
|
||||
<q-td style="text-align: center">
|
||||
<q-checkbox v-model="item.delete" />
|
||||
</q-td>
|
||||
</q-tr>
|
||||
<!-- <q-tr
|
||||
v-if="item.children"
|
||||
v-for="(item3, index) in item.children"
|
||||
:key="index"
|
||||
|
|
@ -1200,8 +1240,15 @@ const systemLists = ref([
|
|||
<q-checkbox v-model="item3.delete" />
|
||||
</q-td>
|
||||
</q-tr> -->
|
||||
</template>
|
||||
</q-table>
|
||||
</div>
|
||||
</q-card>
|
||||
</template>
|
||||
</q-table>
|
||||
</div>
|
||||
|
||||
<!-- <q-card-actions align="right">
|
||||
<q-btn label="บันทึก" color="secondary" type="submit"
|
||||
><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
|
||||
>
|
||||
</q-card-actions> -->
|
||||
</q-card>
|
||||
</q-form>
|
||||
</template>
|
||||
Loading…
Add table
Add a link
Reference in a new issue