<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<script src="../../../admin/index.js" door type="text/javascript" charset="utf-8"></script>
		<script type="text/html" id="flowerOrderStatusTpl">
			{{#  if(d.status === 0){ }}
			  <span style="color: #FF5722;">待付款</span>
			{{# } else if(d.status === 1) { }}  
			  <span style="color: #FF5722;">待处理</span>
			{{# } else if(d.status === 2) { }}  
			  <span>已完成</span>
			{{# } else if(d.status === 3) { }}  
			  <span style="color: #999;">已取消</span>
			{{#  } }} 
		</script>
		<script type="text/html" id="orderInfoTpl">
			<li><span>订单编号：{{d.purchaseOrderNumber || ''}}</span><span>订单状态：{{d.status==0?"待付款":(d.status==1?"待发货":(d.status==2?"待收货":(d.status==3?"已完成":(d.status==4?"已取消":""))))}}</span></li>
			<li><span>下单用户：{{d.name || ''}}</span><span>下单时间：{{d.createTime || ''}}</span></li>
		</script>
		<script type="text/html" id="orderInfoTpl1">
			<li><span>配送费：{{d.freight || ''}}</span></li>
			<li><span>理货费：{{d.tidyCost || ''}}</span></li>
			<li><span>合计：{{d.orderAmount || ''}}</span></li>
		</script>
		<script type="text/html" id="logInfoTpl">
			<li><span>收件人：{{d.recipient || ''}}</span><span>联系电话：{{d.recipientPhone || ''}}</span></li>
			<li><span>收件地址：{{d.recipientAddress || ''}}</span><!-- <span>期望到达时间：{{d.sendTime || ''}}</span> --></li>
			<li><span>骑手：{{d.riderName || ''}}</span></li>
			<li><span>骑手电话：{{d.riderPhone || ''}}</span></li>
			<!-- <hr> -->
			<!-- <li><span>物流公司：{{d.logisticsCompany || ''}}</span><span>物流单号：{{d.logisticsNumber || ''}}</span><span>发货时间：{{d.sendTime || ''}}</span></li>
			<li><span>物流详情：</span></li> -->
		</script>
	</head>

	<body>
		<div id="detailBox">
			<div class="layui-card">
				<div class="layui-card-header">订单信息</div>
				<div class="layui-card-body">
					<ul id="orderInfo"></ul>
					<table id="flowOrderTableData" lay-filter="flowOrderTableData" class="layui-table"></table>
					<ul id="orderInfo1"></ul>
				</div>
			</div>
			<!-- <div class="layui-card">
				<div class="layui-card-header">理货信息</div>
				<div class="layui-card-body">
					<ul>
						<li><span>完成理货：</span><span>订单流转状态：</span></li>
					</ul>
				</div>
			</div> -->
			<div class="layui-card">
				<div class="layui-card-header">配送信息</div>
				<div class="layui-card-body">
					<ul id="logInfo">
						<li><span>收件人：</span><span>联系电话：</span></li>
						<li><span>收件地址：</span><span>期望到达时间：</span></li>
						<hr>
						<li><span>物流公司：</span><span>物流单号：</span><span>发货时间：</span></li>
						<li><span>物流详情：</span></li>
					</ul>
				</div>
			</div>
		</div>
		<script type="text/javascript">
			layui.config({
				base: "../../../admin/js/layuiPlugins/"
			}).use(["form", 'layer', 'cascade', 'laytpl', 'upload', 'table'], function() {
				var form = layui.form,
					$ = layui.$,
					layer = layui.layer,
					laytpl = layui.laytpl,
					cascade = layui.cascade,
					table = layui.table,
					upload = layui.upload;
				var object = {
					id: (JSON.stringify(location.searchObj()) != "{}") ? location.searchObj().id || null : null, //带参传入ID
					currentData: {},
					urls: {
						byIdUrl: "orderByIdUrl"
					},
					formLayFilter: "addForm", //表单容器
					closeModal: function() { //关闭当前窗口
						parent.layer.close(parent.layer.getFrameIndex(window.name));
					}
				};

				//初始化
				object.main = function() {
					var _this = this;
					_this.getCurrent(_this.id);
					return this;
				};

				//获取当前信息
				object.getCurrent = function(id) {
					var _this = this;
					$.ajax({
						url: _this.urls.byIdUrl,
						data: {
							id: id || _this.id //当前ID
						},
						success: function(res) {
							console.log('1212', res)
							laytpl(orderInfoTpl.innerHTML).render(res.data[0].orderInfo, function(html) {
								$("#orderInfo").html(html);
								form.render();
							});
							laytpl(orderInfoTpl1.innerHTML).render(res.data[0].orderInfo, function(html) {
								$("#orderInfo1").html(html);
								form.render();
							});
							laytpl(logInfoTpl.innerHTML).render(res.data[0].logisticsMessage, function(html) {
								$("#logInfo").html(html);
								form.render();
							});
							_this.formVal();
						}
					});
					table.render({
						dataId: 'flowOrderTableData',
						elem: '#flowOrderTableData',
						url: 'flowOrderTableUrl?orderId=' + _this.id,
						page: false,
						cols: [
							[{
								type: 'numbers',
								title: '取货编号',
								width: 80
							}, {
								field: 'productName',
								title: '商品名称',
								align: 'center',
								width: 200
							}, {
								field: 'specification',
								title: '规格',
								templet:"<i>{{d.specification}}/斤装</i>",
								align: 'center'
							}, {
								field: 'amount',
								title: '数量',
								align: 'center'
							}, {
								field: 'price',
								title: '单价（元）',
								align: 'center'
							}, {
								field: 'sellerName',
								title: '供应商',
								align: 'center'
							}, {
								field: 'customerNote',
								title: '客户备注',
								align: 'center'
							}, {
								field: 'status',
								title: '备货状态',
								align: 'center',
								templet: '#flowerOrderStatusTpl'
							}]
						]
					});
					return this;
				};
				//表单赋值
				object.formVal = function() {
					var _this = this;
					form.val(this.formLayFilter, this.currentData);
					return this;
				};
				//合并表单内容
				object.fusionData = function(obj) {
					this.currentData = $.extend(this.currentData, obj);
					return this;
				};
				object.main();
			});
		</script>
	</body>

</html>
