add.html 12.3 KB
<!DOCTYPE HTML>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head>
    <th:block th:include="include :: header" />
    <th:block th:include="include :: select2-css" />
	<style type="text/css">
	</style>
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-receiptHeader-add" enctype="multipart/form-data">
<!--			<div class="form-group">-->
<!--				<label class="col-sm-3 control-label">入库类型:</label>-->
<!--				<div class="col-sm-8">-->
<!--					<select id="receiptType" name="receiptType" class="form-control">-->
<!--						<option th:text="CLXXRK" th:value="CLXXRK"></option>-->
<!--					</select>-->
<!--				</div>-->
<!--			</div>-->
			<div class="form-group">
				<label class="col-sm-3 control-label">出库类型:</label>
				<div class="col-sm-8">
					<input id="receiptType" name="receiptType" class="form-control" type="text" th:value="CLXXRK" readonly>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">车辆单据类型:</label>
				<div class="col-sm-8">
					<select id="vehicleDocumentType" name="vehicleDocumentType" class="form-control" th:with="vehicleDocumentType=${@dict.getType('vehicleDocumentType')}">
						<option th:each="dict : ${vehicleDocumentType}" th:text="${dict['dictLabel']}" th:value="${dict['dictValue']}"></option>
					</select>
				</div>
			</div>
<!--			<div class="form-group">-->
<!--				<label class="col-sm-3 control-label">原料批号:</label>-->
<!--				<div class="col-sm-8">-->
<!--					<input id="materialBatch" name="materialBatch" class="form-control" type="text">-->
<!--				</div>-->
<!--			</div>-->
			<div class="form-group">
				<label class="col-sm-3 control-label">供应商:</label>
				<div class="col-sm-8">
					<select id="supplier" name="supplier" class="form-control" type="text"></select>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">司机姓名:</label>
				<div class="col-sm-8">
					<input id="vehicleName" name="vehicleName" class="form-control" type="text">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">身份证号:</label>
				<div class="col-sm-6">
					<input id="cardNumber" name="cardNumber" class="form-control" type="text">
				</div>
				<button onclick="ReadIDCard()" class="btn btn-primary" type="button">识别</button>
				<button class="btn btn-info" type="button" onclick="paiZhao()">拍照</button>
			</div>

