define(['system/views/pages/page', 'text!./pagePluChange.tpl'], function (BasePage, tpl) { let PAGE_STATE = ['ONE', 'MULTI']; /** * 列表页类定义 * @param id * @param node 节点信息 * @constructor */ function Page(id, node, biz) { let self = this; //通过绑定控制界面显示 self.opts = { showWest: true, showEast: true, showNorth: true, showSouth: false, showDetail: false, showTree: false, treeTitle: '', header: '加载中……', body: '加载中……', footer: '加载中……' } self.pageState = PAGE_STATE[1] //网格列表 self.grids = []; self.showChild = false; //继承Page类构造函数 BasePage.call(self, id, node, tpl, self.opts, biz); //挂载业务状态事件 if (self.biz) { self.biz.on('onStateChanged', function (s, e) { if (s.isEdit()) { self.toDetail(); } }); } } //继承Page类方法 // Page.prototype = new BasePage(); inherits(Page, BasePage); /** * Override * 界面显示后 */ Page.prototype.initCompleted = function () { this.super('initCompleted'); let $detailPanel = this.getElement('.edp-page .page-body-south'); let self = this; $detailPanel.panel({ onResize: function (w, h) { self.resizeGrid($detailPanel); } }); $(window).resize(function () { setTimeout(function(){ let tabId = Store.tabPrefix + self.node.id; self.$container = $('#' + tabId) self.$layout = self.getElement('.easyui-layout'); self.resize(); }, 100); }); //if (self.node.addonWhere) { // _.extend(self.biz.dsMaster.fixQuery, self.node.addonWhere); // self.biz.opRouter("refresh"); //} //this.getElement('#detail-tab').children().first().tabs('disableTab', 2); // $('#detail-tab').children().first().tabs('disableTab', 2); $('#detail-tab').children().first().tabs('disableTab', 3); // $('#detail-tab').children().first().tabs('disableTab', 4); // $('#detail-tab').children().first().tabs('disableTab', 5); // $('#detail-tab').children().first().tabs('disableTab', 6); // $('#detail-tab').children().first().tabs('disableTab', 8); // $('#detail-tab').children().first().tabs('disableTab', 9); // $('#detail-tab').children().first().tabs('disableTab', 10); // $('#detail-tab').children().first().tabs('disableTab', 11); // $('#detail-tab').children().first().tabs('disableTab', 12); // $('#detail-tab').children().first().tabs('disableTab', 13); // $('#detail-tab').children().first().tabs('disableTab', 14); } /** * Override * 用于初始化界面 * @return */ Page.prototype.init = function () { this.fillHeader(); //工具栏 this.fillBody(); //数据区 this.fillFooter(); //页脚 this.fillMenu(); //附加菜单 }; /** * PageAll分为上中下左右五部分 * 此处是上-工具栏 */ Page.prototype.fillHeader = function () { let self = this, sTpl = '
'; //注册工具条 let mainToolBar = { opts: { listBtn: { disable: true } }, data: self.biz, actions: { click: function (opCode) { //如果界面没有执行操作,则执行业务 self.opRouter(opCode); } } }; self.register('toolbar', 'toolbar_main', mainToolBar); self.opts.header = Store.format(sTpl, 'toolbar_main'); }; /** * PageAll分为上中下左右五部分 * 此处是中-数据区 */ Page.prototype.fillBody = function () { let self = this, dsMaster = self.biz.dsMaster; let $body = $('
'); let treeTitle = self.biz.getTreeTitle() if (treeTitle !== null && treeTitle != undefined) { //树模块 let $treediv = $('
') .append(self.getTree()); $body.append($treediv) } //表格 & 编辑面板 let $centerdiv = $('
') .append(self.getMainGrid()) .append(self.getMainEditPanel()) .append(self.getMiddlePanel()); //查询组件 let $northdiv = $('
') .append(self.getQueryPanel()); $body.append($centerdiv).append($northdiv); //明细部分 let $detail = $('
') .append($(self.createTab(dsMaster)).attr('id', 'detail-tab')); $body.append($detail); self.opts.body = $body[0].outerHTML; }; /** * PageAll分为上中下左右五部分 * 此处是中-页脚 */ Page.prototype.fillFooter = function () { }; /** * 上下文菜单 */ Page.prototype.fillMenu = function () { let self = this; //明细菜单 let menu = { actions: { onItemClick: function (opCode, ds, adapter) { self.opRouter.apply(self, arguments); }, bind: function (fn) { self.grids.forEach(function (gd) { if (self.vm[gd]) { self.vm[gd].addContextMenu(fn); } }); } } }; self.register('contextmenu', 'mainmenu', menu); }; /********************生成组件*********************************/ /** * Widget-Tree */ Page.prototype.getTree = function () { let self = this, dsMaster = self.biz.dsMaster, treeName = 'tree_' + dsMaster.name, sTpl = '
加载中……
'; //注册树组件 let treeArgs = { actions: { onClick: function (event, treeNode) { let moduleCode = treeNode.value; let colName = treeNode.colName; self.biz.treeSelected(moduleCode, colName, treeNode); } } }; self.register('tree', treeName, treeArgs); return Store.format(sTpl, treeName); }; /** * Widget-Master-Grid */ Page.prototype.getMainGrid = function () { let self = this, dsMaster = self.biz.dsMaster, gridName = 'grid_' + dsMaster.name, sTpl = '
加载中……
'; //注册主表表格 let mainGrid = { opts: { editable: false, pageSize: self.biz.funcRes.pageSize ? parseInt(self.biz.funcRes.pageSize) : Store.gloablPageSize, showCheckColumn: dsMaster.isShowSelCol, showDelColumn:false }, data: dsMaster, actions: { onDblClick: function (e, args) { self.doOp('view'); }, activeCellChanged: function (e, args) { self.checkCurrent(args.grid, dsMaster); } } } self.register('grid', gridName, mainGrid); self.grids.push(gridName); return Store.format(sTpl, gridName); }; /** * Widget-Master-EditPanel */ Page.prototype.getMainEditPanel = function () { let self = this, dsMaster = self.biz.dsMaster, panleName = 'ep_' + dsMaster.name, sTpl = '
'; //注册编辑面板 let args = { data: dsMaster, opts: { showSettingBtn: '0' }, //TODO 添加last panel enter action actions: { onLastPanelEneterd: function () { let gridName = 'grid_' + self.biz.dsMaster.getDetails()[0].name; if (self.vm[gridName].actions.onActiveFirstCell) { self.vm[gridName].actions.onActiveFirstCell(); } } } }; self.register('editpanel', panleName, args); return Store.format(sTpl, panleName); }; /* * * Middle self fill panel */ Page.prototype.getMiddlePanel = function() { let middlePanel = this.biz.middlePanel; if (!middlePanel || !middlePanel.show) return ''; let height = middlePanel.height || 60; let sTpl = ''; return sTpl; }; /* * 设置middlePanel内容 */ Page.prototype.setMiddlePanel = function() { let el = this.getElement('.edp-page-middle-section'); el.html(this.biz.middlePanel.content); el.height(this.biz.middlePanel.height); }; /* * 控制middlepanel的显示与隐藏 */ Page.prototype.showMiddlePanel = function(show) { let el = this.getElement('.edp-page-middle-section'); if (show) { el.show(); } else { el.hide(); } this.resize(); }; /** * Widget-QueryPanel */ Page.prototype.getQueryPanel = function () { let self = this, dsMaster = self.biz.dsMaster, qpName = 'qp_' + dsMaster.name, sTpl = '
'; //注册查询组件 let queryPanel = { source: dsMaster, opts: { showSettingBtn: '0' }, data: self.biz.funcQueryProject, //data: dsMaster, actions: { querySchemeChanged: function () { if (!self.$layout) return; self.resize(); } } }; self.register('querypanel', qpName, queryPanel); return Store.format(sTpl, qpName); }; /** * Widget-TabControl * @param ds * @returns {string} */ Page.prototype.createTab = function (ds) { let tabs = [], self = this, sTpl = '
加载中……
'; //生成tab let tabName = 'tab_' + ds.name; let details = ds.getDetails(); if (details.length > 0) { for (let i = 0, len = details.length; i < len; i++) { let d = details[i]; if (!d.isShow) { continue; } tabs.push(self.createTabItem(d)); } if (tabs.length == 0) { return ''; } if (ds == self.biz.dsMaster) { self.hasChild = true; } let tabsArgs = { opts: {}, data: { tabs: tabs }, actions: { onAddClick: function () { let row = self.vm[tabName].getSelectedTabData(); //只有满足三个条件才能增加新行 //1、编辑状态 //2、数据源允许新增 //3、当前行为空或者当前行提交成功 if (self.biz.isEdit() && row.dataSrc.allowInsert && (!row.dataSrc.currentRow || row.dataSrc.currentRow.validate())) { row.dataSrc.addRow(); } }, onDeleteClick: function () { let row = self.vm[tabName].getSelectedTabData(); //只有满足三个条件才能增加删行 //1、编辑状态 //2、数据源允许删除 //3、当前行为不为空 self.biz.columnDeleteButtonClick(row); }, onClearClick: function () { let row = self.vm[tabName].getSelectedTabData(); //只有满足二个条件才能增加删行 //1、编辑状态 //2、数据源允许删除 if (self.biz.isEdit() && row.dataSrc.allowDel) { Store.messager.confirm(Store.MSG.DELETEALL_CONFIRM, function (isOk) { if (isOk) { row.dataSrc.deleteAll(); } }); } } } }; self.register('tabs', tabName, tabsArgs); return Store.format(sTpl, tabName); } return ''; } /** * Widget-TabItem * @param ds * @returns {{title: *, content: string, closable: boolean, iconCls: string, dataSrc: *}} */ Page.prototype.createTabItem = function (ds) { let self = this; //生成标签 let tabOpts = { title: ds.uiObjName, content: '', closable: false, iconCls: 'icon-window', dataSrc: ds }; let $divTabItem = $('
'); if(ds.name === 'dsDetailBd') { let $headdiv = $('
') .append(self.getDetailEditPanel(ds)).append($('
'+ '通常情况下,不足月时保底按整月进行处理;如果不足月时保底不按整月进行处理,则需要设置该月的保底明细。
'+ '结算对账时,优先使用合同中设置的保底明细,如果该结算期间没有设置保底明细,则取 保底额/保底月数 作为该月的保底额。
')); $divTabItem.append($headdiv); //$divTabItem.append($divDetail); }else { let details = self.getViewDetails(ds); if (details.length > 0) { //分上中下三部分 let $divHead = $('
') .append(self.getDetailGrid(ds)); let $divDetail = $('
') .append('
') .append(self.createTab(ds)); //组合到div $divTabItem.append($divHead); $divTabItem.append($divDetail); } else { let $headdiv = $('
') .append(self.getDetailGrid(ds)); $divTabItem.append($headdiv); } } tabOpts.content = $divTabItem[0].outerHTML; return tabOpts; } Page.prototype.getDetailEditPanel = function (ds) { let self = this, panleName = 'ep_' + ds.name, sTpl = '
'; //注册编辑面板 let args = { data: ds, opts: { showSettingBtn: '0' }, //TODO 添加last panel enter action actions: { onLastPanelEneterd: function () { let gridName = 'grid_' + self.biz.dsMaster.getDetails()[0].name; if (self.vm[gridName].actions.onActiveFirstCell) { self.vm[gridName].actions.onActiveFirstCell(); } } } }; self.register('editpanel', panleName, args); return Store.format(sTpl, panleName); }; /** * Widget-Detail-Grid * @param ds */ Page.prototype.getDetailGrid = function (ds) { let gridName = 'grid_' + ds.name, self = this, sTpl = '
加载中……
'; //注册网格 let gridArgs = { opts: { editable: false, // enableAddRow: true, enablePager: false, showCheckColumn: ds.isShowSelCol, showDelColumn:true }, data: ds, actions: { activeCellChanged: function (e, args) { self.checkCurrent(args.grid, ds); }, onColumndeleteButtonClick: function(row) { self.biz.columnDeleteButtonClick(row); } } } self.register('grid', gridName, gridArgs); ds.on('onCurrentChanged', self.loadDetailDetail); self.grids.push(gridName); return Store.format(sTpl, gridName); }; Page.prototype.loadDetailDetail = function (ds, args) { let relations = ds.getDetailRelations(); for (let i = 0; relations.length > i; i++) { let r = relations[i]; //如果旧行不为空,则保存数据 if (args.oldRow) { args.oldRow[r.detail.name] = r.detail.snapData(); r.updateRelationValue(args.oldRow); } //如果新行不为空,检查是否有明细数据,有则填充,无则通过服务器获取 //如果新行为空,则只清空明细 if (args.newRow) { let rowData = args.newRow[r.detail.name]; if (rowData) { r.detail.resetData(rowData); delete args.newRow[r.detail.name]; continue; } else { r.detail.searchByMaster(ds.currentRow); } } else { r.detail.clear(); } } }; Page.prototype.getViewDetails = function (ds) { let details = ds.getDetails(), result = []; for (let i = 0, len = details.length; i < len; i++) { let d = details[i]; if (d.isShow) { result.push(d); } } return result; }; /***********调用Biz方法********************/ /** * 更新业务类是否显示明细 * @return */ Page.prototype.bizShowDetail = function (value) { this.biz.setShowDetail(value); }; Page.prototype.bizLoadDetails = function () { this.biz.loadDetails(); } Page.prototype.bizUpdateCurrent = function () { this.biz.dsMaster.updateRow(); // this.biz.loadDetails(); } /** * 界面按钮操作,无需业务处理 * @param {[type]} opCode [description] * @return {String} 是否执行过业务操作 */ Page.prototype.doOp = function (opCode) { let self = this; let isHandled = false; switch (opCode) { case 'detail': self.toDetail(); self.bizLoadDetails(); isHandled = true; break; case 'list': this.toList(); isHandled = true; break; case 'refresh': if (this.isDetail()) { this.bizUpdateCurrent(); isHandled = true; } break; case 'child': this.toggleShowChild(); break; case 'view': if (self.isDetail()) { this.toList(); isHandled = true; } else { self.toDetail(); self.bizLoadDetails(); isHandled = true; } break; } return isHandled; }; /** * 检查当前行是否改变,如果改变则通知业务类和更新当前行 * @param {[type]} grid [description] * @param {[type]} dataSrc [description] * @return {[type]} [description] */ Page.prototype.checkCurrent = function (grid, dataSrc) { let cell = grid.getActiveCell(); if (cell) { let dataRow = grid.getDataItem(cell.row); if (dataRow !== dataSrc.currentRow) { let oldRow = dataSrc.currentRow; dataSrc.setCurrentRow(dataRow); } } else { if (dataSrc.currentRow !== null) { dataSrc.setCurrentRow(null); } } }; Page.prototype.setLayoutState = function (newState) { let self = this; this.pageState = newState; self.opts.showDetail = newState === PAGE_STATE[0]; self.setShowChild(newState === PAGE_STATE[0]); self.updateOpEnable(false); self.resize(); }; Page.prototype.setShowChild = function (value) { let self = this; self.showChild = value && self.hasChild; //兼容问题,Biz使用showDetail表示是否显示明细 self.bizShowDetail(value); }; /** * 切换到查询列表页,,只有按钮才会使用 * @return {[type]} [description] */ Page.prototype.toList = function () { this.setLayoutState(PAGE_STATE[1]); }; /** * 切换到详情页-编辑界面 * @return {[type]} [description] */ Page.prototype.toDetail = function () { this.setLayoutState(PAGE_STATE[0]); }; Page.prototype.hideBodyPanel = function (region) { let $body = this.getElement('.edp-page .page-body'), $region = $body.layout('panel', region); //$panel = $region.panel('panel'); //$panel.hide(); $region.panel('close'); }; Page.prototype.showBodyPanel = function (region) { let $body = this.getElement('.edp-page .page-body'), $region = $body.layout('panel', region); //$panel = $region.panel('panel'); $region.panel('open'); }; Page.prototype.resize = function () { let self = this, $body = self.getElement('.edp-page .page-body'); if (self.pageState == PAGE_STATE[1]) { self.showBodyPanel('north'); self.showBodyPanel('west'); //$body.layout('resize');//重新計算Layout大小 let h1 = self.getElement('.query-panel-wrapper').height(); h1 += 10 h1 = h1 > 200 ? 200 : h1; self.getElement('.edp-page .page-body-north').panel('resize', { height: h1 }); if (h1 === 200) { $('.edp-page .page-body-north').css('overflow', 'auto'); } else { $('.edp-page .page-body-north').css('overflow', 'hidden'); } if (self.showChild) { self.showBodyPanel('south'); let h = $body.height(); let h2 = h - (h1 ? h1 : 0); self.getElement('.edp-page .page-body-south ').panel('resize', { height: h2 / 2 }); } else { self.hideBodyPanel('south'); } self.vm.toolbar_main.setText('view', Store.MSG.VIEW); self.vm.toolbar_main.invoke('setIcon', 'view', 'icon-view'); } if (self.pageState == PAGE_STATE[0]) { self.hideBodyPanel('north'); self.hideBodyPanel('west'); if (self.showChild) { $body.layout('resize');//重新計算Layout大小 let h1 = self.getElement('.edp-page .page-body-center .filed-group').height(); let h2 = self.getElement('.edp-page .page-body-center .edp-page-middle-section').height(); let h = $body.height(); if (!h2) { if (h < h1) { h1 = h / 2; } else { h1 = h1 > 200 ? 200 : h1; } } else { h1 += h2 + 5; } self.showBodyPanel('south'); self.getElement('.edp-page .page-body-south').panel('resize', { height: h - h1 }); } else { self.hideBodyPanel('south'); } self.vm.toolbar_main.setText('view', Store.MSG.BACK); self.vm.toolbar_main.invoke('setIcon', 'view', 'icon-undo'); } $body.layout('resize'); self.updateGrids(); } Page.prototype.updateGrids = function () { let self = this; //重置grid self.resizeGrid(self.$layout); }; Page.prototype.toggleShowChild = function () { let self = this; self.setShowChild(!self.showChild); if (self.showChild) { this.bizLoadDetails(); } else { } self.resize(); }; /****************业务类使用方法******************/ /** * 是否在列表页 * @return {Boolean} [description] */ Page.prototype.isList = function () { return this.pageState === PAGE_STATE[1]; }; /** * 是否在详情页 * @return {Boolean} [description] */ Page.prototype.isDetail = function () { return this.pageState === PAGE_STATE[0]; }; /** * 控制按钮可用 * @param {[type]} opCode [description] */ Page.prototype.setButtonEnable = function (opCode) { this.vm.toolbar_main.setEnable(opCode); }; /** * 控制按钮不可用 * @param {[type]} opCode [description] */ Page.prototype.setButtonDisabled = function (opCode) { this.vm.toolbar_main.setDisabled(opCode); }; /** * 更新按钮状态 * @param {Boolean} isRecord 是否行处理 * @return {[type]} [description] */ Page.prototype.updateOpEnable = function (isRecord) { this.vm.toolbar_main.update(isRecord); }; Page.prototype.setEditLimit = function (dataSrc, col, editable) { let adapter = this.vm['ep_' + dataSrc.name]; if (adapter) { adapter.setEditorEditable(col.isDataColumn ? col.fieldName : col, editable); } }; Page.prototype.selectTab = function (dataSrc, index) { let adapter = this.vm['tab_' + dataSrc.name]; if (adapter) { adapter.select(index); } }; Page.prototype.setOptions = function (dataSrc, opts) { let adapter = this.vm['grid_' + dataSrc.name]; if (adapter) { adapter.setOptions(opts); } } /** * 设置树的数据-Biz-API * @param data */ Page.prototype.setTreeData = function (data) { let treeName = 'tree_' + this.biz.dsMaster.name; if (this.vm[treeName]) { this.vm[treeName].reset(data); } }; // 设置主从从中间从表的高度 Page.prototype.setHeightOfDetailGrid = function(height) { let fHeight = parseFloat(height); this.getElement('page-tabitem-half:eq(0)').css('height', fHeight + '%'); this.getElement('page-tabitem-half:eq(1)').css('height', (97 - fHeight) + '%'); this.resize(); } Page.prototype.getExcelData = function(hasData) { let name = this.biz.dsMaster.name; let adapter = this.vm['grid_' + name]; if (adapter) { return adapter.getSchemaData(hasData); } return {}; } return Page })