@ -1,7 +1,7 @@
<!DOCTYPE html>
< html lang = "zh" xmlns:th = "http://www.thymeleaf.org" >
< head >
< th:block th:include = "include :: header('车辆 全生命周期 ')" / >
< th:block th:include = "include :: header('车辆 详情 ')" / >
< style >
.detail-shell {
padding: 15px;
@ -187,8 +187,8 @@
.compare-tyre-card {
position: relative;
width: 66 px;
min-height: 126 px;
width: 90 px;
min-height: 174 px;
padding: 24px 6px 8px;
border-radius: 8px 8px 16px 16px;
background: #2f4050;
@ -432,7 +432,8 @@
< / div >
< div class = "row" >
< div class = "col-lg-4 col-md-5 col-sm-12" >
<!-- 暂时隐藏基础信息与当前装车轮胎，避免车辆详情对话框出现左右分栏导致主视图宽度不足。 -->
<!-- <div class="col - lg - 4 col - md - 5 col - sm - 12">
< div class = "info-card" >
< div class = "section-title" > < i class = "fa fa-bookmark" > < / i > 基本信息< / div >
< table class = "info-table" id = "vehicleInfo" > < / table >
@ -444,11 +445,11 @@
< div class = "text-center text-muted-dash" style = "padding: 40px 0;" > 正在加载...< / div >
< / div >
< / div >
< / div >
< / div > -->
< div class = "col-lg- 8 col-md-7 col-sm-12">
< div class = "col-lg- 12 col-md-12 col-sm-12">
< div class = "info-card" >
< div class = "section-title" > < i class = "fa fa-wrench" > < / i > 最近一次维保 < / div >
< div class = "section-title" > < i class = "fa fa-wrench" > < / i > 轮位视图 < / div >
< div id = "latestMaintenance" >
< div class = "text-center text-muted-dash" style = "padding: 48px 0;" > 正在加载...< / div >
< / div >
@ -456,12 +457,12 @@
< div class = "timeline-card" >
< div class = "timeline-header" >
< span class = "title clickable-title" onclick = "goMaintenanceList()" > 保养信息 < / span >
< span class = "mini-tip" > 按时间倒序展示维保工单< / span >
< span class = "title "> 生命周期 < / span >
< span class = "mini-tip" > 按时间倒序展示维保工单，点击记录打开维保工单详情页签 < / span >
< / div >
< ul class = "life-list" id = "timelineList" > < / ul >
< div class = "text-center text-muted-dash" id = "emptyTimeline" style = "display: none; padding: 80px 0;" >
暂无保养信息
暂无生命周期
< / div >
< / div >
< / div >
@ -472,11 +473,11 @@
< script th:inline = "javascript" >
var prefix = ctx + "tyre/car";
var carNo = $("#carNo").val();
var POSITION_ORDER = ["左前轮", "右前轮", "左外轮", "左内轮", "右内轮", "右 外轮"];
var POSITION_ORDER = ["左前轮", "右前轮", "右内轮", "右外轮", "左内轮", "左 外轮"];
$(function () {
loadLifecycle();
loadLatestMaintenance ();
loadWheelPositionView ();
// 兜底关闭父窗口 loading，
if (window.parent & & window.parent !== window & & window.parent.$ & & window.parent.$.modal) {
window.parent.$.modal.closeLoading();
@ -491,20 +492,21 @@
}
var data = result.data || {};
renderSummary(data);
renderVehicleInfo(data.car || {});
renderMountedTyres(data.mountedTyres || []);
// 基本信息与当前装车轮胎已从页面隐藏，保留汇总和生命周期即可让主内容与对话框等宽。
// renderVehicleInfo(data.car || {});
// renderMountedTyres(data.mountedTyres || []);
// 维保历史已合并到生命周期聚合接口，页面不再额外调用独立列表接口，避免同一车牌重复查数。
renderTimeline(data.maintenanceList || []);
});
}
function loadLatestMaintenance () {
function loadWheelPositionView () {
$.get(prefix + "/lifecycle/" + encodeURIComponent(carNo) + "/latest-maintenance", function (result) {
if (result.code != web_status.SUCCESS) {
$("#latestMaintenance").html('< div class = "text-center text-muted-dash" style = "padding: 48px 0;" > 维保对比 加载失败< / div > ');
$("#latestMaintenance").html('< div class = "text-center text-muted-dash" style = "padding: 48px 0;" > 轮位视图 加载失败< / div > ');
return;
}
renderLatestMaintenance(result.data || {} );
renderWheelPositionView(result.data || [] );
});
}
@ -565,7 +567,12 @@
$("#emptyTimeline").hide();
var html = [];
$.each(maintenanceRows, function (index, item) {
html.push('< li class = "life-item" > ');
var orderId = item.orderId == null ? item.id : item.orderId;
// 生命周期页嵌在车辆抽屉 iframe 中，只把业务主键交给父页，由父页接管主框架页签与抽屉关闭。
html.push('< li class = "life-item clickable-title" data-order-id = "'
+ encodeURIComponent(displayValue(orderId)) + '" data-order-no="'
+ encodeURIComponent(displayValue(item.orderNo))
+ '" onclick="openMaintenanceOrderDetail(this)" title="打开维保工单详情页签">');
html.push('< span class = "life-dot maintenance" > 维< / span > ');
html.push('< div class = "life-time" > ' + safeText(item.maintainDate) + '< / div > ');
html.push('< div class = "life-title" > ' + safeText(eventTitle(item)) + '< / div > ');
@ -575,35 +582,13 @@
$("#timelineList").html(html.join(""));
}
function renderLatestMaintenance(data) {
var order = data.order;
if (!order) {
$("#latestMaintenance").html('< div class = "text-center text-muted-dash" style = "padding: 48px 0;" > 暂无维保记录< / div > ');
function renderWheelPositionView(rows) {
if (!rows || !rows.length) {
$("#latestMaintenance").html('< div class = "text-center text-muted-dash" style = "padding: 48px 0;" > 暂无轮位维护数据< / div > ');
return;
}
var html = [];
html.push('< div class = "maintenance-summary" > ');
html.push(metaCell("工单号", order.orderNo));
html.push(metaCell("维保类型", orderTypeFormatter(order.typeCode)));
html.push(metaCell("状态", statusFormatter(order.status)));
html.push(metaCell("维修站点", order.factoryName));
html.push(metaCell("保养日期", order.maintainDate));
html.push(metaCell("录入里程", order.inputMileage == null ? "-" : order.inputMileage + " km"));
html.push(metaCell("上次里程", order.lastMileage == null ? "-" : order.lastMileage + " km"));
if (order.description) {
html.push('< div > 补充说明：' + safeText(order.description) + '< / div > ');
}
html.push('< / div > ');
html.push('< div class = "maintenance-compare" > ');
html.push('< div class = "maintenance-side" > < div class = "maintenance-side-title" > 维保前< / div > ');
html.push(renderCompareTyres(data.tireDetailsBefore || []));
html.push('< / div > ');
html.push('< div class = "maintenance-side" > < div class = "maintenance-side-title" > 维保后< / div > ');
html.push(renderCompareTyres(data.tireDetailsAfter || []));
html.push('< / div > ');
html.push('< / div > ');
html.push(renderCompareTyres(rows));
$("#latestMaintenance").html(html.join(""));
}
@ -615,10 +600,10 @@
html.push(createTyreCard(data[1], "右前轮"));
html.push('< / div > ');
html.push('< div class = "axle-row" > < div class = "axle-label" > 2< / div > ');
html.push(createTyreCard(data[2], "左外 轮"));
html.push(createTyreCard(data[3], "左内 轮"));
html.push(createTyreCard(data[4], "右 内轮"));
html.push(createTyreCard(data[5], "右 外轮"));
html.push(createTyreCard(data[2], "右内 轮"));
html.push(createTyreCard(data[3], "右外 轮"));
html.push(createTyreCard(data[4], "左 内轮"));
html.push(createTyreCard(data[5], "左 外轮"));
html.push('< / div > ');
return html.join("");
}
@ -637,7 +622,10 @@
spec: displayValue(item.spec),
dot: displayValue(item.dot),
depth: item.depth == null || item.depth === "" ? "-" : item.depth + " mm",
status: displayValue(item.status)
status: displayValue(item.status),
orderNo: displayValue(item.orderNo),
maintainDate: displayValue(item.maintainDate),
inputMileage: item.inputMileage == null ? "-" : item.inputMileage + " km"
};
});
return result;
@ -656,6 +644,9 @@
'< div > ' + safeText(tyre.spec) + '< / div > ',
'< div > ' + safeText(tyre.dot) + '< / div > ',
'< div class = "compare-depth" > ' + safeText(tyre.depth) + '< / div > ',
'< div > 工单：' + safeText(tyre.orderNo) + '< / div > ',
'< div > 日期：' + safeText(tyre.maintainDate) + '< / div > ',
'< div > 里程：' + safeText(tyre.inputMileage) + '< / div > ',
'< / div > ',
'< / div > '
].join("");
@ -832,9 +823,26 @@
return displayValue(value);
}
function goMaintenanceList() {
// ctx 由 include.html 注入且自带尾斜杠，按项目既有写法直接拼接相对路径。
window.open(ctx + "tyre/order", "_blank");
function openMaintenanceOrderDetail(target) {
var orderId = decodeURIComponent($(target).attr("data-order-id") || "");
var orderNo = decodeURIComponent($(target).attr("data-order-no") || "");
if (!/^\d+$/.test(orderId)) {
// 没有有效工单主键时禁止拼接详情 URL，
$.modal.alertWarning("该维保记录缺少有效工单ID，
return;
}
// 生命周期页嵌在车辆列表抽屉 iframe 中，必须交给父页打开主框架页签并关闭抽屉。
if (window.parent & & typeof window.parent.openMaintenanceOrderDetailTabFromLifecycle === "function") {
window.parent.openMaintenanceOrderDetailTabFromLifecycle(orderId, orderNo);
return;
}
// 兜底：若未来生命周期页被独立打开，仍按 RuoYi 页签方式进入对应工单详情。
$.modal.openTab(buildMaintenanceOrderDetailTitle(orderNo), ctx + "tyre/order/edit/" + encodeURIComponent(orderId));
}
function buildMaintenanceOrderDetailTitle(orderNo) {
var text = displayValue(orderNo);
return text == "-" ? "维保工单详情" : "维保工单详情 - " + text;
}
< / script >
< / body >
