@@ -23,31 +23,31 @@ const http = moduleRequest("/large/screen/"); | |||||
const screenApi = { | const screenApi = { | ||||
/** 获取大屏首页数据 */ | /** 获取大屏首页数据 */ | ||||
getHomeData(params: any={}) { | getHomeData(params: any={}) { | ||||
return http.get("getHomeData", params); | |||||
return http.get("getHomeData", params,{loading:false}); | |||||
}, | }, | ||||
/** 获取大屏学生归寝数据 */ | /** 获取大屏学生归寝数据 */ | ||||
getStudentReturnBed(params: any={}) { | getStudentReturnBed(params: any={}) { | ||||
return http.get("getStudentReturnBed", params); | |||||
return http.get("getStudentReturnBed", params,{loading:false}); | |||||
}, | }, | ||||
/** 获取大屏智慧课堂数据 */ | /** 获取大屏智慧课堂数据 */ | ||||
getSmartClassroom(params: any={}) { | getSmartClassroom(params: any={}) { | ||||
return http.get("getSmartClassroom", params); | |||||
return http.get("getSmartClassroom", params,{loading:false}); | |||||
}, | }, | ||||
/** 获取宿舍楼 */ | /** 获取宿舍楼 */ | ||||
getNoPageList(params: any={}) { | getNoPageList(params: any={}) { | ||||
return http.get("getNoPageList", params); | |||||
return http.get("getNoPageList", params,{loading:false}); | |||||
}, | }, | ||||
/** 获取班级列表 */ | /** 获取班级列表 */ | ||||
getPersonSetNoPageList(params: any={}) { | getPersonSetNoPageList(params: any={}) { | ||||
return http.get("getPersonSetNoPageList", params); | |||||
return http.get("getPersonSetNoPageList", params,{loading:false}); | |||||
}, | }, | ||||
/** 获取单页详情 */ | /** 获取单页详情 */ | ||||
detail(params: any) { | detail(params: any) { | ||||
return http.get("getStartVideoLive", params); | |||||
return http.get("getStartVideoLive", params,{loading:false}); | |||||
}, | }, | ||||
/** 获取单页详情 */ | /** 获取单页详情 */ | ||||
stopUrl(params: any) { | stopUrl(params: any) { | ||||
return http.get("getStopVideoLive", params); | |||||
return http.get("getStopVideoLive", params,{loading:false}); | |||||
}, | }, | ||||
}; | }; | ||||
@@ -34,18 +34,18 @@ | |||||
<iframe :src="rtsUrl" frameborder="0" style="width: 100%; height: 100%"></iframe> | <iframe :src="rtsUrl" frameborder="0" style="width: 100%; height: 100%"></iframe> | ||||
</div> | </div> | ||||
<div class="stuEnterList myborder"> | <div class="stuEnterList myborder"> | ||||
<stuEnterList :screenData="screenData"></stuEnterList> | |||||
<stuEnterList ref="stuEnterListRef" :screenData="screenData"></stuEnterList> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="main-bottom"> | <div class="main-bottom"> | ||||
<div class="classStatistics myborder"> | <div class="classStatistics myborder"> | ||||
<classStatistics :screenData="screenData"></classStatistics> | |||||
<classStatistics ref="classStatisticsRef" :screenData="screenData"></classStatistics> | |||||
</div> | </div> | ||||
<div class="classNotice myborder"> | <div class="classNotice myborder"> | ||||
<classNotice :screenData="screenData"></classNotice> | |||||
<classNotice ref="classNoticeRef" :screenData="screenData"></classNotice> | |||||
</div> | </div> | ||||
<div class="classAnalysis myborder"> | <div class="classAnalysis myborder"> | ||||
<classAnalysis :screenData="screenData" /> | |||||
<classAnalysis ref="classAnalysisRef" :screenData="screenData" /> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</main> | </main> | ||||
@@ -63,17 +63,15 @@ const screenData = ref({}); | |||||
const classInfo = ref({}); | const classInfo = ref({}); | ||||
const ready = ref(false); | const ready = ref(false); | ||||
const classRoom = ref({}); | const classRoom = ref({}); | ||||
const alarmList = ref([]); | |||||
const rollCall = ref([]); | |||||
const statisti = ref({ | |||||
labale: [], | |||||
value: [] | |||||
}); | |||||
const stuEnterListRef = ref(null); | |||||
const classStatisticsRef = ref(null); | |||||
const classNoticeRef = ref(null); | |||||
const classAnalysisRef = ref(null); | |||||
const getClassRoomInfo = obj => { | const getClassRoomInfo = obj => { | ||||
classInfo.value = obj; | |||||
if (obj) classInfo.value = obj; | |||||
if (!timer) refresh(getClassRoomInfo, 60000); | |||||
// 归寝人数信息 | // 归寝人数信息 | ||||
ready.value = false; | |||||
screenApi.getSmartClassroom({ personSetId: obj.value }).then(res => { | |||||
return screenApi.getSmartClassroom({ personSetId: classInfo.value.value }).then(res => { | |||||
if (res.code == 200) { | if (res.code == 200) { | ||||
screenData.value = res.data; | screenData.value = res.data; | ||||
classRoom.value = screenData.value.classRoom; | classRoom.value = screenData.value.classRoom; | ||||
@@ -84,10 +82,6 @@ const getClassRoomInfo = obj => { | |||||
classRoom.value.isClassing = true; | classRoom.value.isClassing = true; | ||||
} | } | ||||
showRts(classRoom.value.cameraId); | showRts(classRoom.value.cameraId); | ||||
classInfo.value = screenData.value.classInfo; | |||||
alarmList.value = screenData.value.alarmList; | |||||
rollCall.value = screenData.value.rollCall; | |||||
statisti.value = screenData.value.statisti; | |||||
console.log(res.data); | console.log(res.data); | ||||
ready.value = true; | ready.value = true; | ||||
nextTick(() => { | nextTick(() => { | ||||
@@ -96,6 +90,17 @@ const getClassRoomInfo = obj => { | |||||
} | } | ||||
}); | }); | ||||
}; | }; | ||||
// 定时刷新 | |||||
var timer = ""; | |||||
const refresh = (fn = () => {}, time = 5000) => { | |||||
timer = setInterval(async () => { | |||||
await fn(); | |||||
stuEnterListRef.value.init(); | |||||
classStatisticsRef.value.init(); | |||||
classNoticeRef.value.init(); | |||||
classAnalysisRef.value.init(); | |||||
}, time); | |||||
}; | |||||
// 监控 | // 监控 | ||||
const streamId = ref(""); | const streamId = ref(""); | ||||
const videoToken = ref(""); | const videoToken = ref(""); | ||||
@@ -128,6 +133,7 @@ const stopUrl = () => { | |||||
}; | }; | ||||
onUnmounted(() => { | onUnmounted(() => { | ||||
stopUrl(); | stopUrl(); | ||||
timer && clearInterval(timer); | |||||
}); | }); | ||||
</script> | </script> | ||||
<style lang="scss" scoped> | <style lang="scss" scoped> | ||||
@@ -20,9 +20,12 @@ const props = defineProps({ | |||||
}); | }); | ||||
const statisti = ref({}); | const statisti = ref({}); | ||||
onMounted(() => { | onMounted(() => { | ||||
init(); | |||||
}); | |||||
const init = () => { | |||||
statisti.value = props.screenData.statisti; | statisti.value = props.screenData.statisti; | ||||
getCharts1(); | getCharts1(); | ||||
}); | |||||
}; | |||||
const getCharts1 = () => { | const getCharts1 = () => { | ||||
const chart = echarts.init(chart1.value); | const chart = echarts.init(chart1.value); | ||||
let data = statisti.value.labale.map((e, i) => { | let data = statisti.value.labale.map((e, i) => { | ||||
@@ -103,6 +106,9 @@ const getCharts1 = () => { | |||||
chart.resize(); | chart.resize(); | ||||
}); | }); | ||||
}; | }; | ||||
defineExpose({ | |||||
init | |||||
}); | |||||
</script> | </script> | ||||
<style lang="scss" scoped> | <style lang="scss" scoped> | ||||
</style> | </style> |
@@ -30,7 +30,13 @@ const props = defineProps({ | |||||
}); | }); | ||||
const alarmList = ref([]); | const alarmList = ref([]); | ||||
onMounted(() => { | onMounted(() => { | ||||
init(); | |||||
}); | |||||
const init = () => { | |||||
alarmList.value = props.screenData.alarmList || []; | alarmList.value = props.screenData.alarmList || []; | ||||
}; | |||||
defineExpose({ | |||||
init | |||||
}); | }); | ||||
</script> | </script> | ||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
@@ -19,10 +19,6 @@ const props = defineProps({ | |||||
}); | }); | ||||
const statisti = ref({}); | const statisti = ref({}); | ||||
let chart1 = ref(null); | let chart1 = ref(null); | ||||
onMounted(() => { | |||||
statisti.value = props.screenData.statisti; | |||||
getCharts1(); | |||||
}); | |||||
const getCharts1 = () => { | const getCharts1 = () => { | ||||
const chart = echarts.init(chart1.value); | const chart = echarts.init(chart1.value); | ||||
let data = statisti.value.labale.map((e, i) => { | let data = statisti.value.labale.map((e, i) => { | ||||
@@ -99,6 +95,16 @@ const getCharts1 = () => { | |||||
chart.resize(); | chart.resize(); | ||||
}); | }); | ||||
}; | }; | ||||
onMounted(() => { | |||||
init(); | |||||
}); | |||||
const init = () => { | |||||
statisti.value = props.screenData.statisti; | |||||
getCharts1(); | |||||
}; | |||||
defineExpose({ | |||||
init | |||||
}); | |||||
</script> | </script> | ||||
<style lang="scss" scoped> | <style lang="scss" scoped> | ||||
</style> | </style> |
@@ -37,11 +37,17 @@ const props = defineProps({ | |||||
}); | }); | ||||
const studentList = ref([]); | const studentList = ref([]); | ||||
onMounted(() => { | onMounted(() => { | ||||
init(); | |||||
}); | |||||
const init = () => { | |||||
studentList.value = props.screenData.studentList; | studentList.value = props.screenData.studentList; | ||||
studentList.value = studentList.value.map(e => { | studentList.value = studentList.value.map(e => { | ||||
e.faceUrl = e.faces.length ? e.faces[0].faceUrl : ""; | e.faceUrl = e.faces.length ? e.faces[0].faceUrl : ""; | ||||
return e; | return e; | ||||
}); | }); | ||||
}; | |||||
defineExpose({ | |||||
init | |||||
}); | }); | ||||
</script> | </script> | ||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
@@ -37,7 +37,7 @@ | |||||
</div> | </div> | ||||
<div class="right"> | <div class="right"> | ||||
<div class="time">{{ currentDate }}</div> | <div class="time">{{ currentDate }}</div> | ||||
<img src="/static/screen/img/greenLight.png" alt="" /> | |||||
<!-- <img src="/static/screen/img/greenLight.png" alt="" /> --> | |||||
</div> | </div> | ||||
</header> | </header> | ||||
</template> | </template> | ||||
@@ -62,11 +62,14 @@ let chart1 = ref(null); | |||||
let chart2 = ref(null); | let chart2 = ref(null); | ||||
let chart3 = ref(null); | let chart3 = ref(null); | ||||
onMounted(() => { | onMounted(() => { | ||||
init(); | |||||
}); | |||||
const init = () => { | |||||
getstudentPersonNum(); | getstudentPersonNum(); | ||||
getCharts1(); | getCharts1(); | ||||
getCharts2(); | getCharts2(); | ||||
getCharts3(); | getCharts3(); | ||||
}); | |||||
}; | |||||
// 学生人数 | // 学生人数 | ||||
const studentPersonNumKeyValue = { femaleNum: "女生人数", maleNum: "男生人数", totalNum: "学生总人数" }; | const studentPersonNumKeyValue = { femaleNum: "女生人数", maleNum: "男生人数", totalNum: "学生总人数" }; | ||||
const studentPersonNum_ = reactive({ | const studentPersonNum_ = reactive({ | ||||
@@ -80,7 +83,7 @@ const studentPersonNum = reactive({ | |||||
totalNum: [] | totalNum: [] | ||||
}); | }); | ||||
const getstudentPersonNum = () => { | const getstudentPersonNum = () => { | ||||
studentPersonNum_.value = props.screenData.studentPersonNum; | |||||
studentPersonNum_.value = props.screenData.studentPersonNum || { femaleNum: 0, maleNum: 0, totalNum: 0 }; | |||||
for (const key in studentPersonNum_.value) { | for (const key in studentPersonNum_.value) { | ||||
let item = studentPersonNum_.value[key]; | let item = studentPersonNum_.value[key]; | ||||
let arr = item.toString().split(""); | let arr = item.toString().split(""); | ||||
@@ -237,7 +240,7 @@ const getCharts2 = data => { | |||||
const count = ref(0); | const count = ref(0); | ||||
const getCharts3 = () => { | const getCharts3 = () => { | ||||
const chart = echarts.init(chart3.value); | const chart = echarts.init(chart3.value); | ||||
let data = props.screenData.camera; | |||||
let data = props.screenData.camera || []; | |||||
let xArr = data.map(e => e.cameraInfos.length); | let xArr = data.map(e => e.cameraInfos.length); | ||||
xArr.forEach(element => { | xArr.forEach(element => { | ||||
count.value += element; | count.value += element; | ||||
@@ -312,6 +315,9 @@ const getCharts3 = () => { | |||||
chart.resize(); | chart.resize(); | ||||
}); | }); | ||||
}; | }; | ||||
defineExpose({ | |||||
init | |||||
}); | |||||
</script> | </script> | ||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
ul { | ul { | ||||
@@ -98,7 +98,13 @@ const placeChange = () => { | |||||
} | } | ||||
}; | }; | ||||
onMounted(() => { | onMounted(() => { | ||||
init(); | |||||
}); | |||||
const init = () => { | |||||
getwarnList(); | getwarnList(); | ||||
}; | |||||
defineExpose({ | |||||
init | |||||
}); | }); | ||||
</script> | </script> | ||||
@@ -87,9 +87,12 @@ const getData = () => { | |||||
}); | }); | ||||
}; | }; | ||||
onMounted(() => { | onMounted(() => { | ||||
init(); | |||||
}); | |||||
const init = () => { | |||||
getData(); | getData(); | ||||
getRightData(); | getRightData(); | ||||
}); | |||||
}; | |||||
// 右边模块 | // 右边模块 | ||||
const groupStatisti = ref([]); | const groupStatisti = ref([]); | ||||
const getRightData = () => { | const getRightData = () => { | ||||
@@ -115,6 +118,9 @@ const setBoder1 = () => { | |||||
e.append(borderImgs); | e.append(borderImgs); | ||||
}); | }); | ||||
}; | }; | ||||
defineExpose({ | |||||
init | |||||
}); | |||||
</script> | </script> | ||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
.commontitle { | .commontitle { | ||||
@@ -80,9 +80,9 @@ const areaId = ref(""); | |||||
const sensorId = ref(""); | const sensorId = ref(""); | ||||
// 获取区域设备信息 | // 获取区域设备信息 | ||||
const getInfo = () => { | const getInfo = () => { | ||||
resInfo.value = props.screenData.camera; | |||||
resInfo.value = props.screenData.camera || []; | |||||
areaList.value = JSON.parse(JSON.stringify(resInfo.value)); | areaList.value = JSON.parse(JSON.stringify(resInfo.value)); | ||||
props.screenData.camera.forEach(e => { | |||||
resInfo.value.forEach(e => { | |||||
allDevice.value = allDevice.value.concat(e.cameraInfos); | allDevice.value = allDevice.value.concat(e.cameraInfos); | ||||
}); | }); | ||||
let obj = areaList.value.find(e => e.cameraInfos.length); | let obj = areaList.value.find(e => e.cameraInfos.length); | ||||
@@ -141,10 +141,15 @@ const stopUrl = () => { | |||||
}; | }; | ||||
onMounted(() => { | onMounted(() => { | ||||
getInfo(); | getInfo(); | ||||
init(); | |||||
}); | }); | ||||
const init = () => {}; | |||||
onUnmounted(() => { | onUnmounted(() => { | ||||
stopUrl(); | stopUrl(); | ||||
}); | }); | ||||
defineExpose({ | |||||
init | |||||
}); | |||||
</script> | </script> | ||||
<style lang="scss" scoped> | <style lang="scss" scoped> | ||||
.myvideo { | .myvideo { | ||||
@@ -11,21 +11,21 @@ | |||||
<div class="main-left"> | <div class="main-left"> | ||||
<div style="display: flex"> | <div style="display: flex"> | ||||
<div class="peapleNum myborder"> | <div class="peapleNum myborder"> | ||||
<peopeleNum :screenData="screenData"></peopeleNum> | |||||
<peopeleNum ref="peopeleNumRef" :screenData="screenData"></peopeleNum> | |||||
</div> | </div> | ||||
<div class="videoBox myborder"> | <div class="videoBox myborder"> | ||||
<myVideo :screenData="screenData"></myVideo> | |||||
<myVideo ref="myVideoRef" :screenData="screenData"></myVideo> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="todayNotice myborder"> | <div class="todayNotice myborder"> | ||||
<todayNotice :screenData="screenData"></todayNotice> | |||||
<todayNotice ref="todayNoticeRef" :screenData="screenData"></todayNotice> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<!-- 页面右边模块 --> | <!-- 页面右边模块 --> | ||||
<div> | <div> | ||||
<div class="main-right myborder"> | <div class="main-right myborder"> | ||||
<todayInfo :screenData="screenData"></todayInfo> | |||||
<todayInfo ref="todayInfoRef" :screenData="screenData"></todayInfo> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</main> | </main> | ||||
@@ -41,9 +41,22 @@ import { screenApi } from "@/api"; | |||||
const screenData = ref({}); | const screenData = ref({}); | ||||
const ready = ref(false); | const ready = ref(false); | ||||
const myHeaderRef = ref(null); | const myHeaderRef = ref(null); | ||||
const peopeleNumRef = ref(null); | |||||
const myVideoRef = ref(null); | |||||
const todayNoticeRef = ref(null); | |||||
const todayInfoRef = ref(null); | |||||
onMounted(() => { | onMounted(() => { | ||||
ready.value = false; | |||||
screenApi.getHomeData().then(res => { | |||||
getData(); | |||||
refresh(async () => { | |||||
await getData(); | |||||
peopeleNumRef.value.init(); | |||||
myVideoRef.value.init(); | |||||
todayNoticeRef.value.init(); | |||||
todayInfoRef.value.init(); | |||||
}, 60000); | |||||
}); | |||||
const getData = () => { | |||||
return screenApi.getHomeData().then(res => { | |||||
if (res.code == 200) { | if (res.code == 200) { | ||||
screenData.value = res.data; | screenData.value = res.data; | ||||
console.log(res.data); | console.log(res.data); | ||||
@@ -53,6 +66,14 @@ onMounted(() => { | |||||
}); | }); | ||||
} | } | ||||
}); | }); | ||||
}; | |||||
// 定时刷新 | |||||
var timer = ""; | |||||
const refresh = (fn = () => {}, time = 5000) => { | |||||
timer = setInterval(fn, time); | |||||
}; | |||||
onUnmounted(() => { | |||||
timer && clearInterval(timer); | |||||
}); | }); | ||||
</script> | </script> | ||||
<style lang="scss" scoped> | <style lang="scss" scoped> | ||||
@@ -81,11 +81,11 @@ const ready = ref(false); | |||||
const chamberList = ref([]); | const chamberList = ref([]); | ||||
const tableData = ref([]); | const tableData = ref([]); | ||||
const buildInfo = ref({}); | const buildInfo = ref({}); | ||||
const getStuReturnInfo = obj => { | |||||
buildInfo.value = obj; | |||||
// 归寝人数信息 | |||||
ready.value = false; | |||||
screenApi.getStudentReturnBed({ buildId: obj.value }).then(res => { | |||||
const getStuReturnInfo = async obj => { | |||||
if (obj) buildInfo.value = obj; | |||||
// 监控 | |||||
showRts(buildInfo.value.insCameraId); | |||||
screenApi.getStudentReturnBed({ buildId: buildInfo.value.value }).then(res => { | |||||
if (res.code == 200) { | if (res.code == 200) { | ||||
res.data.attendList = res.data.attendList.map(e => { | res.data.attendList = res.data.attendList.map(e => { | ||||
e.$status = e.cameraId == buildInfo.value.outCameraId ? "未归寝" : e.cameraId == buildInfo.value.insCameraId ? "归寝" : ""; | e.$status = e.cameraId == buildInfo.value.outCameraId ? "未归寝" : e.cameraId == buildInfo.value.insCameraId ? "归寝" : ""; | ||||
@@ -98,8 +98,12 @@ const getStuReturnInfo = obj => { | |||||
getstudentPersonNum(); | getstudentPersonNum(); | ||||
} | } | ||||
}); | }); | ||||
// 监控 | |||||
showRts(buildInfo.value.insCameraId); | |||||
if (!timer) refresh(getStuReturnInfo, 60000); | |||||
}; | |||||
// 定时刷新 | |||||
var timer = ""; | |||||
const refresh = (fn = () => {}, time = 5000) => { | |||||
timer = setInterval(fn, time); | |||||
}; | }; | ||||
// 性别 | // 性别 | ||||
const genderOptions = ref([ | const genderOptions = ref([ | ||||
@@ -152,6 +156,7 @@ const stopUrl = () => { | |||||
}; | }; | ||||
onUnmounted(() => { | onUnmounted(() => { | ||||
stopUrl(); | stopUrl(); | ||||
timer && clearInterval(timer); | |||||
}); | }); | ||||
// 归寝信息 | // 归寝信息 | ||||
const studentPersonNum_ = reactive({ | const studentPersonNum_ = reactive({ | ||||