qfqk-web.git - Gitblit

New file
			@@ -0,0 +1,367 @@
			<!DOCTYPE html>
			<html lang="en">

			<head>
			<meta charset="UTF-8">
			<meta name="viewport" content="width=device-width, initial-scale=1.0">
			<title>Document</title>
			<link rel="stylesheet" href="../style/FlareClusterLayer_v3.css">
			<script src='../../lib/jquery.js'></script>
			<script src='../js/FlareClusterLayer_v3.js'></script>
			<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
			<!-- element ui -->
			<link rel="stylesheet" href="../../lib/elementUi.css">
			<script src="../../lib/elementUi.js"></script>
			<!-- <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
			<script src="https://unpkg.com/element-ui/lib/index.js"></script> -->
			<script src="../../lib/axios.js"></script>
			<!-- layui -->
			<link rel="stylesheet" href="../../lib/layui/css/layui.css" media="all">
			<style>
			a:hover {
			color: white;
			}

			body {
			width: 360px;
			height: 484px;
			overflow: hidden;
			}

			#appliutwo {
			width: 330px;
			height: 484px;
			border-radius: 10px;
			margin: 16px 15px 16px 15px;
			overflow: hidden;
			/* border: springgreen solid 0.5px; */
			}

			.flare-liu-top {
			width: 330px;
			height: 140px;
			/* border: rgb(211, 154, 31) solid 0.5px; */
			display: flex;
			align-items: center;
			justify-content: center;
			flex-direction: column;
			color: white;
			border-radius: 5px 5px 5px 5px;
			}

			.f-l-t-heard {
			width: 300px;
			height: 50px;
			font-size: 18px;
			font-family: PingFangSC-Regular;
			}

			.f-l-t-right {
			width: 300px;
			height: 50px;
			display: flex;
			/* align-items: center; */
			color: white;
			justify-content: space-around;
			flex-direction: column;
			font-size: 12px;
			}


			.f-l-t-r-number {
			width: 180px;
			margin-left: auto;
			}

			.f-l-t-r-time {
			width: 180px;
			margin-left: auto;
			}



			.flare-liu-body {
			width: 330px;
			/* height: 361px; */
			/* border: rgb(106, 20, 187) solid 0.5px; */

			}

			.r-b-top {
			height: 250px;
			display: flex;
			display: flex;
			flex-direction: column;
			}

			.r-b-t-main {
			display: flex;
			align-items: center;
			justify-content: center;
			/* justify-content: space-between; */

			padding: 10px 0 10px 0;
			margin-bottom: 5px;
			}

			.r-b-t-main-once {
			display: flex;
			align-items: center;
			justify-content: center;

			padding: 10px 0 10px 0;
			margin-bottom: 5px;
			position: relative;
			left: 11px;
			}

			.rbt-l,
			.rbt-r {
			width: 150px;
			/* border: rgb(106, 20, 187) solid 0.5px; */
			}



			.r-b-t-left {
			/* display: block; */
			width: 27%;

			}

			.r-b-t-right {
			/* display: block; */
			width: 70%;
			color: #5d5d5d;
			font-size: 12px;

			}

			.scene-image-box .el-image {
			display: block;
			min-height: 200px;
			margin-bottom: 10px;
			}
			.scene-image-box{
			width: 320px;
			height: 260px;
			overflow: auto;
			}


			.el-tabs__active-bar {
			background-color: #F35B5B;
			}

			.el-tabs__item.is-active,
			.el-tabs__item:hover {
			color: #5d5d5d;
			}
			</style>
			</head>

			<body>
			<div id="appliutwo" class='police-details-box' class="layui-anim" data-anim="layui-anim-down">
			<!-- 从layui传值给iframe 的占位input -->
			<!-- <div class="aaa bbb">13223456745</div> -->
			<input type="text" id="sidIput" ref="sidIput" style="display:none">
			<div class="flare-liu-top" style="background-image: linear-gradient(to right, #F35B5B , #F35B5B)">
			<div class="f-l-t-heard">{{datas.place}}</div>
			<div class="f-l-t-right">
			<div class="f-l-t-r-number">设备编号：{{datas.deviceNumber}}</div>
			<div class="f-l-t-r-time">接警时间：{{datas.jjTime}}</div>
			</div>
			</div>
			<div class="flare-liu-body">
			<el-tabs v-model="activeName" @tab-click="handleClick">
			<el-tab-pane label="警情信息" name="first">
			<div class="r-b-top">
			<div class="r-b-t-main-once">
			<span class="r-b-t-left">接警人：</span>
			<span class="r-b-t-right">{{ datas.alarmPeople }}</span>
			</div>
			<div class="r-b-t-main-once">
			<span class="r-b-t-left">报警人：</span>
			<span class="r-b-t-right">{{ datas.galarmPeople }}</span>
			</div>
			<!-- <div class="r-b-t-main-once">
			<span class="r-b-t-left">使用方：</span>
			<span class="r-b-t-right">？？</span>
			</div> -->
			<div class="r-b-t-main">
			<div class="rbt-l">
			<span class="r-b-t-left">警情内容：</span>
			<span class="r-b-t-right">{{ datas.content }} </span>
			</div>
			<div class="rbt-r">
			<span class="r-b-t-left">警情类型：</span>
			<span class="r-b-t-right">{{datas.waringType}}</span>
			</div>
			</div>
			<div class="r-b-t-main">
			<div class="rbt-l">
			<span class="r-b-t-left">主要负责人：</span>
			<span class="r-b-t-right">{{ datas.oneContacts }} </span>
			</div>
			<div class="rbt-r">
			<span class="r-b-t-left">电话：</span>
			<span class="r-b-t-right">{{datas.onePhone}}</span>
			</div>
			</div>
			<!-- <div class="r-b-t-main">
			<div class="rbt-l">
			<span class="r-b-t-left">二级负责人：</span>
			<span class="r-b-t-right">{{ datas.twoContacts }} </span>
			</div>
			<div class="rbt-r">
			<span class="r-b-t-left">call：</span>
			<span class="r-b-t-right">{{datas.twoPhone}}</span>
			</div>
			</div>
			<div class="r-b-t-main">
			<div class="rbt-l">
			<span class="r-b-t-left">三级负责人：</span>
			<span class="r-b-t-right">{{ datas.threeContacts }} </span>
			</div>
			<div class="rbt-r">
			<span class="r-b-t-left">call：</span>
			<span class="r-b-t-right">{{datas.threePhone}}</span>
			</div>
			</div> -->
			</div>
			</el-tab-pane>
			<el-tab-pane label="现场图片" name="second">
			<!-- <el-card class="scene-image-box">
			<el-image v-for="(item, index) in imgSrc" :key="index" :src="item" :preview-src-list="srcList"
			v-show="imgSrc.length > 0"></el-image>
			<span v-show="imgSrc.length == 0">暂无现场图片</span>
			</el-card> -->

			<el-card class="scene-image-box">
			<!-- <el-image v-for="url in imgSrc" :key="url" :src="url" :preview-src-list="srcList" v-show="imgSrc.length"></el-image> -->
			<el-image v-for="url in imgSrc" :key="url" :src="url" v-show="imgSrc.length"></el-image>
			<span v-show="imgSrc.length == 0">暂无现场图片</span>
			</el-card>


			</el-tab-pane>
			<el-tab-pane label="现场视频" name="third">
			<el-card>
			<video :src="feedbackVideo" style="width: 100%; height: 100%; object-fit: fill" controls
			v-show="feedbackVideo != ''"></video>
			<span v-show="feedbackVideo == ''">暂无现场视频</span>
			</el-card>
			</el-tab-pane>
			</el-tabs>
			</div>
			</div>
			<script src="../../lib/layui/layui.js" charset="utf-8"></script>
			<script>
			// var index = parent.layer.getFrameIndex(window.name);

			</script>
			<script>
			var me = new Vue({
			el: '#appliutwo',
			data: {
			datas: {},
			activeName: 'first',
			imgSrc: [],
			srcList: [],
			feedbackVideo: "",
			//数据列表
			// aaddress: "",
			// addvnm: "",
			// alarmId: "1372093731758616577",
			// alarmPeople: "李文凤",
			// alarmTime: "2021-04-23 18:07:23",
			// alarmType: "一键报警",
			// beginTime: "",
			// bz: "",
			// channelNumber: "1",
			// cid: "1",
			// city: "3601",
			// content: "挟持报警",
			// czTime: "",
			// deptId: "1353972967606235137",
			// deviceNumber: "201685000006",
			// district: "360121",
			// endTime: "",
			// galarmPeople: "报警主机",
			// id: 255,
			// jd: "114.9220818936825",
			// jjTime: "2021-04-23 18:07:23",
			// jtype: "1",
			// level: "",
			// name: "",
			// oneContacts: "刘仁德",
			// oneId: "1370574307826212865",
			// onePhone: "1567978425",
			// phoneNumber: "",
			// place: "江西省赣州市章贡区南外街道帝景豪园",
			// province: "36",
			// region: "",
			// rname: "",
			// securityArr: "",
			// securityId: "",
			// serialNumber: "001231663A45",
			// sex: "",
			// stype: "",
			// threeContacts: "黎林帆",
			// threeId: "",
			// threePhone: "13238585082,",
			// timeDesc: "",
			// twoContacts: "宰世敏",
			// twoId: "",
			// twoPhone: "13256570082",
			// uids: "",
			// vaddress: "https://web.byisf.com/minio/jfpt/void/20210423180725.mp4",
			// waringType: "一键求助",
			// wd: "25.844357927036526",
			},
			methods: {
			getdatas(dat) {
			// console.log(dat);
			},
			handleClick(tab, event) {//标签tab点击事件
			// console.log(tab, event);
			},
			getImgAndVideo() {
			var that = this;
			// console.log(this.datas.id)
			axios({
			method: "post",
			url: "/api/feedback/feedback/selectFeedEdit",
			params: {
			jid: this.datas.id,
			},
			}).then((resdata) => {
			var dL = resdata.data.data;
			if (dL.length != 0) {
			if (dL[0].tp.length > 0) {
			// console.log(dL[0].tp);
			that.imgSrc = dL[0].tp;
			that.srcList = dL[0].tp;
			}
			if (dL[0].sp.length > 0) {
			// console.log(dL[0].sp);
			that.feedbackVideo = dL[0].sp[0];
			}
			}
			});
			},
			},
			mounted() {
			this.oldtime = setTimeout(() => {//需要同步数据处理，input中value在mounted中没有直接传值
			// console.log(this.$refs.sidIput.value);
			clearTimeout(this.oldtime);
			this.datas = JSON.parse(this.$refs.sidIput.value);//json对象转js对象
			this.getdatas(this.datas);
			this.getImgAndVideo();
			}, 200);
			}
			})
			</script>
			</body>

			</html>