From 7b8d3e399494ab02f6150deb530dc3e806db1011 Mon Sep 17 00:00:00 2001
From: kun <1422840143@qq.com>
Date: Tue, 14 May 2024 09:58:26 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20BUG=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/modules/equipmentPosition.ts          |  4 ++
 src/api/modules/smartSafeHat.ts               |  4 ++
 .../equipmentPosition/index.vue               | 71 +++++++++++--------
 .../smartSafeHat/index.vue                    | 68 +++++++++++-------
 4 files changed, 94 insertions(+), 53 deletions(-)

diff --git a/src/api/modules/equipmentPosition.ts b/src/api/modules/equipmentPosition.ts
index 8cc0bde..1674139 100644
--- a/src/api/modules/equipmentPosition.ts
+++ b/src/api/modules/equipmentPosition.ts
@@ -17,6 +17,10 @@ export const getEpSuroundInfoApi = (params: {}) => {
 export const getEpAlarmRecordInfoApi = (params: {}) => {
 	return http.get(BASEURL + `/xmgl/mechanicalEquipmentPositionAlarm/list`, params);
 };
+// 机械设备定位--分页查询报警信息
+export const getEpAlarmRecordInfoPageApi = (params: {}) => {
+	return http.get(BASEURL + `/xmgl/mechanicalEquipmentPositionAlarm/page`, params);
+};
 // 机械设备定位--查询实时数据信息
 export const getEpRealtimeDataApi = (params: {}) => {
 	return http.get(BASEURL + `/xmgl/mechanicalEquipmentPositionData/list`, params);
diff --git a/src/api/modules/smartSafeHat.ts b/src/api/modules/smartSafeHat.ts
index 69a55fb..ee40749 100644
--- a/src/api/modules/smartSafeHat.ts
+++ b/src/api/modules/smartSafeHat.ts
@@ -22,6 +22,10 @@ export const getSuroundInfoApi = (params: {}) => {
 export const getAlarmRecordInfoApi = (params: {}) => {
 	return http.get(BASEURL + `/xmgl/safetyHatAlarm/list`, params);
 };
+// 智能安全帽--分页查询报警信息
+export const getAlarmRecordInfoPageApi = (params: {}) => {
+	return http.get(BASEURL + `/xmgl/safetyHatAlarm/page`, params);
+};
 // 智能安全帽--查询实时数据信息
 export const getRealtimeDataApi = (params: {}) => {
 	return http.get(BASEURL + `/xmgl/safetyHatData/newestList`, params);
diff --git a/src/views/sevenLargeScreen/digitalConstruction/equipmentPosition/index.vue b/src/views/sevenLargeScreen/digitalConstruction/equipmentPosition/index.vue
index d495c50..e75deac 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/equipmentPosition/index.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/equipmentPosition/index.vue
@@ -233,7 +233,7 @@
                 <div style="width: 20%">报警时间</div>
                 <div style="width: 30%">报警信息</div>
               </div>
-              <el-scrollbar class="list-box">
+              <el-scrollbar class="list-box" ref="refScrollbar">
                 <div v-for="(item, index) in listData" class="list-style" :key="item.id">
                   <div style="width: 5%">{{ index + 1 }}</div>
                   <div style="width: 20%">{{ item.equipmentName }}</div>
@@ -259,7 +259,7 @@ import {
 	getEpDevOptionApi,
 	getEpTypeTotalApi,
 	getEpSuroundInfoApi,
-	getEpAlarmRecordInfoApi,
+	getEpAlarmRecordInfoPageApi,
 	getEpRealtimeDataApi,
 	getEpRealtimeDataPageApi,
 	getEpDayRecordApi,
@@ -289,6 +289,8 @@ var marker;
 var lineArr;
 var mapInstance;
 var map;
+const refScrollbar = ref(null as any); // 绑定到滚动的盒子上
+let moreScroll = ref(true as any);
 let choiceMonth = ref("2023-11");
 let dayRunRecord = ref([]); // 日行数据
 let hasRealTime = ref(false);
@@ -392,7 +394,7 @@ onMounted(() => {
 	choiceMonth.value = formatMonthTime(dayValue.value);
 	// console.log("当前月份", choiceMonth.value);
 	initMap();
-	getProgressListData();
+	getProgressListData('search');
 	getCrewListData();
 	getFenceList();
 	getFenceType();
@@ -400,6 +402,20 @@ onMounted(() => {
 	window.addEventListener("resize", e => {
 		resetMapSize();
 	});
+	refScrollbar.value.wrapRef.addEventListener("scroll", (e: any) => {
+		// console.log("滚动容器", e);
+		const scrollTop = e.target.scrollTop;
+		const scrollHeight = e.target.scrollHeight;
+		const clientHeight = e.target.clientHeight;
+		// console.log("滚动容器", scrollTop, scrollHeight, clientHeight);
+		// 向上加载更多
+		if (scrollTop >= scrollHeight - clientHeight - 1) {
+			// console.log("加载更多");
+			if (moreScroll.value) {
+				getProgressListData('more');
+			}
+		}
+	});
 });
 onBeforeMount(() => {
 	window.removeEventListener("resize", e => {
@@ -462,7 +478,7 @@ function refreshDev() {
 	queryInfo.value.devSn = "";
 	clearFn();
 	getCrewListData();
-	getProgressListData();
+	getProgressListData('search');
 }
 
 function areaRadiusChange() {
@@ -669,7 +685,7 @@ function getTodayMeter(day: any) {
 // 切换设备
 function devChange(e) {
 	console.log("设备改变", e);
-	getProgressListData();
+	getProgressListData('search');
 	if (checked.value === 2) {
 		getDayRunData();
 	}
@@ -777,14 +793,6 @@ function handle(type, show) {
 		show: show
 	};
 }
-function SizeChange(val) {
-	pagInfo.value.pageSize = val;
-	getProgressListData();
-}
-function CurrentChange(val) {
-	pagInfo.value.pageNo = val;
-	getProgressListData();
-}
 //获取查询下拉
 function getCrewListData() {
 	let onlineType = "";
@@ -827,20 +835,25 @@ function getCrewListData() {
 	});
 }
 //获取报警列表数据
-function getProgressListData() {
-	let data = {
-		// pageNo: pagInfo.value.pageNo,
-		// pageSize: pagInfo.value.pageSize,
+async function getProgressListData(tip:any) {
+	let requestData:any = {
 		devSns: alarmDevSn.value,
-		projectSn: store.sn
-	};
-	getEpAlarmRecordInfoApi(data).then(res => {
-		if (res.code == 200) {
-			listData.value = res.result;
-			// pagInfo.value.total = res.result.total;
-			pagInfo.value.total = res.result.length;
-		}
-	});
+		projectSn: store.sn,
+		pageNo: tip == 'search'?1:pagInfo.value.pageNo,
+		pageSize: 100
+	}
+	const res: any = await getEpAlarmRecordInfoPageApi(requestData);
+	console.log("获取历史数据", res);
+	if(tip == 'more'){
+		listData.value = listData.value.concat(res.result.records);
+	} else {
+		listData.value = res.result.records;
+	}
+	if (res.result.pages == pagInfo.value.pageNo) {
+		moreScroll.value = false;
+	} else {
+		pagInfo.value.pageNo = pagInfo.value.pageNo + 1;
+	}
 }
 function fenceNameChange(e) {
 	console.log("围栏名称", e);
@@ -862,7 +875,7 @@ function handleCheckAllChange(val) {
 		queryInfo.value.devSn = "";
 	}
 	alarmDevSn.value = "";
-	getProgressListData();
+	getProgressListData('search');
 	drawFencePoint();
 }
 function handleCheckedCitiesChange(value) {
@@ -902,7 +915,7 @@ function pointSelectChange() {
 	}
 	alarmDevSn.value = warnDevSn;
 	console.log("当前devSn", alarmDevSn.value);
-	getProgressListData();
+	getProgressListData('search');
 }
 
 function fenceAllChange(val) {
@@ -969,7 +982,7 @@ function selectChange(e) {
 		// queryInfo.value.devSn = devList.value[0].value;
 		queryInfo.value.devSn = nameOptions.value[0].value;
 		alarmDevSn.value = "";
-		getProgressListData();
+		getProgressListData('search');
 		getDayRunData();
 	}
 }
diff --git a/src/views/sevenLargeScreen/digitalConstruction/smartSafeHat/index.vue b/src/views/sevenLargeScreen/digitalConstruction/smartSafeHat/index.vue
index e763d02..ce36d4a 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/smartSafeHat/index.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/smartSafeHat/index.vue
@@ -322,7 +322,7 @@
                   <div style="width: 20%">报警时间</div>
                   <div style="width: 40%">报警信息</div>
                 </div>
-                <el-scrollbar class="list-box">
+                <el-scrollbar class="list-box" ref="refScrollbar">
                   <div v-for="(item, index) in listData" class="list-style" :key="item.id">
                     <div style="width: 10%">{{ index + 1 }}</div>
                     <div style="width: 15%">{{ item.workerName }}</div>
@@ -347,7 +347,7 @@
 <script setup lang="ts">
 // import { getWorkerInfoList } from "@/assets/js/api/laborPerson";
 import {
-	getAlarmRecordInfoApi,
+	getAlarmRecordInfoPageApi,
 	getHatDevOptionApi,
 	getWeekAlarmDataApi,
 	getRealtimeDataApi,
@@ -374,6 +374,7 @@ import { ElMessage, ElMessageBox } from "element-plus";
 import type { FormInstance, FormRules } from "element-plus";
 import Card from "@/components/card.vue";
 import * as echarts from "echarts";
+import moment from "moment"
 const store = GlobalStore();
 import { computed, reactive, ref, onMounted, onBeforeMount, watch } from "vue";
 var mouseTool;
@@ -381,6 +382,8 @@ var marker;
 var lineArr;
 var mapInstance;
 var map;
+const refScrollbar = ref(null as any); // 绑定到滚动的盒子上
+let moreScroll = ref(true as any);
 let choiceMonth = ref("2023-11");
 let dayRunRecord = ref([]); // 日行数据
 let hasRealTime = ref(false);
@@ -509,7 +512,7 @@ onMounted(async () => {
 	// console.log("当前月份", choiceMonth.value);
 	initMap();
 	// 智能安全帽--查询报警信息
-	getProgressListData();
+	getProgressListData('search');
 	// 智能安全帽--分类查询设备列表
 	getCrewListData();
 	// 智能安全帽--查询围栏信息
@@ -524,6 +527,20 @@ onMounted(async () => {
 	window.addEventListener("resize", e => {
 		resetMapSize();
 	});
+	refScrollbar.value.wrapRef.addEventListener("scroll", (e: any) => {
+		// console.log("滚动容器", e);
+		const scrollTop = e.target.scrollTop;
+		const scrollHeight = e.target.scrollHeight;
+		const clientHeight = e.target.clientHeight;
+		// console.log("滚动容器", scrollTop, scrollHeight, clientHeight);
+		// 向上加载更多
+		if (scrollTop >= scrollHeight - clientHeight - 1) {
+			// console.log("加载更多");
+			if (moreScroll.value) {
+				getProgressListData('more');
+			}
+		}
+	});
 });
 onBeforeMount(() => {
 	window.removeEventListener("resize", e => {
@@ -882,7 +899,7 @@ function refreshDev() {
 	queryInfo.value.devSn = "";
 	clearFn();
 	getCrewListData();
-	getProgressListData();
+	getProgressListData('search');
 	getLineEcharts();
 	getFenceList();
 }
@@ -938,7 +955,7 @@ function getDayRunData() {
 		projectSn: store.sn,
 		devSn: queryInfo.value.devSn,
 		// month: choiceMonth.value
-		day: dayValue.value
+		day: moment(dayValue.value).format("YYYY-MM-DD")
 	};
 	console.log("👇日行数据月份查询参数");
 	console.log(data);
@@ -973,7 +990,7 @@ function getTodayMeter(day: any) {
 // 切换设备
 function devChange(e) {
 	console.log("设备改变", e);
-	getProgressListData();
+	getProgressListData('search');
 	if (checked.value === 2) {
 		getDayRunData();
 	}
@@ -1150,22 +1167,25 @@ function getCrewListData() {
 	});
 }
 // 智能安全帽--查询报警信息
-function getProgressListData() {
-	let data = {
-		// pageNo: pagInfo.value.pageNo,
-		// pageSize: pagInfo.value.pageSize,
+async function getProgressListData(tip:any) {
+	let requestData:any = {
 		devSns: alarmDevSn.value,
-
-		projectSn: store.sn
-	};
-	getAlarmRecordInfoApi(data).then(res => {
-		console.log("👇智能安全帽--查询报警信息");
-		console.log(res);
-		if (res.code == 200) {
-			listData.value = res.result;
-			pagInfo.value.total = res.result.total;
-		}
-	});
+		projectSn: store.sn,
+		pageNo: tip == 'search'?1:pagInfo.value.pageNo,
+		pageSize: 100
+	}
+	const res: any = await getAlarmRecordInfoPageApi(requestData);
+	console.log("获取历史数据", res);
+	if(tip == 'more'){
+		listData.value = listData.value.concat(res.result.records);
+	} else {
+		listData.value = res.result.records;
+	}
+	if (res.result.pages == pagInfo.value.pageNo) {
+		moreScroll.value = false;
+	} else {
+		pagInfo.value.pageNo = pagInfo.value.pageNo + 1;
+	}
 }
 function fenceNameChange(e) {
 	console.log("围栏名称", e);
@@ -1188,7 +1208,7 @@ function handleCheckAllChange(val) {
 		queryInfo.value.devSn = "";
 	}
 	alarmDevSn.value = "";
-	getProgressListData();
+	getProgressListData('search');
 	drawFencePoint();
 }
 function handleCheckedCitiesChange(value) {
@@ -1234,7 +1254,7 @@ function pointSelectChange() {
 	}
 	alarmDevSn.value = warnDevSn;
 	console.log("当前devSn", alarmDevSn.value);
-	getProgressListData();
+	getProgressListData('search');
 }
 
 function fenceAllChange(val) {
@@ -1303,7 +1323,7 @@ function selectChange(e) {
 		queryInfo.value.devSn = nameOptions.value[0].value;
 		// queryInfo.value.devSn = devList.value[0].devSn;
 		// alarmDevSn.value = "";
-		getProgressListData();
+		getProgressListData('search');
 		getDayRunData();
 	}
 }