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

Merge branch 'develop' into devTee

Browse source
This commit is contained in:
setthawutttty 2024-12-10 15:01:30 +07:00
commit 838815659e
5 changed files with 313 additions and 279 deletions
Download patch file Download diff file Expand all files Collapse all files

103
src/modules/07_insignia/components/3_result/TabDocuments.vue
View file

@ -17,7 +17,14 @@ import type {
/** use*/ /** use*/
const $q = useQuasar(); const $q = useQuasar();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { success, messageError, hideLoader, dialogConfirm, showLoader } = mixin; const {
success,
messageError,
hideLoader,
dialogConfirm,
showLoader,
onSearchDataTable,
} = mixin;
/** /**
* props * props
@ -36,6 +43,7 @@ const filterKeyword = ref<string>(""); //คำค้นหา
/** คอลัมน์ตาราง*/ /** คอลัมน์ตาราง*/
const rows2 = ref<DataDocuments[]>([]); const rows2 = ref<DataDocuments[]>([]);
const rowsMain = ref<DataDocuments[]>([]);
const colums2 = ref<QTableProps["columns"]>([ const colums2 = ref<QTableProps["columns"]>([
{ {
name: "no", name: "no",
@ -58,13 +66,6 @@ const colums2 = ref<QTableProps["columns"]>([
field: "annotation", field: "annotation",
sortable: true, sortable: true,
}, },
{
name: "file",
align: "left",
label: "ไฟล์เอกสาร",
field: "file",
sortable: false,
},
]); ]);
const visibleColumnsReference = ref<String[]>([ const visibleColumnsReference = ref<String[]>([
"no", "no",
@ -90,6 +91,7 @@ async function getRequest() {
file: item.pathName, file: item.pathName,
}); });
}); });
rowsMain.value = rows2.value;
}) })
.catch((e) => { .catch((e) => {
messageError($q, e); messageError($q, e);
@ -113,7 +115,8 @@ function save() {
dataAppend.append("File", fileUpload.value); dataAppend.append("File", fileUpload.value);
await http await http
.put(config.API.requestDocNote(props.roundId as string), dataAppend) .put(config.API.requestDocNote(props.roundId as string), dataAppend)
.then(() => { .then(async () => {
await getRequest();
success($q, "บันทึกข้อมูลสำเร็จ"); success($q, "บันทึกข้อมูลสำเร็จ");
}) })
.catch((e) => { .catch((e) => {
@ -126,7 +129,6 @@ function save() {
// reset เพื่อไม่ให้ฟอร์มแจ้งเตือ validate หลังบันทึกเสร็จแล้วล้างค่าฟิลด์ต่างๆ // reset เพื่อไม่ให้ฟอร์มแจ้งเตือ validate หลังบันทึกเสร็จแล้วล้างค่าฟิลด์ต่างๆ
myForm.value.reset(); myForm.value.reset();
getRequest();
hideLoader(); hideLoader();
}); });
}); });
@ -134,13 +136,6 @@ function save() {
}); });
} }
/**
* function resetFilter
*/
function resetFilterRef() {
filterKeyword.value = "";
}
const pagination = ref({ const pagination = ref({
sortBy: "filename", sortBy: "filename",
descending: true, descending: true,
@ -148,6 +143,13 @@ const pagination = ref({
rowsPerPage: 10, rowsPerPage: 10,
}); });
function serchDataTable() {
rows2.value = onSearchDataTable(
filterKeyword.value,
rowsMain.value,
colums2.value ? colums2.value : []
);
}
/**hook*/ /**hook*/
onMounted(async () => { onMounted(async () => {
await getRequest(); await getRequest();
@ -217,48 +219,42 @@ onMounted(async () => {
</q-form> </q-form>
</q-card> </q-card>
<div class="row col-12"> <div class="row col-12">
<q-space /> <div class="col-12 row">
<q-input <q-space />
class="col-xs-12 col-sm-3 col-md-2" <div class="row q-col-gutter-sm">
standout <q-input
dense standout
v-model="filterKeyword" dense
outlined v-model="filterKeyword"
debounce="300" outlined
placeholder="ค้นหา" placeholder="ค้นหา"
> @keydown.enter.pervent="serchDataTable"
<template v-slot:append> >
<q-icon v-if="filterKeyword == ''" name="search" /> <template v-slot:append>
<q-icon <q-icon name="search" />
v-if="filterKeyword !== ''" </template>
name="clear" </q-input>
class="cursor-pointer"
@click="resetFilterRef"
/>
</template>
</q-input>
<q-select <q-select
v-model="visibleColumnsReference" v-model="visibleColumnsReference"
multiple multiple
outlined outlined
dense dense
options-dense options-dense
:display-value="$q.lang.table.columns" :display-value="$q.lang.table.columns"
emit-value emit-value
map-options map-options
:options="colums2" :options="colums2"
option-value="name" option-value="name"
style="min-width: 140px"
style="min-width: 140px" />
class="col-xs-12 col-sm-3 col-md-2 q-ml-sm" </div>
/> </div>
</div> </div>
<div class="col-12 q-pt-sm"> <div class="col-12 q-pt-sm">
<d-table <d-table
:columns="colums2" :columns="colums2"
:rows="rows2" :rows="rows2"
:filter="filterKeyword"
row-key="fileName" row-key="fileName"
:visible-columns="visibleColumnsReference" :visible-columns="visibleColumnsReference"
v-model:pagination="pagination" v-model:pagination="pagination"
@ -268,6 +264,7 @@ onMounted(async () => {
<q-th v-for="col in props.cols" :key="col.name" :props="props"> <q-th v-for="col in props.cols" :key="col.name" :props="props">
<span class="text-weight-medium">{{ col.label }}</span> <span class="text-weight-medium">{{ col.label }}</span>
</q-th> </q-th>
<q-th auto-width />
</q-tr> </q-tr>
</template> </template>

115
src/modules/07_insignia/components/4_Allocate/OrgAllocatePageList.vue
View file

@ -24,7 +24,14 @@ import DialogEdit from "@/modules/07_insignia/components/4_Allocate/DialogEdit.v
const router = useRouter(); const router = useRouter();
const DataStore = useAllocateDataStore(); const DataStore = useAllocateDataStore();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { showLoader, hideLoader, messageError, success, dialogRemove } = mixin; const {
showLoader,
hideLoader,
messageError,
success,
dialogRemove,
onSearchDataTable,
} = mixin;
const attrs = ref<any>(useAttrs()); const attrs = ref<any>(useAttrs());
const $q = useQuasar(); //ใช้ noti quasar const $q = useQuasar(); //ใช้ noti quasar
@ -32,6 +39,7 @@ const route = useRoute();
/** ข้อมูล Table*/ /** ข้อมูล Table*/
const rows = ref<ResponseAllocate[]>([]); const rows = ref<ResponseAllocate[]>([]);
const rowsMain = ref<ResponseAllocate[]>([]);
const columns = ref<QTableProps["columns"]>([ const columns = ref<QTableProps["columns"]>([
{ {
name: "no", name: "no",
@ -104,9 +112,7 @@ const stat = ref({
remain: 0, //จำนวนเครื่องราช ฯ คงเหลือ remain: 0, //จำนวนเครื่องราช ฯ คงเหลือ
}); });
/** /** funcion เรียกข้อมูล stat*/
* funcion เรียกข้อมูล stat
*/
async function fetchDashboard() { async function fetchDashboard() {
await http await http
.get(config.API.insigniaManageOrgDashboard(id.value)) .get(config.API.insigniaManageOrgDashboard(id.value))
@ -122,11 +128,8 @@ async function fetchDashboard() {
}); });
} }
/** /** funcion เรียกข้อมูลรายชื่อ หน่วยงานจัดสรรเครื่องราชอิสริยาภรณ์ ตริตาภรณ์มงกุฎไทย ()*/
* funcion เรียกข้อมูลรายชื่อ หน่วยงานจัดสรรเครื่องราชอิสริยาภรณ์ ตริตาภรณ์มงกุฎไทย ()
*/
async function fetchListData() { async function fetchListData() {
// showLoader();
await http await http
.get(config.API.insigniaManageOrg(id.value)) .get(config.API.insigniaManageOrg(id.value))
.then((res) => { .then((res) => {
@ -137,18 +140,14 @@ async function fetchListData() {
allocate: e.allocate, allocate: e.allocate,
remain: e.remain, remain: e.remain,
})); }));
rowsMain.value = rows.value;
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
})
.finally(() => {
// hideLoader();
}); });
} }
/** /** funcion เรียกข้อมูลหน่วยงานจัดสรรเครื่องราชอิสริยาภรณ์*/
* funcion เรียกข้อมูลหน่วยงานจัดสรรเครื่องราชอิสริยาภรณ์
*/
async function fetchOrgList() { async function fetchOrgList() {
http http
.get(config.API.activeOrganization) .get(config.API.activeOrganization)
@ -173,16 +172,12 @@ async function fetchOrgList() {
}); });
} }
/** /** funcion ย้อนกลับหน้าจัดสรรเครื่องราชอิสริยาภรณ์*/
* funcion ย้อนกลับหน้าจัดสรรเครื่องราชอิสริยาภรณ์
*/
function backHistory() { function backHistory() {
router.push(`/insignia/allocate`); router.push(`/insignia/allocate`);
} }
/** /** funcion closePopup*/
* funcion closePopup
*/
function close() { function close() {
modal.value = false; modal.value = false;
modalEdit.value = false; modalEdit.value = false;
@ -278,10 +273,14 @@ function clickAdd() {
/** ค้นหาในตาราง*/ /** ค้นหาในตาราง*/
const filterKeyword = ref<string>(""); const filterKeyword = ref<string>("");
const filterRef = ref<any>(null); const filterRef = ref<any>(null);
const resetFilter = () => {
filterKeyword.value = ""; function serchDataTable() {
filterRef.value.focus(); rows.value = onSearchDataTable(
}; filterKeyword.value,
rowsMain.value,
columns.value ? columns.value : []
);
}
/** Hook*/ /** Hook*/
onMounted(async () => { onMounted(async () => {
@ -332,9 +331,10 @@ onMounted(async () => {
</div> </div>
</div> </div>
</q-card> </q-card>
<q-card flat bordered class="col-12 q-mt-sm q-pa-md"> <q-card flat bordered class="col-12 q-mt-sm q-pa-md">
<div class="row q-col-gutter-sm"> <div class="row q-col-gutter-sm">
<div class="row col-12 q-col-gutter-sm"> <div class="row col-12">
<div> <div>
<q-btn <q-btn
@click="clickAdd()" @click="clickAdd()"
@ -348,49 +348,42 @@ onMounted(async () => {
</q-btn> </q-btn>
</div> </div>
<q-space /> <q-space />
<div class="row q-col-gutter-sm">
<q-input
standout
dense
v-model="filterKeyword"
ref="filterRef"
outlined
@keydown.enter.pervent="serchDataTable"
placeholder="ค้นหา"
>
<template v-slot:append>
<q-icon name="search" />
</template>
</q-input>
<q-input <q-select
class="col-xs-12 col-sm-3 col-md-2" v-model="visibleColumns"
standout multiple
dense outlined
v-model="filterKeyword" dense
ref="filterRef" options-dense
outlined :display-value="$q.lang.table.columns"
debounce="300" emit-value
placeholder="ค้นหา" map-options
> :options="columns"
<template v-slot:append> option-value="name"
<q-icon v-if="filterKeyword == ''" name="search" /> style="min-width: 140px"
<q-icon />
v-if="filterKeyword !== ''" </div>
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</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"
style="min-width: 140px"
class="col-xs-12 col-sm-3 col-md-2"
/>
</div> </div>
<div class="col-12"> <div class="col-12">
<d-table <d-table
ref="table" ref="table"
:columns="columns" :columns="columns"
:rows="rows" :rows="rows"
:filter="filterKeyword"
row-key="id" row-key="id"
flat flat
bordered bordered

182
src/modules/07_insignia/views/03_ResultMain.vue
View file

@ -8,27 +8,22 @@ import { useCounterMixin } from "@/stores/mixin";
import http from "@/plugins/http"; import http from "@/plugins/http";
import config from "@/app.config"; import config from "@/app.config";
/** /** import Type*/
* import Typฃ
*/
import type { QTableProps, QInput } from "quasar"; import type { QTableProps, QInput } from "quasar";
import type { import type {
OptionData, OptionData,
DataPerson, DataPerson,
DataRecord,
} from "@/modules/07_insignia/interface/index/Main"; } from "@/modules/07_insignia/interface/index/Main";
import type { ResponseRound } from "@/modules/07_insignia/interface/response/Main"; import type { ResponseRound } from "@/modules/07_insignia/interface/response/Main";
/** /** import Components*/
* import Components
*/
import DialogHeader from "@/components/DialogHeader.vue"; import DialogHeader from "@/components/DialogHeader.vue";
import Dialogbody from "@/modules/07_insignia/components/3_result/DialogReceive_Return.vue"; //รับ-คืนเครื่องราชฯ import Dialogbody from "@/modules/07_insignia/components/3_result/DialogReceive_Return.vue"; //รับ-คืนเครื่องราชฯ
import DialogForm from "@/modules/07_insignia/components/3_result/DialogResults.vue"; //บันทึกผล import DialogForm from "@/modules/07_insignia/components/3_result/DialogResults.vue"; //บันทึกผล
import fileUploadview from "../components/3_result/TabDocuments.vue"; import fileUploadview from "../components/3_result/TabDocuments.vue";
/** /** use*/
* use
*/
const $q = useQuasar(); const $q = useQuasar();
const DataStore = useResultDataStore(); const DataStore = useResultDataStore();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
@ -39,11 +34,10 @@ const {
hideLoader, hideLoader,
messageError, messageError,
success, success,
onSearchDataTable,
} = mixin; } = mixin;
/** /** ตัวแปร*/
* ตัวแปร
*/
const tab = ref<string>(""); //Tab รายการ const tab = ref<string>(""); //Tab รายการ
const selectRound = ref<string>(""); //รอบการเสนอขอ const selectRound = ref<string>(""); //รอบการเสนอขอ
const selectRoundOption = ref<OptionData[]>([]); //รายการรอบการเสนอขอ const selectRoundOption = ref<OptionData[]>([]); //รายการรอบการเสนอขอ
@ -63,9 +57,8 @@ const dateCheckReceive = ref<string>(); //วันที่รับ
const dateCheckReturn = ref<string>(); //วันที่คืน const dateCheckReturn = ref<string>(); //วันที่คืน
const dataModal = ref<DataPerson>(); //ช้อมูลที่ต้องการ const dataModal = ref<DataPerson>(); //ช้อมูลที่ต้องการ
/** /** ข้อมูล Tabla*/
* ข้อมูล Tabla const rowsMain = ref<DataRecord[]>([]);
*/
const filterRef = ref<QInput>(); const filterRef = ref<QInput>();
const filter = ref<string>(""); const filter = ref<string>("");
const columns = ref<QTableProps["columns"]>([ const columns = ref<QTableProps["columns"]>([
@ -243,9 +236,7 @@ const visibleColumns = ref<String[]>([
"address", "address",
]); ]);
/** /** function เรียกรอบการเสนอขอพระราชทานเครื่องราช*/
*function เรียกรอบการเสนอขอพระราชทานเครื่องราช
*/
async function fecthRound() { async function fecthRound() {
showLoader(); showLoader();
await http await http
@ -269,9 +260,7 @@ async function fecthRound() {
}); });
} }
/** /** function เรียกประเภทเครื่องราช*/
* function เรียกประเภทเครื่องราช
*/
async function fecthInsignia() { async function fecthInsignia() {
await http await http
.get(config.API.insigniaOrg) .get(config.API.insigniaOrg)
@ -284,9 +273,7 @@ async function fecthInsignia() {
}); });
} }
/** /** function เรียกระดับเครื่องราช*/
* function เรียกระดับเครื่องราช
*/
async function fecthInsigniaType() { async function fecthInsigniaType() {
await http(config.API.insigniaTypeOrg) await http(config.API.insigniaTypeOrg)
.then(async (res) => { .then(async (res) => {
@ -300,9 +287,7 @@ async function fecthInsigniaType() {
}); });
} }
/** /** function เลือกประเภทเครื่องราช*/
* function เลือกประเภทเครื่องราช
*/
function selectorInsignia() { function selectorInsignia() {
fecthlistInsignia(); fecthlistInsignia();
} }
@ -318,9 +303,7 @@ function selectorRound(round: string) {
fecthlistInsignia(); fecthlistInsignia();
} }
/** /** function เรียกรายชื่อบันทึกผลการได้รับพระราชทานเครื่องราชอิสริยาภรณ์/การจ่ายใบกำกับ */
* function เรียกรายชื่อบันทึกผลการได้รับพระราชทานเครื่องราชอิสริยาภรณ์/การจ่ายใบกำกับ
*/
async function fecthlistInsignia() { async function fecthlistInsignia() {
showLoader(); showLoader();
let data = { let data = {
@ -332,7 +315,8 @@ async function fecthlistInsignia() {
.post(config.API.noteSearch(), data) .post(config.API.noteSearch(), data)
.then(async (res) => { .then(async (res) => {
let data = await res.data.result; let data = await res.data.result;
DataStore.fetchlistinsignia(data); await DataStore.fetchlistinsignia(data);
rowsMain.value = DataStore.rows;
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
@ -377,25 +361,19 @@ function uploadFile(event: any, action: string) {
} }
} }
/** /** function ปิด popup ทั้งหมด*/
* function ปิด popup ทั้งหมด
*/
function close() { function close() {
modal.value = false; modal.value = false;
ModalDialog.value = false; ModalDialog.value = false;
} }
/** /** function เปิด popup บันทึกผล เพิ่มคน*/
* function เปิด popup บันทึกผล เพิ่มคน
*/
function addData() { function addData() {
modal.value = true; modal.value = true;
action.value = "addData"; action.value = "addData";
} }
/** /** function เปิด popup บันทึกผล แก้ไขข้อมูล*/
* function เปิด popup บันทึกผล แก้ไขข้อมูล
*/
function editData(data: DataPerson) { function editData(data: DataPerson) {
personId.value = data.id; personId.value = data.id;
profileType.value = data.profileType; profileType.value = data.profileType;
@ -403,11 +381,12 @@ function editData(data: DataPerson) {
modal.value = true; modal.value = true;
} }
/** /** ข้อมูล ไฟล์*/
* ข้อมูล ไฟล์
*/
const modelPerview = ref<boolean>(false); const modelPerview = ref<boolean>(false);
const filterPreview = ref<string>("");
const rowspreview = ref<any[]>([]); const rowspreview = ref<any[]>([]);
const rowspreviewMain = ref<any[]>([]);
const typepreview = ref<string>(""); const typepreview = ref<string>("");
const fileInsignia = ref<any>(null); const fileInsignia = ref<any>(null);
@ -449,6 +428,8 @@ function perviewfile(event: any, actionType: string) {
typepay: e.typePayment, typepay: e.typePayment,
address: e.address, address: e.address,
})); }));
rowspreviewMain.value = rowspreview.value;
modelPerview.value = true; modelPerview.value = true;
}) })
.catch((err) => { .catch((err) => {
@ -462,13 +443,11 @@ function perviewfile(event: any, actionType: string) {
function closeDialogPerview() { function closeDialogPerview() {
modelPerview.value = false; modelPerview.value = false;
filterPreview.value = "";
rowspreview.value = [];
rowspreviewMain.value = [];
} }
const resetFilter = () => {
filter.value = "";
filterRef.value!.focus();
};
/** /**
* function เปิด popup รับ-คืนเครื่องราชฯ * function เปิด popup รับ-คืนเครื่องราชฯ
* @param data ข้อมูลที่ต้องการแก่้ไข * @param data ข้อมูลที่ต้องการแก่้ไข
@ -539,12 +518,29 @@ const paginationLabel = (start: number, end: number, total: number) => {
else return start + "-" + end + " ใน " + total; else return start + "-" + end + " ใน " + total;
}; };
function serchDataTable() {
DataStore.rows = onSearchDataTable(
filter.value,
rowsMain.value,
columns.value ? columns.value : []
);
}
function serchDataTableDailog() {
rowspreview.value = onSearchDataTable(
filterPreview.value,
rowspreviewMain.value,
columns.value ? columns.value : []
);
}
/** /**
* callback function จำทำงานเมื่อ tab มีการเปลี่ยนแปลง * callback function จำทำงานเมื่อ tab มีการเปลี่ยนแปลง
*/ */
watch(tab, () => { watch(tab, () => {
if (tab.value !== "doc") { if (tab.value !== "doc") {
DataStore.rows = []; DataStore.rows = [];
rowsMain.value = [];
DataStore.insignia = ""; DataStore.insignia = "";
fecthlistInsignia(); fecthlistInsignia();
insigniaTypeOption.value = DataStore.insigniaOp.filter( insigniaTypeOption.value = DataStore.insigniaOp.filter(
@ -735,19 +731,13 @@ onMounted(() => {
v-model="filter" v-model="filter"
ref="filterRef" ref="filterRef"
outlined outlined
debounce="300"
placeholder="ค้นหา" placeholder="ค้นหา"
style="max-width: 200px" style="max-width: 200px"
class="q-ml-sm" class="q-ml-sm"
@keydown.enter.pervent="serchDataTable"
> >
<template v-slot:append> <template v-slot:append>
<q-icon v-if="filter == ''" name="search" /> <q-icon name="search" />
<q-icon
v-if="filter !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template> </template>
</q-input> </q-input>
<!-- แสดงคอลัมน์ใน table --> <!-- แสดงคอลัมน์ใน table -->
@ -879,7 +869,6 @@ onMounted(() => {
:rows="DataStore.rows" :rows="DataStore.rows"
:columns="columns" :columns="columns"
:visible-columns="visibleColumns" :visible-columns="visibleColumns"
:filter="filter"
row-key="name" row-key="name"
:pagination-label="paginationLabel" :pagination-label="paginationLabel"
v-model:pagination="pagination" v-model:pagination="pagination"
@ -979,32 +968,67 @@ onMounted(() => {
<!-- ยืนยันรายการข้อมูล --> <!-- ยืนยันรายการข้อมูล -->
<q-dialog v-model="modelPerview" persistent> <q-dialog v-model="modelPerview" persistent>
<q-card style="min-width: 80vw"> <q-card style="min-width: 80%">
<DialogHeader tittle="ยืนยันรายการข้อมูล" :close="closeDialogPerview" /> <DialogHeader tittle="ยืนยันรายการข้อมูล" :close="closeDialogPerview" />
<q-card-section class="q-pt-none"> <q-separator />
<d-table <q-card-section>
:rows="rowspreview" <div class="row col-12 q-col-gutter-sm">
:columns="columns" <div class="row col-12">
:visible-columns="visibleColumns" <q-space />
:filter="filter" <div class="row q-col-gutter-sm">
row-key="name" <q-input
> dense
<template v-slot:body-cell="props"> outlined
<q-td :props="props"> v-model="filterPreview"
<div v-if="props.col.name == 'no'"> label="ค้นหา"
{{ props.rowIndex + 1 }} @keydown.enter.pervent="serchDataTableDailog"
</div> >
<div v-else> <template v-slot:append>
{{ props.value ? props.value : "-" }} <q-icon name="search" />
</div> </template>
</q-td> </q-input>
</template>
</d-table> <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"
style="min-width: 140px"
/>
</div>
</div>
<div class="col-12">
<d-table
:rows="rowspreview"
:columns="columns"
:visible-columns="visibleColumns"
row-key="name"
>
<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 ? props.value : "-" }}
</div>
</q-td>
</template>
</d-table>
</div>
</div>
</q-card-section> </q-card-section>
<q-card-actions align="right" class="text-primary"> <q-separator />
<q-card-actions align="right">
<q-btn <q-btn
unelevated unelevated
dense
color="public" color="public"
label="บันทึก" label="บันทึก"
@click="uploadFile(fileInsignia, typepreview)" @click="uploadFile(fileInsignia, typepreview)"

35
src/modules/07_insignia/views/04_AllocateMain.vue
View file

@ -24,7 +24,14 @@ import { useCounterMixin } from "@/stores/mixin";
import { useAllocateDataStore } from "@/modules/07_insignia/storeAllocate"; import { useAllocateDataStore } from "@/modules/07_insignia/storeAllocate";
const DataStore = useAllocateDataStore(); const DataStore = useAllocateDataStore();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { showLoader, hideLoader, messageError, dialogRemove, success } = mixin; const {
showLoader,
hideLoader,
messageError,
dialogRemove,
success,
onSearchDataTable,
} = mixin;
const $q = useQuasar(); const $q = useQuasar();
const attrs = ref<any>(useAttrs()); const attrs = ref<any>(useAttrs());
@ -42,6 +49,7 @@ const loadView = ref<boolean>(false); //แสดงข้อมูล
/** ข้อมูล Table*/ /** ข้อมูล Table*/
const filterRef = ref<QInput>(); const filterRef = ref<QInput>();
const filter = ref<string>(""); const filter = ref<string>("");
const rowsMain = ref<any[]>([]);
const rowData = ref<DataAllocate>(); //ข้อมูลที่ต้องการแก้ไข const rowData = ref<DataAllocate>(); //ข้อมูลที่ต้องการแก้ไข
const columns = ref<QTableProps["columns"]>([ const columns = ref<QTableProps["columns"]>([
{ {
@ -204,7 +212,8 @@ async function fecthlistInsignia() {
.get(config.API.insigniaManageType(tab.value, Number(roundYear.value))) .get(config.API.insigniaManageType(tab.value, Number(roundYear.value)))
.then(async (res) => { .then(async (res) => {
let data = await res.data.result; let data = await res.data.result;
DataStore.listinsignia(data); await DataStore.listinsignia(data);
rowsMain.value = DataStore.rows;
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
@ -351,7 +360,6 @@ function filterSelector(val: string, update: Function, name: string) {
update(() => { update(() => {
const needle = val.toLowerCase(); const needle = val.toLowerCase();
if (name === "filterInsigniaOp") { if (name === "filterInsigniaOp") {
DataStore.insignia = val ? (undefined as any) : DataStore.insignia;
filterInsigniaOp.value = insigniaOp.value.filter( filterInsigniaOp.value = insigniaOp.value.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1 (v: any) => v.name.toLowerCase().indexOf(needle) > -1
); );
@ -370,6 +378,14 @@ function clearInsigniaFilters(name: string) {
} }
} }
function serchDataTable() {
DataStore.rows = onSearchDataTable(
filter.value,
rowsMain.value,
columns.value ? columns.value : []
);
}
/** /**
* function callback ทำงานเมื่อ Tab มีการเปลี่ยน * function callback ทำงานเมื่อ Tab มีการเปลี่ยน
*/ */
@ -466,6 +482,8 @@ onMounted(async () => {
option-value="id" option-value="id"
:readonly="false" :readonly="false"
use-input use-input
hide-selected
fill-input
:borderless="false" :borderless="false"
style="min-width: 350px" style="min-width: 350px"
@update:model-value=" @update:model-value="
@ -522,19 +540,13 @@ onMounted(async () => {
v-model="filter" v-model="filter"
ref="filterRef" ref="filterRef"
outlined outlined
debounce="300" @keydown.enter.pervent="serchDataTable"
placeholder="ค้นหา" placeholder="ค้นหา"
style="max-width: 200px" style="max-width: 200px"
class="q-ml-sm" class="q-ml-sm"
> >
<template v-slot:append> <template v-slot:append>
<q-icon v-if="filter == ''" name="search" /> <q-icon name="search" />
<q-icon
v-if="filter !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template> </template>
</q-input> </q-input>
<!-- แสดงคอลัมน์ใน table --> <!-- แสดงคอลัมน์ใน table -->
@ -558,7 +570,6 @@ onMounted(async () => {
ref="table" ref="table"
:columns="columns" :columns="columns"
:rows="DataStore.rows" :rows="DataStore.rows"
:filter="filter"
row-key="id" row-key="id"
flat flat
bordered bordered

157
src/modules/07_insignia/views/05_BorrowMain.vue
View file

@ -19,7 +19,7 @@ import DialogForm from "@/modules/07_insignia/components/5_Borrow/DialogForm.vue
const $q = useQuasar(); const $q = useQuasar();
const DataStore = useBrrowDataStore(); const DataStore = useBrrowDataStore();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { showLoader, hideLoader, messageError } = mixin; const { showLoader, hideLoader, messageError, onSearchDataTable } = mixin;
const tab = ref<string>(""); const tab = ref<string>("");
@ -239,6 +239,7 @@ const columns = ref<QTableProps["columns"]>([
]); ]);
const filterRef = ref<QInput>(); const filterRef = ref<QInput>();
const filter = ref<string>(""); const filter = ref<string>("");
const rowsMain = ref<any[]>([]);
const pagination = ref({ const pagination = ref({
sortBy: "name", sortBy: "name",
descending: false, descending: false,
@ -317,17 +318,15 @@ async function fecthRound() {
async function fecthInsignia() { async function fecthInsignia() {
await http await http
.get(config.API.insigniaOrg) .get(config.API.insigniaOrg)
.then((res) => { .then(async (res) => {
let data = res.data.result; let data = res.data.result;
DataStore.fetchDataInsignia(data); await DataStore.fetchDataInsignia(data);
insigniaList.value = DataStore.insigniaOp.filter(
(x: any) => x.type == tab.value || x.type == ""
);
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
})
.finally(async () => {
insigniaList.value = await DataStore.insigniaOp.filter(
(x: any) => x.type == tab.value || x.type == ""
);
}); });
} }
@ -371,6 +370,7 @@ async function fecthlistInsignia() {
) )
.then(async (res) => { .then(async (res) => {
await DataStore.fetchlistinsignia(res.data.result); await DataStore.fetchlistinsignia(res.data.result);
rowsMain.value = DataStore.rows;
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
@ -429,17 +429,14 @@ function filterSelector(val: string, update: Function, name: string) {
update(() => { update(() => {
const needle = val.toLowerCase(); const needle = val.toLowerCase();
if (name === "employeeClassOps") { if (name === "employeeClassOps") {
// DataStore.employeeClass = "";
employeeClassOps.value = DataStore.employeeClassOps.filter( employeeClassOps.value = DataStore.employeeClassOps.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1 (v: any) => v.name.toLowerCase().indexOf(needle) > -1
); );
} else if (name === "fileterInsigniaList") { } else if (name === "fileterInsigniaList") {
// DataStore.insignia = null as any;
fileterInsigniaList.value = insigniaList.value.filter( fileterInsigniaList.value = insigniaList.value.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1 (v: any) => v.name.toLowerCase().indexOf(needle) > -1
); );
} else if (name === "filterSelectRoundAllOption") { } else if (name === "filterSelectRoundAllOption") {
// yearRound.value = null as any;
filterSelectRoundAllOption.value = selectRoundAllOption.value.filter( filterSelectRoundAllOption.value = selectRoundAllOption.value.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1 (v: any) => v.name.toLowerCase().indexOf(needle) > -1
); );
@ -447,12 +444,22 @@ function filterSelector(val: string, update: Function, name: string) {
}); });
} }
function serchDataTable() {
DataStore.rows = onSearchDataTable(
filter.value,
rowsMain.value,
columns.value ? columns.value : []
);
}
/** function callblack ทำงานเมือมีการเปลี่ยน Tab*/ /** function callblack ทำงานเมือมีการเปลี่ยน Tab*/
watch(tab, async () => { watch(tab, async () => {
insigniaList.value = await DataStore.insigniaOp.filter( insigniaList.value = await DataStore.insigniaOp.filter(
(x: any) => x.type == tab.value || x.type == "" (x: any) => x.type == tab.value || x.type == ""
); );
DataStore.insignia = ""; DataStore.insignia = "";
filter.value = "";
rowsMain.value = [];
fileterInsigniaList.value = insigniaList.value; fileterInsigniaList.value = insigniaList.value;
fecthlistInsignia(); fecthlistInsignia();
}); });
@ -495,71 +502,70 @@ onMounted(async () => {
> >
<div class="row col-12"> <div class="row col-12">
<div class="row col-12 q-col-gutter-sm"> <div class="row col-12 q-col-gutter-sm">
<q-select <div>
v-model="yearRound" <q-select
dense v-model="yearRound"
outlined dense
lazy-rules outlined
hide-bottom-space lazy-rules
:label="`${'รอบการเสนอขอเครื่องราชฯ'}`" hide-bottom-space
emit-value :label="`${'รอบการเสนอขอเครื่องราชฯ'}`"
map-options emit-value
use-input map-options
option-label="name" use-input
:options="filterSelectRoundAllOption" hide-selected
option-value="year" fill-input
:borderless="false" option-label="name"
style="min-width: 150px" :options="filterSelectRoundAllOption"
@update:model-value="selectorRound" option-value="year"
@filter="(inputValue: any, :borderless="false"
style="width: 340px"
@update:model-value="selectorRound"
@filter="(inputValue: string,
doneFn: Function) => filterSelector(inputValue, doneFn, 'filterSelectRoundAllOption' doneFn: Function) => filterSelector(inputValue, doneFn, 'filterSelectRoundAllOption'
)" )"
> >
<template v-slot:no-option> <template v-slot:no-option>
<q-item> <q-item>
<q-item-section class="text-grey"> <q-item-section class="text-grey">
ไม่มีข้อมูล ไม่มีข้อมูล
</q-item-section> </q-item-section>
</q-item> </q-item>
</template> </template>
</q-select> </q-select>
</div>
<q-space /> <q-space />
<q-input <div class="row q-col-gutter-sm">
class="col-xs-12 col-sm-3 col-md-2" <q-input
standout standout
dense dense
v-model="filter" v-model="filter"
ref="filterRef" ref="filterRef"
outlined outlined
debounce="300" placeholder="ค้นหา"
placeholder="ค้นหา" @keydown.enter.pervent="serchDataTable"
> >
<template v-slot:append> <template v-slot:append>
<q-icon v-if="filter == ''" name="search" /> <q-icon name="search" />
<q-icon </template>
v-if="filter !== ''" </q-input>
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template>
</q-input>
<q-select <q-select
v-model="visibleColumns" v-model="visibleColumns"
multiple multiple
outlined outlined
dense dense
options-dense options-dense
:display-value="$q.lang.table.columns" :display-value="$q.lang.table.columns"
emit-value emit-value
map-options map-options
:options="columns" :options="columns"
option-value="name" option-value="name"
style="min-width: 140px" style="min-width: 140px"
class="col-xs-12 col-sm-3 col-md-2" />
/> </div>
</div> </div>
<q-card bordered class="q-pa-sm col-12 bg-grey-1 q-mt-sm"> <q-card bordered class="q-pa-sm col-12 bg-grey-1 q-mt-sm">
@ -569,6 +575,8 @@ onMounted(async () => {
dense dense
outlined outlined
use-input use-input
hide-selected
fill-input
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
:label="`${'เครื่องราชฯ'}`" :label="`${'เครื่องราชฯ'}`"
@ -586,7 +594,7 @@ onMounted(async () => {
DataStore.employeeClass DataStore.employeeClass
) )
" "
@filter="(inputValue: any, @filter="(inputValue: string,
doneFn: Function) => filterSelector(inputValue, doneFn, 'fileterInsigniaList' doneFn: Function) => filterSelector(inputValue, doneFn, 'fileterInsigniaList'
)" )"
> >
@ -611,6 +619,8 @@ onMounted(async () => {
:label="`${'สถานภาพ'}`" :label="`${'สถานภาพ'}`"
emit-value emit-value
use-input use-input
hide-selected
fill-input
map-options map-options
option-label="name" option-label="name"
:options="employeeClassOps" :options="employeeClassOps"
@ -624,7 +634,7 @@ onMounted(async () => {
DataStore.employeeClass DataStore.employeeClass
) )
" "
@filter="(inputValue: any, @filter="(inputValue: string,
doneFn: Function) => filterSelector(inputValue, doneFn, 'employeeClassOps' doneFn: Function) => filterSelector(inputValue, doneFn, 'employeeClassOps'
)" )"
> >
@ -663,7 +673,6 @@ onMounted(async () => {
:rows="DataStore.rows" :rows="DataStore.rows"
:columns="columns" :columns="columns"
:visible-columns="visibleColumns" :visible-columns="visibleColumns"
:filter="filter"
row-key="id" row-key="id"
v-model:pagination="pagination" v-model:pagination="pagination"
:paging="true" :paging="true"