This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-11-22 16:56:40 +07:00
parent 7f3eb5225f
commit 4c35662eed
22 changed files with 632 additions and 343 deletions

View file

@ -193,7 +193,7 @@ watch(
dense
v-model="qurey.searchField"
:options="store.searchFieldOption"
label="เลือกที่ต้องการค้นหา"
label="ค้นหาจาก"
emit-value
map-options
option-label="name"
@ -206,7 +206,7 @@ watch(
outlined
dense
v-model="qurey.searchKeyword"
label="คำค้นหา"
label="คำค้น"
clearable
>
<template v-slot:append v-if="!qurey.searchKeyword">

View file

@ -315,8 +315,8 @@ watch(
</script>
<template>
<q-dialog v-model="modal" persistent full-width>
<q-card>
<q-dialog v-model="modal" persistent>
<q-card style="min-width: 80vw">
<q-form greedy @submit.prevent @validation-success="onSubmit">
<DialogHeader
:tittle="isStatusEdit ? 'แก้ไขผู้ใช้งาน' : 'เพิ่มผู้ใช้งาน'"
@ -324,219 +324,222 @@ watch(
/>
<q-separator />
<q-card-section :horizontal="$q.screen.gt.xs">
<!-- รายช -->
<q-card-section class="col-md-8 col-xs-12">
<div class="row q-col-gutter-sm">
<div class="col-12 col-sm-6 col-md-3">
<q-select
label="ค้นหาจาก"
v-model="searchType"
:options="searchTypeOption"
outlined
emit-value
dense
emit-option
option-label="name"
option-value="id"
map-options
/>
</div>
<div class="col-12 col-sm-6 col-md-9">
<q-input
ref="searchRef"
v-model="keyword"
outlined
clearable
hide-bottom-space
dense
label="คำค้น"
>
<template v-slot:after>
<q-btn
color="primary"
icon="search"
label="ค้นหา"
class="full-width q-py-sm q-px-md"
@click="(query.page = 1), fetchListUser()"
>
</q-btn>
</template>
</q-input>
</div>
</div>
<div class="col-12 q-pt-sm">
<d-table
ref="table"
:columns="columns"
:rows="rows"
row-key="id"
flat
bordered
:paging="true"
dense
:rows-per-page-options="[10, 25, 50, 100]"
selection="single"
v-model:selected="selected"
@update:pagination="updatePagination"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th auto-width></q-th>
<q-th
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td>
<q-checkbox
keep-color
<q-card-section :horizontal="$q.screen.gt.md" style="padding: 0px">
<div class="row col-12 q-gutter-sm">
<!-- รายช -->
<div class="q-pa-md col-md-8 col-xs-12">
<div class="row q-col-gutter-sm">
<div class="col-12 col-sm-6 col-md-3">
<q-select
label="ค้นหาจาก"
v-model="searchType"
:options="searchTypeOption"
outlined
emit-value
dense
emit-option
option-label="name"
option-value="id"
map-options
/>
</div>
<div class="col-12 col-sm-6 col-md-9">
<q-input
ref="searchRef"
v-model="keyword"
outlined
clearable
hide-bottom-space
dense
label="คำค้น"
>
<template v-slot:after>
<q-btn
color="primary"
dense
v-model="props.selected"
/>
</q-td>
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<div>
{{ col.value ? col.value : "-" }}
</div>
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
งหมด {{ total }} รายการ
<q-pagination
v-model="query.page"
active-color="primary"
color="dark"
:max="Number(maxPage)"
size="sm"
boundary-links
direction-links
:max-pages="5"
@update:model-value="fetchListUser"
></q-pagination>
</template>
</d-table>
</div>
</q-card-section>
<q-separator vertical />
<!-- input -->
<q-card-section class="col-md-4 col-xs-12">
<div class="row q-col-gutter-md">
<div class="col-12">
<q-input
v-model="formData.username"
outlined
dense
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อผู้ใช้งาน'}`,]"
lazy-rules
hide-bottom-space
class="inputgreen"
label="ชื่อผู้ใช้งาน"
readonly
>
</q-input>
icon="search"
label="ค้นหา"
class="full-width q-py-sm q-px-md"
@click="(query.page = 1), fetchListUser()"
>
</q-btn>
</template>
</q-input>
</div>
</div>
<div class="col-12" v-if="!isStatusEdit">
<q-input
v-model="formData.password"
outlined
<div class="col-12 q-pt-sm">
<d-table
ref="table"
:columns="columns"
:rows="rows"
row-key="id"
flat
bordered
:paging="true"
dense
:type="isPwd ? 'password' : 'text'"
:rules="[(val:string) => !!val || `${'กรุณากรอกรหัสผู้ใช้งาน'}`,]"
lazy-rules
label="รหัสผู้ใช้งาน"
hide-bottom-space
class="inputgreen"
:rows-per-page-options="[10, 25, 50, 100]"
selection="single"
v-model:selected="selected"
@update:pagination="updatePagination"
>
<template v-slot:append>
<q-icon
:name="isPwd ? 'visibility_off' : 'visibility'"
class="cursor-pointer"
@click="isPwd = !isPwd"
/>
<template v-slot:header="props">
<q-tr :props="props">
<q-th auto-width></q-th>
<q-th
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
</q-tr>
</template>
</q-input>
</div>
<div class="col-12">
<q-input
v-model="formData.firstName"
outlined
dense
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อ'}`,]"
lazy-rules
hide-bottom-space
class="inputgreen"
label="ชื่อ"
readonly
>
</q-input>
</div>
<div class="col-12">
<q-input
v-model="formData.lastName"
outlined
dense
:rules="[(val:string) => !!val || `${'กรุณากรอกนามสกุล'}`,]"
lazy-rules
hide-bottom-space
class="inputgreen"
label="นามสกุล"
readonly
>
</q-input>
</div>
<div class="col-12">
<q-input
v-model="formData.email"
outlined
dense
:rules="[(val:string) => !!val || `${'กรุณากรอก Email'}`,]"
lazy-rules
hide-bottom-space
class="inputgreen"
label="Email"
type="email"
>
</q-input>
</div>
<div class="col-12" v-if="!isStatusEdit">
<q-select
v-model="roles"
outlined
label="role"
dense
option-label="name"
option-value="id"
:options="roleOptions"
class="inputgreen"
map-options
hide-bottom-space
lazy-rules
use-chips
multiple
use-input
:rules="[(val:string) => !!val && val.length > 0|| `${'กรุณาเลือก Role'}`,]"
/>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td>
<q-checkbox
keep-color
color="primary"
dense
v-model="props.selected"
/>
</q-td>
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<div>
{{ col.value ? col.value : "-" }}
</div>
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
งหมด {{ total }} รายการ
<q-pagination
v-model="query.page"
active-color="primary"
color="dark"
:max="Number(maxPage)"
size="sm"
boundary-links
direction-links
:max-pages="5"
@update:model-value="fetchListUser"
></q-pagination>
</template>
</d-table>
</div>
</div>
</q-card-section>
<q-separator vertical />
<!-- input -->
<div class="q-pa-md col">
<div class="row q-col-gutter-md">
<div class="col-12">
<q-input
v-model="formData.username"
outlined
dense
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อผู้ใช้งาน'}`,]"
lazy-rules
hide-bottom-space
class="inputgreen"
label="ชื่อผู้ใช้งาน"
readonly
>
</q-input>
</div>
<div class="col-12" v-if="!isStatusEdit">
<q-input
v-model="formData.password"
outlined
dense
:type="isPwd ? 'password' : 'text'"
:rules="[(val:string) => !!val || `${'กรุณากรอกรหัสผู้ใช้งาน'}`,]"
lazy-rules
label="รหัสผู้ใช้งาน"
hide-bottom-space
class="inputgreen"
>
<template v-slot:append>
<q-icon
:name="isPwd ? 'visibility_off' : 'visibility'"
class="cursor-pointer"
@click="isPwd = !isPwd"
/>
</template>
</q-input>
</div>
<div class="col-12">
<q-input
v-model="formData.firstName"
outlined
dense
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อ'}`,]"
lazy-rules
hide-bottom-space
class="inputgreen"
label="ชื่อ"
readonly
>
</q-input>
</div>
<div class="col-12">
<q-input
v-model="formData.lastName"
outlined
dense
:rules="[(val:string) => !!val || `${'กรุณากรอกนามสกุล'}`,]"
lazy-rules
hide-bottom-space
class="inputgreen"
label="นามสกุล"
readonly
>
</q-input>
</div>
<div class="col-12">
<q-input
v-model="formData.email"
outlined
dense
:rules="[(val:string) => !!val || `${'กรุณากรอก อีเมล'}`,]"
lazy-rules
hide-bottom-space
class="inputgreen"
label="อีเมล"
type="email"
>
</q-input>
</div>
<div class="col-12" v-if="!isStatusEdit">
<q-select
v-model="roles"
outlined
label="role"
dense
option-label="name"
option-value="id"
:options="roleOptions"
class="inputgreen"
map-options
hide-bottom-space
lazy-rules
use-chips
multiple
use-input
:rules="[(val:string) => !!val && val.length > 0|| `${'กรุณาเลือก Role'}`,]"
/>
</div>
</div>
</div>
</div>
</q-card-section>
<q-separator />

View file

@ -62,7 +62,7 @@ const columns = ref<QTableProps["columns"]>([
{
name: "email",
align: "left",
label: "Email",
label: "อีเมล",
sortable: true,
field: "email",
headerStyle: "font-size: 14px",

View file

@ -6,6 +6,7 @@ import http from "@/plugins/http";
import config from "@/app.config";
import { usePermissionsStore } from "@/modules/02_users/stores/permissions";
import { useCounterMixin } from "@/stores/mixin";
import { tokenParsed } from "@/plugins/auth";
/** importType*/
import type { QTableProps } from "quasar";
@ -69,6 +70,15 @@ const expanded = ref<string[]>([]); // แสดงข้อมูลในโ
const nodeId = ref<string>(""); // id
/** Table*/
const visibleColumns = ref<string[]>([
"no",
"posMasterNo",
"positionName",
"posTypeName",
"posLevelName",
"positionIsSelected",
"authRoleName",
]);
const columns = ref<QTableProps["columns"]>([
{
name: "no",
@ -277,6 +287,11 @@ async function fetchOrganizationActive() {
* @param id id โครงสราง
*/
async function fetchDataTree(id: string) {
const tokenParsedData = await tokenParsed();
const isSuperAdmin = tokenParsedData.role.includes("SUPER_ADMIN");
if (!isSuperAdmin) {
nodes.value = [];
}
showLoader();
await http
.get(config.API.orgByid(id.toString()))
@ -284,6 +299,7 @@ async function fetchDataTree(id: string) {
const data = await res.data.result;
nodes.value.push(...data);
nodes.value[0].orgRevisionId = id;
nodeId.value = nodes.value[0].orgTreeId;
await fetchDataTable(reqMaster.id, id, reqMaster.type);
})
.catch((err) => {
@ -622,6 +638,22 @@ onMounted(() => {
</template>
</q-input>
</div>
<div>
<q-select
v-model="visibleColumns"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columns"
option-value="name"
style="min-width: 140px"
/>
</div>
</div>
</q-toolbar>
<d-table
@ -636,6 +668,7 @@ onMounted(() => {
:rows-per-page-options="[10, 25, 50, 100]"
@update:pagination="updatePagination"
v-model:pagination="pagination"
:visible-columns="visibleColumns"
>
<template v-slot:header="props">
<q-tr :props="props">

View file

@ -6,6 +6,7 @@ import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { useDataStoreUser } from "@/modules/02_users/stores/main";
import { tokenParsed } from "@/plugins/auth";
import type { QTableProps } from "quasar";
import type {
@ -59,6 +60,12 @@ const personId = ref<string>("");
* เกบขอมลโครงสรางไวใน nodeTree
*/
async function fatchOrg() {
const tokenParsedData = await tokenParsed();
const isSuperAdmin = tokenParsedData.role.includes("SUPER_ADMIN");
if (!isSuperAdmin) {
nodeTree.value = [];
}
showLoader();
await http
.get(config.API.permissionOrg)
@ -127,6 +134,7 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
]);
const visibleColumns = ref<string[]>(["fullName", "orgNew"]);
const modalAdd = ref<boolean>(false); // modal
/**
@ -363,6 +371,23 @@ onMounted(async () => {
</div>
</div>
<div class="row col-12 q-mt-sm">
<q-space />
<q-select
v-model="visibleColumns"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columns"
option-value="name"
style="min-width: 140px"
/>
</div>
<div class="col-12 q-mt-sm">
<d-table
:columns="columns"
@ -374,6 +399,7 @@ onMounted(async () => {
dense
:rows-per-page-options="[10, 25, 50, 100]"
@update:pagination="updatePagination"
:visible-columns="visibleColumns"
>
<template v-slot:header="props">
<q-tr :props="props">

View file

@ -5,6 +5,7 @@ import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { tokenParsed } from "@/plugins/auth";
/** importType*/
import type { QTableProps } from "quasar";
@ -66,6 +67,15 @@ const nodeId = ref<string>(""); // id โหนด
const isOfficer = ref<boolean>(false); // columns .
/** Table*/
const visibleColumns = ref<string[]>([
"no",
"posMasterNo",
"positionName",
"posTypeName",
"posLevelName",
"positionIsSelected",
"isPosMasterAssign",
]);
const columns = ref<QTableProps["columns"]>([
{
name: "no",
@ -260,6 +270,11 @@ async function fetchOrganizationActive() {
* @param id id โครงสราง
*/
async function fetchDataTree(id: string) {
const tokenParsedData = await tokenParsed();
const isSuperAdmin = tokenParsedData.role.includes("SUPER_ADMIN");
if (!isSuperAdmin) {
nodes.value = [];
}
showLoader();
await http
.get(config.API.orgByid(id.toString()))
@ -267,6 +282,7 @@ async function fetchDataTree(id: string) {
const data = await res.data.result;
nodes.value.push(...data);
nodes.value[0].orgRevisionId = id;
nodeId.value = nodes.value[0].orgTreeId;
await fetchDataTable(reqMaster.id, id, reqMaster.type);
})
.catch((err) => {
@ -553,6 +569,22 @@ onMounted(() => {
</template>
</q-input>
</div>
<div>
<q-select
v-model="visibleColumns"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columns"
option-value="name"
style="min-width: 140px"
/>
</div>
</div>
</q-toolbar>
<d-table
@ -567,6 +599,7 @@ onMounted(() => {
:rows-per-page-options="[10, 25, 50, 100]"
@update:pagination="updatePagination"
v-model:pagination="pagination"
:visible-columns="visibleColumns"
>
<template v-slot:header="props">
<q-tr :props="props">
@ -744,7 +777,7 @@ onMounted(() => {
</div>
<div v-else class="text-body2">
{{ col.value }}
{{ col.value ?? "-" }}
</div>
</q-td>
</q-tr>

View file

@ -143,7 +143,7 @@ onMounted(async () => {
<q-card flast bordered class="q-pa-md">
<div class="items-center col-12 row q-col-gutter-sm q-mb-sm">
<q-btn flat round dense color="primary" icon="add" @click="openDialog">
<q-tooltip>เพ Role </q-tooltip>
<q-tooltip>เพทธ </q-tooltip>
</q-btn>
<q-space />