<title>订单列表</title>

<style>
	.layui-table-cell{
		height: auto;
		line-height: auto;
	}
</style>

<div class="layui-card layadmin-header">
	<div class="layui-breadcrumb" lay-filter="breadcrumb">
		<a lay-href="">订单</a>
		<a><cite>订单列表</cite></a>
	</div>
</div>

<div class="layui-fluid">
	<div class="layui-card">
		<div class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="layadmin-order-formlist">
			<div class="layui-form-item">
				<div class="layui-inline">
					<div class="layui-input-inline">
						<input type="text" name="username" placeholder="收件人" autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-inline">
					<div class="layui-input-inline">
						<input type="text" name="phone" placeholder="手机号" autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-inline">
					<div class="layui-input-inline">
						<input type="text" name="send_no" placeholder="运单号" autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-inline">
					<div class="layui-input-inline">
						<script type="text/html" template lay-url="{{ layui.setter.apidomain }}yyds/shop/classify" lay-done="layui.data.done(d);">
							<select name="classify">
								<option value="">商品分类</option>
								{{# layui.each(d.data, function(index, item){ }}
								<option value="{{item.id}}">{{item.cname}}</option>
								{{# }) }}
							</select>
						</script>
					</div>
				</div>
				<div class="layui-inline">
					<div class="layui-input-inline">
						<script type="text/html" template lay-url="{{ layui.setter.apidomain }}yyds/user/index">
						<select name="uid">
							<option value="">录单人</option>
							{{# layui.each(d.data, function(index, item){ }}
							<option value="{{item.id}}">{{item.username}}</option>
							{{# }) }}
						</select>
						</script>
					</div>
				</div>
				<div class="layui-inline">
					<div class="layui-input-inline">
						<select name="status">
							<option value="">订单状态</option>
							<option value="1">待发货</option>
							<option value="2">已发货</option>
							<option value="3">已完成</option>
							<option value="4">拒收</option>
							<option value="5">退货</option>
							<option value="0">已取消</option>
						</select>
					</div>
				</div>
				<div class="layui-inline">
					<div class="layui-input-inline">
						<input type="text" name="create_day" class="layui-input" placeholder="下单时间" id="create" autocomplete="off">
					</div>
				</div>
				<div class="layui-inline">
					<button class="layui-btn" lay-submit lay-filter="LAY-order-front-search">
						<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
					</button>
				</div>
			</div>
		</div>

		<div class="layui-card-body">
			<div style="padding-bottom: 10px;">
				<button class="layui-btn layuiadmin-btn-order" data-type="add">添加</button>
			</div>
			<table id="LAY-order-manage" lay-filter="LAY-order-manage"></table>
			<script type="text/html" id="table-order-webuser">
				{{# if(d.status != '已完成'){ }}
					{{# if(d.status == '已取消'){ }}
					<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="realDel"><i class="layui-icon layui-icon-delete"></i>删除</a>
					{{# }else{ }}
					<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
					{{# } }}
				{{# } }}
				{{# if(d.status == '待发货'){ }}
				<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>取消</a>
				{{# } }}
			</script>
		</div>
	</div>
</div>

<script>
	var classifyData = [];
	//商品分类
	layui.data.done = function(d){
		classifyData = d.data;
		layui.use('form', function(){
			var form = layui.form;
			form.render('select');
		});
	};
	layui.use(['table', 'laydate', 'form'], function() {
		var $ = layui.$,
			admin = layui.admin,
			view = layui.view,
			table = layui.table,
			setter = layui.setter,
			laydate = layui.laydate,
			form = layui.form;

		laydate.render({
			elem: '#create',
			range: true,
		});

		//监听搜索
		form.on('submit(LAY-order-front-search)', function(data) {
			var field = data.field;
			//执行重载
			table.reload('LAY-order-manage', {
				where: field,
				page: {curr: 1}
			});
		});

		var rr = setter.request.tokenName,
			tt = setter.tableName;
		//订单列表
		table.render({
			elem: '#LAY-order-manage',
			url: setter.apidomain + 'yyds/order/index',
			headers: {
				jtoken: layui.data(tt)[rr]
			},
			cols: [
				[{
					field: 'id',
					title: 'ID',
					hide: true
				}, {
					field: 'username',
					title: '收件人'
				}, {
					field: 'phone',
					title: '手机号'
				}, {
					title: '收货地址',
					templet: function(d) {
						return d.province + d.city + d.county + d.area;
					}
				}, {
					title: '商品',
					templet: function(d) {
						var c = '';
						layui.each(d.order_list, function(k,v){
							c = c + v.cname + '--' + v.price + '--' + v.nums + '<br />';
						})
						return c;
					}
				}, {
					field: 'all_price',
					title: '订单价格',
					hide: true
				}, {
					field: 'yh_price',
					title: '优惠价格',
					hide: true
				}, {
					field: 'last_price',
					title: '最终价格'
				}, {
					field: 'pre_price',
					title: '定金(已付)',
					hide: true
				}, {
					field: 'dre_price',
					title: '尾款'
				}, {
					field: 'note',
					title: '订单备注'
				}, {
					field: 'status',
					title: '订单状态',
					sort: true
				}, {
					field: 'send_no',
					title: '运单号',
					hide: true
				}, {
					field: 'uname',
					title: '录单人',
					hide: true
				}, {
					field: 'create_time',
					title: '下单时间',
					sort: true,
					hide: true
				}, {
					field: 'update_time',
					title: '最后更新时间',
					sort: true,
					hide: true
				}, {
					title: '操作',
					width: 150,
					align: 'center',
					fixed: 'right',
					toolbar: '#table-order-webuser'
				}]
			],
			page: true,
			limit: 20,
			limits: [20, 50, 100, 1000],
			toolbar: true
		});

		//监听工具条
		table.on('tool(LAY-order-manage)', function(obj) {
			var data = obj.data;
			data.cdata = classifyData;
			if (obj.event === 'edit') {
				admin.popup({
					title: '订单编辑',
					area: ['880px', '960px'],
					success: function(layero, index) {
						view(this.id).render('order/add/index', data).done(function() {
							form.render(null, 'orderSet');
							//监听提交
							form.on('submit(submitorder)', function(formData) {
								if(formData.field.status != 1 && formData.field.send_no == ''){
									layer.msg('请输入运单号！');
									return false;
								}
								formData.field.id = data.id;
								var field = formData.field; //获取提交的字段
								
								//提交 Ajax 成功后，关闭当前弹层并重载表格
								console.log(admin.useAjax("yyds/order/index", 'PUT', field));
								layui.table.reload('LAY-order-manage'); //重载表格
								layer.close(index); //执行关闭
							});
						});
					}
				});
			} else if (obj.event === 'del') {
				layer.confirm('确定取消订单吗?', {
					title: "提示"
				}, function(index) {
					// obj.del();
					layer.close(index);
					console.log(admin.useAjax('yyds/order/index', 'PUT', {
						id: obj.data.id,
						status: 0
					}));
					layui.table.reload('LAY-order-manage'); //重载表格
				});
			} else if (obj.event === 'realDel') {
				layer.confirm('确定删除订单吗?', {
					title: "提示"
				}, function(index) {
					// obj.del();
					layer.close(index);
					var res = admin.useAjax('yyds/order/index', 'DELETE', {
						id: obj.data.id
					});
					if(res.code){
						layui.table.reload('LAY-order-manage');
					}else{
						layer.msg(res.msg);
					}
				});
			}
		});
		$('.layui-btn.layuiadmin-btn-order').on('click', function() {
			var type = $(this).data('type');
			active[type] ? active[type].call(this) : '';
		});
		//事件
		var active = {
			add: function() {
				admin.popup({
					title: '新增订单',
					area: ['880px', '960px'],
					success: function(layero, index) {
						view(this.id).render('order/add/index', {cdata: classifyData}).done(function() {
							form.render(null, 'orderSet');
							//监听提交
							form.on('submit(submitorder)', function(data){
								if(data.field.status != 1 && data.field.send_no == ''){
									layer.msg('请输入运单号！');
									return false;
								}
								var res = admin.useAjax("yyds/order/index", 'POST', data.field);								
								if (res.code) {
									layui.table.reload('LAY-order-manage'); //重载表格
									layer.close(index); //执行关闭
								}
								return false;
							});
						});
					}
				});
			}
		};
	});
</script>
