Răsfoiți Sursa

设计搜索功能

huqi 5 ani în urmă
părinte
comite
335ead3fa7

+ 68 - 0
o2web/source/o2_core/o2/widget/$O2Identity/find/css.wcss

@@ -0,0 +1,68 @@
+{
+    "identityNode": {
+        "padding": "0 10px",
+        "float": "left",
+        "margin-right": "5px",
+        "margin-left": "5px",
+        "background": "#ffffff",
+        "border-radius":"100px",
+        "color": "#666",
+        "border": "1px solid #cccccc",
+        "font-size": "12px",
+        "cursor": "pointer",
+    },
+    "identityNode_over": {
+        "padding": "0 10px",
+        "float": "left",
+        "margin-right": "5px",
+        "margin-left": "5px",
+        "background-color": "#f3f3f3",
+        "border-radius":"100px",
+        "border": "1px solid #f3f3f3",
+        "color": "#666",
+        "cursor": "pointer"
+    },
+    "identityRemoveNode": {
+        "background": "url("+o2.session.path+"/widget/$O2Identity/find/icon/del.png) center center no-repeat",
+        "width": "16px",
+        "margin-left": "5px",
+        "height": "20px",
+        "float": "right"
+    },
+    "identityInforNode": {
+        "overflow": "hidden"
+    },
+    "identityInforNameNode": {
+        "height": "40px"
+    },
+    "identityInforPicNode": {
+        "height": "40px",
+        "width": "40px",
+        "float": "left"
+    },
+    "identityInforRightTextNode": {
+        "height": "40px",
+        "float": "left",
+        "margin-left": "20px"
+    },
+    "identityInforNameTextNode": {
+        "height": "20px",
+        "line-height": "20px",
+        "width": "120px",
+        "color": "#da7429",
+        "font-size": "12px",
+        "font-weight": "bold"
+    },
+    "identityInforEmployeeTextNode": {
+        "height": "16px",
+        "line-height": "16px",
+        "width": "120px",
+        "color": "#999999",
+        "font-size": "12px"
+    },
+    "identityInforPhoneNode": {
+        "padding": "0px",
+        "margin-top": "15px",
+        "height": "10px"
+    }
+}

BIN
o2web/source/o2_core/o2/widget/$O2Identity/find/icon/del.png


+ 61 - 2
o2web/source/x_component_FindDesigner/$Main/default/style.css

@@ -15,8 +15,8 @@
     background-color: #ffffff;
 }
 .rangeNode {
-    height: 20px;
-    padding: 10px 0;
+    height: 40px;
+    padding: 0;
     line-height: 20px;
     border-top: 1px solid #cccccc;
     border-bottom: 1px solid #cccccc;
@@ -64,6 +64,65 @@
     display: inline-flex;
     cursor: default;
 }
