<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>同步信息</title>
	<link rel="stylesheet" href="/content/lib/layui-v2.9.18/css/layui.css" media="all">
    <link rel="stylesheet" href="/content/lib/font-awesome-4.7.0/css/font-awesome.min.css" media="all">
    <link rel="stylesheet" href="/content/css/public.css" media="all">
</head>
<body>
	<div class="layuimini-container">
		<div class="layuimini-main">

			<blockquote class="layui-elem-quote p10">
				<form class="layui-form layui-form-pane" action="">
					<div class="layui-form-item" style="margin-bottom:0px;">
						<div class="layui-inline">
							<label class="layui-form-label">快递类型：</label>
							<div class="layui-input-inline">
								<input type="number" name="type" placeholder="请输入快递类型" autocomplete="off" class="layui-input">
							</div>
						</div>
						<div class="layui-inline">
							<label class="layui-form-label">启用：</label>
							<div class="layui-input-inline">
								<select name='enable'>
									<option value=''></option>
									<option value='true'> 启用 </option>
									<option value='false'> 禁用 </option>
								</select>
							</div>
						</div>
						<div class="layui-inline">
							<label class="layui-form-label">起始时间</label>
							<div class="layui-input-inline">
								<input type="text" name="start_time" id="start_time" autocomplete="off" class="layui-input">
							</div>
						</div>
						<div class="layui-inline">
							<label class="layui-form-label">结束时间</label>
							<div class="layui-input-inline">
								<input type="text" name="end_time" id="end_time" autocomplete="off" class="layui-input">
							</div>
						</div>
						<div class="layui-inline">
							<button type="submit" class="layui-btn layui-btn-normal" lay-submit lay-filter="data-search-btn"><i class="fa fa-search"></i> 搜 索&nbsp;&nbsp;</button>
						</div>
					</div>
				</form>
			</blockquote>
			<div style="display: none;" id="zyupload" class="zyupload"></div>
			<div class="layui-field-box" style="padding:0;">
				<script type="text/html" id="toolbarDemo">
					<div class="layui-btn-container">
					</div>
				</script>
				<table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
			</div>
		</div>
	</div>
	<!-- 操作列 -->
	<script type="text/html" id="currentTableBar">
		<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="fa fa-edit"></i> 编辑</a>
		<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="fa fa-times"></i> 删除</a>
	</script>

	<script src="/content/lib/layui-v2.9.18/layui.js" charset="utf-8"></script>
	<script src="/content/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
	<script src="/content/lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
	<script>
		layui.use(['table', 'form', 'jquery'], function () {
			var $ = layui.jquery,
				table = layui.table,
                form = layui.form,
				laydate = layui.laydate;

            function get_date() {
                let time = new Date()
                year = time.getFullYear();
                month = time.getMonth() + 1;
                day = time.getDate();

                if (month < 10)
                    month = '0' + month;

                if (day < 10)
                    day = '0' + day;

                return year + '-' + month + "-" + day;
            }
            function get_start_datetime() {
                return get_date() + ' 00:00:00';
            }
            function get_end_datetime() {
                return get_date() + ' 23:59:59';
            }

            //日期时间选择器
            laydate.render({
                elem: '#start_time'
                , value: get_start_datetime()
                , type: 'datetime'
                , format: 'yyyy-MM-dd HH:mm:ss'
            });

            laydate.render({
                elem: '#end_time'
                , value: get_end_datetime()
                , type: 'datetime'
                , format: 'yyyy-MM-dd HH:mm:ss'
            });
			//表格
			table.render({
				elem: '#currentTableId',
				height: 'full-140', //高度最大化减去差值
				url: '/sync/load',  //数据接口
				toolbar: '#toolbarDemo',
				where: {
                    type: '',
					enable: '',
                    start_time: '1970-01-01 08:00:00',
                    end_time: '1970-01-01 08:00:00'
				},
				cols: [[ //表头
					{ field: 'id', title: 'Id', width: 80, fixed: 'left' },
					{
                        field: 'create_time', title: '创建时间', width: 180, templet: function (res) {
                            var arr = res.create_time.split('.');
							if (arr.length == 2)
								return arr[0];
                            return res.create_time;
						}
					},

                    { field: 'device_id', title: '设备ID', width: 130 },
                    {
                        field: 'summary_time', title: '汇总时间', width: 180, templet: function (res) {
                            var arr = res.summary_time.split('.');
                            if (arr.length == 2)
                                return arr[0];
                            return res.summary_time;
                        }
                    },
                    { field: 'running_distance', title: '运行总距离', width: 120 },
                    { field: 'speed', title: '当前速度', width: 120 },
                    { field: 'express_type', title: '快递类型', width: 120 },
                    { field: 'lattice_count', title: '落格数量', width: 120 },
                    { field: 'supply_count', title: '供件数量', width: 120 },
                    { field: 'reflux_count', title: '回流数量', width: 120 },
                    { field: 'supply_summay', title: '供包台汇总', width: 130 },
                    { field: 'lattice_summay', title: '格口汇总', width: 120 },
                    { field: 'reflux_summay', title: '回流汇总', width: 120 },
                    {
                        field: 'enable', title: '状态', width: 80, templet: function (res) {
                            return res.enable ? '启用' : '禁用';
                        }
                    },
					{ field: 'remarks', title: '备注', width: 200 }
				]],
				limits: [50, 100],
				limit: 50,
				page: true
			});
			//搜索
			form.on('submit(data-search-btn)', function (data) {
				//执行搜索重载
				table.reload('currentTableId', {
					page: {
						curr: 1
					},
					where: {
                        type: data.field.type,
                        enable: data.field.enable,
                        start_time: data.field.start_time,
                        end_time: data.field.end_time
					}
				}, 'data');
				return false;
			});
		});
	</script>
</body>
</html>
