Merge branch 'feature/Query.embeded_view_style_custom' into 'develop'

Merge of feature/[数据中心]视图样式自定义、整理视图过滤条件 to develop

See merge request o2oa/o2oa!254

o2web/source/o2_core/o2/widget/$Paging/default/css.wcss

@@ -1,7 +1,12 @@
 {
+    "pagingBarWraper" : {
+        "height" : "60px",
+        "overflow" : "hidden"
+    },
     "pagingBar" : {
         "float": "left",
         "margin-left": "10px",
+        "margin-top": "18px",
         "height": "24px",
         "color": "#777777"
     },
@@ -9,7 +14,6 @@
         "height": "24px",
         "width": "80px",
         "border": "1px solid #e6e6e6",
-        "color": "#777777",
         "text-align": "center",
         "line-height": "24px",
         "cursor": "pointer",
@@ -24,7 +28,6 @@
         "height": "24px",
         "width": "80px",
         "border": "1px solid #e6e6e6",
-        "color": "#777777",
         "text-align": "center",
         "line-height": "24px",
         "cursor": "pointer",
@@ -38,7 +41,6 @@
         "width": "24px",
         "height": "24px",
         "border": "1px solid #e6e6e6",
-        "color": "#777777",
         "text-align": "center",
         "line-height": "24px",
         "cursor": "pointer",
@@ -50,6 +52,21 @@
     "prePage_over" : {
         "background-color": "#f1f1f1"
     },
+    "nextPage" : {
+        "width": "24px",
+        "height": "24px",
+        "border": "1px solid #e6e6e6",
+        "text-align": "center",
+        "line-height": "24px",
+        "cursor": "pointer",
+        "background-color": "#ffffff",
+        "float": "left",
+        "margin-right": "10px",
+        "background": "url(/o2_core/o2/widget/$Paging/default/icon/right.png) no-repeat center center"
+    },
+    "nextPage_over" : {
+        "background-color": "#f1f1f1"
+    },
     "pageTurnContainer" : {
         "float" : "left"
     },
@@ -63,8 +80,7 @@
         "cursor": "pointer",
         "float": "left",
         "margin-right": "10px",
-        "background-color": "#ffffff",
-        "color": "#777777"
+        "background-color": "#ffffff"
     },
     "pageItem_over" : {
         "background-color": "#f1f1f1"
@@ -79,8 +95,7 @@
         "cursor": "pointer",
         "float": "left",
         "margin-right": "10px",
-        "background-color": "#ffffff",
-        "color": "#777777"
+        "background-color": "#ffffff"
     },
     "preBatchPage_over" : {
         "background-color": "#f1f1f1"
@@ -95,8 +110,7 @@
         "cursor": "pointer",
         "float": "left",
         "margin-right": "10px",
-        "background-color": "#ffffff",
-        "color": "#777777"
+        "background-color": "#ffffff"
     },
     "nextBatchPage_over" : {
         "background-color": "#f1f1f1"
@@ -132,21 +146,5 @@
         "text-align" : "center",
         "line-height" : "20px",
         "margin-right" : "5px"
-    },
-    "nextPage" : {
-        "width": "24px",
-        "height": "24px",
-        "border": "1px solid #e6e6e6",
-        "color": "#777777",
-        "text-align": "center",
-        "line-height": "24px",
-        "cursor": "pointer",
-        "background-color": "#ffffff",
-        "float": "left",
-        "margin-right": "10px",
-        "background": "url(/o2_core/o2/widget/$Paging/default/icon/right.png) no-repeat center center"
-    },
-    "nextPage_over" : {
-        "background-color": "#f1f1f1"
     }
 }

o2web/source/o2_core/o2/widget/$Paging/forum/css.wcss

@@ -1,4 +1,8 @@
 {
+    "pagingBarWraper" : {
+        "height" : "56px",
+        "overflow" : "hidden"
+    },
     "pagingBar" : {
         "float" : "right",
         "margin-right" : "10px",
@@ -40,6 +44,25 @@
         "background-color" : "#fff",
         "color" : "#43AAFA"
     },
+    "nextPage" : {
+        "float" : "left",
+        "width" : "16px",
+        "height" : "20px",
+        "line-height" : "20px",
+        "text-align" : "center",
+        "padding" : "2px 5px",
+        "border" : "1px solid #f3f3f3",
+        "margin" : "5px",
+        "cursor" : "pointer",
+        "color" : "#333",
+        "background": "url(/o2_core/o2/widget/$Paging/forum/icon/right.png) no-repeat center center",
+        "background-color" : "#f3f3f3"
+    },
+    "nextPage_over" : {
+        "border" : "1px solid #43AAFA",
+        "background-color" : "#fff",
+        "color" : "#43AAFA"
+    },
     "pageTurnContainer" : {
         "float" : "left"
     },
@@ -133,24 +156,5 @@
         "margin-top" : "5px",
         "margin-bottom" : "5px",
         "margin-right" : "5px"
-    },
-    "nextPage" : {
-        "float" : "left",
-        "width" : "16px",
-        "height" : "20px",
-        "line-height" : "20px",
-        "text-align" : "center",
-        "padding" : "2px 5px",
-        "border" : "1px solid #f3f3f3",
-        "margin" : "5px",
-        "cursor" : "pointer",
-        "color" : "#333",
-        "background": "url(/o2_core/o2/widget/$Paging/forum/icon/right.png) no-repeat center center",
-        "background-color" : "#f3f3f3"
-    },
-    "nextPage_over" : {
-        "border" : "1px solid #43AAFA",
-        "background-color" : "#fff",
-        "color" : "#43AAFA"
     }
 }

o2web/source/o2_core/o2/widget/$Paging/red/css.wcss

@@ -0,0 +1,150 @@
+{
+    "pagingBarWraper" : {
+        "height" : "60px",
+        "overflow" : "hidden"
+    },
+    "pagingBar" : {
+        "float": "left",
+        "margin-left": "10px",
+        "margin-top": "18px",
+        "height": "24px",
+        "color": "#777777"
+    },
+    "firstPage" : {
+        "height": "24px",
+        "width": "80px",
+        "border": "1px solid #e6e6e6",
+        "text-align": "center",
+        "line-height": "24px",
+        "cursor": "pointer",
+        "margin-right": "10px",
+        "background-color": "#ffffff",
+        "float": "left"
+    },
+    "firstPage_over" : {
+        "background-color": "#f1f1f1"
+    },
+    "lastPage" : {
+        "height": "24px",
+        "width": "80px",
+        "border": "1px solid #e6e6e6",
+        "text-align": "center",
+        "line-height": "24px",
+        "cursor": "pointer",
+        "background-color": "#ffffff",
+        "float": "left"
+    },
+    "lastPage_over" : {
+        "background-color": "#f1f1f1"
+    },
+    "prePage" : {
+        "width": "24px",
+        "height": "24px",
+        "border": "1px solid #e6e6e6",
+        "text-align": "center",
+        "line-height": "24px",
+        "cursor": "pointer",
+        "background-color": "#ffffff",
+        "float": "left",
+        "margin-right": "10px",
+        "background": "url(/o2_core/o2/widget/$Paging/default/icon/left.png) no-repeat center center"
+    },
+    "prePage_over" : {
+        "background-color": "#f1f1f1"
+    },
+    "nextPage" : {
+        "width": "24px",
+        "height": "24px",
+        "border": "1px solid #e6e6e6",
+        "text-align": "center",
+        "line-height": "24px",
+        "cursor": "pointer",
+        "background-color": "#ffffff",
+        "float": "left",
+        "margin-right": "10px",
+        "background": "url(/o2_core/o2/widget/$Paging/default/icon/right.png) no-repeat center center"
+    },
+    "nextPage_over" : {
+        "background-color": "#f1f1f1"
+    },
+    "pageTurnContainer" : {
+        "float" : "left"
+    },
+    "pageItem" : {
+        "padding-left": "5px",
+        "padding-right" : "5px",
+        "height": "24px",
+        "border": "1px solid #e6e6e6",
+        "text-align": "center",
+        "line-height": "24px",
+        "cursor": "pointer",
+        "float": "left",
+        "margin-right": "10px",
+        "background-color": "#ffffff"
+    },
+    "pageItem_over" : {
+        "background-color": "#f1f1f1"
+    },
+    "preBatchPage" : {
+        "padding-left": "5px",
+        "padding-right" : "5px",
+        "height": "24px",
+        "border": "1px solid #e6e6e6",
+        "text-align": "center",
+        "line-height": "24px",
+        "cursor": "pointer",
+        "float": "left",
+        "margin-right": "10px",
+        "background-color": "#ffffff"
+    },
+    "preBatchPage_over" : {
+        "background-color": "#f1f1f1"
+    },
+    "nextBatchPage" : {
+        "padding-left": "5px",
+        "padding-right" : "5px",
+        "height": "24px",
+        "border": "1px solid #e6e6e6",
+        "text-align": "center",
+        "line-height": "24px",
+        "cursor": "pointer",
+        "float": "left",
+        "margin-right": "10px",
+        "background-color": "#ffffff"
+    },
+    "nextBatchPage_over" : {
+        "background-color": "#f1f1f1"
+    },
+    "currentPage" : {
+        "width": "24px",
+        "height": "24px",
+        "border": "1px solid #e6e6e6",
+        "text-align": "center",
+        "line-height": "24px",
+        "cursor": "pointer",
+        "float": "left",
+        "margin-right": "10px",
+        "background-color": "#cc3d3d",
+        "color": "#ffffff"
+    },
+    "pageJumper" : {
+        "float" : "left",
+        "height" : "20px",
+        "line-height" : "20px",
+        "text-align" : "center",
+        "width" : "20px",
+        "margin-left" : "10px",
+        "border" : "1px solid #ddd"
+    },
+    "pageJumper_over" : {
+        "border" : "1px solid #cc3d3d"
+    },
+    "pageJumperText" : {
+        "float" : "left",
+        "height" : "20px",
+        "padding" : "2px 5px",
+        "text-align" : "center",
+        "line-height" : "20px",
+        "margin-right" : "5px"
+    }
+}

o2web/source/o2_core/o2/widget/Paging.js

@@ -56,7 +56,9 @@ o2.widget.Paging = new Class({
     createNode: function() {
         var _self = this;
 
-        this.node = new Element("div.pagingBar", {styles: this.css.pagingBar}).inject(this.container);
+        this.wraper = new Element("div.pagingBarWraper", {styles: this.css.pagingBarWraper}).inject(this.container);
+
+        this.node = new Element("div.pagingBar", {styles: this.css.pagingBar}).inject(this.wraper);
 
         var i, max, min;
 

o2web/source/x_component_ForumDocument/$Main/default/listItemReply.json

@@ -43,7 +43,7 @@
         "     <div styles='itemUserStat2count' item='todayReply'></div>"+
         "   </div>"+
         "   <div styles='itemToolsLeft'>"+
-        "       <div styles='messageAction' item='messageAction'></div>"+
+//        "       <div styles='messageAction' item='messageAction'></div>"+
         "   </div>"+
         " </div>"+
         " <div styles='itemRightNode'>"+

o2web/source/x_component_ForumDocument/$Main/default/listItemSatisfied.json

@@ -45,7 +45,7 @@
         "     <div styles='itemUserStat2count' item='todayReply'></div>"+
         "   </div>"+
         "   <div styles='itemToolsLeft'>"+
-        "       <div styles='messageAction' item='messageAction'></div>"+
+//        "       <div styles='messageAction' item='messageAction'></div>"+
         "   </div>"+
         " </div>"+
         " <div styles='itemRightNode'>"+

o2web/source/x_component_ForumDocument/$Main/default/listItemSubject.json

@@ -43,7 +43,7 @@
         "      <div styles='itemUserStat2count' item='todayReply'></div>"+
         "   </div>"+
         "   <div styles='itemToolsLeft'>"+
-        "       <div styles='messageAction' item='messageAction'></div>"+
+//        "       <div styles='messageAction' item='messageAction'></div>"+
         "   </div>"+
         " </div>"+
         " <div styles='itemRightNode'>"+

o2web/source/x_component_cms_Module/$ViewExplorer/default/viewer.wcss

@@ -16,11 +16,11 @@
         "overflow": "hidden"
     },
         "viewPageNode": {
-        "height": "80px"
+//        "height": "80px"
     },
     "viewPageAreaNode": {
-        "height": "24px",
-        "margin-top": "28px"
+//        "height": "24px",
+//        "margin-top": "28px"
     },
     "viewPageContentNode": {
         "float": "left",
@@ -248,16 +248,16 @@
     "viewFilterSearchCustomPathListNode": {
         "border": "0px",
         "border-radius": "5px",
-        "height": "80px",
+        "height": "74px",
         "padding": "3px",
-        "width": "99px",
+        "width": "93px",
         "font-size": "12px"
     },
     "viewFilterSearchCustomComparisonListNode": {
         "border": "0px",
-        "height": "80px",
+        "height": "74px",
         "padding": "3px",
-        "width": "99px",
+        "width": "93px",
         "font-size": "12px"
     },
     "viewFilterSearchOptionNode": {
@@ -436,7 +436,7 @@
     },
     "workAreaTitleNode": {
         "height": "20px",
-        "line-height": "20px",
+        "line-height": "20px"
     },
     "workAreaContentNode": {
         "height": "20px",

o2web/source/x_component_cms_Module/ViewExplorer.js

@@ -166,6 +166,8 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
         this.filterItems = [];
         this.searchStatus = "none"; //none, custom, default
 
+        this.originalJson = Object.clone(json);
+
         this.selectEnable = this.options.selectEnable;
 
         this.items = [];
@@ -184,14 +186,26 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
         this.selectEnable = true;
         this.createSelectTh();
         this.items.each( function (it) {
-            it.createSelectTd();
+            if( it.clazzType == "category" ){
+                it.items.each( function(i){
+                    i.createSelectTd();
+                })
+            }else{
+                it.createSelectTd();
+            }
         }.bind(this));
     },
     disableSelectMode : function(){
         this.selectEnable = false;
         this.destroySelectTh();
         this.items.each( function (it) {
-            it.destroySelectTd();
+            if( it.clazzType == "category" ){
+                it.items.each( function(i){
+                    i.destroySelectTd();
+                })
+            }else{
+                it.destroySelectTd();
+            }
         }.bind(this));
     },
     destroySelectTh : function(){
@@ -201,7 +215,13 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
         }
     },
     createSelectTh : function(){
-        this.selectTh = new Element("th",{styles:{width:"20px"}}).inject(this.viewTitleLine, "top");
+        var viewStyles = this.viewJson.viewStyles;
+        var viewTitleCellNode = (viewStyles && viewStyles["titleTd"]) ? viewStyles["titleTd"] : this.css.viewTitleCellNode;
+
+        this.selectTh = new Element("td",{
+            styles: viewTitleCellNode
+        }).inject(this.viewTitleLine, "top");
+        this.selectTh.setStyles({width:"20px"});
         this.checkboxElement = new Element("input", {
             "type": "checkbox"
         }).inject(this.selectTh);
@@ -212,14 +232,28 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
     selectAll : function () {
         var flag = this.checkboxElement.get("checked");
         this.items.each(function (it) {
-            if (it.checkboxElement)it.checkboxElement.set("checked", flag)
+            if( it.clazzType == "category" ){
+                it.items.each( function(i){
+                    if (i.checkboxElement)i.checkboxElement.set("checked", flag)
+                })
+            }else{
+                if (it.checkboxElement)it.checkboxElement.set("checked", flag)
+            }
         }.bind(this))
     },
     getSelectedIds : function(){
         var checkedItems = [];
         this.items.each(function (it) {
-            if (it.checkboxElement.get("checked")) {
-                checkedItems.push( it.data.bundle )
+            if( it.clazzType == "category" ){
+                it.items.each( function(i){
+                    if (i.checkboxElement.get("checked")) {
+                        checkedItems.push( i.data.bundle )
+                    }
+                })
+            }else{
+                if (it.checkboxElement.get("checked")) {
+                    checkedItems.push( it.data.bundle )
+                }
             }
         }.bind(this));
         return checkedItems;
@@ -227,8 +261,16 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
     getSelectedItems : function(){
         var checkedItems = [];
         this.items.each(function (it) {
-            if (it.checkboxElement.get("checked")) {
-                checkedItems.push( it )
+            if( it.clazzType == "category" ){
+                it.items.each( function(i){
+                    if (i.checkboxElement.get("checked")) {
+                        checkedItems.push( i )
+                    }
+                })
+            }else{
+                if (it.checkboxElement.get("checked")) {
+                    checkedItems.push( it )
+                }
             }
         }.bind(this));
         return checkedItems;
@@ -236,7 +278,12 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
 
     createViewNode: function(data){
         this.viewAreaNode.empty();
-        this.contentAreaNode = new Element("div.contentAreaNode", {"styles": this.css.contentAreaNode}).inject(this.viewAreaNode);
+
+        var viewStyles = this.viewJson.viewStyles;
+
+        this.contentAreaNode = new Element("div", {"styles":
+                (viewStyles && viewStyles["container"]) ? viewStyles["container"] : this.css.contentAreaNode
+        }).inject(this.viewAreaNode);
 
         this.viewTable = new Element("table.viewTable", {
             "styles": this.css.viewTitleTableNode,
@@ -244,34 +291,55 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
             "cellPadding": "0",
             "cellSpacing": "0"
         }).inject(this.contentAreaNode);
+        if( viewStyles ){
+            if( viewStyles["tableProperties"] )this.viewTable.set(viewStyles["tableProperties"]);
+            if( viewStyles["table"] )this.viewTable.setStyles(viewStyles["table"]);
+        }
+
         this.createLoadding();
 
+        var viewTitleCellNode = (viewStyles && viewStyles["titleTd"]) ? viewStyles["titleTd"] : this.css.viewTitleCellNode;
+
         if (this.json.isTitle!=="no"){
-            this.viewTitleLine = new Element("tr", {"styles": this.css.viewTitleLineNode}).inject(this.viewTable);
+            this.viewTitleLine = new Element("tr", {
+                "styles": (viewStyles && viewStyles["titleTr"]) ? viewStyles["titleTr"] : this.css.viewTitleLineNode
+            }).inject(this.viewTable);
 
             if( this.selectEnable ){
                 this.createSelectTh();
             }
 
             //if (this.json.select==="single" || this.json.select==="multi") {
-            //this.selectTitleCell = new Element("td", {
-            //    "styles": this.css.viewTitleCellNode
-            //}).inject(this.viewTitleLine);
-            //this.selectTitleCell.setStyle("width", "10px");
-            //if (this.json.titleStyles) this.selectTitleCell.setStyles(this.json.titleStyles);
+            this.selectTitleCell = new Element("td", {
+                "styles": viewTitleCellNode
+            }).inject(this.viewTitleLine);
+            this.selectTitleCell.setStyle("width", "10px");
+            // if (this.json.titleStyles) this.selectTitleCell.setStyles(this.json.titleStyles);
             //}
+
+
+            //序号
+            if (this.viewJson.isSequence==="yes"){
+                this.sequenceTitleCell = new Element("td", {
+                    "styles": viewTitleCellNode
+                }).inject(this.viewTitleLine);
+                this.sequenceTitleCell.setStyle("width", "10px");
+                // if (this.json.titleStyles) this.sequenceTitleCell.setStyles(this.json.titleStyles);
+            }
+
+
             this.entries = {};
             this.viewJson.selectList.each(function(column){
                 this.entries[column.column] = column;
 
                 if (!column.hideColumn){
                     var viewCell = new Element("td", {
-                        "styles": this.css.viewTitleCellNode,
+                        "styles": viewTitleCellNode,
                         "text": column.displayName
                     }).inject(this.viewTitleLine);
-                    var size = MWF.getTextSize(column.displayName, this.css.viewTitleCellNode);
+                    var size = MWF.getTextSize(column.displayName, viewTitleCellNode);
                     viewCell.setStyle("min-width", ""+size.x+"px");
-                    if (this.json.titleStyles) viewCell.setStyles(this.json.titleStyles);
+                    // if (this.json.titleStyles) viewCell.setStyles(this.json.titleStyles);
                 }else{
                     this.hideColumns.push(column.column);
                 }
@@ -280,7 +348,7 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
 
             if( this.options.hasAction ){
                 var viewCell = new Element("td", {
-                    "styles": this.css.viewTitleCellNode,
+                    "styles": viewTitleCellNode,
                     "text": "操作"
                 }).inject(this.viewTitleLine);
                 viewCell.setStyle("width","40px");
@@ -298,11 +366,12 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
     },
     loadLayout: function(){
         this.node = new Element("div", {"styles": this.css.node}).inject(this.container);
-        if (this.options.export) this.exportAreaNode = new Element("div", {"styles": this.css.exportAreaNode}).inject(this.node);
+        this.actionbarAreaNode =  new Element("div.actionbarAreaNode", {"styles": this.css.actionbarAreaNode}).inject(this.node);
+        // if (this.options.export) this.exportAreaNode = new Element("div", {"styles": this.css.exportAreaNode}).inject(this.node);
         this.searchAreaNode = new Element("div", {"styles": this.css.searchAreaNode}).inject(this.searchContainer || this.node );
         this.viewAreaNode = new Element("div.viewAreaNode", {"styles": this.css.viewAreaNode}).inject(this.node);
-        this.viewPageNode = new Element("div", {"styles": this.css.viewPageNode}).inject(this.node);
-        this.viewPageAreaNode = new Element("div", {"styles": this.css.viewPageAreaNode}).inject(this.viewPageNode);
+        // this.viewPageNode = new Element("div", {"styles": this.css.viewPageNode}).inject(this.node);
+        this.viewPageAreaNode = new Element("div", {"styles": this.css.viewPageAreaNode}).inject(this.node);
     },
     //loadData: function(){
     //    if (this.gridJson.length){
@@ -320,6 +389,8 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
             }else{
                 this.loadPaging();
             }
+        }else{
+            if (this.viewPageAreaNode) this.viewPageAreaNode.empty();
         }
     },
     loadPaging : function(){
@@ -361,18 +432,30 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
         }
     },
     loadGroupData: function(){
-        if (this.selectTitleCell){
-            this.selectTitleCell.set("html", "<span style='font-family: Webdings'>"+"<img src='/x_component_process_Application/$Viewer/"+this.options.style+"/icon/expand.png'/>"+"</span>");
+        if (this.selectTitleCell && !this.selectTitleCell.retrieve("expandLoaded") ){
+            if( this.viewJson.viewStyles && this.viewJson.viewStyles["groupCollapseNode"] ){
+                this.expandAllNode = new Element("span", {
+                    styles : this.viewJson.viewStyles["groupCollapseNode"]
+                }).inject( this.selectTitleCell );
+                this.selectTitleCell.setStyle("cursor", "pointer");
+            }else{
+                this.selectTitleCell.set("html", "<span style='font-family: Webdings'>"+"<img src='/x_component_query_Query/$Viewer/"+this.options.style+"/icon/expand.png'/>"+"</span>");
+            }
             this.selectTitleCell.setStyle("cursor", "pointer");
             this.selectTitleCell.addEvent("click", this.expandOrCollapseAll.bind(this));
+            this.selectTitleCell.store("expandLoaded", true);
         }
-
+        this.expandAll = false;
         if (this.gridJson.length){
+            var i = 0;
             this.gridJson.each(function(data){
-                this.items.push(new MWF.xApplication.cms.Module.QueryViewer.ItemCategory(this, data));
+                this.items.push(new MWF.xApplication.cms.Module.QueryViewer.ItemCategory(this, data, i));
+                i += data.list.length;
             }.bind(this));
 
             if (this.json.isExpand=="yes")this.expandOrCollapseAll();
+        }else{
+            if (this.viewPageAreaNode) this.viewPageAreaNode.empty();
         }
     },
     createSearchNode: function(){
@@ -398,6 +481,7 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
         }
     },
     loadSimpleSearch: function(){
+        return false;
         this.searchSimpleNode = new Element("div", {"styles": this.css.searchSimpleNode}).inject(this.searchAreaNode);
         this.searchSimpleButtonNode = new Element("div", {"styles": this.css.searchSimpleButtonNode}).inject(this.searchSimpleNode);
         this.searchSimpleWarpNode = new Element("div", {"style": "margin-right: 40px; margin-left: 5px; height: 24px; overflow: hidden;"}).inject(this.searchSimpleNode);
@@ -415,7 +499,6 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
             }.bind(this)
         });
     },
-
     setContentHeight: function(){
         if( this.viewSearchCustomCloseActionNode && !this.setCustomSearchCloseEvent ){
             this.viewSearchCustomCloseActionNode.addEvent("click", function(){
@@ -424,9 +507,9 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
             this.setCustomSearchCloseEvent = true;
         }
         if(this.viewSearchInputAreaNode)this.viewSearchInputAreaNode.setStyle("width","auto");
+        debugger;
         if( this.node && this.searchContainer && this.viewAreaNode ){
             var size = this.node.getSize();
-            debugger;
             var searchSize;
             var parent = this.searchContainer.getParent();
             if( parent ){
@@ -434,7 +517,13 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
             }else{
                 searchSize = this.searchContainer.getSize();
             }
-            var h = size.y-searchSize.y - 80; //80是视图翻页条的高度
+            var h = size.y-searchSize.y; // - 80; //80是视图翻页条的高度
+            if( this.actionbarAreaNode ){
+                var exportSize = this.actionbarAreaNode.getComputedSize();
+                h = h-exportSize.totalHeight;
+            }
+            var pageSize = this.viewPageAreaNode.getComputedSize();
+            h = h-pageSize.totalHeight;
             this.viewAreaNode.setStyle("height", ""+h+"px");
         }
     }
@@ -443,8 +532,15 @@ MWF.xApplication.cms.Module.QueryViewer = new Class({
 MWF.xApplication.cms.Module.QueryViewer.Item = new Class({
     Extends : MWF.xApplication.query.Query.Viewer.Item,
     load: function(){
+        this.view.fireEvent("queryLoadItemRow", [null, this]);
         var _self = this;
-        this.node = new Element("tr", {"styles": this.css.viewContentTrNode});
+
+        var viewStyles = this.view.viewJson.viewStyles;
+        var viewContentTdNode = ( viewStyles && viewStyles["contentTd"] ) ? viewStyles["contentTd"] : this.css.viewContentTdNode;
+
+        this.node = new Element("tr", {
+            "styles": ( viewStyles && viewStyles["contentTr"] ) ? viewStyles["contentTr"] : this.css.viewContentTrNode
+        });
         if (this.prev){
             this.node.inject(this.prev.node, "after");
         }else{
@@ -460,9 +556,9 @@ MWF.xApplication.cms.Module.QueryViewer.Item = new Class({
         }
 
         //if (this.view.json.select==="single" || this.view.json.select==="multi"){
-        //this.selectTd = new Element("td", {"styles": this.css.viewContentTdNode}).inject(this.node);
-        //this.selectTd.setStyles({"cursor": "pointer"});
-        //if (this.view.json.itemStyles) this.selectTd.setStyles(this.view.json.itemStyles);
+        this.selectTd = new Element("td", { "styles": viewContentTdNode }).inject(this.node);
+        this.selectTd.setStyles({"cursor": "pointer"});
+        if (this.view.json.itemStyles) this.selectTd.setStyles(this.view.json.itemStyles);
         //}
 
         //Object.each(this.data.data, function(cell, k){
@@ -479,17 +575,22 @@ MWF.xApplication.cms.Module.QueryViewer.Item = new Class({
         //    }
         //}.bind(this));
 
-        debugger;
 
         this.view.viewJson.selectList.each(function(column){
             var k = column.column;
             var cell = this.data.data[column.column];
 
             if (this.view.hideColumns.indexOf(k)===-1){
-                var td = new Element("td", {"styles": this.css.viewContentTdNode}).inject(this.node);
+                var td = new Element("td", {"styles": viewContentTdNode}).inject(this.node);
                 if (k!== this.view.viewJson.group.column){
                     //var v = (this.view.entries[k].code) ? MWF.Macro.exec(this.view.entries[k].code, {"value": cell, "gridData": this.view.gridJson, "data": this.view.viewData, "entry": this.data}) : cell;
-                    td.set("text", cell);
+                    //td.set("text", cell);
+                    var v = cell;
+                    if (column.isHtml){
+                        td.set("html", v);
+                    }else{
+                        td.set("text", v);
+                    }
                 }
                 if (this.view.openColumns.indexOf(k)!==-1){
                     this.setOpenWork(td, column)
@@ -506,6 +607,7 @@ MWF.xApplication.cms.Module.QueryViewer.Item = new Class({
         }
 
         this.setEvent();
+        this.view.fireEvent("postLoadItemRow", [null, this]);
     },
     destroySelectTd : function(){
         if( this.checboxTd ){
@@ -515,7 +617,11 @@ MWF.xApplication.cms.Module.QueryViewer.Item = new Class({
     },
     createSelectTd : function(){
         if( this.checboxTd )return;
-        this.checboxTd = new Element("td").inject(this.node, "top");
+
+        var viewStyles = this.view.viewJson.viewStyles;
+        var viewContentTdNode = ( viewStyles && viewStyles["contentTd"] ) ? viewStyles["contentTd"] : this.css.viewContentTdNode;
+
+        this.checboxTd = new Element("td", {styles:viewContentTdNode}).inject(this.node, "top");
         this.checkboxElement = new Element("input", {
             "type": "checkbox",
             "events" : { click : function(ev){ ev.stopPropagation(); } }
@@ -553,19 +659,29 @@ MWF.xApplication.cms.Module.QueryViewer.Item = new Class({
     setOpenWork: function(td, column){
         td.setStyle("cursor", "pointer");
         if( column.clickCode ) {
-            if (!this.view.Macro) {
-                MWF.require("MWF.xScript.Macro", function () {
-                    this.view.businessData = {};
-                    this.view.Macro = new MWF.Macro.PageContext(this.view);
-                }.bind(this), false);
-            }
+            // if( !this.view.Macro ){
+            //     MWF.require("MWF.xScript.Macro", function () {
+            //         this.view.businessData = {};
+            //         this.view.Macro = new MWF.Macro.PageContext(this.view);
+            //     }.bind(this), false);
+            // }
             td.addEvent("click", function( ev ){
-                return this.view.Macro.fire(column.clickCode, this, ev);
+                var result = this.view.Macro.fire(column.clickCode, this, ev);
+                ev.stopPropagation();
+                return result;
             }.bind(this));
         }else{
-            td.addEvent("click", function(){
-                this.openCMSDocument()
-            }.bind(this));
+            if (this.view.json.type==="cms"){
+                td.addEvent("click", function(ev){
+                    this.openCMSDocument(false)
+                    ev.stopPropagation();
+                }.bind(this));
+            }else{
+                td.addEvent("click", function(ev){
+                    this.openWorkAndCompleted(ev)
+                    ev.stopPropagation();
+                }.bind(this));
+            }
         }
     },
     openCMSDocument : function( isEdited ){
@@ -627,19 +743,27 @@ MWF.xApplication.cms.Module.QueryViewer.Item = new Class({
 MWF.xApplication.cms.Module.QueryViewer.ItemCategory = new Class({
     Extends : MWF.xApplication.query.Query.Viewer.ItemCategory,
     load: function(){
-        this.node = new Element("tr", {"styles": this.css.viewContentTrNode}).inject(this.view.viewTable);
+        this.view.fireEvent("queryLoadCategoryRow", [null, this]);
+
+        var viewStyles = this.view.viewJson.viewStyles;
+
+        var viewContentCategoryTdNode = ( viewStyles && viewStyles["contentGroupTd"] ) ? viewStyles["contentGroupTd"] : this.css.viewContentCategoryTdNode;
+
+        this.node = new Element("tr", {
+            "styles": (viewStyles && viewStyles["contentTr"]) ? viewStyles["contentTr"] : this.css.viewContentTrNode
+        }).inject(this.view.viewTable);
         //if (this.view.json.select==="single" || this.view.json.select==="multi"){
-        this.selectTd = new Element("td", {"styles": this.css.viewContentCategoryTdNode}).inject(this.node);
+        this.selectTd = new Element("td", {"styles": viewContentCategoryTdNode}).inject(this.node);
         if (this.view.json.itemStyles) this.selectTd.setStyles(this.view.json.itemStyles);
         //}
 
-        var colsapn = this.view.viewJson.selectList.length;
+        var colsapn = this.view.viewJson.selectList.length+1;
         if( this.view.options.hasAction ){
             colsapn ++
         }
 
         this.categoryTd = new Element("td", {
-            "styles": this.css.viewContentCategoryTdNode,
+            "styles": viewContentCategoryTdNode,
             "colspan": colsapn
         }).inject(this.node);
 
@@ -651,25 +775,45 @@ MWF.xApplication.cms.Module.QueryViewer.ItemCategory = new Class({
             }
         }
         if (this.groupColumn){
-            var text = (this.groupColumn.code) ? MWF.Macro.exec(this.groupColumn.code, {"value": this.data.group, "gridData": this.view.gridJson, "data": this.view.viewData, "entry": this.data}) : this.data.group;
+            //var text = (this.groupColumn.code) ? MWF.Macro.exec(this.groupColumn.code, {"value": this.data.group, "gridData": this.view.gridJson, "data": this.view.viewData, "entry": this.data}) : this.data.group;
+            var text = this.data.group;
         }else{
             var text = this.data.group;
         }
 
-        this.categoryTd.set("html", "<span style='font-family: Webdings'><img src='/x_component_query_Query/$Viewer/"+this.view.options.style+"/icon/expand.png'/></span> "+text);
+        if( viewStyles && viewStyles["groupCollapseNode"] ){
+            this.expandNode = new Element("span", {
+                styles : viewStyles["groupCollapseNode"]
+            }).inject( this.categoryTd );
+            new Element("span", { text : text }).inject( this.categoryTd );
+            // this.categoryTd.set("text", text );
+        }else{
+            this.categoryTd.set("html", "<span style='font-family: Webdings'><img src='/x_component_query_Query/$Viewer/"+this.view.options.style+"/icon/expand.png'/></span> "+text);
+        }
+        this.expanded = false;
         if (this.view.json.itemStyles) this.categoryTd.setStyles(this.view.json.itemStyles);
 
         this.setEvent();
+
+        this.view.fireEvent("postLoadCategoryRow", [null, this]);
     },
     expand: function(){
         this.items.each(function(item){
             item.node.setStyle("display", "table-row");
         }.bind(this));
-        this.node.getElement("span").set("html", "<img src='/x_component_process_Application/$Viewer/"+this.view.options.style+"/icon/down.png'/>");
+               if( this.expandNode ){
+            this.expandNode.setStyles( this.view.viewJson.viewStyles["groupExpandNode"] )
+        }else{
+            this.node.getElement("span").set("html", "<img src='/x_component_query_Query/$Viewer/"+this.view.options.style+"/icon/down.png'/>");
+        }
+        this.expanded = true;
         if (!this.loadChild){
             //window.setTimeout(function(){
-            this.data.list.each(function(line){
-                this.items.push(new MWF.xApplication.cms.Module.QueryViewer.Item(this.view, line, this));
+            this.data.list.each(function(line, i){
+                var s = this.idx+i;
+                this.lastItem = new MWF.xApplication.cms.Module.QueryViewer.Item(this.view, line, (this.lastItem || this), s);
+                this.items.push(this.lastItem);
+                //this.items.push(new MWF.xApplication.cms.Module.QueryViewer.Item(this.view, line, this));
             }.bind(this));
             this.loadChild = true;
             //}.bind(this), 10);

o2web/source/x_component_cms_QueryViewDesigner/$View/view.html

@@ -235,19 +235,19 @@
 
     <div title="过滤"  class="MWFTab">
         <div class="MWFViewFilter">
-            <div>
-                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+            <div class="inputAreaNode_vf">
+                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable_vf">
                     <tr>
                         <td class="editTableTitle">标题:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput titleInput_vf"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">路径:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput pathInput_vf"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">数据类型:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="datatypeInput_vf">
                             <option value="textValue" selected>文本</option>
                             <option value="numberValue">数字</option>
                             <option value="dateTimeValue">日期</option>
@@ -257,20 +257,27 @@
                     <tr>
                         <td class="editTableTitle"></td>
                         <td class="editTableValue">
-                            <input type="radio" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){ $('text{$.id}viewFilterRestrict').setStyle('display', 'block');}"/>作为默认过滤条件<br>
-                            <input type="radio" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){ $('text{$.id}viewFilterRestrict').setStyle('display', 'none');}" checked/>作为自定义过滤数据
+                            <input type="radio" class="restrictFilterInput_vf" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                                $('text{$.id}viewFilterRestrict').setStyle('display', 'block');
+                            }"/>作为默认过滤条件<br>
+                            <input type="radio" class="customFilterInput_vf" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                                $('text{$.id}viewFilterRestrict').setStyle('display', 'none');
+                            }" checked/>作为自定义过滤数据
                         </td>
                     </tr>
                 </table>
                 <table id="text{$.id}viewFilterRestrict" style="display: none" width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
                     <tr>
                         <td class="editTableTitle">逻辑:</td>
-                        <td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+                        <td class="editTableValue"><select class="logicInput_vf">
+                            <option selected value="and">并且(and)</option>
+                            <option value="or">或者(or)</option>
+                        </select></td>
                     </tr>
 
                     <tr>
                         <td class="editTableTitle">比较:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="comparisonInput_vf">
                             <option value="equals" selected>等于(==)</option>
                             <option value="notEquals">不等于(!=)</option>
                             <option value="greaterThan">大于(>)</option>
@@ -284,10 +291,10 @@
                     <tr>
                         <td class="editTableTitle">值:</td>
                         <td class="editTableValue">
-                            <input type="text" class="editTableInput" style="display: block"/>
-                            <input type="number" class="editTableInput" style="display: none"/>
-                            <input type="text" class="editTableInput" style="display: none" readonly/>
-                            <select style="display: none">
+                            <input type="text" class="editTableInput valueTextInput_vf" style="display: block"/>
+                            <input type="number" class="editTableInput valueNumberInput_vf" style="display: none"/>
+                            <input type="text" class="editTableInput valueDatetimeInput_vf" style="display: none" readonly/>
+                            <select class="valueBooleanInput_vf" style="display: none">
                                 <option value="true" selected>是(True)</option>
                                 <option value="false">否(False)</option>
                             </select>
@@ -295,11 +302,11 @@
                     </tr>
                 </table>
             </div>
-            <div></div>
+            <div class="actionAreaNode_vf"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="listAreaNode_vf" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="fieldListAreaNode_vf" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
         </div>
     </div>
 

o2web/source/x_component_portal_PageDesigner/Module/View/view.html

@@ -105,6 +105,13 @@
 					</select>
 				</td>
 			</tr>
+			<tr>
+				<td class="editTableTitle">操作条</td>
+				<td class="editTableValue">
+					<input class="editTableRadio" name="actionbar" text{($.actionbar=='show')?'checked':''} type="radio" value="show"/>显示
+					<input class="editTableRadio" name="actionbar" text{($.actionbar!='show')?'checked':''} type="radio" value="hidden"/>不显示
+				</td>
+			</tr>
 			<!--<tr>-->
 			<!--<td class="editTableTitle">打开文件</td>-->
 			<!--<td class="editTableValue">-->
@@ -116,19 +123,19 @@
 
 		<div style="background-color: #eeeeee; border-top:1px solid #999999; height: 24px; line-height: 24px; text-align: center; cursor:pointer">过滤</div>
 		<div class="MWFViewFilter">
-			<div>
-				<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+			<div class="inputAreaNode_vf">
+				<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable_vf">
 					<tr style="display:none">
 						<td class="editTableTitle">标题:</td>
-						<td class="editTableValue"><input type="text" class="editTableInput"/></td>
+						<td class="editTableValue"><input type="text" class="editTableInput titleInput_vf"/></td>
 					</tr>
 					<tr>
 						<td class="editTableTitle">路径:</td>
-						<td class="editTableValue"><input type="text" class="editTableInput"/></td>
+						<td class="editTableValue"><input type="text" class="editTableInput pathInput_vf"/></td>
 					</tr>
 					<tr>
 						<td class="editTableTitle">数据类型:</td>
-						<td class="editTableValue"><select>
+						<td class="editTableValue"><select class="datatypeInput_vf">
 							<option value="textValue" selected>文本</option>
 							<option value="numberValue">数字</option>
 							<option value="dateTimeValue">日期</option>
@@ -138,20 +145,23 @@
 					<tr style="display:none">
 						<td class="editTableTitle"></td>
 						<td class="editTableValue">
-							<input type="radio" value="restrict" name="text{$.pid}viewFilterType" checked/>作为默认过滤条件<br>
-							<input type="radio" value="custom" name="text{$.pid}viewFilterType"/>作为自定义过滤数据
+							<input type="radio" class="restrictFilterInput_vf" value="restrict" name="text{$.pid}viewFilterType" checked/>作为默认过滤条件<br>
+							<input type="radio" class="customFilterInput_vf" value="custom" name="text{$.pid}viewFilterType"/>作为自定义过滤数据
 						</td>
 					</tr>
 				</table>
 				<table id="text{$.pid}viewFilterRestrict" width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
 					<tr>
 						<td class="editTableTitle">逻辑:</td>
-						<td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+						<td class="editTableValue"><select class="logicInput_vf">
+							<option selected value="and">并且(and)</option>
+							<option value="or">或者(or)</option>
+						</select></td>
 					</tr>
 
 					<tr>
 						<td class="editTableTitle">比较:</td>
-						<td class="editTableValue"><select>
+						<td class="editTableValue"><select class="comparisonInput_vf">
 							<option value="equals" selected>等于(==)</option>
 							<option value="notEquals">不等于(!=)</option>
 							<option value="greaterThan">大于(>)</option>
@@ -166,12 +176,12 @@
 					<tr style="display:none">
 						<td class="editTableTitle">值:</td>
 						<td class="editTableValue">
-							<input type="text" class="editTableInput" style="display: block"/>
-							<input type="number" class="editTableInput" style="display: none"/>
-							<input type="text" class="editTableInput" style="display: none" readonly/>
-							<input type="text" class="editTableInput" style="display: none" readonly/>
-							<input type="text" class="editTableInput" style="display: none" readonly/>
-							<select style="display: none">
+							<input type="text" class="editTableInput valueTextInput_vf" style="display: block"/>
+							<input type="number" class="editTableInput valueNumberInput_vf" style="display: none"/>
+							<input type="text" class="editTableInput valueDatetimeInput_vf" style="display: none" readonly/>
+							<input type="text" class="editTableInput valueDateInput_vf" style="display: none" readonly/>
+							<input type="text" class="editTableInput valueTimeInput_vf" style="display: none" readonly/>
+							<select class="valueBooleanInput_vf" style="display: none">
 								<option value="true" selected>是(True)</option>
 								<option value="false">否(False)</option>
 							</select>
@@ -180,11 +190,11 @@
 				</table>
 				<div title="值" class="MWFFilterFormulaArea"></div>
 			</div>
-			<div></div>
+			<div class="actionAreaNode_vf"></div>
 			<div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-			<div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+			<div class="listAreaNode_vf" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
 			<div style="display:none; height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-			<div style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+			<div class="fieldListAreaNode_vf" style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
 		</div>
 
 	</div>

o2web/source/x_component_process_FormDesigner/Module/Table.js

@@ -37,22 +37,22 @@ MWF.xApplication.process.FormDesigner.Module.Table = MWF.FCTable = new Class({
 		this.selectedMultiTds = [];
 	},
     clearTemplateStyles: function(styles){
-        if (styles){
-            if (styles.styles) this.removeStyles(styles.styles, "styles");
-            if (styles.properties) this.removeStyles(styles.properties, "properties");
-            if (styles.titleStyles) this.removeStyles(styles.titleStyles, "titleTdStyles");
-            if (styles.contentStyles) this.removeStyles(styles.contentStyles, "contentTdStyles");
-            if (styles.layoutStyles) this.removeStyles(styles.layoutStyles, "layoutTdStyles");
-        }
-    },
+		if (styles){
+			if (styles.styles) this.removeStyles(styles.styles, "styles");
+			if (styles.properties) this.removeStyles(styles.properties, "properties");
+			if (styles.titleStyles) this.removeStyles(styles.titleStyles, "titleTdStyles");
+			if (styles.contentStyles) this.removeStyles(styles.contentStyles, "contentTdStyles");
+			if (styles.layoutStyles) this.removeStyles(styles.layoutStyles, "layoutTdStyles");
+		}
+	},
 
-    setTemplateStyles: function(styles){
-        if (styles.styles) this.copyStyles(styles.styles, "styles");
-        if (styles.properties) this.copyStyles(styles.properties, "properties");
-        if (styles.titleStyles) this.copyStyles(styles.titleStyles, "titleTdStyles");
-        if (styles.contentStyles) this.copyStyles(styles.contentStyles, "contentTdStyles");
-        if (styles.layoutStyles) this.copyStyles(styles.layoutStyles, "layoutTdStyles");
-    },
+	setTemplateStyles: function(styles){
+		if (styles.styles) this.copyStyles(styles.styles, "styles");
+		if (styles.properties) this.copyStyles(styles.properties, "properties");
+		if (styles.titleStyles) this.copyStyles(styles.titleStyles, "titleTdStyles");
+		if (styles.contentStyles) this.copyStyles(styles.contentStyles, "contentTdStyles");
+		if (styles.layoutStyles) this.copyStyles(styles.layoutStyles, "layoutTdStyles");
+	},
 
 	_createMoveNode: function(){
 		var tableHTML = "<table border=\"0\" cellpadding=\"0\" cellspacing=\"2\" width=\"100%\" align=\"center\">";

o2web/source/x_component_process_FormDesigner/Module/View.js

@@ -107,6 +107,10 @@ MWF.xApplication.process.FormDesigner.Module.View = MWF.FCView = new Class({
         if (this.viewNode){
             this.node.setStyle("background", "transparent");
             this.actionbarNode = this.viewNode.getChildren("div")[0];
+            if( this.actionbarNode ){
+                this.actionbarNode.destroy();
+                this.actionbarNode = null;
+            }
             this.viewTable = this.viewNode.getElement("table").setStyles(this.css.viewTitleTableNode);
             this.viewLine = this.viewTable.getElement("tr").setStyles(this.css.viewTitleLineNode);
             this.viewSelectCell = this.viewLine.getElement("td");
@@ -192,7 +196,7 @@ MWF.xApplication.process.FormDesigner.Module.View = MWF.FCView = new Class({
             this.node.set("id", this.json.id);
         }
         if(name=="actionbar"){
-            input.get("value") === "show" ? this._showActionbar() : this._hideActionbar();
+            this.json.actionbar === "show" ? this._showActionbar() : this._hideActionbar();
         }
 
         this._setEditStyle_custom(name, input, oldValue);
@@ -255,7 +259,9 @@ MWF.xApplication.process.FormDesigner.Module.View = MWF.FCView = new Class({
         if(this.actionbarNode)this.actionbarNode.hide();
     },
     _showActionbar : function(){
+	    if( this.actionbarLoading )return;
 	    if( !this.actionbarNode )return;
+        this.actionbarLoading = true;
         MWF.require("MWF.widget.Toolbar", null, false);
         this.actionbarNode.show();
         if( !this.viewData.actionbarList )this.viewData.actionbarList = [];
@@ -273,10 +279,13 @@ MWF.xApplication.process.FormDesigner.Module.View = MWF.FCView = new Class({
 
                     toolbarWidget.load();
                     this.actionbarList.push( toolbarWidget );
+                    this.actionbarLoading = false;
                 }.bind(this));
             }else{
-
+                this.actionbarLoading = false;
             }
+        }else{
+            this.actionbarLoading = false;
         }
     },
     setToolbars: function(tools, node, json){

o2web/source/x_component_process_FormDesigner/Module/View/view.html

@@ -184,19 +184,19 @@
 
 		<div style="background-color: #eeeeee; border-top:1px solid #999999; height: 24px; line-height: 24px; text-align: center; cursor:pointer">过滤</div>
 		<div class="MWFViewFilter">
-			<div>
-				<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+			<div class="inputAreaNode_vf">
+				<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable_vf">
 					<tr style="display:none">
 						<td class="editTableTitle">标题:</td>
-						<td class="editTableValue"><input type="text" class="editTableInput"/></td>
+						<td class="editTableValue"><input type="text" class="editTableInput titleInput_vf"/></td>
 					</tr>
 					<tr>
 						<td class="editTableTitle">路径:</td>
-						<td class="editTableValue"><input type="text" class="editTableInput"/></td>
+						<td class="editTableValue"><input type="text" class="editTableInput pathInput_vf"/></td>
 					</tr>
 					<tr>
 						<td class="editTableTitle">数据类型:</td>
-						<td class="editTableValue"><select>
+						<td class="editTableValue"><select class="datatypeInput_vf">
 							<option value="textValue" selected>文本</option>
 							<option value="numberValue">数字</option>
 							<option value="dateTimeValue">日期</option>
@@ -206,20 +206,23 @@
 					<tr style="display:none">
 						<td class="editTableTitle"></td>
 						<td class="editTableValue">
-							<input type="radio" value="restrict" name="text{$.id}viewFilterType" checked/>作为默认过滤条件<br>
-							<input type="radio" value="custom" name="text{$.id}viewFilterType"/>作为自定义过滤数据
+							<input type="radio" class="restrictFilterInput_vf" value="restrict" name="text{$.id}viewFilterType" checked/>作为默认过滤条件<br>
+							<input type="radio" class="customFilterInput_vf" value="custom" name="text{$.id}viewFilterType"/>作为自定义过滤数据
 						</td>
 					</tr>
 				</table>
 				<table id="text{$.pid}viewFilterRestrict" width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
 					<tr>
 						<td class="editTableTitle">逻辑:</td>
-						<td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+						<td class="editTableValue"><select class="logicInput_vf">
+							<option selected value="and">并且(and)</option>
+							<option value="or">或者(or)</option>
+						</select></td>
 					</tr>
 
 					<tr>
 						<td class="editTableTitle">比较:</td>
-						<td class="editTableValue"><select>
+						<td class="editTableValue"><select class="comparisonInput_vf">
 							<option value="equals" selected>等于(==)</option>
 							<option value="notEquals">不等于(!=)</option>
 							<option value="greaterThan">大于(>)</option>
@@ -234,12 +237,12 @@
 					<tr style="display:none">
 						<td class="editTableTitle">值:</td>
 						<td class="editTableValue">
-							<input type="text" class="editTableInput" style="display: block"/>
-							<input type="number" class="editTableInput" style="display: none"/>
-							<input type="text" class="editTableInput" style="display: none" readonly/>
-							<input type="text" class="editTableInput" style="display: none" readonly/>
-							<input type="text" class="editTableInput" style="display: none" readonly/>
-							<select style="display: none">
+							<input type="text" class="editTableInput valueTextInput_vf" style="display: block"/>
+							<input type="number" class="editTableInput valueNumberInput_vf" style="display: none"/>
+							<input type="text" class="editTableInput valueDatetimeInput_vf" style="display: none" readonly/>
+							<input type="text" class="editTableInput valueDateInput_vf" style="display: none" readonly/>
+							<input type="text" class="editTableInput valueTimeInput_vf" style="display: none" readonly/>
+							<select class="valueBooleanInput_vf" style="display: none">
 								<option value="true" selected>是(True)</option>
 								<option value="false">否(False)</option>
 							</select>
@@ -248,11 +251,11 @@
 				</table>
 				<div title="值" class="MWFFilterFormulaArea"></div>
 			</div>
-			<div></div>
+			<div class="actionAreaNode_vf"></div>
 			<div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-			<div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+			<div class="listAreaNode_vf" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
 			<div style="display:none; height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-			<div style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+			<div class="fieldListAreaNode_vf" style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
 		</div>
 
 	</div>

o2web/source/x_component_process_FormDesigner/Module/ViewSelector/ViewSelector.html

@@ -46,6 +46,13 @@
                         <input type="radio" name="select" value="multi" text{($.select=='multi')?'checked':''}/>多选
                     </td>
                 </tr>
+                <tr>
+                    <td class="editTableTitle">操作条</td>
+                    <td class="editTableValue">
+                        <input class="editTableRadio" name="actionbar" text{($.actionbar=='show')?'checked':''} type="radio" value="show"/>显示
+                        <input class="editTableRadio" name="actionbar" text{($.actionbar!='show')?'checked':''} type="radio" value="hidden"/>不显示
+                    </td>
+                </tr>
                 <!--<tr>-->
                     <!--<td class="editTableTitle"></td>-->
                     <!--<td class="editTableValue">-->
@@ -103,19 +110,19 @@
 	</div>
     <div title="过滤"  class="MWFTab">
         <div class="MWFViewFilter">
-            <div>
-                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+            <div class="inputAreaNode_vf">
+                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable_vf">
                     <tr style="display:none">
                         <td class="editTableTitle">标题:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput titleInput_vf"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">路径:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput pathInput_vf"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">数据类型:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="datatypeInput_vf">
                             <option value="textValue" selected>文本</option>
                             <option value="numberValue">数字</option>
                             <option value="dateTimeValue">日期</option>
@@ -125,20 +132,23 @@
                     <tr style="display:none">
                         <td class="editTableTitle"></td>
                         <td class="editTableValue">
-                            <input type="radio" value="restrict" name="text{$.id}viewFilterType" checked/>作为默认过滤条件<br>
-                            <input type="radio" value="custom" name="text{$.id}viewFilterType"/>作为自定义过滤数据
+                            <input type="radio" class="restrictFilterInput_vf" value="restrict" name="text{$.id}viewFilterType" checked/>作为默认过滤条件<br>
+                            <input type="radio" class="customFilterInput_vf" value="custom" name="text{$.id}viewFilterType"/>作为自定义过滤数据
                         </td>
                     </tr>
                 </table>
                 <table id="text{$.pid}viewFilterRestrict" width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
                     <tr>
                         <td class="editTableTitle">逻辑:</td>
-                        <td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+                        <td class="editTableValue"><select class="logicInput_vf">
+                            <option selected value="and">并且(and)</option>
+                            <option value="or">或者(or)</option>
+                        </select></td>
                     </tr>
 
                     <tr>
                         <td class="editTableTitle">比较:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="comparisonInput_vf">
                             <option value="equals" selected>等于(==)</option>
                             <option value="notEquals">不等于(!=)</option>
                             <option value="greaterThan">大于(>)</option>
@@ -153,12 +163,12 @@
                     <tr style="display:none">
                         <td class="editTableTitle">值:</td>
                         <td class="editTableValue">
-                            <input type="text" class="editTableInput" style="display: block"/>
-                            <input type="number" class="editTableInput" style="display: none"/>
-                            <input type="text" class="editTableInput" style="display: none" readonly/>
-							<input type="text" class="editTableInput" style="display: none" readonly/>
-							<input type="text" class="editTableInput" style="display: none" readonly/>
-                            <select style="display: none">
+                            <input type="text" class="editTableInput valueTextInput_vf" style="display: block"/>
+                            <input type="number" class="editTableInput valueNumberInput_vf" style="display: none"/>
+                            <input type="text" class="editTableInput valueDatetimeInput_vf" style="display: none" readonly/>
+							<input type="text" class="editTableInput valueDateInput_vf" style="display: none" readonly/>
+							<input type="text" class="editTableInput valueTimeInput_vf" style="display: none" readonly/>
+                            <select class="valueBooleanInput_vf" style="display: none">
                                 <option value="true" selected>是(True)</option>
                                 <option value="false">否(False)</option>
                             </select>
@@ -167,11 +177,11 @@
                 </table>
                 <div title="值" class="MWFFilterFormulaArea"></div>
             </div>
-            <div></div>
+            <div class="actionAreaNode_vf"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="listAreaNode_vf" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
             <div style="display:none; height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-            <div style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="fieldListAreaNode_vf" style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
         </div>
     </div>
 

o2web/source/x_component_process_ViewDesigner/$View/view.html

@@ -254,19 +254,19 @@
 
     <div title="过滤"  class="MWFTab">
         <div class="MWFViewFilter">
-            <div>
-                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+            <div class="inputAreaNode_vf">
+                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable_vf">
                     <tr>
                         <td class="editTableTitle">标题:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput titleInput_vf"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">路径:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput pathInput_vf"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">数据类型:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="datatypeInput_vf">
                             <option value="textValue" selected>文本</option>
                             <option value="numberValue">数字</option>
                             <option value="dateTimeValue">日期</option>
@@ -276,20 +276,27 @@
                     <tr>
                         <td class="editTableTitle"></td>
                         <td class="editTableValue">
-                            <input type="radio" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){ $('text{$.id}viewFilterRestrict').setStyle('display', 'block');}"/>作为默认过滤条件<br>
-                            <input type="radio" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){ $('text{$.id}viewFilterRestrict').setStyle('display', 'none');}" checked/>作为自定义过滤数据
+                            <input type="radio" class="restrictFilterInput_vf" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                                $('text{$.id}viewFilterRestrict').setStyle('display', 'block');
+                            }"/>作为默认过滤条件<br>
+                            <input type="radio" class="customFilterInput_vf" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                                $('text{$.id}viewFilterRestrict').setStyle('display', 'none');
+                            }" checked/>作为自定义过滤数据
                         </td>
                     </tr>
                 </table>
                 <table id="text{$.id}viewFilterRestrict" style="display: none" width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
                     <tr>
                         <td class="editTableTitle">逻辑:</td>
-                        <td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+                        <td class="editTableValue"><select class="logicInput_vf">
+                            <option selected value="and">并且(and)</option>
+                            <option value="or">或者(or)</option>
+                        </select></td>
                     </tr>
 
                     <tr>
                         <td class="editTableTitle">比较:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="comparisonInput_vf">
                             <option value="equals" selected>等于(==)</option>
                             <option value="notEquals">不等于(!=)</option>
                             <option value="greaterThan">大于(>)</option>
@@ -303,10 +310,10 @@
                     <tr>
                         <td class="editTableTitle">值:</td>
                         <td class="editTableValue">
-                            <input type="text" class="editTableInput" style="display: block"/>
-                            <input type="number" class="editTableInput" style="display: none"/>
-                            <input type="text" class="editTableInput" style="display: none" readonly/>
-                            <select style="display: none">
+                            <input type="text" class="editTableInput valueTextInput_vf" style="display: block"/>
+                            <input type="number" class="editTableInput valueNumberInput_vf" style="display: none"/>
+                            <input type="text" class="editTableInput valueDatetimeInput_vf" style="display: none" readonly/>
+                            <select class="valueBooleanInput_vf" style="display: none">
                                 <option value="true" selected>是(True)</option>
                                 <option value="false">否(False)</option>
                             </select>
@@ -314,11 +321,11 @@
                     </tr>
                 </table>
             </div>
-            <div></div>
+            <div class="actionAreaNode_vf"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="listAreaNode_vf" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="fieldListAreaNode_vf" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
         </div>
     </div>
 

o2web/source/x_component_process_ViewDesigner/widget/ViewFilter.js

@@ -67,34 +67,32 @@ MWF.xApplication.process.ViewDesigner.widget.ViewFilter = new Class({
     },
 
     getInputNodes: function(){
-        this.inputAreaNode = this.node.getFirst("div");
-        this.actionAreaNode = this.inputAreaNode.getNext().setStyles(this.css.actionAreaNode);
-        this.listAreaNode = this.actionAreaNode.getNext().getNext();
-        this.fieldListAreaNode = this.listAreaNode.getNext().getNext();
-        this.restrictViewFilterTable = this.inputAreaNode.getLast("table");
+        this.inputAreaNode = this.node.getElement(".inputAreaNode_vf");
+        this.actionAreaNode = this.node.getElement(".actionAreaNode_vf");
+        this.actionAreaNode.setStyles( this.css.actionAreaNode );
+        this.listAreaNode = this.node.getElement(".listAreaNode_vf");
+        this.fieldListAreaNode = this.node.getElement(".fieldListAreaNode_vf");
 
-        var selects = this.inputAreaNode.getElements("select");
-        var inputs = this.inputAreaNode.getElements("input");
+        this.restrictViewFilterTable = this.node.getElement(".restrictViewFilterTable_vf");
 
         var scriptValueArea = this.node.getElement(".MWFFilterFormulaArea");
         if (scriptValueArea){
             this.createScriptArea(scriptValueArea);
         }
 
+        this.titleInput = this.inputAreaNode.getElement(".titleInput_vf");
+        this.pathInput = this.inputAreaNode.getElement(".pathInput_vf");
+        this.datatypeInput = this.inputAreaNode.getElement(".datatypeInput_vf");
 
-        this.titleInput = inputs[0];
-        this.pathInput = inputs[1];
-        this.datatypeInput = selects[0];
+        this.restrictFilterInput = this.inputAreaNode.getElement(".restrictFilterInput_vf");
+        this.customFilterInput = this.inputAreaNode.getElement(".customFilterInput_vf");
 
-        this.restrictFilterInput = inputs[2];
-        this.customFilterInput = inputs[3];
-
-        this.logicInput = selects[1];
-        this.comparisonInput = selects[2];
-        this.valueTextInput = inputs[4];
-        this.valueNumberInput = inputs[5];
-        this.valueDatetimeInput = inputs[6];
-        this.valueBooleanInput = selects[3];
+        this.logicInput = this.inputAreaNode.getElement(".logicInput_vf");
+        this.comparisonInput = this.inputAreaNode.getElement(".comparisonInput_vf");
+        this.valueTextInput = this.inputAreaNode.getElement(".valueTextInput_vf");
+        this.valueNumberInput = this.inputAreaNode.getElement(".valueNumberInput_vf");
+        this.valueDatetimeInput = this.inputAreaNode.getElement(".valueDatetimeInput_vf");
+        this.valueBooleanInput = this.inputAreaNode.getElement(".valueBooleanInput_vf");
 
         MWF.require("MWF.widget.Calendar", function(){
             this.calendar = new MWF.widget.Calendar(this.valueDatetimeInput, {
@@ -117,6 +115,58 @@ MWF.xApplication.process.ViewDesigner.widget.ViewFilter = new Class({
             if (e.code==13) this.modifyOrAddFilterItem();
         }.bind(this));
     },
+
+    // getInputNodes: function(){
+    //     this.inputAreaNode = this.node.getFirst("div");
+    //     this.actionAreaNode = this.inputAreaNode.getNext().setStyles(this.css.actionAreaNode);
+    //     this.listAreaNode = this.actionAreaNode.getNext().getNext();
+    //     this.fieldListAreaNode = this.listAreaNode.getNext().getNext();
+    //     this.restrictViewFilterTable = this.inputAreaNode.getLast("table");
+    //
+    //     var selects = this.inputAreaNode.getElements("select");
+    //     var inputs = this.inputAreaNode.getElements("input");
+    //
+    //     var scriptValueArea = this.node.getElement(".MWFFilterFormulaArea");
+    //     if (scriptValueArea){
+    //         this.createScriptArea(scriptValueArea);
+    //     }
+    //
+    //
+    //     this.titleInput = inputs[0];
+    //     this.pathInput = inputs[1];
+    //     this.datatypeInput = selects[0];
+    //
+    //     this.restrictFilterInput = inputs[2];
+    //     this.customFilterInput = inputs[3];
+    //
+    //     this.logicInput = selects[1];
+    //     this.comparisonInput = selects[2];
+    //     this.valueTextInput = inputs[4];
+    //     this.valueNumberInput = inputs[5];
+    //     this.valueDatetimeInput = inputs[6];
+    //     this.valueBooleanInput = selects[3];
+    //
+    //     MWF.require("MWF.widget.Calendar", function(){
+    //         this.calendar = new MWF.widget.Calendar(this.valueDatetimeInput, {
+    //             "style": "xform",
+    //             "isTime": true,
+    //             "secondEnable" : true,
+    //             "target": this.app.content,
+    //             "format": "db"
+    //         });
+    //     }.bind(this));
+    //
+    //     this.datatypeInput.addEvent("change", function(){
+    //         this.changeValueInput();
+    //     }.bind(this));
+    //
+    //     this.valueTextInput.addEvent("keydown", function(e){
+    //         if (e.code==13) this.modifyOrAddFilterItem();
+    //     }.bind(this));
+    //     this.valueNumberInput.addEvent("keydown", function(e){
+    //         if (e.code==13) this.modifyOrAddFilterItem();
+    //     }.bind(this));
+    // },
     changeValueInput: function(){
         var type = this.datatypeInput.options[this.datatypeInput.selectedIndex].value;
         switch (type){

o2web/source/x_component_process_Xform/View.js

@@ -59,6 +59,7 @@ MWF.xApplication.process.Xform.View = MWF.APPView =  new Class({
             "titleStyles": this.json.titleStyles,
             "itemStyles": this.json.itemStyles,
             "isExpand": this.json.isExpand || "no",
+            "showActionbar" : this.json.actionbar === "show",
             "filter": filter
         };
 
@@ -102,6 +103,7 @@ MWF.xApplication.process.Xform.View = MWF.APPView =  new Class({
             "titleStyles": this.json.titleStyles,
             "itemStyles": this.json.itemStyles,
             "isExpand": this.json.isExpand || "no",
+            "showActionbar" : this.json.actionbar === "show",
             "filter": filter
         };
         MWF.xDesktop.requireApp("process.Application", "Viewer", function(){
@@ -131,6 +133,7 @@ MWF.xApplication.process.Xform.View = MWF.APPView =  new Class({
             "titleStyles": this.json.titleStyles,
             "itemStyles": this.json.itemStyles,
             "isExpand": this.json.isExpand || "no",
+            "showActionbar" : this.json.actionbar === "show",
             "filter": filter
         };
 

o2web/source/x_component_process_Xform/ViewSelector.js

@@ -68,6 +68,7 @@ MWF.xApplication.process.Xform.ViewSelector = MWF.APPViewSelector =  new Class({
                 "titleStyles": this.json.titleStyles,
                 "itemStyles": this.json.itemStyles,
                 "isExpand": this.json.isExpand || "no",
+                "showActionbar" : this.json.actionbar === "show",
                 "filter": filter
             };
             var options = {};
@@ -175,6 +176,7 @@ MWF.xApplication.process.Xform.ViewSelector = MWF.APPViewSelector =  new Class({
                 "titleStyles": this.json.titleStyles,
                 "itemStyles": this.json.itemStyles,
                 "isExpand": this.json.isExpand || "no",
+                "showActionbar" : this.json.actionbar === "show",
                 "filter": filter
             };
             var options = {};
@@ -279,11 +281,12 @@ MWF.xApplication.process.Xform.ViewSelector = MWF.APPViewSelector =  new Class({
                 "titleStyles": this.json.titleStyles,
                 "itemStyles": this.json.itemStyles,
                 "isExpand": this.json.isExpand || "no",
+                "showActionbar" : this.json.actionbar === "show",
                 "filter": filter
             };
             var options = {};
-            var width = options.width || "800";
-            var height = options.height || "600";
+            var width = options.width || "850";
+            var height = options.height || "700";
 
             if (layout.mobile){
                 var size = document.body.getSize();

o2web/source/x_component_query_Query/$Viewer/default/css.wcss

@@ -16,11 +16,11 @@
         "overflow": "hidden"
     },
     "viewPageNode": {
-        "height": "80px"
+//        "height": "80px"
     },
     "viewPageAreaNode": {
-        "height": "24px",
-        "margin-top": "28px"
+//        "height": "24px",
+//        "margin-top": "28px"
     },
     "viewPageContentNode": {
         "float": "left",

o2web/source/x_component_query_Query/$Viewer/select/css.wcss

@@ -13,11 +13,11 @@
     },
 
     "viewPageNode": {
-        "padding-top": "10px",
-        "height": "30px"
+//        "padding-top": "10px",
+//        "height": "30px"
     },
     "viewPageAreaNode": {
-        "height": "24px"
+//        "height": "24px"
         //"margin-top": "28px"
     },
     "viewPageContentNode": {

o2web/source/x_component_query_Query/Viewer.js

@@ -9,6 +9,7 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
     Extends: MWF.widget.Common,
     options: {
         "style": "default",
+        "skin" : null,
         "resizeNode": true,
         "paging" : "scroll",
         "perPageCount" : 50,
@@ -44,7 +45,6 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
 
         this.parentMacro = parentMacro;
 
-        debugger;
         this.originalJson = Object.clone(json);
 
         this.viewJson = null;
@@ -107,12 +107,12 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
     },
     loadLayout: function(){
         this.node = new Element("div", {"styles": this.css.node}).inject(this.container);
-        this.actionbarAreaNode =  new Element("div", {"styles": this.css.actionbarAreaNode}).inject(this.node);
+        this.actionbarAreaNode =  new Element("div.actionbarAreaNode", {"styles": this.css.actionbarAreaNode}).inject(this.node);
         //if (this.options.export) this.exportAreaNode = new Element("div", {"styles": this.css.exportAreaNode}).inject(this.node);
         this.searchAreaNode = new Element("div", {"styles": this.css.searchAreaNode}).inject(this.node);
         this.viewAreaNode = new Element("div", {"styles": this.css.viewAreaNode}).inject(this.node);
-        this.viewPageNode = new Element("div", {"styles": this.css.viewPageNode}).inject(this.node);
-        this.viewPageAreaNode = new Element("div", {"styles": this.css.viewPageAreaNode}).inject(this.viewPageNode);
+        // this.viewPageNode = new Element("div", {"styles": this.css.viewPageNode}).inject(this.node);
+        this.viewPageAreaNode = new Element("div", {"styles": this.css.viewPageAreaNode}).inject(this.node);
     },
     loadMacro: function (callback) {
         MWF.require("MWF.xScript.Macro", function () {
@@ -168,7 +168,7 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
             var exportSize = this.actionbarAreaNode.getComputedSize();
             h = h-exportSize.totalHeight;
         }
-        var pageSize = this.viewPageNode.getComputedSize();
+        var pageSize = this.viewPageAreaNode.getComputedSize();
         h = h-pageSize.totalHeight;
         this.viewAreaNode.setStyle("height", ""+h+"px");
     },
@@ -182,6 +182,7 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
     },
     createActionbarNode : function(){
         this.actionbarAreaNode.empty();
+        if( typeOf(this.json.showActionbar) === "boolean" && this.json.showActionbar !== true )return;
         if( typeOf( this.viewJson.actionbarHidden ) === "boolean" ){
             if( this.viewJson.actionbarHidden === true || !this.viewJson.actionbarList || !this.viewJson.actionbarList.length )return;
             this.actionbar = new MWF.xApplication.query.Query.Viewer.Actionbar(this.actionbarAreaNode, this.viewJson.actionbarList[0], this, {});
@@ -192,7 +193,12 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
     },
     createViewNode: function(data){
         this.viewAreaNode.empty();
-        this.contentAreaNode = new Element("div", {"styles": this.css.contentAreaNode}).inject(this.viewAreaNode);
+
+        var viewStyles = this.viewJson.viewStyles;
+
+        this.contentAreaNode = new Element("div", {"styles":
+                (viewStyles && viewStyles["container"]) ? viewStyles["container"] : this.css.contentAreaNode
+        }).inject(this.viewAreaNode);
 
         this.viewTable = new Element("table", {
             "styles": this.css.viewTitleTableNode,
@@ -200,14 +206,22 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
             "cellPadding": "0",
             "cellSpacing": "0"
         }).inject(this.contentAreaNode);
+        if( viewStyles ){
+            if( viewStyles["tableProperties"] )this.viewTable.set(viewStyles["tableProperties"]);
+            if( viewStyles["table"] )this.viewTable.setStyles(viewStyles["table"]);
+        }
+
         this.createLoadding();
 
+        var viewTitleCellNode = (viewStyles && viewStyles["titleTd"]) ? viewStyles["titleTd"] : this.css.viewTitleCellNode;
         if (this.json.isTitle!=="no"){
-            this.viewTitleLine = new Element("tr", {"styles": this.css.viewTitleLineNode}).inject(this.viewTable);
+            this.viewTitleLine = new Element("tr", {
+                "styles": (viewStyles && viewStyles["titleTr"]) ? viewStyles["titleTr"] : this.css.viewTitleLineNode
+            }).inject(this.viewTable);
 
             //if (this.json.select==="single" || this.json.select==="multi") {
             this.selectTitleCell = new Element("td", {
-                "styles": this.css.viewTitleCellNode
+                "styles": viewTitleCellNode
             }).inject(this.viewTitleLine);
             this.selectTitleCell.setStyle("width", "10px");
             if (this.json.titleStyles) this.selectTitleCell.setStyles(this.json.titleStyles);
@@ -216,7 +230,7 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
             //序号
             if (this.viewJson.isSequence==="yes"){
                 this.sequenceTitleCell = new Element("td", {
-                    "styles": this.css.viewTitleCellNode
+                    "styles": viewTitleCellNode
                 }).inject(this.viewTitleLine);
                 this.sequenceTitleCell.setStyle("width", "10px");
                 if (this.json.titleStyles) this.sequenceTitleCell.setStyles(this.json.titleStyles);
@@ -228,10 +242,10 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
 
                 if (!column.hideColumn){
                     var viewCell = new Element("td", {
-                        "styles": this.css.viewTitleCellNode,
+                        "styles": viewTitleCellNode,
                         "text": column.displayName
                     }).inject(this.viewTitleLine);
-                    var size = MWF.getTextSize(column.displayName, this.css.viewTitleCellNode);
+                    var size = MWF.getTextSize(column.displayName, viewTitleCellNode);
                     viewCell.setStyle("min-width", ""+size.x+"px");
                     if (this.json.titleStyles) viewCell.setStyles(this.json.titleStyles);
                 }else{
@@ -320,36 +334,21 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
     // },
     _loadPageNode : function(){
         this.viewPageAreaNode.empty();
-        this.paging = new o2.widget.Paging(this.viewPageAreaNode, {
-            countPerPage: this.json.pageSize || this.options.perPageCount,
-            visiblePages: this.viewJson.visiblePages ? this.viewJson.visiblePages.toInt() : 9,
-            currentPage: this.currentPage,
-            itemSize: this.count,
-            pageSize: this.pages,
-            hasNextPage: typeOf( this.viewJson.hasPreNextPage ) === "boolean" ? this.viewJson.hasPreNextPage : true,
-            hasPrevPage: typeOf( this.viewJson.hasPreNextPage ) === "boolean" ? this.viewJson.hasPreNextPage : true,
-            hasTruningBar: typeOf( this.viewJson.hasTruningBar ) === "boolean" ? this.viewJson.hasTruningBar : true,
-            hasBatchTuring: typeOf( this.viewJson.hasBatchTuring ) === "boolean" ? this.viewJson.hasBatchTuring : true,
-            hasFirstPage: typeOf( this.viewJson.hasFirstLastPage ) === "boolean" ? this.viewJson.hasFirstLastPage : true,
-            hasLastPage: typeOf( this.viewJson.hasFirstLastPage ) === "boolean" ? this.viewJson.hasFirstLastPage : true,
-            hasJumper: typeOf( this.viewJson.hasPageJumper ) === "boolean" ? this.viewJson.hasPageJumper : true,
-            hiddenWithDisable: false,
-            hiddenWithNoItem: true,
-            text: {
-                prePage: "",
-                nextPage: "",
-                firstPage: this.lp.firstPage,
-                lastPage: this.lp.lastPage
-            },
-            onJumpingPage : function( pageNum, itemNum ){
-                this.currentPage = pageNum;
-                this.loadCurrentPageData();
-            }.bind(this),
-            onPostLoad : function () {
-                if(this.setContentHeightFun)this.setContentHeightFun();
-            }.bind(this)
-        });
-        this.paging.load();
+        if( !this.paging ){
+            var json;
+            if( !this.viewJson.pagingList || !this.viewJson.pagingList.length ){
+                json = {
+                    "firstPageText": this.lp.firstPage,
+                    "lastPageText": this.lp.lastPage
+                };
+            }else{
+                json = this.viewJson.pagingList[0];
+            }
+            this.paging = new MWF.xApplication.query.Query.Viewer.Paging(this.viewPageAreaNode, json, this, {});
+            this.paging.load();
+        }else{
+            this.paging.reload();
+        }
     },
     _initPage: function(){
         this.count = this.bundleItems.length;
@@ -478,11 +477,20 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
         }
     },
     loadGroupData: function(){
-        if (this.selectTitleCell){
-            this.selectTitleCell.set("html", "<span style='font-family: Webdings'>"+"<img src='/x_component_query_Query/$Viewer/"+this.options.style+"/icon/expand.png'/>"+"</span>");
+        if (this.selectTitleCell && !this.selectTitleCell.retrieve("expandLoaded") ){
+            if( this.viewJson.viewStyles && this.viewJson.viewStyles["groupCollapseNode"] ){
+                this.expandAllNode = new Element("span", {
+                    styles : this.viewJson.viewStyles["groupCollapseNode"]
+                }).inject( this.selectTitleCell );
+                this.selectTitleCell.setStyle("cursor", "pointer");
+            }else{
+                this.selectTitleCell.set("html", "<span style='font-family: Webdings'>"+"<img src='/x_component_query_Query/$Viewer/"+this.options.style+"/icon/expand.png'/>"+"</span>");
+            }
             this.selectTitleCell.setStyle("cursor", "pointer");
             this.selectTitleCell.addEvent("click", this.expandOrCollapseAll.bind(this));
+            this.selectTitleCell.store("expandLoaded", true);
         }
+        this.expandAll = false;
 
         if (this.gridJson.length){
             var i = 0;
@@ -497,20 +505,42 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
         }
     },
     expandOrCollapseAll: function(){
-        var icon = this.selectTitleCell.getElement("span");
-        if (icon.get("html").indexOf("expand.png")===-1){
-            this.items.each(function(item){
-                item.collapse();
-                icon.set("html", "<img src='/x_component_query_Query/$Viewer/"+this.options.style+"/icon/expand.png'/>");
-            }.bind(this));
+        if( this.viewJson.viewStyles && this.viewJson.viewStyles["groupCollapseNode"] ){
+            var span = this.selectTitleCell.getElement("span");
+            if( this.expandAll ){
+                this.items.each(function(item){
+                    item.collapse();
+                    span.setStyles( this.viewJson.viewStyles["groupCollapseNode"] );
+                }.bind(this));
+                this.expandAll = false;
+            }else{
+                this.items.each(function(item, i){
+                    window.setTimeout(function(){
+                        item.expand();
+                    }.bind(this), 10*i+5);
+
+                    span.setStyles( this.viewJson.viewStyles["groupExpandNode"] );
+                    this.expandAll = true;
+                }.bind(this));
+            }
         }else{
-            this.items.each(function(item, i){
-                window.setTimeout(function(){
-                    item.expand();
-                }.bind(this), 10*i+5);
+            var icon = this.selectTitleCell.getElement("span");
+            if (icon.get("html").indexOf("expand.png")===-1){
+                this.items.each(function(item){
+                    item.collapse();
+                    icon.set("html", "<img src='/x_component_query_Query/$Viewer/"+this.options.style+"/icon/expand.png'/>");
+                }.bind(this));
+                this.expandAll = false;
+            }else{
+                this.items.each(function(item, i){
+                    window.setTimeout(function(){
+                        item.expand();
+                    }.bind(this), 10*i+5);
 
-                icon.set("html", "<img src='/x_component_query_Query/$Viewer/"+this.options.style+"/icon/down.png'/>");
-            }.bind(this));
+                    icon.set("html", "<img src='/x_component_query_Query/$Viewer/"+this.options.style+"/icon/down.png'/>");
+                }.bind(this));
+                this.expandAll = true;
+            }
         }
     },
     getView: function(callback){
@@ -772,6 +802,7 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
         }
     },
     loadCustomSearch: function(){
+        debugger;
         this.viewSearchIconNode.setStyle("display", "none");
         this.viewSearchInputBoxNode.setStyle("display", "none");
         this.viewSearchCustomActionNode.setStyle("display", "none");
@@ -794,7 +825,7 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
                 this.loadCustomSearchContent();
             }
 
-            this.setContentHeightFun();
+            if(this.setContentHeightFun)this.setContentHeightFun();
         }.bind(this));
         this.searchCustomView();
     },
@@ -1030,7 +1061,7 @@ MWF.xApplication.query.Query.Viewer = MWF.QViewer = new Class({
                 this.viewSearchInputBoxNode.setStyle("display", "block");
                 this.viewSearchCustomActionNode.setStyle("display", "block");
 
-                this.setContentHeightFun();
+                if(this.setContentHeightFun)this.setContentHeightFun();
             }.bind(this));
             this.createViewNode({"filterList": this.json.filter ? this.json.filter.clone() : null});
         }
@@ -1219,7 +1250,12 @@ MWF.xApplication.query.Query.Viewer.Item = new Class({
     load: function(){
         this.view.fireEvent("queryLoadItemRow", [null, this]);
 
-        this.node = new Element("tr", {"styles": this.css.viewContentTrNode});
+        var viewStyles = this.view.viewJson.viewStyles;
+        var viewContentTdNode = ( viewStyles && viewStyles["contentTd"] ) ? viewStyles["contentTd"] : this.css.viewContentTdNode;
+
+        this.node = new Element("tr", {
+            "styles": ( viewStyles && viewStyles["contentTr"] ) ? viewStyles["contentTr"] : this.css.viewContentTrNode
+        });
         if (this.prev){
             this.node.inject(this.prev.node, "after");
         }else{
@@ -1227,14 +1263,14 @@ MWF.xApplication.query.Query.Viewer.Item = new Class({
         }
 
         //if (this.view.json.select==="single" || this.view.json.select==="multi"){
-        this.selectTd = new Element("td", {"styles": this.css.viewContentTdNode}).inject(this.node);
+        this.selectTd = new Element("td", { "styles": viewContentTdNode }).inject(this.node);
         this.selectTd.setStyles({"cursor": "pointer"});
         if (this.view.json.itemStyles) this.selectTd.setStyles(this.view.json.itemStyles);
         //}
 
         //序号
         if (this.view.viewJson.isSequence==="yes"){
-            this.sequenceTd = new Element("td", {"styles": this.css.viewContentTdNode}).inject(this.node);
+            this.sequenceTd = new Element("td", {"styles": viewContentTdNode}).inject(this.node);
             this.sequenceTd.setStyle("width", "10px");
             var s= 1+this.view.json.pageSize*(this.view.currentPage-1)+this.idx;
             this.sequenceTd.set("text", s);
@@ -1245,7 +1281,7 @@ MWF.xApplication.query.Query.Viewer.Item = new Class({
             if (cell === undefined) cell = "";
             //if (cell){
             if (this.view.hideColumns.indexOf(k)===-1){
-                var td = new Element("td", {"styles": this.css.viewContentTdNode}).inject(this.node);
+                var td = new Element("td", {"styles": viewContentTdNode}).inject(this.node);
                 if (k!== this.view.viewJson.group.column){
                     //var v = (this.view.entries[k].code) ? MWF.Macro.exec(this.view.entries[k].code, {"value": cell, "gridData": this.view.gridJson, "data": this.view.viewData, "entry": this.data}) : cell;
                     var v = cell;
@@ -1447,9 +1483,18 @@ MWF.xApplication.query.Query.Viewer.Item = new Class({
             this.node.addEvents({
                 "mouseover": function(){
                     if (!this.isSelected){
-                        var iconName = "checkbox";
-                        if (flag==="single") iconName = "radiobox";
-                        this.selectTd.setStyles({"background": "url("+"/x_component_query_Query/$Viewer/default/icon/"+iconName+".png) center center no-repeat"});
+                        var viewStyles = this.view.viewJson.viewStyles;
+                        if( viewStyles ){
+                            if( flag === "single" ){
+                                this.selectTd.setStyles( viewStyles["radioNode"] );
+                            }else{
+                                this.selectTd.setStyles( viewStyles["checkboxNode"] );
+                            }
+                        }else{
+                            var iconName = "checkbox";
+                            if (flag==="single") iconName = "radiobox";
+                            this.selectTd.setStyles({"background": "url("+"/x_component_query_Query/$Viewer/default/icon/"+iconName+".png) center center no-repeat"});
+                        }
                     }
                 }.bind(this),
                 "mouseout": function(){
@@ -1480,15 +1525,26 @@ MWF.xApplication.query.Query.Viewer.Item = new Class({
 
     selected: function(){
         this.view.selectedItems.push(this);
-        this.selectTd.setStyles({"background": "url("+"/x_component_query_Query/$Viewer/default/icon/checkbox_checked.png) center center no-repeat"});
-        this.node.setStyles(this.css.viewContentTrNode_selected);
+        var viewStyles = this.view.viewJson.viewStyles;
+        if( viewStyles ){
+            this.selectTd.setStyles( viewStyles["checkedCheckboxNode"] );
+            this.node.setStyles( viewStyles["contentSelectedTr"] );
+        }else{
+            this.selectTd.setStyles({"background": "url("+"/x_component_query_Query/$Viewer/default/icon/checkbox_checked.png) center center no-repeat"});
+            this.node.setStyles(this.css.viewContentTrNode_selected);
+        }
         this.isSelected = true;
         this.view.fireEvent("selectRow", [this]);
     },
     unSelected: function(){
         this.view.selectedItems.erase(this);
         this.selectTd.setStyles({"background": "transparent"});
-        this.node.setStyles(this.css.viewContentTrNode);
+        var viewStyles = this.view.viewJson.viewStyles;
+        if( viewStyles ){
+            this.node.setStyles( viewStyles["contentTr"] );
+        }else{
+            this.node.setStyles(this.css.viewContentTrNode);
+        }
         this.isSelected = false;
         this.view.fireEvent("unselectRow", [this]);
     },
@@ -1496,8 +1552,14 @@ MWF.xApplication.query.Query.Viewer.Item = new Class({
         if (this.view.currentSelectedItem) this.view.currentSelectedItem.unSelectedSingle();
         this.view.selectedItems = [this];
         this.view.currentSelectedItem = this;
-        this.selectTd.setStyles({"background": "url("+"/x_component_query_Query/$Viewer/default/icon/radiobox_checked.png) center center no-repeat"});
-        this.node.setStyles(this.css.viewContentTrNode_selected);
+        var viewStyles = this.view.viewJson.viewStyles;
+        if( viewStyles ){
+            this.selectTd.setStyles( viewStyles["checkedRadioNode"] );
+            this.node.setStyles( viewStyles["contentSelectedTr"] );
+        }else {
+            this.selectTd.setStyles({"background": "url(" + "/x_component_query_Query/$Viewer/default/icon/radiobox_checked.png) center center no-repeat"});
+            this.node.setStyles(this.css.viewContentTrNode_selected);
+        }
         this.isSelected = true;
         this.view.fireEvent("selectRow", [this]);
     },
@@ -1505,7 +1567,12 @@ MWF.xApplication.query.Query.Viewer.Item = new Class({
         this.view.selectedItems = [];
         this.view.currentSelectedItem = null;
         this.selectTd.setStyles({"background": "transparent"});
-        this.node.setStyles(this.css.viewContentTrNode);
+        var viewStyles = this.view.viewJson.viewStyles;
+        if( viewStyles ){
+            this.node.setStyles( viewStyles["contentTr"] );
+        }else{
+            this.node.setStyles(this.css.viewContentTrNode);
+        }
         this.isSelected = false;
         this.view.fireEvent("unselectRow", [this]);
     }
@@ -1525,13 +1592,19 @@ MWF.xApplication.query.Query.Viewer.ItemCategory = new Class({
     load: function(){
         this.view.fireEvent("queryLoadCategoryRow", [null, this]);
 
-        this.node = new Element("tr", {"styles": this.css.viewContentTrNode}).inject(this.view.viewTable);
+        var viewStyles = this.view.viewJson.viewStyles;
+
+        var viewContentCategoryTdNode = ( viewStyles && viewStyles["contentGroupTd"] ) ? viewStyles["contentGroupTd"] : this.css.viewContentCategoryTdNode;
+
+        this.node = new Element("tr", {
+            "styles": (viewStyles && viewStyles["contentTr"]) ? viewStyles["contentTr"] : this.css.viewContentTrNode
+        }).inject(this.view.viewTable);
         //if (this.view.json.select==="single" || this.view.json.select==="multi"){
-        this.selectTd = new Element("td", {"styles": this.css.viewContentCategoryTdNode}).inject(this.node);
+        this.selectTd = new Element("td", {"styles": viewContentCategoryTdNode}).inject(this.node);
         if (this.view.json.itemStyles) this.selectTd.setStyles(this.view.json.itemStyles);
         //}
         this.categoryTd = new Element("td", {
-            "styles": this.css.viewContentCategoryTdNode,
+            "styles": viewContentCategoryTdNode,
             "colspan": this.view.viewJson.selectList.length+1
         }).inject(this.node);
 
@@ -1549,7 +1622,16 @@ MWF.xApplication.query.Query.Viewer.ItemCategory = new Class({
             var text = this.data.group;
         }
 
-        this.categoryTd.set("html", "<span style='font-family: Webdings'><img src='/x_component_query_Query/$Viewer/"+this.view.options.style+"/icon/expand.png'/></span> "+text);
+        if( viewStyles && viewStyles["groupCollapseNode"] ){
+            this.expandNode = new Element("span", {
+                styles : viewStyles["groupCollapseNode"]
+            }).inject( this.categoryTd );
+            new Element("span", { text : text }).inject( this.categoryTd );
+            // this.categoryTd.set("text", text );
+        }else{
+            this.categoryTd.set("html", "<span style='font-family: Webdings'><img src='/x_component_query_Query/$Viewer/"+this.view.options.style+"/icon/expand.png'/></span> "+text);
+        }
+        this.expanded = false;
         if (this.view.json.itemStyles) this.categoryTd.setStyles(this.view.json.itemStyles);
 
         this.setEvent();
@@ -1564,8 +1646,13 @@ MWF.xApplication.query.Query.Viewer.ItemCategory = new Class({
         //}
     },
     expandOrCollapse: function(){
-        var t = this.node.getElement("span").get("html");
-        if (t.indexOf("expand.png")===-1){
+        // var t = this.node.getElement("span").get("html");
+        // if (t.indexOf("expand.png")===-1){
+        //     this.collapse();
+        // }else{
+        //     this.expand();
+        // }
+        if( this.expanded ){
             this.collapse();
         }else{
             this.expand();
@@ -1575,13 +1662,23 @@ MWF.xApplication.query.Query.Viewer.ItemCategory = new Class({
         this.items.each(function(item){
             item.node.setStyle("display", "none");
         }.bind(this));
-        this.node.getElement("span").set("html", "<img src='/x_component_query_Query/$Viewer/"+this.view.options.style+"/icon/expand.png'/>");
+        if( this.expandNode ){
+            this.expandNode.setStyles( this.view.viewJson.viewStyles["groupCollapseNode"] )
+        }else{
+            this.node.getElement("span").set("html", "<img src='/x_component_query_Query/$Viewer/"+this.view.options.style+"/icon/expand.png'/>");
+        }
+        this.expanded = false;
     },
     expand: function(){
         this.items.each(function(item){
             item.node.setStyle("display", "table-row");
         }.bind(this));
-        this.node.getElement("span").set("html", "<img src='/x_component_query_Query/$Viewer/"+this.view.options.style+"/icon/down.png'/>");
+        if( this.expandNode ){
+            this.expandNode.setStyles( this.view.viewJson.viewStyles["groupExpandNode"] )
+        }else{
+            this.node.getElement("span").set("html", "<img src='/x_component_query_Query/$Viewer/"+this.view.options.style+"/icon/down.png'/>");
+        }
+        this.expanded = true;
         if (!this.loadChild){
             //window.setTimeout(function(){
             this.data.list.each(function(line, i){
@@ -1891,7 +1988,7 @@ MWF.xApplication.query.Query.Viewer.Actionbar = new Class({
                 "MWFnodetype": tool.type,
                 //"MWFButtonImage": this.form.path+""+this.form.options.style+"/actionbar/"+tool.img,
                 //"MWFButtonImage": path+(this.options.style||"default") +"/tools/"+ (this.json.style || "default") +"/"+tool.img,
-                "MWFButtonImage": path+this.options.style+"/actionbar/"+tool.img,
+                "MWFButtonImage": path+this.options.style+"/actionbar/"+ ( this.json.iconStyle || "default" ) +"/"+tool.img,
                 "title": tool.title,
                 "MWFButtonAction": tool.action,
                 "MWFButtonText": tool.text
@@ -1924,4 +2021,178 @@ MWF.xApplication.query.Query.Viewer.Actionbar = new Class({
     deleteWork: function(){
         this.form.deleteWork();
     }
+});
+
+MWF.xApplication.query.Query.Viewer.Paging = new Class({
+    Implements: [Events],
+    options: {
+        "style" : "default",
+        "moduleEvents": ["load", "queryLoad", "postLoad", "afterLoad","jump"]
+    },
+    initialize: function(node, json, form, options){
+        this.node = $(node);
+        this.node.store("module", this);
+        this.json = json;
+        this.form = form;
+        this.view = form;
+    },
+    hide: function(){
+        var dsp = this.node.getStyle("display");
+        if (dsp!=="none") this.node.store("mwf_display", dsp);
+        this.node.setStyle("display", "none");
+    },
+    show: function(){
+        var dsp = this.node.retrieve("mwf_display", dsp);
+        this.node.setStyle("display", dsp);
+    },
+    load: function(){
+
+        this._loadModuleEvents();
+        if (this.fireEvent("queryLoad")){
+            //this._queryLoaded();
+            this._loadUserInterface();
+            this._loadStyles();
+            this._loadDomEvents();
+            //this._loadEvents();
+
+            //this._afterLoaded();
+            this.fireEvent("postLoad");
+        }
+    },
+
+    _loadStyles: function(){
+        if (this.json.styles) Object.each(this.json.styles, function(value, key){
+            if ((value.indexOf("x_processplatform_assemble_surface")!=-1 || value.indexOf("x_portal_assemble_surface")!=-1 || value.indexOf("x_cms_assemble_control")!=-1)){
+                var host1 = MWF.Actions.getHost("x_processplatform_assemble_surface");
+                var host2 = MWF.Actions.getHost("x_portal_assemble_surface");
+                var host3 = MWF.Actions.getHost("x_cms_assemble_control");
+                if (value.indexOf("/x_processplatform_assemble_surface")!==-1){
+                    value = value.replace("/x_processplatform_assemble_surface", host1+"/x_processplatform_assemble_surface");
+                }else if (value.indexOf("x_processplatform_assemble_surface")!==-1){
+                    value = value.replace("x_processplatform_assemble_surface", host1+"/x_processplatform_assemble_surface");
+                }
+                if (value.indexOf("/x_portal_assemble_surface")!==-1){
+                    value = value.replace("/x_portal_assemble_surface", host2+"/x_portal_assemble_surface");
+                }else if (value.indexOf("x_portal_assemble_surface")!==-1){
+                    value = value.replace("x_portal_assemble_surface", host2+"/x_portal_assemble_surface");
+                }
+                if (value.indexOf("/x_cms_assemble_control")!==-1){
+                    value = value.replace("/x_cms_assemble_control", host3+"/x_cms_assemble_control");
+                }else if (value.indexOf("x_cms_assemble_control")!==-1){
+                    value = value.replace("x_cms_assemble_control", host3+"/x_cms_assemble_control");
+                }
+            }
+            this.node.setStyle(key, value);
+        }.bind(this));
+
+        // if (["x_processplatform_assemble_surface", "x_portal_assemble_surface"].indexOf(root.toLowerCase())!==-1){
+        //     var host = MWF.Actions.getHost(root);
+        //     return (flag==="/") ? host+this.json.template : host+"/"+this.json.template
+        // }
+        //if (this.json.styles) this.node.setStyles(this.json.styles);
+    },
+    _loadModuleEvents : function(){
+        Object.each(this.json.events, function(e, key){
+            if (e.code){
+                if (this.options.moduleEvents.indexOf(key)!==-1){
+                    this.addEvent(key, function(event){
+                        return this.form.Macro.fire(e.code, this, event);
+                    }.bind(this));
+                }
+            }
+        }.bind(this));
+    },
+    _loadDomEvents: function(){
+        Object.each(this.json.events, function(e, key){
+            if (e.code){
+                if (this.options.moduleEvents.indexOf(key)===-1){
+                    this.node.addEvent(key, function(event){
+                        return this.form.Macro.fire(e.code, this, event);
+                    }.bind(this));
+                }
+            }
+        }.bind(this));
+    },
+    _loadEvents: function(){
+        Object.each(this.json.events, function(e, key){
+            if (e.code){
+                if (this.options.moduleEvents.indexOf(key)!==-1){
+                    this.addEvent(key, function(event){
+                        return this.form.Macro.fire(e.code, this, event);
+                    }.bind(this));
+                }else{
+                    this.node.addEvent(key, function(event){
+                        return this.form.Macro.fire(e.code, this, event);
+                    }.bind(this));
+                }
+            }
+        }.bind(this));
+    },
+    addModuleEvent: function(key, fun){
+        if (this.options.moduleEvents.indexOf(key)!==-1){
+            this.addEvent(key, function(event){
+                return (fun) ? fun(this, event) : null;
+            }.bind(this));
+        }else{
+            this.node.addEvent(key, function(event){
+                return (fun) ? fun(this, event) : null;
+            }.bind(this));
+        }
+    },
+    _loadUserInterface: function(){
+        // if (this.form.json.mode == "Mobile"){
+        //     this.node.empty();
+        // }else if (COMMON.Browser.Platform.isMobile){
+        //     this.node.empty();
+        // }else{
+        this.loadPaging( true )
+    },
+    reload : function(){
+        this.loadPaging( false )
+    },
+    loadPaging : function( firstLoading ){
+        // this.pagingNode = this.node.getFirst("div");
+        // if( !this.pagingNode ){
+        //     this.pagingNode = new Element("div").inject( this.node );
+        // }
+        // this.pagingNode.empty();
+        this.node.empty();
+
+        this.paging = new o2.widget.Paging(this.node, {
+            //style : this.options.skin && this.options.skin.pagingBar ? this.options.skin.pagingBar : "default",
+            countPerPage: this.view.json.pageSize || this.view.options.perPageCount,
+            visiblePages: this.json.visiblePages ? this.json.visiblePages.toInt() : 9,
+            currentPage: this.view.currentPage,
+            itemSize: this.view.count,
+            pageSize: this.view.pages,
+            hasNextPage: typeOf( this.json.hasPreNextPage ) === "boolean" ? this.json.hasPreNextPage : true,
+            hasPrevPage: typeOf( this.json.hasPreNextPage ) === "boolean" ? this.json.hasPreNextPage : true,
+            hasTruningBar: typeOf( this.json.hasTruningBar ) === "boolean" ? this.json.hasTruningBar : true,
+            hasBatchTuring: typeOf( this.json.hasBatchTuring ) === "boolean" ? this.json.hasBatchTuring : true,
+            hasFirstPage: typeOf( this.json.hasFirstLastPage ) === "boolean" ? this.json.hasFirstLastPage : true,
+            hasLastPage: typeOf( this.json.hasFirstLastPage ) === "boolean" ? this.json.hasFirstLastPage : true,
+            hasJumper: typeOf( this.json.hasPageJumper ) === "boolean" ? this.json.hasPageJumper : true,
+            hiddenWithDisable: false,
+            hiddenWithNoItem: true,
+            text: {
+                prePage: this.json.prePageText,
+                nextPage: this.json.nextPageText,
+                firstPage: this.json.firstPageText,
+                lastPage: this.json.lastPageText
+            },
+            onJumpingPage : function( pageNum, itemNum ){
+                this.view.currentPage = pageNum;
+                this.fireEvent("jump");
+                this.view.loadCurrentPageData();
+            }.bind(this),
+            onPostLoad : function () {
+                if( firstLoading ){
+                    if(this.view.setContentHeightFun)this.view.setContentHeightFun();
+                    this.fireEvent("load");
+                }
+                this.fireEvent("afterLoad");
+            }.bind(this)
+        }, this.json.pagingStyles || {});
+        this.paging.load();
+    }
 });

o2web/source/x_component_query_ViewDesigner/$Main/default/toolbars.html

@@ -2,7 +2,7 @@
 	<span MWFnodetype="MWFToolBarSeparator"></span>
 	<span MWFnodetype="MWFToolBarButton" MWFButtonImage="save.gif" title="保存视图" MWFButtonAction="saveView" MWFButtonText=""></span>
 	<span MWFnodetype="MWFToolBarButton" MWFButtonImage="saveNew.gif" title="视图另存为" MWFButtonAction="saveViewAs" MWFButtonText=""></span>
-	
+	<span MWFnodetype="MWFToolBarButton" MWFButtonImage="preview.png" title="预览" MWFButtonAction="preview" MWFButtonText=""></span>
 	<span MWFnodetype="MWFToolBarSeparator"></span>
 	
 	<span MWFnodetype="MWFToolBarButton" MWFButtonImage="formExplode.gif" title="视图导出" MWFButtonAction="viewExplode" MWFButtonText=""></span>

o2web/source/x_component_query_ViewDesigner/$View/default/css.wcss

@@ -2,6 +2,9 @@
     "actionbarNode" : {
         "overflow": "hidden"
     },
+    "pagingNode" : {
+        "overflow": "hidden"
+    },
     "viewAreaNode": {
         "overflow": "hidden"
     },
@@ -108,7 +111,7 @@
         "border": "1px solid #EEE"
     },
     "viewTitleColumnTextNode":{
-        "padding": "0px 10px",
+        "padding": "0px", //"padding": "0px 10px",
         "height": "38px",
         "white-space": "nowrap"
     },
@@ -345,14 +348,37 @@
     },
     "toolbarWarpNode_selected": {
         "background-color": "#FFF",
-//        "height": "38px",
         "border": "1px solid red",
         "white-space": "nowrap"
     },
     "toolbarWarpNode_over": {
         "background-color": "#F9F9F9",
-//        "height": "38px",
         "border": "1px dotted blue",
         "white-space": "nowrap"
     },
+
+    "pagingWarpNode": {
+        "border": "1px dashed #999",
+        "height": "auto",
+        "overflow": "hidden",
+        "display": "block",
+        "-webkit-user-select": "none",
+        "-moz-user-select": "none",
+        "position": "static",
+        "opacity": 1,
+        "width": "auto",
+        "margin": "3px 3px",
+        "background-color": "#FFF",
+        "cursor": "pointer"
+    },
+    "pagingWarpNode_selected": {
+        "background-color": "#FFF",
+        "border": "1px solid red",
+        "white-space": "nowrap"
+    },
+    "pagingWarpNode_over": {
+        "background-color": "#F9F9F9",
+        "border": "1px dotted blue",
+        "white-space": "nowrap"
+    }
 }

o2web/source/x_component_query_ViewDesigner/$View/paging.html

@@ -0,0 +1,109 @@
+<div style="background-color: #FFF; overflow: hidden">
+	<div title="基本" class="MWFTab">
+		<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+		  <tr>
+		    <td class="editTableTitle">标识:</td>
+		    <td class="editTableValue"><input type="text" name="id" value="text{$.id}" class="editTableInput"/></td>
+		  </tr>
+		  <tr>
+		    <td class="editTableTitle">名称:</td>
+		    <td class="editTableValue"><input type="text" name="name" value="text{$.name}" class="editTableInput"/></td>
+		  </tr>
+		  <tr>
+		    <td class="editTableTitle">描述:</td>
+		    <td class="editTableValue"><input type="text" name="description" value="text{$.description}" class="editTableInput"/></td>
+		  </tr>
+
+		</table>
+		<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+			<tr>
+				<td class="editTableTitleNoWidth">显示数字分页:</td>
+				<td class="editTableValue">
+					<input class="editTableRadio" name="hasTruningBar" text{($.hasTruningBar!==false)?'checked':''}  onclick="
+                    if (this.checked){
+                        $('text{$.id}visiblePagesTr').setStyle('display', 'table-row');
+                        $('text{$.id}hasBatchTuringTr').setStyle('display', 'table-row');
+                    }" type="radio" value="true"/>是
+					<input class="editTableRadio" name="hasTruningBar" text{($.hasTruningBar===false)?'checked':''}   onclick="
+                    if (this.checked){
+                        $('text{$.id}visiblePagesTr').setStyle('display', 'none');
+                        $('text{$.id}hasBatchTuringTr').setStyle('display', 'none');
+                    }" type="radio" value="false"/>否
+				</td>
+			</tr>
+			<tr id="text{$.id}visiblePagesTr">
+				<td class="editTableTitleNoWidth">数字显示个数:</td>
+				<td class="editTableValue"><input type="number" name="visiblePages" value="text{$.visiblePages || 9}" onchange="
+                    $('text{$.id}visiblePagesText').set('text', this.value);
+                " class="editTableInput"/></td>
+			</tr>
+			<tr id="text{$.id}hasBatchTuringTr">
+				<td class="editTableTitleNoWidth">显示前后<span id="text{$.id}visiblePagesText">text{$.visiblePages || 9}</span>页:</td>
+				<td class="editTableValue">
+					<input class="editTableRadio" name="hasBatchTuring" text{($.hasBatchTuring!==false)?'checked':''} type="radio" value="true"/>是
+					<input class="editTableRadio" name="hasBatchTuring" text{($.hasBatchTuring===false)?'checked':''} type="radio" value="false"/>否
+				</td>
+			</tr>
+			<tr>
+				<td class="editTableTitleNoWidth">显示首页末页:</td>
+				<td class="editTableValue">
+					<input class="editTableRadio" name="hasFirstLastPage" text{($.hasFirstLastPage!==false)?'checked':''} type="radio" value="true"/>是
+					<input class="editTableRadio" name="hasFirstLastPage" text{($.hasFirstLastPage===false)?'checked':''} type="radio" value="false"/>否
+				</td>
+			</tr>
+			<tr>
+				<td class="editTableTitleNoWidth">显示上页下页:</td>
+				<td class="editTableValue">
+					<input class="editTableRadio" name="hasPreNextPage" text{($.hasPreNextPage!==false)?'checked':''} type="radio" value="true"/>是
+					<input class="editTableRadio" name="hasPreNextPage" text{($.hasPreNextPage===false)?'checked':''} type="radio" value="false"/>否
+				</td>
+			</tr>
+			<tr>
+				<td class="editTableTitleNoWidth">显示跳页:</td>
+				<td class="editTableValue">
+					<input class="editTableRadio" name="hasPageJumper" text{($.hasPageJumper!==false)?'checked':''} type="radio" value="true"/>是
+					<input class="editTableRadio" name="hasPageJumper" text{($.hasPageJumper===false)?'checked':''} type="radio" value="false"/>否
+				</td>
+			</tr>
+		</table>
+
+		<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+			<tr>
+				<td class="editTableTitleNoWidth">第一页文本:</td>
+				<td class="editTableValue">
+					<input type="text" name="firstPageText" value="text{$.firstPageText}" class="editTableInput"/>
+				</td>
+			</tr>
+			<tr>
+				<td class="editTableTitleNoWidth">最后一页文本:</td>
+				<td class="editTableValue">
+					<input type="text" name="lastPageText" value="text{$.lastPageText}" class="editTableInput"/>
+				</td>
+			</tr>
+			<tr>
+				<td class="editTableTitleNoWidth">上一页文本:</td>
+				<td class="editTableValue">
+					<input type="text" name="prePageText" value="text{$.prePageText}" class="editTableInput"/>
+				</td>
+			</tr>
+			<tr>
+				<td class="editTableTitleNoWidth">下一页文本:</td>
+				<td class="editTableValue">
+					<input type="text" name="nextPageText" value="text{$.nextPageText}" class="editTableInput"/>
+				</td>
+			</tr>
+		</table>
+	</div>
+    <div title="样式"  class="MWFTab">
+        <div class="MWFPagingStylesArea" name="pagingStyles"></div>
+    </div>
+	<div title="事件"  class="MWFTab">
+		<div class="MWFEventsArea" name="events"></div>
+	</div>
+	<!--<div title="HTML"  class="MWFTab">-->
+		<!--<div class="MWFHTMLArea" style="font-family: Verdana, Geneva, sans-serif; font-size:14px"></div>-->
+	<!--</div>-->
+	<div title="JSON"  class="MWFTab">
+		<div class="MWFJSONArea" style="font-family: Verdana, Geneva, sans-serif; font-size:14px"></div>
+	</div>
+</div>

o2web/source/x_component_query_ViewDesigner/$View/paging.json

@@ -0,0 +1,74 @@
+{
+  "id": "",
+  "name": "",
+  "type": "Paging",
+  "description": "",
+  "style": "default",
+  "visiblePages" : 9,
+  "prePageText" : "",
+  "nextPageText" : "",
+  "firstPageText" : "第一页",
+  "lastPageText" : "最后一页",
+  "events": {
+    "queryLoad" : {
+      "code": "",
+      "html": ""
+    },
+    "postLoad" : {
+      "code": "",
+      "html": ""
+    },
+    "load" : {
+      "code": "",
+      "html": ""
+    },
+    "afterLoad" : {
+      "code": "",
+      "html": ""
+    },
+    "jump" : {
+      "code": "",
+      "html": ""
+    },
+    "click": {
+      "code": "",
+      "html": ""
+    },
+    "dblclick": {
+      "code": "",
+      "html": ""
+    },
+    "keydown": {
+      "code": "",
+      "html": ""
+    },
+    "keypress": {
+      "code": "",
+      "html": ""
+    },
+    "keyup": {
+      "code": "",
+      "html": ""
+    },
+    "mousedown": {
+      "code": "",
+      "html": ""
+    },
+    "mousemove": {
+      "code": "",
+      "html": ""
+    },
+    "mouseout": {
+      "code": "",
+      "html": ""
+    },
+    "mouseover": {
+      "code": "",
+      "html": ""
+    },
+    "mouseup": {
+      "code": "",
+      "html": ""
+    }
+  }
+}

o2web/source/x_component_query_ViewDesigner/$View/skin/config.json

@@ -30,7 +30,6 @@
   "cmcc": {
     "name": "集团样式",
     "file": "styles_cmcc.json",
-    "extendFile": "styles_cmcc_extend.json",
     "mode": [
       "pc"
     ]
@@ -38,7 +37,6 @@
   "blue-flat": {
     "name": "蓝白扁平",
     "file": "styles_blue-flat.json",
-    "extendFile": "styles_blue-flat_extend.json",
     "mode": [
       "pc"
     ]

o2web/source/x_component_query_ViewDesigner/$View/skin/styles_blue-flat.json

@@ -1,50 +1,105 @@
 {
   "name": "蓝白扁平",
-  "form": {
-    "styles":{
-      "background-color": "#f1f4f9"
-    }
-  },
-  "table": {
-    "tableStyles": {
-      "background-color": "#FFF",
-      "border" : "1px solid #DCDFE6"
+  "view": {
+    "container" : {
+      "height" : "100%",
+      "overflow" : "auto",
+      "font-size": "14px"
     },
-    "titleTdStyles":{
-      "background-color": "#F1F4F9",
-      "color": "#12171F",
+    "table": {
+      "margin-bottom": "20px",
+      "width": "100%"
+    },
+    "titleTr":{  //viewTitleTrNode   viewTitleLineNode
+      "line-height": "40px",
+      "height": "40px",
+      "color": "#666666",
+      "background-color": "#F1F4F9"
+    },
+    "titleTd":{ //viewTitleColumnNode  viewTitleCellNode
       "font-weight": "bold",
+      "padding": "0px 10px",
+      "border-bottom": "1px solid #dcdfe6"
+    },
+    "contentTr" : {
+      "background": "#ffffff"
+    },
+    "contentSelectedTr" : {
+      "background": "#ecf5ff"
+    },
+    "contentTd": {
       "height": "30px",
       "line-height": "30px",
-      "text-align": "center"
+      "padding": "5px 5px",
+      "border-bottom": "1px solid #dcdfe6"
     },
-    "contentTdStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#535861"
+    "contentGroupTd": {
+      "padding": "5px 5px",
+      "border-bottom": "1px solid #dcdfe6",
+      "font-weight": "bold",
+      "background-color": "#F1F4F9",
+      "cursor": "pointer"
     },
-    "contentTdOverStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#535861"
+    "groupCollapseNode": {
+      "height": "30px",
+      "line-height": "30px",
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/right.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
+    },
+    "groupExpandNode": {
+      "height": "30px",
+      "line-height": "30px",
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/down.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
     },
-    "contentTdSelectedStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#535861"
+    "checkboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/checkbox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
     },
-    "properties": {
+    "checkedCheckboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/checkbox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "radioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/radiobox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "checkedRadioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/radiobox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "tableProperties": {
       "width": "100%",
       "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "5",
-      "align": "center"
+      "cellpadding": "0",
+      "cellspacing": "0"
     }
   },
   "actionbar": {
     "style": "xform_blue_flat",
-    "iconOverStyle": "xform_blue_flat_over",
+    "iconStyle" : "blue",
+    "iconOverStyle": "white",
     "customIconStyle" : "blue",
-    "customIconOverStyle" : "white"
+    "customIconOverStyle" : "white",
+    "forceStyles" : {
+      "container" : {
+        "width" : "100%",
+        "padding-left" : "10px",
+        "padding-right" : "10px",
+        "border-top" : "0px",
+        "border-bottom" : "1px solid #F1F4F9"
+      }
+    }
   },
   "paging" : {
-
+    "style" : "default"
   }
 }

o2web/source/x_component_query_ViewDesigner/$View/skin/styles_blue-simple.json

@@ -1,419 +1,100 @@
 {
   "name": "蓝色简洁",
-  "form": {
-    "styles":{
-      "background-color": "#f0f0f0"
-    }
-  },
-  "label": {
-    "banner": {
-      "name": "横幅",
-      "styles": {
-        "background-color": "#3c76b7",
-        "height": "40px",
-        "line-height": "40px",
-        "color": "#ffffff",
-        "font-size": "18px",
-        "padding": "0px 10px",
-        "font-weight": "bold"
-      }
-    },
-
-    "title": {
-      "name": "标题",
-      "styles": {
-        "text-align": "center",
-        "font-size": "24px",
-        "line-height": "60px",
-        "font-weight": "bold",
-        "color": "#3c76b7",
-        "height": "60px"
-      }
-    },
-
-    "section": {
-      "name": "区段标题",
-      "styles": {
-        "height": "40px",
-        "background-color": "#f7f7f7",
-        "line-height": "40px",
-        "padding": "0px 20px",
-        "font-weight": "bold",
-        "color": "#666",
-        "border-bottom": "1px solid #cccccc"
-      }
-    }
-  },
-
-  "div": {
-    "banner": {
-      "name": "横幅",
-      "styles": {
-        "background-color": "#3c76b7",
-        "height": "40px",
-        "line-height": "40px",
-        "color": "#ffffff",
-        "font-size": "18px",
-        "padding": "0px 10px",
-        "font-weight": "bold"
-      }
-    },
-
-    "title": {
-      "name": "标题",
-      "styles": {
-        "text-align": "center",
-        "font-size": "24px",
-        "line-height": "60px",
-        "font-weight": "bold",
-        "color": "#3c76b7",
-        "height": "60px"
-      }
-    },
-    "section": {
-      "name": "区段",
-      "styles": {
-        "padding": "20px 0px",
-        "background-color": "#FFF",
-        "border": "1px solid #cccccc"
-      }
-    }
-  },
-
-  "tab": {
-    "styles": {},
-    "tabAreaStyles": {
-      "height": "40px",
-      "border-bottom": "2px solid #3c76b7"
-    },
-    "contentAreaStyles": {
-      "line-height": "normal",
-      "clear": "both",
-      "overflow": "hidden"
+  "view": {
+    "container" : {
+      "height" : "100%",
+      "overflow" : "auto",
+      "font-size": "14px"
     },
-    "tabStyles": {
-      "position": "relative",
-      "margin-left": "4px",
-      "margin-top": "0px",
-      "margin-right": "0px",
-      "float": "left",
-      "height": "40px",
-      "cursor": "pointer",
-      "min-width": "100px",
-      "background": "transparent ",
-      "border-top-left-radius": "5px",
-      "border-top-right-radius": "5px",
-      "border": "0px solid #f0f0f0",
-      "border-bottom": "1px solid #3c76b7"
+    "table": {
+      "margin-bottom": "20px",
+      "width": "100%"
     },
-    "tabTextStyles": {
-      "color": "#666",
-      "font-weight": "bold",
+    "titleTr":{  //viewTitleTrNode   viewTitleLineNode
       "line-height": "40px",
-      "text-align": "center",
-      "margin-right": "8px",
-      "margin-top": "0px",
-      "margin-left": "8px"
-    },
-    "tabCurrentStyles": {
-      "position": "relative",
-      "margin-top": "0px",
-      "margin-left": "2px",
-      "margin-right": "0px",
-      "float": "left",
       "height": "40px",
-      "min-width": "100px",
-      "background": "#3c76b7",
-      "border-top-left-radius": "5px",
-      "border-top-right-radius": "5px",
-      "border-top": "0px solid #f0f0f0",
-      "border-left": "0px solid #f0f0f0",
-      "border-right": "0px solid #f0f0f0",
-      "border-bottom": "1px solid #3c76b7"
+      "color": "#666666",
+      "background-color": "#f1f1f1"
     },
-    "tabCurrentTextStyles": {
-      "color": "#FFF",
+    "titleTd":{ //viewTitleColumnNode  viewTitleCellNode
       "font-weight": "bold",
-      "line-height": "40px",
-      "text-align": "center",
-      "margin-right": "8px",
-      "margin-left": "8px",
-      "margin-top": "0px"
-    }
-  },
-  "tab$Content": {
-    "styles": {
-      "padding": "20px 0px"
-    }
-  },
-  "table": {
-    "styles": {
-      "background-color": "#FFF",
-      "margin": "10px 0px"
+      "padding": "0px 10px",
+      "border-bottom": "1px solid #CCC"
     },
-    "titleStyles":{
-      "background-color": "#fff",
-      "color": "#333",
-      "font-weight": "bold",
-      "height": "30px",
-      "line-height": "30px",
-      "text-align": "right"
-    },
-    "contentStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#333"
+    "contentTr" : {
+      "background": "#ffffff"
     },
-    "layoutStyles": {},
-    "properties": {
-      "width": "90%",
-      "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "5",
-      "align": "center"
-    }
-  },
-  "log" : {
-    "tableStyles": {
-      "background-color": "#FFF",
-      "margin": "10px 0px"
+    "contentSelectedTr" : {
+      "background": "#ecf5ff"
     },
-    "titleStyles":{
-      "background-color": "#fff",
-      "color": "#333",
-      "font-weight": "bold",
+    "contentTd": {
       "height": "30px",
       "line-height": "30px",
-      "text-align": "right"
-    },
-    "contentStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#333"
+      "padding": "5px 5px",
+      "border-bottom": "1px solid #CCC"
     },
-    "properties": {
-      "width": "90%",
-      "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "5",
-      "align": "center"
-    }
-  },
-  "datagrid": {
-    "styles": {},
-    "tableStyles": {
-      "border": "1px solid #cccccc"
-    },
-    "titleStyles": {
-      "height": "28px",
-      "cursor": "pointer",
-      "line-height": "28px",
-      "overflow": "hidden",
-      "opacity": 1,
-      "border-bottom": "1px solid #ccc",
-      "background-color": "#f0f0f0"
+    "contentGroupTd": {
+      "padding": "5px 5px",
+      "border-bottom": "1px solid #CCC",
+      "font-weight": "bold",
+      "background-color": "#F9F9F9",
+      "cursor": "pointer"
     },
-    "contentStyles": {
-      "text-align": "center",
+    "groupCollapseNode": {
       "height": "30px",
       "line-height": "30px",
-      "color": "#666"
-    },
-    "actionStyles": {
-      "background-color": "#f7f7f7"
-    },
-    "editStyles": {
-      "background-color": "#fff6f6",
-      "text-align": "center",
-      "height": "30px",
-      "line-height": "30px"
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/right.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
     },
-    "amountStyles": {
-      "border-top": "1px solid #ccc",
-      "font-weight": "bold",
+    "groupExpandNode": {
       "height": "30px",
       "line-height": "30px",
-      "text-align": "center",
-      "background-color": "#f0f0f0"
-    },
-    "itemTitleStyles": {
-      "height": "40px",
-      "background-color": "#ffffff",
-      "line-height": "30px",
-      "padding": "0px 15px",
-      "color": "#fb4747",
-      "font-size": "18px",
-      "font-weight": "bold",
-      "border-bottom": "0px solid #cccccc"
-    },
-    "properties": {
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/down.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
+    },
+    "checkboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/checkbox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "checkedCheckboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/checkbox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "radioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/radiobox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "checkedRadioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/radiobox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "tableProperties": {
+      "width": "100%",
       "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "0",
-      "align": "center"
-    }
-  },
-  "datagrid$Title": {
-    "styles": {
-      "background-color": "#f0f0f0"
-    }
-  },
-  "address": {
-    "styles": {
-      "border-bottom": "1px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "height": "26px",
-      "color": "#666",
-      "border": "0px solid #ccc"
-    }
-  },
-  "combox": {
-    "styles": {
-      "border-bottom": "1px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "height": "26px",
-      "color": "#666",
-      "border": "0px solid #ccc"
-    }
-  },
-  "textfield": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "height": "26px",
-      "color": "#666",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "calendar": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "height": "26px",
-      "color": "#666",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "number": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "height": "26px",
-      "color": "#666",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "personfield": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "min-height": "20px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "min-height": "26px",
-      "color": "#666",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "orgfield": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "min-height": "20px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "min-height": "26px",
-      "color": "#666",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "org": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "min-height": "20px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "min-height": "26px",
-      "color": "#666",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "select": {
-    "styles": {
-      "border-bottom": "0px solid #999",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "margin-top": "5px",
-      "color": "#666"
-    },
-    "inputStyles": {
-      "height": "26px",
-      "font-size": "14px"
-    }
-  },
-  "textarea": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px"
-    },
-    "inputStyles": {
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
-    }
-  },
-  "opinion": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px"
-    },
-    "inputStyles": {
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
+      "cellpadding": "0",
+      "cellspacing": "0"
     }
   },
   "actionbar": {
     "style": "xform_blue_simple",
-    "customIconStyle" : ""
+    "customIconStyle" : "",
+    "forceStyles" : {
+      "container" : {
+        "width" : "100%",
+        "border-top" : "0px",
+        "border-bottom" : "1px solid #4a90e2"
+      }
+    }
   },
-  "attachment" : {
+  "paging" : {
     "style" : "default"
   }
 }

o2web/source/x_component_query_ViewDesigner/$View/skin/styles_cmcc.json

@@ -1,445 +1,101 @@
 {
   "name": "集团样式",
-  "form": {
-    "styles":{
-      "background-color": "#f0f0f0"
-    }
-  },
-  "label": {
-    "banner": {
-      "name": "横幅",
-      "styles": {
-        "background-color": "#3c76b7",
-        "height": "40px",
-        "line-height": "40px",
-        "color": "#ffffff",
-        "font-size": "18px",
-        "padding": "0px 10px",
-        "font-weight": "bold"
-      }
-    },
-
-    "title": {
-      "name": "标题",
-      "styles": {
-        "text-align": "center",
-        "font-size": "36px",
-        "line-height": "100px",
-        "font-weight": "bold",
-        "color": "#f81313",
-        "height": "100px"
-      }
-    },
-
-    "section": {
-      "name": "区段标题",
-      "styles": {
-        "background-color": "#f7f7f7",
-        "height": "35px",
-        "font-size" : "16px",
-        "line-height": "35px",
-        "padding": "0px 10px",
-        "font-weight": "normal",
-        "color": "#555",
-        "border-bottom": "0px"
-      }
-    }
-  },
-
-  "div": {
-    "banner": {
-      "name": "横幅",
-      "styles": {
-        "background-color": "#3c76b7",
-        "height": "40px",
-        "line-height": "40px",
-        "color": "#ffffff",
-        "font-size": "18px",
-        "padding": "0px 10px",
-        "font-weight": "bold"
-      }
-    },
-
-    "title": {
-      "name": "标题",
-      "styles": {
-        "text-align": "center",
-        "font-size": "24px",
-        "line-height": "60px",
-        "font-weight": "bold",
-        "color": "#3c76b7",
-        "height": "60px"
-      }
+  "view": {
+    "container" : {
+      "height" : "100%",
+      "overflow" : "auto",
+      "font-size": "14px"
     },
-    "section": {
-      "name": "区段标题",
-      "styles": {
-        "background-color": "#f7f7f7",
-        "height": "35px",
-        "font-size" : "16px",
-        "line-height": "35px",
-        "padding": "0px 10px",
-        "font-weight": "normal",
-        "color": "#555",
-        "border-bottom": "0px"
-      }
-    }
-  },
-
-  "tab": {
-    "styles": {},
-    "tabAreaStyles": {
-      "height": "40px",
-      "border-bottom": "2px solid #3c76b7"
-    },
-    "contentAreaStyles": {
-      "line-height": "normal",
-      "clear": "both",
-      "overflow": "hidden"
-    },
-    "tabStyles": {
-      "position": "relative",
-      "margin-left": "4px",
-      "margin-top": "0px",
-      "margin-right": "0px",
-      "float": "left",
-      "height": "40px",
-      "cursor": "pointer",
-      "min-width": "100px",
-      "background": "transparent ",
-      "border-top-left-radius": "5px",
-      "border-top-right-radius": "5px",
-      "border": "0px solid #f0f0f0",
-      "border-bottom": "1px solid #3c76b7"
+    "table": {
+      "margin-bottom": "20px",
+      "width": "100%"
     },
-    "tabTextStyles": {
-      "color": "#666",
-      "font-weight": "bold",
+    "titleTr":{  //viewTitleTrNode   viewTitleLineNode
       "line-height": "40px",
-      "text-align": "center",
-      "margin-right": "8px",
-      "margin-top": "0px",
-      "margin-left": "8px"
-    },
-    "tabCurrentStyles": {
-      "position": "relative",
-      "margin-top": "0px",
-      "margin-left": "2px",
-      "margin-right": "0px",
-      "float": "left",
       "height": "40px",
-      "min-width": "100px",
-      "background": "#3c76b7",
-      "border-top-left-radius": "5px",
-      "border-top-right-radius": "5px",
-      "border-top": "0px solid #f0f0f0",
-      "border-left": "0px solid #f0f0f0",
-      "border-right": "0px solid #f0f0f0",
-      "border-bottom": "1px solid #3c76b7"
-    },
-    "tabCurrentTextStyles": {
-      "color": "#FFF",
-      "font-weight": "bold",
-      "line-height": "40px",
-      "text-align": "center",
-      "margin-right": "8px",
-      "margin-left": "8px",
-      "margin-top": "0px"
-    }
-  },
-  "tab$Content": {
-    "styles": {
-      "padding": "20px 0px"
-    }
-  },
-  "table": {
-    "styles": {
-      "background-color": "#FFF",
-      "margin": "10px 10px",
-      "border" : "1px solid #e1e1e1"
+      "color": "#666666",
+      "background-color": "#EEE"
     },
-    "titleStyles":{
-      "background-color": "#f7f7f7",
-      "color": "#333",
+    "titleTd":{ //viewTitleColumnNode  viewTitleCellNode
       "font-weight": "bold",
-      "height": "30px",
-      "line-height": "30px",
-      "text-align": "center"
+      "padding": "0px 10px",
+      "border-bottom": "1px solid #CCC"
     },
-    "contentStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#333"
+    "contentTr" : {
+      "background": "#ffffff"
     },
-    "layoutStyles": {},
-    "properties": {
-      "width": "100%",
-      "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "5",
-      "align": "center"
-    }
-  },
-  "log" : {
-    "tableStyles": {
-      "background-color": "#FFF",
-      "margin": "10px 10px",
-      "border" : "1px solid #e1e1e1"
+    "contentSelectedTr" : {
+      "background": "#ecf5ff"
     },
-    "titleStyles":{
-      "background-color": "#f7f7f7",
-      "color": "#333",
-      "font-weight": "bold",
+    "contentTd": {
       "height": "30px",
       "line-height": "30px",
-      "text-align": "center"
-    },
-    "contentStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#333"
+      "padding": "5px 5px",
+      "border-bottom": "1px solid #CCC"
     },
-    "properties": {
-      "width": "100%",
-      "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "5",
-      "align": "center"
-    }
-  },
-  "datagrid": {
-    "styles": {},
-    "tableStyles": {
-      "border": "1px solid #cccccc"
-    },
-    "titleStyles": {
-      "height": "28px",
-      "cursor": "pointer",
-      "line-height": "28px",
-      "overflow": "hidden",
-      "opacity": 1,
-      "border-bottom": "1px solid #ccc",
-      "background-color": "#f0f0f0"
+    "contentGroupTd": {
+      "padding": "5px 5px",
+      "border-bottom": "1px solid #CCC",
+      "font-weight": "bold",
+      "background-color": "#F6F6F6",
+      "cursor": "pointer"
     },
-    "contentStyles": {
-      "text-align": "center",
+    "groupCollapseNode": {
       "height": "30px",
       "line-height": "30px",
-      "color": "#666"
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/right.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
     },
-    "actionStyles": {
-      "background-color": "#f7f7f7"
-    },
-    "editStyles": {
-      "background-color": "#fff6f6",
-      "text-align": "center",
-      "height": "30px",
-      "line-height": "30px"
-    },
-    "amountStyles": {
-      "border-top": "1px solid #ccc",
-      "font-weight": "bold",
+    "groupExpandNode": {
       "height": "30px",
       "line-height": "30px",
-      "text-align": "center",
-      "background-color": "#f0f0f0"
-    },
-    "itemTitleStyles": {
-      "height": "40px",
-      "background-color": "#ffffff",
-      "line-height": "30px",
-      "padding": "0px 15px",
-      "color": "#fb4747",
-      "font-size": "18px",
-      "font-weight": "bold",
-      "border-bottom": "0px solid #cccccc"
-    },
-    "properties": {
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/down.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
+    },
+    "checkboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/checkbox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "checkedCheckboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/checkbox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "radioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/radiobox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "checkedRadioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/radiobox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "tableProperties": {
+      "width": "100%",
       "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "0",
-      "align": "center"
-    }
-  },
-  "datagrid$Title": {
-    "styles": {
-      "background-color": "#f0f0f0"
-    }
-  },
-  "address": {
-    "styles": {
-      "border-bottom": "1px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "30px"
-    },
-    "inputStyles": {
-      "font-size" : "100%",
-      "height": "30px",
-      "color": "#666",
-      "border": "0px solid #ccc"
-    }
-  },
-  "combox": {
-    "styles": {
-      "border-bottom": "1px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "30px"
-    },
-    "inputStyles": {
-      "font-size" : "100%",
-      "height": "30px",
-      "color": "#666",
-      "border": "0px solid #ccc"
-    }
-  },
-  "textfield": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "30px"
-    },
-    "inputStyles": {
-      "font-size" : "100%",
-      "height": "30px",
-      "color": "#666",
-      "border": "1px solid transparent",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "calendar": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "30px"
-    },
-    "inputStyles": {
-      "font-size" : "100%",
-      "height": "30px",
-      "color": "#666",
-      "border": "1px solid transparent",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "number": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "30px"
-    },
-    "inputStyles": {
-      "font-size" : "100%",
-      "height": "30px",
-      "color": "#666",
-      "border": "1px solid transparent",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "personfield": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "min-height": "30px",
-      "line-height": "30px"
-    },
-    "inputStyles": {
-      "font-size" : "100%",
-      "min-height": "30px",
-      "color": "#666",
-      "border": "1px solid transparent",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "orgfield": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "min-height": "30px",
-      "line-height": "30px"
-    },
-    "inputStyles": {
-      "font-size" : "100%",
-      "min-height": "30px",
-      "color": "#666",
-      "border": "1px solid transparent",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "org": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "min-height": "30px",
-      "line-height": "30px"
-    },
-    "inputStyles": {
-      "font-size" : "100%",
-      "min-height": "30px",
-      "color": "#666",
-      "border": "1px solid transparent",
-      "border-bottom": "1px solid #ccc"
-    }
-  },
-  "select": {
-    "styles": {
-      "border-bottom": "0px solid #999",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "margin-top": "5px",
-      "color": "#666"
-    },
-    "inputStyles": {
-      "height": "30px",
-      "font-size": "100%"
-    }
-  },
-  "textarea": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px"
-    },
-    "inputStyles": {
-      "font-size" : "100%",
-      "border": "1px solid transparent",
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
-    }
-  },
-  "opinion": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px"
-    },
-    "inputStyles": {
-      "font-size" : "100%",
-      "border": "1px solid transparent",
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
+      "cellpadding": "0",
+      "cellspacing": "0"
     }
   },
   "actionbar": {
     "style": "cmcc",
-    "customIconStyle" : "white"
+    "iconStyle" : "white",
+    "customIconStyle" : "white",
+    "forceStyles" : {
+      "container" : {
+        "width" : "100%",
+        "border-top" : "0px",
+        "border-bottom" : "0px"
+      }
+    }
   },
-  "attachment" : {
-    "style" : "cmcc"
+  "paging" : {
+    "style" : "default"
   }
 }

o2web/source/x_component_query_ViewDesigner/$View/skin/styles_default.json

@@ -1,47 +1,100 @@
 {
-  "name": "传统样式",
-  "form": {
-    "styles":{
-      "background-color": "#f0f0f0"
-    }
-  },
-  "table": {
-    "tableStyles": {
-      "background-color": "#FFF",
-      "border": "1px solid #ddd"
-    },
-    "titleTdStyles":{
-      "background-color": "#eee",
-      "color": "#333",
+  "name": "默认样式",
+  "view": {
+    "container" : {
+      "height" : "100%",
+      "overflow" : "auto",
+      "font-size": "14px"
+    },
+    "table": {
+      "margin-bottom": "20px",
+      "width": "100%"
+    },
+    "titleTr":{  //viewTitleTrNode   viewTitleLineNode
+      "line-height": "40px",
+      "height": "40px",
+      "color": "#666666",
+      "background-color": "#EEE"
+    },
+    "titleTd":{ //viewTitleColumnNode  viewTitleCellNode
+      "font-weight": "bold",
+      "padding": "0px 10px",
+      "border-bottom": "1px solid #CCC"
+    },
+    "contentTr" : {
+      "background": "#ffffff"
+    },
+    "contentSelectedTr" : {
+      "background": "#ecf5ff"
+    },
+    "contentTd": {
       "height": "30px",
       "line-height": "30px",
-      "text-align": "right"
+      "padding": "5px 5px",
+      "border-bottom": "1px solid #CCC"
     },
-    "contentTdStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#333"
+    "contentGroupTd": {
+      "padding": "5px 5px",
+      "border-bottom": "1px solid #CCC",
+      "font-weight": "bold",
+      "background-color": "#F6F6F6",
+      "cursor": "pointer"
     },
-    "contentTdOverStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#535861"
+    "groupCollapseNode": {
+      "height": "30px",
+      "line-height": "30px",
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/right.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
+    },
+    "groupExpandNode": {
+      "height": "30px",
+      "line-height": "30px",
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/down.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
     },
-    "contentTdSelectedStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#535861"
+    "checkboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/checkbox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
     },
-    "properties": {
+    "checkedCheckboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/checkbox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "radioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/radiobox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "checkedRadioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon/radiobox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "tableProperties": {
       "width": "100%",
       "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "2",
-      "align": "center"
+      "cellpadding": "0",
+      "cellspacing": "0"
     }
   },
   "actionbar": {
     "style": "xform_blue_simple",
-    "customIconStyle" : ""
+    "customIconStyle" : "",
+    "forceStyles" : {
+      "container" : {
+        "width" : "100%",
+        "border-top" : "0px",
+        "border-bottom" : "1px solid #4a90e2"
+      }
+    }
   },
-  "pagingBar" : {
+  "paging" : {
     "style" : "default"
   }
 }

o2web/source/x_component_query_ViewDesigner/$View/skin/styles_official.json

@@ -1,467 +1,100 @@
 {
   "name": "公文样式",
-  "form": {
-    "styles":{
-      "background-color": "#ffffff",
-      "font-family": "宋体"
-    }
-  },
-  "label": {
-    "banner": {
-      "name": "横幅",
-      "styles": {
-        "height": "40px",
-        "line-height": "40px",
-        "color": "#fd1113",
-        "font-size": "18px",
-        "padding": "0px 10px",
-        "font-weight": "bold",
-        "text-align": "center"
-      }
+  "view": {
+    "container" : {
+      "height" : "100%",
+      "overflow" : "auto",
+      "font-size": "14px"
     },
-
-    "title": {
-      "name": "标题",
-      "styles": {
-        "text-align": "center",
-        "font-size": "36px",
-        "line-height": "60px",
-        "font-weight": "bold",
-        "color": "#fd1113",
-        "height": "60px",
-        "font-family": "宋体"
-      }
+    "table": {
+      "margin-bottom": "20px",
+      "width": "100%"
     },
-
-    "section": {
-      "name": "区段标题",
-      "styles": {
-        "height": "40px",
-        "background-color": "#f7f7f7",
-        "line-height": "40px",
-        "padding": "0px 20px",
-        "font-weight": "bold",
-        "color": "#666",
-        "border-bottom": "1px solid #cccccc"
-      }
-    }
-  },
-
-  "div": {
-    "banner": {
-      "name": "横幅",
-      "styles": {
-        "height": "40px",
-        "line-height": "40px",
-        "color": "#fd1113",
-        "font-size": "18px",
-        "padding": "0px 10px",
-        "font-weight": "bold",
-        "text-align": "center"
-      }
-    },
-
-    "title": {
-      "name": "标题",
-      "styles": {
-        "text-align": "center",
-        "font-size": "36px",
-        "line-height": "60px",
-        "font-weight": "bold",
-        "color": "#fd1113",
-        "height": "60px"
-      }
-    },
-    "section": {
-      "name": "区段",
-      "styles": {
-        "padding": "20px 0px",
-        "background-color": "#FFF",
-        "border": "1px solid #cccccc"
-      }
-    }
-  },
-
-  "tab": {
-    "styles": {},
-    "tabAreaStyles": {
-      "height": "40px",
-      "border-bottom": "2px solid #cc3d3d"
-    },
-    "contentAreaStyles": {
-      "line-height": "normal",
-      "clear": "both",
-      "overflow": "hidden"
-    },
-    "tabStyles": {
-      "position": "relative",
-      "margin-left": "4px",
-      "margin-top": "0px",
-      "margin-right": "0px",
-      "float": "left",
-      "height": "40px",
-      "cursor": "pointer",
-      "min-width": "100px",
-      "background": "transparent ",
-      "border-top-left-radius": "5px",
-      "border-top-right-radius": "5px",
-      "border": "0px solid #f0f0f0",
-      "border-bottom": "1px solid #cc0000"
-    },
-    "tabTextStyles": {
-      "color": "#666",
-      "font-weight": "bold",
-      "font-size": "18px",
+    "titleTr":{  //viewTitleTrNode   viewTitleLineNode
       "line-height": "40px",
-      "text-align": "center",
-      "margin-right": "8px",
-      "margin-top": "0px",
-      "margin-left": "8px"
-    },
-    "tabCurrentStyles": {
-      "position": "relative",
-      "margin-top": "0px",
-      "margin-left": "2px",
-      "margin-right": "0px",
-      "float": "left",
       "height": "40px",
-      "min-width": "100px",
-      "background": "#cc0000",
-      "border-top-left-radius": "5px",
-      "border-top-right-radius": "5px",
-      "border-top": "0px solid #f0f0f0",
-      "border-left": "0px solid #f0f0f0",
-      "border-right": "0px solid #f0f0f0",
-      "border-bottom": "1px solid #cc3d3d"
-    },
-    "tabCurrentTextStyles": {
-      "color": "#FFF",
-      "font-weight": "bold",
-      "font-size": "18px",
-      "line-height": "40px",
-      "text-align": "center",
-      "margin-right": "8px",
-      "margin-left": "8px",
-      "margin-top": "0px"
-    }
-  },
-  "tab$Content": {
-    "styles": {
-      "padding": "20px 0px"
-    }
-  },
-  "table": {
-    "styles": {
-      "background-color": "#FFF",
-      "border": "1px solid #fd1113"
-    },
-    "titleStyles":{
-      "background-color": "#fff",
       "color": "#fd1113",
-      "font-weight": "bold",
-      "height": "30px",
-      "line-height": "30px",
-      "text-align": "center",
-      "font-size": "18px"
-    },
-    "contentStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#333",
-      "font-size": "18px",
-      "min-height": "30px"
+      "background-color": "#fff"
     },
-    "layoutStyles": {},
-    "properties": {
-      "width": "100%",
-      "border": "0",
-      "cellpadding": "5",
-      "align": "center"
-    }
-  },
-  "log" : {
-    "tableStyles": {
-      "background-color": "#FFF",
-      "border": "1px solid #fd1113"
-    },
-    "titleStyles":{
-      "background-color": "#fff",
-      "color": "#fd1113",
+    "titleTd":{ //viewTitleColumnNode  viewTitleCellNode
       "font-weight": "bold",
-      "height": "30px",
-      "line-height": "30px",
-      "text-align": "center",
-      "font-size": "18px"
-    },
-    "contentStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#333",
-      "font-size": "18px",
-      "min-height": "30px"
-    },
-    "properties": {
-      "width": "100%",
-      "border": "0",
-      "cellpadding": "5",
-      "align": "center"
-    }
-  },
-  "datagrid": {
-    "styles": {
-
-    },
-    "tableStyles": {
-      "border-left": "1px solid #fd1113",
-      "border-top": "1px solid #fd1113"
-    },
-    "titleStyles": {
-      "height": "28px",
-      "cursor": "pointer",
-      "line-height": "28px",
-      "overflow": "hidden",
-      "opacity": 1,
-      "color": "#fd1113",
-      "border-right": "1px solid #fd1113",
-      "border-bottom": "1px solid #fd1113",
-      "background-color": "#f0f0f0"
-    },
-    "contentStyles": {
-      "text-align": "center",
-      "height": "30px",
-      "line-height": "30px",
-      "border-right": "1px solid #fd1113",
+      "padding": "0px 10px",
       "border-bottom": "1px solid #fd1113"
     },
-    "actionStyles": {
-      "background-color": "#f7f7f7",
-      "border-right": "1px solid #fd1113",
-      "border-bottom": "1px solid #fd1113"
+    "contentTr" : {
+      "background": "#ffffff"
     },
-    "editStyles": {
-      "background-color": "#fff6f6",
-      "text-align": "center",
-      "height": "30px",
-      "line-height": "30px",
-      "border-right": "1px solid #fd1113",
-      "border-bottom": "1px solid #fd1113"
+    "contentSelectedTr" : {
+      "background": "#ffeded"
     },
-    "amountStyles": {
-      "border-top": "1px solid #ccc",
-      "font-weight": "bold",
+    "contentTd": {
       "height": "30px",
       "line-height": "30px",
-      "text-align": "center",
-      "background-color": "#f0f0f0",
-      "border-right": "1px solid #fd1113",
+      "padding": "5px 5px",
       "border-bottom": "1px solid #fd1113"
     },
-    "itemTitleStyles": {
-      "height": "40px",
-      "background-color": "#ffffff",
-      "line-height": "30px",
-      "padding": "0px 15px",
-      "color": "#fd1113",
-      "font-size": "18px",
+    "contentGroupTd": {
+      "padding": "5px 5px",
+      "border-bottom": "1px solid #CCC",
       "font-weight": "bold",
-      "border-bottom": "0px solid #cccccc"
-    },
-    "properties": {
-      "width": "90%",
-      "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "0",
-      "align": "center"
-    }
-  },
-  "datagrid$Title": {
-    "styles": {
-      "background-color": "#f0f0f0"
-    }
-  },
-  "textfield": {
-    "styles": {
-      "border-bottom": "0px",
-      "border": "0px solid #999999",
-      "height": "auto",
-      "font-size": "18px",
-      "line-height": "30px"
-    },
-    "inputStyles": {
-      "border": "1px solid #999999",
-      "height": "30px",
-      "line-height": "30px",
-      "font-size": "18px",
-      "color": "#666",
-      "font-family": "宋体"
-    }
-  },
-  "calendar": {
-    "styles": {
-      "border-bottom": "0px",
-      "border": "0px solid #999999",
-      "height": "auto",
-      "font-size": "18px",
-      "line-height": "30px"
-    },
-    "inputStyles": {
-      "border": "1px solid #999999",
-      "height": "30px",
-      "line-height": "30px",
-      "font-size": "18px",
-      "color": "#666",
-      "font-family": "宋体"
-    }
-  },
-  "number": {
-    "styles": {
-      "border-bottom": "0px",
-      "border": "0px solid #999999",
-      "height": "auto",
-      "font-size": "18px",
-      "line-height": "30px"
-    },
-    "inputStyles": {
-      "border": "1px solid #999999",
-      "height": "30px",
-      "line-height": "30px",
-      "font-size": "18px",
-      "color": "#666",
-      "font-family": "宋体"
-    }
-  },
-  "address": {
-    "styles": {
-      "border-bottom": "0px",
-      "height": "auto",
-      "line-height": "30px",
-      "font-size": "18px",
-      "border": "0px solid #999999"
-    },
-    "inputStyles": {
-      "border": "1px solid #999999",
-      "height": "30px",
-      "line-height": "30px",
-      "color": "#666",
-      "font-size": "18px",
-      "font-family": "宋体"
-    }
-  },
-  "combox": {
-    "styles": {
-      "border-bottom": "0px",
-      "height": "auto",
-      "line-height": "30px",
-      "font-size": "18px",
-      "border": "0px solid #999999"
+      "background-color": "#F6F6F6",
+      "cursor": "pointer"
     },
-    "inputStyles": {
-      "border": "1px solid #999999",
+    "groupCollapseNode": {
       "height": "30px",
       "line-height": "30px",
-      "color": "#666",
-      "font-size": "18px",
-      "font-family": "宋体"
-    }
-  },
-  "personfield": {
-    "styles": {
-      "border-bottom": "0px",
-      "height": "auto",
-      "line-height": "30px",
-      "font-size": "18px",
-      "border": "0px solid #999999"
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/right.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
     },
-    "inputStyles": {
-      "border": "1px solid #999999",
+    "groupExpandNode": {
       "height": "30px",
       "line-height": "30px",
-      "color": "#666",
-      "font-size": "18px",
-      "font-family": "宋体"
-    }
-  },
-  "orgfield": {
-    "styles": {
-      "border-bottom": "0px",
-      "height": "auto",
-      "line-height": "30px",
-      "font-size": "18px",
-      "border": "0px solid #999999"
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/down.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
     },
-    "inputStyles": {
-      "border": "1px solid #999999",
-      "height": "30px",
-      "line-height": "30px",
-      "color": "#666",
-      "font-size": "18px",
-      "font-family": "宋体"
-    }
-  },
-  "org": {
-    "styles": {
-      "border-bottom": "0px",
-      "height": "auto",
-      "line-height": "30px",
-      "font-size": "18px",
-      "border": "0px solid #999999"
+    "checkboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon_red/checkbox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
     },
-    "inputStyles": {
-      "border": "1px solid #999999",
-      "height": "30px",
-      "line-height": "30px",
-      "color": "#666",
-      "font-size": "18px",
-      "font-family": "宋体"
-    }
-  },
-  "select": {
-    "styles": {
-      "border-bottom": "0px",
-      "margin-top": "5px",
-      "height": "auto",
-      "line-height": "30px",
-      "font-size": "18px",
-      "color": "#333"
+    "checkedCheckboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon_red/checkbox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
     },
-    "inputStyles": {
-      "height": "30px",
-      "line-height": "30px",
-      "font-size": "18px",
-      "color": "#666",
-      "font-family": "宋体"
-    }
-  },
-  "textarea": {
-    "styles": {
-      "border": "0px solid #999999",
-      "font-size": "18px"
+    "radioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon_red/radiobox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
     },
-    "inputStyles": {
-      "border": "1px solid #999999",
-      "color": "#666",
-      "font-size": "18px",
-      "font-family": "宋体"
-    }
-  },
-  "opinion": {
-    "styles": {
-      "border": "0px solid #999999",
-      "font-size": "18px"
+    "checkedRadioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon_red/radiobox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
     },
-    "inputStyles": {
-      "border": "1px solid #999999",
-      "color": "#666",
-      "font-size": "18px",
-      "font-family": "宋体"
+    "tableProperties": {
+      "width": "100%",
+      "border": "0",
+      "cellpadding": "0",
+      "cellspacing": "0"
     }
   },
   "actionbar": {
-    "style": "xform_red_simple"
-  },
-  "sidebar": {
-    "style": "xform_side_red_simple",
-    "customIconStyle" : ""
+    "style": "xform_red_simple",
+    "customIconStyle" : "",
+    "forceStyles" : {
+      "container" : {
+        "width" : "100%",
+        "border-top" : "0px",
+        "border-bottom" : "1px solid #cc3d3d"
+      }
+    }
   },
-  "attachment" : {
-    "style" : "default"
+  "paging" : {
+    "style" : "red"
   }
 }

o2web/source/x_component_query_ViewDesigner/$View/skin/styles_red-simple.json

@@ -1,418 +1,100 @@
 {
   "name": "红色简洁",
-  "form": {
-    "styles":{
-      "background-color": "#f0f0f0"
-    }
-  },
-  "label": {
-    "banner": {
-      "name": "横幅",
-      "styles": {
-        "background-color": "#cc3d3d",
-        "height": "40px",
-        "line-height": "40px",
-        "color": "#ffffff",
-        "font-size": "18px",
-        "padding": "0px 10px",
-        "font-weight": "bold"
-      }
-    },
-
-    "title": {
-      "name": "标题",
-      "styles": {
-        "text-align": "center",
-        "font-size": "24px",
-        "line-height": "60px",
-        "font-weight": "bold",
-        "color": "#cc3d3d",
-        "height": "60px"
-      }
-    },
-
-    "section": {
-      "name": "区段标题",
-      "styles": {
-        "height": "40px",
-        "background-color": "#f7f7f7",
-        "line-height": "40px",
-        "padding": "0px 20px",
-        "font-weight": "bold",
-        "color": "#666",
-        "border-bottom": "1px solid #cccccc"
-      }
-    }
-  },
-
-  "div": {
-    "banner": {
-      "name": "横幅",
-      "styles": {
-        "background-color": "#cc3d3d",
-        "height": "40px",
-        "line-height": "40px",
-        "color": "#ffffff",
-        "font-size": "18px",
-        "padding": "0px 10px",
-        "font-weight": "bold"
-      }
-    },
-
-    "title": {
-      "name": "标题",
-      "styles": {
-        "text-align": "center",
-        "font-size": "24px",
-        "line-height": "60px",
-        "font-weight": "bold",
-        "color": "#cc3d3d",
-        "height": "60px"
-      }
-    },
-    "section": {
-      "name": "区段",
-      "styles": {
-        "padding": "20px 0px",
-        "background-color": "#FFF",
-        "border": "1px solid #cccccc"
-      }
-    }
-  },
-
-  "tab": {
-    "styles": {},
-    "tabAreaStyles": {
-      "height": "40px",
-      "border-bottom": "2px solid #cc3d3d"
+  "view": {
+    "container" : {
+      "height" : "100%",
+      "overflow" : "auto",
+      "font-size": "14px"
     },
-    "contentAreaStyles": {
-      "line-height": "normal",
-      "clear": "both",
-      "overflow": "hidden"
+    "table": {
+      "margin-bottom": "20px",
+      "width": "100%"
     },
-    "tabStyles": {
-      "position": "relative",
-      "margin-left": "4px",
-      "margin-top": "0px",
-      "margin-right": "0px",
-      "float": "left",
-      "height": "40px",
-      "cursor": "pointer",
-      "min-width": "100px",
-      "background": "transparent ",
-      "border-top-left-radius": "5px",
-      "border-top-right-radius": "5px",
-      "border": "0px solid #f0f0f0",
-      "border-bottom": "1px solid #cc3d3d"
-    },
-    "tabTextStyles": {
-      "color": "#666",
-      "font-weight": "bold",
+    "titleTr":{  //viewTitleTrNode   viewTitleLineNode
       "line-height": "40px",
-      "text-align": "center",
-      "margin-right": "8px",
-      "margin-top": "0px",
-      "margin-left": "8px"
-    },
-    "tabCurrentStyles": {
-      "position": "relative",
-      "margin-top": "0px",
-      "margin-left": "2px",
-      "margin-right": "0px",
-      "float": "left",
       "height": "40px",
-      "min-width": "100px",
-      "background": "#cc3d3d",
-      "border-top-left-radius": "5px",
-      "border-top-right-radius": "5px",
-      "border-top": "0px solid #f0f0f0",
-      "border-left": "0px solid #f0f0f0",
-      "border-right": "0px solid #f0f0f0",
-      "border-bottom": "1px solid #cc3d3d"
+      "color": "#666666",
+      "background-color": "#f1f1f1"
     },
-    "tabCurrentTextStyles": {
-      "color": "#FFF",
+    "titleTd":{ //viewTitleColumnNode  viewTitleCellNode
       "font-weight": "bold",
-      "line-height": "40px",
-      "text-align": "center",
-      "margin-right": "8px",
-      "margin-left": "8px",
-      "margin-top": "0px"
-    }
-  },
-  "tab$Content": {
-    "styles": {
-      "padding": "20px 0px"
-    }
-  },
-  "table": {
-    "styles": {
-      "background-color": "#FFF",
-      "margin": "10px 0px"
+      "padding": "0px 10px",
+      "border-bottom": "1px solid #CCC"
     },
-    "titleStyles":{
-      "background-color": "#fff",
-      "color": "#333",
-      "font-weight": "bold",
-      "height": "30px",
-      "line-height": "30px",
-      "text-align": "right"
-    },
-    "contentStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#333"
+    "contentTr" : {
+      "background": "#ffffff"
     },
-    "layoutStyles": {},
-    "properties": {
-      "width": "90%",
-      "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "5",
-      "align": "center"
-    }
-  },
-  "log" : {
-    "tableStyles": {
-      "background-color": "#FFF",
-      "margin": "10px 0px"
+    "contentSelectedTr" : {
+      "background": "#ffeded"
     },
-    "titleStyles":{
-      "background-color": "#fff",
-      "color": "#333",
-      "font-weight": "bold",
+    "contentTd": {
       "height": "30px",
       "line-height": "30px",
-      "text-align": "right"
-    },
-    "contentStyles": {
-      "background-color": "#FFFFFF",
-      "color": "#333"
-    },
-    "properties": {
-      "width": "90%",
-      "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "5",
-      "align": "center"
-    }
-  },
-  "datagrid": {
-    "styles": {},
-    "tableStyles": {
-      "border": "1px solid #cccccc"
+      "padding": "5px 5px",
+      "border-bottom": "1px solid #CCC"
     },
-    "titleStyles": {
-      "height": "28px",
-      "cursor": "pointer",
-      "line-height": "28px",
-      "overflow": "hidden",
-      "opacity": 1,
-      "border-bottom": "1px solid #ccc",
-      "background-color": "#f0f0f0"
+    "contentGroupTd": {
+      "padding": "5px 5px",
+      "border-bottom": "1px solid #CCC",
+      "font-weight": "bold",
+      "background-color": "#F9F9F9",
+      "cursor": "pointer"
     },
-    "contentStyles": {
-      "text-align": "center",
+    "groupCollapseNode": {
       "height": "30px",
       "line-height": "30px",
-      "color": "#666"
-    },
-    "actionStyles": {
-      "background-color": "#f7f7f7"
-    },
-    "editStyles": {
-      "background-color": "#fff6f6",
-      "text-align": "center",
-      "height": "30px",
-      "line-height": "30px"
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/right.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
     },
-    "amountStyles": {
-      "border-top": "1px solid #ccc",
-      "font-weight": "bold",
+    "groupExpandNode": {
       "height": "30px",
       "line-height": "30px",
-      "text-align": "center",
-      "background-color": "#f0f0f0"
-    },
-    "itemTitleStyles": {
-      "height": "40px",
-      "background-color": "#ffffff",
-      "line-height": "30px",
-      "padding": "0px 15px",
-      "color": "#fb4747",
-      "font-size": "18px",
-      "font-weight": "bold",
-      "border-bottom": "0px solid #cccccc"
-    },
-    "properties": {
-      "width": "90%",
+      "padding-left" : "20px",
+      "background-image": "url(/x_component_process_ViewDesigner/$View/default/icon/down.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "left center"
+    },
+    "checkboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon_red/checkbox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "checkedCheckboxNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon_red/checkbox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "radioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon_red/radiobox.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "checkedRadioNode" : {
+      "background-image": "url(/x_component_query_Query/$Viewer/default/icon_red/radiobox_checked.png)",
+      "background-repeat" : "no-repeat",
+      "background-position": "center center"
+    },
+    "tableProperties": {
+      "width": "100%",
       "border": "0",
-      "cellpadding": "3",
-      "cellspacing": "0",
-      "align": "center"
-    }
-  },
-  "datagrid$Title": {
-    "styles": {
-      "background-color": "#f0f0f0"
-    }
-  },
-  "address": {
-    "styles": {
-      "border-bottom": "1px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "height": "26px",
-      "border": "0px solid #ccc",
-      "color": "#666"
-    }
-  },
-  "combox": {
-    "styles": {
-      "border-bottom": "1px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "height": "26px",
-      "border": "0px solid #ccc",
-      "color": "#666"
-    }
-  },
-  "textfield": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "height": "26px",
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
-    }
-  },
-  "calendar": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "height": "26px",
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
-    }
-  },
-  "number": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "height": "26px",
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
-    }
-  },
-  "personfield": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "min-height": "20px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "min-height": "26px",
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
-    }
-  },
-  "orgfield": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "min-height": "20px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
-    }
-  },
-  "org": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "min-height": "20px",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
-    }
-  },
-  "select": {
-    "styles": {
-      "border-bottom": "0px solid #999",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px",
-      "margin-top": "5px",
-      "color": "#666",
-      "line-height": "26px"
-    },
-    "inputStyles": {
-
-    }
-  },
-  "textarea": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px"
-    },
-    "inputStyles": {
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
-    }
-  },
-  "opinion": {
-    "styles": {
-      "border-bottom": "0px solid #ccc",
-      "border-top": "0px",
-      "border-left": "0px",
-      "border-right": "0px"
-    },
-    "inputStyles": {
-      "border-bottom": "1px solid #ccc",
-      "color": "#666"
+      "cellpadding": "0",
+      "cellspacing": "0"
     }
   },
   "actionbar": {
     "style": "xform_red_simple",
-    "customIconStyle" : ""
+    "customIconStyle" : "",
+    "forceStyles" : {
+      "container" : {
+        "width" : "100%",
+        "border-top" : "0px",
+        "border-bottom" : "1px solid #cc3d3d"
+      }
+    }
   },
-  "attachment" : {
-    "style" : "default"
+  "paging" : {
+    "style" : "red"
   }
 }

o2web/source/x_component_query_ViewDesigner/$View/view.html

@@ -24,6 +24,12 @@
                     <input class="editTableRadio" name="display" text{($.display!==false)?'checked':''} type="radio" value="true"/>否
                 </td>
             </tr>
+            <tr>
+                <td class="editTableTitle">视图样式:</td>
+                <td class="editTableValue">
+                    <select class="MWFViewStyle" name="data.viewStyleType"></select>
+                </td>
+            </tr>
             <tr>
                 <td class="editTableTitle">展开分类:</td>
                 <td class="editTableValue">
@@ -38,12 +44,14 @@
                     <input class="editTableRadio" name="data.isSequence" text{($.data.isSequence!=='yes')?'checked':''} type="radio" value="no"/>否
                 </td>
             </tr>
-<!--            <tr>-->
-<!--                <td class="editTableTitle">视图样式:</td>-->
-<!--                <td class="editTableValue">-->
-<!--                    <select class="MWFViewStyle" name="viewStyleType"></select>-->
-<!--                </td>-->
-<!--            </tr>-->
+            <tr>
+                <td class="editTableTitleNoWidth">最大行数:</td>
+                <td class="editTableValue"><input type="number" name="count" value="text{$.count || 600}" class="editTableInput"/></td>
+            </tr>
+            <tr>
+                <td class="editTableTitleNoWidth">每页行数:</td>
+                <td class="editTableValue"><input type="number" name="pageSize" value="text{$.pageSize || 20}" class="editTableInput"/></td>
+            </tr>
             <tr>
                 <td class="editTableTitle">隐藏操作条:</td>
                 <td class="editTableValue">
@@ -64,66 +72,6 @@
             <!--<td class="editTableValue"><input type="text" name="max" value="text{$.max}" class="editTableInput"/></td>-->
             <!--</tr>-->
         </table>
-        <div style="height:24px; text-align: center; line-height: 24px; background-color: #EEE; border-top: 1px solid #999; font-weight: bold">分页</div>
-        <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
-            <tr>
-                <td class="editTableTitleNoWidth">最大行数:</td>
-                <td class="editTableValue"><input type="number" name="count" value="text{$.count || 600}" class="editTableInput"/></td>
-            </tr>
-            <tr>
-                <td class="editTableTitleNoWidth">每页行数:</td>
-                <td class="editTableValue"><input type="number" name="pageSize" value="text{$.pageSize || 20}" class="editTableInput"/></td>
-            </tr>
-            <tr>
-                <td class="editTableTitleNoWidth">显示数字分页:</td>
-                <td class="editTableValue">
-                    <input class="editTableRadio" name="data.hasTruningBar" text{($.data.hasTruningBar!==false)?'checked':''}  onclick="
-                    if (this.checked){
-                        $('text{$.id}visiblePagesTr').setStyle('display', 'table-row');
-                        $('text{$.id}hasBatchTuringTr').setStyle('display', 'table-row');
-                    }" type="radio" value="true"/>是
-                    <input class="editTableRadio" name="data.hasTruningBar" text{($.data.hasTruningBar===false)?'checked':''}   onclick="
-                    if (this.checked){
-                        $('text{$.id}visiblePagesTr').setStyle('display', 'none');
-                        $('text{$.id}hasBatchTuringTr').setStyle('display', 'none');
-                    }" type="radio" value="false"/>否
-                </td>
-            </tr>
-            <tr id="text{$.id}visiblePagesTr">
-                <td class="editTableTitleNoWidth">数字显示个数:</td>
-                <td class="editTableValue"><input type="number" name="data.visiblePages" value="text{$.data.visiblePages || 9}" onchange="
-                    $('text{$.id}visiblePagesText').set('text', this.value);
-                " class="editTableInput"/></td>
-            </tr>
-            <tr id="text{$.id}hasBatchTuringTr">
-                <td class="editTableTitleNoWidth">显示前后<span id="text{$.id}visiblePagesText">text{$.data.visiblePages || 9}</span>页:</td>
-                <td class="editTableValue">
-                    <input class="editTableRadio" name="data.hasBatchTuring" text{($.data.hasBatchTuring!==false)?'checked':''} type="radio" value="true"/>是
-                    <input class="editTableRadio" name="data.hasBatchTuring" text{($.data.hasBatchTuring===false)?'checked':''} type="radio" value="false"/>否
-                </td>
-            </tr>
-            <tr>
-                <td class="editTableTitleNoWidth">显示首页末页:</td>
-                <td class="editTableValue">
-                    <input class="editTableRadio" name="data.hasFirstLastPage" text{($.data.hasFirstLastPage!==false)?'checked':''} type="radio" value="true"/>是
-                    <input class="editTableRadio" name="data.hasFirstLastPage" text{($.data.hasFirstLastPage===false)?'checked':''} type="radio" value="false"/>否
-                </td>
-            </tr>
-            <tr>
-                <td class="editTableTitleNoWidth">显示上页下页:</td>
-                <td class="editTableValue">
-                    <input class="editTableRadio" name="data.hasPreNextPage" text{($.data.hasPreNextPage!==false)?'checked':''} type="radio" value="true"/>是
-                    <input class="editTableRadio" name="data.hasPreNextPage" text{($.data.hasPreNextPage===false)?'checked':''} type="radio" value="false"/>否
-                </td>
-            </tr>
-            <tr>
-                <td class="editTableTitleNoWidth">显示跳页:</td>
-                <td class="editTableValue">
-                    <input class="editTableRadio" name="data.hasPageJumper" text{($.data.hasPageJumper!==false)?'checked':''} type="radio" value="true"/>是
-                    <input class="editTableRadio" name="data.hasPageJumper" text{($.data.hasPageJumper===false)?'checked':''} type="radio" value="false"/>否
-                </td>
-            </tr>
-        </table>
 
         <div style="height:24px; text-align: center; line-height: 24px; background-color: #EEE; border-top: 1px solid #999; font-weight: bold">权限</div>
         <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable" id="processEditStarter">
@@ -196,7 +144,7 @@
                 </td>
             </tr>
         </table>
-        <div id="text{$.id}dateRangeType_process" style="display: text{($.type=='process')?'block':'none'}">
+        <div id="text{$.id}dateRangeType_process" style="display: text{($.type!='cms')?'block':'none'}">
             <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
                 <tr>
                     <td class="editTableTitle">流转状态:</td>
@@ -463,55 +411,55 @@
 
     <div title="过滤"  class="MWFTab">
         <div class="MWFViewFilter">
-            <div>
-                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+            <div class="inputAreaNode_vf">
+                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable_vf">
                     <tr>
                         <td class="editTableTitle">标题:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput titleInput_vf"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">路径:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput pathInput_vf"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">数据类型:</td>
-                        <td class="editTableValue"><select
+                        <td class="editTableValue"><select class="datatypeInput_vf"
                                 onchange="if (this.selectedIndex==2){
                                     $('text{$.id}viewFilterDateFormulaSelector').setStyle('display', 'block');
-                                    $('text{$.id}viewFilterDateFormulaSelector2').setStyle('display', 'block');
+                                    // $('text{$.id}viewFilterDateFormulaSelector2').setStyle('display', 'block');
                                     $('text{$.id}viewFilterDateOnlyFormulaSelector').setStyle('display', 'none');
-                                    $('text{$.id}viewFilterDateOnlyFormulaSelector2').setStyle('display', 'none');
+                                    // $('text{$.id}viewFilterDateOnlyFormulaSelector2').setStyle('display', 'none');
                                     $('text{$.id}viewFilterTimeOnlyFormulaSelector').setStyle('display', 'none');
-                                    $('text{$.id}viewFilterTimeOnlyFormulaSelector2').setStyle('display', 'none');
+                                    // $('text{$.id}viewFilterTimeOnlyFormulaSelector2').setStyle('display', 'none');
                                 }else if (this.selectedIndex==3){
                                     $('text{$.id}viewFilterDateFormulaSelector').setStyle('display', 'none');
-                                    $('text{$.id}viewFilterDateFormulaSelector2').setStyle('display', 'none');
+                                    // $('text{$.id}viewFilterDateFormulaSelector2').setStyle('display', 'none');
                                     $('text{$.id}viewFilterDateOnlyFormulaSelector').setStyle('display', 'block');
-                                    $('text{$.id}viewFilterDateOnlyFormulaSelector2').setStyle('display', 'block');
+                                    // $('text{$.id}viewFilterDateOnlyFormulaSelector2').setStyle('display', 'block');
                                     $('text{$.id}viewFilterTimeOnlyFormulaSelector').setStyle('display', 'none');
-                                    $('text{$.id}viewFilterTimeOnlyFormulaSelector2').setStyle('display', 'none');
+                                    // $('text{$.id}viewFilterTimeOnlyFormulaSelector2').setStyle('display', 'none');
                                 }else if (this.selectedIndex==4){
                                     $('text{$.id}viewFilterDateFormulaSelector').setStyle('display', 'none');
-                                    $('text{$.id}viewFilterDateFormulaSelector2').setStyle('display', 'none');
+                                    // $('text{$.id}viewFilterDateFormulaSelector2').setStyle('display', 'none');
                                     $('text{$.id}viewFilterDateOnlyFormulaSelector').setStyle('display', 'none');
-                                    $('text{$.id}viewFilterDateOnlyFormulaSelector2').setStyle('display', 'none');
+                                    // $('text{$.id}viewFilterDateOnlyFormulaSelector2').setStyle('display', 'none');
                                     $('text{$.id}viewFilterTimeOnlyFormulaSelector').setStyle('display', 'block');
-                                    $('text{$.id}viewFilterTimeOnlyFormulaSelector2').setStyle('display', 'block');
+                                    // $('text{$.id}viewFilterTimeOnlyFormulaSelector2').setStyle('display', 'block');
                                 }else{
                                     $('text{$.id}viewFilterDateFormulaSelector').setStyle('display', 'none');
-                                    $('text{$.id}viewFilterDateFormulaSelector2').setStyle('display', 'none');
+                                    // $('text{$.id}viewFilterDateFormulaSelector2').setStyle('display', 'none');
                                     $('text{$.id}viewFilterDateOnlyFormulaSelector').setStyle('display', 'none');
-                                    $('text{$.id}viewFilterDateOnlyFormulaSelector2').setStyle('display', 'none');
+                                    // $('text{$.id}viewFilterDateOnlyFormulaSelector2').setStyle('display', 'none');
                                     $('text{$.id}viewFilterTimeOnlyFormulaSelector').setStyle('display', 'none');
-                                    $('text{$.id}viewFilterTimeOnlyFormulaSelector2').setStyle('display', 'none');
+                                    // $('text{$.id}viewFilterTimeOnlyFormulaSelector2').setStyle('display', 'none');
                                 }
 
                                 if (this.selectedIndex==0){
                                     $('text{$.id}viewFilterTextFormulaSelector').setStyle('display', 'block');
-                                    $('text{$.id}viewFilterTextFormulaSelector2').setStyle('display', 'block')
+                                    // $('text{$.id}viewFilterTextFormulaSelector2').setStyle('display', 'block')
                                 }else{
                                     $('text{$.id}viewFilterTextFormulaSelector').setStyle('display', 'none');
-                                    $('text{$.id}viewFilterTextFormulaSelector2').setStyle('display', 'none')
+                                    // $('text{$.id}viewFilterTextFormulaSelector2').setStyle('display', 'none')
                                 }">
                             <option value="textValue" selected>文本</option>
                             <option value="numberValue">数字</option>
@@ -524,11 +472,11 @@
                     <tr>
                         <td class="editTableTitle"></td>
                         <td class="editTableValue">
-                            <input type="radio" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                            <input type="radio" class="restrictFilterInput_vf" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){
                                 $('text{$.id}viewFilterRestrict').setStyle('display', 'block');
                                 $('text{$.id}viewCustomFilterRestrict').setStyle('display', 'none');
                             }"/>作为默认过滤条件<br>
-                            <input type="radio" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                            <input type="radio" class="customFilterInput_vf" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){
                                 $('text{$.id}viewFilterRestrict').setStyle('display', 'none');
                                 $('text{$.id}viewCustomFilterRestrict').setStyle('display', 'block');
                             }" checked/>作为自定义过滤数据
@@ -539,12 +487,23 @@
                     <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
                         <tr>
                             <td class="editTableTitle">逻辑:</td>
-                            <td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+                            <td class="editTableValue"><select class="logicInput_vf">
+                                <option selected value="and">并且(and)</option>
+                                <option value="or">或者(or)</option>
+                            </select></td>
                         </tr>
 
                         <tr>
                             <td class="editTableTitle">比较:</td>
-                            <td class="editTableValue"><select onchange="if (this.selectedIndex==8){$('text{$.id}viewFilterValue2Area').setStyle('display', 'block'); $('text{$.id}viewFilterValueTitleArea').set('text', '从');}else{$('text{$.id}viewFilterValue2Area').setStyle('display', 'none'); $('text{$.id}viewFilterValueTitleArea').set('text', '值');}">
+                            <td class="editTableValue"><select class="comparisonInput_vf" onchange="
+                                // if (this.selectedIndex==8){
+                                //     $('text{$.id}viewFilterValue2Area').setStyle('display', 'block');
+                                //     $('text{$.id}viewFilterValueTitleArea').set('text', '从');
+                                // }else{
+                                //     $('text{$.id}viewFilterValue2Area').setStyle('display', 'none');
+                                //     $('text{$.id}viewFilterValueTitleArea').set('text', '值');
+                                // }"
+                                >
                                 <option value="equals" selected>等于(==)</option>
                                 <option value="notEquals">不等于(!=)</option>
                                 <option value="greaterThan">大于(>)</option>
@@ -559,12 +518,12 @@
                         <tr>
                             <td class="editTableTitle" id="text{$.id}viewFilterValueTitleArea">值:</td>
                             <td class="editTableValue" id="text{$.id}viewFilterValueArea">
-                                <input type="text" class="editTableInput" style="display: block" onkeypress="$('text{$.id}viewFilterTextFormulaSelector').getElements('input').set('checked', false)"/>
-                                <input type="number" class="editTableInput" style="display: none"/>
-                                <input type="text" class="editTableInput" style="display: none" readonly/>
-                                <input type="text" class="editTableInput" style="display: none" readonly/>
-                                <input type="text" class="editTableInput" style="display: none" readonly/>
-                                <select style="display: none">
+                                <input type="text" class="editTableInput valueTextInput_vf" style="display: block" onkeypress="$('text{$.id}viewFilterTextFormulaSelector').getElements('input').set('checked', false)"/>
+                                <input type="number" class="editTableInput valueNumberInput_vf" style="display: none"/>
+                                <input type="text" class="editTableInput valueDatetimeInput_vf" style="display: none" readonly/>
+                                <input type="text" class="editTableInput valueDateInput_vf" style="display: none" readonly/>
+                                <input type="text" class="editTableInput valueTimeInput_vf" style="display: none" readonly/>
+                                <select class="valueBooleanInput_vf" style="display: none">
                                     <option value="true" selected>是(True)</option>
                                     <option value="false">否(False)</option>
                                 </select>
@@ -577,11 +536,11 @@
                             <tr>
                                 <td class="editTableTitle"></td>
                                 <td class="editTableValue">
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[2].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@year" />当前年度
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[2].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@season" />当前季度
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[2].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@month" />当前月份<br/>
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[2].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@time" />当前时间
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[2].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@date" />当天
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueDatetimeInput_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@year" />当前年度
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueDatetimeInput_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@season" />当前季度
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueDatetimeInput_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@month" />当前月份<br/>
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueDatetimeInput_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@time" />当前时间
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueDatetimeInput_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@date" />当天
 
                                 </td>
                             </tr>
@@ -592,10 +551,10 @@
                             <tr>
                                 <td class="editTableTitle"></td>
                                 <td class="editTableValue">
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[3].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@year" />当前年度
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[3].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@season" />当前季度
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[3].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@month" />当前月份<br/>
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[3].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@date" />当天
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueDateInput_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@year" />当前年度
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueDateInput_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@season" />当前季度
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueDateInput_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@month" />当前月份<br/>
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueDateInput_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@date" />当天
 
                                 </td>
                             </tr>
@@ -606,7 +565,7 @@
                             <tr>
                                 <td class="editTableTitle"></td>
                                 <td class="editTableValue">
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[4].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@time" />当前时间
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueTimeInput_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@time" />当前时间
                                 </td>
                             </tr>
                         </table>
@@ -617,10 +576,10 @@
                             <tr>
                                 <td class="editTableTitle"></td>
                                 <td class="editTableValue">
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[0].set('value', this.value)" name="text{$.id}viewFilterTextFormula" onclick="" type="radio" value="@person" />当前人
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[0].set('value', this.value)" name="text{$.id}viewFilterTextFormula" type="radio" value="@identityList" />当前身份<br/>
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[0].set('value', this.value)" name="text{$.id}viewFilterTextFormula" type="radio" value="@unitList" />当前人所在直接组织<br/>
-                                    <input onclick="$('text{$.id}viewFilterValueArea').getElements('input')[0].set('value', this.value)" name="text{$.id}viewFilterTextFormula" type="radio" value="@unitAllList" />当前人所在所有组织
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueTextInput_vf').set('value', this.value)" name="text{$.id}viewFilterTextFormula" onclick="" type="radio" value="@person" />当前人
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueTextInput_vf').set('value', this.value)" name="text{$.id}viewFilterTextFormula" type="radio" value="@identityList" />当前身份<br/>
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueTextInput_vf').set('value', this.value)" name="text{$.id}viewFilterTextFormula" type="radio" value="@unitList" />当前人所在直接组织<br/>
+                                    <input onclick="$('text{$.id}viewFilterValueArea').getElement('.valueTextInput_vf').set('value', this.value)" name="text{$.id}viewFilterTextFormula" type="radio" value="@unitAllList" />当前人所在所有组织
                                 </td>
                             </tr>
                         </table>
@@ -631,12 +590,13 @@
                             <tr>
                                 <td class="editTableTitle">到:</td>
                                 <td class="editTableValue" id="text{$.id}viewFilterValueArea2">
-                                    <input type="text" class="editTableInput" style="display: block" onkeypress="$('text{$.id}viewFilterTextFormulaSelector2').getElements('input').set('checked', false)"/>
-                                    <input type="number" class="editTableInput" style="display: none"/>
-                                    <input type="text" class="editTableInput" style="display: none" readonly/>
-                                    <input type="text" class="editTableInput" style="display: none" readonly/>
-                                    <input type="text" class="editTableInput" style="display: none" readonly/>
-                                    <select style="display: none">
+                                    <input type="text" class="editTableInput valueTextInput2_vf" style="display: block">
+<!--                                    onkeypress="$('text{$.id}viewFilterTextFormulaSelector2').getElements('input').set('checked', false)"/>-->
+                                    <input type="number" class="editTableInput valueNumberInput2_vf" style="display: none"/>
+                                    <input type="text" class="editTableInput valueDatetimeInput2_vf" style="display: none" readonly/>
+                                    <input type="text" class="editTableInput valueDateInput2_vf" style="display: none" readonly/>
+                                    <input type="text" class="editTableInput valueTimeInput2_vf" style="display: none" readonly/>
+                                    <select class="valueBooleanInput2_vf" style="display: none">
                                         <option value="true" selected>是(True)</option>
                                         <option value="false">否(False)</option>
                                     </select>
@@ -644,58 +604,59 @@
                             </tr>
                         </table>
 
-                        <div style="display: none" id="text{$.id}viewFilterDateFormulaSelector2">
-                            <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
-                                <tr>
-                                    <td class="editTableTitle"></td>
-                                    <td class="editTableValue">
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[2].set('value', this.value)" name="text{$.id}viewFilterDateFormula2" type="radio" value="@year" />当前年度
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[2].set('value', this.value)" name="text{$.id}viewFilterDateFormula2" type="radio" value="@season" />当前季度
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[2].set('value', this.value)" name="text{$.id}viewFilterDateFormula2" type="radio" value="@month" />当前月份<br/>
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[2].set('value', this.value)" name="text{$.id}viewFilterDateFormula2" type="radio" value="@time" />当前时间
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[2].set('value', this.value)" name="text{$.id}viewFilterDateFormula2" type="radio" value="@date" />当天
+<!--       rang的时候，所有@xxx都是无效的
+                            <div style="display: none" id="text{$.id}viewFilterDateFormulaSelector2">-->
+<!--                            <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">-->
+<!--                                <tr>-->
+<!--                                    <td class="editTableTitle"></td>-->
+<!--                                    <td class="editTableValue">-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueDatetimeInput2_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula2" type="radio" value="@year" />当前年度-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueDatetimeInput2_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula2" type="radio" value="@season" />当前季度-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueDatetimeInput2_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula2" type="radio" value="@month" />当前月份<br/>-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueDatetimeInput2_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula2" type="radio" value="@time" />当前时间-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueDatetimeInput2_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula2" type="radio" value="@date" />当天-->
 
-                                    </td>
-                                </tr>
-                            </table>
-                        </div>
-                        <div style="display: none" id="text{$.id}viewFilterDateOnlyFormulaSelector2">
-                            <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
-                                <tr>
-                                    <td class="editTableTitle"></td>
-                                    <td class="editTableValue">
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[3].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@year" />当前年度
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[3].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@season" />当前季度
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[3].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@month" />当前月份<br/>
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[3].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@date" />当天
+<!--                                    </td>-->
+<!--                                </tr>-->
+<!--                            </table>-->
+<!--                        </div>-->
+<!--                        <div style="display: none" id="text{$.id}viewFilterDateOnlyFormulaSelector2">-->
+<!--                            <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">-->
+<!--                                <tr>-->
+<!--                                    <td class="editTableTitle"></td>-->
+<!--                                    <td class="editTableValue">-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueDateInput2_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@year" />当前年度-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueDateInput2_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@season" />当前季度-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueDateInput2_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@month" />当前月份<br/>-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueDateInput2_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@date" />当天-->
 
-                                    </td>
-                                </tr>
-                            </table>
-                        </div>
-                        <div style="display: none" id="text{$.id}viewFilterTimeOnlyFormulaSelector2">
-                            <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
-                                <tr>
-                                    <td class="editTableTitle"></td>
-                                    <td class="editTableValue">
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[4].set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@time" />当前时间
-                                    </td>
-                                </tr>
-                            </table>
-                        </div>
-                        <div style="display: block" id="text{$.id}viewFilterTextFormulaSelector2">
-                            <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
-                                <tr>
-                                    <td class="editTableTitle"></td>
-                                    <td class="editTableValue">
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[0].set('value', this.value)" name="text{$.id}viewFilterTextFormula2" onclick="" type="radio" value="@person" />当前人
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[0].set('value', this.value)" name="text{$.id}viewFilterTextFormula2" type="radio" value="@identityList" />当前身份<br/>
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[0].set('value', this.value)" name="text{$.id}viewFilterTextFormula2" type="radio" value="@unitList" />当前人所在直接组织<br/>
-                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElements('input')[0].set('value', this.value)" name="text{$.id}viewFilterTextFormula2" type="radio" value="@unitAllList" />当前人所在所有组织
-                                    </td>
-                                </tr>
-                            </table>
-                        </div>
+<!--                                    </td>-->
+<!--                                </tr>-->
+<!--                            </table>-->
+<!--                        </div>-->
+<!--                        <div style="display: none" id="text{$.id}viewFilterTimeOnlyFormulaSelector2">-->
+<!--                            <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">-->
+<!--                                <tr>-->
+<!--                                    <td class="editTableTitle"></td>-->
+<!--                                    <td class="editTableValue">-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueTimeInput2_vf').set('value', this.value)" name="text{$.id}viewFilterDateFormula" type="radio" value="@time" />当前时间-->
+<!--                                    </td>-->
+<!--                                </tr>-->
+<!--                            </table>-->
+<!--                        </div>-->
+<!--                        <div style="display: block" id="text{$.id}viewFilterTextFormulaSelector2">-->
+<!--                            <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">-->
+<!--                                <tr>-->
+<!--                                    <td class="editTableTitle"></td>-->
+<!--                                    <td class="editTableValue">-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueTextInput2_vf').set('value', this.value)" name="text{$.id}viewFilterTextFormula2" onclick="" type="radio" value="@person" />当前人-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueTextInput2_vf').set('value', this.value)" name="text{$.id}viewFilterTextFormula2" type="radio" value="@identityList" />当前身份<br/>-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueTextInput2_vf').set('value', this.value)" name="text{$.id}viewFilterTextFormula2" type="radio" value="@unitList" />当前人所在直接组织<br/>-->
+<!--                                        <input onclick="$('text{$.id}viewFilterValueArea2').getElement('.valueTextInput2_vf').set('value', this.value)" name="text{$.id}viewFilterTextFormula2" type="radio" value="@unitAllList" />当前人所在所有组织-->
+<!--                                    </td>-->
+<!--                                </tr>-->
+<!--                            </table>-->
+<!--                        </div>-->
                     </div>
 
                 </div>
@@ -721,11 +682,11 @@
                     </div>
                 </div>
             </div>
-            <div></div>
+            <div class="actionAreaNode_vf"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="listAreaNode_vf" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="fieldListAreaNode_vf" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
         </div>
     </div>
 
@@ -737,6 +698,10 @@
 <!--        <div class="MWFMaplist" name="contentTdSelectedStyles" collapse="true" title="内容单元格选中样式"></div>-->
 <!--    </div>-->
 
+    <div title="样式"  class="MWFTab">
+        <div class="MWFViewStylesArea" name="data.viewStyles"></div>
+    </div>
+
     <div title="事件"  class="MWFTab">
         <div class="MWFEventsArea" name="data.events"></div>
     </div>

o2web/source/x_component_query_ViewDesigner/$View/view.json

@@ -5,7 +5,7 @@
   "alias": "",
   "description": "",
   "display": true,
-  "type": "process",
+  "type": "View",
 
   "data": {
     "exportGrid": true,

o2web/source/x_component_query_ViewDesigner/Main.js

@@ -782,6 +782,9 @@ MWF.xApplication.query.ViewDesigner.Main = new Class({
             this.options.id = this.view.data.id;
         }.bind(this));
     },
+    preview : function(){
+	    this.view.preview();
+    },
     saveViewAs: function(){
         this.view.saveAs();
 	},

o2web/source/x_component_query_ViewDesigner/Property.js

@@ -64,6 +64,8 @@ MWF.xApplication.query.ViewDesigner.Property = MWF.FVProperty = new Class({
                     this.loadJSONArea();
 
                     this.loadEventsEditor();
+                    this.loadViewStylesArea();
+                    this.loadPagingStylesArea();
                     this.loadActionStylesArea();
                     this.loadActionArea();
                     this.loadStylesList();
@@ -709,6 +711,46 @@ MWF.xApplication.query.ViewDesigner.Property = MWF.FVProperty = new Class({
         var filter = new MWF.xApplication.query.ViewDesigner.Property.Filter(op, table, this);
         filter.editMode();
     },
+    loadViewStylesArea: function(){
+        var _self = this;
+        var viewAreas = this.propertyContent.getElements(".MWFViewStylesArea");
+        viewAreas.each(function(node){
+            var name = node.get("name");
+
+            var d = this.data;
+            Array.each( name.split("."), function(n){
+                if(d)d = d[n];
+            });
+            var viewStyles = d || {};
+            MWF.require("MWF.widget.Maplist", function(){
+                var maps = [];
+                Object.each(viewStyles, function(v, k){
+                    var mapNode = new Element("div").inject(node);
+                    mapNode.empty();
+
+                    var maplist = new MWF.widget.Maplist(mapNode, {
+                        "title": k,
+                        "collapse": true,
+                        "onChange": function(){
+                            // var oldData = _self.data[name];
+                            var oldData = this.data;
+                            Array.each( name.split("."), function(n){
+                                if(oldData)oldData = oldData[n];
+                            });
+                            maps.each(function(o){
+                                d[o.key] = o.map.toJson();
+                            }.bind(this));
+                            _self.changeData(name, node, oldData);
+                        }
+                    });
+                    maps.push({"key": k, "map": maplist});
+                    maplist.load(v);
+                }.bind(this));
+            }.bind(this));
+
+
+        }.bind(this));
+    },
     loadActionStylesArea: function(){
         var _self = this;
         var actionAreas = this.propertyContent.getElements(".MWFActionStylesArea");
@@ -738,6 +780,37 @@ MWF.xApplication.query.ViewDesigner.Property = MWF.FVProperty = new Class({
             }.bind(this));
 
 
+        }.bind(this));
+    },
+    loadPagingStylesArea: function(){
+        var _self = this;
+        var pagingAreas = this.propertyContent.getElements(".MWFPagingStylesArea");
+        pagingAreas.each(function(node){
+            var name = node.get("name");
+            var pagingStyles = this.data[name];
+            MWF.require("MWF.widget.Maplist", function(){
+                var maps = [];
+                Object.each(pagingStyles, function(v, k){
+                    var mapNode = new Element("div").inject(node);
+                    mapNode.empty();
+
+                    var maplist = new MWF.widget.Maplist(mapNode, {
+                        "title": k,
+                        "collapse": true,
+                        "onChange": function(){
+                            var oldData = _self.data[name];
+                            maps.each(function(o){
+                                _self.data[name][o.key] = o.map.toJson();
+                            }.bind(this));
+                            _self.changeData(name, node, oldData);
+                        }
+                    });
+                    maps.push({"key": k, "map": maplist});
+                    maplist.load(v);
+                }.bind(this));
+            }.bind(this));
+
+
         }.bind(this));
     },
     loadEventsEditor: function(){

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

@@ -13,6 +13,7 @@ MWF.xApplication.query.ViewDesigner.LP = {
     "name": "名称",
     "alias": "别名",
     "description": "描述",
+    "saveViewNotice" : "请先保存视图！",
 
     "application" : "数据应用",
     "newView" : "新视图",

o2web/source/x_component_query_ViewDesigner/widget/ViewFilter.js

@@ -87,43 +87,50 @@ MWF.xApplication.query.ViewDesigner.widget.ViewFilter = new Class({
         }.bind(this));
     },
     getInputNodes: function(){
-        this.inputAreaNode = this.node.getFirst("div");
-        this.actionAreaNode = this.inputAreaNode.getNext().setStyles(this.css.actionAreaNode);
-        this.listAreaNode = this.actionAreaNode.getNext().getNext();
-        this.fieldListAreaNode = this.listAreaNode.getNext().getNext();
-        this.restrictViewFilterTable = this.inputAreaNode.getLast("table");
-
-        var selects = this.inputAreaNode.getElements("select");
-        var inputs = this.inputAreaNode.getElements("input");
+        debugger;
+        this.inputAreaNode = this.node.getElement(".inputAreaNode_vf");
+        this.actionAreaNode = this.node.getElement(".actionAreaNode_vf");
+        this.actionAreaNode.setStyles( this.css.actionAreaNode );
+        this.listAreaNode = this.node.getElement(".listAreaNode_vf");
+        this.fieldListAreaNode = this.node.getElement(".fieldListAreaNode_vf");
+
+        this.restrictViewFilterTable = this.node.getElement(".restrictViewFilterTable_vf");
+
         var scriptValueArea = this.node.getElement(".MWFFilterFormulaArea");
         if (scriptValueArea){
             this.createScriptArea(scriptValueArea);
         }
 
-        this.titleInput = inputs[0];
-        this.pathInput = inputs[1];
-        this.datatypeInput = selects[0];
+        this.titleInput = this.inputAreaNode.getElement(".titleInput_vf");
+        this.pathInput = this.inputAreaNode.getElement(".pathInput_vf");
+        this.datatypeInput = this.inputAreaNode.getElement(".datatypeInput_vf");
 
-        this.restrictFilterInput = inputs[2];
-        this.customFilterInput = inputs[3];
+        this.restrictFilterInput = this.inputAreaNode.getElement(".restrictFilterInput_vf");
+        this.customFilterInput = this.inputAreaNode.getElement(".customFilterInput_vf");
 
-        this.logicInput = selects[1];
-        this.comparisonInput = selects[2];
-        this.valueTextInput = inputs[4];
-        this.valueNumberInput = inputs[5];
-        this.valueDatetimeInput = inputs[6];
-        this.valueBooleanInput = selects[3];
-        this.valueDateInput = inputs[7];
-        this.valueTimeInput = inputs[8];
+        this.logicInput = this.inputAreaNode.getElement(".logicInput_vf");
 
-        debugger;
-        var dataId = this.app.view.data.id;
-        this.customFilterValueTypes = this.inputAreaNode.getElements("[name='"+dataId+"viewCustomFilterValueType']");
+        this.comparisonInput = this.inputAreaNode.getElement(".comparisonInput_vf");
+        this.comparisonInput.addEvent("change", function(){
+            this.switchInputDisplay();
+        }.bind(this))
 
-        this.customFilterValueScriptDiv = this.inputAreaNode.getElement("#"+dataId+"viewCustomFilterValueScriptDiv");
-        this.customFilterValueScript = this.inputAreaNode.getElement("[name='"+dataId+"viewCustomFilterValueScript']");
-        if( this.customFilterValueScript ){
-            this.createCustomFilterValueScriptArea(this.customFilterValueScript);
+        this.valueTextInput = this.inputAreaNode.getElement(".valueTextInput_vf");
+        this.valueNumberInput = this.inputAreaNode.getElement(".valueNumberInput_vf");
+        this.valueDatetimeInput = this.inputAreaNode.getElement(".valueDatetimeInput_vf");
+        this.valueBooleanInput = this.inputAreaNode.getElement(".valueBooleanInput_vf");
+        this.valueDateInput = this.inputAreaNode.getElement(".valueDateInput_vf");
+        this.valueTimeInput = this.inputAreaNode.getElement(".valueTimeInput_vf");
+
+        if( this.app.view ){
+            var dataId = this.app.view.data.id;
+            this.customFilterValueTypes = this.inputAreaNode.getElements("[name='"+dataId+"viewCustomFilterValueType']");
+
+            this.customFilterValueScriptDiv = this.inputAreaNode.getElement("#"+dataId+"viewCustomFilterValueScriptDiv");
+            this.customFilterValueScript = this.inputAreaNode.getElement("[name='"+dataId+"viewCustomFilterValueScript']");
+            if( this.customFilterValueScript ){
+                this.createCustomFilterValueScriptArea(this.customFilterValueScript);
+            }
         }
 
         this.datatypeInput.addEvent("change");
@@ -155,7 +162,8 @@ MWF.xApplication.query.ViewDesigner.widget.ViewFilter = new Class({
         }.bind(this));
 
         this.datatypeInput.addEvent("change", function(){
-            this.changeValueInput();
+            // this.changeValueInput();
+            this.switchInputDisplay();
         }.bind(this));
 
         this.valueTextInput.addEvent("keydown", function(e){
@@ -168,53 +176,251 @@ MWF.xApplication.query.ViewDesigner.widget.ViewFilter = new Class({
         if (this.app.view){
             var id = this.app.view.data.id;
             var div = this.node.getElement("#"+id+"viewFilterValueArea2");
-            inputs = div.getElements("input");
-            this.valueTextInput2 = inputs[0] || null;
-            this.valueNumberInput2 = inputs[1] || null;
-            this.valueDatetimeInput2 = inputs[2] || null;
-            this.valueDateInput2 = inputs[3] || null;
-            this.valueTimeInput2 = inputs[4] || null;
-            this.valueBooleanInput2 = div.getElement("select") || null;
-
-            MWF.require("MWF.widget.Calendar", function(){
-                this.calendar = new MWF.widget.Calendar(this.valueDatetimeInput2, {
-                    "style": "xform",
-                    "isTime": true,
-                    "secondEnable": true,
-                    "target": this.app.content,
-                    "format": "db",
-                    "onComplate": function(){
-                        this.node.getElement("#"+id+"viewFilterDateFormulaSelector2").getElements("input").set("checked", false);
-                    }.bind(this)
-                });
-                new MWF.widget.Calendar(this.valueDateInput2, {
-                    "style": "xform",
-                    "isTime": false,
-                    "target": this.app.content,
-                    "format": "%Y-%m-%d"
-                });
-                new MWF.widget.Calendar(this.valueTimeInput2, {
-                    "style": "xform",
-                    "timeOnly": true,
-                    "secondEnable": true,
-                    "target": this.app.content,
-                    "format": "%H:%M:%S"
-                });
-            }.bind(this));
+            // inputs = div.getElements("input");
+            if( div ){
+                this.valueTextInput2 = div.getElement(".valueTextInput2_vf") || null;
+                this.valueNumberInput2 = div.getElement(".valueNumberInput2_vf") || null;
+                this.valueDatetimeInput2 = div.getElement(".valueDatetimeInput2_vf") || null;
+                this.valueDateInput2 = div.getElement(".valueDateInput2_vf") || null;
+                this.valueTimeInput2 = div.getElement(".valueTimeInput2_vf") || null;
+                this.valueBooleanInput2 = div.getElement(".valueBooleanInput2_vf") || null;
 
-            this.valueTextInput2.addEvent("keydown", function(e){
-                if (e.code==13) this.modifyOrAddFilterItem();
-            }.bind(this));
-            this.valueNumberInput2.addEvent("keydown", function(e){
-                if (e.code==13) this.modifyOrAddFilterItem();
-            }.bind(this));
+                MWF.require("MWF.widget.Calendar", function(){
+                    this.calendar = new MWF.widget.Calendar(this.valueDatetimeInput2, {
+                        "style": "xform",
+                        "isTime": true,
+                        "secondEnable": true,
+                        "target": this.app.content,
+                        "format": "db",
+                        "onComplate": function(){
+                            this.node.getElement("#"+id+"viewFilterDateFormulaSelector2").getElements("input").set("checked", false);
+                        }.bind(this)
+                    });
+                    new MWF.widget.Calendar(this.valueDateInput2, {
+                        "style": "xform",
+                        "isTime": false,
+                        "target": this.app.content,
+                        "format": "%Y-%m-%d"
+                    });
+                    new MWF.widget.Calendar(this.valueTimeInput2, {
+                        "style": "xform",
+                        "timeOnly": true,
+                        "secondEnable": true,
+                        "target": this.app.content,
+                        "format": "%H:%M:%S"
+                    });
+                }.bind(this));
+
+                this.valueTextInput2.addEvent("keydown", function(e){
+                    if (e.code==13) this.modifyOrAddFilterItem();
+                }.bind(this));
+                this.valueNumberInput2.addEvent("keydown", function(e){
+                    if (e.code==13) this.modifyOrAddFilterItem();
+                }.bind(this));
+            }
         }
     },
-    changeValueInput: function(){
-        var type = this.datatypeInput.options[this.datatypeInput.selectedIndex].value;
-        switch (type){
+    switchInputDisplay : function(){
+        var id = "";
+        if( this.app.view ){
+            id = this.app.view.data.id;
+        }
+
+        var config = {
+            "textValue": {
+                "equals": {
+                    "selectorArea" : ["#"+id+"viewFilterTextFormulaSelector"] //["input", "@person", "@unitList", "@unitAllList", "@identityList" ],
+                },
+                "notEquals": {
+                    "selectorArea" : ["#"+id+"viewFilterTextFormulaSelector"] //["input", "@person", "@unitList", "@unitAllList", "@identityList" ],
+                },
+                "greaterThan": {
+                    "invalidValue" : ["@person", "@unitList", "@unitAllList", "@identityList" ]
+                },
+                "greaterThanOrEqualTo": {
+                    "invalidValue" : ["@person", "@unitList", "@unitAllList", "@identityList" ]
+                },
+                "lessThan": {
+                    "invalidValue" : ["@person", "@unitList", "@unitAllList", "@identityList" ]
+                },
+                "lessThanOrEqualTo": {
+                    "invalidValue" : ["@person", "@unitList", "@unitAllList", "@identityList" ]
+                },
+                "like": {
+                    "invalidValue" : ["@person", "@unitList", "@unitAllList", "@identityList" ]
+                },
+                "notLike": {
+                    "invalidValue" : ["@person", "@unitList", "@unitAllList", "@identityList" ]
+                },
+                "range": {
+                    "invalidValue" : ["@person", "@unitList", "@unitAllList", "@identityList" ]
+                }
+            },
+            "numberValue": {
+                "equals": {}, //["input"]
+                "notEquals": {},
+                "greaterThan": {},
+                "greaterThanOrEqualTo": {},
+                "lessThan": {},
+                "lessThanOrEqualTo": {},
+                "range": {}
+            },
+            "dateTimeValue": {
+                "equals": {
+                    "invalidValue" : ["@year","@season","@month","@time","@date"]
+                },
+                "notEquals": {
+                    "selectorArea" : ["#"+id+"viewFilterDateFormulaSelector"]
+                },
+                "greaterThan": {
+                    "selectorArea" : ["#"+id+"viewFilterDateFormulaSelector"]
+                },
+                "greaterThanOrEqualTo": {
+                    "selectorArea" : ["#"+id+"viewFilterDateFormulaSelector"]
+                },
+                "lessThan": {
+                    "selectorArea" : ["#"+id+"viewFilterDateFormulaSelector"]
+                },
+                "lessThanOrEqualTo": {
+                    "selectorArea" : ["#"+id+"viewFilterDateFormulaSelector"]
+                },
+                "range": {
+                    "invalidValue" : ["@year","@season","@month","@time","@date"]
+                }
+            },
+            "dateValue": {
+                "equals": {
+                    "invalidValue" : ["@year","@season","@month","@date"]
+                },
+                "notEquals": {
+                    "selectorArea" : ["#"+id+"viewFilterDateOnlyFormulaSelector"]
+                },
+                "greaterThan":{
+                    "selectorArea" : ["#"+id+"viewFilterDateOnlyFormulaSelector"]
+                },
+                "greaterThanOrEqualTo": {
+                    "selectorArea" : ["#"+id+"viewFilterDateOnlyFormulaSelector"]
+                },
+                "lessThan": {
+                    "selectorArea" : ["#"+id+"viewFilterDateOnlyFormulaSelector"]
+                },
+                "lessThanOrEqualTo": {
+                    "selectorArea" : ["#"+id+"viewFilterDateOnlyFormulaSelector"]
+                },
+                "range": {
+                    "invalidValue" : ["@year","@season","@month","@date"]
+                }
+            },
+            "timeValue": {
+                "equals": {
+                    "invalidValue" : ["@time"]
+                },
+                "notEquals": {
+                    "selectorArea" : ["#"+id+"viewFilterTimeOnlyFormulaSelector"]
+                },
+                "greaterThan": {
+                    "selectorArea" : ["#"+id+"viewFilterTimeOnlyFormulaSelector"]
+                },
+                "greaterThanOrEqualTo": {
+                    "selectorArea" : ["#"+id+"viewFilterTimeOnlyFormulaSelector"]
+                },
+                "lessThan": {
+                    "selectorArea" : ["#"+id+"viewFilterTimeOnlyFormulaSelector"]
+                },
+                "lessThanOrEqualTo": {
+                    "selectorArea" : ["#"+id+"viewFilterTimeOnlyFormulaSelector"]
+                },
+                "range": {
+                    "invalidValue" : ["@time"]
+                }
+            },
+            "booleanValue": {
+                "equals": {},
+                "notEquals": {}
+            }
+        };
+
+        debugger;
+
+        var formulaSelectorIdList = [
+            "#"+id+"viewFilterTextFormulaSelector",
+            "#"+id+"viewFilterDateFormulaSelector",
+            "#"+id+"viewFilterDateOnlyFormulaSelector",
+            "#"+id+"viewFilterTimeOnlyFormulaSelector"
+        ];
+
+        var formatType = this.datatypeInput.options[this.datatypeInput.selectedIndex].value;
+        var object = config[formatType];
+
+        var availableComparisonList = Object.keys( object );
+        var options = this.comparisonInput.options;
+
+        var comparison = options[this.comparisonInput.selectedIndex].value;
+
+        if( !this.originalComparisonOptions ){
+            this.originalComparisonOptions = [];
+            for( var i=0; i< options.length; i++ ){
+                this.originalComparisonOptions.push({
+                    "text" : options[i].text,
+                    "value" : options[i].value
+                });
+            }
+        }
+
+        while( this.comparisonInput.options && this.comparisonInput.options.length ){
+            this.comparisonInput.options[0].destroy();
+        }
+
+        for( var i=0; i<this.originalComparisonOptions.length; i++ ){
+            var opt = this.originalComparisonOptions[i];
+            if( availableComparisonList.contains( opt.value )){
+                var option = new Element("option", {
+                    text : opt.text,
+                    value : opt.value
+                }).inject( this.comparisonInput );
+                if( opt.value === comparison )option.selected = true;
+            }
+        }
+
+        var availableInputArray = [];
+        var invalidValue = [];
+        for( var key in object ){
+            if( comparison === key ){
+                availableInputArray = object[key].selectorArea || [];
+                invalidValue = object[key].invalidValue || [];
+                break;
+            }
+        }
+        for( var i=0; i<invalidValue.length; i++ ){
+            invalidValue[i] = invalidValue[i].toLowerCase();
+        }
+
+        formulaSelectorIdList.each( function(id) {
+            var el = this.inputAreaNode.getElement( id );
+            if( !el )return;
+            el.setStyle("display", availableInputArray.contains(id) ? "block" : "none" );
+        }.bind(this));
+
+        var viewFilterValue2Area, viewFilterValueTitleArea;
+        if ( availableComparisonList.contains("range") && comparison=="range"){
+            viewFilterValue2Area = this.inputAreaNode.getElement("#"+id+"viewFilterValue2Area");
+            if(viewFilterValue2Area)viewFilterValue2Area.setStyle('display', 'block');
+
+            viewFilterValueTitleArea = this.inputAreaNode.getElement("#"+id+"viewFilterValueTitleArea");
+            if(viewFilterValueTitleArea)viewFilterValueTitleArea.set('text', '从');
+        }else{
+            viewFilterValue2Area = this.inputAreaNode.getElement("#"+id+"viewFilterValue2Area");
+            if(viewFilterValue2Area)viewFilterValue2Area.setStyle('display', 'none');
+
+            viewFilterValueTitleArea = this.inputAreaNode.getElement("#"+id+"viewFilterValueTitleArea");
+            if(viewFilterValueTitleArea)viewFilterValueTitleArea.set('text', '值');
+        }
+        switch (formatType){
             case "textValue":
                 this.valueTextInput.setStyle("display", "block");
+                if( invalidValue.contains( (this.valueTextInput.get("value") || "" ).toLowerCase() )){
+                    this.valueTextInput.set("value","");
+                }
                 this.valueNumberInput.setStyle("display", "none");
                 this.valueDatetimeInput.setStyle("display", "none");
                 this.valueDateInput.setStyle("display", "none");
@@ -230,6 +436,9 @@ MWF.xApplication.query.ViewDesigner.widget.ViewFilter = new Class({
             case "numberValue":
                 this.valueTextInput.setStyle("display", "none");
                 this.valueNumberInput.setStyle("display", "block");
+                if( invalidValue.contains( (this.valueNumberInput.get("value") || "" ).toLowerCase() )){
+                    this.valueNumberInput.set("value","");
+                }
                 this.valueDatetimeInput.setStyle("display", "none");
                 this.valueBooleanInput.setStyle("display", "none");
                 this.valueDateInput.setStyle("display", "none");
@@ -246,6 +455,9 @@ MWF.xApplication.query.ViewDesigner.widget.ViewFilter = new Class({
                 this.valueTextInput.setStyle("display", "none");
                 this.valueNumberInput.setStyle("display", "none");
                 this.valueDatetimeInput.setStyle("display", "block");
+                if( invalidValue.contains( (this.valueDatetimeInput.get("value") || "" ).toLowerCase() )){
+                    this.valueDatetimeInput.set("value","");
+                }
                 this.valueBooleanInput.setStyle("display", "none");
                 this.valueDateInput.setStyle("display", "none");
                 this.valueTimeInput.setStyle("display", "none");
@@ -262,6 +474,9 @@ MWF.xApplication.query.ViewDesigner.widget.ViewFilter = new Class({
                 this.valueDatetimeInput.setStyle("display", "none");
                 this.valueBooleanInput.setStyle("display", "none");
                 this.valueDateInput.setStyle("display", "block");
+                if( invalidValue.contains( (this.valueDateInput.get("value") || "" ).toLowerCase() )){
+                    this.valueDateInput.set("value","");
+                }
                 this.valueTimeInput.setStyle("display", "none");
                 if (this.valueTextInput2) this.valueTextInput2.setStyle("display", "none");
                 if (this.valueNumberInput2) this.valueNumberInput2.setStyle("display", "none");
@@ -277,6 +492,9 @@ MWF.xApplication.query.ViewDesigner.widget.ViewFilter = new Class({
                 this.valueBooleanInput.setStyle("display", "none");
                 this.valueDateInput.setStyle("display", "none");
                 this.valueTimeInput.setStyle("display", "block");
+                if( invalidValue.contains( (this.valueTimeInput.get("value") || "" ).toLowerCase() )){
+                    this.valueTimeInput.set("value","");
+                }
                 if (this.valueTextInput2) this.valueTextInput2.setStyle("display", "none");
                 if (this.valueNumberInput2) this.valueNumberInput2.setStyle("display", "none");
                 if (this.valueDatetimeInput2) this.valueDatetimeInput2.setStyle("display", "none");
@@ -288,6 +506,8 @@ MWF.xApplication.query.ViewDesigner.widget.ViewFilter = new Class({
                 this.valueTextInput.setStyle("display", "none");
                 this.valueNumberInput.setStyle("display", "none");
                 this.valueDatetimeInput.setStyle("display", "none");
+                this.valueDateInput.setStyle("display", "none");
+                this.valueTimeInput.setStyle("display", "none");
                 this.valueBooleanInput.setStyle("display", "block");
                 if (this.valueTextInput2) this.valueTextInput2.setStyle("display", "none");
                 if (this.valueNumberInput2) this.valueNumberInput2.setStyle("display", "none");
@@ -298,6 +518,219 @@ MWF.xApplication.query.ViewDesigner.widget.ViewFilter = new Class({
                 break;
         }
     },
+    // getInputNodes: function(){
+    //     this.inputAreaNode = this.node.getFirst("div");
+    //     this.actionAreaNode = this.inputAreaNode.getNext().setStyles(this.css.actionAreaNode);
+    //     this.listAreaNode = this.actionAreaNode.getNext().getNext();
+    //     this.fieldListAreaNode = this.listAreaNode.getNext().getNext();
+    //     this.restrictViewFilterTable = this.inputAreaNode.getLast("table");
+    //
+    //     var selects = this.inputAreaNode.getElements("select");
+    //     var inputs = this.inputAreaNode.getElements("input");
+    //     var scriptValueArea = this.node.getElement(".MWFFilterFormulaArea");
+    //     if (scriptValueArea){
+    //         this.createScriptArea(scriptValueArea);
+    //     }
+    //
+    //     this.titleInput = inputs[0];
+    //     this.pathInput = inputs[1];
+    //     this.datatypeInput = selects[0];
+    //
+    //     this.restrictFilterInput = inputs[2];
+    //     this.customFilterInput = inputs[3];
+    //
+    //     this.logicInput = selects[1];
+    //     this.comparisonInput = selects[2];
+    //     this.valueTextInput = inputs[4];
+    //     this.valueNumberInput = inputs[5];
+    //     this.valueDatetimeInput = inputs[6];
+    //     this.valueBooleanInput = selects[3];
+    //     this.valueDateInput = inputs[7];
+    //     this.valueTimeInput = inputs[8];
+    //
+    //     debugger;
+    //     var dataId = this.app.view.data.id;
+    //     this.customFilterValueTypes = this.inputAreaNode.getElements("[name='"+dataId+"viewCustomFilterValueType']");
+    //
+    //     this.customFilterValueScriptDiv = this.inputAreaNode.getElement("#"+dataId+"viewCustomFilterValueScriptDiv");
+    //     this.customFilterValueScript = this.inputAreaNode.getElement("[name='"+dataId+"viewCustomFilterValueScript']");
+    //     if( this.customFilterValueScript ){
+    //         this.createCustomFilterValueScriptArea(this.customFilterValueScript);
+    //     }
+    //
+    //     this.datatypeInput.addEvent("change");
+    //
+    //     MWF.require("MWF.widget.Calendar", function(){
+    //         this.calendar = new MWF.widget.Calendar(this.valueDatetimeInput, {
+    //             "style": "xform",
+    //             "isTime": true,
+    //             "secondEnable": true,
+    //             "target": this.app.content,
+    //             "format": "db",
+    //             "onComplate": function(){
+    //                 this.node.getElement("#"+id+"viewFilterDateFormulaSelector").getElements("input").set("checked", false);
+    //             }.bind(this)
+    //         });
+    //         new MWF.widget.Calendar(this.valueDateInput, {
+    //             "style": "xform",
+    //             "isTime": false,
+    //             "target": this.app.content,
+    //             "format": "%Y-%m-%d"
+    //         });
+    //         new MWF.widget.Calendar(this.valueTimeInput, {
+    //             "style": "xform",
+    //             "timeOnly": true,
+    //             "secondEnable": true,
+    //             "target": this.app.content,
+    //             "format": "%H:%M:%S"
+    //         });
+    //     }.bind(this));
+    //
+    //     this.datatypeInput.addEvent("change", function(){
+    //         this.changeValueInput();
+    //     }.bind(this));
+    //
+    //     this.valueTextInput.addEvent("keydown", function(e){
+    //         if (e.code==13) this.modifyOrAddFilterItem();
+    //     }.bind(this));
+    //     this.valueNumberInput.addEvent("keydown", function(e){
+    //         if (e.code==13) this.modifyOrAddFilterItem();
+    //     }.bind(this));
+    //
+    //     if (this.app.view){
+    //         var id = this.app.view.data.id;
+    //         var div = this.node.getElement("#"+id+"viewFilterValueArea2");
+    //         inputs = div.getElements("input");
+    //         this.valueTextInput2 = inputs[0] || null;
+    //         this.valueNumberInput2 = inputs[1] || null;
+    //         this.valueDatetimeInput2 = inputs[2] || null;
+    //         this.valueDateInput2 = inputs[3] || null;
+    //         this.valueTimeInput2 = inputs[4] || null;
+    //         this.valueBooleanInput2 = div.getElement("select") || null;
+    //
+    //         MWF.require("MWF.widget.Calendar", function(){
+    //             this.calendar = new MWF.widget.Calendar(this.valueDatetimeInput2, {
+    //                 "style": "xform",
+    //                 "isTime": true,
+    //                 "secondEnable": true,
+    //                 "target": this.app.content,
+    //                 "format": "db",
+    //                 "onComplate": function(){
+    //                     this.node.getElement("#"+id+"viewFilterDateFormulaSelector2").getElements("input").set("checked", false);
+    //                 }.bind(this)
+    //             });
+    //             new MWF.widget.Calendar(this.valueDateInput2, {
+    //                 "style": "xform",
+    //                 "isTime": false,
+    //                 "target": this.app.content,
+    //                 "format": "%Y-%m-%d"
+    //             });
+    //             new MWF.widget.Calendar(this.valueTimeInput2, {
+    //                 "style": "xform",
+    //                 "timeOnly": true,
+    //                 "secondEnable": true,
+    //                 "target": this.app.content,
+    //                 "format": "%H:%M:%S"
+    //             });
+    //         }.bind(this));
+    //
+    //         this.valueTextInput2.addEvent("keydown", function(e){
+    //             if (e.code==13) this.modifyOrAddFilterItem();
+    //         }.bind(this));
+    //         this.valueNumberInput2.addEvent("keydown", function(e){
+    //             if (e.code==13) this.modifyOrAddFilterItem();
+    //         }.bind(this));
+    //     }
+    // },
+    // changeValueInput: function(){
+    //     var type = this.datatypeInput.options[this.datatypeInput.selectedIndex].value;
+    //     switch (type){
+    //         case "textValue":
+    //             this.valueTextInput.setStyle("display", "block");
+    //             this.valueNumberInput.setStyle("display", "none");
+    //             this.valueDatetimeInput.setStyle("display", "none");
+    //             this.valueDateInput.setStyle("display", "none");
+    //             this.valueTimeInput.setStyle("display", "none");
+    //             this.valueBooleanInput.setStyle("display", "none");
+    //             if (this.valueTextInput2) this.valueTextInput2.setStyle("display", "block");
+    //             if (this.valueNumberInput2) this.valueNumberInput2.setStyle("display", "none");
+    //             if (this.valueDatetimeInput2) this.valueDatetimeInput2.setStyle("display", "none");
+    //             if (this.valueDateInput2) this.valueDateInput2.setStyle("display", "none");
+    //             if (this.valueTimeInput2) this.valueTimeInput2.setStyle("display", "none");
+    //             if (this.valueBooleanInput2) this.valueBooleanInput2.setStyle("display", "none");
+    //             break;
+    //         case "numberValue":
+    //             this.valueTextInput.setStyle("display", "none");
+    //             this.valueNumberInput.setStyle("display", "block");
+    //             this.valueDatetimeInput.setStyle("display", "none");
+    //             this.valueBooleanInput.setStyle("display", "none");
+    //             this.valueDateInput.setStyle("display", "none");
+    //             this.valueTimeInput.setStyle("display", "none");
+    //             if (this.valueTextInput2) this.valueTextInput2.setStyle("display", "none");
+    //             if (this.valueNumberInput2) this.valueNumberInput2.setStyle("display", "block");
+    //             if (this.valueDatetimeInput2) this.valueDatetimeInput2.setStyle("display", "none");
+    //             if (this.valueDateInput2) this.valueDateInput2.setStyle("display", "none");
+    //             if (this.valueTimeInput2) this.valueTimeInput2.setStyle("display", "none");
+    //             if (this.valueBooleanInput2) this.valueBooleanInput2.setStyle("display", "none");
+    //             break;
+    //         case "datetimeValue":
+    //         case "dateTimeValue":
+    //             this.valueTextInput.setStyle("display", "none");
+    //             this.valueNumberInput.setStyle("display", "none");
+    //             this.valueDatetimeInput.setStyle("display", "block");
+    //             this.valueBooleanInput.setStyle("display", "none");
+    //             this.valueDateInput.setStyle("display", "none");
+    //             this.valueTimeInput.setStyle("display", "none");
+    //             if (this.valueTextInput2) this.valueTextInput2.setStyle("display", "none");
+    //             if (this.valueNumberInput2) this.valueNumberInput2.setStyle("display", "none");
+    //             if (this.valueDatetimeInput2) this.valueDatetimeInput2.setStyle("display", "block");
+    //             if (this.valueDateInput2) this.valueDateInput2.setStyle("display", "none");
+    //             if (this.valueTimeInput2) this.valueTimeInput2.setStyle("display", "none");
+    //             if (this.valueBooleanInput2) this.valueBooleanInput2.setStyle("display", "none");
+    //             break;
+    //         case "dateValue":
+    //             this.valueTextInput.setStyle("display", "none");
+    //             this.valueNumberInput.setStyle("display", "none");
+    //             this.valueDatetimeInput.setStyle("display", "none");
+    //             this.valueBooleanInput.setStyle("display", "none");
+    //             this.valueDateInput.setStyle("display", "block");
+    //             this.valueTimeInput.setStyle("display", "none");
+    //             if (this.valueTextInput2) this.valueTextInput2.setStyle("display", "none");
+    //             if (this.valueNumberInput2) this.valueNumberInput2.setStyle("display", "none");
+    //             if (this.valueDatetimeInput2) this.valueDatetimeInput2.setStyle("display", "none");
+    //             if (this.valueDateInput2) this.valueDateInput2.setStyle("display", "block");
+    //             if (this.valueTimeInput2) this.valueTimeInput2.setStyle("display", "none");
+    //             if (this.valueBooleanInput2) this.valueBooleanInput2.setStyle("display", "none");
+    //             break;
+    //         case "timeValue":
+    //             this.valueTextInput.setStyle("display", "none");
+    //             this.valueNumberInput.setStyle("display", "none");
+    //             this.valueDatetimeInput.setStyle("display", "none");
+    //             this.valueBooleanInput.setStyle("display", "none");
+    //             this.valueDateInput.setStyle("display", "none");
+    //             this.valueTimeInput.setStyle("display", "block");
+    //             if (this.valueTextInput2) this.valueTextInput2.setStyle("display", "none");
+    //             if (this.valueNumberInput2) this.valueNumberInput2.setStyle("display", "none");
+    //             if (this.valueDatetimeInput2) this.valueDatetimeInput2.setStyle("display", "none");
+    //             if (this.valueDateInput2) this.valueDateInput2.setStyle("display", "none");
+    //             if (this.valueTimeInput2) this.valueTimeInput2.setStyle("display", "block");
+    //             if (this.valueBooleanInput2) this.valueBooleanInput2.setStyle("display", "none");
+    //             break;
+    //         case "booleanValue":
+    //             this.valueTextInput.setStyle("display", "none");
+    //             this.valueNumberInput.setStyle("display", "none");
+    //             this.valueDatetimeInput.setStyle("display", "none");
+    //             this.valueTimeInput.setStyle("display", "none");
+    //             this.valueBooleanInput.setStyle("display", "block");
+    //             if (this.valueTextInput2) this.valueTextInput2.setStyle("display", "none");
+    //             if (this.valueNumberInput2) this.valueNumberInput2.setStyle("display", "none");
+    //             if (this.valueDatetimeInput2) this.valueDatetimeInput2.setStyle("display", "none");
+    //             if (this.valueDateInput2) this.valueDateInput2.setStyle("display", "none");
+    //             if (this.valueTimeInput2) this.valueTimeInput2.setStyle("display", "none");
+    //             if (this.valueBooleanInput2) this.valueBooleanInput2.setStyle("display", "block");
+    //             break;
+    //     }
+    // },
     createActionNode: function(){
         this.actionNode = new Element("div", {"styles": this.css.actionNode}).inject(this.actionAreaNode);
         this.actionNode.addEvent("click", function(){
@@ -612,7 +1045,7 @@ MWF.xApplication.query.ViewDesigner.widget.ViewFilter = new Class({
         }
 
 
-        this.changeValueInput();
+        this.switchInputDisplay();
         if(this.datatypeInput.onchange){
             this.datatypeInput.onchange();
         }

o2web/source/x_desktop/cmspreview.html

@@ -30,11 +30,16 @@
                     if (layout.config.app_protocol=="auto"){
                         layout.config.app_protocol = window.location.protocol;
                     }
+
+
                     //MWF.defaultPath = "/x_desktop"+MWF.defaultPath;
                     MWF.loadLP(MWF.language);
+                    MWF.require("MWF.widget.Common", null, false);
+                    MWF.require("MWF.xDesktop.Common", null, false);
+                    MWF.require("MWF.xAction.RestActions", null, false);
                     MWF.require("MWF.xDesktop.Layout", function(){
                         //MWF.require("MWF.xDesktop.Authentication", null, false);
-
+                        MWF.require("MWF.xDesktop.Actions.RestActions", null, false);
                         (function(){
                             layout.load = function(){
                                 //        if (this.isAuthentication()){
@@ -67,7 +72,12 @@
                                 //        }
                             };
 
-                            layout.load();
+                            // layout.load();
+                            MWF.xDesktop.getServiceAddress(layout.config, function (service, center) {
+                                layout.serviceAddressList = service;
+                                layout.centerServer = center;
+                                layout.load();
+                            }.bind(this));
                         })();
 
                     });