- แก้ไขข้อความ

- แก้ไขเมนู
This commit is contained in:
Warunee Tamkoo 2024-04-19 13:58:58 +07:00
parent a2279a234a
commit c6d53b22f3
5 changed files with 201 additions and 317 deletions

View file

@ -350,6 +350,7 @@ onMounted(() => {
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th auto-width></q-th>
<q-th v-for="col in props.cols" :key="col.name" :props="props">
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
@ -357,6 +358,11 @@ onMounted(() => {
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td v-if="props.row.isDone">
<q-icon name="mdi-check" color="green" size="xs">
<q-tooltip>งไปบนทกททะเบยนประวแล</q-tooltip>
</q-icon>
</q-td>
<q-td v-for="col in props.cols" :key="col.id">
<div>{{ col.value ? col.value : "-" }}</div>
</q-td>

View file

@ -213,152 +213,122 @@ onMounted(() => {
<q-card flat bordered class="q-pa-md">
<q-toolbar class="q-pa-none">
<div class="row q-gutter-sm">
<div>
<datepicker
style="width: 150px"
menu-class-name="modalfix"
v-model="formQuery.year"
:locale="'th'"
autoApply
year-picker
:enableTimePicker="false"
@update:model-value="fetchNewList"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
lazy-rules
outlined
:model-value="
formQuery.year === 0
? 'ทั้งหมด'
: Number(formQuery.year) + 543
"
:label="`${'ปีงบประมาณ'}`"
>
<template v-if="formQuery.year" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="(formQuery.year = 0), fetchNewList()"
class="cursor-pointer"
/>
</template>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<div>
<q-select
dense
outlined
v-model="formQuery.type"
:options="scholarshipTypeOp"
emit-value
map-options
option-value="id"
option-label="name"
label="เลือกประเภททุน"
@update:model-value="fetchNewList"
style="width: 350px"
/>
</div>
<datepicker
style="width: 150px"
menu-class-name="modalfix"
v-model="formQuery.year"
:locale="'th'"
autoApply
year-picker
:enableTimePicker="false"
@update:model-value="fetchNewList"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
lazy-rules
outlined
:model-value="
formQuery.year === 0 ? 'ทั้งหมด' : Number(formQuery.year) + 543
"
:label="`${'ปีงบประมาณ'}`"
>
<template v-if="formQuery.year" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="(formQuery.year = 0), fetchNewList()"
class="cursor-pointer"
/>
</template>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<q-select
dense
outlined
v-model="formQuery.type"
:options="scholarshipTypeOp"
emit-value
map-options
option-value="id"
option-label="name"
label="เลือกประเภททุน"
@update:model-value="fetchNewList"
class="type"
/>
</div>
<q-toolbar-title>
<q-btn
flat
round
dense
icon="add"
color="primary"
@click="onClickAddOrView()"
>
<q-tooltip>เพ</q-tooltip>
</q-btn>
<q-space />
<div class="row q-gutter-sm">
<q-btn
flat
round
dense
icon="add"
color="primary"
@click="onClickAddOrView()"
icon="mdi-arrow-down-bold-circle-outline"
color="blue"
@click="onDownload"
>
<q-tooltip>เพ</q-tooltip>
<q-tooltip>ดาวนโหลด</q-tooltip>
</q-btn>
</q-toolbar-title>
<q-space />
<div class="row q-gutter-sm">
<div>
<q-btn
flat
round
dense
icon="mdi-arrow-down-bold-circle-outline"
color="blue"
@click="onDownload"
>
<q-tooltip>ดาวนโหลด</q-tooltip>
</q-btn>
<!-- <q-btn
flat
round
color="blue"
icon="mdi-arrow-down-bold-circle-outline"
>
<q-menu>
<q-list style="min-width: 100px" dense>
<q-item clickable v-close-popup v-for="items in itemDownload">
<q-item-section avatar>
<q-icon :color="items.color" :name="items.icon" />
</q-item-section>
<q-item-section :class="`text-${items.color}`">{{
items.label
}}</q-item-section>
</q-item>
</q-list>
</q-menu>
<q-tooltip>ดาวนโหลด</q-tooltip>
</q-btn> -->
</div>
<div>
<q-input
standout
dense
v-model="formQuery.keyword"
ref="filterRef"
outlined
placeholder="ค้นหา"
@keyup.enter="fetchNewList()"
>
<template v-slot:append>
<q-icon v-if="formQuery.keyword == ''" name="search" />
<q-icon
v-if="formQuery.keyword !== ''"
name="clear"
class="cursor-pointer"
@click="(formQuery.keyword = ''), fetchNewList()"
/>
</template>
</q-input>
</div>
<div>
<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"
/>
</div>
<q-input
standout
dense
v-model="formQuery.keyword"
ref="filterRef"
outlined
placeholder="ค้นหา"
@keyup.enter="fetchNewList()"
>
<template v-slot:append>
<q-icon v-if="formQuery.keyword == ''" name="search" />
<q-icon
v-if="formQuery.keyword !== ''"
name="clear"
class="cursor-pointer"
@click="(formQuery.keyword = ''), fetchNewList()"
/>
</template>
</q-input>
<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"
/>
</div>
</q-toolbar>
@ -416,4 +386,11 @@ onMounted(() => {
</q-card>
</template>
<style scoped></style>
<style scoped>
.q-select.type >>> .q-field__native > span {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 200px;
}
</style>