ปรับ layout ข้อมูลตำแหน่งข้าราชการ

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2025-01-08 11:25:15 +07:00
parent aaf73b0ad7
commit 6552c214c7
2 changed files with 126 additions and 112 deletions

View file

@ -321,8 +321,9 @@ onMounted(async () => {
> >
</div> </div>
<div class="row col-12 q-col-gutter-sm q-mb-sm"> <div class="row col-12 q-col-gutter-sm">
<div class="col-xs-12 col-md-2"> <div class="row q-col-gutter-sm align-items-center">
<div class="col-auto">
<q-select <q-select
label="ค้นหาจาก" label="ค้นหาจาก"
v-model="formQuery.type" v-model="formQuery.type"
@ -336,7 +337,7 @@ onMounted(async () => {
/> />
</div> </div>
<div class="col-xs-12 col-md-3"> <div class="col">
<q-input <q-input
ref="searchRef" ref="searchRef"
v-model="formQuery.keyword" v-model="formQuery.keyword"
@ -346,6 +347,7 @@ onMounted(async () => {
label="คำค้น" label="คำค้น"
hide-bottom-space hide-bottom-space
@keydown.enter="fetchData()" @keydown.enter="fetchData()"
style="min-width: 300px"
> >
<template v-slot:append> <template v-slot:append>
<q-icon <q-icon
@ -358,7 +360,7 @@ onMounted(async () => {
</q-input> </q-input>
</div> </div>
<div class="col-xs-12 col-md-1"> <div class="col-auto">
<q-btn <q-btn
outline outline
color="primary" color="primary"
@ -368,9 +370,11 @@ onMounted(async () => {
@click="fetchData()" @click="fetchData()"
/> />
</div> </div>
</div>
<q-space /> <q-space />
<div class="col-xs-12 col-md-1"> <div class="row q-col-gutter-sm align-items-center">
<div class="col-auto">
<q-select <q-select
v-model="visibleColumns" v-model="visibleColumns"
multiple multiple
@ -382,10 +386,12 @@ onMounted(async () => {
map-options map-options
:options="columns" :options="columns"
option-value="name" option-value="name"
style="min-width: 140px"
/> />
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="full-width q-mt-sm"> <div class="full-width q-mt-sm">
<d-table <d-table

View file

@ -309,8 +309,9 @@ onMounted(async () => {
><q-tooltip>เพมตำเเหน </q-tooltip></q-btn ><q-tooltip>เพมตำเเหน </q-tooltip></q-btn
> >
</div> </div>
<div class="row col-12 q-col-gutter-sm q-mb-sm"> <div class="row col-12 q-col-gutter-sm">
<div class="col-xs-12 col-md-2"> <div class="row q-col-gutter-sm align-items-center">
<div class="col-auto">
<q-select <q-select
label="ค้นหาจาก" label="ค้นหาจาก"
v-model="type" v-model="type"
@ -323,7 +324,7 @@ onMounted(async () => {
option-value="id" option-value="id"
/> />
</div> </div>
<div class="col-xs-12 col-md-3"> <div class="col">
<q-input <q-input
v-model="search" v-model="search"
outlined outlined
@ -331,6 +332,7 @@ onMounted(async () => {
lazy-rules lazy-rules
label="คำค้น" label="คำค้น"
hide-bottom-space hide-bottom-space
style="min-width: 300px"
> >
<template v-slot:append> <template v-slot:append>
<q-icon <q-icon
@ -342,18 +344,22 @@ onMounted(async () => {
</template> </template>
</q-input> </q-input>
</div> </div>
<div class="col-xs-12 col-md-1">
<div class="col-auto">
<q-btn <q-btn
outline outline
class="full-width full-height"
color="primary" color="primary"
icon="search" icon="search"
label="ค้นหา" label="ค้นหา"
type="submit" type="submit"
class="full-width full-height"
/> />
</div> </div>
</div>
<q-space /> <q-space />
<div class="col-xs-12 col-md-1"> <div class="row q-col-gutter-sm align-items-center">
<div class="col-auto">
<q-select <q-select
v-model="visibleColumns" v-model="visibleColumns"
multiple multiple
@ -365,10 +371,12 @@ onMounted(async () => {
map-options map-options
:options="columns" :options="columns"
option-value="name" option-value="name"
style="min-width: 140px"
/> />
</div> </div>
</div> </div>
</div> </div>
</div>
</q-form> </q-form>
<div class="full-width q-mt-sm"> <div class="full-width q-mt-sm">