<!--			<div class="form-group" style="width:600px;margin: 0 auto;white-space: nowrap">-->
<!--				<div class="col-sm-6">-->
<!--					<img id="cameraPlc" name="cameraPlc" src="" width="300px" height="200px"/>-->
<!--				</div>-->
<!--				<div class="col-sm-6">-->
<!--					<img id="view1" src="" width="300px" height="200px" alt="主摄像头画面">-->
<!--				</div>-->
<!--			</div>-->
			<div class="form-group">
				<label class="col-sm-3 control-label">车辆毛重:</label>
				<div class="col-sm-6">
					<input id="grossWeight" name="grossWeight" class="form-control" type="text">
				</div>
				<button type="button" class="btn btn-primary"  onclick="getWeight(0)" >取重</button>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">车辆皮重:</label>
				<div class="col-sm-6">
					<input id="tareWeight" name="tareWeight" class="form-control" type="text">
				</div>
				<button type="button" class="btn btn-primary"  onclick="getWeight(1)" >取重</button>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">车辆净重:</label>
				<div class="col-sm-8">
					<input id="netWeight" name="netWeight" class="form-control" type="text">
				</div>
			</div>


			<div class="form-group">
				<label class="col-sm-3 control-label">物料:</label>
				<div class="col-sm-8">
					<select id="materialCode" name="materialCode" class="form-control"></select>
					</select>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">车牌号:</label>
				<div class="col-sm-8">
					<input id="carNumber" name="carNumber" 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 id="driverNumber" name="driverNumber" 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 id="userDef1" name="userDef1" 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 class="fileUpload" type="file" id="userDef2" name="userDef2">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">驾驶证图片上传:</label>
				<div class="col-sm-8">
					<input class="fileUpload" type="file" id="userDef3" name="userDef3">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">行驶证图片上传:</label>
				<div class="col-sm-8">
					<input class="fileUpload" type="file" id="userDef4" name="userDef4">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">车辆入厂图片上传:</label>
				<div class="col-sm-8">
					<input class="fileUpload" type="file" id="userDef5" name="userDef5">
				</div>
			</div>
			<div class="form-group">
				<div class="form-control-static col-sm-offset-9">
					<button type="submit" class="btn btn-primary" >提交</button>
					<button onclick="$.modal.close()" class="btn btn-danger" type="button" >关闭</button>
				</div>
			</div>
		</form>
	</div>
    <th:block th:include="include :: footer" />
	<th:block th:include="include :: select2-js" />
	<th:block th:include="include :: thumbnail_customized-js" />
	<th:block th:include="include :: bootstrap-fileinput-css"/>
	<th:block th:include="include :: bootstrap-fileinput-js"/>
	<th:block th:include="include :: piexif-js"/>
    <script type="text/javascript">
		//初始化fileinput
		var FileInput = function () {
			var oFile = new Object();
			//初始化fileinput控件(第一次初始化)
			oFile.Init = function(ctrlName, uploadUrl) {
				var control = $('#' + ctrlName);
				//初始化上传控件的样式
				control.fileinput({
					language: 'zh', //设置语言
					uploadUrl: uploadUrl, //上传的地址
					allowedFileExtensions: ['jpg', 'gif', 'png', 'pdf'], //接收的文件后缀
					showUpload: true, //是否显示上传按钮
					showCaption: false, //是否显示标题
					browseClass: "btn btn-primary", //按钮样式
					maxFileCount: 10, //表示允许同时上传的最大文件个数
					enctype: 'multipart/form-data',
					validateInitialCount:true,
					previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
					msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}!",
					uploadExtraData:function (previewId, index) { //传参
						var data = {

						};
						return data;
					}
				});
				//导入文件上传完成之后的事件
				control.on("fileuploaded", function (event, data, previewId, index) {
					let plugin = $('#userDef2').data('fileinput');
					console.log(plugin.initialPreview);
				});
			}
			return oFile;
		};
		//初始化fileinput
		var oFileInput = new FileInput();
		//参数1:控件id、参数2:上传地址
		oFileInput.Init("userDef2", ctx + 'vehicle/vehicleReceipt/uploadReport');


		function paiZhao(){
			$.modal.open("绑定车辆" ,ctx+ "vehicle/vehicleReceipt/pictures");
		}
		function getData(){
			let url = "/wms/img/Capture/carIn.jpg?" + Date.parse(new Date());
			$("#cameraPlc").attr('src',url);
			// setTimeout(getData,5000)
		}

		function drawCanvasImage() {
			const canvas = document.getElementById('canvas');
			canvas.width = width;
			canvas.height = height;
			const context = canvas.getContext('2d');
			context.drawImage(video, 0, 0, width, height, 0, 0, width, height);
			// //获取图片,数据格式为base64
			// const imageData = canvas.toDataURL("image/png");
		}

		var prefix = ctx + "vehicle/vehicleReceipt";

		$("#form-receiptHeader-add").validate({
            rules:{
				receiptType:{
					required:true,
				},
                companyCode:{
                    required:true,
                },
				materialCode:{
					required:true
				},
            },
			submitHandler: function(form) {
				console.log(document.getElementById('userDef4'))
                $.ajax({
                    cache : true,
                    type : "POST",
					contentType:"multipart/form-data",
                    url : prefix + "/add",
					data : $("#form-receiptHeader-add").serializeArray(),
                    async : false,
                    error : function(request) {
                        $.modal.alertError("请求失败!");
                    },
                    success : function(res) {
                        $.operate.saveSuccess(res);
                    }
                });
			}
		});

		$(function () {
            layui.use('laydate', function() {
                var laydate = layui.laydate;
                laydate.render({ elem: '#incomingTime',min: 0, theme: 'molv', format: 'yyyy-MM-dd HH:mm:ss'});
            });
            $('#supplier').select2({
                ajax: {
                    url: ctx+'config/supplier/getData',
                    dataType: 'json',
                    type: 'post',
                    data: function (params) {
                        let query = {
                            supplierName: params.term,
                        }
                        return query;
                    }
                }
            });
			$('#materialCode').select2({
				ajax: {
					url: ctx+'config/material/getData',
					dataType: 'json',
					type: 'post',
					data: function (params) {
						let query = {
							materialName: params.term,
						}
						return query;
					}
				}
			});
        })
		function getWeight(num){
			let url='http://10.34.101.77:8888/wms/API/WMS/v2/getWeightForSerial';
			let type = "POST";
			let dataType = "json";
			let data = {};
			let config = {
				url: url,
				type: type,
				dataType: dataType,
				data: data,
				beforeSend: function () {
					$.modal.loading("正在处理中,请稍后...");
				},
				success: function (result) {
					if(result.code==web_status.SUCCESS){
						if(num == '0'){
							$("#grossWeight").val(result.data)
						}else if(num == '1'){
							$("#tareWeight").val(result.data)
						}
					}
				}
			};
			$.ajax(config)
		}


		function ReadIDCard(){
			$.post("http://127.0.0.1:38088/card=idcard", function(res){
				if(res.code == '0'){
					$("#cardNumber").val(res.IDCardInfo.cardID)
					$("#vehicleName").val(res.IDCardInfo.name)
				}else{
					alert("请将证件放对位置!!!")
				}
			})
		}



		// 主头纠偏拍照
		function scan1cutpage(){
			debugger;
			var data = {
				"filepath": "base64",
				"rotate": "0",
				"cutpage": "1",
				"camidx": "0"
			};
			$.post("http://127.0.0.1:38088/video=grabimage", JSON.stringify(data),
					function(res){
						$('#res_img').attr('src', "data:image/jpg;base64," + res.photoBase64);
						// 调用方式
						// 参数一: 选择器,代表img标签
						// 参数二: 图片名称,可选
						downloadIamge('#res_img', res.photoBase64)
					}
			)
		}



		function downloadIamge(selector, name) {
			var image = new Image()
			// 解决跨域 Canvas 污染问题
			image.setAttribute('crossOrigin', 'anonymous')
			image.onload = function () {
				var canvas = document.createElement('canvas')
				canvas.width = image.width
				canvas.height = image.height

				var context = canvas.getContext('2d')
				context.drawImage(image, 0, 0, image.width, image.height)
				var url = canvas.toDataURL('image/png')

				// 生成一个a元素
				var a = document.createElement('a')
				// 创建一个单击事件
				var event = new MouseEvent('click')

				// 将a的download属性设置为我们想要下载的图片名称,若name不存在则使用‘下载图片名称’作为默认名称
				a.download = name || '下载图片名称'
				// 将生成的URL设置为a.href属性
				a.href = url

				// 触发a的单击事件
				a.dispatchEvent(event)
			}

			image.src = document.querySelector(selector).src
		}

	</script>
</body>
</html>