บรรจุ แต่งตั้ง ===> ปรับ ui
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490
parent
38120c26ad
commit
cd3ceaae97
18 changed files with 476 additions and 523 deletions
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, watchEffect,computed } from "vue";
|
||||
import { ref, watchEffect, computed } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
|
@ -171,140 +171,147 @@ watchEffect(() => {
|
|||
<template>
|
||||
<q-dialog v-model="props.modal" persistent>
|
||||
<q-card style="width: 1200px; max-width: 80vw">
|
||||
<DialogHeader :tittle="'ส่งไปออกคำสั่งรับโอน'" :close="clickClose" />
|
||||
<DialogHeader :tittle="'ส่งไปออกsคำสั่งรับโอน'" :close="clickClose" />
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row justify-end">
|
||||
<div class="col-5">
|
||||
<q-toolbar style="padding: 0">
|
||||
<q-input
|
||||
borderless
|
||||
outlined
|
||||
dense
|
||||
debounce="300"
|
||||
:model-value="filterKeyword2"
|
||||
@update:model-value="updateInput"
|
||||
placeholder="ค้นหา"
|
||||
style="width: 850px; max-width: auto"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon v-if="filterKeyword2 == ''" name="search" />
|
||||
<q-icon
|
||||
v-if="filterKeyword2 !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="onReset"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
<q-select
|
||||
v-model="visibleColumns2"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
options-dense
|
||||
:display-value="$q.lang.table.columns"
|
||||
emit-value
|
||||
map-options
|
||||
:options="columns2"
|
||||
option-value="name"
|
||||
|
||||
style="min-width: 140px"
|
||||
class="gt-xs q-ml-sm"
|
||||
/>
|
||||
</q-toolbar>
|
||||
</div>
|
||||
</div>
|
||||
<d-table
|
||||
:columns="columns2"
|
||||
:rows="rows2"
|
||||
:filter="filterKeyword2"
|
||||
row-key="id"
|
||||
flat
|
||||
:visible-columns="visibleColumns2"
|
||||
selection="multiple"
|
||||
v-model:selected="selected"
|
||||
>
|
||||
<template v-slot:header-selection="scope">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="row col-12">
|
||||
<q-space />
|
||||
|
||||
<q-input
|
||||
borderless
|
||||
outlined
|
||||
dense
|
||||
v-model="scope.selected"
|
||||
debounce="300"
|
||||
:model-value="filterKeyword2"
|
||||
@update:model-value="updateInput"
|
||||
placeholder="ค้นหา"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon name="search" />
|
||||
<!-- <q-icon
|
||||
v-if="filterKeyword2 !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="onReset"
|
||||
/> -->
|
||||
</template>
|
||||
</q-input>
|
||||
<q-select
|
||||
v-model="visibleColumns2"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
options-dense
|
||||
:display-value="$q.lang.table.columns"
|
||||
emit-value
|
||||
map-options
|
||||
:options="columns2"
|
||||
option-value="name"
|
||||
style="min-width: 140px"
|
||||
class="gt-xs q-ml-sm"
|
||||
/>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<d-table
|
||||
:columns="columns2"
|
||||
:rows="rows2"
|
||||
:filter="filterKeyword2"
|
||||
row-key="id"
|
||||
flat
|
||||
:visible-columns="visibleColumns2"
|
||||
selection="multiple"
|
||||
v-model:selected="selected"
|
||||
>
|
||||
<template v-slot:header-selection="scope">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
v-model="props.selected"
|
||||
v-model="scope.selected"
|
||||
/>
|
||||
</q-td>
|
||||
<q-td
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
@click="props.nextPage(props.row.id)"
|
||||
>
|
||||
<div v-if="col.name == 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'fullname'">
|
||||
{{
|
||||
props.row.firstName
|
||||
? `${props.row.prefix ?? ""}${
|
||||
props.row.firstName ?? ""
|
||||
} ${props.row.lastName ?? ""}`
|
||||
: "-"
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'dateOfBirth'">
|
||||
{{
|
||||
props.row.dateOfBirth
|
||||
? date2Thai(props.row.dateOfBirth)
|
||||
: "-"
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'createdAt'">
|
||||
{{
|
||||
props.row.createdAt ? date2Thai(props.row.createdAt) : "-"
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'organizationName'">
|
||||
<div class="col-4">
|
||||
<div class="text-weight-medium">
|
||||
{{ props.row.root !== null ? props.row.root : "-" }}
|
||||
</template>
|
||||
<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"
|
||||
@click="props.nextPage(props.row.id)"
|
||||
>
|
||||
<div v-if="col.name == 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'fullname'">
|
||||
{{
|
||||
props.row.rootShortName !== null
|
||||
? `(${props.row.rootShortName})`
|
||||
: ""
|
||||
props.row.firstName
|
||||
? `${props.row.prefix ?? ""}${
|
||||
props.row.firstName ?? ""
|
||||
} ${props.row.lastName ?? ""}`
|
||||
: "-"
|
||||
}}
|
||||
</div>
|
||||
<div class="text-weight-light">
|
||||
<div v-else-if="col.name == 'dateOfBirth'">
|
||||
{{
|
||||
props.row.nodeName !== null ? props.row.nodeName : ""
|
||||
}}
|
||||
{{
|
||||
props.row.nodeShortName !== null
|
||||
? `(${props.row.nodeShortName}${props.row.posMasterNo})`
|
||||
: ""
|
||||
props.row.dateOfBirth
|
||||
? date2Thai(props.row.dateOfBirth)
|
||||
: "-"
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="col.name == 'status'">
|
||||
{{ props.row.status ? statusText(props.row.status) : "-" }}
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table>
|
||||
<div v-else-if="col.name == 'createdAt'">
|
||||
{{
|
||||
props.row.createdAt
|
||||
? date2Thai(props.row.createdAt)
|
||||
: "-"
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'organizationName'">
|
||||
<div class="col-4">
|
||||
<div class="text-weight-medium">
|
||||
{{ props.row.root !== null ? props.row.root : "-" }}
|
||||
{{
|
||||
props.row.rootShortName !== null
|
||||
? `(${props.row.rootShortName})`
|
||||
: ""
|
||||
}}
|
||||
</div>
|
||||
<div class="text-weight-light">
|
||||
{{
|
||||
props.row.nodeName !== null
|
||||
? props.row.nodeName
|
||||
: ""
|
||||
}}
|
||||
{{
|
||||
props.row.nodeShortName !== null
|
||||
? `(${props.row.nodeShortName}${props.row.posMasterNo})`
|
||||
: ""
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="col.name == 'status'">
|
||||
{{
|
||||
props.row.status ? statusText(props.row.status) : "-"
|
||||
}}
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
|
|
|
|||
|
|
@ -4,11 +4,9 @@ import { useQuasar } from "quasar";
|
|||
|
||||
import { useRouter } from "vue-router";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useProfileDataStore } from "@/modules/08_registryEmployee/store";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
import type { QForm } from "quasar";
|
||||
import type {
|
||||
DataOption,
|
||||
DataOptioninfo,
|
||||
|
|
@ -18,8 +16,6 @@ import type {
|
|||
FormAddPerson,
|
||||
} from "@/modules/05_placement/interface/index/ProfileType";
|
||||
|
||||
// import HeaderTop from "@/modules/08_registryEmployee/components/AddEmployee/HeaderTop.vue";
|
||||
|
||||
const retireDate = ref<Date>();
|
||||
const router = useRouter();
|
||||
const $q = useQuasar();
|
||||
|
|
@ -35,8 +31,6 @@ const {
|
|||
dialogConfirm,
|
||||
} = mixin;
|
||||
|
||||
const profileStore = useProfileDataStore();
|
||||
|
||||
const age = ref<string | null>("");
|
||||
const defaultCitizenData = ref<string>("");
|
||||
const informaData = ref<FormAddPerson>({
|
||||
|
|
@ -210,39 +204,40 @@ async function checkCitizen(id: string) {
|
|||
* @param refData ประเภทของตัวเลือก
|
||||
*/
|
||||
function filterSelector(val: string, update: Function, refData: string) {
|
||||
const newVal = val.toLowerCase();
|
||||
switch (refData) {
|
||||
case "prefixOps":
|
||||
update(() => {
|
||||
Ops.value.prefixOps = OpsFilter.value.prefixOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
(v: DataOption) => v.name.toLowerCase().indexOf(newVal) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "genderOps":
|
||||
update(() => {
|
||||
Ops.value.genderOps = OpsFilter.value.genderOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
(v: DataOption) => v.name.toLowerCase().indexOf(newVal) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "bloodOps":
|
||||
update(() => {
|
||||
Ops.value.bloodOps = OpsFilter.value.bloodOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
(v: DataOption) => v.name.toLowerCase().indexOf(newVal) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "statusOps":
|
||||
update(() => {
|
||||
Ops.value.statusOps = OpsFilter.value.statusOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
(v: DataOption) => v.name.toLowerCase().indexOf(newVal) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "religionOps":
|
||||
update(() => {
|
||||
Ops.value.religionOps = OpsFilter.value.religionOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
(v: DataOption) => v.name.toLowerCase().indexOf(newVal) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
|
|
@ -493,6 +488,12 @@ onMounted(async () => {
|
|||
},
|
||||
]"
|
||||
emit-value
|
||||
use-input
|
||||
hide-selected
|
||||
fill-input
|
||||
@filter="(inputValue:string,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'prefixOps'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
|
|
@ -588,6 +589,8 @@ onMounted(async () => {
|
|||
dense
|
||||
outlined
|
||||
use-input
|
||||
hide-selected
|
||||
fill-input
|
||||
clearable
|
||||
lazy-rules
|
||||
emit-value
|
||||
|
|
@ -610,6 +613,8 @@ onMounted(async () => {
|
|||
dense
|
||||
outlined
|
||||
use-input
|
||||
hide-selected
|
||||
fill-input
|
||||
clearable
|
||||
lazy-rules
|
||||
emit-value
|
||||
|
|
@ -654,6 +659,8 @@ onMounted(async () => {
|
|||
dense
|
||||
outlined
|
||||
use-input
|
||||
hide-selected
|
||||
fill-input
|
||||
clearable
|
||||
lazy-rules
|
||||
emit-value
|
||||
|
|
@ -676,6 +683,8 @@ onMounted(async () => {
|
|||
dense
|
||||
outlined
|
||||
use-input
|
||||
hide-selected
|
||||
fill-input
|
||||
clearable
|
||||
lazy-rules
|
||||
emit-value
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue