<!DOCTYPE html>
|
<html lang="en">
|
<head>
|
<meta charset="utf-8">
|
<title>RGV异常</title>
|
<meta name="renderer" content="webkit">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
<link rel="stylesheet" href="../../static/layui/css/layui.css" media="all">
|
<link rel="stylesheet" href="../../static/css/cool.css" media="all">
|
<link rel="stylesheet" href="../../static/css/common.css" media="all">
|
<style>
|
body {
|
background: #f5f7fa;
|
font-family: "Microsoft YaHei", sans-serif;
|
margin: 0;
|
padding: 0;
|
}
|
|
/* 顶部时间区域 */
|
.layui-inline {
|
background: #fff;
|
padding: 16px 20px;
|
border-radius: 10px;
|
box-shadow: 0 3px 12px rgba(0,0,0,0.06);
|
margin: 20px 0 0 20px;
|
display: inline-flex;
|
align-items: center;
|
}
|
|
.layui-form-label {
|
font-weight: bold;
|
}
|
|
/* 整体容器 */
|
#logContainer {
|
display: flex;
|
width: 100%;
|
margin-top: 20px;
|
height: 600px;
|
overflow-y: auto;
|
background: #fff;
|
border-radius: 12px;
|
box-shadow: 0 4px 18px rgba(0,0,0,0.08);
|
padding: 20px;
|
box-sizing: border-box;
|
}
|
|
/* 左右列 */
|
.log-column {
|
flex: 1;
|
padding: 10px 20px;
|
box-sizing: border-box;
|
}
|
|
.log-column.left {
|
border-right: 1px solid #e5e5e5;
|
}
|
|
/* 列标题 */
|
.column-title {
|
text-align: center;
|
font-size: 20px;
|
font-weight: bold;
|
margin-bottom: 18px;
|
padding-bottom: 10px;
|
border-bottom: 2px solid #eee;
|
}
|
|
.title-red { color: #e74c3c; }
|
.title-green { color: #27ae60; }
|
|
ul li {
|
display: inline-block; /* 改成行内块，自适应宽度 */
|
margin: 6px 6px 6px 0; /* 卡片间距 */
|
padding: 8px 12px; /* 内边距 */
|
border-radius: 10px;
|
font-size: 14px;
|
box-shadow: 0 2px 6px rgba(0,0,0,0.08);
|
transition: all 0.2s;
|
white-space: nowrap; /* 防止文字换行，卡片宽度自适应内容 */
|
}
|
|
ul li:hover {
|
transform: translateY(-2px);
|
box-shadow: 0 4px 12px rgba(0,0,0,0.12);
|
cursor: default;
|
}
|
|
/* 异常项 */
|
.error-item {
|
color: #c0392b;
|
background: #fdecea;
|
border: 1px solid #f5c5c5;
|
}
|
|
/* 正常项 */
|
.normal-item {
|
color: #1e8449;
|
background: #eafaf1;
|
border: 1px solid #c7e6d1;
|
}
|
|
</style>
|
</head>
|
<body>
|
<div class="layui-inline">
|
<label class="layui-form-label">发生时间：</label>
|
<div class="layui-input-inline">
|
<input id="createTime" class="layui-input" type="text" disabled="disabled">
|
</div>
|
</div>
|
|
<div id="logContainer">
|
<!-- 异常列 -->
|
<div class="log-column left">
|
<h3 class="column-title title-red">异常项(Y)</h3>
|
<ul id="errorList"></ul>
|
</div>
|
|
<!-- 正常列 -->
|
<div class="log-column">
|
<h3 class="column-title title-green">无异常项(N)</h3>
|
<ul id="normalList"></ul>
|
</div>
|
</div>
|
|
<script type="text/javascript" src="../../static/js/jquery/jquery-3.3.1.min.js"></script>
|
<script type="text/javascript" src="../../static/layui/layui.js" charset="utf-8"></script>
|
<script type="text/javascript" src="../../static/js/common.js" charset="utf-8"></script>
|
<script type="text/javascript">
|
var parentUuid;
|
|
/** 列结构 */
|
function getCol() {
|
return [
|
,{field: 'reset', align: 'center',title: '复位'}
|
,{field: 'travelBrakeSwitch', align: 'center',title: '走行抱闸开关钮'}
|
,{field: 'travelSpeedLimitPhotoelectric', align: 'center',title: '走行强制减速光电'}
|
,{field: 'leftOverlimit1', align: 'center',title: '左超限 1'}
|
,{field: 'rightOverlimit1', align: 'center',title: '右超限 1'}
|
,{field: 'leftAtPosition1', align: 'center',title: '左到位 1'}
|
,{field: 'rightAtPosition1', align: 'center',title: '右到位 1'}
|
,{field: 'chainForward1', align: 'center',title: '链条前进 1'}
|
,{field: 'chainReverse1', align: 'center',title: '链条后退 1'}
|
,{field: 'inverterAlarm', align: 'center',title: '变频器报警'}
|
,{field: 'leftOverlimit2', align: 'center',title: '左超限 2'}
|
,{field: 'rightOverlimit2', align: 'center',title: '右超限 2'}
|
,{field: 'leftAtPosition2', align: 'center',title: '左到位 2'}
|
,{field: 'rightAtPosition2', align: 'center',title: '右到位 2'}
|
,{field: 'cargoSpeedReduction', align: 'center',title: '货物减速'}
|
,{field: 'conveyorInverterAlarm2', align: 'center',title: '输送变频器报警 2'}
|
,{field: 'leftConveyor2', align: 'center',title: '左输送 2'}
|
,{field: 'rightConveyor2', align: 'center',title: '右输送 2'}
|
];
|
}
|
|
/** 格式化时间 */
|
function formatDateTime(isoString) {
|
const date = new Date(isoString);
|
const y = date.getFullYear();
|
const m = String(date.getMonth() + 1).padStart(2, '0');
|
const d = String(date.getDate()).padStart(2, '0');
|
const hh = String(date.getHours()).padStart(2, '0');
|
const mm = String(date.getMinutes()).padStart(2, '0');
|
const ss = String(date.getSeconds()).padStart(2, '0');
|
return `${y}-${m}-${d} ${hh}:${mm}:${ss}`;
|
}
|
|
/** 渲染双列卡片列表 */
|
function renderList(data) {
|
const cols = getCol();
|
$("#errorList").empty();
|
$("#normalList").empty();
|
cols.forEach(col => {
|
const field = col.field;
|
const title = col.title;
|
if (data[field] === "Y") {
|
$("#errorList").append(`<li class="error-item">${title}</li>`);
|
} else if (data[field] === "N") {
|
$("#normalList").append(`<li class="normal-item">${title}</li>`);
|
}
|
});
|
}
|
|
/** 查询后端数据 */
|
function renderTable() {
|
if (!parentUuid) return;
|
$.ajax({
|
url: baseUrl + '/basRgvErrorLog/listByUuid/auth',
|
method: 'GET',
|
headers: { token: localStorage.getItem('token') },
|
data: { uuid: parentUuid, curr: 1, limit: 1 },
|
success: function(res) {
|
if (res.code !== 200) return;
|
const record = res.data.records[0];
|
if (record) renderList(record);
|
}
|
});
|
}
|
|
/** 父页面调用 */
|
function setUuid(uuid){
|
parentUuid = uuid;
|
renderTable();
|
}
|
|
function setCreateTime(value){
|
$('#createTime').val(formatDateTime(value));
|
}
|
</script>
|
</body>
|
</html>
|
