hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

ทะเบียนประวัติ: ปรับ table&card

Browse source
This commit is contained in:
puriphatt 2024-03-14 15:07:28 +07:00
parent 0f1b7cafcf
commit ffa0992e2d
2 changed files with 208 additions and 240 deletions
Download patch file Download diff file Expand all files Collapse all files

180
src/modules/04_registryNew/components/detail/PersonalInformation/02_NameChangeHistory.vue
View file

@ -275,106 +275,94 @@ onMounted(async () => {
});
</script>
<template>
<div class="row justify-end items-center">
<div class="toptitle row">
<q-input
dense
outlined
debounce="300"
ref="filterRef"
v-model="filterSearch"
placeholder="ค้นหา"
style="max-width: 200px"
>
<template v-slot:append>
<q-icon name="search" v-if="filterSearch == ''" />
<q-icon
name="clear"
v-if="filterSearch !== ''"
@click="filterSearch = ''"
class="cursor-pointer"
/>
</template>
</q-input>
<q-select
dense
multiple
outlined
emit-value
map-options
options-dense
option-value="name"
v-model="visibleColumns"
:options="columns"
class="q-ml-sm"
style="min-width: 150px"
:display-value="$q.lang.table.columns"
/>
</div>
</div>
<div>
<q-table
flat
<q-toolbar style="padding: 0px" class="text-primary row justify-end">
<q-input
dense
bordered
virtual-scroll
ref="table"
v-bind="attrs"
class="custom-header-table"
:rows="rows"
:columns="columns"
:filter="filterSearch"
:rows-per-page-options="[0]"
:pagination="initialPagination"
:visible-columns="visibleColumns"
:pagination-label="paginationLabel"
:virtual-scroll-sticky-size-start="48"
outlined
label="ค้นหา"
class="q-mr-sm"
v-model="filterSearch"
>
<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 v-slot:append>
<q-icon name="search" />
</template>
</q-input>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td v-for="(col, index) in props.cols" :key="col.name">
<div v-if="col.name == 'status'" class="table_ellipsis">
{{ typeChangeName(col.value) }}
</div>
<div v-else class="table_ellipsis">
{{ col.value }}
</div>
</q-td>
<q-td auto-width>
<q-btn
v-if="props.row.file != null"
color="green"
flat
dense
round
size="14px"
icon="mdi-file-document-outline"
@click="openFile(props.row.file)"
/>
<q-btn
color="info"
flat
dense
round
size="14px"
icon="mdi-history"
@click="clickHistory(props.row)"
/>
</q-td>
</q-tr>
</template>
</q-table>
</div>
<q-select
dense
multiple
outlined
emit-value
map-options
options-cover
options-dense
option-value="name"
style="min-width: 150px"
v-model="visibleColumns"
:options="columns"
:display-value="$q.lang.table.columns"
/>
</q-toolbar>
<d-table
flat
dense
bordered
virtual-scroll
ref="table"
v-bind="attrs"
:rows="rows"
:columns="columns"
:filter="filterSearch"
:rows-per-page-options="[0]"
:pagination="initialPagination"
:visible-columns="visibleColumns"
:pagination-label="paginationLabel"
:virtual-scroll-sticky-size-start="48"
>
<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 v-for="(col, index) in props.cols" :key="col.name">
<div v-if="col.name == 'status'" class="table_ellipsis">
{{ typeChangeName(col.value) }}
</div>
<div v-else class="table_ellipsis">
{{ col.value }}
</div>
</q-td>
<q-td auto-width>
<q-btn
v-if="props.row.file != null"
color="green"
flat
dense
round
size="14px"
icon="mdi-file-document-outline"
@click="openFile(props.row.file)"
/>
<q-btn
color="info"
flat
dense
round
size="14px"
icon="mdi-history"
@click="clickHistory(props.row)"
/>
</q-td>
</q-tr>
</template>
</d-table>
<history-table
:rows="rowsHistory"