แก้ dialog history

This commit is contained in:
Warunee Tamkoo 2024-04-01 15:05:14 +07:00
parent 4678b77f0b
commit ac846a66f4

View file

@ -779,99 +779,93 @@ onMounted(async () => {
style="height: 80vh; min-width: 80%" style="height: 80vh; min-width: 80%"
class="bg-white" class="bg-white"
> >
<q-form @submit.prevent greedy @validation-success="onSubmit()"> <q-header>
<q-header> <q-toolbar>
<q-toolbar> <DialogHeader
<DialogHeader tittle="ประวัติแก้ไขข้อมูลส่วนตัว"
tittle="ประวัติแก้ไขข้อมูลส่วนตัว" :close="() => (modalHistory = false)"
:close="() => (modalHistory = false)" />
/> </q-toolbar>
</q-toolbar> <q-separator color="grey-4" />
<q-separator color="grey-4" /> </q-header>
</q-header>
<q-page-container> <q-page-container>
<q-page class="q-pa-md"> <q-page class="q-pa-md">
<div class="row q-gutter-sm q-mb-sm"> <div class="row q-gutter-sm q-mb-sm">
<q-space /> <q-space />
<q-input <q-input
standout standout
dense
v-model="filterHistory"
ref="filterRef"
outlined
placeholder="ค้นหา"
debounce="300"
>
<template v-slot:append>
<q-icon
v-if="filterHistory == ''"
name="search"
@click.stop.prevent="filterHistory = ''"
class="cursor-pointer"
/>
<q-icon
v-if="filterHistory"
name="cancel"
@click.stop.prevent="filterHistory = ''"
class="cursor-pointer"
/>
</template>
</q-input>
<q-select
v-model="visibleColumnsHistory"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columnsHistory"
option-value="name"
options-cover
style="min-width: 150px"
/>
</div>
<d-table
ref="table"
flat
bordered
dense dense
:columns="columnsHistory" v-model="filterHistory"
:rows="rowsHistory" ref="filterRef"
class="custom-header-table" outlined
v-model:pagination="pagination" placeholder="ค้นหา"
:rows-per-page-options="[10, 25, 50, 100]" debounce="300"
:visible-columns="visibleColumnsHistory"
:filter="filterHistory"
> >
> <template v-slot:append>
<template v-slot:header="props"> <q-icon
<q-tr :props="props"> v-if="filterHistory == ''"
<q-th name="search"
v-for="col in props.cols" @click.stop.prevent="filterHistory = ''"
:key="col.name" class="cursor-pointer"
:props="props" />
> <q-icon
<span class="text-weight-medium">{{ col.label }}</span> v-if="filterHistory"
</q-th> name="cancel"
</q-tr> @click.stop.prevent="filterHistory = ''"
class="cursor-pointer"
/>
</template> </template>
<template v-slot:body="props"> </q-input>
<q-tr :props="props" class="cursor-pointer"> <q-select
<q-td v-for="col in props.cols" :key="col.id"> v-model="visibleColumnsHistory"
<div> multiple
{{ col.value ? col.value : "-" }} outlined
</div> dense
</q-td> options-dense
</q-tr> :display-value="$q.lang.table.columns"
</template> emit-value
</d-table> map-options
</q-page> :options="columnsHistory"
</q-page-container> option-value="name"
</q-form> options-cover
style="min-width: 150px"
/>
</div>
<d-table
ref="table"
flat
bordered
dense
:columns="columnsHistory"
:rows="rowsHistory"
class="custom-header-table"
v-model:pagination="pagination"
:rows-per-page-options="[10, 25, 50, 100]"
:visible-columns="visibleColumnsHistory"
:filter="filterHistory"
>
>
<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-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td v-for="col in props.cols" :key="col.id">
<div>
{{ col.value ? col.value : "-" }}
</div>
</q-td>
</q-tr>
</template>
</d-table>
</q-page>
</q-page-container>
</q-layout> </q-layout>
</q-dialog> </q-dialog>
</template> </template>