layui.config({ base: "../../../admin/js/layuiPlugins/" }).use(['form', 'layer', 'jquery', 'laypage', 'element', 'table', 'laydate', 'cascade'], function() { var form = layui.form, layer = layui.layer, laypage = layui.laypage, $ = layui.jquery, table = layui.table, element = layui.element, laydate = layui.laydate, cascade = layui.cascade; //自定义验证 form.verify({ namelength: [ /^.{0,18}$/, "长度限制在0-18个字符噢" ] }); //监听一级Tab切换 element.on('tab(productTabBrief)', function(obj) { switch (obj.index) { case 0: tableVm.reload(); break; } }); var vm = function(obj) { var _this = this; _this.dataId = obj.dataId || 'dataListId'; //数据表ID _this.elem = obj.elem || 'dataListBox'; //数据表容器 _this.url = obj.url || ''; //数据表接口URL _this.page = obj.page; //分页 _this.limit = obj.limit; _this.cols = obj.cols || []; //表头 _this.done = obj.done || ''; //表头 _this.formObj = {}; //当前表单对象 _this.searchParameter = {}; //搜索参数 _this.config = {}; _this.where = obj.where; _this.config.dateTime = obj.dateTime; _this.dateTime = { year: 365 * 1 * 24 * 3600 * 1000, month: 30 * 1 * 24 * 3600 * 1000, day: 24 * 3600 * 1000, } _this.main(); }; //入口函数 vm.prototype.main = function() { var _this = this; _this.initializationData() }; //初始化表格 vm.prototype.initializationData = function() { var _this = this; _this.dataListObj = table.render({ id: _this.dataId, elem: _this.elem, url: _this.url, page: _this.page, cols: _this.cols, done: _this.done, where: $.extend(_this.where, _this.searchParameter), limit: _this.limit, }); }; //重新加载数据表 vm.prototype.reload = function() { var _this = this; _this.dataListObj = table.reload(_this.dataId, { //执行重载数据表 where: _this.searchParameter, page: { curr: 1 } }); }; //初始化组件 vm.prototype.initializationModule = function(obj) { var _this = this; $.ajax({ url: obj.url, data: obj.data, success: function(res) { var html = ''; for (var i in res.data) { html += ''; } $(obj.elem).html(html); form.render(); } }); }; //初始化事件监听 vm.prototype.eventMonitor = function(id) { var _this = this; //监听搜索表单事件 if (typeof(_this.formEvent) == "object") { form.on('submit(' + _this.formEvent + ')', function(obj) { _this.formInfoSearch(_this.formEvent, obj); return false; }); } return _this; }; //搜索处理函数 vm.prototype.formInfoSearch = function(id, obj) { var _this = this; _this.searchParameter = obj.field; if (obj.field.dateRange) { _this.searchParameter.beginTime = obj.field.dateRange.substring(0, 10); _this.searchParameter.endTime = obj.field.dateRange.substring(13, 23); }else{ _this.searchParameter.beginTime = ''; _this.searchParameter.endTime = ''; } delete _this.searchParameter.dateRange; _this.reload(); }; //渲染时间选择器 vm.prototype.showTimeSelect = function() { var _this = this; laydate.render({ elem: _this.datePicker, range: true }); }; //jquer事件绑定 vm.prototype.$event = function() { var _this = this; $(_this.dataExportBtn).on("click", function(e) { _this.dataExport(); }); }; //数据导出处理函数 vm.prototype.dataExport = function() { var _this = this; _this.downloadParameter = '?'; for (var i in _this.dataListObj.config.where) { _this.downloadParameter += "&" + i + '=' + _this.dataListObj.config.where[i]; } _this.startDownload(); }; //启动下载 vm.prototype.startDownload = function() { var _this = this; window.open(window.hywa.config.href + window.hywa.config.port[_this.dataDownload] + _this.downloadParameter); }; // 表格列表 var tableVm = new vm({ dataId: 'tableData', elem: '#tableData', url: 'riderPickTableUrl', dateTime: { year: 1, day: 1, }, page: true, cols: [ [{ field: 'orderNumber', title: '订单号', width: 220, align: 'center' }, { field: 'orderTime', title: '下单时间', align: 'center', width: 180 }, { field: 'stockNumber', title: '取货单号', width: 220, align: 'center' }, { field: 'productName', title: '商品名称' }, { field: 'specification', title: '规格', templet: '{{d.specification}}斤装', align: 'center' }, { field: 'amount', title: '数量', align: 'center' }, { field: 'sellerName', title: '供应商' }, { field: 'note', title: '客户备注' }, { field: 'riderName', title: '骑手', align: 'center' }, { field: 'status', title: '订单状态', align: 'center', templet: '#orderStatusTpl' }] ] }); //初始化事件监听 tableVm.formEvent = ['tableSearch']; tableVm.eventMonitor(); tableVm.$event(); tableVm.datePicker = '#datePicker'; //时间容器 tableVm.showTimeSelect(); });