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

เพิ่ม data ใน store ปรับ Ui

Browse source
This commit is contained in:
AnandaTon 2023-06-30 16:03:27 +07:00
parent ffa060b501
commit 21a3e6f206
3 changed files with 144 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

153
src/modules/05_placement/components/OrderPlacement/MainOrderPlacement.vue
View file

@ -27,20 +27,20 @@
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
<q-menu>
<q-list style="min-width: 100px">
<q-item clickable @click="clickAdd">
<q-item-section>ลายเซ็นชื่อ (ออฟไลน์)</q-item-section>
</q-item>
<q-item clickable v-close-popup disable>
<q-item-section
>ลายเซ็นอิเล็กทรอนิกส์ (ออนไลน์)</q-item-section
>
</q-item>
<q-item clickable @click="clickAdd">
<q-item-section>ลายเซ็นชื่อ (ออฟไลน์)</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-btn>
</div>
<q-space/>
<q-space />
<q-input
class="col-xs-12 col-sm-3 col-md-2"
standout
@ -61,7 +61,7 @@
/>
</template>
</q-input>
<q-select
v-model="visibleColumns"
multiple
@ -118,7 +118,7 @@
@update:model-value="searchFilterTable"
/>
</div>
</q-card>
</q-card>
</div>
<div class="col-12">
<q-table
@ -187,18 +187,7 @@
:props="props"
@click="redirectToPage(props.row.Order)"
>
<q-icon
v-if="props.row.OrderStatus == 'ยังไม่ได้ออกคำสั่ง'"
name="mdi-timer-sand"
color="orange"
size="20px"
/>
<q-icon
v-if="props.row.OrderStatus == 'ออกคำสั่งแล้ว'"
name="mdi-check"
color="positive"
size="20px"
/>
{{ props.row.OrderStatus }}
</q-td>
<q-td auto-width>
@ -241,12 +230,12 @@ import type { QTableProps } from "quasar";
import type { FormOrderPlacementMainData } from "@/modules/05_placement/interface/request/Main";
import type { DataOption } from "@/modules/05_placement/interface/index/Main";
import { useCounterMixin } from "@/stores/mixin";
import { usePlacementDataStore } from "@/modules/05_placement/store";
import { useOrderPlacementDataStore } from "@/modules/05_placement/store";
import router from "@/router";
import { useQuasar } from "quasar";
const $q = useQuasar(); //ใช้ noti quasar
const DataStore = usePlacementDataStore();
const DataStore = useOrderPlacementDataStore();
const pagination = ref({
sortBy: "desc",
descending: false,
@ -359,7 +348,7 @@ const rows = ref<FormOrderPlacementMainData[]>([
OrderDate: "30 พ.ค. 2565",
OrderBy: "สำนักงาน กทม.",
Signer: "นาม สมคิด ยอดใจ ",
OrderStatus: "ยังไม่ได้ออกคำสั่ง",
OrderStatus: "จัดทำร่างคำสั่ง",
OrderType: "คำสั่งย้าย",
},
@ -370,7 +359,7 @@ const rows = ref<FormOrderPlacementMainData[]>([
OrderDate: "30 พ.ค. 2565",
OrderBy: "สำนักงาน กทม.",
Signer: "นาม สมคิด ยอดใจ ",
OrderStatus: "ยังไม่ได้ออกคำสั่ง",
OrderStatus: "จัดทำร่างคำสั่ง",
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
},
{
@ -380,7 +369,7 @@ const rows = ref<FormOrderPlacementMainData[]>([
OrderDate: "30 พ.ค. 2565",
OrderBy: "สำนักงาน กทม.",
Signer: "นาม สมคิด ยอดใจ ",
OrderStatus: "ยังไม่ได้ออกคำสั่ง",
OrderStatus: "บัญชีแนบท้าย",
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
},
{
@ -390,7 +379,7 @@ const rows = ref<FormOrderPlacementMainData[]>([
OrderDate: "30 พ.ค. 2565",
OrderBy: "สำนักงาน กทม.",
Signer: "นาม สมคิด ยอดใจ ",
OrderStatus: "ยังไม่ได้ออกคำสั่ง",
OrderStatus: "บัญชีแนบท้าย",
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
},
{
@ -400,7 +389,27 @@ const rows = ref<FormOrderPlacementMainData[]>([
OrderDate: "30 พ.ค. 2565",
OrderBy: "สำนักงาน กทม.",
Signer: "นาม สมคิด ยอดใจ ",
OrderStatus: "ยังไม่ได้ออกคำสั่ง",
OrderStatus: "ส่งสำเนาคำสั่ง",
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
},
{
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
OrderNum: "1/2565",
fiscalYear: 2565,
OrderDate: "30 พ.ค. 2565",
OrderBy: "สำนักงาน กทม.",
Signer: "นาม สมคิด ยอดใจ ",
OrderStatus: "ส่งสำเนาคำสั่ง",
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
},
{
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
OrderNum: "1/2565",
fiscalYear: 2565,
OrderDate: "30 พ.ค. 2565",
OrderBy: "สำนักงาน กทม.",
Signer: "นาม สมคิด ยอดใจ ",
OrderStatus: "รอลงนาม",
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
},
{
@ -430,27 +439,7 @@ const rows = ref<FormOrderPlacementMainData[]>([
OrderDate: "30 พ.ค. 2565",
OrderBy: "สำนักงาน กทม.",
Signer: "นาม สมคิด ยอดใจ ",
OrderStatus: "ยังไม่ได้ออกคำสั่ง",
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
},
{
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
OrderNum: "1/2565",
fiscalYear: 2565,
OrderDate: "30 พ.ค. 2565",
OrderBy: "สำนักงาน กทม.",
Signer: "นาม สมคิด ยอดใจ ",
OrderStatus: "ยังไม่ได้ออกคำสั่ง",
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
},
{
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
OrderNum: "1/2565",
fiscalYear: 2565,
OrderDate: "30 พ.ค. 2565",
OrderBy: "สำนักงาน กทม.",
Signer: "นาม สมคิด ยอดใจ ",
OrderStatus: "ยังไม่ได้ออกคำสั่ง",
OrderStatus: "ออกคำสั่งแล้ว",
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
},
{
@ -482,7 +471,7 @@ const rows = ref<FormOrderPlacementMainData[]>([
OrderDate: "30 พ.ค. 2566",
OrderBy: "สำนักงาน กทม.",
Signer: "นาม สมคิด ยอดใจ ",
OrderStatus: "ยังไม่ได้ออกคำสั่ง",
OrderStatus: "ออกคำสั่งแล้ว",
OrderType: "คำสั่งแต่งตั้ง",
},
]);
@ -515,8 +504,8 @@ const OriginalDataFetch = async () => {
// })
// .finally(async () => {
// });
await DataStore.DataMain(rows.value);
OriginalData.value = await DataStore.DataMainOrig;
await DataStore.DataMainOrder(rows.value);
OriginalData.value = await DataStore.DataMainOrigOrder;
UpdataData.value = OriginalData.value;
};
@ -582,6 +571,7 @@ const fiscalYearFilter = async () => {
// });
for (let data of OriginalData.value) {
const year = data.fiscalYear;
console.log(year);
if (fiscalyear.value === null || year > fiscalyear.value) {
fiscalyear.value = year;
@ -594,9 +584,9 @@ const fiscalYearFilter = async () => {
}
};
const OrderType = ref<number | null>(0);
const OrderType = ref<string | null>(null);
const OrderTypeOption = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
const addedOrderTypeValues: number[] = [];
const addedOrderTypeValues: string[] = [];
const OrderTypeFilter = async () => {
// API
// await http
@ -611,22 +601,34 @@ const OrderTypeFilter = async () => {
// .finally(async () => {
// });
for (let data of OriginalData.value) {
const OrderType = data.OrderType;
const OrderTypeValue = data.OrderType;
console.log(OrderTypeValue);
if (OrderType.value === null || OrderType > OrderType.value) {
OrderType.value = OrderType;
}
if (!addedOrderTypeValues.includes(OrderType)) {
OrderTypeOption.push({ id: OrderType, name: OrderType.toString() });
addedOrderTypeValues.push(OrderType);
// if (OrderTypeValue === null || OrderType > OrderTypeValue) {
// OrderTypeValue = OrderType;
// }
if (!addedOrderTypeValues.includes(OrderTypeValue)) {
OrderTypeOption.push({
id: OrderTypeValue,
name: OrderTypeValue,
});
addedOrderTypeValues.push(OrderTypeValue);
}
// if (!addedOrderTypeValues.includes(OrderTypeValue)) {
// OrderTypeOption.push({
// id: OrderTypeValue,
// name: OrderTypeValue.toString(),
// });
// addedOrderTypeValues.push(OrderTypeValue);
// }
}
};
const OrderStatus = ref<number | null>(0);
const OrderStatus = ref<string | null>(null);
const OrderStatusText = ref<FormOrderPlacementMainData[]>(
DataStore.DataMainOrigOrder
);
const OrderStatusOption = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
const addedOrderStatusValues: number[] = [];
const addedOrderStatusValues: string[] = [];
const OrderStatusFilter = async () => {
// API
// await http
@ -641,15 +643,22 @@ const OrderStatusFilter = async () => {
// .finally(async () => {
// });
for (let data of OriginalData.value) {
const OrderStatus = data.OrderStatus;
const OrderStatusValue = data.OrderStatus;
console.log(OrderStatusValue);
if (OrderStatus.value === null || OrderStatus > OrderStatus.value) {
OrderStatus.value = OrderStatus;
}
// if (
// OrderStatusValue === null ||
// parseInt(OrderStatusValue) > parseInt(OrderStatusValue)
// ) {
// OrderStatusText.value = OrderStatusValue;
// }
if (!addedOrderStatusValues.includes(OrderStatus)) {
OrderStatusOption.push({ id: OrderStatus, name: OrderStatus.toString() });
addedOrderStatusValues.push(OrderStatus);
if (!addedOrderStatusValues.includes(OrderStatusValue)) {
OrderStatusOption.push({
id: OrderStatusValue,
name: OrderStatusValue,
});
addedOrderStatusValues.push(OrderStatusValue);
}
}
};
@ -688,7 +697,9 @@ const visibleColumns = ref<string[]>([
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
const searchFilterTable = async () => {
await DataStore.DataUpdateMain(OrderStatus.value, OrderType.value);
// console.log('Input value changed:', examTime.value, examType.value, expiredAccount.value);
await DataStore.DataUpdateMainOrder(OrderType.value, OrderStatus.value);
UpdataData.value = DataStore.DataMainUpdateOrder;
};
// UpdataData.value = DataStore.DataMainUpdate;
// console.log("Input value changed:", OrderStatus.value, OrderType.value);

2
src/modules/05_placement/components/OrderPlacement/step/step03.vue
View file

@ -470,7 +470,7 @@ const pagination = ref({
const optionSelect = ref<any>([
{ id: 1, name: "อีเมล" },
{ id: 2, name: "แจ้งเตือน" },
{ id: 2, name: "กล่องข้อความ" },
]);
const visibleColumns = ref<String[]>([

61
src/modules/05_placement/store.ts
View file

@ -190,3 +190,64 @@ export const usePlacementDataStore = defineStore("placement", () => {
DataUpdateMain,
};
});
export const useOrderPlacementDataStore = defineStore("placement", () => {
interface placement {
mappingPosition: { columns: String[] };
}
const placementData = ref<placement>({
mappingPosition: { columns: [] },
});
const changePlacementColumns = (system: String, val: String[]) => {
if (system == "mappingPosition")
placementData.value.mappingPosition.columns = val;
localStorage.setItem("placement", JSON.stringify(placementData.value));
};
if (localStorage.getItem("placement") !== null) {
placementData.value = JSON.parse(localStorage.getItem("placement") || "{}");
}
const DataMainYearOrder = ref<object[]>([]); // ข้อมูลจำนวนปี
const DataMainOrigOrder = ref<FormOrderPlacementMainData[]>([]); // ข้อมูลหลักดั้งเดิม
const DataMainUpdateOrder = ref<FormOrderPlacementMainData[]>([]); // ข้อมูลเปลี่ยนแปลง
const DataMainYearSetOrder = (val: FormOrderPlacementMainData[]) =>
(DataMainYearOrder.value = val);
const DataMainOrder = (val: FormOrderPlacementMainData[]) =>
(DataMainOrigOrder.value = val);
const DataUpdateMainOrder = (
filter_1: string | null,
filter_2: string | null
) => {
DataMainUpdateOrder.value = [];
if (filter_1 === null && filter_2 === "0") {
DataMainUpdateOrder.value = DataMainOrigOrder.value;
} else if (filter_1 !== null && filter_2 === "0") {
DataMainUpdateOrder.value = DataMainOrigOrder.value.filter(
(item) => item.Order === filter_1
);
} else if (filter_1 !== null && filter_2 !== "0") {
DataMainUpdateOrder.value = DataMainOrigOrder.value.filter(
(item) => item.Order === filter_1 && item.OrderType === filter_2
);
} else if (filter_1 === null && filter_2 !== "0") {
DataMainUpdateOrder.value = DataMainOrigOrder.value.filter(
(item) => item.OrderStatus === filter_2
);
}
};
return {
placementData,
changePlacementColumns,
DataMainYearOrder,
DataMainOrigOrder,
DataMainUpdateOrder,
DataUpdateMainOrder,
DataMainYearSetOrder,
DataMainOrder,
};
});