ปรับ layout โครงสร้างอัตรากำลัง
This commit is contained in:
parent
67d136c2bb
commit
cda9e56239
2 changed files with 73 additions and 63 deletions
|
|
@ -126,66 +126,12 @@ watch(
|
|||
<q-separator />
|
||||
|
||||
<q-card-section class="q-pt-none bg-grey-2 q-pa-md">
|
||||
<div class="row">
|
||||
<q-card
|
||||
class="col-12 col-sm-3 scroll q-pa-sm"
|
||||
style="max-height: 70vh"
|
||||
>
|
||||
<q-input
|
||||
ref="filterRef"
|
||||
dense
|
||||
outlined
|
||||
v-model="filterTree"
|
||||
label="ค้นหา"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="filterTree !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="resetFilter"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
<q-tree
|
||||
class="q-pa-md q-gutter-sm"
|
||||
dense
|
||||
default-expand-all
|
||||
selected-color="primary"
|
||||
:nodes="nodeTree"
|
||||
node-key="orgTreeId"
|
||||
label-key="orgTreeName"
|
||||
:filter="filterTree"
|
||||
no-results-label="ไม่พบข้อมูลที่ค้นหา"
|
||||
no-nodes-label="ไม่มีข้อมูล"
|
||||
v-model:selected="selectedTree"
|
||||
>
|
||||
<template v-slot:default-header="prop">
|
||||
<!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
|
||||
<div
|
||||
class="row items-center q-px-xs q-pt-xs q-gutter-sm"
|
||||
@click="updateSelected(prop.node.orgLevel)"
|
||||
>
|
||||
<div>
|
||||
<div class="text-weight-medium">
|
||||
{{ prop.node.orgTreeName }}
|
||||
</div>
|
||||
<div class="text-weight-light">
|
||||
{{ prop.node.orgCode == null ? null : prop.node.orgCode }}
|
||||
{{
|
||||
prop.node.orgTreeShortName == null
|
||||
? null
|
||||
: prop.node.orgTreeShortName
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</q-tree>
|
||||
</q-card>
|
||||
|
||||
<q-card class="col-12 col-sm-9 q-pa-sm">
|
||||
<div class="row q-col-gutter-md">
|
||||
<q-card bordered class="col-12 col-sm-8 q-pa-sm">
|
||||
<q-toolbar style="padding: 0">
|
||||
<q-toolbar-title class="text-subtitle2 text-bold"
|
||||
>เลือกตำแหน่งที่ต้องการย้าย</q-toolbar-title
|
||||
>
|
||||
<q-space />
|
||||
|
||||
<div>
|
||||
|
|
@ -240,6 +186,70 @@ watch(
|
|||
</template>
|
||||
</d-table>
|
||||
</q-card>
|
||||
|
||||
<q-card
|
||||
bordered
|
||||
class="col-12 col-sm-4 scroll q-pa-sm"
|
||||
style="max-height: 70vh"
|
||||
>
|
||||
<q-toolbar style="padding: 0">
|
||||
<q-toolbar-title class="text-subtitle2 text-bold"
|
||||
>เลือกหน่วยงาน/ส่วนราชการปลายทาง</q-toolbar-title
|
||||
>
|
||||
</q-toolbar>
|
||||
|
||||
<q-input
|
||||
ref="filterRef"
|
||||
dense
|
||||
outlined
|
||||
v-model="filterTree"
|
||||
label="ค้นหา"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="filterTree !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="resetFilter"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
<q-tree
|
||||
class="q-pa-md q-gutter-sm"
|
||||
dense
|
||||
default-expand-all
|
||||
selected-color="primary"
|
||||
:nodes="nodeTree"
|
||||
node-key="orgTreeId"
|
||||
label-key="orgTreeName"
|
||||
:filter="filterTree"
|
||||
no-results-label="ไม่พบข้อมูลที่ค้นหา"
|
||||
no-nodes-label="ไม่มีข้อมูล"
|
||||
v-model:selected="selectedTree"
|
||||
>
|
||||
<template v-slot:default-header="prop">
|
||||
<!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
|
||||
<div
|
||||
class="row items-center q-px-xs q-pt-xs q-gutter-sm"
|
||||
@click="updateSelected(prop.node.orgLevel)"
|
||||
>
|
||||
<div>
|
||||
<div class="text-weight-medium">
|
||||
{{ prop.node.orgTreeName }}
|
||||
</div>
|
||||
<div class="text-weight-light">
|
||||
{{ prop.node.orgCode == null ? null : prop.node.orgCode }}
|
||||
{{
|
||||
prop.node.orgTreeShortName == null
|
||||
? null
|
||||
: prop.node.orgTreeShortName
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</q-tree>
|
||||
</q-card>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
|
|
|
|||
|
|
@ -150,7 +150,7 @@ const columns = ref<QTableProps["columns"]>([
|
|||
{
|
||||
name: "positionIsSelected",
|
||||
align: "left",
|
||||
label: "มีคนครองหรือไม่",
|
||||
label: "คนครอง",
|
||||
sortable: true,
|
||||
field: "positionIsSelected",
|
||||
headerStyle: "font-size: 14px",
|
||||
|
|
@ -429,12 +429,12 @@ function updatePagination(newPagination: NewPagination) {
|
|||
<q-td>
|
||||
<q-btn
|
||||
flat
|
||||
size="12px"
|
||||
color="grey-8"
|
||||
size="14px"
|
||||
color="primary"
|
||||
round
|
||||
dense
|
||||
@click="props.expand = !props.expand"
|
||||
:icon="props.expand ? 'mdi-menu-up' : 'mdi-menu-down'"
|
||||
:icon="props.expand ? 'mdi-menu-down' : 'mdi-menu-right'"
|
||||
/>
|
||||
</q-td>
|
||||
<q-td v-for="col in props.cols" :key="col.name" :props="props">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue