Skip to content

J
jcy_monitor
Commit 71b8bf65 authored by beilang's avatar beilang
Browse files
Options

修改新收犯平面图

parent a84dc97c
Hide whitespace changes
Inline Side-by-side
Showing with 172 additions and 165 deletions
src/main/java/com/ces/web/xinshoufan/controller/XinshoufanController.java
View file @ 71b8bf65
......@@ -32,9 +32,9 @@ public class XinshoufanController {
return new ModelAndView("xsf/jqtwo");
}
@GetMapping("/jqthere")
public ModelAndView jqthereIndex(){
return new ModelAndView("xsf/jqthere");
@GetMapping("/jqthree")
public ModelAndView jqthreeIndex(){
return new ModelAndView("xsf/jqthree");
}
@GetMapping("/jqfour")
......
src/main/webapp/WEB-INF/views/xsf/areaPlan.jsp
View file @ 71b8bf65
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<jsp:include page="../base.jsp"/>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="${ctx}/static/css/floorcommon.css"/>
<title>新收犯监狱</title>
<script src="${ctx}/static/js/flexible.js"></script>
<link rel="stylesheet" href="${ctx}/static/css/common.css">
<style>
.area-right{
background: url(${ctx}/static/images/floor_lp.png) no-repeat;
height: 23rem;
float: right;
background-size: cover;
width: 78%;
background-size: 100% 100%;
}
.area-box li {
cursor: pointer;
</head>
<script type="text/javascript">
$(function () {
updateData(1);
});
function updateData(index) {
let dataList = {
'arr1': [
{
top: '2.2rem',
left: '-0.3rem',
width: '2.7rem',
height: '1.2rem',
text: '五监区',
href: '/xsf/jqfive'
},
{
top: '3.4rem',
left: '-0.3rem',
width: '2.7rem',
height: '1.1rem',
text: '九监区',
href: '/xsf/jqnine'
},
{
top: '4.4rem',
left: '-0.5rem',
width: '1.5rem',
height: '1.4rem',
text: '七监区',
href: '/xsf/jqseven'
},
{
top: '4.3rem',
left: '1.5rem',
width: '1.5rem',
height: '1.4rem',
text: '八监区',
href: '/xsf/jqeight'
}, {
top: '1.9rem',
left: '2.8rem',
width: '2.3rem',
height: '1.4rem',
text: '四监区',
href: '/xsf/jqfour'
}, {
top: '1.8rem',
left: '5.4rem',
width: '2.6rem',
height: '1.2rem',
text: '三监区',
href: '/xsf/jqthree'
}, {
top: '3rem',
left: '5.9rem',
width: '2.6rem',
height: '0.9rem',
text: '二监区',
href: '/xsf/jqtwo'
}, {
top: '3.9rem',
left: '6.5rem',
width: '2.8rem',
height: '1.3rem',
text: '一监区',
href: '/xsf/jqone'
}
]
}
.area-box li a{
color: #fff;
var divElement = document.querySelector('.room_box');
let htmlTxt = '<img class="bg_img" src="${ctx}/static/images/dalou/xinshofang.png" alt="">'
let _this = this;
for (let i = 0; i < dataList[`arr${"${index}"}`].length; i++) {
htmlTxt = htmlTxt + '<div style= position:absolute;cursor:pointer;width:' +
dataList[`arr${"${index}"}`][i].width + ";height:" + dataList[`arr${"${index}"}`][i].height
+ ';top:' + dataList[`arr${"${index}"}`][i].top + ";left:" + dataList[`arr${"${index}"}`][i].left
+ ' ' + ' onclick="handleClick(\'' + dataList[`arr${"${index}"}`][i].href + '\')"><div class="icon_text"><div class="text_ms" style=top:' + dataList[`arr${"${index}"}`][i].top + ";left:" + dataList[`arr${"${index}"}`][i].left + '><a>' + dataList[`arr${"${index}"}`][i].text + '</a></div></div></div>';
}
</style>
</head>
divElement.innerHTML = htmlTxt;
}
function handleClick(href) {
window.location.href = ctx + href;
}
</script>
<body>
<div class="container">
<div class="main-area">
<div class="header-area">
<img src="${ctx}/static/images/logo_mc.png"/>
</div>
<div class="area-content">
<div class="area-left">
<div class="title"><a href="${ctx}/atlas">新收犯监狱</a></div>
<div class="left-menu">
<ul>
<li>
<div class="content">
<div class="header-area">
<div class="content_top"></div>
</div>
<div class=" padding_box2 clearfix">
<div class="menu_box">
<div class="menu_title_box"><a href="${ctx}/atlas">新收犯监狱</a></div>
<div class="tab_list">
<ul>
<li>
<div class="flex-box">
<a href="${ctx}/xsf/jqone">
<div class="menu-mc">
<span>一监区</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #ff6363;">55</span>
</div>
<p class="tabName">一监区</p>
<p class="monitor">监控点<span style="background-color: #ff6363;">55</span></p>
</a>
</li>
<li>
</div>
</li>
<li>
<div class="flex-box">
<a href="${ctx}/xsf/jqtwo">
<div class="menu-mc">
<span>二监区</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style=" background-color: #ffba00;">55</span>
</div>
</a>
</li>
<li>
<a href="${ctx}/xsf/jqthere">
<div class="menu-mc">
<span>三监区</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #43e04e;">55</span>
</div>
</a>
</li>
<li>
<p class="tabName">二监区</p>
<p class="monitor">监控点 <span style="background-color: #ffba00;">55</span></p>
</a>
</div>
</li>
<li>
<div class="flex-box">
<a href="${ctx}/xsf/jqthree">
<p class="tabName">三监区</p>
<p class="monitor">监控点 <span style="background-color: #43e04e;">55</span></p>
</a>
</div>
</li>
<li>
<div class="flex-box">
<a href="${ctx}/xsf/jqfour">
<div class="menu-mc">
<span>四监区</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style=" background-color: #2f8fff;">55</span>
</div>
<p class="tabName">四监区</p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">55</span></p>
</a>
</li>
<li>
</div>
</li>
<li>
<div class="flex-box">
<a href="${ctx}/xsf/jqfive">
<div class="menu-mc">
<span>五监区</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #ff6363;">20</span>
</div>
<p class="tabName">五监区</p>
<p class="monitor">监控点 <span style="background-color: #ff8a00;">20</span></p>
</a>
</li>
<li>
</div>
</li>
<li>
<div class="flex-box">
<a href="${ctx}/xsf/jqseven">
<div class="menu-mc">
<span>七监区</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #ffba00;">8</span>
</div>
<p class="tabName">七监区</p>
<p class="monitor">监控点 <span style="background-color: #ffba00;">8</span></p>
</a>
</li>
<li>
</div>
</li>
<li>
<div class="flex-box">
<a href="${ctx}/xsf/jqeight">
<div class="menu-mc">
<span>八监区</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #43e04e;">18</span>
</div>
<p class="tabName">八监区</p>
<p class="monitor">监控点 <span style="background-color: #2f8fff;">18</span></p>
</a>
</li>
<li>
</div>
</li>
<li>
<div class="flex-box">
<a href="${ctx}/xsf/jqnine">
<div class="menu-mc">
<span>九监区</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #ff8a00;">79</span>
</div>
<p class="tabName">九监区</p>
<p class="monitor">监控点 <span style="background-color: #2f8fff;">79</span></p>
</a>
</li>
</ul>
</div>
</div>
</li>
</ul>
</div>
<div class="area-right">
<div class="area-box">
<ul>
<li class="a_floor">
<a href="${ctx}/xsf/jqone">
<img src="${ctx}/static/images/A_floor.png"/>
<span>一监区</span>
</a>
</li>
<li class="bg1_floor">
<a href="${ctx}/xsf/jqtwo">
<img src="${ctx}/static/images/bgq_floor.png"/>
<span>二监区</span>
</a>
</li>
<li class="b_floor">
<a href="${ctx}/xsf/jqthere">
<img src="${ctx}/static/images/B_floor.png"/>
<span>三监区</span>
</a>
</li>
<li class="g_floor">
<a href="${ctx}/xsf/jqfour">
<img src="${ctx}/static/images/G_floor.png"/>
<span>四监区</span>
</a>
</li>
<li class="c_floor">
<a href="${ctx}/xsf/jqfive">
<img src="${ctx}/static/images/C_floor.png"/>
<span>五监区</span>
</a>
</li>
<li class="e_floor">
<a href="${ctx}/xsf/jqseven">
<img src="${ctx}/static/images/E_floor.png"/>
<span>七监区</span>
</a>
</li>
<li class="d_floor">
<a href="javascript:;"> <img src="${ctx}/static/images/D_floor.png"/></a>
</li>
<li class="d_floor_index">
<a href="${ctx}/xsf/jqeight">
<img src="${ctx}/static/images/D_floor_1.png"/>
<span>八监区</span>
</a>
</li>
<li class="f_floor">
<a href="${ctx}/xsf/jqnine">
<img src="${ctx}/static/images/F_floor.png"/>
<span>九监区</span>
</a>
</li>
</ul>
</div>
</div>
<div class="content_box">
<div class="room_box">
</div>
</div>
</div>
</div>
</body>
</html>
<style>
.flex-box {
display: block;
}
.flex-box a {
display: flex;
padding-left: 20px;
}
.menu_title_box a {
font-size: 0.24rem !important;
position: relative;
z-index: 999;
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment