ทะเบียนประวัติลูกจ้างชั่วคราว
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490
parent
e2f17237ab
commit
7e6878a1b2
2 changed files with 54 additions and 213 deletions
|
|
@ -1,11 +1,12 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted, watch, ref, reactive } from "vue";
|
||||
import { onMounted, ref, reactive } from "vue";
|
||||
import { checkPermission } from "@/utils/permissions";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useRoute } from "vue-router";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
import type { QTableColumn } from "quasar";
|
||||
import type { FormEmployee } from "@/modules/04_registryPerson/interface/request/Employee";
|
||||
import type {
|
||||
EmployeeHistory,
|
||||
|
|
@ -13,8 +14,7 @@ import type {
|
|||
} from "@/modules/04_registryPerson/interface/response/Employee";
|
||||
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
import type { QTableColumn } from "quasar";
|
||||
import DialogHistory from "@/modules/04_registryPerson/components/detail/DialogHistory.vue";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
|
|
@ -145,9 +145,6 @@ function onSubmit() {
|
|||
|
||||
/** ประวัติข้อมูลลูกจ้างชั่วคราว */
|
||||
const modalHistory = ref<boolean>(false);
|
||||
const filter = ref<string>("");
|
||||
const rows = ref<EmployeeHistory[]>([]);
|
||||
const rowsMain = ref<EmployeeHistory[]>([]);
|
||||
const columns = ref<QTableColumn[]>([
|
||||
{
|
||||
name: "positionEmployeeGroupId",
|
||||
|
|
@ -307,7 +304,7 @@ const columns = ref<QTableColumn[]>([
|
|||
.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
]);
|
||||
const visibleColumns = ref<String[]>([
|
||||
const visibleColumns = ref<string[]>([
|
||||
"positionEmployeeGroupId",
|
||||
"positionEmployeeLineId",
|
||||
"positionEmployeePositionId",
|
||||
|
|
@ -321,38 +318,23 @@ const visibleColumns = ref<String[]>([
|
|||
"lastUpdateFullName",
|
||||
"lastUpdatedAt",
|
||||
]);
|
||||
const pagination = ref({
|
||||
sortBy: "lastUpdatedAt",
|
||||
});
|
||||
|
||||
function onClickHistory() {
|
||||
showLoader();
|
||||
modalHistory.value = true;
|
||||
http
|
||||
.get(config.API.informationHistoryEmployee(profileId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
rows.value = data.sort(
|
||||
(a: any, b: any) =>
|
||||
new Date(b.lastUpdatedAt).getTime() -
|
||||
new Date(a.lastUpdatedAt).getTime()
|
||||
);
|
||||
rowsMain.value = rows.value;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function serchDataTable() {
|
||||
rows.value = onSearchDataTable(
|
||||
filter.value,
|
||||
rowsMain.value,
|
||||
columns.value ? columns.value : []
|
||||
);
|
||||
async function fetchDataHistory() {
|
||||
showLoader();
|
||||
try {
|
||||
const res = await http.get(
|
||||
config.API.informationHistoryEmployee(profileId.value)
|
||||
);
|
||||
return res.data.result;
|
||||
} catch (err) {
|
||||
messageError($q, err);
|
||||
} finally {
|
||||
hideLoader();
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
|
|
@ -635,80 +617,13 @@ onMounted(() => {
|
|||
</q-dialog>
|
||||
|
||||
<!-- Dialog ประวัติการแก้ไขข้อมูลลูกจ้างชั่วคราว -->
|
||||
<q-dialog v-model="modalHistory" persistent>
|
||||
<q-card style="min-width: 80%">
|
||||
<DialogHeader
|
||||
tittle="ประวัติแก้ไขข้อมูลส่วนตัว"
|
||||
:close="() => ((modalHistory = false), (filter = ''), (rows = []))"
|
||||
/>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section style="max-height: 50vh" class="scroll">
|
||||
<div class="row q-gutter-sm q-mb-sm">
|
||||
<q-space />
|
||||
<q-input
|
||||
standout
|
||||
dense
|
||||
v-model="filter"
|
||||
ref="filterRef"
|
||||
outlined
|
||||
placeholder="ค้นหา"
|
||||
@keydown.enter.pervent="serchDataTable"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon name="search" />
|
||||
</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"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<d-table
|
||||
ref="table"
|
||||
flat
|
||||
bordered
|
||||
dense
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
:visible-columns="visibleColumns"
|
||||
v-model:pagination="pagination"
|
||||
>
|
||||
>
|
||||
<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">
|
||||
<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-card-section>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right"> </q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
<DialogHistory
|
||||
v-model:modal="modalHistory"
|
||||
:visible-columns="visibleColumns"
|
||||
:title="`ประวัติแก้ไขข้อมูลส่วนตัว`"
|
||||
:columns="columns"
|
||||
:fetch-data="fetchDataHistory"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import { useQuasar } from "quasar";
|
|||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
import type { QTableProps } from "quasar";
|
||||
import type { QTableColumn } from "quasar";
|
||||
import type {
|
||||
Employment,
|
||||
EmploymentHistory,
|
||||
|
|
@ -14,6 +14,7 @@ import type {
|
|||
import type { FormEmployment } from "@/modules/04_registryPerson/interface/request/Employee";
|
||||
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
import DialogHistory from "@/modules/04_registryPerson/components/detail/DialogHistory.vue";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
|
|
@ -28,6 +29,7 @@ const {
|
|||
hideLoader,
|
||||
showLoader,
|
||||
onSearchDataTable,
|
||||
convertDateToAPI,
|
||||
} = useCounterMixin();
|
||||
|
||||
const profileId = ref<string>(route.params.id.toString());
|
||||
|
|
@ -41,7 +43,8 @@ const isLeave = defineModel<boolean>("isLeave", {
|
|||
const rows = ref<Employment[]>([]);
|
||||
const rowsMain = ref<Employment[]>([]);
|
||||
const filter = ref<string>("");
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
|
||||
const columns = ref<QTableColumn[]>([
|
||||
{
|
||||
name: "date",
|
||||
align: "left",
|
||||
|
|
@ -106,9 +109,6 @@ const visibleColumns = ref<string[]>([
|
|||
const pagination = ref({
|
||||
sortBy: "",
|
||||
});
|
||||
const paginationHistory = ref({
|
||||
sortBy: "lastUpdatedAt",
|
||||
});
|
||||
|
||||
const modalEmployment = ref<boolean>(false);
|
||||
const isEdit = ref<boolean>(false);
|
||||
|
|
@ -186,7 +186,10 @@ function onSubmit() {
|
|||
showLoader();
|
||||
const methods = isEdit.value ? "put" : "post";
|
||||
const id = isEdit.value ? employmentId.value : profileId.value;
|
||||
http[methods](config.API.employmentEmployee(id), formData)
|
||||
http[methods](config.API.employmentEmployee(id), {
|
||||
...formData,
|
||||
date: convertDateToAPI(formData.date),
|
||||
})
|
||||
.then(async () => {
|
||||
await fetchListEmployment();
|
||||
await success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
|
|
@ -224,30 +227,29 @@ function onDeleteEmployment(id: string) {
|
|||
|
||||
/** ประวัติข้อมูลการจ้าง*/
|
||||
const modalHistory = ref<boolean>(false);
|
||||
const rowsHistory = ref<EmploymentHistory[]>([]);
|
||||
const rowsHistoryMain = ref<EmploymentHistory[]>([]);
|
||||
const filterHistory = ref<string>("");
|
||||
const historyId = ref<string>("");
|
||||
|
||||
/**
|
||||
* function เปิด dialog ประวัติการแก้ไขข้อมูลการจ้าง
|
||||
* @param id รายการการจ้าง
|
||||
*/
|
||||
function onClickHistory(id: string) {
|
||||
historyId.value = id;
|
||||
modalHistory.value = true;
|
||||
}
|
||||
|
||||
async function fetchDataHistory() {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.employmentHistoryEmployee(id))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
rowsHistory.value = data;
|
||||
rowsHistoryMain.value = data;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
try {
|
||||
const res = await http.get(
|
||||
config.API.employmentHistoryEmployee(historyId.value)
|
||||
);
|
||||
return res.data.result;
|
||||
} catch (err) {
|
||||
messageError($q, err);
|
||||
} finally {
|
||||
hideLoader();
|
||||
}
|
||||
}
|
||||
|
||||
function serchDataTable() {
|
||||
|
|
@ -258,14 +260,6 @@ function serchDataTable() {
|
|||
);
|
||||
}
|
||||
|
||||
function serchDataTableHistory() {
|
||||
rowsHistory.value = onSearchDataTable(
|
||||
filterHistory.value,
|
||||
rowsHistoryMain.value,
|
||||
columns.value ? columns.value : []
|
||||
);
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
profileId.value && fetchListEmployment();
|
||||
});
|
||||
|
|
@ -462,81 +456,13 @@ onMounted(() => {
|
|||
</q-dialog>
|
||||
|
||||
<!-- Dialog ประวัติการแก้ไขข้อมูลลูกจ้างชั่วคราว -->
|
||||
<q-dialog v-model="modalHistory" persistent>
|
||||
<q-card style="min-width: 80%">
|
||||
<DialogHeader
|
||||
tittle="ประวัติแก้ไขข้อมูลส่วนตัว"
|
||||
:close="
|
||||
() => (
|
||||
(modalHistory = false), (filterHistory = ''), (rowsHistory = [])
|
||||
)
|
||||
"
|
||||
/>
|
||||
<q-separator />
|
||||
|
||||
<q-card-section style="max-height: 50vh" class="scroll">
|
||||
<div class="row q-gutter-sm q-mb-sm">
|
||||
<q-space />
|
||||
<q-input
|
||||
standout
|
||||
dense
|
||||
v-model="filterHistory"
|
||||
outlined
|
||||
placeholder="ค้นหา"
|
||||
@keydown.enter.pervent="serchDataTableHistory"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon name="search" />
|
||||
</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"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<d-table
|
||||
ref="table"
|
||||
flat
|
||||
bordered
|
||||
dense
|
||||
:columns="columns"
|
||||
:rows="rowsHistory"
|
||||
:visible-columns="visibleColumns"
|
||||
v-model:pagination="paginationHistory"
|
||||
>
|
||||
>
|
||||
<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-card-section>
|
||||
|
||||
<q-separator />
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
<DialogHistory
|
||||
v-model:modal="modalHistory"
|
||||
:visible-columns="visibleColumns"
|
||||
:title="`ประวัติแก้ไขข้อมูลการจ้าง`"
|
||||
:columns="columns"
|
||||
:fetch-data="fetchDataHistory"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue