<?php include_once(mvc::$cfg['PATH_TPL'].'public/headBase2.php');?>
<div class="layui-card">
	<div class="layui-card-body" style="max-width:1450px;margin:0 auto;">
		<div class="floatl" style="width:600px;margin-right:20px;padding-right:20px;">
			<form class="layui-form" lay-filter="myitem-form-group" method="post">
				<input type="hidden" name="pur_id" value="<?php echo $purArr['pur_id'];?>"/>
				<blockquote class="layui-elem-quote layui-quote-nm pad10">
					<b>车型：</b><span><?php echo $purArr['pur_model'];?></span>
				</blockquote>
				<blockquote class="layui-elem-quote layui-quote-nm pad10">
					<b>备注：</b><span><?php echo $purArr['pur_remark'];?></span>
				</blockquote>
				<br>
			    <div class="gray">
					<div>格式： 配件名@数量@号码（<span class="warn">一行一个</span>）</div>
					<div>示例：刹车片&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;刹车片@2&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;刹车片@1@GDB900</div>
				 </div>
				 <textarea id="pro-txt" class="layui-textarea" rows="5" placeholder="请输入需要添加的配件信息"></textarea>
				 <div class="center" style="margin:5px 0 10px 0">
					<a class="layui-btn layui-btn-normal layui-btn-sm add-any-btn">快速添加</a>
				 </div>
				<table class="layui-table" id="pur-pro-list">
				  <thead>
					<tr>
					  <th width="30">操作</th>
					  <th width="220px">配件名</th>
					  <th>号码</th>
					  <th width="30">数量</th>
					</tr>
				 </thead>
				 <tbody>
					<?php foreach($purProArr as $v ){ ?>
					<tr num="<?php echo $v['pup_id'];?>">
						<td style="padding:0 10px">
							<a class="layui-btn layui-btn-xs layui-btn-danger delbtn" onclick="$(this).parents('tr').remove();">删除</a>
						</td>
						<td class="input-td"><input type="text" class="layui-input" name="pro[<?php echo $v['pup_id'];?>][pup_name]" maxlength="50" value="<?php echo $v['pup_name'];?>"></td>
						<td class="input-td"><input type="text" class="layui-input" name="pro[<?php echo $v['pup_id'];?>][pup_number]" maxlength="50" value="<?php echo $v['pup_number'];?>"></td>
						<td class="input-td"><input type="text" class="layui-input" name="pro[<?php echo $v['pup_id'];?>][pup_count]" maxlength="50" value="<?php echo $v['pup_count'];?>"></td>
					</tr>
					<?php }?>
				  </tbody>
				</table>
				<br>
				<div class="center"><button class="layui-btn" lay-submit lay-filter="myitem-form">保存</button></div>
			</form>
		</div>
		<?php if(!empty($purArr['pur_imgs'])){?>
		<div class="floatl" style="height:800px;width:800px;background: #eee;">
			<div id="viewer-pics" style="display:none">
				<ul class="pictures">
					<?php foreach(explode(',', $purArr['pur_imgs']) as $img){?>
						<li><img src="<?php echo mvc::$cfg['FILE_CENTER']['pjl']['url_get'].'&c=purchase&f='.str_replace('/240/', '/', $img).mvc::$cfg['FILE_CENTER']['pjl']['get_uri'];?>"></li>
					<?php }?>
				</ul>
			</div>
		</div>
		<?php }?>
		<div class="clear"></div>
	</div>
</div>
<?php include_once(mvc::$cfg['PATH_TPL'].'public/footBase.php');?>
<script>
<?php if(!empty($purArr['pur_imgs'])){?>
var viewer = new Viewer(document.getElementById('viewer-pics'), {
	title:0,
	toolbar: {
		zoomIn:1,
		zoomOut: 1,
		oneToOne: 1,
		prev: $('#viewer-pics li').length > 1 ? 1: 0,
		next: $('#viewer-pics li').length > 1 ? 1: 0,
		rotateLeft: 4,
		rotateRight: 4
	},
	inline:true,
	backdrop:false,
	button:false,
	navbar: true
});
viewer.show();
<?php }?>

layui.use(['table', 'form'], function(){
	var table = layui.table,form = layui.form;
	$('.add-any-btn').click(function(){
		var txt = $.trim($('#pro-txt').val());
		if(txt == '') {
			$('#pro-txt').focus();
			return false;
		}
		var rowArr = txt.replace(/\t/g, '@').split("\n");
		var newRow = new Array();
		var tpl = `<tr num="#num#">
					<td style="padding:0 10px">
						<a class="layui-btn layui-btn-xs layui-btn-danger delbtn" onclick="$(this).parents('tr').remove();">删除</a>
					</td>
					<td class="input-td"><input type="text" class="layui-input" name="pro[#num#][pup_name]" maxlength="50" value="#name#"></td>
					<td class="input-td"><input type="text" class="layui-input" name="pro[#num#][pup_number]" maxlength="50" value="#number#"></td>
					<td class="input-td"><input type="text" class="layui-input" name="pro[#num#][pup_count]" maxlength="50" value="#count#"></td>
				</tr>`;
		var num = 0;
		$('[num]').each(function(){
			var tid = parseInt($(this).attr('num'));
			num = tid < num? tid: num;
			newRow.push($.trim($('[name="pro['+tid+'][pup_name]"]').val())+'@'+$.trim($('[name="pro['+tid+'][pup_number]"]').val()));
		});
		num--;

		for(var i in rowArr)
		{
			if($.trim(rowArr[i]) == '' ) continue;
			var t1 = rowArr[i].split("@");
			if($.trim(t1[0]) == '') continue;
			var name = $.trim(t1[0]);
			var count = t1.length > 1 && $.trim(t1[1]) > 0 ? $.trim(t1[1]): 1;
			var number = t1.length > 2? $.trim(t1[2]): '';
			if($.inArray(name+'@'+number, newRow) == -1) {
				newRow.push(name+'@'+number);
			}else{
				continue;
			}
			$('#pur-pro-list tbody').append(tpl.replace(/#num#/ig, num).replace('#name#', name).replace('#number#', number).replace('#count#', count));
			num--;
		}
		$('#pro-txt').val('');
	});


	//监听提交
	form.render(null, 'myitem-form-group');
	form.on('submit(myitem-form)', function(data){
		
	});
});
</script>