Compare commits
3 Commits
a5a02cea7e
...
b71f486439
| Author | SHA1 | Date |
|---|---|---|
 王晓迪
|
b71f486439 | 1 month ago |
|
王晓迪
|
bf3fc23682 | 1 month ago |
|
王晓迪
|
383ac46e52 | 1 month ago |
12 changed files with 430 additions and 116 deletions
@ -0,0 +1,275 @@ |
|||
<!DOCTYPE html> |
|||
<html lang="zh" xmlns:th="http://www.thymeleaf.org" > |
|||
<head> |
|||
<th:block th:include="include :: header('制程检验报告')" /> |
|||
<th:block th:include="include :: datetimepicker-css" /> |
|||
<style> |
|||
.table-striped{ |
|||
height: 135px; |
|||
} |
|||
.table-striped-two{ |
|||
overflow: hidden; |
|||
scroll: auto; |
|||
} |
|||
.bordered-container { |
|||
/* 自动高度，根据内容自动调整 */ |
|||
min-height: 0; /* 确保高度能收缩至内容高度 */ |
|||
/* 自动宽度，对于块级元素已经是默认行为，但如果你想强调这一点或针对特定情况，可以显式声明 */ |
|||
width: auto; |
|||
height: auto; |
|||
border: 2px solid #888; /* 灰色边框，可根据需要调整颜色 */ |
|||
/* 以下可选，根据需要添加，用于控制内外边距和布局 */ |
|||
padding: 1rem; |
|||
box-sizing: border-box; /* 包含边框和内边距在宽度计算中 */ |
|||
margin-bottom: 20px; |
|||
} |
|||
.move-right{ |
|||
margin-left: 13px |
|||
} |
|||
</style> |
|||
</head> |
|||
<body class="white-bg"> |
|||
<div class="wrapper wrapper-content animated fadeInRight ibox-content"> |
|||
<form class="form-horizontal m" id="form-checkoutReport-add" th:object="${qualityManufacturingCheckoutMaterial}"> |
|||
<input name="manufacturingCheckoutMaterialId" th:field="*{manufacturingCheckoutMaterialId}" type="hidden"> |
|||
<div class="form-group"> |
|||
<label class="col-sm-3 control-label">料号：</label> |
|||
<div class="col-sm-8"> |
|||
<input name="materialNo" th:field="*{materialNo}" class="form-control" type="text"> |
|||
</div> |
|||
</div> |
|||
<div class="form-group"> |
|||
<label class="col-sm-3 control-label">物料名称：</label> |
|||
<div class="col-sm-8"> |
|||
<input name="materialName" th:field="*{materialName}" class="form-control" type="text"> |
|||
</div> |
|||
</div> |
|||
<div class="form-group"> |
|||
<label class="col-sm-3 control-label">订单数：</label> |
|||
<div class="col-sm-8"> |
|||
<input name="makeTotal" th:field="*{makeTotal}" class="form-control" type="text"> |
|||
</div> |
|||
</div> |
|||
<div class="form-group"> |
|||
<label class="col-sm-3 control-label">已检验数：</label> |
|||
<div class="col-sm-8"> |
|||
<input name="checkedNum" th:field="*{checkedNum}" class="form-control" type="text"> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="container mt-5"> |
|||
<div class="btn-group-sm"> |
|||
<span>制程工序</span> |
|||
</div> |
|||
<div id="contentArea" class="mt-3"> |
|||
<!-- 初始内容可以在这里，例如一个列表项和一个表单 --> |
|||
</div> |
|||
</div> |
|||
</form> |
|||
|
|||
</div> |
|||
<th:block th:include="include :: footer" /> |
|||
<th:block th:include="include :: datetimepicker-js" /> |
|||
<th:block th:include="include :: bootstrap-table-editable-js" /> |
|||
<script th:inline="javascript"> |
|||
var manufacturingProcessNameDatas = [[${@dict.getType('manufacturing_process_name')}]]; |
|||
var processBadClassificationDatas = [[${@dict.getType('process_bad_classification')}]]; |
|||
var processBadGradeDatas = [[${@dict.getType('process_bad_grade')}]]; |
|||
var prefix = ctx + "quality/manufacturingCheckout"; |
|||
|
|||
$("#form-checkoutReport-add").validate({focusCleanup: true}); |
|||
|
|||
|
|||
$(function () { |
|||
var processList = [[${qualityManufacturingCheckoutMaterial.materialProcessList}]] |
|||
processList.forEach(function (process, index){ |
|||
var newItem = |
|||
"<div class='container bordered-container'>" + |
|||
"<div class='col-sm-12 my-3'>" + |
|||
"<h5>制程工序"+(index+1)+"</h5>" + |
|||
"<div class='col-sm-12 select-table table-striped'>" + |
|||
'<table class="table-container checkoutMaterial-edit-table" id="bootstrap-manufacturingProcess-table-'+process.manufacturingProcessCode+'"></table>' + |
|||
"</div>" + |
|||
"</div>" + |
|||
"<div class='col-sm-12 move-right'>" + |
|||
"<h5>合格数</h5>" + |
|||
'<form id="form-manfa-'+ process.manufacturingProcessCode +'"> ' + |
|||
"<div class='form-group'> "+ |
|||
"<label for='okAcceptedNum'>OK允收数:</label>" + |
|||
"<input type='text' class='form-control' id='okAcceptedNum' name='okAcceptedNum' value='"+process.okAcceptedNum+"'>" + |
|||
"</div>"+ |
|||
" <div class='form-group'> "+ |
|||
"<label for='qualifiedNum'>特采/让步数:</label>" + |
|||
"<input type='text' class='form-control' id='specialConcessionsNum' name='specialConcessionsNum' value='"+process.specialConcessionsNum+"'>"+ |
|||
"</div>"+ |
|||
"</form>"+ |
|||
"</div>" + |
|||
|
|||
"<div class='col-sm-12 my-3'>" + |
|||
"<h5>不合格数</h5>" + |
|||
"<div class='col-sm-12 select-table table-striped-two'>" + |
|||
'<table class="table-container checkoutMaterial-edit-table" id="bootstrap-unqualifiedClass-table-' + process.manufacturingProcessCode + '"></table>' + |
|||
"</div>" + |
|||
"</div>" + |
|||
"</div>"; |
|||
$("#contentArea").append(newItem); |
|||
var processData = []; |
|||
processData.push(process); |
|||
var options1 = { |
|||
id:'bootstrap-manufacturingProcess-table-'+process.manufacturingProcessCode, |
|||
data: processData, |
|||
showSearch: false, |
|||
showRefresh: false, |
|||
showToggle: false, |
|||
showColumns: false, |
|||
pagination: false, // 设置不分页 |
|||
modalName: "制程工序", |
|||
height:30, |
|||
columns: [ |
|||
{ |
|||
title: '制程工序编号', |
|||
field: 'manufacturingProcessCode', |
|||
}, |
|||
{ |
|||
title: '制程工序名称', |
|||
field: 'manufacturingProcessName', |
|||
formatter: function(value, row, index) { |
|||
return $.table.selectDictLabel(manufacturingProcessNameDatas, value); |
|||
} |
|||
}, |
|||
{ |
|||
title: '设备名称', |
|||
field: 'deviceName', |
|||
}, |
|||
{ |
|||
title: '设备型号', |
|||
field: 'deviceModelCode', |
|||
}, |
|||
{ |
|||
title: '工序顺序', |
|||
field: 'processSequence', |
|||
}, |
|||
{ |
|||
title: '车间名称', |
|||
field: 'workshopName', |
|||
}, |
|||
{ |
|||
title: '零件名称', |
|||
field: 'modName', |
|||
}, |
|||
{ |
|||
title: '工序检验项目', |
|||
field: 'processInspectionItem', |
|||
}, |
|||
], |
|||
}; |
|||
$.table.init(options1); |
|||
var unqualifiedClassList = process.unqualifiedClassList; |
|||
console.log(unqualifiedClassList); |
|||
//不合格数 |
|||
var options2 = { |
|||
id:'bootstrap-unqualifiedClass-table-' + process.manufacturingProcessCode, |
|||
data: process.unqualifiedClassList, |
|||
showSearch: false, |
|||
showRefresh: false, |
|||
showToggle: false, |
|||
showColumns: false, |
|||
pagination: false, // 设置不分页 |
|||
modalName: "不合格分类", |
|||
columns: [ |
|||
{ |
|||
title: '不合格分类Id', |
|||
field: 'manufacturingUnqualifiedClassId', |
|||
visible: false, |
|||
}, |
|||
{ |
|||
title: '不良分类', |
|||
field: 'processBadClassification', |
|||
formatter: function(value, row, index) { |
|||
return $.table.selectDictLabel(processBadClassificationDatas, value); |
|||
} |
|||
}, |
|||
{ |
|||
title: '不良等级', |
|||
field: 'processBadGrade', |
|||
formatter: function(value, row, index) { |
|||
return $.table.selectDictLabel(processBadGradeDatas, value); |
|||
} |
|||
}, |
|||
{ |
|||
title: '不良数量', |
|||
field: 'processBadNum', |
|||
}, |
|||
] |
|||
}; |
|||
$.table.init(options2); |
|||
}) |
|||
|
|||
}) |
|||
function insertRow() { |
|||
|
|||
var bootstarpId = "bootstrap-manufacturingProcess-table-" + uniqueId +""; |
|||
|
|||
|
|||
$("#bootstrap-manufacturingProcess-table-" +uniqueId ).bootstrapTable('insertRow', { |
|||
index: 1, |
|||
row: { |
|||
manufacturingProcessCode: '', |
|||
manufacturingProcessName: '', |
|||
deviceName: '', |
|||
deviceModelCode: '', |
|||
processSequence: '', |
|||
workshopName: '', |
|||
modName: '' |
|||
} |
|||
}); |
|||
selectProcessCode(bootstarpId); |
|||
}; |
|||
|
|||
function handleManufacturingProcessChange(selectElement, tableId, selectId, index) { |
|||
var selectedValue = $(selectElement).val(); |
|||
if (selectedValue) { |
|||
$.ajax({ |
|||
url: ctx + 'quality/manufacturingProcess/getProcessByCode/' + selectedValue, |
|||
method: 'GET', |
|||
dataType: 'json', |
|||
success: function(response) { |
|||
if (response.data) { |
|||
var newData = response.data; |
|||
var newRowData = { |
|||
// manufacturingProcessCode: newData.manufacturingProcessCode || '', // 添加此行 |
|||
manufacturingProcessName: newData.manufacturingProcessName || '', |
|||
deviceName: newData.deviceName || '', |
|||
deviceModelCode: newData.deviceModelCode || '', |
|||
processSequence: newData.processSequence || '', |
|||
workshopName: newData.workshopName || '', |
|||
modName: newData.modName || '', |
|||
processInspectionItem: newData.processInspectionItem || '', |
|||
}; |
|||
var processName = newData.manufacturingProcessName; |
|||
// 使用Bootstrap Table的updateRow方法更新表格数据，注意这里使用传入的索引 |
|||
$('#' + tableId).bootstrapTable('updateRow', { |
|||
index: index, // 使用传递进来的索引 |
|||
row: newRowData |
|||
}); |
|||
// 重新初始化下拉框 |
|||
initSelector(tableId); |
|||
// 下拉框赋值 |
|||
$('#' + tableId).find('select[name="manufacturingProcessCode"]').val(selectedValue); |
|||
$('#' + tableId).find('select[name="manufacturingProcessName"]').val(processName); |
|||
|
|||
} else { |
|||
console.error('后端请求数据为空'); |
|||
} |
|||
}, |
|||
error: function(xhr, status, error) { |
|||
console.error('请求出错:', status, ", ", error); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
|
|||
|
|||
</script> |
|||
</body> |
|||
</html> |
|||
Loading…
Reference in new issue