feat:完成现场大屏接口对接

2024-06-19 20:21:25 +08:00 · 2024-06-19 20:21:25 +08:00 · cfd89da956
commit cfd89da956
parent fb286c173f
10 changed files with 584 additions and 276 deletions
--- a/src/api/modules/agjtLiveApi.ts
+++ b/src/api/modules/agjtLiveApi.ts
@ -0,0 +1,58 @@
+// 鞍钢集团现场大屏API
+import http from "@/api";
+const BASEURL = import.meta.env.VITE_API_URL;
+
+//获取企业Id的API
+export const getEnterpriseIdApi = (params: {}, showLoading: boolean) => {
+	return http.post(BASEURL + `/xmgl/enterpriseInfo/getXzSupplierInfo`, { headers: { noLoading: showLoading } });
+};
+
+//获取AI报警情况信息API
+export const countTaskProgressApi = (params: {}, showLoading: boolean) => {
+	return http.post(BASEURL + `/xmgl/xzTaskProgress/countTaskProgress`, params, { headers: { noLoading: showLoading } });
+};
+
+//获取企业信息API
+export const getEnterpriseInfoByIdApi = (params: {}, showLoading: boolean) => {
+	return http.post(BASEURL + `/xmgl/enterpriseInfo/getEnterpriseInfoById`, params, { headers: { noLoading: showLoading } });
+};
+
+//获取AI报警情况信息API
+export const selectAIPageListApi = (params: {}, showLoading: boolean) => {
+	return http.post(BASEURL + `/xmgl/aiAnalyseHardWareAlarmRecord/selectPageList`, params, { headers: { noLoading: showLoading } });
+};
+
+//安全教育视频API
+export const configWeekVideoListApi = (params: {}, showLoading: boolean) => {
+	return http.get(BASEURL + `/xmgl/educationConfigWeekVideo/list`, params, { headers: { noLoading: showLoading } });
+};
+
+//获取劳务实名制信息API---上
+export const selectPersonTypeAndEduStatisticsApi = (params: {}, showLoading: boolean) => {
+	return http.post(BASEURL + `/xmgl/workerInfo/selectPersonTypeAndEduStatistics`, params, { headers: { noLoading: showLoading } });
+};
+
+//获取劳务实名制信息API---下
+export const selectWorkerTeamAndDepartmentStatisticsApi = (params: {}, showLoading: boolean) => {
+	return http.post(BASEURL + `/xmgl/workerInfo/selectWorkerTeamAndDepartmentStatistics`, params, { headers: { noLoading: showLoading } });
+};
+
+//获取质量待办信息API
+export const qualityPageApi = (params: {}, showLoading: boolean) => {
+	return http.post(BASEURL + `/xmgl/qualityInspectionRecord/page`, params, { headers: { noLoading: showLoading } });
+};
+
+//获取安全待办信息API
+export const securityPageApi = (params: {}, showLoading: boolean) => {
+	return http.post(BASEURL + `/xmgl/xzSecurityQualityInspectionRecord/page`, params, { headers: { noLoading: showLoading } });
+};
+
+//获取应急记录信息API
+export const emergencyPageApi = (params: {}, showLoading: boolean) => {
+	return http.get(BASEURL + `/xmgl/xzEmergencyRecord/page`, params, { headers: { noLoading: showLoading } });
+};
+
+//获取应急记录信息API
+export const getStatBySpecialApi = (params: {}, showLoading: boolean) => {
+	return http.get(BASEURL + `/xmgl/xzFlow/getStatBySpecial`, params, { headers: { noLoading: showLoading } });
+};
--- a/src/views/agjtLiveScreen/liveScreen/centerBottomLeft.vue
+++ b/src/views/agjtLiveScreen/liveScreen/centerBottomLeft.vue
@ -6,31 +6,31 @@
 					<div class="topInner1">
 						<div class="innerText">
 							<div>今日出勤总人数</div>
-							<div>1024</div>
+							<div>{{lwInfo2.presencePersonTotal || 0}}</div>
 						</div>
 					</div>
 					<div class="topInner2">
 						<div class="innerText">
 							<div>在册人数</div>
-							<div>512</div>
+							<div>{{lwInfo2.totalPerson || 0}}</div>
 						</div>
 					</div>
 				</div>
-				<div class="bottomBox">
+				<div class="bottomBox" v-if="lwInfo2.list && lwInfo2.list.length > 0">
 					<el-scrollbar style="height:101.5%">
-						<div class="listItem" v-for="(item,i) in 10	" :key="i">
+						<div class="listItem" v-for="(item,i) in lwInfo2.list" :key="i">
 							<div class="itemInfo1">
-								<div style="width:50px;text-align:center">1</div>
-								<div>钢筋工-张三</div>
+								<div style="width:50px;text-align:center">{{i + 1}}</div>
+								<div>{{item.teamName}}</div>
 							</div>
-							<div class="itemInfo2">20/40</div>
+							<div class="itemInfo2">{{item.attendancePersonTotal}}/{{item.totalPerson}}</div>
 						</div>
 					</el-scrollbar>
 				</div>
-				<!-- <div class="not-data">
+				<div class="not-data" v-else>
 					<img src="@/assets/images/noData.png" alt="" />
 					<p>暂无数据</p>
-				</div> -->
+				</div>
 			</div>
 		</Card>
 	</div>
@ -41,6 +41,59 @@ import Card from "@/components/card.vue";
 import { ref, watch, onMounted } from "vue";
 import { getStageOption } from "@/api/modules/projectOverview";
 import { GlobalStore } from "@/stores";
+import { COMPANY } from "@/config/config";
+//引入现场大屏API
+import { 
+	getEnterpriseIdApi,
+	selectPersonTypeAndEduStatisticsApi,
+	selectWorkerTeamAndDepartmentStatisticsApi,
+ } from "@/api/modules/agjtLiveApi";
+const store = GlobalStore();
+
+//获取劳务实名制信息
+const lwInfo1 = ref({} as any)
+const lwInfo2 = ref({} as any)
+async function getLwInfo() {
+	//获取企业Id
+	await getEnterpriseIdApi().then(res => {
+		// console.log("获取企业id",res.result.id)
+		selectPersonTypeAndEduStatisticsApi({
+			enterpriseId: res.result.id,
+			// projectSn: store.sn,
+			projectSn: 'BD3137498CB84BF0969979E0342CDBCA' // yh001---ProjectSn
+		}).then(res1 => {
+			if(res1.success){
+				if(res1.result){
+					lwInfo1.value = res1.result.personType
+				}
+			}
+		})
+		selectWorkerTeamAndDepartmentStatisticsApi({
+			// projectSn: store.sn,
+			projectSn: 'BD3137498CB84BF0969979E0342CDBCA' // yh001---ProjectSn
+		}).then(res2 => {
+			if(res2.success){
+				if(res2.result){
+					lwInfo2.value = res2.result
+				}
+			}
+		})
+	});
+};
+
+//父组件调用需要无感刷新的方法
+const centerBottomLeftMethod = async () => {
+	getLwInfo()
+}
+
+//将方法暴露给父组件
+defineExpose({
+	centerBottomLeftMethod
+})
+
+onMounted( async () => {
+	getLwInfo()
+});

 </script>

--- a/src/views/agjtLiveScreen/liveScreen/centerBottomRight.vue
+++ b/src/views/agjtLiveScreen/liveScreen/centerBottomRight.vue
@ -1,26 +1,29 @@
 <template>
 	<div class="centerBottomRight">
 		<Card title="质量待办">
-			<div class="mainContainer">
+			<div class="mainContainer" v-if="qualityData.length != 0">
 				<el-scrollbar style="height:107%">
-					<div class="itemBox" v-for="(item,i) in 10" :key="i">
-						<div class="itemLine1">外墙、顶板、地板出现贯通性裂缝</div>
+					<div class="itemBox" v-for="(item,i) in qualityData" :key="i">
+						<div class="itemLine1">{{item.dangerItemContent || '--'}}</div>
 						<div class="itemLine2">
-							<div class="line2Inner1">整改结果：<span style="color:#19bfef">已逾期</span></div>
-							<div class="line2Inner2">责任单位：<span style="color:#19bfef">辽宁五瞏</span></div>
+							<div class="line2Inner1">整改结果：<span style="color:#19bfef">{{
+								item.status == 2 ? '待整改' : item.status == 3 ? '待复查' : item.status == 4 ? '待核验' : 
+								item.status == 5 ? '合格' : item.status == 6 ? '已撤回' : '--'
+							}}</span></div>
+							<div class="line2Inner2">责任单位：<span style="color:#19bfef">{{item.enterpriseName || '--'}}</span></div>
 						</div>
 						<div class="itemLine3">
-							<div class="line3Inner1">整改人：<span style="color:#19bfef">李四</span></div>
-							<div class="line3Inner2">检查人：<span style="">张三</span></div>
-							<div class="line3Inner3">检查时间：<span style="">2024-03-01 12:00:00</span></div>
+							<div class="line3Inner1">整改人：<span style="color:#19bfef">{{item.changeName || '--'}}</span></div>
+							<div class="line3Inner2">检查人：<span style="">{{item.inspectManName || '--'}}</span></div>
+							<div class="line3Inner3">检查时间：<span style="">{{item.inspectTime || '--'}}</span></div>
 						</div>
 					</div>
 				</el-scrollbar>
 			</div>
-			<!-- <div class="not-data">
+			<div class="not-data" v-else>
 				<img src="@/assets/images/noData.png" alt="" />
 				<p>暂无数据</p>
-			</div> -->
+			</div>
 		</Card>
 	</div>
 </template>
@ -30,6 +33,50 @@ import Card from "@/components/card.vue";
 import { ref, watch, onMounted } from "vue";
 import { getStageOption } from "@/api/modules/projectOverview";
 import { GlobalStore } from "@/stores";
+import { COMPANY } from "@/config/config";
+//引入现场大屏API
+import { 
+	getEnterpriseIdApi,
+	qualityPageApi,
+ } from "@/api/modules/agjtLiveApi";
+const store = GlobalStore();
+
+//获取质量待办信息
+const qualityData = ref([] as any)
+async function getQualityData() {
+
+	//获取企业Id
+	await getEnterpriseIdApi().then(res => {
+		if(res.success){
+			qualityPageApi({
+				page: 1,
+				pageSize: 9999,
+				status: 60,
+				// enterpriseId: res.result.id,
+				// projectSn: store.sn,
+				projectSn: 'BD3137498CB84BF0969979E0342CDBCA', // yh001---ProjectSn
+			}).then(res2 => {
+				if(res2.success){
+					qualityData.value = res2.result.page.records
+				}
+			});
+		}
+	});
+};
+
+
+//父组件调用需要无感刷新的方法
+const centerBottomRightMethod = async () => {
+
+}
+//将方法暴露给父组件
+defineExpose({
+	centerBottomRightMethod
+})
+
+onMounted( async () => {
+	getQualityData()
+});

 </script>

--- a/src/views/agjtLiveScreen/liveScreen/centerTop.vue
+++ b/src/views/agjtLiveScreen/liveScreen/centerTop.vue
@ -30,11 +30,13 @@ import Card from "@/components/card.vue";
 import { ref, onMounted, watch } from "vue";
 import { GlobalStore } from "@/stores";
 import { ElMessage } from "element-plus";
-import { selectLiveVideoListApi } from "@/api/modules/video";
+// import { selectLiveVideoListApi } from "@/api/modules/video";
 import ckplayerComp from "./ckplayerComp.vue";
 import { COMPANY } from "@/config/config";
 import setVideoDialog from "@/components/setVideoDialog.vue";
-import { configWeekVideoListApi } from "@/api/modules/agjtCommandApi";
+// import { configWeekVideoListApi } from "@/api/modules/agjtCommandApi";
+//引入现场大屏API
+import { configWeekVideoListApi } from "@/api/modules/agjtLiveApi";
 import moment from "moment";
 const store = GlobalStore();
 const videoList = ref([] as any);
@ -85,20 +87,17 @@ const configWeekVideoListFn = async (showLoading: boolean) => {
 		showLoading
 	);
 	if (res.result) {
-		console.log("===================")
-		console.log(res)
-		console.log("===================")
 		// 星期参数
 		const today = moment().format("d");
-		const weekParamsKey = ["sun", "mon", "tues", "wed", "thur", "fri", "sat"];
+		// const weekParamsKey = ["sun", "mon", "tues", "wed", "thur", "fri", "sat"];
 		// projectData.value.videoUrl = res.result[0][weekParamsKey[+today]];
-		if(today == 0) projectData.value.videoUrl = res.result[0].sun
-		if(today == 1) projectData.value.videoUrl = res.result[0].mon
-		if(today == 2) projectData.value.videoUrl = res.result[0].tues
-		if(today == 3) projectData.value.videoUrl = res.result[0].wed
-		if(today == 4) projectData.value.videoUrl = res.result[0].thur
-		if(today == 5) projectData.value.videoUrl = res.result[0].fri
-		if(today == 6) projectData.value.videoUrl = res.result[0].sat
+		if(res.result.length != 0 && today == 0) projectData.value.videoUrl = res.result[0].sun
+		if(res.result.length != 0 && today == 1) projectData.value.videoUrl = res.result[0].mon
+		if(res.result.length != 0 && today == 2) projectData.value.videoUrl = res.result[0].tues
+		if(res.result.length != 0 && today == 3) projectData.value.videoUrl = res.result[0].wed
+		if(res.result.length != 0 && today == 4) projectData.value.videoUrl = res.result[0].thur
+		if(res.result.length != 0 && today == 5) projectData.value.videoUrl = res.result[0].fri
+		if(res.result.length != 0 && today == 6) projectData.value.videoUrl = res.result[0].sat
 	}
 };
 // const getVideoList = async () => {
