文件版本暂时回退

kanban-console/src/main/webapp/resources/app/view/desktop/BoardParamWindow.js

@@ -1,9 +1,8 @@
 Ext.define('erp.view.desktop.BoardParamWindow',{
     extend:'Ext.window.Window',
     alias:'widget.boardparamwin',
-    width: '80%',
-    height: '80%',
-    resizable: false,
+    width:800,
+    height:450,
     modal:true,
     layout:'border',
     id:'template',
@@ -12,182 +11,9 @@ Ext.define('erp.view.desktop.BoardParamWindow',{
     initComponent:function(){
         var me = this;
         me.items = [{
-        	xtype: 'panel',
-        	region: 'west',
-        	id: 'areaPanel',
-        	title: '多画面配置',
-        	collapsible: true,
-        	animCollapse: false,
-        	collapsed: true,
-        	layout: 'anchor',
-        	width: 300,
-        	items: [{
-        		xtype: 'form',
-        		id: 'areaForm',
-	        	layout: 'vbox',
-	        	anchor: '100% 40%',
-	        	defaults: {
-	        		margin: 5
-	        	},
-	        	items: [{
-	        		xtype: 'hidden',
-	        		fieldLabel: '多画面code',
-	        		name: 'viewcode'
-	        	}, {
-	        		xtype: 'combobox',
-	        		fieldLabel: '多画面展示方式',
-	        		name: 'viewtype',
-	        		editable: false,
-	        		allowBlank: false,
-	        		store: Ext.create('Ext.data.Store', {
-	        			fields: ['value', 'name'],
-	        			data: [{value: 'single', name: '单屏显示'}, {value: 'more', name: '多屏显示'}]
-	        		}),
-	        		queryMode: 'local',
-				    displayField: 'name',
-				    valueField: 'value',
-				    value: 'single',
-				    listeners: {
-				    	change: function(typefield) {
-				    		var areaForm = Ext.getCmp('areaForm'),
-				    			f = areaForm.getForm(),
-				    			countfield = f.findField('areacount'),
-				    			rowsfield = f.findField('arearows'),
-				    			colsfield = f.findField('areacols');
-				    		
-				    		if(typefield.getValue() == 'more') {
-				    			countfield.setValue(1);
-				    			countfield.show();
-				    			rowsfield.hide();
-				    			rowsfield.setValue(1);
-				    			colsfield.hide();
-				    			colsfield.setValue(1);
-				    		}else {
-				    			countfield.setValue(1);
-				    			countfield.hide();
-				    			rowsfield.setValue(1);
-				    			rowsfield.show();
-				    			colsfield.setValue(1);
-				    			colsfield.show();
-				    		}
-				    		var areaForm = Ext.getCmp('areaForm'),
-	        					areaView = Ext.getCmp('areaView'),
-				    			f = areaForm.getForm();
-	        				var values = f.getValues();
-		                    areaView.createArea(values);
-				    	}
-				    }
-	        	}, {
-	        		xtype: 'numberfield',
-	        		fieldLabel: '分屏数量',
-	        		name: 'areacount',
-	        		value: 1,
-	        		minValue: 1,
-	        		maxValue: 8,
-	        		hidden: true,
-	        		listeners: {
-	        			change: function(countfiedl) {
-	        				if(!countfiedl.isValid()) {
-	        					return;
-	        				}
-	        				var areaForm = Ext.getCmp('areaForm'),
-	        					areaView = Ext.getCmp('areaView'),
-				    			f = areaForm.getForm();
-	        				var values = f.getValues();
-		                    areaView.createArea(values);
-	        			}
-	        		}
-	        	}, {
-	        		xtype: 'numberfield',
-	        		fieldLabel: '多画面展示行数',
-	        		name: 'arearows',
-	        		value: 1,
-	        		minValue: 1,
-	        		maxValue: 2,
-	        		listeners: {
-	        			change: function(rowsfield) {
-	        				var colsfield = rowsfield.nextSibling();
-	        				if(!colsfield.isValid() || !rowsfield.isValid()) {
-	        					return;
-	        				}
-	        				me.refreshAreaView();
-	        			}
-	        		}
-	        	}, {
-	        		xtype: 'numberfield',
-	        		fieldLabel: '多画面展示列数',
-	        		name: 'areacols',
-	        		value: 1,
-	        		minValue: 1,
-	        		maxValue: 4,
-	        		listeners: {
-	        			change: function(colsfield) {
-	        				var rowsfield = colsfield.previousSibling();
-	        				if(!colsfield.isValid() || !rowsfield.isValid()) {
-	        					return;
-	        				}
-	        				me.refreshAreaView();
-	        			}
-	        		}
-	        	}],
-	        	loadData: function() {
-	        		var form = this,
-	        			record = me.record,
-	        			code = record.get('code');
-	        		
-	        		Ext.Ajax.request({
-		                url:'panelView/get/byPanel/' + code,
-		                method:'POST',
-		                callback:function(options, success, response){
-		                	Ext.getCmp('desktopDataView').getEl().unmask();
-		                    var f = form.getForm(),
-		                    	areaView = Ext.getCmp('areaView');
-		                    	
-		                    if(response.responseText){
-		                    	var res = Ext.decode(response.responseText),
-		                    		areaConfig = res.areaConfig,
-		                    		length = areaConfig.length;
-		                    	
-		                    	// 存在多画面展示时才默认打开多画面配置
-		                    	if(length > 1 || res.viewType == 'more') {
-		                    		var areaPanel = Ext.getCmp('areaPanel');
-		                    		areaPanel.expand();
-		                    		areaPanel.animCollapse = true;
-		                    	}
-		                    	areaConfig = areaConfig.map(function(c, i) {
-		                    		var p = c.viewParameters;
-		                    		c.viewParameters = Ext.decode(p);
-		                    		return c;
-		                    	});
-		                    	areaView.oldAreaConfig = areaConfig;
-		                    	
-		                    	f.findField('viewcode').setValue(res.code);
-		                    	f.findField('viewtype').setValue(res.viewType);
-		                    	f.findField('areacount').setValue(res.areaCount);
-		                    	f.findField('arearows').setValue(res.areaRows);
-		                    	f.findField('areacols').setValue(res.areaCols);
-		                    }
-		                    var values = f.getValues();
-		                    areaView.createArea(values);
-		                }
-	                });
-	        	}
-        	}, {
-        		xtype: 'areaview',
-        		id: 'areaView',
-        		anchor: '100% 60%'
-        	}],
-        	listeners: {
-        		expand: function() {
-        			var areaview = Ext.getCmp('areaView');
-        			areaview.fireEvent('layoutHeight', areaview);
-        		}
-        	}
-        }, {
-        	xtype:'form',
-        	region: 'center',
+            xtype:'form',
             id:'paramForm',
-            anchor: '100% 100%',
+            region: 'center',
             layout:'column',
             autoScroll: true,
             defaults:{
@@ -196,7 +22,7 @@ Ext.define('erp.view.desktop.BoardParamWindow',{
             },
             items:[{
                 xtype:'fieldset',
-                title:'画面1参数设置',
+                title:'参数设置',
                 hidden: true
             },{
                 xtype:'fieldset',
@@ -211,25 +37,53 @@ Ext.define('erp.view.desktop.BoardParamWindow',{
                     fieldLabel:'刷新/切换频率(秒/次)',
                     value:'5',
                     minValue:1,
-                    allowBlank:false,
-                    listeners: {
-                    	change: function(field) {
-                    		if(field.isValid())
-                    			me.setViewParameters();
-                    	}
-                    }
-                }]
+                    allowBlank:false
+                },/*{
+                    xtype:'numberfield',
+                    id:'switchFrequency',
+                    name:'switchFrequency',
+                    fieldLabel:'切换频率(秒/次)',
+                    minValue:3,
+                    value:'30',
+                    minValue:1
+                }*/]
             }],
-            setDefaultValues: function(values) {
-            	this.defaultValues = values;
-            },
-            getDefaultValues: function() {
-            	return this.defaultValues;
-            },
-            getCusParams: function() {
-            	var values = this.getForm().getValues();
-            	delete values[refreshFrequency];
-            	return values;
+            /**
+             * 添加面板参数下拉组件
+             */
+            addParamCombo: function() {
+                var form = this;
+                var items = me.resData.parameters;
+                var paramFieldSet = form.items.items[0];
+                paramFieldSet.removeAll();
+                var comboxs = [];
+                Ext.Array.each(items, function(item, index) {
+                    var data = item.optionalValues ? item.optionalValues.map(function (v) {
+                        return {
+                            value: v,
+                            name: v
+                        }
+                    }) : []
+                    var combox = new Ext.form.field.ComboBox({
+                        fieldLabel: item.name,
+                        name: item.code,
+                        store: Ext.create('Ext.data.Store', {
+                            fields: ['value', 'name'],
+                            data: data
+                        }),
+                        queryMode: 'local',
+                        displayField: 'name',
+                        valueField: 'value',
+                        value: item.value || '',
+                        allowBlank: false,
+                    });
+                    comboxs.push(combox);
+                });
+                paramFieldSet.add(comboxs);
+                if(comboxs.length != 0) {
+                    paramFieldSet.show();
+                }
+                form.doLayout();
             }
         },{
             xtype: 'grid',
@@ -253,52 +107,38 @@ Ext.define('erp.view.desktop.BoardParamWindow',{
                 }
             ],
             listeners: {
-                selectionchange: function(selectModel) {
-                	Ext.getCmp('areaView').setViewModel(selectModel.getSelection().map(function(s) {
-                		return s.get('code');
-                	}));
-                }
+                afterLayout: function(grid) {
+                    grid.getSelectionModel().deselectAll();
+                    grid.selectModel();
+                },
             },
-            loadGridData: function(callbackFunc) {
+            loadGridData: function() {
                 var grid = this;
-                var record = me.record;
-        		var code = record.get('code');
-                Ext.Ajax.request({
-	                url:'kanban/getEnableKanbans/byPanel/' + code,
-	                method:'POST',
-	                callback:function(options, success, response){
-	                    if(response.responseText){
-	                    	var res = Ext.decode(response.responseText);
-                        	if(success) {
-                        		me.relatedKanbans = res;
-                        		grid.getStore().loadData(res);
-                        		
-                        		callbackFunc.call();
-                        	}else {
-                        		Ext.getCmp('desktopDataView').getEl().unmask();
-                        		showErrorMsg('失败', res.message);
-                        	}
-	                    }
-	                }
-                });
+                res = me.resData.relatedKanbans || [];
+                grid.getStore().loadData(res);
+                grid.getStore().sort('enabled', 'DESC');
             },
-            selectModels: function(codes) {
-                var grid = this, allRecords = grid.store.data.items, selectRecords, selectRecord = [],
-                	selectModel = grid.getSelectionModel();
-                for(var i = 0; i < allRecords.length; i++) {
-                	var record = allRecords[i];
-                	if(codes.indexOf(record.get('code')) != -1) {
-                		selectRecord.push(record);
-                	}
+            selectModel: function() {
+                var grid = this;
+                if(!me.resData) {
+                    return;
                 }
-                selectModel.deselectAll()
-                selectModel.select(selectRecord || []);
+                var selectedModels = me.resData.relatedKanbans || [];
+                var modelStore = grid.getStore();
+                var records = [];
+                selectedModels.map(function(model) {
+                    var record = modelStore.findRecord('code',model['code']);
+                    if(record && model.enabled) {
+                        records.push(record);
+                    }
+                });
+                grid.getSelectionModel().select(records || []);
             },
             getSelectedModels: function() {
                 var grid = this;
                 var selectedModels = grid.getSelectionModel().getSelection();
                 return selectedModels || [];
-            }
+            },
         }];
         me.callParent(arguments);
     },
@@ -307,16 +147,21 @@ Ext.define('erp.view.desktop.BoardParamWindow',{
         text:'确定',
         formBind:true,
         handler:function(){
-            var me = Ext.getCmp('template'),
-            	areaView = Ext.getCmp('areaView'),
-                	areaConfig = areaView.getAreaConfig(),
-                	emptyKanbanIndex = [];
-                	
-            if(me.checkAreaConfig(areaConfig)) {
-            	if(Ext.getCmp('areaForm').getForm().findField('viewtype').getValue()=='single') {
-            		me.setFullScreen();
-            	}
-            	me.saveAreaView();
+            var me = Ext.getCmp('template');
+            var formpanel = Ext.getCmp('paramForm');
+            if(formpanel.isValid()) {
+				var modelGrid = Ext.getCmp('modelGrid');
+				if(modelGrid.getSelectedModels().length == 0) {
+					showErrorMsg('警告','请至少选中一个看板!');
+					return;
+				}
+				if(!me.checkFrequency()) {
+					return;
+				}
+				me.setFullScreen();
+                me.savePanelInstance();
+            }else {
+                showErrorMsg('警告', '有必填项未填!');
             }
         }
     },{
@@ -326,73 +171,18 @@ Ext.define('erp.view.desktop.BoardParamWindow',{
         }
     }],
     listeners: {
-        afterrender: function(me) {
+        afterLayout: function(me) {
             me.init();
         }
     },
-    /**
-     * 添加面板参数下拉组件
-     */
-    addParamCombo: function(form, items, areaIndex) {
-    	var me = this;
-        var paramFieldSet = form.items.items[0];
-        paramFieldSet.removeAll();
-        var comboxs = [];
-        Ext.Array.each(items, function(item, index) {
-            var data = item.optionalValues ? item.optionalValues.map(function (v) {
-                return {
-                    value: v,
-                    name: v
-                }
-            }) : []
-            var combox = new Ext.form.field.ComboBox({
-                fieldLabel: item.name,
-                name: item.code,
-                store: Ext.create('Ext.data.Store', {
-                    fields: ['value', 'name'],
-                    data: data
-                }),
-                queryMode: 'local',
-                displayField: 'name',
-                valueField: 'value',
-                value: item.value || '',
-                allowBlank: false,
-                areaIndex: areaIndex,
-                listeners: {
-                	change: function(field) {
-                		if(field.isValid())
-                			me.setViewParameters();
-                	}
-                }
-            });
-            comboxs.push(combox);
-        });
-        if(areaIndex) {
-        	paramFieldSet.setTitle('画面'+areaIndex+'参数设置');
-        }else {
-        	paramFieldSet.setTitle('参数设置');
-        }
-        paramFieldSet.add(comboxs);
-        if(comboxs.length != 0) {
-            paramFieldSet.show();
-        }
-        form.doLayout();
-        form.setDefaultValues(form.getForm().getValues());
-    },
     load: function() {
         var me = this;
-   		
         // 添加参数下拉框
         var paramForm = Ext.getCmp('paramForm');
-        var items = me.parameterItems;
-        me.addParamCombo(paramForm, items, 1);
+        paramForm.addParamCombo();
         // 读取看板grid数据
         var modelGrid = Ext.getCmp('modelGrid');
-        modelGrid.loadGridData(function() {
-	        // 多画面配置
-	        var areaForm = Ext.getCmp('areaForm');
-	        areaForm.loadData();
-        });
+        modelGrid.loadGridData();
     },
     init: function() {
         var me = this;
@@ -403,17 +193,28 @@ Ext.define('erp.view.desktop.BoardParamWindow',{
         view.getEl().mask('loading...');
         if(me.record){
             Ext.Ajax.request({
-                url:'parameter/getParseSQLData/byPanel/'+code,
+                url:'panelInstance/get/byPanel/'+code,
                 method:'POST',
                 callback:function(options, success, response){
+                    view.getEl().unmask();
                     if(response.responseText){
                         var res = Ext.decode(response.responseText);
                         if(success) {
                             var form = Ext.getCmp('paramForm');
-                            me.parameterItems = res;
+                            var formData = {
+                                data: {
+                                    refreshFrequency: res.refreshFrequency,
+                                    switchFrequency: res.refreshFrequency,
+                                },
+                                getData: function() {
+                                    return this.data
+                                }
+                            }
+                            form.loadRecord(formData);
+                            res.parameters = Ext.decode(res.parameters) || [];
+                            me.resData = res;
                             me.load();
                         }else {
-                        	view.getEl().unmask();
                             showErrorMsg('失败', res.message, Ext.getCmp('template'));
                         }
                     }
@@ -421,29 +222,16 @@ Ext.define('erp.view.desktop.BoardParamWindow',{
             });
         }
     },
-	saveAreaView: function() {
-		var me = this,
-			areaForm = Ext.getCmp('areaForm'),
-			areaFormValues = areaForm.getForm().getValues(),
-			areaCode = areaFormValues.viewcode,
-			type = areaCode ? 'update' : 'save',
-			areaView = Ext.getCmp('areaView'),
-			areaConfig = areaView.getAreaConfig();
-        var params = {
-        	panelCode: me.record.get('code'),
-        	panelVersion: me.record.get('version'),
-        	userCode: getCookie('code'),
-        	viewType: areaFormValues.viewtype,
-        	areaCount: areaFormValues.areacount,
-        	areaRows: areaFormValues.arearows,
-        	areaCols: areaFormValues.areacols,
-        	areaConfig: areaConfig
-        };
-        if(type == 'update') {
-        	params.code = areaCode;
-        }
+
+    /**
+     * 生成面板实例后打开展示界面
+     */
+    savePanelInstance: function() {
+        var me = this;
+        
+        var params = me.getBoardConfig();
         Ext.Ajax.request({
-            url:'panelView/' + type + '/',
+            url:'panelInstance/updatePart/',
             method:'POST',
             params:{
                 json:Ext.encode(params)
@@ -451,88 +239,65 @@ Ext.define('erp.view.desktop.BoardParamWindow',{
             callback:function(options,success,response){
                 var res = JSON.parse(response.responseText);
                 if(success) {
-                	var viewData = res;
-                	if(type == 'update') {
-			        	viewData = params;
-			        }else {
-			        	areaForm.getForm().findField('viewcode').setValue(res.code);
-			        }
-                    me.viewBoard(viewData);
+                    me.viewBoard();
                 }else {
                     showErrorMsg('失败', res.message);
                 }
             }
         });
-	},
-    /**
-     * 检查画面配置是否合法
-     */
-    checkAreaConfig: function(areaConfig) {
-    	var me = this,
-        	errorKanbanIndex = [],
-        	errorParamIndex = [],
-        	message = '';
-        	
-        for(var i = 0; i < areaConfig.length; i++) {
-        	var config = areaConfig[i],
-        		viewKanbans = config.viewKanbans;
-        	if(!(viewKanbans instanceof Array) || viewKanbans.length == 0) {
-        		errorKanbanIndex.push(i + 1);
-        	}
+    },
+    getBoardConfig: function() {
+        var me = this;
+        var modelGrid = Ext.getCmp('modelGrid');
+        var selectedModelCodes = modelGrid.getSelectedModels().map(function(model) {
+            return model.get('code');
+        });
+        var relatedKanbans = me.resData.relatedKanbans.map(function(kanban) {
+            kanban.enabled = selectedModelCodes.indexOf(kanban.code) != -1;
+            return kanban;
+        });
+        var paramForm = Ext.getCmp('paramForm');
+        var config = paramForm.getForm().getValues();
+
+        var parameters = me.resData.parameters.map(function(p) {
+            p.value = config[p.code];
+            return p
+        })
+        return {
+            code: me.resData.code,
+            parameters: Ext.encode(parameters),
+            refreshFrequency: config.refreshFrequency,
+            switchFrequency: config.refreshFrequency,
+            relatedKanbans: relatedKanbans
         }
-        if(errorKanbanIndex.length > 0 || errorParamIndex.length > 0) {
-        	message += errorKanbanIndex.length > 0 ? (areaConfig.length == 1 ? '' : ('画面[' + errorKanbanIndex.join() + ']')) + '未勾选看板' : '';
-        	showErrorMsg('错误', message);
-        	return false;
+    },
+    checkFrequency:function(){
+        var me = this;
+        var refreshFreq = Ext.getCmp('refreshFrequency').value;
+        var switchFreq = Ext.getCmp('refreshFrequency').value;
+        if(switchFreq){
+            if(refreshFreq>switchFreq){
+                showErrorMsg('警告','刷新频率必须小于切换频率!');
+                return false;
+            }
         }else {
-        	return true;
+            var modelGrid = Ext.getCmp('modelGrid');
+            // 看板数量为2个以上时切换频率不可为空
+            if(modelGrid.getSelectedModels().length >= 2) {
+                showErrorMsg('警告','切换频率不可为空');
+                return false;
+            }
         }
+        return true;
     },
-    viewBoard:function(viewData){
-        var me = this,
-        	viewType = viewData.viewType;
-        if(viewType == 'single') {
-        	Ext.create('erp.view.desktop.BoardWindow',{
-	        	items: me.createViewPanels(viewData)
-	        }).show();
-        }else if(viewType == 'more') {
-        	var code = viewData.code,
-        		areaConfig = viewData.areaConfig;
-        		
-        	areaConfig.map(function(c, i) {
-        		setTimeout(function() {
-        			window.open(basePath+'boardshow?code='+code+'&index='+i, code+'_'+i);
-        		}, 20);
-        	});
-        }
+    viewBoard:function(){
+        var me = this;
+        // Ext.getCmp('template').close();
+        Ext.create('erp.view.desktop.BoardWindow',{
+            instanceCode:me.resData.code,
+            html:'<iframe src="boardshow?code=' + me.resData.code + '" width="100%" height="100%" style="border:none"></iframe>'
+        }).show();
     },
-    createViewPanels: function(viewData) {
-		var code = viewData.code,
-			rows = viewData.areaRows,
-			cols = viewData.areaCols;
-		
-		//TODO 判断行*列是否=看板数
-		var me = this, panels = [], num = 1;
-		for(var i = 0; i < rows; i++) {
-			for(var j = 0; j < cols; j++) {
-				panels.push({
-					xtype: 'panel',
-					height: 80,
-					columnWidth: 1/cols,
-					bodyCls: 'x-board-view',
-					index: num-1,
-					html: '<iframe src="boardshow?code=' + code + '&index=' + (num-1) + '" width="100%" height="100%" style="border:none"></iframe>',
-					listeners: {
-						viewresize: function(panel, viewHeight) {
-							panel.setHeight(viewHeight / rows);
-						}
-					}
-				});
-				num++;
-			}
-		}
-		return panels;
-	},
     setFullScreen: function () {
         var element = document.documentElement;
         if (element.requestFullscreen) {
@@ -544,17 +309,5 @@ Ext.define('erp.view.desktop.BoardParamWindow',{
         } else if (element.msRequestFullscreen) {
             element.msRequestFullscreen();
         }
-    },
-    setViewParameters: function() {
-    	var areaView = Ext.getCmp('areaView');
-		var values = Ext.getCmp('paramForm').getForm().getValues();
-		areaView.setViewParameters(values);
-    },
-    refreshAreaView: function() {
-    	var form = Ext.getCmp('areaForm');
-    	var values = form.getForm().getValues();
-    	var view = Ext.getCmp('areaView');
-    	
-    	view.createArea(values);
     }
 });