import BarChart from "@/components/chart/BarChart.vue";
-import { ref, onMounted, computed } from "vue";
+import { ref, watch, computed, inject } from "vue";
import { getElecUseDay } from "@/apis/energy";
import { useI18n } from "vue-i18n";
-
+const { search_data } = inject("energy_data");
const { t } = useI18n();
const dataSource = ref([]);
const dateRange = ref({
@@ -107,10 +107,12 @@ const chartOption = computed(() => {
};
});
-const loadData = async () => {
- const res = await getElecUseDay();
+const loadData = async (value) => {
+ const res = await getElecUseDay(value);
if (res.isSuccess) {
- dataSource.value = res.data.map((d) => ({ ...d, key: d.id }));
+ dataSource.value = res.data
+ .sort((a, b) => a.time.localeCompare(b.time))
+ .map((d) => ({ ...d, key: d.id }));
const dates = res.data.map((d) => d.time.split(" ")[0]);
dateRange.value = {
@@ -120,9 +122,21 @@ const loadData = async () => {
}
};
-onMounted(() => {
- loadData();
-});
+watch(
+ search_data,
+ (newValue, oldValue) => {
+ if (
+ newValue.building_guid &&
+ JSON.stringify(newValue) !== JSON.stringify(oldValue)
+ ) {
+ loadData(newValue);
+ }
+ },
+ {
+ immediate: true,
+ deep: true,
+ }
+);
diff --git a/src/views/energyManagement/components/EnergyChart/UsageInformation.vue b/src/views/energyManagement/components/EnergyChart/UsageInformation.vue
index b660170..4db0856 100644
--- a/src/views/energyManagement/components/EnergyChart/UsageInformation.vue
+++ b/src/views/energyManagement/components/EnergyChart/UsageInformation.vue
@@ -19,7 +19,7 @@ const calculateData = () => {
item.month.startsWith(currentYear)
);
- const totalElecBills = filteredData.reduce((sum, item) => sum + item.kWh, 0);
+ const totalElecBills = filteredData.reduce((sum, item) => sum + item.costTotal, 0);
const latestMonthData = filteredData[filteredData.length - 1];
const latestMonth = latestMonthData ? latestMonthData.month : "";
const monthDays = latestMonth ? daysInMonth(latestMonth) : 0;
diff --git a/src/views/energyManagement/components/EnergyHistoryTable/EnergyActionButton.vue b/src/views/energyManagement/components/EnergyHistoryTable/EnergyActionButton.vue
index 1e35325..6c06d2e 100644
--- a/src/views/energyManagement/components/EnergyHistoryTable/EnergyActionButton.vue
+++ b/src/views/energyManagement/components/EnergyHistoryTable/EnergyActionButton.vue
@@ -3,7 +3,7 @@ import { computed, defineProps, inject, ref, watch } from "vue";
import { useRoute } from "vue-router";
import { getHistoryData, getHistoryExportData } from "@/apis/history";
import useSearchParam from "@/hooks/useSearchParam";
-import { useI18n } from 'vue-i18n';
+import { useI18n } from "vue-i18n";
const { t } = useI18n();
const { searchParams } = useSearchParam();
const route = useRoute();
@@ -26,7 +26,6 @@ const cancelToastOpen = () => {
};
};
-
const submit = async (e, type = "") => {
e?.preventDefault();
e?.stopPropagation();
@@ -53,8 +52,13 @@ const submit = async (e, type = "") => {
} else {
const res = await getHistoryData({
...searchParams.value,
- Type: 1,
- table_type:route.params.type
+ Type:
+ route.params.type != 1
+ ? 2
+ : searchParams.value.Type
+ ? searchParams.value.Type
+ : 1,
+ table_type: route.params.type,
});
updateTableData(res.data);
}
@@ -82,7 +86,7 @@ const submitBtns = computed(() => [
disabled: isSearchButtonDisabled.value,
},
{
- title: t("button.export"),
+ title: t("button.export"),
key: "export",
icon: "download",
btn: "btn-export",
@@ -115,13 +119,18 @@ watch(
-
-
+
diff --git a/src/views/energyManagement/components/EnergyHistoryTable/EnergyDataCahrt.vue b/src/views/energyManagement/components/EnergyHistoryTable/EnergyDataCahrt.vue
index 282c5c7..db534fd 100644
--- a/src/views/energyManagement/components/EnergyHistoryTable/EnergyDataCahrt.vue
+++ b/src/views/energyManagement/components/EnergyHistoryTable/EnergyDataCahrt.vue
@@ -64,7 +64,7 @@ const formatChartData = (data) => {
const seriesKey = `${item.device_name || ""}_${item.item_name || ""}`;
acc[seriesKey] = {
timestamps: item.data.map((d) =>
- dayjs(d.timestamp).format("YYYY-MM-DD HH:mm")
+ dayjs(d.time).format("YYYY-MM-DD HH:mm")
),
values: item.data.map((d) =>
d.value == "無資料" ? null : parseFloat(d.value)
@@ -73,7 +73,6 @@ const formatChartData = (data) => {
minValue: parseFloat(item.minValue),
averageValue: parseFloat(item.averageValue),
};
-
return acc;
}, {});
};
@@ -86,8 +85,7 @@ watch(
const formattedData = formatChartData(newData);
const series = Object.keys(formattedData).map((seriesKey, index) => {
- const { maxValue, minValue, averageValue } =
- formattedData[seriesKey];
+ const { maxValue, minValue, averageValue } = formattedData[seriesKey];
return {
name: seriesKey,
type: "line",
diff --git a/src/views/energyManagement/components/EnergyHistoryTable/EnergySearch.vue b/src/views/energyManagement/components/EnergyHistoryTable/EnergySearch.vue
index d885467..df71184 100644
--- a/src/views/energyManagement/components/EnergyHistoryTable/EnergySearch.vue
+++ b/src/views/energyManagement/components/EnergyHistoryTable/EnergySearch.vue
@@ -65,7 +65,7 @@ const getElecType = async () => {
...d,
title: d.name,
key: d.id,
- active: false,
+ active: true,
}));
setElecTypeItems(elecType);
};
@@ -152,8 +152,23 @@ watch(
}
);
+watch(
+ () => storeBuild.deptList,
+ (newValue) => {
+ if (newValue) {
+ const deptList = newValue.map((d) => ({
+ ...d,
+ active: true,
+ }));
+ setDeptItems(deptList);
+ }
+ },
+ {
+ immediate: true,
+ }
+);
+
onMounted(() => {
- setDeptItems(storeBuild.deptList);
getElecType();
});
diff --git a/src/views/energyManagement/components/EnergyHistoryTable/EnergySearchTime.vue b/src/views/energyManagement/components/EnergyHistoryTable/EnergySearchTime.vue
index c1e632d..536a38b 100644
--- a/src/views/energyManagement/components/EnergyHistoryTable/EnergySearchTime.vue
+++ b/src/views/energyManagement/components/EnergyHistoryTable/EnergySearchTime.vue
@@ -4,14 +4,40 @@ import useSearchParam from "@/hooks/useSearchParam";
import dayjs from "dayjs";
import { useI18n } from "vue-i18n";
import { useRoute } from "vue-router";
+import useActiveBtn from "@/hooks/useActiveBtn";
+
const { t, locale } = useI18n();
const { searchParams, changeParams } = useSearchParam();
const route = useRoute();
+const {
+ items: searchTypeItems,
+ changeActiveBtn: changeTypeActiveBtn,
+ setItems: setTypeItems,
+ selectedBtn: selectedTypeItems,
+} = useActiveBtn();
+
const itemsForStartTime = ref([]);
const itemsForEndTime = ref();
const initializeItems = () => {
+ setTypeItems([
+ {
+ title: t("history.date_range"),
+ key: 1,
+ active: searchParams.value.Type
+ ? parseInt(searchParams.value.Type) === 1
+ : true,
+ },
+ {
+ title: t("history.time_range"),
+ key: 2,
+ active: searchParams.value.Type
+ ? parseInt(searchParams.value.Type) === 2
+ : false,
+ },
+ ]);
+
itemsForStartTime.value = [
{
key: "Start_date",
@@ -56,10 +82,10 @@ const initializeItems = () => {
watch(
() => route.params.type,
() => {
- initializeItems();
+ initializeItems();
},
{
- immediate: true,
+ immediate: true,
}
);
@@ -101,6 +127,13 @@ watch(
deep: true,
}
);
+
+watch(selectedTypeItems, (newValue) => {
+ changeParams({
+ ...searchParams.value,
+ Type: newValue.key,
+ });
+});
@@ -108,6 +141,16 @@ watch(
{{ $t("history.date_range") }} :
+
diff --git a/src/views/energyManagement/components/EnergyHistoryTable/EnergySidebar.vue b/src/views/energyManagement/components/EnergyHistoryTable/EnergySidebar.vue
index 1628c68..89e61e3 100644
--- a/src/views/energyManagement/components/EnergyHistoryTable/EnergySidebar.vue
+++ b/src/views/energyManagement/components/EnergyHistoryTable/EnergySidebar.vue
@@ -6,13 +6,14 @@ import useSearchParam from "@/hooks/useSearchParam";
import { getHistorySideBar } from "@/apis/history";
import { useI18n } from "vue-i18n";
const { t } = useI18n();
+const storeBuild = useBuildingStore();
+const buildingGuid = computed(() => storeBuild.selectedBuilding?.building_guid);
const { searchParams, changeParams } = useSearchParam();
const { deptData, elecType, subSystem } = inject("energy_table_data");
const selectedBuilding = ref([]);
const deviceData = ref([]);
const searchTerm = ref(""); //搜尋文字
const activeSearchTerm = ref("");
-
const getDeviceData = async ({
sub_system_tag,
department_id,
@@ -22,6 +23,7 @@ const getDeviceData = async ({
sub_system_tag,
department_id,
elec_type_id,
+ building_guid: buildingGuid.value,
});
deviceData.value = (res.data || []).map((building) => ({
building_tag: building.building_tag,
diff --git a/src/views/energyManagement/components/EnergyReport/EnergyReportSearch.vue b/src/views/energyManagement/components/EnergyReport/EnergyReportSearch.vue
index b294d75..8c5a520 100644
--- a/src/views/energyManagement/components/EnergyReport/EnergyReportSearch.vue
+++ b/src/views/energyManagement/components/EnergyReport/EnergyReportSearch.vue
@@ -47,7 +47,8 @@ const getElecType = async () => {
const elecType = res.data.map((d, index) => ({
...d,
title: d.name,
- key: d.id
+ key: d.id,
+ active: true,
}));
setElecItems(elecType);
};
@@ -99,9 +100,39 @@ watch(
{ immediate: true }
);
+watch(
+ () => storeBuild.deptList,
+ (newValue) => {
+ if (newValue) {
+ const deptList = newValue.map((d) => ({
+ ...d,
+ active: true,
+ }));
+ setDeptItems(deptList);
+ }
+ },
+ {
+ immediate: true,
+ }
+);
+
+watch(
+ () => storeBuild.floorList,
+ (newValue) => {
+ if (newValue) {
+ const floorList = newValue.map((d) => ({
+ ...d,
+ active: true,
+ }));
+ setFloorItems(floorList);
+ }
+ },
+ {
+ immediate: true,
+ }
+);
+
onMounted(() => {
- setDeptItems(storeBuild.deptList);
- setFloorItems(storeBuild.floorList);
getElecType();
});
diff --git a/src/views/graphManagement/components/GraphModal.vue b/src/views/graphManagement/components/GraphModal.vue
index 327a5b2..f2c8cf8 100644
--- a/src/views/graphManagement/components/GraphModal.vue
+++ b/src/views/graphManagement/components/GraphModal.vue
@@ -65,7 +65,7 @@ const updateFileList = (files) => {
};
const resetForm = () => {
- onSubSysClick(options.value[0].key);
+ // onSubSysClick(options.value[0].key);
updateFileList([]);
};
diff --git a/src/views/history/components/HistorySearch.vue b/src/views/history/components/HistorySearch.vue
index 7e49339..f662b2c 100644
--- a/src/views/history/components/HistorySearch.vue
+++ b/src/views/history/components/HistorySearch.vue
@@ -122,29 +122,15 @@ const getPoint = async (deviceList) => {
};
watch(
- selectedPoints,
- (newVal, oldVal) => {
+ [selectedPoints, selectedDeptItems],
+ ([newPoints, newDeptItems], [oldPoints, oldDeptItems]) => {
changeParams({
...searchParams.value,
- Points: newVal.map((d) => d.points),
+ Points: newPoints.map((d) => d.points),
+ Dept: newDeptItems.map((d) => d.id),
});
},
- {
- immediate: true,
- }
-);
-
-watch(
- selectedDeptItems,
- (newVal, oldVal) => {
- changeParams({
- ...searchParams.value,
- Dept: newVal.map((d) => d.id),
- });
- },
- {
- immediate: true,
- }
+ { immediate: true }
);
const form = ref(null);
@@ -154,14 +140,32 @@ watch(searchParams, (newVal, oldValue) => {
(newVal?.Device_list?.length && typeof oldValue.Device_list === "string") ||
(newVal?.Device_list?.length && !oldValue?.Device_list?.length)
) {
- getPoint(
- typeof newVal.Device_list == "string"
- ? [newVal.Device_list]
- : newVal.Device_list
- );
+ if (newVal?.Device_list[0]!==null){
+ getPoint(
+ typeof newVal.Device_list == "string"
+ ? [newVal.Device_list]
+ : newVal.Device_list
+ );
+ }
}
});
+watch(
+ () => store.deptList,
+ (newValue) => {
+ if (newValue) {
+ const deptList = newValue.map((d) => ({
+ ...d,
+ active: true,
+ }));
+ setDeptItems(deptList);
+ }
+ },
+ {
+ immediate: true,
+ }
+);
+
onMounted(() => {
setMainSysItems(
store.mainSubSys.map(({ full_name, main_system_tag }, index) => ({
@@ -170,13 +174,6 @@ onMounted(() => {
active: index === 0,
}))
);
- setDeptItems(
- store.deptList.map((d, index) => ({
- ...d,
- title: d.name,
- key: d.id,
- }))
- );
});
onBeforeMount(() => {
diff --git a/src/views/history/components/HistorySidebar.vue b/src/views/history/components/HistorySidebar.vue
index ec22b7d..139f971 100644
--- a/src/views/history/components/HistorySidebar.vue
+++ b/src/views/history/components/HistorySidebar.vue
@@ -5,17 +5,23 @@ import useBuildingStore from "@/stores/useBuildingStore";
import useSearchParam from "@/hooks/useSearchParam";
import { getHistorySideBar } from "@/apis/history";
import { useI18n } from "vue-i18n";
+
const { t } = useI18n();
const { searchParams, changeParams } = useSearchParam();
-
+const storeBuild = useBuildingStore();
const selectedBuilding = ref([]);
const deviceData = ref([]);
const searchTerm = ref(""); //搜尋文字
-const activeSearchTerm = ref("");
+const activeSearchTerm = ref("");
-const getDeviceData = async (sub_system_tag,department_id) => {
- const deptArray = department_id? department_id.map(Number):null;
- const res = await getHistorySideBar({sub_system_tag: sub_system_tag,department_id:deptArray});
+const getDeviceData = async (sub_system_tag, department_id) => {
+ const deptArray = department_id ? department_id.map(Number) : [];
+ const res = await getHistorySideBar({
+ sub_system_tag: sub_system_tag,
+ department_id: deptArray,
+ elec_type_id: [],
+ building_guid: storeBuild.selectedBuilding?.building_guid || null,
+ });
deviceData.value = res.data.map((building) => ({
building_tag: building.building_tag,
building_name: building.building_name,
@@ -30,9 +36,7 @@ const getDeviceData = async (sub_system_tag,department_id) => {
}));
selectedBuilding.value = res.data.map((d) => d.building_tag);
- changeSelected(
- [res.data[0]?.floor_list[0]?.device_list[0]?.device_number]
- );
+ changeSelected([res.data[0]?.floor_list[0]?.device_list[0]?.device_number]);
};
const sysIsExisted = (building_tag) => {
@@ -57,7 +61,7 @@ watch(
newVal.sub_system_tag &&
newVal.sub_system_tag != oldVal?.sub_system_tag
) {
- getDeviceData(newVal.sub_system_tag,searchParams.value.Dept);
+ getDeviceData(newVal.sub_system_tag, searchParams.value.Dept);
}
},
{
@@ -69,11 +73,8 @@ watch(
watch(
searchParams,
(newVal, oldVal) => {
- if (
- newVal.Dept &&
- newVal.Dept?.length != oldVal?.Dept?.length
- ) {
- getDeviceData(searchParams.value.sub_system_tag,newVal.Dept);
+ if (newVal.Dept && newVal.Dept?.length != oldVal?.Dept?.length) {
+ getDeviceData(searchParams.value.sub_system_tag, newVal.Dept);
}
},
{
@@ -182,15 +183,19 @@ const changeSelected = (Device_list, renew = false) => {
const filteredDeviceData = computed(() => {
if (!activeSearchTerm.value) return deviceData.value;
- return deviceData.value.map((building) => ({
- ...building,
- floors: building.floors.map((floor) => ({
- ...floor,
- devices: floor.devices.filter((device) =>
- device.device_name.includes(activeSearchTerm.value)
- ),
- })).filter(floor => floor.devices.length > 0)
- })).filter(building => building.floors.length > 0);
+ return deviceData.value
+ .map((building) => ({
+ ...building,
+ floors: building.floors
+ .map((floor) => ({
+ ...floor,
+ devices: floor.devices.filter((device) =>
+ device.device_name.includes(activeSearchTerm.value)
+ ),
+ }))
+ .filter((floor) => floor.devices.length > 0),
+ }))
+ .filter((building) => building.floors.length > 0);
});
const handleSearch = (e) => {
@@ -222,7 +227,10 @@ const handleInput = (e) => {
/>