/** * toolbar实现类 * 2016-12-19 对submenu的主menu添加click事件监听 */ define(function(require, exports, module) { require('./toolbar.css'); function ToolBar(options) { options.container.append($('
' + '
' + '
'+ '
' + '
')) this.container = options.container.find('.fdpr-toolbar'); this.outContainer = options.container.find('.tool-scroll-container'); this.options = options; this.buttons = options.buttons; this.actions = options.actions; this.menuButtons = options.menuButtons; this.$buttons = {}; } ToolBar.prototype.init = function() { this.createButtons(); this.addMenuButtons(this.menuButtons); $.parser.parse(this.container[0]); var width = this.outContainer.parent().parent().width() - 100 - 60; // this.outContainer.css('max-width', width + 'px'); this.setLeftRightScroll(); }; ToolBar.prototype.setLeftRightScroll = function() { var toolbarCon = this.options.container.find('.fdpr-tools-max-container'); //计算toolbutton宽度之和 var container = this.container[0]; var cloneNode = container.cloneNode(true); var id = window.createGuid() cloneNode.className = cloneNode.className + ' ' + id; cloneNode.style.position = 'absolute'; cloneNode.style.top = '-100px'; cloneNode.style.whiteSpace = 'nowrap'; document.body.appendChild(cloneNode); var toolsWidth = window.getComputedStyle(cloneNode).width; container.style.width = toolsWidth; cloneNode.remove(); // 计算toolbar外层div宽度 var outWidth = window.innerWidth - 20 - 100 - 40 - 50; if (outWidth < parseInt(toolsWidth)) { this.outContainer.width(outWidth + 'px'); toolbarCon.find('.scroll-button').show(); } var scrollCon = toolbarCon.find('.tool-scroll-container'); toolbarCon.on('click', '.left-scroll-button', function(e) { scrollCon.scrollLeft(scrollCon.scrollLeft() - scrollCon.width()); }); toolbarCon.on('click', '.right-scroll-button', function(e) { scrollCon.scrollLeft(scrollCon.scrollLeft() + scrollCon.width()); }) }; ToolBar.prototype.enable = function(fieldname) { if (!this.$buttons.hasOwnProperty(fieldname)) return; var $linkbutton = this.container.find('.fdpr-button-' + fieldname); if ($linkbutton.length > 0) { //普通按钮 $linkbutton.linkbutton('enable'); } }; ToolBar.prototype.disable = function(fieldname) { if (!this.$buttons.hasOwnProperty(fieldname)) return; var $linkbutton = this.container.find('.fdpr-button-' + fieldname); if ($linkbutton.length > 0) { $linkbutton.linkbutton('disable'); } }; ToolBar.prototype.destroyButton = function (button) { button.menubutton('destroy'); }; ToolBar.prototype.createButtons = function () { var buttons = this.buttons; for (var i = 0; i < buttons.length; i++) { this.createButton(buttons[i]); } }; ToolBar.prototype.createButton = function(button) { var self = this; var linkBtn = '' + button.dispname + ''; self.container.append($(linkBtn)); self.container.find('.easyui-linkbutton').last().linkbutton({ 'onClick': function() { if (self.actions.click && typeof self.actions.click == 'function') { self.actions.click(button.opcode); } } }); self.$buttons[button.fieldname] = button; }; ToolBar.prototype.addMenuButtons = function(menuButtons, prevElement) { var self = this; // var menuButtons = self.menuButtons; for (var i = 0; i < menuButtons.length; i++) { var menubtn = menuButtons[i]; var guid = window.createGuid(); var mb = self.createMenuButton(menubtn); var sunmbs = self.createChildMenuButtons(menubtn, menubtn.subButtons, guid); if (prevElement) { mb.insertAfter(prevElement); sunmbs.insertAfter(prevElement); } else { self.container.append(mb); self.container.append(sunmbs); } var mbdom = self.container.find('.menu-' + menubtn.fieldname); //主menu添加click事件监听 mbdom.off('click'); mbdom.on('click', function(e) { if (self.actions.click && typeof self.actions.click == 'function') { self.actions.click(e.currentTarget.dataset.opcode); } }) mbdom.menubutton({ menu: '.' + guid }); $(mbdom.menubutton('options').menu).menu({ onClick: function(item) { var opCode = item.target.dataset.opcode; if (self.actions.click && typeof self.actions.click == 'function') { self.actions.click(opCode); } } }) } }; ToolBar.prototype.createMenuButton = function(mb) { var menuBtn = $(''+ mb.dispname +''); return menuBtn; }; ToolBar.prototype.createChildMenuButtons = function(button, buttons, guid) { var subMenus = $('') for (var i = 0; i < buttons.length; i ++) { subMenus.append('
'+ buttons[i].dispname +'
'); } return subMenus; } function bindButtonActions(button, actions) { } return ToolBar; });