@ -121,10 +120,20 @@ const configWeekVideoListFn = async (showLoading: boolean) => {
 // 		}, 2000);
 // 	}
 // };
+
+//测试方法，对接口时改成相应的方法注释
+const centerTopMethod = async () => {
+	console.log("centerTopMethod")
+}
+//将方法暴露给父组件
+defineExpose({
+	centerTopMethod
+})
+
 onMounted(async () => {
 	// if (COMPANY !== "agjt") showVideo.value = 2;
 	// await getVideoList();
-	await configWeekVideoListFn(true);
+	await configWeekVideoListFn(true); 
 });
 </script>

--- a/src/views/agjtLiveScreen/liveScreen/index.vue
+++ b/src/views/agjtLiveScreen/liveScreen/index.vue
@ -1,15 +1,20 @@
 <template>
 	<div class="projectContent">
+		<div class="headerContainer">
+			<span>距离完工还有</span>
+			<div class="numberCard" v-for="(item, i) in remainDays" :key="i"><span>{{ item }}</span></div>
+			<span style="margin-left: 5px">天</span>
+		</div>
 		<div class="left">
-			<leftTop :projectData="projectData" class="leftTop" ref="leftTopRef"></leftTop>
-			<leftCenter :statisticsCount="statisticsCount" class="leftCenter"></leftCenter>
-			<leftBottom :statisticsCount="statisticsCount" class="leftBottom"></leftBottom>
+			<leftTop  class="leftTop" ref="leftTopRef"></leftTop>
+			<leftCenter class="leftCenter" ref="leftCenterRef"></leftCenter>
+			<leftBottom class="leftBottom" ref="leftBottomRef"></leftBottom>
 		</div>
 		<div class="center">
 			<centerTop :projectData="projectData" class="centerTop" ref="centerTopRef"></centerTop>
 			<div class="centerBottom">
-				<centerBottomLeft :projectData="projectData" class="centerBottomLeft" ref="centerBottomLeftRef"></centerBottomLeft>
-				<centerBottomRight :projectData="projectData" class="centerBottomRight" ref="centerBottomRightRef"></centerBottomRight>
+				<centerBottomLeft class="centerBottomLeft" ref="centerBottomLeftRef"></centerBottomLeft>
+				<centerBottomRight class="centerBottomRight" ref="centerBottomRightRef"></centerBottomRight>
 			</div>
 		</div>
 		<div class="right">
@ -29,9 +34,15 @@ import centerBottomRight from "@/views/agjtLiveScreen/liveScreen/centerBottomRig
 import rightTop from "@/views/agjtLiveScreen/liveScreen/rightTop.vue";
 import rightBottom from "@/views/agjtLiveScreen/liveScreen/rightBottom.vue";
 import { GlobalStore } from "@/stores";
-const store = GlobalStore();
 import { getWorkerStatisticsCountApi, getProjectDetail } from "@/api/modules/projectOverview";
 import { ref, onMounted, onBeforeUnmount,nextTick } from "vue";
+import { COMPANY } from "@/config/config";
+//引入现场大屏API
+import { 
+	getEnterpriseIdApi,
+	countTaskProgressApi,
+ } from "@/api/modules/agjtLiveApi";
+const store = GlobalStore();
 const statisticsCount = ref(null as any);

 const projectData = ref(null as any);
@ -41,24 +52,45 @@ const getProjectInfo = async (showLoading: boolean) => {
 	projectData.value = res.result;
 };

-//获取人员概览
-const getPersonDetail = async () => {
-	const res = await getWorkerStatisticsCountApi({ sn: store.sn });
-	statisticsCount.value = res.result;
+//获取项目剩余天数信息
+const remainDays = ref('0' as any)
+async function countTaskProgress() {
+	//获取企业Id
+	await getEnterpriseIdApi().then(res => {
+		if(res.success){
+			// console.log("获取企业id",res.result.id)
+			countTaskProgressApi({
+				enterpriseId: res.result.id,
+				// projectSn: store.sn
+				projectSn: 'BD3137498CB84BF0969979E0342CDBCA' // yh001---ProjectSn
+			}).then(res2 => {
+				remainDays.value = res2.result.projectSurplusDayNum.toString()
+			})
+		}
+	});
 };

 const leftTopRef = ref();
+const leftCenterRef = ref();
+const leftBottomRef = ref();
 const centerTopRef = ref();
 const centerBottomLeftRef = ref();
+const centerBottomRightRef = ref();
 const rightTopRef = ref();
 const rightBottomRef = ref();
+const excuteCount = ref(0)
 const callChildFn = async () => {
+	excuteCount.value++
+	// console.log('第 '+ excuteCount.value +' 次执行')
 	nextTick( async ()=>{
-		// leftTopRef.value.projectTypeEnum()
-		// centerTopRef.value.getQueryBySnData()
-		// centerBottomLeftRef.value.getProgressOption()
-		// rightTopRef.value.getSafeInfo()
-		// rightBottomRef.value.getList()
+		// leftTopRef.value.leftTopMethod()
+		// leftCenterRef.value.leftCenterMethod()
+		// leftBottomRef.value.leftBottomMethod()
+		// centerTopRef.value.centerTopMethod()
+		// centerBottomLeftRef.value.centerBottomLeftMethod()
+		// centerBottomRightRef.value.centerBottomRightMethod()
+		// rightTopRef.value.rightTopMethod()
+		// rightBottomRef.value.rightBottomMethod()
 	})
 }
 //定时器
@ -66,10 +98,8 @@ const interval = ref(null as any);
 //定时调用
 const startInterval = async () => {
 	interval.value= setInterval(() => {
-		// getPersonDetail();
-		// getProjectInfo();
-		callChildFn();
-	}, 30 * 1000);
+		// callChildFn();
+	}, 5 * 1000);
 }
 // 在组件销毁时清除 interval
 const destroyInterval = () => {
@ -85,9 +115,8 @@ window.onbeforeunload = (e) => {
 	destroyInterval();
 }
 onMounted( async () => {
-	// getPersonDetail();
-	// getProjectInfo();
 	startInterval();
+	countTaskProgress()
 });
 </script>
 <style lang="scss" scoped>
@ -143,4 +172,25 @@ onMounted( async () => {
 		}
 	}
 }
