View Table ทะเบียนประวัติ
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490
parent
49cd5e7f6f
commit
e279f2fbb0
7 changed files with 160 additions and 173 deletions
|
|
@ -799,6 +799,17 @@ onMounted(async () => {
|
|||
<div class="q-pa-xs col-xs-12 col-sm-4 col-md-3">
|
||||
<q-card flat bordered>
|
||||
<q-card-actions class="bg-grey-3" align="right">
|
||||
<q-btn
|
||||
v-if="props.row.isUpload"
|
||||
color="green"
|
||||
flat
|
||||
dense
|
||||
round
|
||||
icon="mdi-file-document-outline"
|
||||
@click="onDownloadFile(props.row.id)"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
|
|
|
|||
|
|
@ -596,6 +596,17 @@ onMounted(() => {
|
|||
<div class="q-pa-xs col-xs-12 col-sm-4 col-md-3">
|
||||
<q-card flat bordered>
|
||||
<q-card-actions align="right" class="bg-grey-3">
|
||||
<q-btn
|
||||
v-if="props.row.isUpload == true"
|
||||
color="green"
|
||||
flat
|
||||
dense
|
||||
round
|
||||
icon="mdi-file-document-outline"
|
||||
@click="onDownloadFile(props.row.id)"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
color="deep-purple"
|
||||
icon="mdi-history"
|
||||
|
|
|
|||
|
|
@ -325,7 +325,6 @@ onMounted(() => {
|
|||
</template>
|
||||
</q-input>
|
||||
<q-select
|
||||
v-if="mode == 'table'"
|
||||
v-model="visibleColumns"
|
||||
multiple
|
||||
outlined
|
||||
|
|
@ -371,7 +370,6 @@ onMounted(() => {
|
|||
</div>
|
||||
|
||||
<d-table
|
||||
:card-container-class="mode === 'card' ? 'q-col-gutter-md' : ''"
|
||||
:grid="mode === 'card'"
|
||||
ref="table"
|
||||
row-key="id"
|
||||
|
|
@ -438,86 +436,60 @@ onMounted(() => {
|
|||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:item="props" v-else>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-card flat bordered class="q-pa-none">
|
||||
<div class="row bg-grey-3">
|
||||
<q-space />
|
||||
<div>
|
||||
<q-btn
|
||||
color="deep-purple"
|
||||
icon="mdi-history"
|
||||
flat
|
||||
round
|
||||
@click.stop.prevent="showHistoryDialog(props.row.id)"
|
||||
>
|
||||
<q-tooltip>ประวัติแก้ไขรักษาการในตำแหน่ง</q-tooltip>
|
||||
</q-btn>
|
||||
<div class="q-pa-xs col-xs-12 col-sm-4 col-md-3">
|
||||
<q-card flat bordered>
|
||||
<q-card-actions align="right" class="bg-grey-3">
|
||||
<q-btn
|
||||
color="deep-purple"
|
||||
icon="mdi-history"
|
||||
flat
|
||||
round
|
||||
@click.stop.prevent="showHistoryDialog(props.row.id)"
|
||||
>
|
||||
<q-tooltip>ประวัติแก้ไขรักษาการในตำแหน่ง</q-tooltip>
|
||||
</q-btn>
|
||||
|
||||
<q-btn
|
||||
v-if="
|
||||
isLeave === false && checkPermission($route)?.attrIsUpdate
|
||||
"
|
||||
:color="props.row.commandId ? 'grey-5' : 'edit'"
|
||||
:disable="props.row.commandId !== null"
|
||||
icon="edit"
|
||||
flat
|
||||
round
|
||||
@click.stop.prevent="openEditDialog(props.row)"
|
||||
>
|
||||
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
<q-btn
|
||||
v-if="isLeave === false && checkPermission($route)?.attrIsUpdate"
|
||||
:color="props.row.commandId ? 'grey-5' : 'edit'"
|
||||
:disable="props.row.commandId !== null"
|
||||
icon="edit"
|
||||
flat
|
||||
round
|
||||
@click.stop.prevent="openEditDialog(props.row)"
|
||||
>
|
||||
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
<q-separator />
|
||||
<q-card-section class="q-pa-none">
|
||||
<div class="row q-pa-sm">
|
||||
<div class="col-3 text-grey-6 text-weight-medium">
|
||||
วันที่เริ่มต้น
|
||||
|
||||
<q-list>
|
||||
<div
|
||||
:class="`row q-pa-sm`"
|
||||
:style="`background-color: ${index % 2 !== 0 ? '#FAFAFA' : ''}`"
|
||||
v-for="(col, index) in props.cols"
|
||||
:key="col.name"
|
||||
>
|
||||
<div class="col text-grey-6">
|
||||
<div>{{ col.label }}</div>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
{{ props.row.dateStart ? date2Thai(props.row.dateStart) : "-" }}
|
||||
</div>
|
||||
<div class="col-3 text-grey-6 text-weight-medium">
|
||||
วันที่สิ้นสุด
|
||||
</div>
|
||||
<div class="col-3">
|
||||
{{ props.row.dateEnd ? date2Thai(props.row.dateEnd) : "-" }}
|
||||
<div class="col">
|
||||
<div
|
||||
v-if="col.name == 'refCommandNo' && props.row.commandId"
|
||||
@click="col.value ? openViewCommand(props.row) : null"
|
||||
:class="
|
||||
col.value
|
||||
? 'table_ellipsis text-blue cursor-pointer'
|
||||
: 'table_ellipsis'
|
||||
"
|
||||
>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
<q-tooltip v-if="col.value">ดูคำสั่ง</q-tooltip>
|
||||
</div>
|
||||
<div v-else>{{ col.value ? col.value : "-" }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
<div class="row q-pa-sm bg-grey-2">
|
||||
<div class="col-3 text-grey-6 text-weight-medium">
|
||||
{{ empType === "" ? "เลขที่ตำแหน่ง" : "ตำแหน่งเลขที่" }}
|
||||
</div>
|
||||
<div class="col-3">
|
||||
{{ props.row.posNo ? props.row.posNo : "-" }}
|
||||
</div>
|
||||
<div class="col-3 text-grey-6 text-weight-medium">ตำแหน่ง</div>
|
||||
<div class="col-3">
|
||||
{{ props.row.position ? props.row.position : "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
<div class="row q-pa-sm">
|
||||
<div class="col-3 text-grey-6 text-weight-medium">
|
||||
เลขที่คำสั่ง
|
||||
</div>
|
||||
<div
|
||||
v-if="props.row.commandId"
|
||||
@click="openViewCommand(props.row)"
|
||||
class="col-3 text-blue"
|
||||
>
|
||||
{{ props.row.refCommandNo }}
|
||||
<q-tooltip v-if="props.row.commandId">ดูคำสั่ง</q-tooltip>
|
||||
</div>
|
||||
<div class="col-3" v-else>-</div>
|
||||
<div class="col-3 text-grey-6 text-weight-medium">สถานะ</div>
|
||||
<div class="col-3">
|
||||
{{ props.row.status ? "ใช้งาน" : "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
</q-card-section>
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -469,7 +469,6 @@ onMounted(() => {
|
|||
</template>
|
||||
</q-input>
|
||||
<q-select
|
||||
v-if="mode == 'table'"
|
||||
v-model="visibleColumns"
|
||||
multiple
|
||||
outlined
|
||||
|
|
@ -515,7 +514,6 @@ onMounted(() => {
|
|||
</div>
|
||||
|
||||
<d-table
|
||||
:card-container-class="mode === 'card' ? 'q-col-gutter-md' : ''"
|
||||
:grid="mode === 'card'"
|
||||
ref="table"
|
||||
row-key="id"
|
||||
|
|
@ -616,102 +614,86 @@ onMounted(() => {
|
|||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:item="props" v-else>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<q-card flat bordered class="q-pa-none">
|
||||
<div class="row bg-grey-3">
|
||||
<q-space />
|
||||
<div>
|
||||
<q-btn
|
||||
color="deep-purple"
|
||||
icon="mdi-history"
|
||||
flat
|
||||
round
|
||||
@click.stop.prevent="showHistoryDialog(props.row.id)"
|
||||
>
|
||||
<q-tooltip>ประวัติแก้ไขรายการช่วยราชการ</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
|
||||
:color="props.row.commandId ? 'grey-5' : 'edit'"
|
||||
:disable="props.row.commandId !== null"
|
||||
icon="edit"
|
||||
flat
|
||||
round
|
||||
@click.stop.prevent="openEditDialog(props.row)"
|
||||
>
|
||||
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
v-if="checkPermission($route)?.attrIsUpdate"
|
||||
flat
|
||||
dense
|
||||
round
|
||||
:color="
|
||||
!props.row.refId || props.row.status !== 'PENDING'
|
||||
? 'grey-5'
|
||||
: 'primary'
|
||||
"
|
||||
:disable="!props.row.refId || props.row.status !== 'PENDING'"
|
||||
icon="mdi-account-arrow-left-outline"
|
||||
@click.stop.prevent="onReturner(props.row.refId)"
|
||||
>
|
||||
<q-tooltip>ส่งตัวกลับ</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
<q-card-section class="q-pa-none">
|
||||
<div class="row q-pa-sm">
|
||||
<div class="col-3 text-grey-6 text-weight-medium">
|
||||
หน่วยงานที่ให้ช่วยราชการ
|
||||
</div>
|
||||
<div class="col-9">
|
||||
{{ props.row.agency ? props.row.agency : "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row q-pa-sm bg-grey-2">
|
||||
<div class="col-3 text-grey-6 text-weight-medium">
|
||||
วันที่เริ่มต้น
|
||||
</div>
|
||||
<div class="col-3">
|
||||
{{ props.row.dateStart ? date2Thai(props.row.dateStart) : "-" }}
|
||||
</div>
|
||||
<div class="col-3 text-grey-6 text-weight-medium">
|
||||
วันที่สิ้นสุด
|
||||
</div>
|
||||
<div class="col-3">
|
||||
{{ props.row.dateEnd ? date2Thai(props.row.dateEnd) : "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
<div class="row q-pa-sm">
|
||||
<div class="col-3 text-grey-6 text-weight-medium">
|
||||
เลขที่คำสั่ง
|
||||
</div>
|
||||
<div
|
||||
v-if="props.row.commandId"
|
||||
@click="openViewCommand(props.row)"
|
||||
class="col-9 text-blue"
|
||||
>
|
||||
{{ props.row.commandNo }}
|
||||
<q-tooltip v-if="props.row.commandId">ดูคำสั่ง</q-tooltip>
|
||||
</div>
|
||||
<div class="q-pa-xs col-xs-12 col-sm-4 col-md-3">
|
||||
<q-card flat bordered>
|
||||
<q-card-actions align="right" class="bg-grey-3">
|
||||
<q-btn
|
||||
flat
|
||||
dense
|
||||
round
|
||||
color="green"
|
||||
icon="mdi-file-document-outline"
|
||||
v-if="props.row.isUpload"
|
||||
@click="onDownloadFile(props.row.id)"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
color="deep-purple"
|
||||
icon="mdi-history"
|
||||
flat
|
||||
round
|
||||
@click.stop.prevent="showHistoryDialog(props.row.id)"
|
||||
>
|
||||
<q-tooltip>ประวัติแก้ไขรายการช่วยราชการ</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
|
||||
:color="props.row.commandId ? 'grey-5' : 'edit'"
|
||||
:disable="props.row.commandId !== null"
|
||||
icon="edit"
|
||||
flat
|
||||
round
|
||||
@click.stop.prevent="openEditDialog(props.row)"
|
||||
>
|
||||
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
v-if="checkPermission($route)?.attrIsUpdate"
|
||||
flat
|
||||
dense
|
||||
round
|
||||
:color="
|
||||
!props.row.refId || props.row.status !== 'PENDING'
|
||||
? 'grey-5'
|
||||
: 'primary'
|
||||
"
|
||||
:disable="!props.row.refId || props.row.status !== 'PENDING'"
|
||||
icon="mdi-account-arrow-left-outline"
|
||||
@click.stop.prevent="onReturner(props.row.refId)"
|
||||
>
|
||||
<q-tooltip>ส่งตัวกลับ</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
|
||||
<div class="col-9" v-else>
|
||||
{{ props.row.commandNo ? props.row.commandNo : "-" }}
|
||||
<q-separator />
|
||||
<q-list>
|
||||
<div
|
||||
:class="`row q-pa-sm`"
|
||||
:style="`background-color: ${index % 2 !== 0 ? '#FAFAFA' : ''}`"
|
||||
v-for="(col, index) in props.cols"
|
||||
:key="col.name"
|
||||
>
|
||||
<div class="col text-grey-6">
|
||||
<div>{{ col.label }}</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div
|
||||
v-if="col.name == 'commandNo' && props.row.commandId"
|
||||
@click="col.value ? openViewCommand(props.row) : null"
|
||||
:class="
|
||||
col.value
|
||||
? 'table_ellipsis text-blue cursor-pointer'
|
||||
: 'table_ellipsis'
|
||||
"
|
||||
>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
<q-tooltip v-if="col.value">ดูคำสั่ง</q-tooltip>
|
||||
</div>
|
||||
<div v-else>{{ col.value ? col.value : "-" }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
<div class="row q-pa-sm">
|
||||
<div class="col-3 text-grey-6 text-weight-medium">
|
||||
เอกสารอ้างอิง
|
||||
</div>
|
||||
<div class="col-9">
|
||||
{{ props.row.document ? props.row.document : "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
</q-card-section>
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -503,6 +503,7 @@ onMounted(async () => {
|
|||
|
||||
<q-td auto-width>
|
||||
<q-btn
|
||||
v-if="props.row.documentId !== null"
|
||||
color="green"
|
||||
flat
|
||||
dense
|
||||
|
|
|
|||
|
|
@ -552,6 +552,17 @@ onMounted(() => {
|
|||
<div class="q-pa-xs col-xs-12 col-sm-4 col-md-3">
|
||||
<q-card bordered>
|
||||
<q-card-actions align="right" class="bg-grey-3">
|
||||
<q-btn
|
||||
v-if="props.row.isUpload == true"
|
||||
color="green"
|
||||
flat
|
||||
dense
|
||||
round
|
||||
icon="mdi-file-document-outline"
|
||||
@click="onDownloadFile(props.row.id)"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
|
|
|
|||
|
|
@ -369,7 +369,6 @@ onMounted(() => {
|
|||
</template>
|
||||
</q-input>
|
||||
<q-select
|
||||
v-if="modelView == 'table'"
|
||||
v-model="visibleColumns"
|
||||
multiple
|
||||
outlined
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue