src/main/resources/templates/srm/srmHeaderNone/srmHeaderNone.html

<!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"></head>
<style>
	#toolbar1{
		display: inline-block;
		/*position: absolute;*/
		margin: 10px auto;
		line-height: 34px;
	}
	.time3 label, .time3 span, .time3 input {
		float: left;
	}
	.time3 label {
		margin-top: 5px;
	}
	.time3 span {
		display: block;
		margin: 5px 5px;
	}
</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="task-form">
							<div class="select-list">
								<ul>
									<li>
										送货单号：<input type="text" name="code"/>
									</li>
									<li>
										供 应 商：<input type="text" name="supplierCode"/>
									</li>
									<li class="time3" style="height: 30px">
										<label>创建时间： </label>
										<input type="text" class="time-input" id="startTime" placeholder="开始时间"
											   name="createdBegin"/>
										<span>-</span>
										<input type="text" class="time-input" id="endTime" placeholder="结束时间"
											   name="createdEnd"/>
									</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('task-form')"><i class="fa fa-refresh"></i>&nbsp;重置</a>
									</li>
								</ul>
							</div>
						</form>
					</div>
					<div class="btn-group hidden-xs" id="toolbar" role="group">
					</div>
					<input type="hidden" id="headerId" name="headerId" th:value="${headerId}"/>
					<table id="bootstrap-table" data-mobile-responsive="true" class="table table-bordered table-hover"></table>
				</div>
				<div class="tab-pane fade" id="tabDetail">
					<div class="btn-group hidden-xs" id="toolbar1" role="group">
						<input type="hidden" id="headerId" name="headerId" th:value="${headerId}"/>
						<a  class="btn btn-outline btn-success btn-rounded" onclick="checkWarehouse()" shiro:hasPermission="srm:srmDetail:checkWarehouse">
							<i class="fa fa-plus"></i> 选择仓库
						</a>
						<a class="btn btn-outline btn-success btn-rounded" onclick="confirmQty()" shiro:hasPermission="srm:srmDetail:confirmQty">
							<i class="fa fa-plus"></i> 默认数量
						</a>
						<a class="btn btn-outline btn-success btn-rounded" onclick="confirm()" shiro:hasPermission="srm:srmDetail:confirm">
							<i class="fa fa-plus"></i> 提交
						</a>
					</div>
					<table id="bootstrap-table1" data-mobile-responsive="true" class="table table-bordered table-hover"></table>
				</div>
			</div>
		</div>
	</div>
</div>
<div th:include="include :: footer"></div>
<script th:inline="javascript">
	var warehouseWu = [[${@warehouseWu.getAllWarehouseWu()}]];
	var supplier =[[${@SupplierService.getCode()}]];
	var confirmQtyFlag = [[${@permission.hasPermi('srm:srmDetail:confirmQty')}]];
	var prefix = ctx + "srm/srmHeaderNone";
	var prefix1 = ctx + "srm/srmDetailNone";
	// 限制行内编辑重复提交
	var resubmit = new Date().getTime();
	$(function() {
		var options = {
			url: prefix + "/list",
			createUrl: prefix + "/add",
			updateUrl: prefix + "/edit/{id}",
			removeUrl: prefix + "/remove",
			modalName: "送货单",
			sortName: "created",
			sortOrder: "desc",
			search: false,
			pageSize: 10,
			columns: [{
				checkbox: true
			},
				{
					field : 'id',
					title : 'id' ,
					visible:false
				},
				{
					title: '操作',
					align: 'center',
					formatter: function(value, row, index) {
						var actions = [];
						actions.push('<a id="detail" class="btn btn-info btn-xs " href="#" onclick="detail(\'' + row.id + '\')"><i class="fa fa-list-ul"></i>明细</a> ');
						return actions.join('');
					}
				},
				{
					field : 'operator',
					title : '操作人',
					sortable: true
				},
				{
					field : 'created',
					title : '生成时间',
					sortable: true
				},
				{
					field : 'code',
					title : '送货单号',
					sortable: true
				},
				{
					field : 'supplierCode',
					title : '供应商编码',
					sortable: true
				},
				{
					field : 'supplierCode',
					title : '供应商名称',
					align: 'center',
					formatter: function(value, row, index) {
						var actions = [];
						$.each(supplier, function(index, dict) {
							if (dict.code == value) {
								actions.push("<span class='badge badge-info'>" + dict.name + "</span>");
								return false;
							}
						});
						return actions.join('');
					}
				},
				{
					field : 'mark',
					title : '唯一标识',
					sortable: false,
					visible:false
				},
				{
					field : 'lastUpdatedBy',
					title : '更新用户',
					sortable: false,
					visible:false
				},
			]
		};
		$.table.init(options);
	});
	$("#bootstrap-table1").bootstrapTable({
		sortable: true, //排序
		showRefresh: true, //刷新
		showToggle:true, //视图切换
		clickToSelect: false,
		showColumns:true, //列选择
		// detailView:true,
		showExport: true, //导出
		exportDataType: "all",  //导出类型basic', 'all', 'selected'.当前页、所有数据、选中数据
		modalName: "任务明细",
		iconSize: "outline",
		toolbar: "#toolbar1",
		contentType: "application/x-www-form-urlencoded",
		sortName: "id",
		sortOrder: "desc",
		columns: [{
			checkbox: true
		},
			{
				title: '操作',
				align: 'center',
				formatter: function(value, row, index) {
					var actions = [];
					if(row.enable == 0) {
						actions.push('<a class="btn btn-primary btn-xs ' + confirmQtyFlag + '" href="#" onclick="confirmConfirQty(\'' + row.id + '\')"><i class="fa fa-check"></i>确认数量</a>');
					}
					return actions.join('');
				}
			},
			{
				field : 'id',
				title : 'id',
				sortable: true
			},
			{
				field : 'headerId',
				title : 'headerId',
				visible:false
			},
			{
				field : 'companyCode',
				title : '账套',
				sortable: true
			},
			{
				field : 'uWarehouseName',
				title : '仓库',
				sortable: true,
				formatter: function(value, row, index) {
					var actions = [];
					if(row.enable == 0) {
						actions.push('<select onchange="selectListener(this,'+row["id"]+')">');
						if (warehouseWu[row["companyCode"]] !== undefined && warehouseWu[row["companyCode"]].length>0) {
							warehouseWu[row["companyCode"]].forEach(item => {
								if (row["uWarehouseCode"] === item["uWarehouseCode"]) {
									actions.push('<option value="' + item["uWarehouseCode"] + '" selected>' + item["uWarehouseName"] + '</option>');
								} else {
									actions.push('<option value="' + item["uWarehouseCode"] + '">' + item["uWarehouseName"] + '</option>');
								}
							})
							actions.push('</select>');
						}
					}
					return actions.join('');
				}
			},
			{
				field : 'lineCode',
				title : '条码',
				sortable: true
			},
			{
				field : 'materialCode',
				title : '存货编码',
				sortable: true
			},
			{
				field : 'materialName',
				title : '物料名称',
				sortable:true
			},
			{
				field : 'specification',
				title : '物料规格',
				sortable:true
			},
			{
				field : 'qty',
				title : '数量'
			},
			{
				field : 'confirmQty',
				title : '已到数量'
			},
			{
				field : 'enable',
				title : '状态',
				visible:false
			},
			// {
			//     field : 'lastUpdate',
			//     title : '最后修改时间' ,
			//     visible:false,
			//     sortable:true
			// },
			// {
			//     field : 'lastUpdatedBy',
			//     title : '更新用户'
			// }
		],
		onClickCell: function(field, value, row, $element) {
			if (field==="confirmQty") {
				$element.attr('contenteditable', true);
				$element.blur(function () {
					let index = $element.parent().data('index');
					let tdValue = $element.text();
					if ((new Date().getTime()-resubmit)>1500) {
						resubmit = new Date().getTime()
						submitDelivery(row, tdValue);
					}
				})
			}
		}
	});
	function createtable(url,headerId) {
		$("#myTab li").removeClass("active");
		$(".tab-pane").removeClass("in active");
		$("#myTab li:eq(1)").addClass("active");
		$("#tabDetail").addClass("in active");
		$.ajax({
			url:url,
			type: 'post',
			data:{
				headerId:headerId
			},
			success : function (value) {
				$("#bootstrap-table1").bootstrapTable('load', value.data);
			}
		})
	}
	/*入库单列表-详细*/
	function detail(headerId) {
		var url = ctx + 'srm/srmDetailNone/list';
		headerIds = headerId; // 主单Id 再试下
		createtable(url,headerId);
	}
	/* 选择仓库*/
	function checkWarehouse() {
		var rows=$("#bootstrap-table1").bootstrapTable('getSelections');
		if (rows.length == 0) {
			$.modal.alertWarning("请至少选择一条记录");
			return;
		}
		var ids = "";
		for(var i=0; i<rows.length; i++) {
			ids = ids + rows[i].id + ","
		}
		var url = prefix1 + "/checkWarehouse/" + ids;
		$.modal.open("选择仓库" , url);
	}
	function confirmConfirQty(id) {
		var url = prefix1 + "/confirmConfirQty?id="+id;
		$.modal.openFull("确认数量",url);
	}
	/*默认数量*/
	function confirmQty() {
		var rows=$("#bootstrap-table1").bootstrapTable('getSelections');
		if (rows.length == 0) {
			$.modal.alertWarning("请至少选择一条记录");
			return;
		}
		$.modal.confirm("确认执行选中的" + rows.length + "条数据吗?", function() {
			var url = prefix1 + '/confirmQty';
			var ids = "";
			for(var i=0; i<rows.length; i++) {
				ids = ids + rows[i].id + ","
			}
			var data = { "ids": ids.substring(0, ids.length-1) };
			localSubmit(url, "post", "json", data);
		})
	}
	/*提交*/
	function confirm() {
		var rows=$("#bootstrap-table1").bootstrapTable('getSelections');
		if (rows.length == 0) {
			$.modal.alertWarning("请至少选择一条记录");
			return;
		}
		$.modal.confirm("确认执行选中的" + rows.length + "条数据吗?", function() {
			var url = prefix1 + '/confirm';
			var ids = "";
			for(var i=0; i<rows.length; i++) {
				ids = ids + rows[i].id + ","
			}
			var data = { "ids": ids.substring(0, ids.length-1) };
			localSubmit(url, "post", "json", data);
		})
	}
	function localSubmit (url, type, dataType, data) {
		$.modal.loading("正在处理中，请稍后...");
		var config = {
			url: url, type: type, dataType: dataType, data: data, success: function (result) {
				if (result.code == web_status.SUCCESS) {
					$.modal.msgSuccess(result.msg);
					detail(headerIds);
				} else {
					$.modal.alertError(result.msg)
				}
				$.modal.closeLoading()
			}
		};
		$.ajax(config)
	}
	function submitDelivery(row,value){
		formData = {}
		formData["headId"] = row["headId"]
		formData["id"] = row["id"]
		formData["materialCode"] = row["materialCode"]
		formData["materialName"] = row["materialName"]
		formData["qty"] = row["qty"]
		formData["confirmQty"] = value
		confirmAmount(formData)
	}
	function selectListener(event,id){
		console.log("选择了:",event.value)
		selectWarehouse(event.value,id)
	}
	function confirmAmount(form) {
		$.ajax({
			cache : true,
			type : "POST",
			url : prefix1+"/confirmConfirQty",
			data : form,
			async : false,
			error : function(request) {
				$.modal.alertError("请求失败！");
			},
			success : function(data) {
				// $.operate.saveSuccess(data);
				ajaxSuccess(data);
			}
		});
	}
	function selectWarehouse(value,id) {
		$.ajax({
			cache: true,
			type: "POST",
			url: prefix1 + "/checkWarehouse",
			data: {
				"ids":id,
				"uWarehouseCode":value,
			},
			async : false,
			error : function(request) {
				$.modal.alertError("请求失败！");
			},
			success : function(data) {
				// $.operate.saveSuccess(data);
				ajaxSuccess(data);
			}
		});
	}
	function ajaxSuccess(result) {
		if (result.code == web_status.SUCCESS) {
			$.modal.msgSuccess(result.msg);
			var index = parent.layer.getFrameIndex(window.name);
			parent.layer.close(index);
			window.parent.$.table.search();
			$(parent.$("#detail")).click();
		} else {
			$.modal.alertError(result.msg);
		}
		// $.modal.msgSuccess(result.msg);
		$.modal.closeLoading();
		window.parent.detail(headerId)
	}
</script>
</body>
</html>