<!DOCTYPE html>
|
<html lang="zh-cn" xmlns:th=http://www.thymeleaf.org>
|
<head>
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta name="renderer" content="webkit">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<title>智慧粮库管理系统-综合大屏</title>
|
<link rel="shortcut icon" th:href="@{/static/favicon.ico}"/>
|
<link th:href="@{/static/databoard/swiper-bundle-5303.min.css}" rel="stylesheet">
|
<link th:href="@{/static/databoard/style-5303.min.css}" rel="stylesheet">
|
<style>
|
.content_box .bottom_box .swiper-slide::before {
|
background-image: url(../../static/images/5303/chang_topleft@2x.png);
|
}
|
|
.content_box .bottom_box .swiper-slide::after {
|
background-image: url(../../static/images/5303/chang_bottomright@2x.png);
|
}
|
|
.header {
|
background-image: url(../../static/images/5303/bg@2x.png);
|
}
|
|
.time_info {
|
font-size: 14px;
|
padding: 0 32px 6px 32px;
|
background-color: #153953;
|
display: flex;
|
gap: 18px;
|
z-index: 1;
|
color: #cae8ff;
|
}
|
|
.content_box .bottom_box {
|
height: 488px;
|
}
|
|
.time_info_height {
|
font-size: 14px;
|
padding: 0 32px 6px 32px;
|
background-color: #B65C5C;
|
display: flex;
|
gap: 18px;
|
z-index: 1;
|
color: #cae8ff;
|
}
|
</style>
|
</head>
|
<body>
|
|
<header class="header"><span th:text="${largeScreenName}">综合管理大屏</span></header>
|
|
<div class="content_box">
|
|
|
<!-- 上模块 -->
|
<div class="top_box">
|
|
<!-- 基础信息 -->
|
<div class="basic_info" id="basic_info">
|
<div class="box_title">
|
<img class="icon" th:src="@{../../static/images/5303/icon@2x.png}"/>
|
<span>基础信息</span>
|
</div>
|
<div class="info">
|
<div class="item">
|
<span class="title">仓库总数：</span>
|
<span class="value" id="depotNum">18</span>
|
</div>
|
<div class="item">
|
<span class="title">实际总储量：</span>
|
<span class="value" id="realStorage">14,672,124</span>
|
<span class="unit">KG</span>
|
</div>
|
<div class="item">
|
<span class="title">仓房类型：</span>
|
<span class="value" style="font-size:20px ;" id="depotType">高大平房仓</span>
|
</div>
|
</div>
|
<img class="left_top" th:src="@{../../static/images/5303/left_top@2x.png}"/>
|
<img class="right_top" th:src="@{../../static/images/5303/right_top@2x.png}"/>
|
<img class="left_bottom" th:src="@{../../static/images/5303/left_bottom@2x.png}"/>
|
<img class="right_bottom" th:src="@{../../static/images/5303/right_bottom@2x.png}"/>
|
</div>
|
|
<!-- 中间仓储统计模块 -->
|
<div class="statistics">
|
<div class="box_title">
|
<img class="icon" th:src="@{../../static/images/5303/icon@2x.png}"/>
|
<span>仓储统计</span>
|
</div>
|
<div class="chart_title">
|
<p class="title">粮食品种</p>
|
<p class="title">粮食年份</p>
|
<p class="title">粮食产地</p>
|
</div>
|
<div class="chart" id="chart"></div>
|
|
<img class="left_top" th:src="@{../../static/images/5303/left_top@2x.png}"/>
|
<img class="right_top" th:src="@{../../static/images/5303/right_top@2x.png}"/>
|
<img class="left_bottom" th:src="@{../../static/images/5303/left_bottom@2x.png}"/>
|
<img class="right_bottom" th:src="@{../../static/images/5303/right_bottom@2x.png}"/>
|
</div>
|
|
|
<!-- 气象信息 -->
|
<div class="weather_info">
|
<div class="box_title">
|
<img class="icon" th:src="@{../../static/images/5303/icon@2x.png}"/>
|
<span>气象信息</span>
|
</div>
|
<div class="data">
|
<div class="item">
|
<span class="title">
|
<img class="icon" th:src="@{../../static/images/5303/temperature@2x.png}"/>
|
温度
|
</span>
|
<span class="value" id="weather_wendu">--</span>
|
</div>
|
<div class="item">
|
<span class="title">
|
<img class="icon" th:src="@{../../static/images/5303/humidity@2x.png}"/>
|
湿度
|
</span>
|
<span class="value" id="weather_shidu">--</span>
|
</div>
|
<div class="item">
|
<span class="title">
|
<img class="icon" th:src="@{../../static/images/5303/weather@2x.png}"/>
|
天气
|
</span>
|
<span class="value" style="font-size: 16px;" id="weather_tianqi">--</span>
|
</div>
|
</div>
|
<div class="update_time">
|
<span class="title">更新时间:</span>
|
<span class="value" id="weather_time">--</span>
|
</div>
|
<img class="left_top" th:src="@{../../static/images/5303/left_top@2x.png}"/>
|
<img class="right_top" th:src="@{../../static/images/5303/right_top@2x.png}"/>
|
<img class="left_bottom" th:src="@{../../static/images/5303/left_bottom@2x.png}"/>
|
<img class="right_bottom" th:src="@{../../static/images/5303/right_bottom@2x.png}"/>
|
</div>
|
|
</div>
|
|
<!-- 下面18个仓库模块 -->
|
<div class="bottom_box swiper mySwiper">
|
|
<!-- 18个仓库 -->
|
<div class="swiper-wrapper" id="depotList">
|
<!-- <div class="swiper-slide">-->
|
<!-- <div class="chang_name">1号仓</div>-->
|
<!-- <div class="main_info">-->
|
<!-- <div class="item">粮食品种: <span>小麦</span></div>-->
|
<!-- <div class="item">粮食年限: <span>2020</span></div>-->
|
<!-- <div class="item">粮食储量: <span>1280kg</span></div>-->
|
<!-- <div class="item">粮食产地: <span>江苏省</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="temperature_info">-->
|
<!-- <div class="item">最高温: <span>19℃</span></div>-->
|
<!-- <div class="item">最低温: <span>12℃</span></div>-->
|
<!-- <div class="item">平均温: <span>17.1℃</span></div>-->
|
<!-- <div class="item">仓温: <span>22℃</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="time_info">-->
|
<!-- <div class="item">检测时间: <span>2022-10-17 10:10:50</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="owner">保管员: <span>甘博</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="swiper-slide">-->
|
<!-- <div class="chang_name">2号仓</div>-->
|
<!-- <div class="main_info">-->
|
<!-- <div class="item">粮食品种: <span>小麦</span></div>-->
|
<!-- <div class="item">粮食年限: <span>2020</span></div>-->
|
<!-- <div class="item">粮食储量: <span>1280kg</span></div>-->
|
<!-- <div class="item">粮食产地: <span>江苏省</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="temperature_info">-->
|
<!-- <div class="item">最高温: <span>19℃</span></div>-->
|
<!-- <div class="item">最低温: <span>12℃</span></div>-->
|
<!-- <div class="item">平均温: <span>17.1℃</span></div>-->
|
<!-- <div class="item">仓温: <span>22℃</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="time_info">-->
|
<!-- <div class="item">检测时间: <span>2022-10-17 10:10:50</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="owner">保管员: <span>甘博</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="swiper-slide">-->
|
<!-- <div class="chang_name">3号仓</div>-->
|
<!-- <div class="main_info">-->
|
<!-- <div class="item">粮食品种: <span>小麦</span></div>-->
|
<!-- <div class="item">粮食年限: <span>2020</span></div>-->
|
<!-- <div class="item">粮食储量: <span>1280kg</span></div>-->
|
<!-- <div class="item">粮食产地: <span>江苏省</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="temperature_info">-->
|
<!-- <div class="item">最高温: <span>19℃</span></div>-->
|
<!-- <div class="item">最低温: <span>12℃</span></div>-->
|
<!-- <div class="item">平均温: <span>17.1℃</span></div>-->
|
<!-- <div class="item">仓温: <span>22℃</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="time_info">-->
|
<!-- <div class="item">检测时间: <span>2022-10-17 10:10:50</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="owner">保管员: <span>甘博</span></div>-->
|
<!-- </div>-->
|
|
<!-- <!– 这条是报错效果 添加一条error class –>-->
|
<!-- <div class="swiper-slide error">-->
|
<!-- <div class="chang_name">4号仓</div>-->
|
<!-- <div class="main_info">-->
|
<!-- <div class="item">粮食品种: <span>小麦</span></div>-->
|
<!-- <div class="item">粮食年限: <span>2020</span></div>-->
|
<!-- <div class="item">粮食储量: <span>1280kg</span></div>-->
|
<!-- <div class="item">粮食产地: <span>江苏省</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="temperature_info">-->
|
<!-- <div class="item">最高温: <span>19℃</span></div>-->
|
<!-- <div class="item">最低温: <span>12℃</span></div>-->
|
<!-- <div class="item">平均温: <span>17.1℃</span></div>-->
|
<!-- <div class="item">仓温: <span>22℃</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="time_info_height">-->
|
<!-- <div class="item">检测时间: <span>2022-10-17 10:10:50</span></div>-->
|
<!-- </div>-->
|
<!-- <div class="owner">保管员: <span>甘博</span></div>-->
|
<!-- </div>-->
|
</div>
|
<!-- 18个仓库 -->
|
|
<div class="swiper-pagination"></div>
|
</div>
|
</div>
|
|
<script th:src="@{/static/js/jquery.min.js}"></script>
|
<script th:src="@{/static/plugins/layui/layui.js}"></script>
|
<script th:src="@{/static/databoard/swiper-bundle-5303.min.js}"></script>
|
<script th:src="@{/static/plugins/echarts/echarts.min-4.7.js}"></script>
|
<script th:inline="javascript">
|
|
var bizType = [[${bizType}]];
|
var bizTag = [[${bizTag}]];
|
var userId = [[${loginUser.username}]];
|
var companyId = [[${loginUser.companyId}]];
|
var deptId = [[${deptId}]];
|
var chartFood = [[${chartFood}]];
|
var tag = [[${tag}]];
|
|
//天气信息
|
var weatherInfo = [[${weatherInfo}]];
|
//仓库列表及粮情信息
|
var listDepot = [[${listDepot}]];
|
|
//设置定时刷新页面，主要为了防止掉线
|
var timerFlush;
|
window.onload = function () {
|
if (timerFlush) {
|
clearInterval(timerFlush);
|
}
|
timerFlush = setInterval(function () {
|
window.location.href = window.location.href;
|
}, 60 * 60 * 1000);
|
};
|
</script>
|
<script th:src="@{/static/js/constant.js}"></script>
|
<script th:src="@{/static/js/igds-common.js}"></script>
|
<script th:src="@{/static/databoard/databoard-5303.js}"></script>
|
</body>
|
</html>
|
