ออกคำสั่ง step01
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490
parent
3a7f1ee950
commit
f8772e460f
2 changed files with 345 additions and 72 deletions
|
|
@ -32,13 +32,14 @@ onUnmounted(() => {
|
|||
});
|
||||
|
||||
const nextStep = async () => {
|
||||
stepper.value!.next();
|
||||
// stepper.value!.next();
|
||||
|
||||
localStorage.setItem("currentStep", step.value.toString());
|
||||
if (orderId.value) {
|
||||
await http
|
||||
.put(config.API.nextStep(orderId.value))
|
||||
.then(() => {
|
||||
router.push(`/order/detail/${orderId.value}?step=${step.value}`);
|
||||
router.push(`/order/detail/${orderId.value}?step=${step.value + 1}`);
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
|
|
@ -46,13 +47,13 @@ const nextStep = async () => {
|
|||
}
|
||||
};
|
||||
const previousStep = async () => {
|
||||
stepper.value!.previous();
|
||||
// stepper.value!.previous();
|
||||
localStorage.setItem("currentStep", step.value.toString());
|
||||
if (orderId.value) {
|
||||
await http
|
||||
.put(config.API.prevStep(orderId.value))
|
||||
.then(() => {
|
||||
router.push(`/order/detail/${orderId.value}?step=${step.value}`);
|
||||
router.push(`/order/detail/${orderId.value}?step=${step.value - 1}`);
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
|
|
@ -62,7 +63,6 @@ const previousStep = async () => {
|
|||
const destroyLocalStorage = () => {
|
||||
localStorage.clear();
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
// console.log("route query===>", route.query)
|
||||
if (route.query.step) {
|
||||
|
|
@ -79,7 +79,7 @@ onMounted(() => {
|
|||
|
||||
if (orderId_params !== undefined) {
|
||||
orderId.value = orderId_params.toString();
|
||||
// console.log(orderId.value);
|
||||
// console.log("orderId.value");
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -10,6 +10,11 @@ import { useQuasar } from "quasar";
|
|||
import { useRoute, useRouter } from "vue-router";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import type { treeTab } from "@/modules/05_placement/interface/index/Main";
|
||||
import type { ResponseOrganiz } from "@/modules/05_placement/interface/response/Order";
|
||||
import type { QTableProps } from "quasar";
|
||||
|
||||
import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const {
|
||||
|
|
@ -19,6 +24,7 @@ const {
|
|||
hideLoader,
|
||||
success,
|
||||
dialogConfirm,
|
||||
dialogMessageNotify,
|
||||
} = mixin;
|
||||
const $q = useQuasar(); //ใช้ noti quasar
|
||||
const route = useRoute();
|
||||
|
|
@ -60,66 +66,17 @@ const examRound = ref<string>("");
|
|||
const examRoundOption = ref<DataOption1[]>([]);
|
||||
const conclusionRegisterNo = ref<string>("");
|
||||
const conclusionRegisterDate = ref<Date>(new Date());
|
||||
// const registerOption = ref<DataOption1[]>([
|
||||
// {
|
||||
// name: "รับสมคัรสอบ ครั้งที่ 1",
|
||||
// id: "3fa85f64-5717-4562-b3fc-2c963f66afa6",
|
||||
// },
|
||||
// ]);
|
||||
|
||||
const conclusionResultNo = ref<string>("");
|
||||
const conclusionResultDate = ref<Date>(new Date());
|
||||
// const announceOption = ref<DataOption1[]>([
|
||||
// {
|
||||
// name: "ผลการสอบแข่งขั้น ครั้งที่ 1",
|
||||
// id: "3fa85f64-5717-4562-b3fc-2c963f66afa6",
|
||||
// },
|
||||
// ]);
|
||||
|
||||
// C-PM-05 - 06
|
||||
const conclusion1 = ref<string>("");
|
||||
const conclusionDate1 = ref<Date>(new Date());
|
||||
const conclusion1Option = ref<DataOption1[]>([
|
||||
{ name: "ครั้งที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
const conclusion2 = ref<string>("");
|
||||
const conclusionDate2 = ref<Date>(new Date());
|
||||
const conclusion2Option = ref<DataOption1[]>([
|
||||
{ name: "ครั้งที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
const meeting = ref<string>("");
|
||||
const dateMeeting = ref<Date>(new Date());
|
||||
const meetingOption = ref<DataOption1[]>([
|
||||
{ name: "การประชุมครั้งที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
|
||||
// C-PM-07
|
||||
const conclusionRelocation1 = ref<string>("");
|
||||
const conclusionRelocationDate1 = ref<Date>(new Date());
|
||||
const RelocationOption1 = ref<DataOption1[]>([
|
||||
{ name: "ครั้งที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
const conclusionRelocation2 = ref<string>("");
|
||||
const conclusionRelocationDate2 = ref<Date>(new Date());
|
||||
const RelocationOption2 = ref<DataOption1[]>([
|
||||
{ name: "ครั้งที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
|
||||
// C-PM-08 && 14
|
||||
const conclusion = ref<string>("");
|
||||
const conclusionDate = ref<Date>(new Date());
|
||||
const conclusionOption = ref<DataOption1[]>([
|
||||
{ name: "ครั้งที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
const conclusionLeave = ref<string>("");
|
||||
const conclusionLeaveDate = ref<Date>(new Date());
|
||||
const LeaveOption = ref<DataOption1[]>([
|
||||
{ name: "ครั้งที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
const conclusionReceive = ref<string>("");
|
||||
const conclusionReceiveDate = ref<Date>(new Date());
|
||||
const ReceiveOption = ref<DataOption1[]>([
|
||||
{ name: "ครั้งที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
// C-PM-08
|
||||
const conclusionReturnNo = ref<string>("");
|
||||
const conclusionReturnDate = ref<Date>(new Date());
|
||||
|
||||
// C-PM-09
|
||||
const organizations = ref<string>("");
|
||||
|
|
@ -138,6 +95,7 @@ const bookOption = ref<DataOption1[]>([
|
|||
]);
|
||||
|
||||
// C-PM-10
|
||||
const dialogVisible = ref<boolean>(false);
|
||||
const organizationsOld = ref<string>("");
|
||||
const organizationsOldOption = ref<DataOption1[]>([
|
||||
{ name: "หน่วยงานที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
|
|
@ -193,6 +151,8 @@ const receiveOcOption = ref<DataOption1[]>([
|
|||
]);
|
||||
// C-PM-14
|
||||
const transferOrganizationName = ref<string>("");
|
||||
const conclusionReceive = ref<string>("");
|
||||
const conclusionReceiveDate = ref<Date>(new Date());
|
||||
|
||||
// C-PM-16
|
||||
const orderNumber = ref<string>();
|
||||
|
|
@ -260,10 +220,10 @@ const fetchdetailOrder = async () => {
|
|||
await http
|
||||
.get(config.API.detailOrder(orderIdString))
|
||||
.then((res: any) => {
|
||||
console.log(res);
|
||||
// console.log(res);
|
||||
|
||||
const data = res.data.result;
|
||||
console.log(data);
|
||||
// console.log(data);
|
||||
typeOrder.value = typeOrderOption.value.find(
|
||||
(e) => e.id === data.orderTypeValue
|
||||
);
|
||||
|
|
@ -286,17 +246,20 @@ const fetchdetailOrder = async () => {
|
|||
dateMeeting.value = data.conclusionMeetingDate;
|
||||
|
||||
// 08
|
||||
conclusionReceive.value = data.conclusionReturnNo;
|
||||
conclusionReceiveDate.value = data.conclusionReturnDate;
|
||||
conclusionReturnNo.value = data.conclusionReturnNo;
|
||||
conclusionReturnDate.value = data.conclusionReturnDate;
|
||||
|
||||
//09
|
||||
organizations.value = data.sourceOrganizationName;
|
||||
order.value = data.conclusionReturnNo;
|
||||
orderDate.value = data.conclusionReturnDate;
|
||||
book.value = data.militaryCommandNo;
|
||||
bookDate.value = data.militaryCommandDate;
|
||||
bookDate.value = data.militaryCommanDate;
|
||||
|
||||
//10
|
||||
if (data.orderTypeCode === "c-pm-10") {
|
||||
nodeTree();
|
||||
}
|
||||
organizationsOld.value = data.placementCommandIssuer;
|
||||
orderOld.value = data.placementCommandNo;
|
||||
orderOldDate.value = data.placementCommandDate;
|
||||
|
|
@ -356,6 +319,9 @@ const fecthCommand = async () => {
|
|||
};
|
||||
const selectCMP = (selectOrder: any) => {
|
||||
fecthExamRoundOption(selectOrder.commandCode);
|
||||
if (selectOrder.commandCode === "C-PM-10") {
|
||||
nodeTree();
|
||||
}
|
||||
//01-04
|
||||
examRound.value = "";
|
||||
conclusionRegisterNo.value = "";
|
||||
|
|
@ -422,6 +388,8 @@ const submit = async () => {
|
|||
let signBy = null;
|
||||
if (!nameCommand.value.length) {
|
||||
signBy = await nameCommand.value.name;
|
||||
} else if (nameCommand.value !== "") {
|
||||
signBy = await nameCommand.value;
|
||||
} else {
|
||||
const name2 = await CommandOption.value.find(
|
||||
(x: any) => x.name == nameCommand.value
|
||||
|
|
@ -429,6 +397,7 @@ const submit = async () => {
|
|||
signBy = await name2?.name;
|
||||
console.log("signBy", signBy);
|
||||
}
|
||||
console.log(signBy);
|
||||
|
||||
const orderByOrganizationName = await byOrderOption.value.find(
|
||||
(x: any) => x.id == byOrder.value
|
||||
|
|
@ -470,8 +439,8 @@ const submit = async () => {
|
|||
});
|
||||
} else if (typeOrder.value.commandCode == "C-PM-08") {
|
||||
Object.assign(formdata, {
|
||||
conclusionReturnNo: conclusionReceive.value,
|
||||
conclusionReturnDate: conclusionReceiveDate.value,
|
||||
conclusionReturnNo: conclusionReturnNo.value,
|
||||
conclusionReturnDate: conclusionReturnDate.value,
|
||||
});
|
||||
} else if (typeOrder.value.commandCode == "C-PM-09") {
|
||||
Object.assign(formdata, {
|
||||
|
|
@ -582,6 +551,120 @@ const updateOrder = async (formData: Object, orderId: string, type: string) => {
|
|||
hideLoader();
|
||||
});
|
||||
};
|
||||
// dialog 10
|
||||
const search = ref<string>("");
|
||||
const nodesTree = ref<treeTab[]>([]);
|
||||
const expanded = ref<string[]>([]);
|
||||
const selected = ref<string>("");
|
||||
const selectedModal = ref<ResponseOrganiz[]>([]);
|
||||
const visibleColumnsModal = ref<String[]>(["no", "idCard", "name", "position"]);
|
||||
const columnsModal = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "no",
|
||||
align: "left",
|
||||
label: "ลำดับ",
|
||||
field: "no",
|
||||
sortable: true,
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "idCard",
|
||||
align: "left",
|
||||
label: "เลขประจำตัวประชาชน",
|
||||
field: "idCard",
|
||||
sortable: true,
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "name",
|
||||
align: "left",
|
||||
label: "ชื่อ-สกุล",
|
||||
field: "name",
|
||||
sortable: true,
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "position",
|
||||
align: "left",
|
||||
label: "ตำแหน่ง",
|
||||
field: "position",
|
||||
sortable: true,
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
]);
|
||||
const rowsModal = ref<ResponseOrganiz[]>([]);
|
||||
const clickAction = ref<string>("");
|
||||
const filterModal = ref<string>("");
|
||||
const nodeTree = async () => {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.profileOrganizRoot)
|
||||
.then((res: any) => {
|
||||
const data = res.data.result;
|
||||
nodesTree.value = data;
|
||||
if (data.length > 0) {
|
||||
expanded.value = [data[0].id];
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
};
|
||||
const onSelected = async (id: string) => {
|
||||
await listModal(id);
|
||||
};
|
||||
const listModal = async (id: string) => {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.copyOrderPersonsId(id))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
let list: ResponseOrganiz[] = [];
|
||||
data.map((r: ResponseOrganiz) => {
|
||||
list.push({
|
||||
firstName: r.firstName ?? "",
|
||||
idCard: r.idCard ?? "",
|
||||
lastName: r.lastName ?? "",
|
||||
name: r.name ?? "",
|
||||
position: r.position ?? "",
|
||||
prefixId: r.prefixId ?? "",
|
||||
profileId: r.profileId ?? "",
|
||||
unit: r.unit ?? "",
|
||||
});
|
||||
});
|
||||
rowsModal.value = list;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
hideLoader();
|
||||
});
|
||||
};
|
||||
const openDialog = (action: string) => {
|
||||
dialogVisible.value = true;
|
||||
clickAction.value = action;
|
||||
selectedModal.value = [];
|
||||
};
|
||||
const clickSavelist = () => {
|
||||
if (selectedModal.value.length > 0) {
|
||||
if (clickAction.value === "chairman") {
|
||||
chairman.value = selectedModal.value[0].name;
|
||||
} else if (clickAction.value === "director") {
|
||||
director.value = selectedModal.value[0].name;
|
||||
} else if (clickAction.value === "director2") {
|
||||
director2.value = selectedModal.value[0].name;
|
||||
}
|
||||
dialogVisible.value = false;
|
||||
} else dialogMessageNotify($q, "โปรดเลือกรายชื่อ");
|
||||
};
|
||||
|
||||
/**
|
||||
* class จัดรูปแบบแสดงระหว่างข้อมูลที่แก้ไขหรือแสดงเฉยๆ
|
||||
|
|
@ -729,7 +812,10 @@ const getClass = (val: boolean) => {
|
|||
@update:model-value="(nameCommand = ''), (positionCommand = '')"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<div
|
||||
class="col-xs-12 col-md-6"
|
||||
v-if="byOrder !== '00000000-0000-0000-0000-000000000000'"
|
||||
>
|
||||
<selector
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
|
|
@ -766,7 +852,10 @@ const getClass = (val: boolean) => {
|
|||
hide-bottom-space
|
||||
/> -->
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<div
|
||||
class="col-xs-12 col-md-6"
|
||||
v-if="byOrder !== '00000000-0000-0000-0000-000000000000'"
|
||||
>
|
||||
<q-input
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
|
|
@ -779,6 +868,36 @@ const getClass = (val: boolean) => {
|
|||
disable
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="col-xs-12 col-md-6"
|
||||
v-if="byOrder == '00000000-0000-0000-0000-000000000000'"
|
||||
>
|
||||
<q-input
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="nameCommand"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกผู้มีอำนาจลงนาม'}`]"
|
||||
:label="`${'ผู้มีอำนาจลงนาม'}`"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="col-xs-12 col-md-6"
|
||||
v-if="byOrder == '00000000-0000-0000-0000-000000000000'"
|
||||
>
|
||||
<q-input
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="positionCommand"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งผู้มีอำนาจลงนาม'}`]"
|
||||
:label="`${'ตำแหน่งผู้มีอำนาจลงนาม'}`"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-separator v-if="typeOrder.commandCode" />
|
||||
</div>
|
||||
|
|
@ -1354,7 +1473,7 @@ const getClass = (val: boolean) => {
|
|||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="conclusionReceive"
|
||||
v-model="conclusionReturnNo"
|
||||
:rules="[
|
||||
(val) =>
|
||||
!!val ||
|
||||
|
|
@ -1372,7 +1491,7 @@ const getClass = (val: boolean) => {
|
|||
<div class="col-xs-12 col-md-6">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="conclusionReceiveDate"
|
||||
v-model="conclusionReturnDate"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
borderless
|
||||
|
|
@ -1391,8 +1510,8 @@ const getClass = (val: boolean) => {
|
|||
dense
|
||||
class="full-width datepicker"
|
||||
:model-value="
|
||||
conclusionReceiveDate != null
|
||||
? date2Thai(conclusionReceiveDate)
|
||||
conclusionReturnDate != null
|
||||
? date2Thai(conclusionReturnDate)
|
||||
: null
|
||||
"
|
||||
:label="`${'ลงวันที่ '}`"
|
||||
|
|
@ -1811,6 +1930,7 @@ const getClass = (val: boolean) => {
|
|||
:rules="[(val) => !!val || `${'กรุณากรอกชื่อประธาน'}`]"
|
||||
:label="`${'ประธาน'}`"
|
||||
hide-bottom-space
|
||||
@click="openDialog('chairman')"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-4">
|
||||
|
|
@ -1840,6 +1960,7 @@ const getClass = (val: boolean) => {
|
|||
:rules="[(val) => !!val || `${'กรุณากรอกชื่อกรรมการ'}`]"
|
||||
:label="`${'กรรมการ'}`"
|
||||
hide-bottom-space
|
||||
@click="openDialog('director')"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-4">
|
||||
|
|
@ -1869,6 +1990,7 @@ const getClass = (val: boolean) => {
|
|||
:rules="[(val) => !!val || `${'กรุณากรอกชื่อกรรมการ'}`]"
|
||||
:label="`${'กรรมการ'}`"
|
||||
hide-bottom-space
|
||||
@click="openDialog('director2')"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -2247,10 +2369,161 @@ const getClass = (val: boolean) => {
|
|||
<q-tooltip>บันทึก</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
|
||||
<q-dialog v-model="dialogVisible">
|
||||
<q-card style="width: 900px; max-width: 80vw">
|
||||
<DialogHeader tittle="เลือกรายชื่อตามหน่วยงาน" v-close-popup />
|
||||
<q-separator />
|
||||
<q-card-section class="q-pa-sm bg-grey-1">
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-xs-12 col-sm-5 row">
|
||||
<q-card flat bordered class="fit q-pa-sm">
|
||||
<q-scroll-area visible style="height: 70vh">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
v-model="search"
|
||||
placeholder="ค้นหา"
|
||||
class="q-mb-sm"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon name="mdi-magnify" />
|
||||
</template>
|
||||
</q-input>
|
||||
<q-tree
|
||||
:nodes="nodesTree"
|
||||
dense
|
||||
node-key="id"
|
||||
:filter="search"
|
||||
v-model:selected="selected"
|
||||
v-model:expanded="expanded"
|
||||
no-selection-unset
|
||||
selected-color="primary"
|
||||
@update:selected="onSelected"
|
||||
default-expand-all
|
||||
/>
|
||||
</q-scroll-area>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-7">
|
||||
<div class="col-12 row q-py-sm items-center">
|
||||
<q-space />
|
||||
<div class="items-center" style="display: flex">
|
||||
<q-input
|
||||
standout
|
||||
dense
|
||||
v-model="filterModal"
|
||||
ref="filterRef"
|
||||
outlined
|
||||
debounce="300"
|
||||
placeholder="ค้นหา"
|
||||
style="max-width: 200px"
|
||||
class="q-ml-sm"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon v-if="filterModal == ''" name="search" />
|
||||
<q-icon
|
||||
v-if="filterModal !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
|
||||
<!-- <q-select
|
||||
v-model="visibleColumnsModal"
|
||||
:display-value="$q.lang.table.columns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
:options="columnsModal"
|
||||
options-dense
|
||||
option-value="name"
|
||||
map-options
|
||||
emit-value
|
||||
style="min-width: 150px"
|
||||
class="gt-xs q-ml-sm"
|
||||
/> -->
|
||||
</div>
|
||||
</div>
|
||||
<d-table
|
||||
:rows="rowsModal"
|
||||
:columns="columnsModal"
|
||||
:visible-columns="visibleColumnsModal"
|
||||
row-key="profileId"
|
||||
selection="single"
|
||||
v-model:selected="selectedModal"
|
||||
no-data-label="ไม่มีข้อมูล"
|
||||
:filter="filterModal"
|
||||
>
|
||||
<template v-slot:body-selection="scope">
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
v-model="scope.selected"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<template v-slot:body-cell="props">
|
||||
<q-td :props="props">
|
||||
<div v-if="props.col.name == 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
|
||||
<div v-else>
|
||||
{{ props.value }}
|
||||
</div>
|
||||
</q-td>
|
||||
</template>
|
||||
</d-table>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
color="public"
|
||||
@click="clickSavelist"
|
||||
class="q-px-md"
|
||||
/>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.q-field--with-bottom {
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
.custom-header-table {
|
||||
max-height: 64vh;
|
||||
|
||||
.q-table tr:nth-child(odd) td {
|
||||
background: white;
|
||||
}
|
||||
|
||||
.q-table tr:nth-child(even) td {
|
||||
background: #f8f8f8;
|
||||
}
|
||||
|
||||
.q-table thead tr {
|
||||
background: #ecebeb;
|
||||
}
|
||||
|
||||
.q-table thead tr th {
|
||||
position: sticky;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.q-table thead tr:last-child th {
|
||||
top: 48px;
|
||||
}
|
||||
|
||||
.q-table thead tr:first-child th {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue