Merge branch 'feature/datagird_excel' into 'wrdp'

Merge of feature/datagird_excel 数据网格导入导出 to wrdp

See merge request o2oa/o2oa!3000

o2web/source/x_component_process_FormDesigner/Module/Datagrid$Title/datagrid$Title.html

@@ -28,6 +28,13 @@
                     <input class="editTableRadio" name="isShow" text{($.isShow==false)?'checked':''} type="radio" value="false"/>隐藏该列 <br/>
                 </td>
             </tr>
+            <tr>
+                <td class="editTableTitle">导入导出:</td>
+                <td class="editTableValue">
+                    <input class="editTableRadio" name="isImpExp" text{($.isImpExp!==false)?'checked':''} type="radio" value="true"/>允许 <br/>
+                    <input class="editTableRadio" name="isImpExp" text{($.isImpExp==false)?'checked':''} type="radio" value="false"/>不允许 <br/>
+                </td>
+            </tr>
         </table>
 
         <div class="MWFMaplist" name="styles" title="样式"></div>

o2web/source/x_component_process_FormDesigner/Module/Datagrid/datagrid.html

@@ -60,6 +60,57 @@
         </table>
         <div class="MWFScriptArea" name="editableScript" title="是否可编辑(S)"></div>
 
+        <div style="height:24px; text-align: center; line-height: 24px; background-color: #EEE; border-top: 1px solid #999;">导出导入</div>
+        <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+            <tr>
+                <td class="editTableTitle">启用:</td>
+                <td class="editTableValue">
+                    <input type="radio" name="impexpType" value="none" text{(!$.impexpType || $.impexpType==='none')?'checked':''}
+                           onclick="if (this.checked){ $('text{$.pid}impexpArea').setStyle('display', 'none')}" />禁用
+                    <input type="radio" name="impexpType" value="impexp" text{($.impexpType==='impexp')?'checked':''}
+                           onclick="if (this.checked){ $('text{$.pid}impexpArea').setStyle('display', 'block')}" />导出导入
+                    <input type="radio" name="impexpType" value="exp" text{($.impexpType==='exp')?'checked':''}
+                           onclick="if (this.checked){ $('text{$.pid}impexpArea').setStyle('display', 'block')}" />仅导出
+                    <input type="radio" name="impexpType" value="imp" text{($.impexpType==='imp')?'checked':''}
+                           onclick="if (this.checked){ $('text{$.pid}impexpArea').setStyle('display', 'block')}" />仅导入
+                </td>
+            </tr>
+        </table>
+        <div id="text{$.pid}impexpArea" style="display: text{($.impexpType && $.impexpType!=='none')?'block':'none'};">
+            <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+                <tr>
+                    <td class="editTableTitle"></td>
+                    <td class="editTableValue">
+                        注：序号、图片、附件和隐藏列不能导入导出。
+                    </td>
+                </tr>
+                <tr>
+                    <td class="editTableTitle">按钮位置:</td>
+                    <td class="editTableValue">
+                        <input type="radio" name="impexpPosition" value="leftTop" text{(!$.impexpPosition || $.impexpPosition==='leftTop')?'checked':''}/>左上
+                        <input type="radio" name="impexpPosition" value="centerTop" text{($.impexpPosition==='centerTop')?'checked':''}/>中上
+                        <input type="radio" name="impexpPosition" value="rightTop" text{($.impexpPosition==='rightTop')?'checked':''}/>右上
+                        <input type="radio" name="impexpPosition" value="leftBottom" text{($.impexpPosition==='leftBottom')?'checked':''}/>左下
+                        <input type="radio" name="impexpPosition" value="centerBottom" text{($.impexpPosition==='centerBottom')?'checked':''}/>中下
+                        <input type="radio" name="impexpPosition" value="rightBottom" text{($.impexpPosition==='rightBottom')?'checked':''}/>右下
+                    </td>
+                </tr>
+                <tr>
+                    <td class="editTableTitle">导入按钮文本:</td>
+                    <td class="editTableValue"><input type="text" name="importActionText" value="text{$.importActionText || '导入Excel'}" class="editTableInput"/></td>
+                </tr>
+            </table>
+            <div class="MWFMaplist" name="importActionStyles" collapse="true" title="导入按钮样式"></div>
+            <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+                <tr>
+                    <td class="editTableTitle">导出按钮文本:</td>
+                    <td class="editTableValue"><input type="text" name="exportActionText" value="text{$.exportActionText || '导出Excel'}" class="editTableInput"/></td>
+                </tr>
+            </table>
+            <div class="MWFMaplist" name="exportActionStyles" collapse="true" title="导出按钮样式"></div>
+            <div class="MWFFormulaArea" name="excelName" title="导出文件名称"></div>
+        </div>
+
         <div class="MWFValidation" name="validationConfig"></div>
         <div class="MWFScriptArea" name="validation" title="校验脚本 (S)"></div>
     </div>

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": ""
@@ -51,6 +53,14 @@
 		  "code": "",
 		  "html": ""
 		},
+		"export": {
+			"code": "",
+			"html": ""
+		},
+		"import": {
+			"code": "",
+			"html": ""
+		},
 		"click": {
 			"code": "",
 			"html": ""

o2web/source/x_component_process_FormDesigner/Module/Form/skin/styles_blue-flat.json

@@ -269,6 +269,30 @@
       "font-weight": "bold",
       "border-bottom": "0px solid #DCDFE6"
     },
+    "importActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
+    "exportActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
     "properties": {
       "border": "0",
       "cellpadding": "3",

o2web/source/x_component_process_FormDesigner/Module/Form/skin/styles_blue-simple.json

@@ -244,6 +244,30 @@
       "font-weight": "bold",
       "border-bottom": "0px solid #cccccc"
     },
+    "importActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
+    "exportActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
     "properties": {
       "border": "0",
       "cellpadding": "3",

o2web/source/x_component_process_FormDesigner/Module/Form/skin/styles_cmcc.json

@@ -252,6 +252,30 @@
       "font-weight": "bold",
       "border-bottom": "0px solid #cccccc"
     },
+    "importActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
+    "exportActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
     "properties": {
       "border": "0",
       "cellpadding": "3",

o2web/source/x_component_process_FormDesigner/Module/Form/skin/styles_default.json

@@ -249,6 +249,30 @@
       "font-weight": "bold",
       "border-bottom": "0px solid #cccccc"
     },
+    "importActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
+    "exportActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
     "properties": {
       "width": "100%",
       "border": "0",

o2web/source/x_component_process_FormDesigner/Module/Form/skin/styles_defaultMobile.json

@@ -232,6 +232,30 @@
       "font-weight": "bold",
       "border-bottom": "0px solid #cccccc"
     },
+    "importActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
+    "exportActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
     "properties": {
       "border": "0",
       "cellpadding": "5",

o2web/source/x_component_process_FormDesigner/Module/Form/skin/styles_mobile-blue-flat.json

@@ -302,6 +302,30 @@
       "margin-bottom" : "10px",
       "margin-top" : "10px"
     },
+    "importActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
+    "exportActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
     "properties": {
       "width": "100%",
       "border": "0",

o2web/source/x_component_process_FormDesigner/Module/Form/skin/styles_none.json

@@ -126,6 +126,8 @@
     "editStyles": {},
     "amountStyles": {},
     "itemTitleStyles": {},
+    "importActionStyles" : {},
+    "exportActionStyles" : {},
     "properties": {}
   },
   "datagrid$Title": {

o2web/source/x_component_process_FormDesigner/Module/Form/skin/styles_official.json

@@ -264,6 +264,30 @@
       "font-weight": "bold",
       "border-bottom": "0px solid #cccccc"
     },
+    "importActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
+    "exportActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
     "properties": {
       "width": "90%",
       "border": "0",

o2web/source/x_component_process_FormDesigner/Module/Form/skin/styles_red-simple.json

@@ -244,6 +244,30 @@
       "font-weight": "bold",
       "border-bottom": "0px solid #cccccc"
     },
+    "importActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
+    "exportActionStyles" : {
+      "color" : "#777",
+      "border-radius": "5px",
+      "border": "1px solid #ccc",
+      "cursor": "pointer",
+      "height": "26px",
+      "float" : "left",
+      "line-height": "26px",
+      "padding": "0px 5px",
+      "background-color": "#efefef",
+      "margin" : "5px"
+    },
     "properties": {
       "width": "90%",
       "border": "0",

o2web/source/x_component_process_FormDesigner/lp/zh-cn.js

@@ -140,6 +140,12 @@ MWF.xApplication.process.FormDesigner.LP = {
             "delete_title": "删除校验内容确认",
             "delete_text": "您确定要删除此项校验码？"
         },
+
+    "datagrid" : {
+		"import" : "导入",
+       "export" : "导出"
+    },
+
     "selectIcon": "选择图标",
     "selectImage": "选择图片",
     "selectApplication" : "选择应用",

o2web/source/x_component_process_Xform/$Form/default/css.wcss

@@ -426,6 +426,33 @@
         "border-radius": "5px",
         "text-align": "center"
     },
+    "gridImpExpAreaNode" : {
+      "display" : "block"
+    },
+  "gridImportActionStyles" : {
+    "color" : "#777",
+    "border-radius": "5px",
+    "border": "1px solid #ccc",
+    "cursor": "pointer",
+    "height": "26px",
+    "float" : "left",
+    "line-height": "26px",
+    "padding": "0px 5px",
+    "background-color": "#efefef",
+    "margin" : "5px"
+  },
+  "gridExportActionStyles" : {
+    "color" : "#777",
+    "border-radius": "5px",
+    "border": "1px solid #ccc",
+    "cursor": "pointer",
+    "height": "26px",
+    "float" : "left",
+    "line-height": "26px",
+    "padding": "0px 5px",
+    "background-color": "#efefef",
+    "margin" : "5px"
+  },
     "mobileGridHelpNode": {
         "width": "30px",
         "height": "30px",

o2web/source/x_component_process_Xform/Attachment.js

@@ -1710,7 +1710,7 @@ MWF.xApplication.process.Xform.Attachment = MWF.APPAttachment = new Class(
      */
     setData: function(data){
         this.attachmentController.clear();
-        data.each(function (att) {
+        ( data || [] ).each(function (att) {
             var attachment = this.form.businessData.attachmentList.find(function(a){
                 return a.id==att.id;
             });

o2web/source/x_component_process_Xform/Checkbox.js

@@ -108,12 +108,15 @@ MWF.xApplication.process.Xform.Checkbox = MWF.APPCheckbox =  new Class(
         this.node.empty();
         this.setOptions();
     },
-    /**
-     * @summary 获取选择项数组.
-     * @example
-     * var array = this.form.get('fieldId').getOptions();
-     * @return {Array} 选择项数组，如果配置为脚本返回计算结果.
-     */
+        /**
+         * @summary 获取选择项。
+         * @return {Array} 返回选择项数组，如果使用选择项脚本，根据脚本返回决定，如：<pre><code class='language-js'>[
+         *  "女|female",
+         *  "男|male"
+         * ]</code></pre>
+         * @example
+         * this.form.get('fieldId').getOptions();
+         */
 	getOptions: function(){
 		if (this.json.itemType == "values"){
 			return this.json.itemValues;
@@ -123,6 +126,29 @@ MWF.xApplication.process.Xform.Checkbox = MWF.APPCheckbox =  new Class(
 		//return [];
 	},
 
+    /**
+     * @summary 获取整理后的选择项。
+     * @return {Object} 返回整理后的选择项，如：
+     * <pre><code class='language-js'>{"valueList": ["","female","male"], "textList": ["","女","男"]}
+     * </code></pre>
+     * @example
+     * var optionData = this.form.get('fieldId').getOptionsObj();
+     */
+    getOptionsObj : function(){
+        var textList = [];
+        var valueList = [];
+        var optionItems = this.getOptions();
+        if (!optionItems) optionItems = [];
+        if (o2.typeOf(optionItems)==="array"){
+            optionItems.each(function(item){
+                var tmps = item.split("|");
+                textList.push( tmps[0] );
+                valueList.push( tmps[1] || tmps[0] );
+            }.bind(this));
+        }
+        return { textList : textList, valueList : valueList };
+    },
+
     setOptions: function(){
         var optionItems = this.getOptions();
         this._setOptions(optionItems);

o2web/source/x_component_process_Xform/DatagridMobile.js

@@ -66,7 +66,9 @@ MWF.xApplication.process.Xform.DatagridMobile = new Class(
 
 
         this.editable = (!this.readonly);
-        if (this.editable) this.editable = this.form.Macro.exec(((this.json.editableScript) ? this.json.editableScript.code : ""), this);
+        if (this.editable && this.json.editableScript && this.json.editableScript.code){
+            this.editable = this.form.Macro.exec(((this.json.editableScript) ? this.json.editableScript.code : ""), this);
+        }
         //this.editable = false;
 
         this.deleteable = this.json.deleteable !== "no";

o2web/source/x_component_process_Xform/Radio.js

@@ -126,12 +126,15 @@ MWF.xApplication.process.Xform.Radio = MWF.APPRadio =  new Class(
         this.node.empty();
         this.setOptions();
     },
-    /**
-     * @summary 获取选择项。
-     * @return {Array} 返回选择项数组，如果使用选择项脚本，根据脚本返回决定
-     * @example
-     * this.form.get('fieldId').getOptions();
-     */
+        /**
+         * @summary 获取选择项。
+         * @return {Array} 返回选择项数组，如果使用选择项脚本，根据脚本返回决定，如：<pre><code class='language-js'>[
+         *  "女|female",
+         *  "男|male"
+         * ]</code></pre>
+         * @example
+         * this.form.get('fieldId').getOptions();
+         */
 	getOptions: function(){
 		if (this.json.itemType == "values"){
 			return this.json.itemValues;
@@ -140,6 +143,30 @@ MWF.xApplication.process.Xform.Radio = MWF.APPRadio =  new Class(
 		}
 		return [];
 	},
+
+    /**
+     * @summary 获取整理后的选择项。
+     * @return {Object} 返回整理后的选择项，如：
+     * <pre><code class='language-js'>{"valueList": ["","female","male"], "textList": ["","女","男"]}
+     * </code></pre>
+     * @example
+     * var optionData = this.form.get('fieldId').getOptionsObj();
+     */
+    getOptionsObj : function(){
+        var textList = [];
+        var valueList = [];
+        var optionItems = this.getOptions();
+        if (!optionItems) optionItems = [];
+        if (o2.typeOf(optionItems)==="array"){
+            optionItems.each(function(item){
+                var tmps = item.split("|");
+                textList.push( tmps[0] );
+                valueList.push( tmps[1] || tmps[0] );
+            }.bind(this));
+        }
+        return { textList : textList, valueList : valueList };
+    },
+
     setOptions: function(){
         var optionItems = this.getOptions();
         this._setOptions(optionItems);
@@ -362,6 +389,7 @@ MWF.xApplication.process.Xform.Radio = MWF.APPRadio =  new Class(
     resetData: function(){
         this.setData(this.getValue());
     },
+
     /**
      * @summary 获取选中的Dom对象。
      * @return {Element} 返回选中的Dom对象