+.headerContainer{
+	display: flex;
+	color: #fff;
+	font-size: 18px;
+	position: absolute;
+	transform: translateY(-53px);
+	align-items: center;	
+	.numberCard {
+		font-size: 20px;
+		width: 12px;
+		height: 30px;
+		padding: 0 8px;
+		margin-left: 3px;
+		font-weight: bold;
+		color: #47bcec;
+		background: url("@/assets/images/commandScreen/number-bg.png") no-repeat;
+		background-size: 100% 100%;
+		display: flex;
+		align-items: center;
+	}
+}
 </style>
--- a/src/views/agjtLiveScreen/liveScreen/leftBottom.vue
+++ b/src/views/agjtLiveScreen/liveScreen/leftBottom.vue
@ -1,10 +1,10 @@
 <template>
 	<div class="leftBottom">
 		<Card title="特殊作业情况">
-			<div class="not-data" v-show="tempList.length == 0 && tempList2.length == 0 && tempList3.length == 0">
+			<!-- <div class="not-data" v-show="isShow">
 				<img src="@/assets/images/noData.png" alt="" />
 				<p>暂无数据</p>
-			</div>
+			</div> -->
 			<div class="mainContainer">
 				<div id="pieEchart" style="width:100%;height:100%"></div>
 			</div>
@ -16,26 +16,53 @@
 <script setup lang="ts">
 import Card from "@/components/card.vue";
 import { ref, onMounted, watch } from "vue";
+import { GlobalStore } from "@/stores";
 import * as echarts from 'echarts';
+import { COMPANY } from "@/config/config";
+//引入现场大屏API
+import { 
+	getStatBySpecialApi,
+ } from "@/api/modules/agjtLiveApi";
+const store = GlobalStore();

-let tempList = ref([
-	// {name:'高处作业',value:12,doing:10,per:'12.5'},{name:'断路作业',value:12,doing:10,per:'12.5'},{name:'吊装安全',value:12,doing:10,per:'12.5'},{name:'受限空间',value:12,doing:10,per:'12.5'},
-	// {name:'动火作业',value:12,doing:10,per:'12.5'},{name:'盲板抽堵',value:12,doing:10,per:'12.5'},{name:'动土作业',value:12,doing:10,per:'12.5'},{name:'临时用电',value:12,doing:10,per:'12.5'},
+const isShow = ref(false as any)
+
+const innerPie = ref([
+	// { value: 0, name: '进行中' },
+	// { value: 0, name: '已完成' },
 ] as any)
-let tempList2 = ref([
-	// { value: 123, name: '高处作业' },
-	// { value: 123, name: '断路作业' },
-	// { value: 123, name: '吊装安全' },
-	// { value: 123, name: '受限空间' },
-	// { value: 123, name: '动火作业' },
-	// { value: 123, name: '盲板抽堵' },
-	// { value: 123, name: '动土作业' },
-	// { value: 123, name: '临时用电' }
-] as any)
-let tempList3 = ref([
-	// { value: 96, name: '进行中' },
-	// { value: 80, name: '已完成' },
+const outPie = ref([
+	// {name:'高处作业',value:0,doing:0,per:0},{name:'断路作业',value:0,doing:0,per:0},{name:'吊装安全',value:0,doing:0,per:0},{name:'受限空间',value:0,doing:0,per:0},
+	// {name:'动火作业',value:0,doing:0,per:0},{name:'盲板抽堵',value:0,doing:0,per:0},{name:'动土作业',value:0,doing:0,per:0},{name:'临时用电',value:0,doing:0,per:0},
 ] as any)
+
+//获取特殊作业情况信息
+async function getSpecialInfo() {
+	await getStatBySpecialApi({
+		// projectSn: store.sn,
+		projectSn: 'BD3137498CB84BF0969979E0342CDBCA', // yh001---ProjectSn
+	}).then(res => {
+		if(res.success){
+			if(res.result){
+				//内饼图
+				if(res.result.total){
+					// innerPie.value[0].value = res.result.total.running
+					// innerPie.value[1].value = res.result.total.complete
+					innerPie.value.push({value: res.result.total.running,name:'进行中'})
+					innerPie.value.push({value: res.result.total.complete,name:'已完成'})
+				}
+				//外饼图
+				outPie.value = res.result.groupByType
+				outPie.value.map(item => {
+					item.value = item.num
+					item.value = item.num
+				})
+				drawPie()
+			}
+		}
+	});
+};
+
 function drawPie(){
 	type EChartsOption = echarts.EChartsOption;

@ -48,11 +75,15 @@ function drawPie(){
 			trigger: 'item',
 			// formatter: '{a} <br/>{b}: {c} ({d}%)'
 			formatter: function(params: any){
-				return "<div style='width:100px;height:65px'>"+
-							"<div>"+tempList.value[params.dataIndex].name+"  "+ tempList.value[params.dataIndex].per +"%</div>"+
-							"<div>已完成"+tempList.value[params.dataIndex].value+"</div>"+
-							"<div>进行中"+tempList.value[params.dataIndex].doing +"</div>"+
-						"</div>"
+				if(params.seriesName == 'innerPie'){
+					return "<div>"+ innerPie.value[params.dataIndex].name + '：' +innerPie.value[params.dataIndex].value + "</div>"
+							
+				}else{
+					return "<div style='width:auto;height:auto'>"+
+								"<div>"+outPie.value[params.dataIndex].name+"  "+ outPie.value[params.dataIndex].ratio +"%</div>"+
+								"<div>已完成："+outPie.value[params.dataIndex].complete+ '&nbsp;&nbsp;&nbsp;&nbsp;进行中：' + outPie.value[params.dataIndex].running +"</div>"+
+							"</div>"
+				}
 			},
 		},
 		// legend: {
@ -66,7 +97,7 @@ function drawPie(){
 					bottom: '5%',
 					containLabel:true
 				},
-				name: 'Access From',
+				name: 'innerPie',
 				type: 'pie',
 				selectedMode: 'single',
 				radius: [0, '30%'],
@ -77,10 +108,10 @@ function drawPie(){
 				labelLine: {
 					show: false
 				},
-				data: tempList3.value
+				data: innerPie.value
 			},
 			{
-				name: 'Access From',
+				name: 'pieCircle',
 				type: 'pie',
 				radius: ['45%', '60%'],
 				labelLine: {
@ -89,11 +120,9 @@ function drawPie(){
 				label: {
 					// formatter: '{a|{a}}{abg|}\n{hr|}\n  {b|{b}：}{c}  {per|{d}%}  ',
 					formatter: function(params: any){
-						let done = '已完成：'+ tempList.value[params.dataIndex].value + '  '
-						return '{name|'+ tempList.value[params.dataIndex].name +'}{abg|}  {per|'+ tempList.value[params.dataIndex].per +'%}\n{hr|}\n{done|'+ done 
-						+'}  进行中：' + tempList.value[params.dataIndex].doing
-						// return '{name|'+ tempList.value[params.dataIndex].name +'}{abg|}  {per|'+ tempList.value[params.dataIndex].per +'%}\n{hr|}\n已完成：' 
-						// + tempList.value[params.dataIndex].value+'  进行中：' + tempList.value[params.dataIndex].doing
+						let done = '已完成：'+ outPie.value[params.dataIndex].complete + '  '
+						return '{name|'+ outPie.value[params.dataIndex].name +'}{abg|}  {per|'+ outPie.value[params.dataIndex].ratio +'%}\n{hr|}\n{done|'+ done 
+						+'}  进行中：' + outPie.value[params.dataIndex].running
 					},
 					// backgroundColor: '#1c447b',
 					backgroundColor: 'rgba(28,68,123,0.5)',
@ -111,23 +140,12 @@ function drawPie(){
 							color: '#fff',
 							lineHeight: 20
 						},
-						// a: {
-						// 	color: '#fff',
-						// 	lineHeight: 10,
-						// 	align: 'center'
-						// },
 						hr: {
 							borderColor: '#8C8D8E',
 							width: '100%',
 							borderWidth: 1,
 							height: 0
 						},
-						// b: {
-						// 	color: '#fff',
-						// 	fontSize: 10,
-						// 	fontWeight: 'bold',
-						// 	lineHeight: 12
-						// },
 						per: {
 							color: '#fff',
 							backgroundColor: '#4C5058',
@ -136,17 +154,7 @@ function drawPie(){
 						}
 					}
 				},
-				data: tempList2.value
-				// data: [
-				// 	{ value: 104, name: '高处作业' },
-				// 	{ value: 335, name: '断路作业' },
-				// 	{ value: 310, name: '吊装安全' },
-				// 	{ value: 251, name: '受限空间' },
-				// 	{ value: 234, name: '动火作业' },
-				// 	{ value: 147, name: '盲板抽堵' },
-				// 	{ value: 135, name: '动土作业' },
-				// 	{ value: 102, name: '临时用电' }
-				// ]
+				data: outPie.value
 			}
 		]
 		
@ -154,42 +162,19 @@ function drawPie(){

 	option && myChart.setOption(option);
 }
-watch(tempList2, (newV,oldV) => {
-	if(newV.length !== 0){
-		// drawPie()
-	}
-})
-watch(tempList, (newV,oldV) => {
-	if(newV.length !== 0){
-		// drawPie()
-	}
-})
-function getData(){
-	// setTimeout(() => {
-		tempList.value = [
-			{name:'高处作业',value:12,doing:10,per:'12.5'},{name:'断路作业',value:12,doing:10,per:'12.5'},{name:'吊装安全',value:12,doing:10,per:'12.5'},{name:'受限空间',value:12,doing:10,per:'12.5'},
-			{name:'动火作业',value:12,doing:10,per:'12.5'},{name:'盲板抽堵',value:12,doing:10,per:'12.5'},{name:'动土作业',value:12,doing:10,per:'12.5'},{name:'临时用电',value:12,doing:10,per:'12.5'},
-		]
-		tempList2.value = [
-			{ value: 123, name: '高处作业' },
-			{ value: 123, name: '断路作业' },
-			{ value: 123, name: '吊装安全' },
-			{ value: 123, name: '受限空间' },
-			{ value: 123, name: '动火作业' },
-			{ value: 123, name: '盲板抽堵' },
-			{ value: 123, name: '动土作业' },
-			{ value: 123, name: '临时用电' }
-		]
-		tempList3.value = [
-			{ value: 96, name: '进行中' },
-			{ value: 80, name: '已完成' },
-		]
-	// },1000)
-	drawPie()
+
+
+//测试方法，对接口时改成相应的方法注释
+const leftBottomMethod = async () => {
+	console.log("leftBottomMethod")
 }
+//将方法暴露给父组件
+defineExpose({
+	leftBottomMethod
+})
+
 onMounted( async () => {
-	
-	getData()
+	getSpecialInfo()
 });
 </script>

--- a/src/views/agjtLiveScreen/liveScreen/leftCenter.vue
+++ b/src/views/agjtLiveScreen/liveScreen/leftCenter.vue
@ -1,17 +1,18 @@
 <template>
 	<div class="leftCenter">
 		<Card title="AI报警情况">
-			<div class="mainContainer">
-				<div class="imgBox"><img src="@\assets\images\vehicleManagement\goCar.png"/></div>
+			<div class="mainContainer" v-if="isData">
+				<!-- <div class="imgBox"><img src="@\assets\images\vehicleManagement\goCar.png"/></div> -->
+				<div class="imgBox"><img :src="BASEURL + '/image/' + alarmInfo.imageUrl"/></div>
 				<div class="textBox">
-					<div>报警位置：东南口</div>
-					<div>报警事件：2024-03-01 12:00:00</div>
+					<div>报警位置：{{alarmInfo.location || '--'}}</div>
+					<div>报警时间：{{alarmInfo.createTime || '--'}}</div>
 				</div>
 			</div>
-			<!-- <div class="not-data">
+			<div class="not-data" v-else>
 				<img src="@/assets/images/noData.png" alt="" />
 				<p>暂无数据</p>
-			</div> -->
+			</div>
 		</Card>
 	</div>
 </template>
@ -19,13 +20,58 @@
 <script setup lang="ts">
 import Card from "@/components/card.vue";
 import { GlobalStore } from "@/stores";
-import { COMPANY } from "@/config/config";
 import { ref, onMounted, watch } from "vue";
-import { getPersonTypeAndEduStatisticsApi } from "@/api/modules/labor";
+import { COMPANY } from "@/config/config";
+
+//引入现场大屏API
+import {
+	getEnterpriseIdApi,
+	selectAIPageListApi,
+ } from "@/api/modules/agjtLiveApi";
 const store = GlobalStore();
-// ts
+
+//是否有数据
+const isData = ref(false as any)
+
+//获取AI报警情况信息
+const alarmInfo = ref({} as any)
+async function getAlarmInfo() {
+	//获取企业Id
+	await getEnterpriseIdApi().then(res => {
+		if(res.success){
+			// console.log("获取企业id",res.result.id)
+			selectAIPageListApi({
+				pageNo: 1,
+				pageSize: 1,
+				enterpriseId: res.result.id,
+				isPushed: 1,
+				// projectSn: store.sn,
+				projectSn: 'BD3137498CB84BF0969979E0342CDBCA' // yh001---ProjectSn
+			}).then(res2 => {
+				if(res2.success){
+					if(res2.result.records && res2.result.records.length !== 0){
+						alarmInfo.value = res2.result.records[0]
+						isData.value = true
+					}else{
+						isData.value = false
+					}
+				}
+			})
+		}
+	});
+};
+
+//父组件调用需要无感刷新的方法
+const leftCenterMethod = async () => {
+	getAlarmInfo()
+}
+//将方法暴露给父组件
+defineExpose({
+	leftCenterMethod
+})

 onMounted( async () => {
+	getAlarmInfo()
 });
 </script>

--- a/src/views/agjtLiveScreen/liveScreen/leftTop.vue
+++ b/src/views/agjtLiveScreen/liveScreen/leftTop.vue
@ -1,47 +1,36 @@
 <template>
 	<div class="leftTop">
-		<div class="headerContainer">
-			<span>距离完工还有</span>
-			<div class="numberCard" v-for="(item, i) in '120'" :key="i"><span>{{ item }}</span></div>
-			<span style="margin-left: 5px">天</span>
-		</div>
 		<Card title="承包商项目信息">
-			<!-- <div class="projectInfo">
-				<div><span>项目名称：</span> {{ projectData.projectName || "" }}</div>
-				<div :title="projectLocal"><span>项目地址：</span> {{ projectLocal }}</div>
-				<div><span>项目经理：</span> {{ projectData.projectManage || "" }}</div>
-				<div><span>联系电话：</span> {{ projectData.projectTel || "" }}</div>
-				<div><span>建筑面积：</span> {{ projectData.projectAcreage || "" }} ㎡</div>
-				<div><span>开工日期：</span> {{ projectData.startWorkDate || "" }}</div>
-				<div><span>项目编号：</span> {{ projectData.projectNumber || "" }}</div>
-				<div><span>工程类别：</span> {{ projectData.projectType &&  projectTypeEnumList.length > 0 ? projectTypeEnumList[projectData.projectType - 1].name : "" }}</div>
-			</div> -->
 			<div class="mainContainer">
-				<div>承包商名称：辽宁五瞏</div>
+				<div>承包商名称：{{cbsProjectInfo.cbsName || '--'}}</div>
 				<div class="lineBox">
-					<div class="boxInner1">施工区域：东北角一区</div><div class="boxInner2">工程状态：在建</div>
+					<div class="boxInner1">施工区域：{{cbsProjectInfo.projectBuildArea || '--'}}</div>
+					<div class="boxInner2">工程状态：{{cbsProjectInfo.bulidStatus == 0 ? '未开工' : cbsProjectInfo.bulidStatus == 1 ? '在建' : 
+						cbsProjectInfo.bulidStatus == 2 ? '停工' : cbsProjectInfo.bulidStatus == 3 ? '验收' : cbsProjectInfo.bulidStatus == 4 ? '完工' : '--'}}</div>
 				</div>
 				<div class="lineBox">
-					<div class="boxInner1">项目编号：鞍高开项备[2021]23号</div><div class="boxInner2">项目类编号：002</div>
+					<div class="boxInner1">项目编号：{{cbsProjectInfo.projectNumber || '--'}}</div>
+					<div class="boxInner2">建筑面积：<span v-if="cbsProjectInfo.projectAcreage">{{cbsProjectInfo.projectAcreage + '㎡'}}</span><span v-else>--</span></div>
 				</div>
 				<div class="lineBox">
-					<div class="boxInner1">项目经理：王海龙</div><div class="boxInner2">联系电话：13312545623</div>
+					<div class="boxInner1">项目经理：{{cbsProjectInfo.projectManage || '--'}}</div>
+					<div class="boxInner2">联系电话：{{cbsProjectInfo.projectTel || '--'}}</div>
 				</div>
 				<div class="lineBox">
-					<div class="boxInner1">项目类型：epc总承包</div><div class="boxInner2">工程类别：矿山</div>
+					<div class="boxInner1">项目类型：{{cbsProjectInfo.cbsProjectTypeName || '--'}}</div>
+					<div class="boxInner2">工程类别：{{cbsProjectInfo.projectTypeName || '--'}}</div>
 				</div>
 				<div class="lineBox">
-					<div class="boxInner1">开工日期：2024-03-01</div><div class="boxInner2">竣工日期：2024-03-01</div>
+					<div class="boxInner1">开工日期：{{cbsProjectInfo.startWorkDate || '--'}}</div>
+					<div class="boxInner2">竣工日期：{{cbsProjectInfo.completionDate || '--'}}</div>
 				</div>
 				<div class="lineBox">
-					<div class="boxInner1">施工阶段：主体施工</div><div class="boxInner2">结构类型：混合结构</div>
+					<div class="boxInner1">施工阶段：{{cbsProjectInfo.constructionStageName || '--'}}</div>
+					<div class="boxInner2">结构类型：{{cbsProjectInfo.structureTypeName || '--'}}</div>
 				</div>
-				<div class="lineBox">
+				<!-- <div class="lineBox">
 					<div class="boxInner1">投资总额：12457万元</div><div class="boxInner2">合同总额：230万元</div>
-				</div>
-				<div class="lineBox">
-					<div class="boxInner1">建筑面积：12457㎡</div><div class="boxInner2"></div>
-				</div>
+				</div> -->
 			</div>
 		</Card>
 	</div>
@ -51,58 +40,42 @@
 import Card from "@/components/card.vue";
 import { GlobalStore } from "@/stores";
 import { ref, onMounted, watch } from "vue";
-import { getStageOption } from "@/api/modules/projectOverview";
-
-// ts
-type Props = {
-	projectData?: any; // 传入项目信息
-};
-// withDefaults 定义默认值(传入的数据类型同默认值)
-const props = withDefaults(defineProps<Props>(), {
-	projectData: {}
-});
-// 项目信息
-const projectData = ref({} as any);
-
-const projectLocal = ref("" as any);
+import { COMPANY } from "@/config/config";
+//引入现场大屏API
+import { 
+	getEnterpriseIdApi,
+	getEnterpriseInfoByIdApi,
+ } from "@/api/modules/agjtLiveApi";
 const store = GlobalStore();
-const projectTypeEnumList:any = ref([]); //工程类别
-// 工程类别字典数据
-const projectTypeEnum = async () => {
-	const res: any = await getStageOption({ dictionaryEncoding: "project_type", projectSn: store.sn });
-	if (res.result.length > 0) {
-		let newArray = res.result.map((item: any) => {
-			return {
-				name: item.name,
-				id: Number(item.data)
-			};
-		});
-		projectTypeEnumList.value = newArray
-	} else {
-		projectTypeEnumList.value = []
-	}
+
+const cbsProjectInfo = ref({} as any)
+async function getCbsProjectInfo() {
+	//获取企业Id
+	await getEnterpriseIdApi().then(res => {
+		if(res.success){
+			// console.log("获取企业id",res.result.id)
+			getEnterpriseInfoByIdApi({
+				enterpriseId: res.result.id,
+				// projectSn: store.sn
+				projectSn: 'BD3137498CB84BF0969979E0342CDBCA' // yh001---ProjectSn
+			}).then(res2 => {
+				cbsProjectInfo.value = res2.result.projectEnterprise
+			})
+		}
+	});
 };
+
+//父组件调用需要无感刷新的方法
+const leftTopMethod = async () => {
+	getCbsProjectInfo()
+}
 //将方法暴露给父组件
 defineExpose({
-	projectTypeEnum
+	leftTopMethod
 })
 onMounted( async () => {
-	// await projectTypeEnum();
+	getCbsProjectInfo()
 })
-watch(
-	() => props.projectData,
-	newVal => {
-		if (newVal) {
-			// props.xData = newVal;
-			projectData.value = newVal;
-			projectLocal.value =
-				projectData.value.provinceName +
-				projectData.value.cityName +
-				projectData.value.areaName +
-				projectData.value.projectAddress;
-		}
-	}
-);
 </script>

 <style lang="scss" scoped>
@ -155,27 +128,7 @@ watch(
 	// 	}
 	// }
 }
-.headerContainer{
-	display: flex;
-	color: #fff;
-	font-size: 18px;
-	position: absolute;
-	transform: translateY(-53px);
-	align-items: center;	
-	.numberCard {
-		font-size: 20px;
-		width: 12px;
-		height: 30px;
-		padding: 0 8px;
-		margin-left: 3px;
-		font-weight: bold;
-		color: #47bcec;
-		background: url("@/assets/images/commandScreen/number-bg.png") no-repeat;
-		background-size: 100% 100%;
-		display: flex;
-		align-items: center;
-	}
-}
+
 ::v-deep .h-card .content {
 	height: 80%;
 }
--- a/src/views/agjtLiveScreen/liveScreen/rightBottom.vue
+++ b/src/views/agjtLiveScreen/liveScreen/rightBottom.vue
@ -1,26 +1,40 @@
 <template>
 	<div class="rightBottom">
 		<Card title="安全待办">
-			<div class="mainContainer">
+			<div class="mainContainer" v-if="securityData.length">
 				<el-scrollbar style="height:102.5%">
-				<div class="itemBox" v-for="(item,i) in 10" :key="i">
-					<div class="itemLine1">外墙、顶板、地板出现贯通性裂缝</div>
-					<div class="itemLine2">
-						<div class="line2Inner1">整改结果：<span style="color:#19bfef">已逾期</span></div>
-						<div class="line2Inner2">责任单位：<span style="color:#19bfef">辽宁五瞏</span></div>
+					<div class="itemBox" v-for="(item,i) in securityData" :key="i">
+						<!-- <div class="itemLine1">{{item.dangerItemContent}}</div>
+						<div class="itemLine2">
+							<div class="line2Inner1">整改结果：<span style="color:#19bfef">已逾期</span></div>
+							<div class="line2Inner2">责任单位：<span style="color:#19bfef">辽宁五瞏</span></div>
+						</div>
+						<div class="itemLine3">
+							<div class="line3Inner1">整改人：<span style="color:#19bfef">李四</span></div>
+							<div class="line3Inner2">检查人：<span style="">张三</span></div>
+							<div class="line3Inner3">检查时间：<span style="">2024-03-01 12:00:00</span></div>
+						</div> -->
+						
+						<div class="itemLine1">{{item.dangerItemContent || '--'}}</div>
+						<div class="itemLine2">
+							<div class="line2Inner1">整改结果：<span style="color:#19bfef">{{
+								item.status == 2 ? '待整改' : item.status == 3 ? '待复查' : item.status == 4 ? '待核验' : 
+								item.status == 5 ? '合格' : item.status == 6 ? '已撤回' : '--'
+							}}</span></div>
+							<div class="line2Inner2">责任单位：<span style="color:#19bfef">{{item.enterpriseName || '--'}}</span></div>
+						</div>
+						<div class="itemLine3">
+							<div class="line3Inner1">整改人：<span style="color:#19bfef">{{item.changeName || '--'}}</span></div>
+							<div class="line3Inner2">检查人：<span style="">{{item.inspectManName || '--'}}</span></div>
+							<div class="line3Inner3">检查时间：<span style="">{{item.inspectTime || '--'}}</span></div>
+						</div>
 					</div>
-					<div class="itemLine3">
-						<div class="line3Inner1">整改人：<span style="color:#19bfef">李四</span></div>
-						<div class="line3Inner2">检查人：<span style="">张三</span></div>
-						<div class="line3Inner3">检查时间：<span style="">2024-03-01 12:00:00</span></div>
-					</div>
-				</div>
 				</el-scrollbar>
 			</div>
-			<!-- <div class="not-data">
+			<div class="not-data" v-else>
 				<img src="@/assets/images/noData.png" alt="" />
 				<p>暂无数据</p>
-			</div> -->
+			</div>
 		</Card>
 	</div>
 </template>
@ -31,9 +45,40 @@ import { getCurrentDayAirQualityApi } from "@/api/modules/projectOverview";
 import { ref, onMounted, reactive } from "vue";
 // import * as echarts from "echarts";
 import Card from "@/components/card.vue";
+import { COMPANY } from "@/config/config";
+//引入现场大屏API
+import { 
+	securityPageApi,
+ } from "@/api/modules/agjtLiveApi";
 const store = GlobalStore();

+//获取安全待办信息
+const securityData = ref([] as any)
+async function getSecurityData() {
+	await securityPageApi({
+		page: 1,
+		pageSize: 9999,
+		status: 60,
+		// projectSn: store.sn,
+		projectSn: 'BD3137498CB84BF0969979E0342CDBCA', // yh001---ProjectSn
+	}).then(res => {
+		if(res.success){
+			securityData.value = res.result.page.records
+		}
+	});
+};
+
+//测试方法，对接口时改成相应的方法注释
+const rightBottomMethod = async () => {
+	console.log("rightBottomMethod")
+}
+//将方法暴露给父组件
+defineExpose({
+	rightBottomMethod
+})
+
 onMounted( async () => {
+	getSecurityData()
 });
 </script>

@ -65,10 +110,10 @@ onMounted( async () => {
 				line-height: 20px;
 				display: flex;
 				.line2Inner1{
-					width: 28%
+					width: 30%
 				}
 				.line2Inner2{
-					width: 72%
+					width: 70%
 				}
 			}
 			.itemLine3{
@ -77,13 +122,13 @@ onMounted( async () => {
 				display: flex;
 				justify-content: space-between;
 				.line3Inner1{
-					width: 28%;
+					width: 30%;
 				}
 				.line3Inner2{
-					width: 28%;
+					width: 30%;
 				}
 				.line3Inner3{
-					width: 44%;
+					width: 40%;
 				}
 			}
 		}
--- a/src/views/agjtLiveScreen/liveScreen/rightTop.vue
+++ b/src/views/agjtLiveScreen/liveScreen/rightTop.vue
@ -1,34 +1,41 @@
 <template>
 	<div class="rightTop">
 		<Card title="应急记录">
-			<div class="mainContainer">
+			<div class="mainContainer" v-if="emergencyData.length != 0">
 				<el-scrollbar style="height:104.5%">
-					<div class="itemBox" v-for="(item,i) in 10" :key="i">
+					<div class="itemBox" v-for="(item,i) in emergencyData" :key="i">
 						<div class="itemLeft">
 							<div style="font-size:24px;transform:translateY(-3px)">⚠</div>
-							<div style="margin-left:8px">事项</div>
+							<div style="margin-left:5px">事项</div>
 						</div>
 						<div class="itemRight">
 							<div class="rightTop">
-								<div class="overHiddenText" style="width:60%">被困电梯，需要救援</div>
-								<div style="width:20%">检查人：张三</div>
+								<div class="overHiddenText" style="width:50%">{{item.emergencyTypeName || '--'}}</div>
+								<div class="overHiddenText" style="width:50%;float:right">应急责任人：{{item.emergencyManager || '--'}}</div>
 							</div>
 							<div class="rightCenter">
-								<div style="">责任单位：辽宁五瞏</div>
+								<div style="" class="rcInner1 overHiddenText">报警人：{{item.alarmPersonName || '--'}}</div>
+								<div style="" class="rcInner2 overHiddenText">所属企业：{{item.enterpriseName || '--'}}</div>
 							</div>
 							<div class="rightBottom">
-								<div class="rbInner1">处理状态：已处理</div>
-								<div class="rbInner2">处理报告：下载</div>
-								<div class="rbInner3">2024-03-01 12:00:00</div>
+								<div class="rbInner1">处置状态：{{
+									item.dispositionStatus == 1 ? '待救援' : 
+									item.dispositionStatus == 2 ? '救援中' : 
+									item.dispositionStatus == 3 ? '已救援' : '--'
+								}}</div>
+								<div class="rbInner2" v-if="item.dispositionStatus == 3">处置报告：
+									<span style="cursor:pointer" @click="downloadReport(item.disposalReport)">下载</span>
+								</div>
+								<div class="rbInner3">{{item.updateDate || '--'}}</div>
 							</div>
 						</div>
 					</div>
 				</el-scrollbar>
 			</div>
-			<!-- <div class="not-data">
+			<div class="not-data" v-else>
 				<img src="@/assets/images/noData.png" alt="" />
 				<p>暂无数据</p>
-			</div> -->
+			</div>
 		</Card>
 	</div>
 </template>
@ -37,10 +44,59 @@
 import Card from "@/components/card.vue";
 import { onMounted, ref } from "vue";
 import { GlobalStore } from "@/stores";
-const store = GlobalStore();
 import * as echarts from "echarts";
+import { COMPANY } from "@/config/config";
+//引入现场大屏API
+import { 
+	emergencyPageApi
+ } from "@/api/modules/agjtLiveApi";
+const store = GlobalStore();
+
+//获取应急记录信息
+const emergencyData = ref([] as any)
+async function getEmergencyDataData() {
+	await emergencyPageApi({
+		page: 1,
+		pageSize: 9999,
+		// inDispositionStatus: '',  // 数据类型：字符串，1：待救援、2：救援中、3：已救援
+		// projectSn: store.sn,
+		projectSn: 'BD3137498CB84BF0969979E0342CDBCA', // yh001---ProjectSn
+	}).then(res => {
+		if(res.success){
+			emergencyData.value = res.result.records
+		}
+	});
+};
+
+function downloadReport(row){
+	const url = row && row != "null" && JSON.parse(row)[0].url;
+        const fileName = row && row != "null" && JSON.parse(row)[0].name;
+        if (!url) {
+            this.$message.warning('暂无下载文件');
+            return
+        }
+        fetch(url)
+            .then(response => response.blob())
+            .then(blob => {
+                const link = document.createElement('a');
+                link.href = URL.createObjectURL(blob);
+                link.download = fileName;
+                link.target = "_blank"; // 可选，如果希望在新窗口中下载文件，请取消注释此行
+                link.click();
+            });
+}
+
+//测试方法，对接口时改成相应的方法注释
+const rightTopMethod = async () => {
+	console.log("rightTopMethod")
+}
+//将方法暴露给父组件
+defineExpose({
+	rightTopMethod
+})

 onMounted(async () => {
+	getEmergencyDataData()
 });
 </script>

@ -60,7 +116,7 @@ onMounted(async () => {
 			justify-content: space-between;
 			margin-bottom: 10px;
 			.itemLeft{
-				width: 16%;
+				width: 15%;
 				height: 100%;
 				border-left: 2px solid #f73758;
 				background-color: rgba($color: darkred, $alpha: 0.4);
@ -71,7 +127,7 @@ onMounted(async () => {
 			}
 			.itemRight{
 				height: calc(100% - 10px);
-				width: calc(82% - 10px);
+				width: calc(83% - 10px);
 				padding: 5px 5px;
 				// background-color: rgba($color: #a85454, $alpha: 0.3);
 				background: repeating-linear-gradient(100deg, rgba(200,10,10,0.1), rgba(200,10,10,0.1) 20px, rgba(0,0,0,0) 20px, rgba(0,0,0,0) 40px), 
@ -91,6 +147,12 @@ onMounted(async () => {
 					width: 100%;
 					display: flex;
 					justify-content: flex-end;
+					.rcInner1{
+						width: 50%;
+					}
+					.rcInner2{
+						width: 50%;
+					}
 				}
 				.rightBottom{
 					color: #19bfef;