Merge remote-tracking branch 'origin/master'

master
chenhao 2025-04-23 17:12:14 +08:00
commit 86c13c7336
1 changed files with 210 additions and 20 deletions

View File

@ -1,28 +1,165 @@
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
<th:block th:include="include :: header('关联合同')" />
<th:block th:include="include :: header('维保查询')" />
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 20px;
background-color: #f9f9f9;
}
.container {
/*width: 100%;*/
margin: 0;
padding: 20px 0;
background-color: white;
border-radius: 8px;
display: flex;
flex-direction: row;
gap: 30px;
justify-content: center;
}
h1 {
text-align: center;
color: #e74c3c;
}
.form-group {
margin-bottom: 15px;
display: flex;
flex-direction: row;
align-items: center;
}
.tableBOx{
width:70vw;
}
label {
margin-bottom: 0;
width: 80px;
}
input[type="text"] {
width: 100%;
padding:5px 10px;
border: 1px solid #ccc;
border-radius: 4px;
}
button {
width:100px;
padding:0;
height: 30px;
background-color: #e74c3c;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}
button:hover {
background-color: #c0392b;
}
.topBox{
display: flex;
flex-direction: row;
gap: 20px;
margin: 20px 0;
align-items: center;
}
.topBox .title{
font-size: 24px;
font-weight: 600;
}
.table-striped {
display: flex;justify-content: flex-start;flex-direction: column;align-items: center
}
.table-striped thead{
background: #ccc;
}
.table-striped thead th{
padding: 8px;
}
.table-striped tbody td{
padding: 8px;
}
.tabBtn{
display: inline-block;
padding: 10px;
cursor: pointer;
}
</style>
</head>
<body class="gray-bg">
<div class="col-sm-12 select-table table-striped" >
<div class="col-sm-12 select-table table-striped" >
<div class="topBox">
<div class="title">单条查询</div>
<div style="color: #dd242a">H3C产品保修条款</div>
</div>
<p>(不支持第三方信息查询)</p>
<div class="container">
<div class="form-group">
<label for="serialNumber">序列号</label>
<input type="text" id="serialNumber" placeholder="请输入序列号">
</div>
<div class="form-group">
<label for="productCode">产品号</label>
<input type="text" id="productCode" placeholder="请输入产品号">
</div>
<button type="button" onclick="getData()">查询</button>
</div>
<h2>查询结果</h2>
<h4 style="margin-top: 40px;">产品信息</h4>
<table>
<tr>
<th>硬件序列号</th>
<th>产品号</th>
<th>产品描述</th>
<th>产品线描述</th>
<th>区域</th>
</tr>
<tr>
<td>2131340A.CZ02300002M</td>
<td>313048.C</td>
<td>H3C Workspace 云桌面许可证</td>
<td>云产品</td>
<td>CN</td>
</tr>
<h4 style="margin-top: 20px;">产品信息</h4>
<table class="tableBOx" id="tableBOx">
<thead>
<tr>
<th>硬件序列号</th>
<th>产品号</th>
<th>产品描述</th>
<th>产品线描述</th>
<th>区域</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<div >
<div style="margin: 20px 0;">
<span id="btn1" class="tabBtn" onclick="changeTab(0)" style="background: #dd242a;color: #fff">合同</span>
<!-- <span id="btn2" class="tabBtn" onclick="changeTab(1)">标准保修</span>-->
</div>
<table class="tableBOx" id="tableBOx2">
<thead>
<tr>
<th>服务项目识别号</th>
<th>合同类型</th>
<th>服务级别</th>
<th>服务级别描述</th>
<th>服务项</th>
<th>服务项描述</th>
<th>开始时间</th>
<th>结束时间</th>
<th>状态</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<table class="tableBOx" id="tableBOx3" style="display: none">
<thead>
<tr>
<th>硬件序列号</th>
<th>产品号</th>
<th>产品描述</th>
<th>产品线描述</th>
<th>区域</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<th:block th:include="include :: footer" />
@ -32,10 +169,63 @@
getData()
});
function getData() {
let serialNumber=$('#serialNumber').val()
let productCode=$('#productCode').val()
$.operate.get("/system/product/query",{isTable:0}, function (res){
$.operate.get(`/system/product/query?productCode=${productCode}&serialNumber=${serialNumber}`, function (res){
let str=`<tr><td colspan="5" style="text-align: center">暂无数据</td></tr>`
if(res.data.length){
str=``
res.data.forEach((ele)=>{
str+=`<tr>
<td>${ele.serialNumber}</td>
<td>${ele.model}</td>
<td>${ele.description}</td>
<td>${ele.productName}</td>
<td>${ele.model}</td>
</tr>`
})
}
$('#tableBOx tbody').html(str)
})
$.operate.get(`/manage/order/query?productCode=${productCode}&serialNumber=${serialNumber}`, function (res){
let str=`<tr><td colspan="9" style="text-align: center">暂无数据</td></tr>`
if(res.data.length){
str=``
res.data.forEach((ele)=>{
str+=`<tr>
<td></td>
<td>${ele.orderType=='zq'?'直签合同':'代理合同'}</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td>${ele.createdAt}</td>
<td></td>
<td>${ele.statua==0?'有效':'无效'}</td>
</tr>`
})
}
$('#tableBOx2 tbody').html(str)
})
}
function changeTab(show) {
if(!show){
$('#btn1').css({'background': '#dd242a','color':'#fff'})
$('#btn2').css({'background': '#fff','color':'#333'})
$('#tableBOx2').show()
$('#tableBOx3').hide()
}else{
$('#tableBOx3').show()
$('#tableBOx2').hide()
$('#btn2').css({'background': '#dd242a','color':'#fff'})
$('#btn1').css({'background': '#fff','color':'#333'})
}
}