diff --git a/src/composables/query/use-station-list-query.ts b/src/composables/query/use-station-list-query.ts index e356056..0ad58aa 100644 --- a/src/composables/query/use-station-list-query.ts +++ b/src/composables/query/use-station-list-query.ts @@ -21,7 +21,7 @@ export function useStationListQuery() { queryFn: async () => { const { data: ndmStationList } = await axios.get<{ code: string; name: string; deviceIdPrefix: string }[]>(`/minio/ndm/ndm-stations.json?_t=${dayjs().unix()}`); - const stations = ndmStationList.map((station) => ({ + let stations = ndmStationList.map((station) => ({ code: station.code ?? '', name: station.name ?? '', deviceIdPrefix: station.deviceIdPrefix ?? '', @@ -30,14 +30,16 @@ export function useStationListQuery() { const pingResultList = await Promise.allSettled(stations.map((station) => ndmVerify(station.code))); - stationList.value = stations.map((station, index) => ({ + stations = stations.map((station, index) => ({ ...station, online: pingResultList[index].status === 'fulfilled', })); + stationList.value.splice(0, stationList.value.length, ...stations); + updatedTime.value = dayjs().toJSON(); - return stationList.value; + return stations; }, refetchInterval: getAppEnvConfig().requestInterval * 1000, }); diff --git a/src/pages/alarm-page.vue b/src/pages/alarm-page.vue index 6b0ba22..e4de17f 100644 --- a/src/pages/alarm-page.vue +++ b/src/pages/alarm-page.vue @@ -10,26 +10,32 @@ import dayjs from 'dayjs'; import type { DataTableColumns, DataTableRowData, PaginationProps, SelectOption } from 'naive-ui'; import { NForm, NInput, NButton, NSpace, NDataTable, NFormItemGi, NGrid, NSelect, NGridItem, NDatePicker } from 'naive-ui'; import { storeToRefs } from 'pinia'; -import { ref, reactive, onBeforeMount, h, shallowRef, watch } from 'vue'; +import { ref, reactive, onBeforeMount, h, shallowRef, watch, computed } from 'vue'; const stationStore = useStationStore(); const { stationList } = storeToRefs(stationStore); -const stationSelectOptions = shallowRef([]); -watch( - stationList, - (list) => { - const next = list.map((station) => ({ - label: station.name, - value: station.deviceIdPrefix, - })); - stationSelectOptions.value.splice(0, stationSelectOptions.value.length, ...next); - }, - { - immediate: true, - deep: true, - }, -); +// const stationSelectOptions = shallowRef([]); +// watch( +// stationList, +// (list) => { +// const next = list.map((station) => ({ +// label: station.name, +// value: station.deviceIdPrefix, +// })); +// stationSelectOptions.value.splice(0, stationSelectOptions.value.length, ...next); +// }, +// { +// immediate: true, +// deep: true, +// }, +// ); +const stationSelectOptions = computed(() => { + return stationList.value.map((station) => ({ + label: station.name, + value: station.deviceIdPrefix, + })); +}); const searchFields = reactive({ stationCode_in: [] as string[], diff --git a/src/pages/vimp-log-page.vue b/src/pages/vimp-log-page.vue index 6420a0b..d75bc96 100644 --- a/src/pages/vimp-log-page.vue +++ b/src/pages/vimp-log-page.vue @@ -24,27 +24,33 @@ import { type SelectOption, } from 'naive-ui'; import { storeToRefs } from 'pinia'; -import { h, onBeforeMount, reactive, ref, shallowRef, watch } from 'vue'; +import { computed, h, onBeforeMount, reactive, ref, shallowRef, watch } from 'vue'; useStationListQuery(); const stationStore = useStationStore(); const { stationList } = storeToRefs(stationStore); -const stationSelectOptions = shallowRef([]); -watch( - stationList, - (list) => { - const next = list.map((station) => ({ - label: station.name, - value: station.deviceIdPrefix, - })); - stationSelectOptions.value.splice(0, stationSelectOptions.value.length, ...next); - }, - { - immediate: true, - deep: true, - }, -); +// const stationSelectOptions = shallowRef([]); +// watch( +// stationList, +// (list) => { +// const next = list.map((station) => ({ +// label: station.name, +// value: station.deviceIdPrefix, +// })); +// stationSelectOptions.value.splice(0, stationSelectOptions.value.length, ...next); +// }, +// { +// immediate: true, +// deep: true, +// }, +// ); +const stationSelectOptions = computed(() => { + return stationList.value.map((station) => ({ + label: station.name, + value: station.deviceIdPrefix, + })); +}); const searchFields = reactive({ stationCode: stationList.value.find((s) => s.online)?.code,