/** * 全屏展示 * @description 点击全屏后以全屏方式展示内容 */ define(function(require, exports, module) { require('./fullscreenchart.css'); require('vendor/unslider/js/unslider-min.js'); require('vendor/unslider/css/unslider-dots.css'); require('vendor/unslider/css/unslider.css'); var echarts = require('vendor/echarts/echarts.min'); var EchartsAdapter = require('../../../adapter/echartsAdapter'); var ToolbarAdapter = require('../../../adapter/toolbarAdapter'); //var FullScreenGrid = require('views/pages/fullscreenwindow/fullscreenchart.js'); this.args; function FullScreenChart(args, callback) { var self = this; this.args = args; this.callback = callback; this.id = 'fullscreen_' + createGuid(); this.chartTypes = []; this.create(); window.onresize = function() { self.resize(); }; } FullScreenChart.prototype.create = function() { var self = this; $('body').append('
'); self.$container = $('#' + self.id); } FullScreenChart.prototype.init = function() { }; FullScreenChart.prototype.open = function() { var self = this; this.chartTypes = []; this.focusObj = document.activeElement; this.init(); self.$container.css({ 'position': 'absolute', 'top': window.scrollY + 'px', 'left': '0px', 'background':'white', 'height': function() { return window.innerHeight; }, 'width': function() { return window.innerWidth; }, 'display': '-webkit-flex', '-webkit-flex-direction': 'column', 'z-index': $.fn.window.defaults.zIndex + 1 }); $('body').width(self.$container.width()) .height(self.$container.height()) .css('overflow', 'hidden'); self.fillBody(); this.customerize(); }; FullScreenChart.prototype.fillBody = function() { var self = this; this.toolbarContainer = $(''); this.mainBodyContainer = $(''); this.footerContainer = $(''); self.$container .append(this.toolbarContainer) .append(this.mainBodyContainer) .append(this.footerContainer); } FullScreenChart.prototype.close = function () { var self = this; if (this.focusObj) { $(this.focusObj).focus(); } $('body').css({ 'overflow': 'auto', 'width': 'auto' }); if(self.callback && typeof self.callback === 'function') { self.callback(); } $('.page-container') .append(self.args.gridContainer) .append(self.args.paginationContainer) .append(self.args.toolContainerFullScreen); self.$container.remove(); } FullScreenChart.prototype.customerize = function() { var self = this; this.initToolbar(); this.initMain(); }; FullScreenChart.prototype.initToolbar = function() { var self = this; var chartNameDiv = $(''); self.toolbarContainer.append(chartNameDiv); this.tooladpFullScreen = new ToolbarAdapter({ pageId: this.id, container: self.toolbarContainer, buttons: [{ fieldname: 'switchtogrid', dispname: '切换到表格', class: '', hint: '切换到表格', opcode: 'switchtogrid' }, { fieldname: 'download', dispname: '下载', class: '', hint: '下载', opcode: 'download' }, { fieldname: 'closeFullScreen', dispname: '关闭', class: '', hint: '关闭', opcode: 'closeFullScreen' }], actions: { click: function(opcode) { self.opRouter(opcode); } } }); this.tooladpFullScreen.init(); chartNameDiv.css({ width: self.toolbarContainer.width() - self.toolbarContainer.find('.fdpr-toolbar').width() - 10 }); }; FullScreenChart.prototype.initMain = function() { var self = this; var rows = self.getDetailRows(); if(rows.length == 0) return; var echartAdapter = new EchartsAdapter({ dataManager: self.args.chartfullscreenArgs.dataManager, rptFormatId: self.args.chartfullscreenArgs.rptFormatId, chartFormat: self.args.chartfullscreenArgs.chartFormat, rows: rows, cb: function(options) { self.echartOpts = options; self.initFooter(); } }); } FullScreenChart.prototype.initFooter = function() { var self = this; var remarkDiv = $(''); var chartIconDiv = $(''); self.footerContainer.append(remarkDiv); self.footerContainer.append(chartIconDiv); if (self.echartOpts) { for (var i = 0; i < self.echartOpts.length; i++) { var echartOpt = self.echartOpts[i]; if ($.inArray(echartOpt.type, self.chartTypes) >= 0 ) { continue; } var iconId = ''; switch (echartOpt.type) { case 'barchart': iconId = 'graph-histogram'; break; case 'linechart': iconId = 'graph-line'; break; case 'areachart': iconId = 'graph-stack'; break; case 'piechart': iconId = 'graph-pie'; break; case 'barlinechart': iconId = 'graph-complex'; break; } var iconSvg = $(''); iconSvg.click(function() { var id = this.id; if (id) { $('.frr-fullscreen-icon-chart').addClass('icon-chart-selected'); $(this).removeClass('icon-chart-selected'); self.addCharts(id); } }); chartIconDiv.append(iconSvg); self.chartTypes.push(echartOpt.type); } self.mainBodyContainer.css({ height: window.innerHeight - self.toolbarContainer.height() - self.footerContainer.height() }); self.addCharts(self.chartTypes[0]); $('.frr-fullscreen-icon-chart:eq(0)').removeClass('icon-chart-selected'); } remarkDiv.css({ width: function() { var charts = $('.frr-fullscreen-icon-chart'); if(charts && charts.length > 0) { var echatswidth = charts.width() * charts.length + 5 * (charts.length + 1); return window.innerWidth - echatswidth - 10; } else { return 'auto'; } } }); } FullScreenChart.prototype.addCharts = function(chartType) { var self = this; if(!chartType || !self.echartOpts) { return; } self.mainBodyContainer.empty(); self.mainBodyContainer.append($('