+.rangeType_Item {
+    margin-left: 5px;
+    float: left;
+    display: inline-flex;
+    cursor: default;
+}
+.rangeNode_title {
+    float: left;
+    padding: 0 10px;
+    text-align: center;
+    width: 75px;
+    font-size: 12px;
+    font-weight: bold;
+    height: 40px;
+    line-height: 40px;
+}
+.rangeNode_content {
+    width: 400px;
+    font-size: 12px;
+    color: #666666;
+    padding: 10px 0;
+    height: 20px;
+    float: left;
+}
+.rangeNode_select {
+    margin-left: 495px;
+    padding: 0;
+    height: 40px;
+}
+.rangeNode_select_area {
+    padding: 5px 0;
+    height: 30px;
+}
+.rangeNode_select_action_area {
+    float: left;
+    width: 100px;
+    padding: 4px 10px;
+    border-right: 1px solid #cccccc;
+    border-left: 1px solid #cccccc;
+    height: 22px;
+}
+.rangeNode_select_action {
+    border: 1px solid #bbbbbb;
+    height: 20px;
+    padding: 0 10px;
+    border-radius: 12px;
+    background-color: #f9f9f9;
+    cursor: pointer;
+    font-size: 12px;
+    color: #888888;
+}
+.rangeNode_select_content {
+    margin-left: 120px;
+    background-color: #ffffff;
+    height: 22px;
+    overflow: hidden;
+    padding: 4px 5px;
+}
+
 .keywordNode_inputArea {
     margin-left: 95px;
     height: 30px;

+ 18 - 9
o2web/source/x_component_FindDesigner/$Main/default/view.html

@@ -22,20 +22,29 @@
             <div class="keywordNode_icon"></div>
             <div class="keywordNode_action"></div>
             <div class="keywordNode_area">
-                <input class="keywordNode_input" type="text" placeholder="{{$.lp.search_placeholder}}"/>
+                <input class="keywordNode_input" data-o2-element="keywordInputNode" type="text" placeholder="{{$.lp.search_placeholder}}"/>
             </div>
 
         </div>
     </div>
     <div class="rangeNode" data-o2-element="rangeNode">
-        <div class="filterNode_title">{{$.lp.range}}</div>
-        <div class="filterNode_content" data-o2-element="rangeContentNode">
-            <div class="rangeType">
-                <div class="rangeType_Item"><input checked type="checkbox" value="script" />{{$.lp.processPlatform}}</div>
-                <div class="rangeType_Item"><input checked type="checkbox" value="script" />{{$.lp.cms}}</div>
-                <div class="rangeType_Item"><input checked type="checkbox" value="script" />{{$.lp.portal}}</div>
-                <div class="rangeType_Item"><input checked type="checkbox" value="script" />{{$.lp.query}}</div>
-                <div class="rangeType_Item"><input checked type="checkbox" value="script" />{{$.lp.service}}</div>
+        <div class="rangeNode_title">{{$.lp.range}}</div>
+        <div class="rangeNode_content" data-o2-element="rangeContentNode">
+            <div class="rangeType" data-o2-events="click:checkRange">
+                <div class="rangeType_Item"><input checked type="checkbox" value="processPlatform" />{{$.lp.processPlatform}}</div>
+                <div class="rangeType_Item"><input checked type="checkbox" value="cms" />{{$.lp.cms}}</div>
+                <div class="rangeType_Item"><input checked type="checkbox" value="portal" />{{$.lp.portal}}</div>
+                <div class="rangeType_Item"><input checked type="checkbox" value="query" />{{$.lp.query}}</div>
+                <div class="rangeType_Item"><input checked type="checkbox" value="service" />{{$.lp.service}}</div>
+            </div>
+
+        </div>
+        <div class="rangeNode_select">
+            <div class="rangeNode_select_area">
+                <div class="rangeNode_select_action_area">
+                    <div class="rangeNode_select_action" data-o2-events="click:selectFindRange">{{$.lp.selectRange}}</div>
+                </div>
+                <div class="rangeNode_select_content" data-o2-element="rangeSelectedContentNode"></div>
             </div>
         </div>
     </div>

+ 96 - 5
o2web/source/x_component_FindDesigner/Main.js

@@ -14,7 +14,7 @@ MWF.xApplication.FindDesigner.Main = new Class({
 		"isMax": true,
 		"layout": {
 			"type": "leftRight",
-			"percent": 0.4
+			"percent": 0.3
 		},
 		"title": MWF.xApplication.FindDesigner.LP.title
 	},
@@ -22,13 +22,14 @@ MWF.xApplication.FindDesigner.Main = new Class({
 		this.lp = MWF.xApplication.FindDesigner.LP;
 		this.filterOption = {
 			"keyword": "",
-			"type": [],
+			"designerTypes": [],
 			"caseSensitive": false,
 			"matchWholeWord": false,
 			"matchRegExp": false,
 			"moduleList": []
 		}
-		debugger;
+		this.selectedModules = [];
+		this.selectedRange = [];
 		o2.UD.getDataJson("findDesignerLayout", function(json){
 			this.setOptions(json);
 		}.bind(this), false);
@@ -153,7 +154,11 @@ MWF.xApplication.FindDesigner.Main = new Class({
 	},
 
 	checkFilter: function(e){
-		if (e.target.hasClass("o2_findDesigner_filterNode_item")) e.target.getElement("input").click();
+		if (e.target.hasClass("filterNode_item")) e.target.getElement("input").click();
+		e.stopPropagation();
+	},
+	checkRange: function(e){
+		if (e.target.hasClass("rangeType_Item")) e.target.getElement("input").click();
 		e.stopPropagation();
 	},
 	overKeywordOption: function(e){
@@ -216,8 +221,94 @@ MWF.xApplication.FindDesigner.Main = new Class({
 		}else{
 			this.options.layout.type="leftRight";
 		}
-		debugger;
 		this.setSizeNode();
 		o2.UD.putData("findDesignerLayout", {"layout": this.options.layout});
+	},
+
+	getSelectedRange: function(){
+		this.selectedRange = [];
+		var rangeInputs = this.rangeContentNode.getElements("input");
+		rangeInputs.each(function(input){
+			if (input.checked) this.selectedRange.push(input.get("value"));
+		}.bind(this));
+	},
+
+	setSelectedRange: function(){
+		if (this.selectedRange && this.selectedRange.length){
+			var rangeInputs = this.rangeContentNode.getElements("input");
+			rangeInputs.each(function(input){
+				if (this.selectedRange.indexOf(input.get("value"))!=-1) input.set("checked", true);
+			}.bind(this));
+		}
+	},
+	removeRangeItem: function(item){
+		item.destroy();
+		var itemNodes = this.rangeSelectedContentNode.getChildren();
+		if (!itemNodes.length) this.setSelectedRange();
+	},
+	selectFindRange: function(){
+		o2.requireApp("Selector", "package", function(){
+			new o2.O2Selector(this.content, {
+				"values": this.selectedModules,
+				"type": "PlatApp",
+				"selectAllEnable": true,
+				"onComplete": function(list){
+					this.rangeSelectedContentNode.empty();
+					//this.selectedModules = [];
+					if (list.length){
+						this.getSelectedRange();
+						this.rangeContentNode.getElements("input").set("checked", false);
+
+						o2.require("o2.widget.O2Identity", function(){
+							list.each(function(app){
+								//this.selectedModules.push(app.data);
+								app.data.name = this.lp.service + "-" + app.data.name;
+								var item = new o2.widget.O2Other(app.data, this.rangeSelectedContentNode, {"canRemove": true, "style": "find", "onRemove": function(item){this.removeRangeItem(item);}.bind(this)});
+								item.node.store("data", item.data);
+							}.bind(this));
+						}.bind(this));
+
+					}else{
+						this.setSelectedRange();
+					}
+
+				}.bind(this)
+			});
+		}.bind(this));
+	},
+	getFindOption: function(){
+		var filterTypes = [];
+		filterItems = this.filterNode.getElements("input");
+		filterItems.each(function(item){
+			if (item.checked) filterTypes.push(item.get("value"));
+		}.bind(this));
+
+		var keyword = this.keywordInputNode.get("value");
+
+		var moduleList = [];
+		var itemNodes = this.rangeSelectedContentNode.getChildren();
+		if (!itemNodes.length){
+			this.getSelectedRange();
+			this.selectedRange.each(function(type){
+				moduleList.push({"moduleType": type, "flagList": []});
+			});
+		}else{
+			var rangeApp = {};
+			itemNodes.each(function(node){
+				var data = node.retrieve("data");
+				if (!rangeApp[data.moduleType]) rangeApp[data.moduleType] = [];
+				rangeApp[data.moduleType].push(data.id);
+			}.bind(this));
+
+			Object.keys(rangeApp).each(function(k){
+				moduleList.push({"moduleType": k, "flagList": rangeApp[k]});
+			});
+		}
+
+		this.filterOption.keyword = keyword;
+		this.filterOption.designerTypes = filterTypes;
+		this.filterOption.moduleList = moduleList;
+
+		return this.filterOption;
 	}
 });

+ 9 - 1
o2web/source/x_component_FindDesigner/lp/zh-cn.js

@@ -13,9 +13,17 @@ MWF.xApplication.FindDesigner.LP = {
 	"statement": "脚本",
 	"stat": "统计",
 
+	"processPlatform": "流程平台",
+	"cms": "内容管理",
+	"portal": "门户管理",
+	"query": "数据中心",
+	"service": "服务管理",
+
 	"search_placeholder": "请输入搜索内容",
 	"dockToBottom": "固定到下方",
 	"dockToRight": "固定到右侧",
 	"nothingFind": "未找到任何结果\n请输入搜索关键字",
-	"nothingPreview": "选择查找结果列表,可在此处预览"
+	"nothingPreview": "选择查找结果列表,可在此处预览",
+
+	"selectRange": "选择查找范围"
 };

+ 249 - 0
o2web/source/x_component_Selector/PlatApp.js

@@ -0,0 +1,249 @@
+MWF.xApplication.Selector = MWF.xApplication.Selector || {};
+MWF.xDesktop.requireApp("Selector", "Person", null, false);
+MWF.xApplication.Selector.PlatApp = new Class({
+	Extends: MWF.xApplication.Selector.Person,
+    options: {
+        "style": "default",
+        "count": 0,
+        "title": MWF.xApplication.Selector.LP.selectProcess,
+        "values": [],
+        "names": [],
+        "expand": false,
+        "forceSearchInItem" : true
+    },
+    _init : function(){
+        this.selectType = "platApp";
+        this.className = "platApp";
+    },
+    loadSelectItems: function(addToNext){
+	    var categorys = [
+            {"name": MWF.SelectorLP.processPlatform, "id": "processPlatform"},
+            {"name": MWF.SelectorLP.cms, "id": "cms"},
+            {"name": MWF.SelectorLP.portal, "id": "portal"},
+            {"name": MWF.SelectorLP.query, "id": "query"},
+            {"name": MWF.SelectorLP.service, "id": "service"}
+        ]
+        //window.setTimeout(function(){
+            categorys.each(function(data){
+                switch (data.id){
+                    case "processPlatform":
+                        this.processAction.listApplication(function(json){ data.appList = json.data; }.bind(this), null, false);
+                        break;
+                    case "cms":
+                        this.cmsAction.listColumn(function(json){ data.appList = json.data; }.bind(this), null, false);
+                        break;
+                    case "portal":
+                        this.portalDesignerAction.listApplication(function(json){ data.appList = json.data; }.bind(this), null, false);
+                        break;
+                    case "query":
+                        this.queryAction.listApplication(function(json){ data.appList = json.data; }.bind(this), null, false);
+                        break;
+                    case "service":
+                        data.appList = [
+                            { "id": "invoke", "name": "服务" },
+                            { "id": "agent", "name": "代理" }
+                        ];
+                        break;
+                    default:
+                        this.processAction.listApplication(function(json){ data.appList = json.data; }.bind(this), null, false);
+                };
+
+                var category = this._newItemCategory(data, this, this.itemAreaNode);
+                if (data.appList && data.appList.length){
+                    data.appList.each(function(d){
+                        debugger;
+                        d.moduleType = data.id;
+                        if (d.moduleType=="cms") d.name = d.appName;
+                        var item = this._newItem(d, this, category.children);
+                        this.items.push(item);
+                    }.bind(this));
+                }
+            }.bind(this));
+        //}.bind(this), 1);
+    },
+
+    _scrollEvent: function(y){
+        return true;
+    },
+    _getChildrenItemIds: function(data){
+	    debugger;
+        return data.appList || [];
+    },
+    _newItemCategory: function(data, selector, item, level){
+        return new MWF.xApplication.Selector.PlatApp.ItemCategory(data, selector, item, level)
+    },
+
+    _listItemByKey: function(callback, failure, key){
+        return false;
+    },
+    _getItem: function(callback, failure, id, async){
+        if( !id )return;
+        this.processAction.getProcess(function(json){
+            if (callback) callback.apply(this, [json]);
+        }.bind(this), failure, ((typeOf(id)==="string") ? id : (typeOf(id)=="string") ? id : id.id), async);
+    },
+    _newItemSelected: function(data, selector, item){
+        return new MWF.xApplication.Selector.PlatApp.ItemSelected(data, selector, item)
+    },
+    _listItemByPinyin: function(callback, failure, key){
+        return false;
+    },
+    _newItem: function(data, selector, container, level){
+        return new MWF.xApplication.Selector.PlatApp.Item(data, selector, container, level);
+    }
+});
+MWF.xApplication.Selector.PlatApp.Item = new Class({
+	Extends: MWF.xApplication.Selector.Person.Item,
+    _getShowName: function(){
+	    switch (this.data.moduleType){
+            case "processPlatform":
+                return this.data.name;
+            case "cms":
+                return this.data.appName;
+            case "portal":
+                return this.data.name;
+            case "query":
+                return this.data.name;
+            case "service":
+                return this.data.name;
+            default:
+                return this.data.name;
+        };
+    },
+    _setIcon: function(){
+        this.iconNode.setStyle("background-image", "url("+"../x_component_Selector/$Selector/default/icon/processicon.png)");
+    },
+    _getTtiteText: function(){
+        return this.data.name;
+    },
+    loadSubItem: function(){
+        return false;
+    },
+    checkSelectedSingle: function(){
+        var selectedItem = this.selector.options.values.filter(function(item, index){
+            if (typeOf(item)==="object"){
+                // return (this.data.id === item.id);
+                if( this.data.id && item.id ){
+                    return this.data.id === item.id;
+                }else{
+                    return this.data.name === item.name;
+                }
+            }
+            if (typeOf(item)==="string") return (this.data.id === item) || (this.data.name === item);
+            return false;
+        }.bind(this));
+        if (selectedItem.length){
+            this.selectedSingle();
+        }
+    },
+    checkSelected: function(){
+
+        var selectedItem = this.selector.selectedItems.filter(function(item, index){
+            if( item.data.id && this.data.id){
+                return item.data.id === this.data.id;
+            }else{
+                return item.data.name === this.data.name;
+            }
+        }.bind(this));
+        if (selectedItem.length){
+            //selectedItem[0].item = this;
+            selectedItem[0].addItem(this);
+            this.selectedItem = selectedItem[0];
+            this.setSelected();
+        }
+    }
+});
+
+MWF.xApplication.Selector.PlatApp.ItemSelected = new Class({
+	Extends: MWF.xApplication.Selector.Person.ItemSelected,
+    _getShowName: function(){
+        switch (this.data.moduleType){
+            case "processPlatform":
+                return this.data.name;
+            case "cms":
+                return this.data.appName;
+            case "portal":
+                return this.data.name;
+            case "query":
+                return this.data.name;
+            case "service":
+                return this.data.name;
+            default:
+                return this.data.name;
+        };
+    },
+    _setIcon: function(){
+        this.iconNode.setStyle("background-image", "url("+"../x_component_Selector/$Selector/default/icon/processicon.png)");
+    },
+    check: function(){
+        if (this.selector.items.length){
+            var items = this.selector.items.filter(function(item, index){
+                debugger;
+                if( item.data.id && this.data.id){
+                    return item.data.id === this.data.id;
+                }else{
+                    return item.data.name === this.data.name;
+                }
+            }.bind(this));
+            this.items = items;
+            if (items.length){
+                items.each(function(item){
+                    item.selectedItem = this;
+                    item.setSelected();
+                }.bind(this));
+            }
+        }
+    }
+});
+
+MWF.xApplication.Selector.PlatApp.ItemCategory = new Class({
+    Extends: MWF.xApplication.Selector.Person.ItemCategory,
+    _getShowName: function(){
+        return this.data.name;
+    },
+    createNode: function(){
+        this.node = new Element("div", {
+            "styles": this.selector.css.selectorItemCategory_department
+        }).inject(this.container);
+    },
+    _setIcon: function(){
+        this.iconNode.setStyle("background-image", "url("+"../x_component_Selector/$Selector/default/icon/applicationicon.png)");
+    },
+    loadSub: function(callback){
+        if (!this.loaded){
+            if (this.data.id=="processPlatform"){
+                this.selector.processAction.listApplication(function(subJson){
+                    subJson.data.each(function(subData){
+                        var category = this.selector._newItem(subData, this.selector, this.children, this.level+1);
+                        this.selector.items.push( category );
+                    }.bind(this));
+
+                    this.loaded = true;
+                    if (callback) callback();
+                }.bind(this));
+            }else{
+                this.loaded = true;
+                if (callback) callback();
+            }
+
+
+            // this.selector.action.listProcess(function(subJson){
+            //     subJson.data.each(function(subData){
+            //         subData.applicationName = this.data.name;
+            //         subData.application = this.data.id;
+            //         var category = this.selector._newItem(subData, this.selector, this.children, this.level+1);
+            //         this.selector.items.push( category );
+            //     }.bind(this));
+            //
+            //     this.loaded = true;
+            //     if (callback) callback();
+            // }.bind(this), null, this.data.id);
+        }else{
+            if (callback) callback();
+        }
+    },
+    _hasChild: function(){
+        return true;
+    },
+    check: function(){}
+});

+ 7 - 1
o2web/source/x_component_Selector/lp/zh-cn.js

@@ -49,6 +49,12 @@ MWF.xApplication.Selector.LP = MWF.SelectorLP = {
     "cancel": "取消",
     "back": "返回",
     "ok": "确定",
-    "noPerson": "人员“{name}”不存在"
+    "noPerson": "人员“{name}”不存在",
+
+    "processPlatform": "流程平台",
+    "cms": "内容管理",
+    "portal": "门户管理",
+    "query": "数据中心",
+    "service": "服务管理",
 };
 MWF.xApplication.Selector["lp."+o2.language] = MWF.xApplication.Selector.LP;