<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>服务商结账明细-待结账单</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="decorator" content="base" />
</head>
<body>

	<div class="layui-fluid">
		<div class="layui-form layui-card">
			<div class="layui-tab  layui-tab-brief">
				<ul class="layui-tab-title">
					<sfTags:pagePermission authFlag="SITE_DAIJIE_RECORD_T"
						html='<li class="layui-this">
						<a href="${ctx}/yangguang/finance/siteSettlement/siteWaitSettlement">待结账单</a>
					</li>' />
					<sfTags:pagePermission authFlag="SITE_JIEZHANG_RECORD_T" html='<li>
						<a href="${ctx}/yangguang/finance/siteBillingRecord/siteBillingRecordPage">结账记录</a>
					</li>' />
					<button class="layui-btn f-r mt-10 mr-15 pl-10 pr-10" id="searchBtn" lay-submit lay-filter="LAY-user-back-search">
						<i class="layui-icon fs-12">&#xe615;</i>
						查询
					</button>
				</ul>
			</div>
			<div class="layui-card-body" id="searchForm">
				<div class="layui-form-item">
				<%--	<div class="layui-col-lg2 layui-col-sm3">
						<label class="layui-form-label">服务商名称：</label>
						<div class="layui-input-block">
							<select name="siteName" lay-search>
								<option value="">请选择</option>
								<c:forEach var="dts" items="${siteList}">
									<option value="${dts.columns.id}">${dts.columns.name}</option>
								</c:forEach>
							</select>
						</div>
					</div>--%>
					<div class="layui-col-lg2 layui-col-sm3">
						<label class="layui-form-label">工单编号：</label>
						<div class="layui-input-block">
							<input type="text" name="orderNumber" class="layui-input" id="orderNumber" placeholder="请输入">
						</div>
					</div>
					<div class="layui-col-lg4 layui-col-sm6">
						<label class="layui-form-label">结算时间：</label>
						<div class="layui-input-block">
							<div class="layui-col-xs5">
								<input type="text" name="startTime" class="layui-input" id="startTime" placeholder="开始日期">
							</div>
							<div class="layui-col-xs2 text-c lh-30">—</div>
							<div class="layui-col-xs5">
								<input type="text" name="endTime" class="layui-input" id="endTime" placeholder="结束日期">
							</div>
						</div>
					</div>
				</div>
			</div>

		</div>

		<div class='layui-card'>
			<div class="layui-card-body">
				<table class="layui-hide" lay-skin="row" id="test" lay-filter="test"></table>
				<script type="text/html" id="toolbarDemo">
                  		<sfTags:pagePermission authFlag="SITE_DAIJIE_RECORD_JZ_B" html='<button class="layui-btn layui-btn-sm" lay-event="settle"><i class="layui-icon layui-icon-rmb"></i>结账</button>'/>
						<sfTags:pagePermission authFlag="SITE_DAIJIE_RECORD_EXPORT_B" html='<button id="exports" class="layui-btn layui-btn-sm" lay-event="export"><i class="layui-icon layui-icon-export"></i>导出</button>'/>
          		</script>
			</div>
		</div>
	</div>

	<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
	<script>
		var saveMark = false;
		layui.config({
	        base: '${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/' //静态资源所在路径
	    }).extend({
	        index: 'lib/index' //主入口模块
	    }).use(['index', 'tableExt', 'jquery', 'laypage', 'laydate', 'form', 'layer' ], function() {
			$ = layui.$;
			var tableExt = layui.tableExt;
			table = tableExt.getLayTable();
			layer = layui.layer;
			laypage = layui.laypage;
			laydate = layui.laydate;
			form = layui.form;

			//开始日期
			var insStart = laydate.render({
				elem : '#startTime',
				done : function(value, date) {
					//更新结束日期的最小日期
					insEnd.config.min = lay.extend({}, date, {
						month : date.month - 1
					});

					//自动弹出结束日期的选择器
					insEnd.config.elem[0].focus();
				}
			});

			function isBlank(val) {
				if (val == null || $.trim(val) == '' || val == undefined) {
					return true;
				}
				return false;
			}

			//结束日期
			var insEnd = laydate.render({
				elem : '#endTime',
				done : function(value, date) {
					//更新开始日期的最大日期
					insStart.config.max = lay.extend({}, date, {
						month : date.month - 1
					});
				}
			});

			tableExt.render({
				elem : '#test',
				height : 'full-200',
				toolbar : '#toolbarDemo',
				defaultToolbar : false
				//,defaultToolbar: ['exports']
				,
				limits : [ 20, 50, 100 ],
				limit : 20,
				page : true //开启分页
				,
				url : '${ctx}/yangguang/finance/siteSettlement/loadWaitSettlementList',
				totalRow : true,
				cols : [ [ {
					field : 'sort',
					title : '序号',
					width : 80,
					style : 'background-color: #f0f0f0',
					fixed : 'left',
					align : 'center',
					totalRowText : '合计'
				}, {
					field : 'type',
					title : '结算类型',
					width : 100,
					style : 'background-color: #f0f0f0',
					fixed : 'left',
					exportable:true, 
					align : 'center',
					templet : function(d) {
						var type = d.type;
						if (type == '0') {
							return "<span >工单结算</span>";
						} else if (type == '1') {
							return "<span style='color:#FFB800'>结算调整</span>";
						} else {
							return "<span >--</span>";
						}
					},
					expFormat: function(d){
						var type = d.type;
						if (type == '0') {
							return "工单结算";
						} else if (type == '1') {
							return "结算调整";
						} else {
							return "--";
						}
					}
				}, {
					field : 'number',
					title : '工单编号',
					width : 200,
					style : 'background-color: #f0f0f0',
					fixed : 'left',
					align : 'center',
					exportable:true, 
					templet : function(d) {
						return "<span style='color:#D9B589;cursor:pointer;'>" + d.number + "</span>";
					}
				}, {
					field : 'site_name',
					title : '服务商名称',
					width : 150,
					style : 'background-color: #f0f0f0',
					fixed : 'left',
					exportable:true, 
					align : 'center'
				}, {
					field : 'warranty_type',
					title : '保修类型',
					width : 150,
					exportable:true, 
					align : 'center',
					templet : function(d) {
						var warrantyType = d.warranty_type;
						if (warrantyType == '1') {
							return "<span >保内</span>";
						} else if (warrantyType == '2') {
							return "<span >保外</span>";
						} else {
							return "<span >--</span>";
						}
					},
					expFormat: function(d){
						var warrantyType = d.warranty_type;
						if (warrantyType == '1') {
							return "保内";
						} else if (warrantyType == '2') {
							return "保外";
						} else {
							return "--";
						}
					}
				}, {
					field : 'appliance_brand',
					title : '产品信息',
					width : 180,
					align : 'center',
					exportable:true, 
					templet : function(d) {
						return d.appliance_brand + d.appliance_category;
					},
					expFormat: function(d){
						return d.appliance_brand + d.appliance_category;
					}
				}, {
					field : 'appliance_category',
					title : '家电品类',
					hide : true,
					width : 180,
					align : 'center'
				}, {
					field : 'id',
					hide : true,
					width : 180,
					align : 'center'
				}, {
					field : 'appliance_model',
					title : '产品型号',
					width : 150,
					exportable:true, 
					align : 'center'
				}, {
					field : 'appliance_num',
					title : '产品数量',
					width : 180,
					exportable:true, 
					align : 'center'
				}, {
					field : 'service_type',
					title : '服务类型',
					width : 120,
					align : 'center'
				}, {
					field : 'employe_name',
					title : '服务工程师',
					exportable:true, 
					width : 180,
					align : 'center'
				}, {
					field : 'service_costs',
					title : '服务费用',
					exportable:true, 
					width : 100,
					align : 'center'
				}, {
					field : 'mileage_cost',
					title : '里程费用',
					width : 100,
					exportable:true, 
					align : 'center'
				}, {
					field : 'reward_costs',
					title : '奖惩费用',
					exportable:true, 
					width : 100,
					align : 'center'
				}, {
					field : 'other_cost',
					title : '其他费用',
					width : 100,
					exportable:true, 
					align : 'center'
				}, {
					field : 'exigency_costs',
					title : '加急费用',
					width : 100,
					exportable:true, 
					align : 'center'
				}, {
					field : 'other_cost',//里程费用+奖惩费用+其他费用+服务费用+工单加急费
					title : '结算总额',
					width : 100,
					exportable:true, 
					align : 'center',
					templet : function(d) {
						var m1 = isBlank(d.service_costs) ? 0 : d.service_costs;
						var m2 = isBlank(d.mileage_cost) ? 0 : d.mileage_cost;
						var m3 = isBlank(d.reward_costs) ? 0 : d.reward_costs;
						var m4 = isBlank(d.other_cost) ? 0 : d.other_cost;
						var m5 = isBlank(d.exigency_costs) ? 0 : d.exigency_costs;
						var allCost = (parseFloat(m1) + parseFloat(m2) + parseFloat(m3) + parseFloat(m4) + parseFloat(m5)).toFixed(2);
						return '<span >' + allCost + '</span>';
					},
					expFormat: function(d){
						var m1 = isBlank(d.service_costs) ? 0 : d.service_costs;
						var m2 = isBlank(d.mileage_cost) ? 0 : d.mileage_cost;
						var m3 = isBlank(d.reward_costs) ? 0 : d.reward_costs;
						var m4 = isBlank(d.other_cost) ? 0 : d.other_cost;
						var m5 = isBlank(d.exigency_costs) ? 0 : d.exigency_costs;
						var allCost = (parseFloat(m1) + parseFloat(m2) + parseFloat(m3) + parseFloat(m4) + parseFloat(m5)).toFixed(2);
						return allCost ;
					}
				}, {
					field : 'cost_detail',
					title : '结算明细',
					width : 200,
					exportable:true, 
					align : 'center'
				}, {
					field : 'settleRemarks',//结算备注
					title : '备注',
					width : 180,
					exportable:true, 
					align : 'center'
				}, {
					field : 'customer_name',
					title : '用户姓名',
					width : 120,
					exportable:true, 
					align : 'center'
				}, {
					field : 'customer_mobile',
					title : '用户电话',
					width : 150,
					exportable:true, 
					align : 'center'
				}, {
					field : 'customer_address',
					title : '用户地址',
					width : 300,
					exportable:true, 
					align : 'center',
					templet : function(d) {
						return d.province + d.city + d.area + d.customer_address;
					},
					expFormat: function(d){  //格式导出的化字段
						return d.province + d.city + d.area + d.customer_address;
                    }
				}, {
					field : 'province',
					title : '省',
					hide : true,
					align : 'center'
				}, {
					field : 'city',
					title : '市',
					hide : true,
					align : 'center'
				}, {
					field : 'area',
					title : '区',
					hide : true,
					align : 'center'
				}, {
					field : 'repairTime',
					title : '报修时间',
					width : 180,
					exportable:true, 
					align : 'center'
				}, {
					field : 'endTime',
					title : '完工时间',
					width : 180,
					exportable:true, 
					align : 'center'
				}, {
					field : 'settlementTime',
					title : '结算时间',
					width : 180,
					exportable:true, 
					align : 'center'
				} ] ],
				done : function(res) {
					$.ajax({
						type : "post",
						url : "${ctx}/yangguang/finance/siteSettlement/countSettlementDatas",
						data : {},
						success : function(data) {
							var obj = $(".layui-table-total").find("table").find("tbody").find("td");
							obj.eq(9).find("div").html("<span style='color:#ff5151'>" + data.columns.appliance_num_count + "</span>");
							obj.eq(12).find("div").html("<span style='color:#ff5151'>" + data.columns.service_costs_count + "</span>");
							obj.eq(13).find("div").html("<span style='color:#ff5151'>" + data.columns.mileage_cost_count + "</span>");
							obj.eq(14).find("div").html("<span style='color:#ff5151'>" + data.columns.reward_costs_count + "</span>");
							obj.eq(15).find("div").html("<span style='color:#ff5151'>" + data.columns.other_cost_count + "</span>");
							obj.eq(16).find("div").html("<span style='color:#ff5151'>" + data.columns.exigency_costs_count + "</span>");
							obj.eq(17).find("div").html("<span style='color:#ff5151'>" + data.columns.all_cost_count + "</span>");
						}
					})

				},
				exportOpt:{                           //导出选项配置
	                ele:'#exports',                   //导出的Dom元素
	                headerTitle: '待结账单',             //excel表格的标题
	                pageData:false,                     //true:导出的数据为页面数据，false:最大导出maxAmount条数据
	                maxAmount: 10000,                    //当pageData为false生效
	                fileName: '待结账单',
	                where: function (){                 //当pageData为false时生效，过滤的条件
	                	var siteName = $("#searchForm").find("select[name='siteName']").val();
						var startTime = $("#searchForm").find("input[name='startTime']").val();
						var endTime = $("#searchForm").find("input[name='endTime']").val();
						var orderNumber = $("#searchForm").find("input[name='orderNumber']").val();
	                    var ret = {};
	                    ret.siteName= siteName;
	                    ret.startTime= startTime;
	                    ret.endTime= endTime;
	                    ret.orderNumber= orderNumber;
	                    return ret; 
	                }
	            }
			});

			//头工具栏事件
			table.on('toolbar(test)', function(obj) {
				var data = table.checkStatus(obj.config.id);
				switch (obj.event) {
				case 'settle':
					var siteName ="2c9081226ac5eb37016acdf87f65012f";
					var startTime = $("#searchForm").find("input[name='startTime']").val();
					var endTime = $("#searchForm").find("input[name='endTime']").val();
					var orderNumber = $("#searchForm").find("input[name='orderNumber']").val();
					var allowMark = true;
					var content = "";

					if (isBlank(startTime)) {
						content+=isBlank(content) ? '开始时间' : ('、开始时间');
						allowMark = false;
					}
					if (isBlank(endTime)) {
						content+=isBlank(content) ? '结束时间' : ('、结束时间');
						allowMark = false;
					}
					if(!allowMark){
						layer.msg("请先选择您要结算的"+content+"！", {
							icon : 2
						});
						return;
					}
					var params = {};
					params.siteName = siteName;
					params.startTime = startTime;
					params.endTime = endTime;
					params.orderNumber = orderNumber;
					tableExt.reload('test', {
						where : params,
						page : {
							curr : 1
						},
						done : function(res, curr, count) {
							if (count < 1) {
								layer.msg("没有可以进行结账的数据！");
								return;
							}
							layer.open({
								type : 2,
								title : '结账',
								content : '${ctx}/yangguang/finance/siteSettlement/siteSettlePage?siteId=' + siteName,
								area : [ '450px', '287px' ],
								btn : [ '确定', '取消' ],
								yes : function(index, layero) {

									var iframeWindow = window['layui-layer-iframe' + index], submitID = 'sureSubmit', submit = layero.find('iframe').contents()
											.find('#' + submitID);

									//监听提交
									iframeWindow.layui.form.on('submit(' + submitID + ')', function(data) {
										if (saveMark) {
											return;
										}
										var field1 = data.field; //获取提交的字段
										field1.siteId = siteName;
										field1.startTime = startTime;
										field1.endTime = endTime;
										field1.orderNumber = orderNumber;
										saveMark = true;
										$.ajax({
											type : "post",
											data : field1,
											url : "${ctx}/yangguang/finance/siteSettlement/siteSettleSave",
											success : function(result) {
												saveMark = false;
												if (result.code == '200') {
													layer.msg("结账成功！", {
														icon : 1
													});
													var datas = {};
													datas.siteId = siteName;
													datas.startTime = startTime;
													datas.endTime = endTime;
													datas.orderNumber = orderNumber;
													table.reload('test', {
														where : datas,
														page : {
															curr : 1
														},
														done : function(res, curr, count) {
															//此处必须重写此方法
														}
													}); //数据刷新
													layer.close(index); //关闭弹层
												} else {
													layer.msg(result.errMsg, {
														icon : 2
													});
												}
												return;
											},
											error : function(e) {
												saveMark = false;
												layer.msg("结账失败，请联系管理员！", {
													icon : 2
												});
												return;
											}
										})
									});
									submit.trigger('click');
								},
								success : function(layero) {
                                    layero.find('.layui-layer-btn').css('text-align', 'center');
                                    layero.find('.layui-layer-btn').find(".layui-layer-btn0").css("background-color","#009688");
								}
							});
						}
					}); //数据刷新
					break;
				}
				;
			});

			//监听搜索
			form.on('submit(LAY-user-back-search)', function(data) {
				var field = data.field;

				//执行重载
				tableExt.reload('test', {
					where : field,
					page : {
						curr : 1
					},
					done : function(res) {
						$.ajax({
							type : "post",
							url : "${ctx}/yangguang/finance/siteSettlement/countSettlementDatas",
							data : field,
							success : function(data) {
								var obj = $(".layui-table-total").find("table").find("tbody").find("td");
								obj.eq(9).find("div").html("<span style='color:#ff5151'>" + data.columns.appliance_num_count + "</span>");
								obj.eq(12).find("div").html("<span style='color:#ff5151'>" + data.columns.service_costs_count + "</span>");
								obj.eq(13).find("div").html("<span style='color:#ff5151'>" + data.columns.mileage_cost_count + "</span>");
								obj.eq(14).find("div").html("<span style='color:#ff5151'>" + data.columns.reward_costs_count + "</span>");
								obj.eq(15).find("div").html("<span style='color:#ff5151'>" + data.columns.other_cost_count + "</span>");
								obj.eq(16).find("div").html("<span style='color:#ff5151'>" + data.columns.exigency_costs_count + "</span>");
								obj.eq(17).find("div").html("<span style='color:#ff5151'>" + data.columns.all_cost_count + "</span>");
							}
						})

					}
				});
			});

		});

		function reset() {
			$("#searchForm").find("select").val("");
			$("#searchForm").find("input").val("");
		}
	</script>
</body>
</html>

