|
|
@@ -30,19 +30,76 @@ Ext.define('saas.view.main.MainController', {
|
|
|
|
|
|
onToggleNavigationSize: function () {
|
|
|
var me = this,
|
|
|
+ viewModel = me.getViewModel(),
|
|
|
refs = me.getReferences(),
|
|
|
navigationList = refs.navigationTreeList,
|
|
|
navCollapsed = !navigationList.navCollapsed,
|
|
|
- new_width = navCollapsed ? 64 : 160,
|
|
|
+ new_width = navCollapsed ? viewModel.get('smallNavWidth') : viewModel.get('navWidth'),
|
|
|
+ newLogoImgStyle = navCollapsed ? {
|
|
|
+ width: 50,
|
|
|
+ top: 7,
|
|
|
+ left: 6
|
|
|
+ } : {
|
|
|
+ width: 64,
|
|
|
+ top: 0,
|
|
|
+ left: 20
|
|
|
+ },
|
|
|
+ newLogoTextStyle = navCollapsed ? {
|
|
|
+ 10: {
|
|
|
+ opacity: 0.7
|
|
|
+ },
|
|
|
+ 30: {
|
|
|
+ opacity: 0
|
|
|
+ },
|
|
|
+ 100: {
|
|
|
+ opacity: 0
|
|
|
+ }
|
|
|
+ } : {
|
|
|
+ 25: {
|
|
|
+ opacity: 0
|
|
|
+ },
|
|
|
+ 50: {
|
|
|
+ opacity: 1
|
|
|
+ }
|
|
|
+ },
|
|
|
+ newNavIconStyle = navCollapsed ? {
|
|
|
+ marginLeft: 6,
|
|
|
+ fontSize: 28
|
|
|
+ } : {
|
|
|
+ marginLeft: 24,
|
|
|
+ fontSize: 24
|
|
|
+ },
|
|
|
+ newNavTextStyle = navCollapsed ? {
|
|
|
+ opacity: 0
|
|
|
+ } : {
|
|
|
+ opacity: 1
|
|
|
+ },
|
|
|
ope = navCollapsed ? 'addCls' : 'removeCls';
|
|
|
|
|
|
- refs.mainLogo.animate({dynamic: true, to: {width: new_width}});
|
|
|
- navigationList.body.animate({dynamic: true, to: {width: new_width}});
|
|
|
- navigationList.animate({dynamic: true, to: {width: new_width}});
|
|
|
+ var mainLogo = refs.mainLogo;
|
|
|
+ var logoImg = mainLogo.el.dom.getElementsByTagName('img')[0];
|
|
|
+ var logoText = mainLogo.el.dom.getElementsByClassName('logo-text')[0];
|
|
|
+ var navItems = navigationList.el.dom.getElementsByClassName('x-navitem');
|
|
|
+
|
|
|
+ mainLogo.animate({dynamic: true, duration: 500, to: {width: new_width}});
|
|
|
+ Ext.fly(logoImg).animate({dynamic: true, duration: 500, to: newLogoImgStyle});
|
|
|
+ Ext.fly(logoText).animate({dynamic: true, duration: 500, keyframes: newLogoTextStyle});
|
|
|
+ navigationList.body.animate({dynamic: true, duration: 500, to: {width: new_width}});
|
|
|
+ navigationList.animate({dynamic: true, duration: 500, to: {width: new_width}});
|
|
|
+
|
|
|
+ for(var i = 0; i < navItems.length; i++) {
|
|
|
+ var item = navItems[i];
|
|
|
+ var icon = item.getElementsByClassName('nav-inner-icon')[0];
|
|
|
+ var text = item.getElementsByClassName('nav-inner-text')[0];
|
|
|
+
|
|
|
+ Ext.fly(icon).animate({dynamic: true, duration: 500, to: newNavIconStyle});
|
|
|
+ Ext.fly(text).animate({dynamic: true, duration: 500, to: newNavTextStyle});
|
|
|
+ }
|
|
|
|
|
|
navigationList.el[ope]('nav-collapsed');
|
|
|
|
|
|
navigationList.navCollapsed = navCollapsed;
|
|
|
+
|
|
|
},
|
|
|
|
|
|
selectCompany: function(item) {
|