odd_job/app/worker/view/outjob/print.html

<div class="layui-fluid">
	<div class="layui-card">
		<div class="layui-form layui-form-pane layui-card-header layuiadmin-card-header-auto" lay-filter="LAY-outjob-print-search">
			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">大小</label>
					<div class="layui-input-block">
						<select name="size">
							<option value="box-2cm">2cm</option>
							<option value="box-3cm">3cm</option>
							<option value="box-5cm">5cm</option>
						</select>
					</div>
				</div>
				<div class="layui-inline">
					<button class="layui-btn" lay-submit lay-filter="LAY-outjob-print-btn">
						确定
					</button>
					<button class="layui-btn print-btn" onclick="print_page()">
						打印
					</button>
				</div>
			</div>
		</div>

		<div class="layui-card-body" id="print_view">
			<style>
				@page{  margin:0  }
				.print-body .print-item {margin-top:20px;display:flex;justify-content:space-around;align-items:center;}
				.print-body .box-2cm {width:76px;height:76px;}
				.print-body .box-3cm {width:114px;height:114px;}
				.print-body .box-5cm {width:190px;height:190px;}
				.print-body .print-item img {width:100%;}
			</style>
			<div class="print-body" style="width:794px;height:1123px;border:1px solid #000000;">
				<div class="print-item">
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
				</div>
				<div class="print-item">
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
				</div>
				<div class="print-item">
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
				</div>
				<div class="print-item">
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
				</div>
				<div class="print-item">
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
					<div class="box-2cm">
						<img class="qrcode" src="/static/images/qrcode_test.jpg" alt="">
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<script>
	layui.config({
		base: '/static/echoui/' //静态资源所在路径
	}).extend({
		index: 'lib/index' //主入口模块
	}).use(['index', 'set'], function() {
		var $ = layui.$,
			form = layui.form;

		form.on('submit(LAY-outjob-print-btn)', function(data) {
			$('.print-item div').attr('class',data.field.size)
		});

	});

	function print_page(){
		const $ = layui.$;
		$('.qrcode').each(function(k,v) {
			$(v).attr('src',layui.setter.baseWorkerUrl + 'outjob/qrcode?v='+k);
		});
		layui.layer.load();
		setTimeout(function(){
			layui.layer.closeAll();
			document.body.innerHTML = document.getElementById('print_view').innerHTML;
			window.print();
			window.close();
			location.reload();
		},2000);
	}
</script>