receiptContainerHeader.html 8.82 KB
<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header">
	<title>入库组盘主表</title>
</head>
<style>
	#toolbar1 {
		display: inline-block;
		line-height: 34px;
	}
</style>
<body class="gray-bg">
<div class="container-div">
	<div class="row">
		<div class="col-sm-12 select-info">
			<ul id="myTab" class="nav nav-tabs">
				<li class="active"><a href="#tabHeader" data-toggle="tab">主表</a></li>
				<li><a href="#tabDetail" data-toggle="tab">明细</a></li>
			</ul>
			<div id="myTabContent" class="tab-content">
				<div class="tab-pane fade in active" id="tabHeader">
					<!-- 筛选表单 -->
					<div class="col-sm-12 select-info">
						<form id="receiptContainerHeader-form">
							<div class="select-list">
								<ul>
									<li>入库单号:<input type="text" name="receiptCode"/></li>
									<li>容器编号:<input type="text" name="containerCode"/></li>
									<li>库位编号:<input type="text" name="toLocation"/></li>
									<li>
										任务类型:<select name="taskType" th:with="type=${@dict.getType('taskType')}">
										<option value="">所有</option>
										<option th:each="e : ${type}" th:text="${e.dictLabel}" th:value="${e.dictValue}"></option>
									</select>
									</li>
									<li>
										容器任务状态:<select name="status" th:with="firstStatus=${@dict.getType('receiptContainerHeaderStatus')}">
										<option value="">所有</option>
										<option th:each="e : ${firstStatus}" th:text="${e.dictLabel}" th:value="${e.dictValue}"></option>
									</select>
									</li>
									<li>创 建 人:<input type="text" name="createdBy"/></li>
									<li>
										<a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
										<a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset('receiptContainerHeader-form')"><i class="fa fa-refresh"></i>&nbsp;重置</a>
									</li>
								</ul>
							</div>
						</form>
					</div>

					<!-- 工具栏:直接显示按钮,无权限判断 -->
					<div class="btn-group hidden-xs" id="toolbar" role="group">
						<a class="btn btn-outline btn-success btn-rounded" onclick="batchCreateTask()">
							<i class="fa fa-edit"></i> 批量生成任务
						</a>
						<a class="btn btn-outline btn-danger btn-rounded" onclick="batchRemoveHead()">
							<i class="fa fa-remove"></i> 批量撤销组盘
						</a>
					</div>

					<!-- 统计栏 -->
					<div class="zkc pull-left" style="margin-left: 200px">
						<label class="pull-left">组盘总数:</label>
						<div class="pull-left">
							<input id="currentPageTotal" name="currentPageTotal" class="form-control" type="text" readonly style="width: 50%">
						</div>
						<label>有效组盘数:</label>
						<div class="pull-right">
							<input id="currentPageValidTotal" name="currentPageValidTotal" class="form-control" type="text" readonly style="width: 50%">
						</div>
					</div>

					<!-- 表格 -->
					<div class="col-sm-12 select-info">
						<table id="bootstrap-table" data-mobile-responsive="true" class="table table-bordered table-hover text-nowrap"></table>
					</div>
				</div>
				<div class="tab-pane fade" id="tabDetail"></div>
			</div>
		</div>
	</div>
</div>
<div th:include="include :: footer"></div>

<script th:inline="javascript">
	var ctx = [[${#request.getContextPath()}]] || '/wms';
	if (ctx.slice(-1) !== '/') {
		ctx += '/';
	}

	var prefix = ctx + "receipt/receiptContainerHeader";
	var detailPrefix = ctx + "receipt/receiptContainerDetail";
	var taskType=[[${@dict.getType('taskType')}]];
	var receiptContainerHeaderStatus = [[${@dict.getType('receiptContainerHeaderStatus')}]];

	$(function() {
		var options = {
			url: prefix + "/list",
			sortName: "created",
			sortOrder: "desc",
			modalName: "入库组盘头",
			showExport: true,
			search: false,
			onLoadSuccess: function (res) {
				let total = res.rows ? res.rows.length : 0;
				let validTotal = 0;
				if (res.rows) {
					res.rows.forEach(item => {
						if (item.status == 0 || item.status == 10) validTotal++;
					});
				}
				$("#currentPageTotal").val(total);
				$("#currentPageValidTotal").val(validTotal);
			},
			columns: [
				{checkbox: true},
				{field : 'id', title : '组盘头id', sortable: true},
				{field : 'containerCode', title : '容器编号', sortable: true},
				{field : 'fromLocation', title : '来源库位编号'},
				{field : 'toLocation', title : '目的库位编号', sortable: true},
				{
					field : 'taskType',
					title : '任务类型',
					align: 'center',
					formatter: function(value) {
						return $.table.selectDictLabel(taskType, value);
					}
				},
				{
					field : 'status',
					title : '任务状态',
					align: 'center',
					formatter: function(value) {
						return $.table.selectDictLabel(receiptContainerHeaderStatus, value);
					}
				},
				{field : 'electricQuantity', title : '电池包电量', align: 'center'},
				{field : 'created', title : '创建时间', sortable: true},
				{field : 'createdBy', title : '创建人', sortable: true},
				{
					title: '操作',
					align: 'center',
					formatter: function(value, row) {
						var actions = [];
						if (row.id) {
							actions.push('<a class="btn btn-info btn-xs" onclick="openDetailPageByRow(' + row.id + ')"><i class="fa fa-list-ul"></i>明细</a> ');
						}
						if (row.status < 10){
							if(row.taskType == 200) {
								actions.push('<a class="btn btn-success btn-xs" onclick="chooseStation(' + row.id + ')"><i class="fa fa-edit"></i>生成任务</a> ');
							} else {
								actions.push('<a class="btn btn-success btn-xs" onclick="createTask(' + row.id + ')"><i class="fa fa-edit"></i>生成任务</a> ');
							}
						}
						if (row.status == 0) {
							actions.push('<a class="btn btn-danger btn-xs" onclick="$.operate.remove(' + row.id + ')"><i class="fa fa-remove"></i>取消配盘</a>');
						}
						return actions.join('');
					}
				}]
		};
		$.table.init(options);

		// 双击行打开明细
		$('#bootstrap-table').on('dbl-click-row.bs.table', function(e, row) {
			if (row.id) openDetailPageByRow(row.id);
		});

		// 点击明细标签页
		$("#myTab li:eq(1)").click(function () {
			let url = detailPrefix;
			$("#tabDetail").empty();
			var height = $(document).height() - 100 + 'px';
			var str = '<iframe class="huaheng_iframe" width="100%" height="' + height + '" src="' + url + '" frameborder="0" seamless></iframe>';
			$("#tabDetail").append(str);
			$(".tab-pane").removeClass("in active");
			$("#tabDetail").addClass("in active");
		});
	});

	// 明细页面
	function openDetailPageByRow(headerId) {
		if (!headerId || isNaN(Number(headerId))) {
			$.modal.alertWarning("无效的组盘ID");
			return;
		}
		console.log("主表传递的组盘头ID:", headerId);
		// 切换到明细标签页
		$("#myTab li").removeClass("active");
		$(".tab-pane").removeClass("in active");
		$("#myTab li:eq(1)").addClass("active");
		$("#tabDetail").addClass("in active");
		// 改用URL参数传递ID(兜底方案)
		var url = detailPrefix + "?receiptContainerId=" + Number(headerId);
		console.log("明细页面URL:", url);
		var height = $(document).height() - 100 + 'px';
		var iframeStr = '<iframe class="huaheng_iframe" name="iframe" width="100%" height="' + height + '" src="' + url + '" frameborder="0" seamless></iframe>';
		$("#tabDetail").empty().append(iframeStr);
	}

	// 生成任务
	function createTask(id) {
		$.operate.post(prefix + "/createTask", {ids: id});
	}

	// 批量生成任务
	function batchCreateTask() {
		var rows = $("#bootstrap-table").bootstrapTable('getSelections');
		if (rows.length == 0) {
			$.modal.alertWarning("请至少选择一条记录");
			return;
		}
		var invalid = rows.filter(row => row.status >= 10);
		if (invalid.length > 0) {
			$.modal.alertWarning("有" + invalid.length + "条记录已生成任务,无法重复操作");
			return;
		}
		var ids = rows.map(row => row.id).join(',');
		chooseStation(ids);
	}

	// 选择站台
	function chooseStation(id) {
		$.modal.open("选择站台", ctx + "receipt/receiptContainerHeader/chooseStation/" + id);
	}

	// 批量撤销组盘
	function batchRemoveHead() {
		var rows = $("#bootstrap-table").bootstrapTable('getSelections');
		if (rows.length == 0) {
			$.modal.alertWarning("请至少选择一条记录");
			return;
		}
		var invalid = rows.filter(row => row.status != 0);
		if (invalid.length > 0) {
			$.modal.alertWarning("有" + invalid.length + "条记录非初始状态,无法撤销");
			return;
		}
		$.modal.confirm("确认撤销选中的" + rows.length + "条组盘吗?", function() {
			var ids = rows.map(row => row.id).join(',');
			$.operate.post(prefix + "/remove", {ids: ids}, function() {
				$.table.refresh();
				$.modal.msgSuccess("撤销成功");
			});
		});
	}
</script>
</body>
</html>