ปรับ css drawer, ระบบบรรจุ
This commit is contained in:
Tanyalak
parent
5144effebd
commit
cf0ada2c67
9 changed files with 275 additions and 266 deletions
|
|
@ -106,7 +106,8 @@
|
||||||
<template v-slot:pagination="scope">
|
<template v-slot:pagination="scope">
|
||||||
<q-pagination
|
<q-pagination
|
||||||
v-model="pagination.page"
|
v-model="pagination.page"
|
||||||
color="grey-8"
|
active-color="primary"
|
||||||
|
color="dark"
|
||||||
:max="scope.pagesNumber"
|
:max="scope.pagesNumber"
|
||||||
:max-pages="5"
|
:max-pages="5"
|
||||||
size="sm"
|
size="sm"
|
||||||
|
|
|
||||||
|
|
@ -249,7 +249,8 @@
|
||||||
<template v-slot:pagination="scope">
|
<template v-slot:pagination="scope">
|
||||||
<q-pagination
|
<q-pagination
|
||||||
v-model="pagination.page"
|
v-model="pagination.page"
|
||||||
color="primary"
|
active-color="primary"
|
||||||
|
color="dark"
|
||||||
:max="scope.pagesNumber"
|
:max="scope.pagesNumber"
|
||||||
:max-pages="5"
|
:max-pages="5"
|
||||||
size="sm"
|
size="sm"
|
||||||
|
|
|
||||||
|
|
@ -195,16 +195,16 @@ const menuList = readonly<any[]>([
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 7,
|
key: 7,
|
||||||
icon: "mdi-home-variant-outline",
|
icon: "mdi-account-cancel-outline",
|
||||||
activeIcon: "mdi-home-variant",
|
activeIcon: "mdi-account-cancel",
|
||||||
label: "พ้นจากราชการ",
|
label: "พ้นจากราชการ",
|
||||||
path: "retirement",
|
path: "retirement",
|
||||||
role: "retirement",
|
role: "retirement",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 8,
|
key: 8,
|
||||||
icon: "mdi-home-variant-outline",
|
icon: "mdi-medal-outline",
|
||||||
activeIcon: "mdi-home-variant",
|
activeIcon: "mdi-medal",
|
||||||
label: "เครื่องราชอิสริยาภรณ์",
|
label: "เครื่องราชอิสริยาภรณ์",
|
||||||
path: "insignia",
|
path: "insignia",
|
||||||
role: "insignia",
|
role: "insignia",
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,11 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="toptitle text-dark col-12 row items-center">ออกคำสั่งบรรจุ</div>
|
<div class="toptitle text-dark col-12 row items-center">ออกคำสั่ง</div>
|
||||||
<div>
|
<div>
|
||||||
<q-card flat bordered class="col-12 q-mt-sm">
|
<q-card flat bordered class="col-12 q-mt-sm q-pa-md">
|
||||||
<div class="row q-pa-md">
|
<div class="row q-col-gutter-md">
|
||||||
<div class="col-xs-12 col-sm-3 col-md-2">
|
<div class="row col-12 q-col-gutter-sm">
|
||||||
<q-select
|
<q-select
|
||||||
|
class="col-xs-10 col-sm-3 col-md-2"
|
||||||
v-model="fiscalyear"
|
v-model="fiscalyear"
|
||||||
label="ปีงบประมาณ"
|
label="ปีงบประมาณ"
|
||||||
dense
|
dense
|
||||||
|
|
@ -21,21 +22,21 @@
|
||||||
:hide-dropdown-icon="false"
|
:hide-dropdown-icon="false"
|
||||||
@update:model-value="searchfiscalyear"
|
@update:model-value="searchfiscalyear"
|
||||||
/>
|
/>
|
||||||
</div>
|
<div>
|
||||||
<div class="col-xs-12 col-sm-3 col-md-6">
|
<q-btn
|
||||||
<q-btn
|
size="12px"
|
||||||
size="12px"
|
flat
|
||||||
flat
|
round
|
||||||
round
|
color="add"
|
||||||
color="add"
|
@click="clickAdd"
|
||||||
@click="clickAdd"
|
icon="mdi-plus"
|
||||||
icon="mdi-plus"
|
>
|
||||||
>
|
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
|
||||||
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
|
</q-btn>
|
||||||
</q-btn>
|
</div>
|
||||||
</div>
|
<q-space />
|
||||||
<div class="col-xs-12 col-sm-3 col-md-2">
|
|
||||||
<q-input
|
<q-input
|
||||||
|
class="col-xs-12 col-sm-3 col-md-2"
|
||||||
standout
|
standout
|
||||||
dense
|
dense
|
||||||
v-model="filterKeyword"
|
v-model="filterKeyword"
|
||||||
|
|
@ -43,7 +44,6 @@
|
||||||
outlined
|
outlined
|
||||||
debounce="300"
|
debounce="300"
|
||||||
placeholder="ค้นหา"
|
placeholder="ค้นหา"
|
||||||
class="q-ml-sm"
|
|
||||||
>
|
>
|
||||||
<template v-slot:append>
|
<template v-slot:append>
|
||||||
<q-icon v-if="filterKeyword == ''" name="search" />
|
<q-icon v-if="filterKeyword == ''" name="search" />
|
||||||
|
|
@ -55,9 +55,8 @@
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</q-input>
|
</q-input>
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-3 col-md-2">
|
|
||||||
<q-select
|
<q-select
|
||||||
|
class="col-xs-12 col-sm-3 col-md-2"
|
||||||
v-model="visibleColumns"
|
v-model="visibleColumns"
|
||||||
multiple
|
multiple
|
||||||
outlined
|
outlined
|
||||||
|
|
@ -70,162 +69,160 @@
|
||||||
option-value="name"
|
option-value="name"
|
||||||
options-cover
|
options-cover
|
||||||
style="min-width: 150px"
|
style="min-width: 150px"
|
||||||
class="gt-xs q-ml-sm"
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="col-12">
|
||||||
<div class="q-pt-sm q-pl-md q-pr-md q-pb-md">
|
<q-card bordered class="col-12 filter-card q-pa-sm">
|
||||||
<q-card bordered class="col-12 filter-card">
|
<div class="row col-12 q-col-gutter-sm">
|
||||||
<div class="row q-pa-sm">
|
<q-select
|
||||||
<div class="col-xs-12 col-sm-3 col-md- q-pl-sm">
|
class="col-xs-12 col-sm-3 col-md-2"
|
||||||
<q-select
|
v-model="OrderType"
|
||||||
v-model="OrderType"
|
label="ประเภท"
|
||||||
label="ประเภท"
|
|
||||||
dense
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
option-label="name"
|
|
||||||
:options="OrderTypeOption"
|
|
||||||
option-value="id"
|
|
||||||
lazy-rules
|
|
||||||
hide-bottom-space
|
|
||||||
:readonly="false"
|
|
||||||
:borderless="false"
|
|
||||||
:outlined="true"
|
|
||||||
:hide-dropdown-icon="false"
|
|
||||||
@update:model-value="searchFilterTable"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-3 col-md- q-pl-sm">
|
|
||||||
<q-select
|
|
||||||
v-model="OrderStatus"
|
|
||||||
label="สถานะ"
|
|
||||||
dense
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
option-label="name"
|
|
||||||
:options="OrderStatusOption"
|
|
||||||
option-value="id"
|
|
||||||
lazy-rules
|
|
||||||
hide-bottom-space
|
|
||||||
:readonly="false"
|
|
||||||
:borderless="false"
|
|
||||||
:outlined="true"
|
|
||||||
:hide-dropdown-icon="false"
|
|
||||||
@update:model-value="searchFilterTable"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card>
|
|
||||||
</div>
|
|
||||||
<div class="q-pt-sm q-pl-md q-pr-md q-pb-md">
|
|
||||||
<q-table
|
|
||||||
ref="table"
|
|
||||||
:columns="columns"
|
|
||||||
:rows="UpdataData"
|
|
||||||
:filter="filterKeyword"
|
|
||||||
row-key="Order"
|
|
||||||
flat
|
|
||||||
bordered
|
|
||||||
:paging="true"
|
|
||||||
dense
|
|
||||||
class="custom-header-table"
|
|
||||||
v-bind="attrs"
|
|
||||||
:visible-columns="visibleColumns"
|
|
||||||
:pagination-label="paginationLabel"
|
|
||||||
v-model:pagination="pagination"
|
|
||||||
>
|
|
||||||
<template v-slot:header="props">
|
|
||||||
<q-tr :props="props">
|
|
||||||
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
|
||||||
<span class="text-weight-medium">{{ col.label }}</span>
|
|
||||||
</q-th>
|
|
||||||
<q-th auto-width />
|
|
||||||
</q-tr>
|
|
||||||
</template>
|
|
||||||
<template v-slot:body="props">
|
|
||||||
<q-tr :props="props" class="cursor-pointer">
|
|
||||||
<q-td
|
|
||||||
key="Order"
|
|
||||||
:props="props"
|
|
||||||
@click="redirectToPage(props.row.Order)"
|
|
||||||
>
|
|
||||||
{{ props.row.Order }}
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="OrderNum"
|
|
||||||
:props="props"
|
|
||||||
@click="redirectToPage(props.row.Order)"
|
|
||||||
>
|
|
||||||
{{ props.row.OrderNum }}
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="OrderDate"
|
|
||||||
:props="props"
|
|
||||||
@click="redirectToPage(props.row.Order)"
|
|
||||||
>
|
|
||||||
{{ props.row.OrderDate }}
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="OrderBy"
|
|
||||||
:props="props"
|
|
||||||
@click="redirectToPage(props.row.Order)"
|
|
||||||
>
|
|
||||||
{{ props.row.OrderBy }}
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="Signer"
|
|
||||||
:props="props"
|
|
||||||
@click="redirectToPage(props.row.Order)"
|
|
||||||
>
|
|
||||||
{{ props.row.Signer }}
|
|
||||||
</q-td>
|
|
||||||
<q-td
|
|
||||||
key="OrderStatus"
|
|
||||||
:props="props"
|
|
||||||
@click="redirectToPage(props.row.Order)"
|
|
||||||
>
|
|
||||||
<q-icon
|
|
||||||
v-if="props.row.OrderStatus == 'ยังไม่ได้ออกคำสั่ง'"
|
|
||||||
name="hourglass_top"
|
|
||||||
color="orange"
|
|
||||||
class="text-h5"
|
|
||||||
/>
|
|
||||||
<q-icon
|
|
||||||
v-if="props.row.OrderStatus == 'ออกคำสั่งแล้ว'"
|
|
||||||
name="mdi-check"
|
|
||||||
color="positive"
|
|
||||||
class="text-h5"
|
|
||||||
/>
|
|
||||||
</q-td>
|
|
||||||
|
|
||||||
<q-td auto-width>
|
|
||||||
<q-btn
|
|
||||||
dense
|
dense
|
||||||
size="12px"
|
emit-value
|
||||||
flat
|
map-options
|
||||||
round
|
option-label="name"
|
||||||
color="red"
|
:options="OrderTypeOption"
|
||||||
@click="clickDelete(props.row.id)"
|
option-value="id"
|
||||||
icon="mdi-delete"
|
lazy-rules
|
||||||
|
hide-bottom-space
|
||||||
|
:readonly="false"
|
||||||
|
:borderless="false"
|
||||||
|
:outlined="true"
|
||||||
|
:hide-dropdown-icon="false"
|
||||||
|
@update:model-value="searchFilterTable"
|
||||||
|
/>
|
||||||
|
<q-select
|
||||||
|
class="col-xs-12 col-sm-3 col-md-2"
|
||||||
|
v-model="OrderStatus"
|
||||||
|
label="สถานะ"
|
||||||
|
dense
|
||||||
|
emit-value
|
||||||
|
map-options
|
||||||
|
option-label="name"
|
||||||
|
:options="OrderStatusOption"
|
||||||
|
option-value="id"
|
||||||
|
lazy-rules
|
||||||
|
hide-bottom-space
|
||||||
|
:readonly="false"
|
||||||
|
:borderless="false"
|
||||||
|
:outlined="true"
|
||||||
|
:hide-dropdown-icon="false"
|
||||||
|
@update:model-value="searchFilterTable"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</q-card>
|
||||||
|
</div>
|
||||||
|
<div class="col-12">
|
||||||
|
<q-table
|
||||||
|
ref="table"
|
||||||
|
:columns="columns"
|
||||||
|
:rows="UpdataData"
|
||||||
|
:filter="filterKeyword"
|
||||||
|
row-key="Order"
|
||||||
|
flat
|
||||||
|
bordered
|
||||||
|
:paging="true"
|
||||||
|
dense
|
||||||
|
class="custom-header-table"
|
||||||
|
v-bind="attrs"
|
||||||
|
:visible-columns="visibleColumns"
|
||||||
|
:pagination-label="paginationLabel"
|
||||||
|
v-model:pagination="pagination"
|
||||||
|
>
|
||||||
|
<template v-slot:header="props">
|
||||||
|
<q-tr :props="props">
|
||||||
|
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
||||||
|
<span class="text-weight-medium">{{ col.label }}</span>
|
||||||
|
</q-th>
|
||||||
|
<q-th auto-width />
|
||||||
|
</q-tr>
|
||||||
|
</template>
|
||||||
|
<template v-slot:body="props">
|
||||||
|
<q-tr :props="props" class="cursor-pointer">
|
||||||
|
<q-td
|
||||||
|
key="Order"
|
||||||
|
:props="props"
|
||||||
|
@click="redirectToPage(props.row.Order)"
|
||||||
>
|
>
|
||||||
<q-tooltip>ลบข้อมูล</q-tooltip>
|
{{ props.row.Order }}
|
||||||
</q-btn>
|
</q-td>
|
||||||
</q-td>
|
<q-td
|
||||||
</q-tr>
|
key="OrderNum"
|
||||||
</template>
|
:props="props"
|
||||||
<template v-slot:pagination="scope">
|
@click="redirectToPage(props.row.Order)"
|
||||||
<q-pagination
|
>
|
||||||
v-model="pagination.page"
|
{{ props.row.OrderNum }}
|
||||||
color="primary"
|
</q-td>
|
||||||
:max="scope.pagesNumber"
|
<q-td
|
||||||
:max-pages="5"
|
key="OrderDate"
|
||||||
size="sm"
|
:props="props"
|
||||||
boundary-links
|
@click="redirectToPage(props.row.Order)"
|
||||||
direction-links
|
>
|
||||||
></q-pagination>
|
{{ props.row.OrderDate }}
|
||||||
</template>
|
</q-td>
|
||||||
</q-table>
|
<q-td
|
||||||
|
key="OrderBy"
|
||||||
|
:props="props"
|
||||||
|
@click="redirectToPage(props.row.Order)"
|
||||||
|
>
|
||||||
|
{{ props.row.OrderBy }}
|
||||||
|
</q-td>
|
||||||
|
<q-td
|
||||||
|
key="Signer"
|
||||||
|
:props="props"
|
||||||
|
@click="redirectToPage(props.row.Order)"
|
||||||
|
>
|
||||||
|
{{ props.row.Signer }}
|
||||||
|
</q-td>
|
||||||
|
<q-td
|
||||||
|
key="OrderStatus"
|
||||||
|
:props="props"
|
||||||
|
@click="redirectToPage(props.row.Order)"
|
||||||
|
>
|
||||||
|
<q-icon
|
||||||
|
v-if="props.row.OrderStatus == 'ยังไม่ได้ออกคำสั่ง'"
|
||||||
|
name="mdi-timer-sand"
|
||||||
|
color="orange"
|
||||||
|
class="text-h6"
|
||||||
|
/>
|
||||||
|
<q-icon
|
||||||
|
v-if="props.row.OrderStatus == 'ออกคำสั่งแล้ว'"
|
||||||
|
name="mdi-check"
|
||||||
|
color="positive"
|
||||||
|
class="text-h6"
|
||||||
|
/>
|
||||||
|
</q-td>
|
||||||
|
|
||||||
|
<q-td auto-width>
|
||||||
|
<q-btn
|
||||||
|
dense
|
||||||
|
size="12px"
|
||||||
|
flat
|
||||||
|
round
|
||||||
|
color="red"
|
||||||
|
@click="clickDelete(props.row.id)"
|
||||||
|
icon="mdi-delete"
|
||||||
|
>
|
||||||
|
<q-tooltip>ลบข้อมูล</q-tooltip>
|
||||||
|
</q-btn>
|
||||||
|
</q-td>
|
||||||
|
</q-tr>
|
||||||
|
</template>
|
||||||
|
<template v-slot:pagination="scope">
|
||||||
|
<q-pagination
|
||||||
|
v-model="pagination.page"
|
||||||
|
active-color="primary"
|
||||||
|
color="dark"
|
||||||
|
:max="scope.pagesNumber"
|
||||||
|
:max-pages="5"
|
||||||
|
size="sm"
|
||||||
|
boundary-links
|
||||||
|
direction-links
|
||||||
|
></q-pagination>
|
||||||
|
</template>
|
||||||
|
</q-table>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</q-card>
|
</q-card>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -324,7 +321,7 @@ const columns = ref<QTableProps["columns"]>([
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "OrderStatus",
|
name: "OrderStatus",
|
||||||
align: "left",
|
align: "center",
|
||||||
label: "สถานะคำสั่ง",
|
label: "สถานะคำสั่ง",
|
||||||
sortable: false,
|
sortable: false,
|
||||||
field: "OrderStatus",
|
field: "OrderStatus",
|
||||||
|
|
@ -698,7 +695,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
|
|
||||||
<style lang="scss" scope>
|
<style lang="scss" scope>
|
||||||
.filter-card {
|
.filter-card {
|
||||||
background-color: #ededed;
|
background-color: #f1f1f1b0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.toggle-expired-account {
|
.toggle-expired-account {
|
||||||
|
|
|
||||||
|
|
@ -373,7 +373,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
|
|
||||||
<style lang="scss" scope>
|
<style lang="scss" scope>
|
||||||
.filter-card {
|
.filter-card {
|
||||||
background-color: #EDEDED;
|
background-color: #f1f1f1b0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.toggle-expired-account {
|
.toggle-expired-account {
|
||||||
|
|
|
||||||
|
|
@ -293,88 +293,74 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
<div class="toptitle text-dark col-12 row items-center">
|
<div class="toptitle text-dark col-12 row items-center">
|
||||||
รายการสอบแข่งขัน / คัดเลือก
|
รายการสอบแข่งขัน / คัดเลือก
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<q-card flat bordered class="col-12 q-mt-sm q-pa-md">
|
||||||
<q-card flat bordered class="col-12 q-mt-sm">
|
<div class="row q-col-gutter-md">
|
||||||
<div class="row q-pa-md">
|
<div class="row col-12 q-col-gutter-sm">
|
||||||
<div class="col-xs-12 col-sm-3 col-md-2">
|
<q-select class="col-xs-12 col-sm-3 col-md-2" v-model="fiscalyear" label="ปีงบประมาณ" dense clearable emit-value map-options :options="fiscalyearOP"
|
||||||
<q-select v-model="fiscalyear" label="ปีงบประมาณ" dense clearable emit-value map-options :options="fiscalyearOP"
|
option-value="id" option-label="name" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
|
||||||
option-value="id" option-label="name" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
|
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchfiscalyear" />
|
||||||
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchfiscalyear" />
|
<q-space />
|
||||||
|
<q-input class="col-xs-12 col-sm-3 col-md-2" standout dense v-model="filterKeyword" ref="filterRef" outlined debounce="300" placeholder="ค้นหา">
|
||||||
|
<template v-slot:append>
|
||||||
|
<q-icon v-if="filterKeyword == ''" name="search" />
|
||||||
|
<q-icon v-if="filterKeyword !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
<q-select class="col-xs-12 col-sm-3 col-md-2" v-model="visibleColumns" multiple outlined dense options-dense :display-value="$q.lang.table.columns"
|
||||||
|
emit-value map-options :options="columns" option-value="name" options-cover />
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-3 col-md-6"></div>
|
<div class="col-12">
|
||||||
<div class="col-xs-12 col-sm-3 col-md-2">
|
<q-card bordered class="col-12 filter-card q-pa-sm">
|
||||||
<q-input standout dense v-model="filterKeyword" ref="filterRef" outlined debounce="300" placeholder="ค้นหา"
|
<div class="row col-12 q-col-gutter-sm">
|
||||||
class="q-ml-sm">
|
<q-select class="col-xs-12 col-sm-3 col-md-2" v-model="examTime" label="ครั้งที่" dense clearable emit-value map-options :options="examTimeOP"
|
||||||
<template v-slot:append>
|
|
||||||
<q-icon v-if="filterKeyword == ''" name="search" />
|
|
||||||
<q-icon v-if="filterKeyword !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12 col-sm-3 col-md-2">
|
|
||||||
<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" options-cover style="min-width: 150px"
|
|
||||||
class="gt-xs q-ml-sm" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="q-pt-sm q-pl-md q-pr-md q-pb-md">
|
|
||||||
<q-card bordered class="col-12 filter-card">
|
|
||||||
<div class="row q-pa-sm">
|
|
||||||
<div class="col-xs-12 col-sm-3 col-md-2 q-pl-sm">
|
|
||||||
<q-select v-model="examTime" label="ครั้งที่" dense clearable emit-value map-options :options="examTimeOP"
|
|
||||||
option-value="id" option-label="name" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
|
option-value="id" option-label="name" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
|
||||||
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchFilterTable" />
|
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchFilterTable" />
|
||||||
</div>
|
<q-select class="col-xs-12 col-sm-3 col-md-2" v-model="examType" label="ประเภทการสอบ" dense clearable emit-value map-options option-label="name"
|
||||||
<div class="col-xs-12 col-sm-3 col-md-2 q-pl-sm">
|
|
||||||
<q-select v-model="examType" label="ประเภทการสอบ" dense clearable emit-value map-options option-label="name"
|
|
||||||
:options="examTypeOP" option-value="id" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
|
:options="examTypeOP" option-value="id" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
|
||||||
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchFilterTable" />
|
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchFilterTable" />
|
||||||
</div>
|
<q-toggle class="col-xs-12 col-sm-5 col-md-5 toggle-expired-account" v-model="expiredAccount" color="blue" label="แสดงบัญชีหมดอายุ"
|
||||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
|
||||||
<q-toggle v-model="expiredAccount" class="toggle-expired-account" color="blue" label="แสดงบัญชีหมดอายุ"
|
|
||||||
@update:model-value="searchFilterTable" />
|
@update:model-value="searchFilterTable" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</q-card>
|
||||||
</q-card>
|
</div>
|
||||||
</div>
|
<div class="col-12">
|
||||||
<div class="q-pt-sm q-pl-md q-pr-md q-pb-md">
|
<q-table ref="table" :columns="columns" :rows="UpdataData" :filter="filterKeyword" row-key="id" flat bordered
|
||||||
<q-table ref="table" :columns="columns" :rows="UpdataData" :filter="filterKeyword" row-key="id" flat bordered
|
dense class="custom-header-table" v-bind="attrs" :visible-columns="visibleColumns"
|
||||||
dense class="custom-header-table" v-bind="attrs" :visible-columns="visibleColumns"
|
:pagination-label="paginationLabel">
|
||||||
:pagination-label="paginationLabel">
|
<template v-slot:body="props">
|
||||||
<template v-slot:body="props">
|
<q-tr :props="props" class="cursor-pointer" @click="redirectToPage(props.row.id)">
|
||||||
<q-tr :props="props" class="cursor-pointer" @click="redirectToPage(props.row.id)">
|
<q-td key="id" :props="props">
|
||||||
<q-td key="id" :props="props">
|
{{ props.row.id }}
|
||||||
{{ props.row.id }}
|
</q-td>
|
||||||
</q-td>
|
<q-td key="examRound" :props="props">
|
||||||
<q-td key="examRound" :props="props">
|
{{ props.row.examRound }}
|
||||||
{{ props.row.examRound }}
|
</q-td>
|
||||||
</q-td>
|
<q-td key="examOrder" :props="props">
|
||||||
<q-td key="examOrder" :props="props">
|
{{ props.row.examOrder }}
|
||||||
{{ props.row.examOrder }}
|
</q-td>
|
||||||
</q-td>
|
<q-td key="fiscalYear" :props="props">
|
||||||
<q-td key="fiscalYear" :props="props">
|
{{ props.row.fiscalYear + 543 }}
|
||||||
{{ props.row.fiscalYear + 543 }}
|
</q-td>
|
||||||
</q-td>
|
<q-td key="numberofCandidates" :props="props">
|
||||||
<q-td key="numberofCandidates" :props="props">
|
{{ props.row.numberofCandidates }}
|
||||||
{{ props.row.numberofCandidates }}
|
</q-td>
|
||||||
</q-td>
|
<q-td key="examType" :props="props">
|
||||||
<q-td key="examType" :props="props">
|
{{ props.row.examType == 1 ? 'คัดเลือก' : 'สอบแข่งขัน' }}
|
||||||
{{ props.row.examType == 1 ? 'คัดเลือก' : 'สอบแข่งขัน' }}
|
</q-td>
|
||||||
</q-td>
|
<q-td key="accountExpirationDate" :props="props">
|
||||||
<q-td key="accountExpirationDate" :props="props">
|
{{ textDate(props.row.accountExpirationDate) }}
|
||||||
{{ textDate(props.row.accountExpirationDate) }}
|
</q-td>
|
||||||
</q-td>
|
</q-tr>
|
||||||
</q-tr>
|
</template>
|
||||||
</template>
|
</q-table>
|
||||||
</q-table>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</q-card>
|
</q-card>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scope>
|
<style lang="scss" scope>
|
||||||
.filter-card {
|
.filter-card {
|
||||||
background-color: #EDEDED;
|
background-color: #f1f1f1b0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.toggle-expired-account {
|
.toggle-expired-account {
|
||||||
|
|
|
||||||
|
|
@ -56,14 +56,13 @@ const AddTablePosition = defineAsyncComponent(
|
||||||
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
|
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
|
||||||
รายชื่อผู้สอบในรอบ {{ title }} ครั้งที่ {{ round }} ปี {{ year }}
|
รายชื่อผู้สอบในรอบ {{ title }} ครั้งที่ {{ round }} ปี {{ year }}
|
||||||
</div>
|
</div>
|
||||||
<q-space />
|
|
||||||
|
|
||||||
<div class="q-py-md row col-12">
|
<q-card bordered class="q-py-sm row col-12">
|
||||||
<div class="col-12 row bg-white">
|
<div class="col-12 row bg-white">
|
||||||
<div class="fit q-pa-md">
|
<div class="fit q-px-md q-py-sm">
|
||||||
<div class="row col-12 q-col-gutter-md fit">
|
<div class="row col-12 q-col-gutter-md fit">
|
||||||
<div class="" v-for="item in itemTop" :key="item.id" :style="$q.screen.lt.md ? '' : sizeCard(5)" :class="$q.screen.lt.sm ? 'col-4' : ''">
|
<div class="" v-for="item in itemTop" :key="item.id" :style="$q.screen.lt.md ? '' : sizeCard(5)" :class="$q.screen.lt.sm ? 'col-4' : ''">
|
||||||
<div class="q-card q-card--bordered q-card--flat no-shadow row fit cardNum items-center q-pa-sm">
|
<div class="q-card q-card--bordered q-card--flat no-shadow row fit cardNum items-center q-px-sm">
|
||||||
<div class="col-12 row items-center q-pa-sm">
|
<div class="col-12 row items-center q-pa-sm">
|
||||||
<div class="col-12 text-h5 text-weight-bold" :style="{ color: item.color }">
|
<div class="col-12 text-h5 text-weight-bold" :style="{ color: item.color }">
|
||||||
{{ item.num }}
|
{{ item.num }}
|
||||||
|
|
@ -77,7 +76,7 @@ const AddTablePosition = defineAsyncComponent(
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</q-card>
|
||||||
</div>
|
</div>
|
||||||
<q-card flat bordered class="col-12 q-mt-sm q-pt-sm">
|
<q-card flat bordered class="col-12 q-mt-sm q-pt-sm">
|
||||||
<div>
|
<div>
|
||||||
|
|
|
||||||
|
|
@ -1201,17 +1201,24 @@ const listKeyId = (data: any) => {
|
||||||
v-if="props.row.Status !== 'สละสิทธิ์' &&
|
v-if="props.row.Status !== 'สละสิทธิ์' &&
|
||||||
props.row.Status !== 'บรรจุเเล้ว'
|
props.row.Status !== 'บรรจุเเล้ว'
|
||||||
"
|
"
|
||||||
icon="density_medium"
|
icon="mdi-dots-vertical"
|
||||||
size="xs"
|
size="12px"
|
||||||
|
color="grey-7"
|
||||||
|
flat
|
||||||
|
round
|
||||||
|
dense
|
||||||
>
|
>
|
||||||
<q-menu transition-show="jump-down" transition-hide="jump-up">
|
<q-menu transition-show="jump-down" transition-hide="jump-up">
|
||||||
<q-list style="min-width: 100px">
|
<q-list dense style="min-width: 100px">
|
||||||
<q-item
|
<q-item
|
||||||
v-if="props.row.Status === 'ยังไม่บรรจุ'"
|
v-if="props.row.Status === 'ยังไม่บรรจุ'"
|
||||||
clickable
|
clickable
|
||||||
v-close-popup
|
v-close-popup
|
||||||
@click="openAppointModal"
|
@click="openAppointModal"
|
||||||
>
|
>
|
||||||
|
<q-item-section style="min-width: 0px;" avatar class="q-py-sm">
|
||||||
|
<q-icon color="primary" size="xs" name="mdi-bookmark-outline" />
|
||||||
|
</q-item-section>
|
||||||
<q-item-section>เลือกหน่วยงานที่รับบรรจุ</q-item-section>
|
<q-item-section>เลือกหน่วยงานที่รับบรรจุ</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-separator />
|
<q-separator />
|
||||||
|
|
@ -1221,6 +1228,9 @@ const listKeyId = (data: any) => {
|
||||||
v-close-popup
|
v-close-popup
|
||||||
@click="editDetail(props.row, 'wait')"
|
@click="editDetail(props.row, 'wait')"
|
||||||
>
|
>
|
||||||
|
<q-item-section style="min-width: 0px;" avatar class="q-py-sm">
|
||||||
|
<q-icon color="blue" size="xs" name="mdi-account-alert-outline" />
|
||||||
|
</q-item-section>
|
||||||
<q-item-section>ขอผ่อนผัน</q-item-section>
|
<q-item-section>ขอผ่อนผัน</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-item
|
<q-item
|
||||||
|
|
@ -1229,6 +1239,9 @@ const listKeyId = (data: any) => {
|
||||||
v-close-popup
|
v-close-popup
|
||||||
@click="editDetail(props.row, 'waitInfo')"
|
@click="editDetail(props.row, 'waitInfo')"
|
||||||
>
|
>
|
||||||
|
<q-item-section style="min-width: 0px;" avatar class="q-py-sm">
|
||||||
|
<q-icon color="blue" size="xs" name="mdi-account-details-outline" />
|
||||||
|
</q-item-section>
|
||||||
<q-item-section>ข้อมูลการผ่อนผัน</q-item-section>
|
<q-item-section>ข้อมูลการผ่อนผัน</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
<q-separator />
|
<q-separator />
|
||||||
|
|
@ -1240,6 +1253,9 @@ const listKeyId = (data: any) => {
|
||||||
v-close-popup
|
v-close-popup
|
||||||
@click="editDetail(props.row, 'cancel')"
|
@click="editDetail(props.row, 'cancel')"
|
||||||
>
|
>
|
||||||
|
<q-item-section style="min-width: 0px;" avatar class="q-py-sm">
|
||||||
|
<q-icon color="pink" size="xs" name="mdi-account-cancel-outline" />
|
||||||
|
</q-item-section>
|
||||||
<q-item-section>สละสิทธิ์</q-item-section>
|
<q-item-section>สละสิทธิ์</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
</q-list>
|
</q-list>
|
||||||
|
|
|
||||||
|
|
@ -723,6 +723,7 @@ if (keycloak.tokenParsed != null) {
|
||||||
dense-toggle
|
dense-toggle
|
||||||
:label="subMenu.label"
|
:label="subMenu.label"
|
||||||
v-if="subMenu.key !== 5.1"
|
v-if="subMenu.key !== 5.1"
|
||||||
|
class="expan2"
|
||||||
dense
|
dense
|
||||||
>
|
>
|
||||||
<q-item
|
<q-item
|
||||||
|
|
@ -891,17 +892,20 @@ if (keycloak.tokenParsed != null) {
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
.menuSub .q-item__section--avatar, .menu .q-item__section--avatar{
|
||||||
|
min-width: 0px;
|
||||||
|
}
|
||||||
.menu {
|
.menu {
|
||||||
padding-bottom: 5px;
|
padding-bottom: 5px;
|
||||||
padding-top: 5px;
|
padding-top: 5px;
|
||||||
border-radius: 0 100px 100px 0;
|
border-radius: 0 100px 100px 0;
|
||||||
margin-right: 4%;
|
margin-right: 2%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.menuActive {
|
.menuActive {
|
||||||
background: #212a2f;
|
background: #212a2f;
|
||||||
border-radius: 0 100px 100px 0;
|
border-radius: 0 100px 100px 0;
|
||||||
margin-right: 4%;
|
margin-right: 2%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.menuActiveMini {
|
.menuActiveMini {
|
||||||
|
|
@ -909,17 +913,22 @@ if (keycloak.tokenParsed != null) {
|
||||||
}
|
}
|
||||||
.menuSub .q-item {
|
.menuSub .q-item {
|
||||||
border-radius: 0 100px 100px 0;
|
border-radius: 0 100px 100px 0;
|
||||||
margin-right: 4%;
|
margin-right: 2%;
|
||||||
|
}
|
||||||
|
.expan2 .q-item {
|
||||||
|
padding-left: 10%;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* .menuSubAct {
|
/* .menuSubAct {
|
||||||
background: #1e2529d9;
|
background: #1e2529d9;
|
||||||
} */
|
} */
|
||||||
|
.expan2 .menuSubHover{
|
||||||
.menuSubHover {
|
|
||||||
padding-left: 30%;
|
padding-left: 30%;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
}
|
}
|
||||||
|
.menuSubHover{
|
||||||
|
padding-left: 25%;
|
||||||
|
border-radius: 20px;
|
||||||
|
}
|
||||||
.menuSub .q-expansion-item__content {
|
.menuSub .q-expansion-item__content {
|
||||||
background: #212a2f;
|
background: #212a2f;
|
||||||
padding: 5px 0px;
|
padding: 5px 0px;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue