数据网格导入导出

o2web/source/x_component_process_FormDesigner/Module/Datagrid.js

@@ -11,17 +11,17 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 		"style": "default",
 		"propertyPath": "../x_component_process_FormDesigner/Module/Datagrid/datagrid.html"
 	},
-	
+
 	initialize: function(form, options){
 		this.setOptions(options);
-		
+
 		this.path = "../x_component_process_FormDesigner/Module/Datagrid/";
 		this.cssPath = "../x_component_process_FormDesigner/Module/Datagrid/"+this.options.style+"/css.wcss";
 
 		this._loadCss();
 		this.moduleType = "component";
 		this.moduleName = "datagrid";
-		
+
 		this.form = form;
 		this.container = null;
 		this.containerNode = null;
@@ -29,30 +29,30 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 		this.elements = [];
 		this.selectedMultiTds = [];
 	},
-    clearTemplateStyles: function(styles){
-        if (styles){
-            if (styles.styles) this.removeStyles(styles.styles, "styles");
-            if (styles.tableStyles) this.removeStyles(styles.tableStyles, "tableStyles");
-            if (styles.titleStyles) this.removeStyles(styles.titleStyles, "titleStyles");
-            if (styles.contentStyles) this.removeStyles(styles.contentStyles, "contentStyles");
-            if (styles.actionStyles) this.removeStyles(styles.actionStyles, "actionStyles");
-            if (styles.editStyles) this.removeStyles(styles.editStyles, "editStyles");
-            if (styles.amountStyles) this.removeStyles(styles.amountStyles, "amountStyles");
-            if (styles.itemTitleStyles) this.removeStyles(styles.itemTitleStyles, "itemTitleStyles");
-            if (styles.properties) this.removeStyles(styles.properties, "properties");
-        }
-    },
-    setTemplateStyles: function(styles){
-        if (styles.styles) this.copyStyles(styles.styles, "styles");
-        if (styles.tableStyles) this.copyStyles(styles.tableStyles, "tableStyles");
-        if (styles.titleStyles) this.copyStyles(styles.titleStyles, "titleStyles");
-        if (styles.contentStyles) this.copyStyles(styles.contentStyles, "contentStyles");
-        if (styles.actionStyles) this.copyStyles(styles.actionStyles, "actionStyles");
-        if (styles.editStyles) this.copyStyles(styles.editStyles, "editStyles");
-        if (styles.amountStyles) this.copyStyles(styles.amountStyles, "amountStyles");
-        if (styles.itemTitleStyles) this.copyStyles(styles.itemTitleStyles, "itemTitleStyles");
-        if (styles.properties) this.copyStyles(styles.properties, "properties");
-    },
+	clearTemplateStyles: function(styles){
+		if (styles){
+			if (styles.styles) this.removeStyles(styles.styles, "styles");
+			if (styles.tableStyles) this.removeStyles(styles.tableStyles, "tableStyles");
+			if (styles.titleStyles) this.removeStyles(styles.titleStyles, "titleStyles");
+			if (styles.contentStyles) this.removeStyles(styles.contentStyles, "contentStyles");
+			if (styles.actionStyles) this.removeStyles(styles.actionStyles, "actionStyles");
+			if (styles.editStyles) this.removeStyles(styles.editStyles, "editStyles");
+			if (styles.amountStyles) this.removeStyles(styles.amountStyles, "amountStyles");
+			if (styles.itemTitleStyles) this.removeStyles(styles.itemTitleStyles, "itemTitleStyles");
+			if (styles.properties) this.removeStyles(styles.properties, "properties");
+		}
+	},
+	setTemplateStyles: function(styles){
+		if (styles.styles) this.copyStyles(styles.styles, "styles");
+		if (styles.tableStyles) this.copyStyles(styles.tableStyles, "tableStyles");
+		if (styles.titleStyles) this.copyStyles(styles.titleStyles, "titleStyles");
+		if (styles.contentStyles) this.copyStyles(styles.contentStyles, "contentStyles");
+		if (styles.actionStyles) this.copyStyles(styles.actionStyles, "actionStyles");
+		if (styles.editStyles) this.copyStyles(styles.editStyles, "editStyles");
+		if (styles.amountStyles) this.copyStyles(styles.amountStyles, "amountStyles");
+		if (styles.itemTitleStyles) this.copyStyles(styles.itemTitleStyles, "itemTitleStyles");
+		if (styles.properties) this.copyStyles(styles.properties, "properties");
+	},
 	_createMoveNode: function(){
 
 		var tableHTML = "<table border=\"0\" cellpadding=\"0\" cellspacing=\"2\" width=\"100%\" align=\"center\">";
@@ -65,9 +65,9 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 //		this.moveNode = divNode.getFirst(); 
 //		this.moveNode.inject(divNode, "after");
 //		divNode.destroy();
-		
+
 		this.moveNode.setStyles(this.css.moduleNodeMove);
-		
+
 		this._setTableStyle();
 	},
 	_setTableStyle: function(){
@@ -87,7 +87,7 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 	_getContainers: function(){
 
 		var tds = this.node.getElements("td");
-		
+
 		this.form.getTemplateData("Datagrid$Data", function(data){
 			tds.each(function(td){
 				var json = this.form.getDomjson(td);
@@ -110,7 +110,7 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 	_getElements: function(){
 		//this.elements.push(this);
 		var ths = this.node.getElements("th");
-		
+
 		this.form.getTemplateData("Datagrid$Title", function(data){
 			ths.each(function(th){
 				var json = this.form.getDomjson(th);
@@ -130,12 +130,12 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 			}.bind(this));
 		}.bind(this), false);
 	},
-	
+
 	_createNode: function(callback){
 		var module = this;
 		var url = this.path+"datagridCreate.html";
 		MWF.require("MWF.widget.Dialog", function(){
-			var size = $(document.body).getSize();			
+			var size = $(document.body).getSize();
 			var x = size.x/2-180;
 			var y = size.y/2-130;
 
@@ -150,43 +150,43 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 				"height": 260,
 				"url": url,
 				"buttonList": [
-				    {
-				    	"text": MWF.APPFD.LP.button.ok,
-				    	"action": function(){
-				    		module._createTableNode();
-				    		callback();
-				    		this.close();
-				    	}
-				    }
+					{
+						"text": MWF.APPFD.LP.button.ok,
+						"action": function(){
+							module._createTableNode();
+							callback();
+							this.close();
+						}
+					}
 				]
 			});
-			
+
 			dlg.show();
 		}.bind(this));
 	},
 	_createTableNode: function(){
 		var cols = $("MWFNewTableColumn").get("value");
-		
+
 		var width = $("MWFNewTableWidth").get("value");
 		var widthUnitNode = $("MWFNewTableWidthUnit");
 		var widthUnit = widthUnitNode.options[widthUnitNode.selectedIndex].value;
-		
+
 		var border = $("MWFNewTableBorder").get("value");
 		var cellpadding = $("MWFNewTableCellpadding").get("value");
 		var cellspacing = $("MWFNewTableCellspacing").get("value");
-		
+
 		var w = "";
 		if (widthUnit=="percent"){
 			w = width+"%";
 		}else{
 			w = width+"px";
 		}
-		
+
 		this.json.properties.width = w;
 		this.json.properties.border = border;
 		this.json.properties.cellpadding = cellpadding;
 		this.json.properties.cellspacing = cellspacing;
-		
+
 		var tableHTML = "<table border=\""+border+"\" cellpadding=\""+cellpadding+"\" cellspacing=\""+cellspacing+"\" width=\""+w+"\" align=\"center\">";
 		tableHTML += "<tr>";
 		for (var j=0; j<cols.toInt(); j++){
@@ -198,7 +198,7 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 			tableHTML += "<td></td>";
 		}
 		tableHTML += "</tr></table>";
-		
+
 		this.node = new Element("div", {
 			"id": this.json.id,
 			"MWFType": "datagrid",
@@ -211,13 +211,13 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 			}
 		}).inject(this.form.node);
 
-        this.table = this.node.getElement("table");
+		this.table = this.node.getElement("table");
 	},
 	_dragComplete: function(){
 		if (!this.node){
 			this._createNode(function(){
 				this._dragMoveComplete();
-			}.bind(this)); 
+			}.bind(this));
 		}else{
 			this._dragMoveComplete();
 		}
@@ -225,14 +225,14 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 	_dragMoveComplete: function(){
 		this._resetTreeNode();
 		this.node.inject(this.copyNode, "before");
-		
+
 		this._initModule();
-		
+
 		var thisDisplay = this.node.retrieve("thisDisplay");
 		if (thisDisplay){
 			this.node.setStyle("display", thisDisplay);
 		}
-		
+
 		if (this.copyNode) this.copyNode.destroy();
 		if (this.moveNode) this.moveNode.destroy();
 		this.moveNode = null;
@@ -243,9 +243,9 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 		this.form.json.moduleList[this.json.id] = this.json;
 		this.selected();
 	},
-	
+
 	_initModule: function(){
-        if (!this.initialized){
+		if (!this.initialized){
 			if (this.json.initialized!=="yes")this.setStyleTemplate();
 
 			this.table = this.node.getElement("table");
@@ -259,12 +259,14 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 			this._setNodeProperty();
 			if (!this.form.isSubform) this._createIconAction();
 
-	   //     this.checkSequenceShow();
+			//     this.checkSequenceShow();
 
 			this._setNodeEvent();
 
 			this.setDatagridStyles();
 
+			this._setEditStyle_custom("impexpType");
+
 			this.initialized = true;
 			this.json.initialized = "yes";
 		}
@@ -282,15 +284,15 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 				}
 			}.bind(this));
 		}
-        if (name=="tableStyles"){
-            this.table.clearStyles();
-            Object.each(this.json.tableStyles, function(value, key){
-                var reg = /^border\w*/ig;
-                if (!key.test(reg)){
-                    this.table.setStyle(key, value);
-                }
-            }.bind(this));
-        }
+		if (name=="tableStyles"){
+			this.table.clearStyles();
+			Object.each(this.json.tableStyles, function(value, key){
+				var reg = /^border\w*/ig;
+				if (!key.test(reg)){
+					this.table.setStyle(key, value);
+				}
+			}.bind(this));
+		}
 
 		if (name=="properties"){
 			this.node.getFirst().setProperties(this.json.properties);
@@ -304,7 +306,7 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 					var id = container.json.id;
 					var newId = id.replace(reg, this.json.id);
 					container.json.id = newId;
-					
+
 					delete this.form.json.moduleList[id];
 					this.form.json.moduleList[newId] = container.json;
 					container._setEditStyle("id");
@@ -312,48 +314,88 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 			}
 		}
 
-        if (name=="titleStyles"){
-            var ths = this.table.getElements("th");
-            ths.each(function(th){
-            	var opacity = th.getStyle("opacity");
-                this.setCustomNodeStyles(th, this.json.titleStyles);
-                if(opacity)th.setStyle("opacity", opacity);
-            }.bind(this));
-        }
-        if (name=="contentStyles"){
-            var tds = this.table.getElements("td");
-            tds.each(function(td){
+		if (name=="titleStyles"){
+			var ths = this.table.getElements("th");
+			ths.each(function(th){
+				var opacity = th.getStyle("opacity");
+				this.setCustomNodeStyles(th, this.json.titleStyles);
+				if(opacity)th.setStyle("opacity", opacity);
+			}.bind(this));
+		}
+		if (name=="contentStyles"){
+			var tds = this.table.getElements("td");
+			tds.each(function(td){
 				var opacity = td.getStyle("opacity");
-                this.setCustomNodeStyles(td, this.json.contentStyles);
+				this.setCustomNodeStyles(td, this.json.contentStyles);
 				if(opacity)td.setStyle("opacity", opacity);
-            }.bind(this));
-        }
-        if( ["impexpType","impexpPosition","importActionText","importActionStyles","exportActionText","exportActionStyles"].contains( name ) ){
+			}.bind(this));
+		}
+
+		var setImportExportAreaNodeWidth = function () {
+
+			if( ["centerTop","centerBottom"].contains( this.json.impexpPosition ) ){
+
+				var width = 2;
+
+				if( this.exportActionNode ){
+					width = width + this.exportActionNode.getSize().x +
+						this.exportActionNode.getStyle("padding-left").toFloat() +
+						+ this.exportActionNode.getStyle("padding-right").toFloat() +
+						+ this.exportActionNode.getStyle("margin-left").toFloat() +
+						+ this.exportActionNode.getStyle("margin-right").toFloat()
+				}
+
+				if( this.importActionNode ){
+					width = width + this.importActionNode.getSize().x +
+						this.importActionNode.getStyle("padding-left").toFloat() +
+						+ this.importActionNode.getStyle("padding-right").toFloat() +
+						+ this.importActionNode.getStyle("margin-left").toFloat() +
+						+ this.importActionNode.getStyle("margin-right").toFloat()
+				}
+
+				this.importExportAreaNode.setStyle( "width", width+"px" );
+			}else{
+				this.importExportAreaNode.setStyle( "width", "auto" );
+			}
+
+		}.bind(this);
+
+		if( name === "impexpType" ){
+			debugger;
 			//允许导入
 			var importenable  = this.json.impexpType === "impexp" || this.json.impexpType === "imp";
 			//允许导出
 			var exportenable  = this.json.impexpType === "impexp" || this.json.impexpType === "exp";
 
+			if( this.impexpNode )this.impexpNode.destroy();
+			this.impexpNode = null;
+
+			this.impexpNode = this.node.getElement("div.impexpNode");
+			if( this.impexpNode )this.impexpNode.destroy();
+			this.impexpNode = null;
+
 			if( !exportenable && !importenable ){
-				if( this.impexpNode )this.impexpNode.destroy();
 				return;
 			}
 
+
 			var position = ["leftTop","centerTop","rightTop"].contains( this.json.impexpPosition || "" ) ? "top" : "bottom";
-			this.impexpNode = new Element("div").inject(this.node, position);
+			this.impexpNode = new Element("div.impexpNode", { styles : { "width" : "100%", "overflow" : "hidden" } }).inject(this.node, position);
 
-			var importExportAreaNode = new Element("div").inject( this.impexpNode );
+			var importExportAreaNode = new Element("div.importExportAreaNode").inject( this.impexpNode );
 			if( ["leftTop","leftBottom"].contains( this.json.impexpPosition || "" ) ){
-				importExportAreaNode.setStyles({ "float" : "left" })
+				importExportAreaNode.setStyles({ "float" : "left", "margin" : "0px" })
 			}else if( ["rightTop","rightBottom"].contains( this.json.impexpPosition || "" ) ){
-				importExportAreaNode.setStyles({ "float" : "right" })
+				importExportAreaNode.setStyles({ "float" : "right", "margin" : "0px" })
 			}else{
-				importExportAreaNode.setStyles({ "margin" : "0px auto" })
+				importExportAreaNode.setStyles({ "float" : "none", "margin" : "0px auto" })
 			}
+			this.importExportAreaNode = importExportAreaNode;
 
 			var styles;
+			var width = 0;
 			if( exportenable ){
-				var exportActionNode = new Element("div", { text : this.json.exportActionText }).inject( importExportAreaNode );
+				var exportActionNode = new Element("div.exportActionStyles", { text : this.json.exportActionText }).inject( importExportAreaNode );
 				if( this.json.exportActionStyles ){
 					styles = Object.clone(this.json.exportActionStyles)
 				}else{
@@ -371,10 +413,11 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 					}
 				}
 				exportActionNode.setStyles(styles);
+				this.exportActionNode = exportActionNode;
 			}
 
 			if( importenable ){
-				var importActionNode = new Element("div", { text : this.json.importActionText }).inject( importExportAreaNode );
+				var importActionNode = new Element("div.importActionNode", { text : this.json.importActionText }).inject( importExportAreaNode );
 				if( this.json.importActionStyles ){
 					styles = Object.clone(this.json.importActionStyles);
 				}else{
@@ -392,86 +435,126 @@ MWF.xApplication.process.FormDesigner.Module.Datagrid = MWF.FCDatagrid = new Cla
 					}
 				}
 				importActionNode.setStyles(styles);
+				this.importActionNode = importActionNode;
+			}
+
+			setImportExportAreaNodeWidth();
+		}
+
+		if( name === "impexpPosition" && this.impexpNode && this.importExportAreaNode ){
+			var position = ["leftTop","centerTop","rightTop"].contains( this.json.impexpPosition || "" ) ? "top" : "bottom";
+			this.impexpNode.inject(this.node, position);
+
+			var importExportAreaNode = this.importExportAreaNode;
+			if( ["leftTop","leftBottom"].contains( this.json.impexpPosition || "" ) ){
+				importExportAreaNode.setStyles({ "float" : "left", "margin" : "0px" })
+			}else if( ["rightTop","rightBottom"].contains( this.json.impexpPosition || "" ) ){
+				importExportAreaNode.setStyles({ "float" : "right", "margin" : "0px" })
+			}else{
+				importExportAreaNode.setStyles({ "float" : "none", "margin" : "0px auto" })
 			}
+			setImportExportAreaNodeWidth();
 		}
-        //if (name=="sequence") this.checkSequenceShow();
+
+		if( name === "importActionText" &&  this.importActionNode ){
+			this.importActionNode.set("text", this.json.importActionText );
+			setImportExportAreaNodeWidth();
+		}
+
+		if( name === "exportActionText" &&  this.exportActionNode ){
+			this.exportActionNode.set("text", this.json.exportActionText );
+			setImportExportAreaNodeWidth();
+		}
+
+		if( name === "importActionStyles" &&  this.importActionNode ){
+			this.importActionNode.setStyles( this.json.importActionStyles || {} );
+			setImportExportAreaNodeWidth();
+		}
+
+		if( name === "exportActionStyles" &&  this.exportActionNode ){
+			this.exportActionNode.setStyles( this.json.exportActionStyles || {} );
+			setImportExportAreaNodeWidth();
+		}
+
+
+		//if (name=="sequence") this.checkSequenceShow();
 	},
-    setDatagridStyles: function(){
-        if (this.json.titleStyles){
-            var ths = this.table.getElements("th");
-            ths.each(function(th){
+	setDatagridStyles: function(){
+		if (this.json.titleStyles){
+			var ths = this.table.getElements("th");
+			ths.each(function(th){
 				var opacity = th.getStyle("opacity");
-                this.setCustomNodeStyles(th, this.json.titleStyles);
+				this.setCustomNodeStyles(th, this.json.titleStyles);
 				if(opacity)th.setStyle("opacity", opacity);
-            }.bind(this));
-        }
-        if (this.json.contentStyles){
-            var tds = this.table.getElements("td");
-            tds.each(function(td){
+			}.bind(this));
+		}
+		if (this.json.contentStyles){
+			var tds = this.table.getElements("td");
+			tds.each(function(td){
 				var opacity = td.getStyle("opacity");
-                this.setCustomNodeStyles(td, this.json.contentStyles);
+				this.setCustomNodeStyles(td, this.json.contentStyles);
 				if(opacity)td.setStyle("opacity", opacity);
-            }.bind(this));
-        }
-    },
-    setAllStyles: function(){
-        this.setPropertiesOrStyles("styles");
-        this.setPropertiesOrStyles("tableStyles");
-        this.setPropertiesOrStyles("properties");
-
-        this.setDatagridStyles();
-
-        this.reloadMaplist();
-    },
-
-    //checkSequenceShow: function(){
-    //    if (this.json.sequence=="yes"){
-    //        if (!this.sequenceTitleTd || !this.sequenceTd){
-    //            if (this.sequenceTitleTd){
-    //                this.sequenceTitleTd.destroy();
-    //                this.sequenceTitleTd = null;
-    //            }
-    //            if (this.sequenceTd){
-    //                this.sequenceTd.destroy();
-    //                this.sequenceTd = null;
-    //            }
-    //            var trs = this.node.getElements("tr");
-    //            if (trs[0]){
-    //                this.sequenceTitleTd = new Element("th", {"styles": this.css.sequenceTitleTd}).inject(trs[0], "top");
-    //            }
-    //            if (trs[1]){
-    //                this.sequenceTd = new Element("td", {"styles": this.css.sequenceTd, "text": "1"}).inject(trs[1], "top");
-    //            }
-    //        }
-    //    }else{
-    //        if (this.sequenceTitleTd){
-    //            this.sequenceTitleTd.destroy();
-    //            this.sequenceTitleTd = null;
-    //        }
-    //        if (this.sequenceTd){
-    //            this.sequenceTd.destroy();
-    //            this.sequenceTd = null;
-    //        }
-    //    }
-    //},
+			}.bind(this));
+		}
+	},
+	setAllStyles: function(){
+		this.setPropertiesOrStyles("styles");
+		this.setPropertiesOrStyles("tableStyles");
+		this.setPropertiesOrStyles("properties");
+
+		this.setDatagridStyles();
+
+		this.reloadMaplist();
+	},
+
+	//checkSequenceShow: function(){
+	//    if (this.json.sequence=="yes"){
+	//        if (!this.sequenceTitleTd || !this.sequenceTd){
+	//            if (this.sequenceTitleTd){
+	//                this.sequenceTitleTd.destroy();
+	//                this.sequenceTitleTd = null;
+	//            }
+	//            if (this.sequenceTd){
+	//                this.sequenceTd.destroy();
+	//                this.sequenceTd = null;
+	//            }
+	//            var trs = this.node.getElements("tr");
+	//            if (trs[0]){
+	//                this.sequenceTitleTd = new Element("th", {"styles": this.css.sequenceTitleTd}).inject(trs[0], "top");
+	//            }
+	//            if (trs[1]){
+	//                this.sequenceTd = new Element("td", {"styles": this.css.sequenceTd, "text": "1"}).inject(trs[1], "top");
+	//            }
+	//        }
+	//    }else{
+	//        if (this.sequenceTitleTd){
+	//            this.sequenceTitleTd.destroy();
+	//            this.sequenceTitleTd = null;
+	//        }
+	//        if (this.sequenceTd){
+	//            this.sequenceTd.destroy();
+	//            this.sequenceTd = null;
+	//        }
+	//    }
+	//},
 	getContainerNodes: function(){
 		return this.node.getElements("td");
 	},
-    copyComponentJsonData: function(newNode, pid){
-        var tds = newNode.getElements("td");
-        var ths = newNode.getElements("th");
-        tds.each(function(td, idx){
-            var newContainerJson = Object.clone(this.containers[idx].json);
-            newContainerJson.id = this.containers[idx]._getNewId(pid);
-            this.form.json.moduleList[newContainerJson.id] = newContainerJson;
-            td.set("id", newContainerJson.id);
-        }.bind(this));
-        ths.each(function(th, idx){
-            var newElementJson = Object.clone(this.elements[idx].json);
-            newElementJson.id = this.elements[idx]._getNewId(pid);
-            this.form.json.moduleList[newElementJson.id] = newElementJson;
-            th.set("id", newElementJson.id);
-        }.bind(this));
-    }
-	
+	copyComponentJsonData: function(newNode, pid){
+		var tds = newNode.getElements("td");
+		var ths = newNode.getElements("th");
+		tds.each(function(td, idx){
+			var newContainerJson = Object.clone(this.containers[idx].json);
+			newContainerJson.id = this.containers[idx]._getNewId(pid);
+			this.form.json.moduleList[newContainerJson.id] = newContainerJson;
+			td.set("id", newContainerJson.id);
+		}.bind(this));
+		ths.each(function(th, idx){
+			var newElementJson = Object.clone(this.elements[idx].json);
+			newElementJson.id = this.elements[idx]._getNewId(pid);
+			this.form.json.moduleList[newElementJson.id] = newElementJson;
+			th.set("id", newElementJson.id);
+		}.bind(this));
+	}
+
 });

o2web/source/x_component_process_FormDesigner/Module/Datagrid/template.json

@@ -6,6 +6,8 @@
     "sequence": "yes",
     "section": "no",
     "sectionBy": "person",
+	"importActionText" : "导入Excel",
+	"exportActionText" : "导出Excel",
     "sectionByScript": {
       "code": "",
       "html": ""

o2web/source/x_component_process_Xform/DatagridPC.js

@@ -1059,6 +1059,10 @@ MWF.xApplication.process.Xform.DatagridPC = new Class(
 
 	_loadImportExportAction: function(){
 		debugger;
+		this.impexpNode = this.node.getElement("div.impexpNode");
+		if( this.impexpNode )this.impexpNode.destroy();
+		this.impexpNode = null;
+
 		if( !this.exportenable && !this.importenable )return;
 
 		var position = ["leftTop","centerTop","rightTop"].contains( this.json.impexpPosition || "" ) ? "top" : "bottom";
@@ -1077,9 +1081,11 @@ MWF.xApplication.process.Xform.DatagridPC = new Class(
 			this.exportActionNode = new Element("div", {
 				text : this.json.exportActionText || MWF.xApplication.process.Xform.LP.datagridExport
 			}).inject(this.importExportAreaNode);
-			var styles = this.form.css.gridExportActionStyles;
+			var styles;
 			if( this.json.exportActionStyles ){
-				styles = Object.merge( Object.clone(styles), this.json.exportActionStyles )
+				styles = this.json.exportActionStyles
+			}else{
+				styles = this.form.css.gridExportActionStyles;
 			}
 			this.exportActionNode.setStyles(styles);
 
@@ -1092,9 +1098,11 @@ MWF.xApplication.process.Xform.DatagridPC = new Class(
 			this.importActionNode = new Element("div", {
 				text : this.json.importActionText || MWF.xApplication.process.Xform.LP.datagridImport
 			}).inject(this.importExportAreaNode);
-			var styles = this.form.css.gridImportActionStyles;
+			var styles;
 			if( this.json.importActionStyles ){
-				styles = Object.merge( Object.clone(styles), this.json.importActionStyles )
+				styles = this.json.importActionStyles;
+			}else{
+				styles = this.form.css.gridImportActionStyles;
 			}
 			this.importActionNode.setStyles(styles);
 
@@ -1102,6 +1110,28 @@ MWF.xApplication.process.Xform.DatagridPC = new Class(
 				this.importFromExcel();
 			}.bind(this))
 		}
+
+		if( ["centerTop","centerBottom"].contains( this.json.impexpPosition ) ){
+			var width = 2;
+
+			if( this.exportActionNode ){
+				width = width + this.exportActionNode.getSize().x +
+					this.exportActionNode.getStyle("padding-left").toFloat() +
+					+ this.exportActionNode.getStyle("padding-right").toFloat() +
+					+ this.exportActionNode.getStyle("margin-left").toFloat() +
+					+ this.exportActionNode.getStyle("margin-right").toFloat()
+			}
+
+			if( this.importActionNode ){
+				width = width + this.importActionNode.getSize().x +
+					this.importActionNode.getStyle("padding-left").toFloat() +
+					+ this.importActionNode.getStyle("padding-right").toFloat() +
+					+ this.importActionNode.getStyle("margin-left").toFloat() +
+					+ this.importActionNode.getStyle("margin-right").toFloat()
+			}
+
+			this.importExportAreaNode.setStyle( "width", width+"px" );
+		}
 	},
 
 	_loadDatagridStyle: function(){
@@ -1729,9 +1759,6 @@ MWF.xApplication.process.Xform.DatagridPC = new Class(
 						}
 					}
 
-
-
-
 					var thJson = this.form._getDomjson( th );
 					if (index==0){
 					}else if (index == titleThs.length-1){
@@ -1770,10 +1797,70 @@ MWF.xApplication.process.Xform.DatagridPC = new Class(
 
 		this.fireEvent("export", [resultArr]);
 
-		new MWF.xApplication.process.Xform.DatagridPC.ExcelUtils().export( resultArr, title );
+		new MWF.xApplication.process.Xform.DatagridPC.ExcelUtils( this ).export( resultArr, title );
 	},
 	importFromExcel : function () {
 
+		var textMap = {};
+
+		var dateColArray = []; //日期列
+		var titleThs = this.titleTr.getElements("th");
+
+		var idx = 0;
+		titleThs.each(function(th, index){
+			if (index===0){
+			}else if (index === titleThs.length-1){
+			}else{
+				var module = this.editModules[index-1];
+				var thJson = this.form._getDomjson( th );
+				if( thJson && thJson.isShow === false ){
+				}else if( module && module.json.type === "ImageClipper" ){
+				}else if( module && (module.json.type === "Attachment" || module.json.type === "AttachmentDg") ){
+				}else {
+					textMap[th.get("text")] = {
+						index: idx,
+						thJson: thJson,
+						module: module
+					};
+					idx++;
+					if (module && module.json.type === "Calendar") dateColArray.push(index + 1);
+				}
+			}
+		}.bind(this));
+
+		new MWF.xApplication.process.Xform.DatagridPC.ExcelUtils( this ).upload( dateColArray, function (array) {
+			array.each( function(d, index){
+				var obj = textMap[d];
+				var module = obj.module;
+				var thJson = obj.thJson;
+
+				switch (module.json.type) {
+					case "Org":
+					case "Reader":
+					case "Author":
+						var arr = d.split(/\s*,\s*/g ); //空格,空格
+						break;
+					case "Number":
+						if (parseFloat(d).toString() === "NaN")errorText = "值不是数字";
+						break;
+					case "Calendar":
+						if( !( isNaN(d) && !isNaN(Date.parse(d) )))errorText = "值不是日期格式";
+						break;
+					default:
+						break;
+				}
+				if (module.json.type!="sequence"){
+					module.setData();
+					module.validationMode();
+					if (!module.validation()){
+						var errorText = module.errNode.get("text");
+						module.errNode.destroy();
+					}
+				}
+
+
+			})
+		});
 	}
 
 });
@@ -1840,7 +1927,9 @@ MWF.xApplication.process.Xform.DatagridPC$Data =  new Class({
 });
 
 MWF.xApplication.process.Xform.DatagridPC.ExcelUtils = new Class({
-	initialize: function(){
+	initialize: function( datagrid ){
+		this.datagrid = datagrid;
+		this.form = datagrid.form;
 		if (!FileReader.prototype.readAsBinaryString) {
 			FileReader.prototype.readAsBinaryString = function (fileData) {
 				var binary = "";
@@ -1862,8 +1951,8 @@ MWF.xApplication.process.Xform.DatagridPC.ExcelUtils = new Class({
 	},
 	_loadResource : function( callback ){
 		if( !window.XLSX || !window.xlsxUtils ){
-			var uri = "/x_component_Template/framework/xlsx/xlsx.full.js";
-			var uri2 = "/x_component_Template/framework/xlsx/xlsxUtils.js";
+			var uri = "../x_component_Template/framework/xlsx/xlsx.full.js";
+			var uri2 = "../x_component_Template/framework/xlsx/xlsxUtils.js";
 			COMMON.AjaxModule.load(uri, function(){
 				COMMON.AjaxModule.load(uri2, function(){
 					callback();
@@ -1899,14 +1988,35 @@ MWF.xApplication.process.Xform.DatagridPC.ExcelUtils = new Class({
 		}
 	},
 
-	upload : function ( dateColArray ) {
+	index2ColName : function( index ){
+		if (index < 0) {
+			return null;
+		}
+		var num = 65;// A的Unicode码
+		var colName = "";
+		do {
+			if (colName.length() > 0)index--;
+			var remainder = index % 26;
+			colName =  String.fromCharCode(remainder + num) + colName;
+			index = (index - remainder) / 26;
+		} while (index > 0);
+		return colName;
+	},
+
+	upload : function ( dateColIndexArray, callback ) {
+		var dateColArray = [];
+		dateColIndexArray.each( function (idx) {
+			dateColArray.push( this.index2ColName( idx ));
+		})
+
+
 		var uploadFileAreaNode = new Element("div");
 		var html = "<input name=\"file\" type=\"file\" accept=\"csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel\" />";
 		uploadFileAreaNode.set("html", html);
 
 		var fileUploadNode = uploadFileAreaNode.getFirst();
 		fileUploadNode.addEvent("change", function () {
-			var files = fileNode.files;
+			var files = fileUploadNode.files;
 			if (files.length) {
 				var file = files.item(0);
 				if( file.name.indexOf(" ") > -1 ){
@@ -1917,10 +2027,8 @@ MWF.xApplication.process.Xform.DatagridPC.ExcelUtils = new Class({
 				//第三个参数是日期的列
 				this.import( file, function(json){
 					//json为导入的结果
-					// this.page.get("div_1").node.set("html", JSON.stringify(json) )
-
+					if(callback)callback(json);
 					uploadFileAreaNode.destroy();
-
 				}.bind(this), dateColArray ); //["E","F"]
 
 			}
@@ -1988,15 +2096,26 @@ MWF.xApplication.process.Xform.DatagridPC.ExcelUtils = new Class({
 					debugger;
 					var worksheet = workbook.Sheets[sheet];
 
-					if( dateColArray && typeOf(dateColArray) == "array" ){
-						var rowCount = worksheet['!range'].e.r;
-						for( var i=0; i<dateColArray.length; i++ ){
-							for( var j=1; j<=rowCount; j++ ){
-								var cell = worksheet[ dateColArray[i]+j ];
-								if( cell ){
-									delete cell.w; // remove old formatted text
-									cell.z = 'yyyy-mm-dd'; // set cell format
-									window.XLSX.utils.format_cell(cell); // this refreshes the formatted text.
+					if( dateColArray && typeOf(dateColArray) == "array" && dateColArray.length ){
+						var rowCount;
+						if( worksheet['!range'] ){
+							rowCount = worksheet['!range'].e.r;
+						}else{
+							var ref = worksheet['!ref'];
+							var arr = ref.split(":");
+							if(arr.length === 2){
+								rowCount = parseInt( arr[1].replace(/[^0-9]/ig,"") );
+							}
+						}
+						if( rowCount ){
+							for( var i=0; i<dateColArray.length; i++ ){
+								for( var j=1; j<=rowCount; j++ ){
+									var cell = worksheet[ dateColArray[i]+j ];
+									if( cell ){
+										delete cell.w; // remove old formatted text
+										cell.z = 'yyyy-mm-dd'; // set cell format
+										window.XLSX.utils.format_cell(cell); // this refreshes the formatted text.
+									}
 								}
 							}
 						}