<!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 name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta name="renderer" content="webkit">
|
<title>料位总览</title>
|
|
<link rel="stylesheet" th:href="@{/security/height-all.css}">
|
</head>
|
|
<body class="">
|
<div class="screen-container">
|
<div class="m-detectionl">
|
<ul class="ul-listl3" id="oilList">
|
<li>
|
<div class="con">
|
<div class="box">
|
<div class="top">
|
<div class="ll">
|
<div class="num">1号筒仓</div>
|
<div class="tit">玉米</div>
|
</div>
|
<a href="" class="more">详情 ></a>
|
</div>
|
<div class="picbox">
|
<div class="pic">
|
<img th:src="@{/img/web/grain/height-all.png}" alt="">
|
</div>
|
<div class="heat">
|
<div class="line">
|
<div class="sline" style="height: 58%;">
|
<div class="num"><em>11.527</em>米</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="reserves">计算储量<em class="num">290789.9KG</em></div>
|
<div class="date">2025-09-25 10:00</div>
|
</div>
|
</div>
|
</li>
|
<li>
|
<div class="con">
|
<div class="box">
|
<div class="top">
|
<div class="ll">
|
<div class="num">2号筒仓</div>
|
<div class="tit">玉米</div>
|
</div>
|
<a href="" class="more">详情 ></a>
|
</div>
|
<div class="picbox">
|
<div class="pic">
|
<img th:src="@{/img/web/grain/height-all.png}" alt="">
|
</div>
|
<div class="heat">
|
<div class="line">
|
<div class="sline" style="height: 58%;">
|
<div class="num"><em>11.527</em>米</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="reserves">计算储量<em class="num">290789.9KG</em></div>
|
<div class="date">2025-09-25 10:00</div>
|
</div>
|
</div>
|
</li>
|
<li>
|
<div class="con">
|
<div class="box">
|
<div class="top">
|
<div class="ll">
|
<div class="num">3号筒仓</div>
|
<div class="tit">玉米</div>
|
</div>
|
<a href="" class="more">详情 ></a>
|
</div>
|
<div class="picbox">
|
<div class="pic">
|
<img th:src="@{/img/web/grain/height-all.png}" alt="">
|
</div>
|
<div class="heat">
|
<div class="line">
|
<div class="sline" style="height: 58%;">
|
<div class="num"><em>11.527</em>米</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="reserves">计算储量<em class="num">290789.9KG</em></div>
|
<div class="date">2025-09-25 10:00</div>
|
</div>
|
</div>
|
</li>
|
<li>
|
<div class="con">
|
<div class="box">
|
<div class="top">
|
<div class="ll">
|
<div class="num">4号筒仓</div>
|
<div class="tit">玉米</div>
|
</div>
|
<a href="" class="more">详情 ></a>
|
</div>
|
<div class="picbox">
|
<div class="pic">
|
<img th:src="@{/img/web/grain/height-all.png}" alt="">
|
</div>
|
<div class="heat">
|
<div class="line">
|
<div class="sline" style="height: 58%;">
|
<div class="num"><em>11.527</em>米</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="reserves">计算储量<em class="num">290789.9KG</em></div>
|
<div class="date">2025-09-25 10:00</div>
|
</div>
|
</div>
|
</li>
|
<li>
|
<div class="con">
|
<div class="box">
|
<div class="top">
|
<div class="ll">
|
<div class="num">5号筒仓</div>
|
<div class="tit">玉米</div>
|
</div>
|
<a href="" class="more">详情 ></a>
|
</div>
|
<div class="picbox">
|
<div class="pic">
|
<img th:src="@{/img/web/grain/height-all.png}" alt="">
|
</div>
|
<div class="heat">
|
<div class="line">
|
<div class="sline" style="height: 58%;">
|
<div class="num"><em>11.527</em>米</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="reserves">计算储量<em class="num">290789.9KG</em></div>
|
<div class="date">2025-09-25 10:00</div>
|
</div>
|
</div>
|
</li>
|
</ul>
|
</div>
|
</div>
|
<script th:src="@{/ajax/libs/layui/layui.js}"></script>
|
<script th:src="@{/js/jquery.min.js}"></script>
|
<script th:src="@{/ruoyi/js/ry-ui.js?v=4.7.8}"></script>
|
<script th:src="@{/ruoyi/js/common.js?v=4.7.8}"></script>
|
<script th:inline="javascript">
|
//料位列表
|
var listDepot = [[${listDepot}]];
|
|
renderDepotData();
|
|
function renderDepotData() {
|
|
var html = '';
|
if (listDepot) {
|
$.each(listDepot, function (index, item) {
|
var depot = item.depotData;
|
|
html += '<li><div class="con"><div class="box"><div class="top"><div class="ll">';
|
html += '<div class="num">' + (depot.name == null ? "" : depot.name) + '</div>';
|
html += '<div class="tit">' + (depot.foodVarietyName == null ? "--" : depot.foodVarietyName) + '</div></div>';
|
html += '<a onclick="toPage()" href="javaScript:;" class="more">详情 ></a></div>';
|
html += '<div class="picbox"><div class="pic"><img src="/img/web/grain/height-all.png" alt=""></div>';
|
html += '<div class="heat"><div class="line">';
|
html += '<div class="sline" style="height: ' + (item.heightPer == null ? "--" : item.heightPer) + '%;">';
|
html += '<div class="num"><em>' + (item.height == null ? "--" : item.height) + '</em> 米</div>';
|
html += '</div></div></div></div>';
|
html += '<div class="reserves">计算储量<em class="num">' + (item.weight == null ? "--" : (item.weight).toFixed(2)) + ' KG</em></div>';
|
html += '<div class="date">' + (item.receiveDate == null ? "暂无检测记录" : formatDate('Y-mm-dd HH:MM', new Date(item.receiveDate))) + '</div>';
|
html += '</div></div></li>';
|
});
|
} else {
|
html += '<li><div class="con"><div class="box"><div class="top"><div class="ll">';
|
html += '<div class="num">--</div>';
|
html += '<div class="tit">--</div></div>';
|
html += '<a href="javascript:;" class="more">详情 ></a></div>';
|
html += '<div class="picbox"><div class="pic"><img src="/img/web/grain/height-all.png" alt=""></div>';
|
html += '<div class="heat"><div class="line">';
|
html += '<div class="sline" style="height: 0%;">';
|
html += '<div class="num"><em>--</em> 米</div>';
|
html += '</div></div><div class="temperature">-- C°</div></div></div>';
|
html += '<div class="reserves">计算储量<em class="num">-- KG</em></div>';
|
html += '<div class="date">--</div>';
|
html += '</div></div></li>';
|
}
|
$("#oilList").html(html);
|
}
|
|
/**
|
* 格式化日期
|
* @param fmt
|
* @param date
|
* @return {*}
|
*/
|
function formatDate(fmt, date) {
|
var ret;
|
var opt = {
|
"Y+": date.getFullYear().toString(), // 年
|
"m+": (date.getMonth() + 1).toString(), // 月
|
"d+": date.getDate().toString(), // 日
|
"H+": date.getHours().toString(), // 时
|
"M+": date.getMinutes().toString(), // 分
|
"S+": date.getSeconds().toString() // 秒
|
// 有其他格式化字符需求可以继续添加,必须转化成字符串
|
};
|
for (var k in opt) {
|
ret = new RegExp("(" + k + ")").exec(fmt);
|
if (ret) {
|
fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
|
}
|
}
|
return fmt;
|
}
|
|
|
/* 用户管理-重置密码 */
|
function toPage() {
|
var url = '/com.fzzy.igds.QuantityData.d';
|
$.modal.openTab("数量检测报表", url);
|
}
|
</script>
|
</body>
|
|
</html>
|