309 lines
7.9 KiB
HTML
309 lines
7.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>情况处置</title>
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
body {
|
|
font-size: 15px;
|
|
/* background: #f5f5f6; */
|
|
background-color: #f5f5f6;
|
|
/* background: url('./img/bg.png'); */
|
|
/* padding: 12px; */
|
|
/* background: #fff; */
|
|
}
|
|
.bodyBg {
|
|
background: url("./img/bg.png");
|
|
background-size: cover;
|
|
height: 210px;
|
|
width: 100%;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: -1;
|
|
}
|
|
.statusBox {
|
|
display: flex;
|
|
align-items: center;
|
|
width: 350px;
|
|
height: 50px;
|
|
/* height: 36px; */
|
|
/* width: 100%; */
|
|
/* background: #fff; */
|
|
box-sizing: border-box;
|
|
padding: 5px 20px 0 20px;
|
|
/* margin-top: 10px; */
|
|
margin: 10px 12px;
|
|
/* margin-bottom: 10px; */
|
|
background: linear-gradient(
|
|
90deg,
|
|
rgba(255, 255, 255, 0) 0%,
|
|
#ffffff 100%
|
|
);
|
|
border-radius: 8px 8px 8px 8px;
|
|
}
|
|
#status {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 14px;
|
|
color: #4876ff;
|
|
line-height: 30px;
|
|
text-align: left;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
.contentBox {
|
|
background: #fff;
|
|
padding: 14px 20px;
|
|
margin: 12px;
|
|
border-radius: 8px 8px 8px 8px;
|
|
position: relative;
|
|
}
|
|
.title {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 500;
|
|
font-size: 16px;
|
|
/* color: #4876ff; */
|
|
line-height: 26px;
|
|
text-align: justify;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-right: 3px;
|
|
color: #0f194d;
|
|
/* width: 346px; */
|
|
|
|
/* justify-content: center; */
|
|
}
|
|
.content {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 15px;
|
|
color: #666666;
|
|
line-height: 26px;
|
|
text-align: justify;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
.infoItem div:nth-child(1) {
|
|
width: 90px;
|
|
}
|
|
.infoItem div:nth-child(2) {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 15px;
|
|
color: #666666;
|
|
line-height: 26px;
|
|
text-align: justify;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
/* margin-left: 20px; */
|
|
flex: 1;
|
|
}
|
|
.infoList {
|
|
line-height: 30px;
|
|
background: #f5f5f6;
|
|
padding: 19px 10px;
|
|
color: #999999;
|
|
}
|
|
.infoItem {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.imgList {
|
|
margin-bottom: 24px;
|
|
margin-top: 10px;
|
|
}
|
|
.previewImgItem {
|
|
width: 100px;
|
|
height: 100px;
|
|
border-radius: 8px;
|
|
margin-right: 10px;
|
|
}
|
|
.previewImgItem:nth-child(3n) {
|
|
margin-right: 0;
|
|
}
|
|
.border {
|
|
height: 10px;
|
|
background: #f5f5f6;
|
|
}
|
|
.previewLayer {
|
|
width: 100%;
|
|
height: 100%;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
background: #000;
|
|
display: none;
|
|
align-items: center;
|
|
}
|
|
.previewImg {
|
|
/* background-size: 100% !important; */
|
|
width: 100%;
|
|
/* height: 100%; */
|
|
}
|
|
.btn_close {
|
|
font-size: 20px;
|
|
color: #fff;
|
|
/* background: #fff; */
|
|
border-radius: 50px;
|
|
width: 50px;
|
|
height: 50px;
|
|
position: absolute;
|
|
right: 10px;
|
|
top: 10px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
img[src=""],
|
|
img:not([src]) {
|
|
visibility: hidden;
|
|
}
|
|
.icon_title {
|
|
background: url("./img/icon_title.png");
|
|
width: 13px;
|
|
height: 13px;
|
|
display: inline-block;
|
|
background-size: cover;
|
|
}
|
|
.contentBg {
|
|
height: 60px;
|
|
background: linear-gradient(
|
|
180deg,
|
|
#3f74f6 0%,
|
|
rgba(63, 116, 246, 0) 100%
|
|
);
|
|
border-radius: 8px 8px 8px 8px;
|
|
opacity: 0.1;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
}
|
|
.infoItem{
|
|
display: none;
|
|
}
|
|
</style>
|
|
<script src="./js/jquery.min.js"></script>
|
|
<script src="./js/moment.js"></script>
|
|
<script src="./js/api.js"></script>
|
|
|
|
<script>
|
|
// $(function () {
|
|
// newsId = getUrlParam("id");
|
|
// getEventInfo(id);
|
|
// });
|
|
// function getUrlParam(name) {
|
|
// var searchParams = new URLSearchParams(window.location.search);
|
|
// return searchParams.get(name);
|
|
// }
|
|
var eventId;
|
|
$(function () {
|
|
eventId = getUrlParam("id");
|
|
getEventInfo(eventId);
|
|
});
|
|
function getUrlParam(name) {
|
|
var searchParams = new URLSearchParams(window.location.search);
|
|
return searchParams.get(name);
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="bodyBg"></div>
|
|
<div class="previewLayer">
|
|
<!-- <div class="previewImg"></div> -->
|
|
<img class="previewImg" src="" alt="" />
|
|
<div class="btn_close" onclick="handleClosePreview()">X</div>
|
|
</div>
|
|
<div class="statusBox">
|
|
<div>事件状态：<span id="status"></span></div>
|
|
</div>
|
|
<!-- <div class="border"></div> -->
|
|
<div class="contentBox">
|
|
<div class="contentBg"></div>
|
|
<div class="title"><i class="icon_title"></i>详细内容</div>
|
|
<div class="content"></div>
|
|
<div class="imgList"></div>
|
|
<div class="infoList">
|
|
<!-- 基层矛盾 -->
|
|
<div class="infoItem jcmd">
|
|
<div>姓名</div>
|
|
<div id="staffName"></div>
|
|
</div>
|
|
<div class="infoItem jcmd">
|
|
<div>电话</div>
|
|
<div id="staffPhone"></div>
|
|
</div>
|
|
|
|
<!-- 线上预约 -->
|
|
<div class="infoItem xsyy">
|
|
<div>联系人</div>
|
|
<div id="staffName"></div>
|
|
</div>
|
|
<div class="infoItem xsyy">
|
|
<div>联系电话</div>
|
|
<div id="staffPhone"></div>
|
|
</div>
|
|
<div class="infoItem xsyy">
|
|
<div>报件类型</div>
|
|
<div id="type"></div>
|
|
</div>
|
|
<!-- <div class="infoItem">
|
|
<div>报件内容</div>
|
|
<div id="content"></div>
|
|
</div> -->
|
|
<!-- 应急救援 -->
|
|
<div class="infoItem yjjy">
|
|
<div>联系人</div>
|
|
<div id="staffName"></div>
|
|
</div>
|
|
<div class="infoItem yjjy">
|
|
<div>联系电话</div>
|
|
<div id="staffPhone"></div>
|
|
</div>
|
|
<div class="infoItem yjjy">
|
|
<div>时间</div>
|
|
<div id="uploadTime"></div>
|
|
</div>
|
|
<div class="infoItem yjjy">
|
|
<div>地点</div>
|
|
<div id="address"></div>
|
|
</div>
|
|
<!-- 巡查上报 -->
|
|
<div class="infoItem xcsb">
|
|
<div>上报人</div>
|
|
<div id="staffName"></div>
|
|
</div>
|
|
<div class="infoItem xcsb">
|
|
<div>上报时间</div>
|
|
<div id="uploadTime"></div>
|
|
</div>
|
|
<div class="infoItem xcsb">
|
|
<div>处置时间</div>
|
|
<div id="dealTime"></div>
|
|
</div>
|
|
<div class="infoItem xcsb">
|
|
<div>分类</div>
|
|
<div id="type2"></div>
|
|
</div>
|
|
<div class="infoItem xcsb">
|
|
<div>事件类型</div>
|
|
<div id="type"></div>
|
|
</div>
|
|
<div class="infoItem xcsb">
|
|
<div>部门</div>
|
|
<div id="dept"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|