Merge branch 'develop' into nice_dev

# Conflicts:
#	src/modules/10_order/components/Main.vue
#	src/modules/10_order/components/step/step04.vue
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2023-09-22 10:50:43 +07:00
commit b2884c9b9c
7 changed files with 622 additions and 34 deletions

View file

@ -469,7 +469,7 @@
</div>
<div class="col-12 q-mt-lg" v-if="announcementExam">
<div class="text-bold text-subtitle2 q-pb-md">
เลอกวการชำระเง
เลอกวการชำระเง
</div>
<div class="row col-12 q-gutter-y-md q-mb-md">
<q-list dense bordered class="col-12 rounded-borders">
@ -479,6 +479,7 @@
val="payment1"
color="blue"
class="q-mr-md"
:disable="fee <= 0"
/>
<q-item-section avatar>
<q-avatar size="28px">
@ -500,6 +501,7 @@
val="payment2"
color="blue"
class="q-mr-md"
:disable="fee <= 0"
/>
<q-item-section avatar>
<q-icon name="mdi-cash" color="positive" size="33px" />
@ -1129,14 +1131,20 @@ const columnsPosition = ref<QTableProps["columns"]>([
},
]);
watch(organizationShortName, (count: DataOption, prevCount: DataOption) => {
watch(organizationShortName, (count: any, prevCount: any) => {
organizationNameOptions.value = [];
});
watch(organizationName, (count: DataOption, prevCount: DataOption) => {
watch(organizationName, (count: any, prevCount: any) => {
positionPathOptions.value = [];
});
watch(fee, (count: any, prevCount: any) => {
if (fee.value <= 0) {
pay.value = "";
}
});
onMounted(async () => {
hideLoader();
if (route.params.id != undefined) {

View file

@ -77,7 +77,6 @@ const fecthOther = async () => {
title.value.organizationPositionOld = data.organizationPositionOld ?? "-";
title.value.positionLevelOld = data.positionLevelOld ?? "-";
title.value.positionTypeOld = data.positionTypeOld ?? "-";
responseData.value.profileId = data.profileId;
responseData.value.createdAt = data.createdAt;
responseData.value.date = data.date !== null ? new Date(data.date) : new Date();
@ -141,7 +140,6 @@ const saveOther = async () => {
})
.catch((e) => {
messageError($q, e);
console.log(e);
})
.finally(async () => {
await fecthOther();
@ -156,7 +154,6 @@ const getClass = (val: boolean) => {
onMounted(async () => {
if (keycloak.tokenParsed != null) {
roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
console.log("roleAdmin===>", roleAdmin.value);
}
await fecthOther();
});

View file

@ -5,6 +5,7 @@ import { useRouter } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import { useTransferDataStore } from "@/modules/05_placement/store"
import type { QTableProps } from "quasar";
import type { listMain,listMainAPI,OpType } from "@/modules/05_placement/interface/response/OhterMain"
import http from "@/plugins/http";
import config from "@/app.config";
@ -18,11 +19,11 @@ const { showLoader, hideLoader, success, messageError, date2Thai, dialogRemove }
const $q = useQuasar();
const router = useRouter();
const optionsType = ref<any[]>([]);
const optionsType = ref<OpType[]>([]);
const type = ref<string>("");
const modal = ref<boolean>(false);
const rows = ref<any>([]);
const rows2 = ref<any>([]);
const rows = ref<listMain[]>([]);
const rows2 = ref<listMain[]>([]);
const filterKeyword = ref<string>("");
const filterKeyword2 = ref<string>("");
@ -108,31 +109,31 @@ const fecthlistOthet = async () => {
.get(config.API.otherMain())
.then((res) => {
let response = res.data.result;
rows.value = response.map((r: any) => ({
rows.value = response.map((r: listMainAPI) => ({
createdAt: date2Thai(r.createdAt),
date: new Date(),
firstName: r.firstname ?? "",
personalId: r.id ?? "",
firstName: r.firstname ?? "-",
personalId: r.id ?? "-",
isActive: r.isActive ? r.isActive : false,
lastName: r.lastname ?? "",
organization: r.organization ?? "",
organizationPositionOld: r.organizationPositionOld ?? "",
posNo: r.posNo ?? "",
position: r.position ?? "",
positionLevel: r.positionLevel ?? "",
positionLevelOld: r.positionLevelOld ?? "",
positionNumberOld: r.positionNumberOld ?? "",
positionTypeOld: r.positionTypeOld ?? "",
prefix: r.prefix ?? "",
reason: r.reason ?? "",
lastName: r.lastname ?? "-",
organization: r.organization ?? "-",
organizationPositionOld: r.organizationPositionOld ?? "-",
posNo: r.posNo ?? "-",
position: r.position ?? "-",
positionLevel: r.positionLevel ?? "-",
positionLevelOld: r.positionLevelOld ?? "-",
positionNumberOld: r.positionNumberOld ?? "-",
positionTypeOld: r.positionTypeOld ?? "-",
prefix: r.prefix ?? "-",
reason: r.reason ?? "-",
salary: r.salary ? r.salary : 0,
status: r.status ?? "",
status: r.status ?? "-",
statustext: statusText(r.status ?? ""),
fullname: `${r.prefix ?? ""}${r.firstname ?? ""} ${r.lastname ?? ""}`,
}));
rows2.value = rows.value.filter(
(e: any) =>
e.orgName !== null && e.status !== "REPORT" && e.status !== "DONE"
(e: listMain) =>
e.status !== "REPORT" && e.status !== "DONE"
);
})
.catch((e) => {
@ -150,7 +151,7 @@ const fecthTypeOption = async () => {
.get(config.API.typeOrder())
.then((res) => {
optionsType.value = res.data.result.filter(
(e: any) => e.commandCode === "C-PM-08" || e.commandCode === "C-PM-09"
(e: OpType) => e.commandCode === "C-PM-08" || e.commandCode === "C-PM-09"
);
})
.catch((e) => {
@ -203,9 +204,9 @@ const clickDelete = (id: string) => {
dialogRemove($q, () => deleteOther(id));
};
//----()------//
const nextPage = (row: any) => {
const nextPage = (id: string) => {
router.push({
path: `/other/detail/${row.personalId}`,
path: `/other/detail/${id}`,
});
};
@ -276,7 +277,7 @@ onMounted(() => {
<q-tr
:props="props"
class="cursor-pointer"
@click="nextPage(props.row)"
@click="nextPage(props.row.personalId)"
>
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}

View file

@ -0,0 +1,54 @@
// ข้อมูลที่เก็บ
interface listMain {
personalId:string
fullname:string
prefix:string
firstName:string
lastName:string
date:Date
isActive:boolean
organization:string
organizationPositionOld:string
posNo:string
position:string
positionLevel:string
positionLevelOld:string
positionNumberOld:string
positionTypeOld:string
reason:string
salary:number
status:string
statustext:string
createdAt:Date
}
//ข้อมูลจาก api
interface listMainAPI {
id:string
firstname:string
prefix:string
firstName:string
lastname:string
date:Date
isActive:boolean
organization:string
organizationPositionOld:string
posNo:string
position:string
positionLevel:string
positionLevelOld:string
positionNumberOld:string
positionTypeOld:string
reason:string
salary:number
status:string
statustext:string
createdAt:Date
}
interface OpType {
commandCode:string
}
export type {
listMain,
listMainAPI,
OpType
}

View file

@ -469,6 +469,9 @@ const viewFileUpload = async (url: string) => {
v-close-popup
@click="downloadCover('pdf')"
>
<!-- type="a"
:href="orderCoverPdf"
target="_blank" -->
<q-item-section avatar
><q-icon color="red" name="mdi-file-pdf"
/></q-item-section>
@ -479,6 +482,9 @@ const viewFileUpload = async (url: string) => {
v-close-popup
@click="downloadCover('docx')"
>
<!-- type="a"
:href="orderCoverDocs"
target="_blank" -->
<q-item-section avatar
><q-icon color="blue" name="mdi-file-word"
/></q-item-section>
@ -520,6 +526,9 @@ const viewFileUpload = async (url: string) => {
v-close-popup
@click="downloadAttachment('pdf')"
>
<!-- type="a"
:href="orderAttachmentPdf"
target="_blank" -->
<q-item-section avatar
><q-icon color="red" name="mdi-file-pdf"
/></q-item-section>
@ -530,6 +539,9 @@ const viewFileUpload = async (url: string) => {
v-close-popup
@click="downloadAttachment('xlsx')"
>
<!-- type="a"
:href="orderAttachmentXlsx"
target="_blank" -->
<q-item-section avatar
><q-icon color="green-7" name="mdi-file-excel"
/></q-item-section>
@ -576,6 +588,7 @@ const viewFileUpload = async (url: string) => {
</div>
<div class="pdfWidth">
<VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent />
<!-- <VuePdf :key="page" :src="pdfSrc" :page="page" /> -->
</div>
<div class="justify-between items-center align-center q-pt-sm row">
<q-btn
@ -968,6 +981,7 @@ const viewFileUpload = async (url: string) => {
fit-parent
:scale="0.1"
/>
<!-- <VuePdf :key="page" :src="pdfSrc" :page="page" /> -->
</div>
<div class="justify-between items-center align-center q-pt-sm row">
<q-btn
@ -1047,6 +1061,7 @@ const viewFileUpload = async (url: string) => {
fit-parent
:scale="0.1"
/>
<!-- <VuePdf :key="page" :src="pdfSrc" :page="page" /> -->
</div>
<div class="justify-between items-center align-center q-pt-sm row">
<q-btn

View file

@ -1,4 +1,4 @@
const MainOrder = () => import("@/modules/10_order/components/Main.vue");
const MainOrder = () => import("@/modules/10_order/views/Main.vue");
const DetailPage = () => import("@/modules/10_order/components/Detail.vue");
export default [

View file

@ -1,7 +1,520 @@
<script setup lang="ts">
import { onMounted, reactive, ref, useAttrs } from "vue";
import type { QTableProps } from "quasar";
import type { FormOrderPlacementMainData } from "@/modules/10_order/interface/request/Main";
import type {
DataOption,
DataOption1,
} from "@/modules/10_order/interface/index/Main";
import { useCounterMixin } from "@/stores/mixin";
import { useOrderPlacementDataStore } from "@/modules/10_order/store";
import router from "@/router";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import PopupHistory from "@/modules/10_order/components/PopupHistory.vue";
const $q = useQuasar(); // noti quasar
const mixin = useCounterMixin();
const { showLoader, hideLoader, messageError, date2Thai } = mixin;
const DataStore = useOrderPlacementDataStore();
const pagination = ref({
descending: true,
page: 1,
rowsPerPage: 10,
});
const visibleColumns = ref<string[]>([
"Order",
"OrderNum",
"OrderType",
"OrderDate",
"OrderBy",
"Signer",
"OrderStatus",
]);
//
const columns = ref<QTableProps["columns"]>([
{
name: "Order",
align: "left",
label: "คำสั่ง",
sortable: true,
field: "Order",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "OrderNum",
align: "left",
label: "เลขที่คำสั่ง",
sortable: true,
field: "OrderNum",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "OrderType",
align: "left",
label: "ประเภท",
sortable: false,
field: "OrderType",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "OrderDate",
align: "left",
label: "สั่ง ณ วันที่/วันที่คำสั่งมีผล",
sortable: true,
field: "OrderDate",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a, b) => parseInt(a) - parseInt(b),
},
{
name: "OrderBy",
align: "left",
label: "คำสั่งโดย",
sortable: true,
field: "OrderBy",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "Signer",
align: "left",
label: "ผู้ลงนาม",
sortable: true,
field: "Signer",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "OrderStatus",
align: "center",
label: "สถานะคำสั่ง",
sortable: true,
field: "OrderStatus",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
onMounted(async () => {
await OriginalDataFetch();
fiscalYearFilter();
searchFilterTable();
OrderStatusFilter();
OrderTypeFilter();
});
//
const rows = ref<FormOrderPlacementMainData[]>([]);
let OriginalData = ref<FormOrderPlacementMainData[]>([]);
let UpdataData = ref<FormOrderPlacementMainData[]>([]);
const OriginalDataFetch = async () => {
showLoader();
await http
.get(config.API.listOrder())
.then((res: any) => {
rows.value = res.data.result.map((e: any) => ({
orderId: e.orderId,
Order: e.orderName,
OrderNum:
e.orderNo == "" ? "-" : `${e.orderNo}/${Number(e.fiscalYear) + 543}`,
fiscalYear: Number(e.fiscalYear),
OrderDate: date2Thai(e.orderDate),
OrderBy: e.orderBy,
Signer: e.signatoryBy,
OrderStatus: e.orderStatusName,
orderStatusValue: e.orderStatusValue,
OrderType: e.orderTypeName,
orderTypeValue: e.orderTypeValue,
}));
})
.catch((e: any) => {
messageError($q, e);
})
.finally(async () => {
hideLoader();
});
await DataStore.DataMainOrder(rows.value);
OriginalData.value = await DataStore.DataMainOrigOrder;
UpdataData.value = OriginalData.value;
};
// redirect step
const redirectToPage = (id?: string, status?: string) => {
let step = 1;
switch (status) {
case "จัดทำร่างคำสั่ง":
step = 1;
break;
case "บัญชีแนบท้าย":
step = 2;
break;
case "เลือกผู้ได้รับสำเนาคำสั่ง":
step = 3;
break;
default:
step = 4;
break;
}
router.push(`/order/detail/${id}?step=${step}`);
};
//
const clickAdd = () => {
router.push({ name: "OrderAdd" });
};
//
const fiscalyear = ref<number | null>(0);
const fiscalyearOP = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
const fiscalYearFilter = async () => {
await http.get(config.API.yearOptionsOrder()).then((res) => {
const response = res.data.result;
fiscalyearOP.push(...response);
});
};
//
const OrderType = ref<string>("");
const OrderTypeOption = reactive<DataOption1[]>([{ id: "", name: "ทั้งหมด" }]);
const OrderTypeFilter = async () => {
await http
.get(config.API.typeOrder())
.then((res) => {
const response = res.data.result;
OrderTypeOption.push(...response);
})
.catch((e) => {
messageError($q, e);
});
};
//
const OrderStatus = ref<string>("");
const OrderStatusOption = reactive<DataOption1[]>([
{ id: "", name: "ทั้งหมด" },
]);
const addedOrderStatusValues: string[] = [];
const OrderStatusFilter = async () => {
for (let data of OriginalData.value) {
const OrderStatusValue = data.OrderStatus;
if (
OrderStatusValue === null ||
parseInt(OrderStatusValue) > parseInt(OrderStatusValue)
) {
OrderStatus.value = OrderStatusValue;
}
if (!addedOrderStatusValues.includes(OrderStatusValue)) {
OrderStatusOption.push({
// id: OrderStatusValue,
id: OrderStatusOption.length.toString(),
name: OrderStatusValue,
});
addedOrderStatusValues.push(OrderStatusValue);
}
}
};
//
const filterKeyword = ref<string>("");
const filterRef = ref<any>(null);
const resetFilter = () => {
filterKeyword.value = "";
filterRef.value.focus();
};
const attrs = ref<any>(useAttrs());
const searchFilterTable = async () => {
if (OrderType.value == "ทั้งหมด") {
OrderType.value = "";
}
if (OrderStatus.value == "ทั้งหมด") {
OrderStatus.value = "";
}
// filter
await DataStore.DataUpdateOrder(
OrderType.value,
OrderStatus.value,
fiscalyear.value
);
UpdataData.value = DataStore.DataMainUpdateOrder;
};
const paging = ref<boolean>(true);
const paginationLabel = (start: string, end: string, total: string) => {
if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
else return start + "-" + end + " ใน " + total;
};
</script>
<template>
<div class="toptitle text-dark col-12 row items-center">
คำส
<div class="toptitle text-dark col-12 row items-center">ออกคำส</div>
<div>
<q-card flat bordered class="col-12 q-mt-sm q-pa-md">
<div class="row q-col-gutter-sm">
<div class="row col-12 q-col-gutter-sm">
<q-select
class="col-xs-12 col-sm-3 col-md-"
v-model="fiscalyear"
label="ปีงบประมาณ"
dense
emit-value
map-options
:options="fiscalyearOP"
option-value="id"
option-label="name"
lazy-rules
hide-bottom-space
:readonly="false"
:borderless="false"
:outlined="true"
:hide-dropdown-icon="false"
@update:model-value="searchFilterTable"
/>
<div>
<q-btn
size="12px"
flat
round
color="add"
icon="mdi-plus"
@click="clickAdd"
>
<q-tooltip>เพมขอม</q-tooltip>
</q-btn>
</div>
<q-space />
<q-input
class="col-xs-12 col-sm-3 col-md-2"
standout
dense
v-model="filterKeyword"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
>
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
<q-icon
v-if="filterKeyword !== ''"
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"
options-cover
style="min-width: 150px"
class="col-xs-12 col-sm-3 col-md-2"
/>
</div>
<div class="col-12">
<q-card bordered class="col-12 filter-card q-pa-sm">
<div class="row col-12 q-col-gutter-sm">
<div class="col-xs-12 col-sm-3 col-md-4">
<q-select
v-model="OrderType"
label="ประเภท"
dense
emit-value
map-options
option-label="name"
:options="OrderTypeOption"
option-value="name"
lazy-rules
hide-bottom-space
:readonly="false"
:borderless="false"
:outlined="true"
:hide-dropdown-icon="false"
@update:model-value="searchFilterTable"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-2">
<q-select
v-model="OrderStatus"
label="สถานะ"
dense
emit-value
map-options
option-label="name"
:options="OrderStatusOption"
option-value="name"
lazy-rules
hide-bottom-space
:readonly="false"
:borderless="false"
:outlined="true"
:hide-dropdown-icon="false"
@update:model-value="searchFilterTable"
/>
</div>
<q-space />
<div><PopupHistory :OrderTypeOption="OrderTypeOption" /></div>
</div>
</q-card>
</div>
<div class="col-12">
<q-table
ref="table"
:columns="columns"
:rows="UpdataData"
:filter="filterKeyword"
row-key="Order"
flat
bordered
:paging="true"
dense
class="custom-header-table"
v-bind="attrs"
:visible-columns="visibleColumns"
:pagination-label="paginationLabel"
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-th auto-width /> -->
</q-tr>
</template>
<template v-slot:body="props">
<q-tr
:props="props"
class="cursor-pointer"
@click="
redirectToPage(props.row.orderId, props.row.OrderStatus)
"
>
<q-td key="Order" :props="props">
{{ props.row.Order }}
</q-td>
<q-td key="OrderNum" :props="props">
{{ props.row.OrderNum }}
</q-td>
<q-td key="OrderType" :props="props">
{{ props.row.OrderType }}
</q-td>
<q-td key="OrderDate" :props="props">
{{ props.row.OrderDate }}
</q-td>
<q-td key="OrderBy" :props="props">
{{ props.row.OrderBy }}
</q-td>
<q-td key="Signer" :props="props">
{{ props.row.Signer }}
</q-td>
<q-td key="OrderStatus" :props="props">
{{ props.row.OrderStatus }}
</q-td>
<!-- <q-td auto-width>
<q-btn dense size="12px" flat round color="red" @click.stop="clickDelete(props.row.orderId)"
icon="mdi-delete">
<q-tooltip>ลบขอม</q-tooltip>
</q-btn>
</q-td> -->
</q-tr>
</template>
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
active-color="primary"
color="dark"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"
boundary-links
direction-links
></q-pagination>
</template>
</q-table>
</div>
</div>
</q-card>
</div>
</template>
</template>
<style lang="scss" scope>
.filter-card {
background-color: #f1f1f1b0;
}
.toggle-expired-account {
font-size: 12px;
font-weight: 400;
font-size: 15px;
line-height: 150%;
color: #35373c;
}
.icon-color {
color: #4154b3;
}
.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;
}
/* this will be the loading indicator */
.q-table thead tr:last-child th {
/* height of all previous header rows */
top: 48px;
}
.q-table thead tr:first-child th {
top: 0;
}
}
</style>