ปรับ ui เครื่องราช > บันทึกผลการเสนอขอ

This commit is contained in:
Tanyalak 2023-10-17 10:22:35 +07:00
parent 1e7f5b8187
commit 430f6a1074
3 changed files with 180 additions and 190 deletions

View file

@ -544,71 +544,72 @@ const clearInsigniaFilters = (name: string) => {
class="q-pa-none"
>
<div class="q-pa-md">
<div class="row col-12 q-pb-sm q-col-gutter-x-xs no-wrap">
<div>
<q-file
dense
clearable
outlined
v-model="fileResult"
label="บันทึกผลการได้รับพระราชทานเครื่องราชอิสริยาภรณ์"
style="min-width: 350px"
accept=".xlsx"
>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
<q-tooltip
>พโหลดไฟลนทกผลการไดบพระราชทานเครองราชอสรยาภรณ</q-tooltip
<q-card bordered class="col-12 q-mb-sm q-pa-sm">
<div class="row col-12 q-col-gutter-x-xs">
<div class="col-xs-12 col-sm-6 row no-wrap q-col-gutter-x-xs">
<q-file
dense
clearable
outlined
v-model="fileResult"
label="บันทึกผลการได้รับพระราชทานเครื่องราชอิสริยาภรณ์"
accept=".xlsx"
class=" full-width"
>
</q-file>
</div>
<div v-if="fileResult !== null">
<q-btn
size="12px"
flat
round
color="add"
icon="mdi-upload"
@click="perviewfile(fileResult, 'receice')"
>
<q-tooltip
>พโหลดไฟลนทกผลการไดบพระราชทานเครองราชอสรยาภรณ</q-tooltip
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
<q-tooltip
>พโหลดไฟลนทกผลการไดบพระราชทานเครองราชอสรยาภรณ</q-tooltip
>
</q-file>
<div v-if="fileResult !== null">
<q-btn
size="12px"
flat
class="bg-teal-1 fit"
color="add"
icon="mdi-upload"
@click="perviewfile(fileResult, 'receice')"
>
<q-tooltip
>พโหลดไฟลนทกผลการไดบพระราชทานเครองราชอสรยาภรณ</q-tooltip
>
</q-btn>
</div>
</div>
<div class="col-xs-12 col-sm-6 row no-wrap q-col-gutter-x-xs">
<q-file
dense
clearable
outlined
v-model="fileinvoice"
label="บันทึกผลการจ่ายใบกำกับ"
accept=".xlsx"
class=" full-width"
>
</q-btn>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary"/>
</template>
<q-tooltip>พโหลดไฟลนทกผลการจายใบกำก</q-tooltip>
</q-file>
<div v-if="fileinvoice !== null">
<q-btn
size="12px"
flat
color="add"
class="bg-teal-1 fit"
icon="mdi-upload"
@click="perviewfile(fileinvoice, 'invoice')"
>
<q-tooltip>พโหลดไฟลนทกผลการจายใบกำก</q-tooltip>
</q-btn>
</div>
</div>
</div>
<div>
<q-file
dense
clearable
outlined
v-model="fileinvoice"
label="บันทึกผลการจ่ายใบกำกับ"
style="min-width: 350px"
accept=".xlsx"
>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
<q-tooltip>พโหลดไฟลนทกผลการจายใบกำก</q-tooltip>
</q-file>
</div>
<div v-if="fileinvoice !== null">
<q-btn
size="12px"
flat
round
color="add"
icon="mdi-upload"
@click="perviewfile(fileinvoice, 'invoice')"
>
<q-tooltip>พโหลดไฟลนทกผลการจายใบกำก</q-tooltip>
</q-btn>
</div>
</div>
<div class="row col-12 q-pb-sm q-col-gutter-x-xs">
</q-card>
<div class="row col-12 q-pb-sm q-col-gutter-xs">
<q-select
class="col-2"
v-model="DataStore.insignia"
dense
outlined
@ -623,7 +624,7 @@ const clearInsigniaFilters = (name: string) => {
option-value="id"
:readonly="false"
:borderless="false"
style="min-width: 150px"
style="width: 280px"
@update:model-value="selectorInsignia"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'insigniaTypeFilter'
@ -645,122 +646,8 @@ const clearInsigniaFilters = (name: string) => {
</q-item-section>
</q-item>
</template>
</q-select>
<q-select
v-model="DataStore.invoiceType"
dense
outlined
lazy-rules
hide-bottom-space
:label="`${'ใบกำกับ'}`"
emit-value
map-options
use-input
option-label="name"
:options="filterInvoice"
option-value="id"
:readonly="false"
:borderless="false"
style="min-width: 150px"
@update:model-value="
DataStore.searchData(
DataStore.invoiceType,
DataStore.employeeClass
)
"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'filterInvoice'
) "
>
<template v-if="DataStore.invoiceType !== 'all'" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
clearInsigniaFilters('filterInvoice'),
DataStore.searchData(
DataStore.invoiceType,
DataStore.employeeClass
)
"
class="cursor-pointer"
/>
</template>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
ไมอม
</q-item-section>
</q-item>
</template>
</q-select>
<div>
<q-select
v-model="DataStore.employeeClass"
dense
outlined
lazy-rules
hide-bottom-space
:label="`${'สถานภาพ'}`"
emit-value
map-options
use-input
option-label="name"
:options="filterEmployee"
option-value="id"
:readonly="false"
:borderless="false"
style="min-width: 150px"
@update:model-value="
DataStore.searchData(
DataStore.invoiceType,
DataStore.employeeClass
)
"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'filterEmployee'
) "
>
<template
v-if="DataStore.employeeClass !== 'all'"
v-slot:append
>
<q-icon
name="cancel"
@click.stop.prevent="
clearInsigniaFilters('filterEmployee'),
DataStore.searchData(
DataStore.invoiceType,
DataStore.employeeClass
)
"
class="cursor-pointer"
/>
</template>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
ไมอม
</q-item-section>
</q-item>
</template>
</q-select>
</div>
<div>
<q-btn
@click="addData()"
size="12px"
flat
round
color="add"
icon="mdi-plus"
>
<q-tooltip>เพ</q-tooltip>
</q-btn>
</div>
</q-select>
<q-space />
<div class="items-center" style="display: flex">
<!-- นหาขอความใน table -->
<q-input
@ -800,6 +687,118 @@ const clearInsigniaFilters = (name: string) => {
class="gt-xs q-ml-sm"
/>
</div>
</div>
<div class="row col-12 q-mb-sm q-col-gutter-xs">
<q-select
v-model="DataStore.invoiceType"
dense
outlined
lazy-rules
hide-bottom-space
:label="`${'ใบกำกับ'}`"
emit-value
map-options
use-input
option-label="name"
:options="filterInvoice"
option-value="id"
:readonly="false"
:borderless="false"
style="width: 250px"
@update:model-value="
DataStore.searchData(
DataStore.invoiceType,
DataStore.employeeClass
)
"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'filterInvoice'
) "
>
<template v-if="DataStore.invoiceType !== 'all'" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
clearInsigniaFilters('filterInvoice'),
DataStore.searchData(
DataStore.invoiceType,
DataStore.employeeClass
)
"
class="cursor-pointer"
/>
</template>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
ไมอม
</q-item-section>
</q-item>
</template>
</q-select>
<q-select
v-model="DataStore.employeeClass"
dense
outlined
lazy-rules
hide-bottom-space
:label="`${'สถานภาพ'}`"
emit-value
map-options
use-input
option-label="name"
:options="filterEmployee"
option-value="id"
:readonly="false"
:borderless="false"
style="width: 280px"
@update:model-value="
DataStore.searchData(
DataStore.invoiceType,
DataStore.employeeClass
)
"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'filterEmployee'
) "
>
<template
v-if="DataStore.employeeClass !== 'all'"
v-slot:append
>
<q-icon
name="cancel"
@click.stop.prevent="
clearInsigniaFilters('filterEmployee'),
DataStore.searchData(
DataStore.invoiceType,
DataStore.employeeClass
)
"
class="cursor-pointer"
/>
</template>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
ไมอม
</q-item-section>
</q-item>
</template>
</q-select>
<div>
<q-btn
@click="addData()"
size="12px"
flat
round
color="add"
icon="mdi-plus"
>
<q-tooltip>เพ</q-tooltip>
</q-btn>
</div>
</div>
<d-table
:rows="DataStore.rows"