From 27bf12fc23b1ff6e8822a8b3eedacbc9da5ce13e Mon Sep 17 00:00:00 2001 From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" Date: Fri, 6 Dec 2024 09:48:23 +0700 Subject: [PATCH] =?UTF-8?q?API=20=E0=B8=9B=E0=B8=A3=E0=B8=B0=E0=B8=A7?= =?UTF-8?q?=E0=B8=B1=E0=B8=95=E0=B8=B4=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B9=83?= =?UTF-8?q?=E0=B8=8A=E0=B9=89=E0=B8=87=E0=B8=B2=E0=B8=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../06_webservices/interface/response/Main.ts | 10 +- src/modules/06_webservices/view/logView.vue | 97 ++++++++++--------- src/modules/06_webservices/view/main.vue | 16 +-- 3 files changed, 61 insertions(+), 62 deletions(-) diff --git a/src/modules/06_webservices/interface/response/Main.ts b/src/modules/06_webservices/interface/response/Main.ts index 69826c54..a95fd168 100644 --- a/src/modules/06_webservices/interface/response/Main.ts +++ b/src/modules/06_webservices/interface/response/Main.ts @@ -18,4 +18,12 @@ interface ResApiName { pathApi: string; } -export type { ResListWebServices, ResApiName }; +interface ResApHistory { + apiKey: string; + apiName: string; + createdAt: Date; + id: string; + ipApi: string; +} + +export type { ResListWebServices, ResApiName, ResApHistory }; diff --git a/src/modules/06_webservices/view/logView.vue b/src/modules/06_webservices/view/logView.vue index 112450e7..23cc491b 100644 --- a/src/modules/06_webservices/view/logView.vue +++ b/src/modules/06_webservices/view/logView.vue @@ -10,13 +10,16 @@ import type { DataOption, ItemsDropdown, } from "@/modules/06_webservices/interface/index/Main"; -import type { ResApiName } from "@/modules/06_webservices/interface/response/Main"; +import type { + ResApiName, + ResApHistory, +} from "@/modules/06_webservices/interface/response/Main"; /** use*/ const $q = useQuasar(); const { showLoader, hideLoader, messageError, date2Thai } = useCounterMixin(); -const apiType = ref(""); +const apiNameId = ref(""); const dataApiName = ref([ { id: "", @@ -31,7 +34,7 @@ const startTime = ref(null); // เวลาเริ่มต้ const endTime = ref(null); //เวลาสินสุด //รายการค้นหา -const valDropdown = ref(""); +const valDropdown = ref("today"); const labelDropdown = ref("วันนี้"); const itemsDropdown = ref([ { @@ -60,24 +63,29 @@ const itemsDropdown = ref([ }, ]); -const rows = ref([]); -const visibleColumns = ref(["name", "date", "request", "IP"]); +const rows = ref([]); +const visibleColumns = ref([ + "apiName", + "createdAt", + "apiKey", + "ipApi", +]); const columns = ref([ { - name: "name", + name: "apiName", align: "left", label: "API Request", sortable: false, - field: "name", + field: "apiName", headerStyle: "font-size: 14px", style: "font-size: 14px", }, { - name: "date", + name: "createdAt", align: "left", label: "วันที่ร้องขอ", sortable: true, - field: "date", + field: "createdAt", headerStyle: "font-size: 14px", style: "font-size: 14px", format(val, row) { @@ -85,20 +93,20 @@ const columns = ref([ }, }, { - name: "request", + name: "apiKey", align: "left", label: " คน request", sortable: false, - field: "request", + field: "apiKey", headerStyle: "font-size: 14px", style: "font-size: 14px", }, { - name: "IP", + name: "ipApi", align: "left", label: " IP", sortable: false, - field: "IP", + field: "ipApi", headerStyle: "font-size: 14px", style: "font-size: 14px", }, @@ -107,7 +115,7 @@ const columns = ref([ /** ฟังก์ชันเรียกรายการข้อมูล API ที่เข้าถึงได้*/ async function fetchListApiKeyName() { showLoader(); - await http + http .get(config.API.apiKeyMain + "/name") .then(async (res) => { const data = (await res.data?.result) || []; @@ -117,6 +125,8 @@ async function fetchListApiKeyName() { })); dataApiName.value.push(...optionData); options.value = dataApiName.value; + await onItemClick(labelDropdown.value, valDropdown.value); + await fetchListLog(); }) .catch((err) => { messageError($q, err); @@ -127,16 +137,22 @@ async function fetchListApiKeyName() { } async function fetchListLog() { - const data = [ - { - name: "API ข้อมูลทะเบียนประวัติข้าราชการ", - date: new Date(), - request: "MISConnect", - IP: "192.168.1.xx", - }, - ]; - - rows.value = data; + showLoader(); + http + .post(config.API.apiKeyMain + `/history`, { + apiNameId: apiNameId.value, + endDate: endDate.value, + startDate: startDate.value, + }) + .then((res) => { + rows.value = res.data.result; + }) + .catch((err) => { + messageError($q, err); + }) + .finally(() => { + hideLoader(); + }); } function onSelectType() { @@ -168,7 +184,7 @@ function filterSelector(val: string, update: Function) { * @param type ประเภทการค้นหาข้อมูล * และค้นหาข้อมูลรายการ Logs ใหม่ */ -function onItemClick(labal: string, type: string) { +async function onItemClick(labal: string, type: string) { labelDropdown.value = labal; valDropdown.value = type; const setDateRange = (daysAgo: number = 0, endOfDay = false) => { @@ -206,7 +222,12 @@ function onItemClick(labal: string, type: string) { endDate.value = new Date().toISOString(); } - type !== "customized" && selectedDate(); + if (type !== "customized") { + selectedDate(); + } else { + startTime.value = null; + endTime.value = null; + } } /** @@ -234,10 +255,11 @@ function selectedDate() { startDate.value = startDateToday.toISOString(); endDate.value = endDateToday.toISOString(); } + + fetchListLog(); } onMounted(async () => { - await fetchListLog(); await fetchListApiKeyName(); }); @@ -277,14 +299,12 @@ onMounted(async () => { option-value="id" emit-value map-options - v-model="apiType" + v-model="apiNameId" :options="options" label="รายากร Web Services" use-input hide-selected fill-input - :clearable="apiType !== ''" - @clear="apiType = ''" @update:modelValue="onSelectType" @filter="(inputValue: string,doneFn: Function) => filterSelector(inputValue, doneFn )" > @@ -417,7 +437,7 @@ onMounted(async () => { - - diff --git a/src/modules/06_webservices/view/main.vue b/src/modules/06_webservices/view/main.vue index 8f7aadda..e4c5c14f 100644 --- a/src/modules/06_webservices/view/main.vue +++ b/src/modules/06_webservices/view/main.vue @@ -1,25 +1,11 @@