提交 c346866e 编写于 作者: 蔡祥熠

Merge branch 'fix/ftsearch' into 'develop'

Merge of fix/ftsearch ft搜索修改 to develop

See merge request o2oa/o2oa!1303
...@@ -5,37 +5,39 @@ ...@@ -5,37 +5,39 @@
{{each $.data}} {{each $.data}}
{{if $.valueCountPairList && $.valueCountPairList.length}} {{if $.valueCountPairList && $.valueCountPairList.length}}
<div class="item-multiselect mainColor_border mainColor_bg_opacity"></div> <div class="itemWrap" style="display: {{($._.status.collapseCondition && $.index) ? 'none': ''}};">
<div class="item" style="display: {{($._.status.collapseCondition && $.index) ? 'none': ''}};"> <div class="item-multiselect mainColor_border mainColor_bg_opacity"></div>
<div class="item-title">{{$.label}}</div> <div class="item">
<div class="item-title">{{$.label}}</div>
<div class="item-content">
{{if $.valueCountPairList.length>1}} <div class="item-content">
<div class="multi-button" data-o2-events="click:loadMultiSelectConditionItem;mouseover:mainColorOver:multi-button;mouseout:mainColorOut:multi-button"> {{if $.valueCountPairList.length>1}}
<i class="o2icon-add"></i><span>{{$._.lp.multiSelect}}</span> <div class="multi-button" data-o2-events="click:loadMultiSelectConditionItem;mouseover:mainColorOver:multi-button;mouseout:mainColorOut:multi-button">
<i class="o2icon-add"></i><span>{{$._.lp.multiSelect}}</span>
</div>
{{end if}}
<div class="switch-button" data-o2-events="click:switchConditionItem;mouseover:mainColorOver:switch-button;mouseout:mainColorOut:switch-button">
<i class="o2icon-triangle_down"></i><span>{{$._.lp.more}}</span>
</div>
<ul class="subitem-wrap">
{{each $.valueCountPairList}}
<li class="subitem">
<div class="subItem-content" data-o2-events="click:changeSingleCondition;mouseover:subConditionOver;mouseout:subConditionOut">
{{if $.documentFieldType === "date"}}
{{end if}}
{{if $.documentFieldType !== "date"}}
{{$.label}}({{$.count}})
{{end if}}
</div>
</li>
{{end each}}
</ul>
<div data-o2-events="o2load:checkSwitchButton"></div>
</div> </div>
{{end if}}
<div class="switch-button" data-o2-events="click:switchConditionItem;mouseover:mainColorOver:switch-button;mouseout:mainColorOut:switch-button">
<i class="o2icon-triangle_down"></i><span>{{$._.lp.more}}</span>
</div>
<ul class="subitem-wrap">
{{each $.valueCountPairList}}
<li class="subitem">
<div class="subItem-content" data-o2-events="click:changeSingleCondition;mouseover:subConditionOver;mouseout:subConditionOut">
{{if $.documentFieldType === "date"}}
{{end if}}
{{if $.documentFieldType !== "date"}}
{{$.label}}({{$.count}})
{{end if}}
</div>
</li>
{{end each}}
</ul>
<div data-o2-events="o2load:checkSwitchButton"></div>
</div>
</div>
</div> </div>
{{end if}} {{end if}}
......
...@@ -5,15 +5,6 @@ ...@@ -5,15 +5,6 @@
{{each $.labelList}} {{each $.labelList}}
<div class="item-text">{{$}}</div> <div class="item-text">{{$}}</div>
{{end each}} {{end each}}
<!-- {{if $.labelList}}-->
<!-- {{each $.labelList}}-->
<!-- {{$}}-->
<!-- {{end each}}-->
<!-- {{end if}}-->
<!-- {{if !$.labelList}}-->
<!-- {{$.label}}-->
<!-- {{end if}}-->
<!-- </span>-->
<i class="o2icon-close icon"></i> <i class="o2icon-close icon"></i>
</div> </div>
{{end each}} {{end each}}
......
<div class="ftsearch-wrap"> <div class="ftsearch-wrap">
<div class="ftsearch-top"> <div class="ftsearch-top">
<div class="ftsearch-top-inner"> <div class="ftsearch-top-inner">
<div data-o2-element="docTotalNode" class="docTotalNode"></div>
<div> <div>
<div class="view_inputArea mainColor_border"> <div class="view_inputArea mainColor_border">
<i class="view_inputButton o2icon-search1" data-o2-events="click:search:1:;mouseover:iconOver;mouseout:iconOut"></i> <i class="view_inputButton o2icon-search1" data-o2-events="click:search:1:;mouseover:iconOver;mouseout:iconOut"></i>
...@@ -12,9 +13,8 @@ ...@@ -12,9 +13,8 @@
</div> </div>
<div data-o2-element="docContent" class="docContent-ftsearch"> <div data-o2-element="docContent" class="docContent-ftsearch">
<div class="contentWrap-ftsearch"> <div class="contentWrap-ftsearch">
<div data-o2-element="conditionSelectedArea"></div> <div data-o2-element="conditionSelectedArea" class="conditionSelected"></div>
<div data-o2-element="conditionArea"></div> <div data-o2-element="conditionArea"></div>
<div data-o2-element="docTotalNode" class="docTotalNode"></div>
<div class="listNode" data-o2-element="docListNode"></div> <div class="listNode" data-o2-element="docListNode"></div>
<div data-o2-element="docPaginationNode"></div> <div data-o2-element="docPaginationNode"></div>
</div> </div>
......
<div class="appNode" data-o2-element="appNode"> <div class="appNode" data-o2-element="appNode">
<div class="contentArea"> <div class="contentArea">
<div class="content" data-o2-element="contentArea"> <div class="content" data-o2-element="contentArea">
<div class="before_search_blank"></div>
<div class="main_inputWrap_main">
<div class="main_searchButton mainColor_bg" data-o2-events="click:searchClick:1:;">{{$.lp.search}}</div>
<div class="main_inputArea mainColor_border">
<i class="main_inputButton o2icon-search1" data-o2-events="click:searchClick;mouseover:iconOver;mouseout:iconOut"></i>
<input class="main_input" data-o2-element="searchInput" placeholder="{{$.lp.searchPlacholder}}" data-o2-events="keydown:searchKeydown"/>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
\ No newline at end of file
...@@ -28,6 +28,58 @@ ...@@ -28,6 +28,58 @@
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
.before_search_blank{
max-height: 290px;
min-height: 150px;
height: calc(100% - 360px);
}
.main_inputWrap{
background-color: #ffffff;
padding: 20px;
margin-bottom: 10px;
}
.main_inputWrap_main{
width: 600px;
background-color: #ffffff;
margin: 0 auto;
}
.main_inputArea{
max-width: 600px;
/*margin-bottom: 10px;*/
/*border: 1px solid #ccc;*/
border: 1px solid #4A90E2;
border-radius: 20px;
padding: 0 0 0 15px;
margin-right: 140px;
/*box-shadow: 0 2px 5px 1px rgb(64 60 67 / 16%);*/
}
.main_input {
width: calc( 100% - 40px );
height: 38px;
font-size: 16px;
color: #666;
border: 0;
}
.main_inputButton{
cursor: pointer;
line-height: 40px;
font-size: 18px;
color: #ccc;
}
.main_searchButton{
float:right;
height: 42px;
line-height: 42px;
cursor: pointer;
background: #4A90E2;
border-radius: 20px;
color: #ffffff;
font-size:16px;
text-align: center;
width: 120px;
display: inline-block;
}
.o2icon-indeterminate_check_box:before { .o2icon-indeterminate_check_box:before {
content: "\e900"; content: "\e900";
...@@ -203,8 +255,8 @@ ul { ...@@ -203,8 +255,8 @@ ul {
.ftsearch-top{ .ftsearch-top{
background-color: #ffffff; background-color: #ffffff;
padding: 20px; padding: 15px 20px;
margin-bottom: 10px; /*margin-bottom: 10px;*/
overflow: hidden; overflow: hidden;
} }
.ftsearch-top-inner{ .ftsearch-top-inner{
...@@ -237,9 +289,9 @@ ul { ...@@ -237,9 +289,9 @@ ul {
} }
.docContent-ftsearch{ .docContent-ftsearch{
height: calc( 100% - 140px ); height: calc( 100% - 90px );
background:#ffffff; background:#ffffff;
padding:20px; padding:0 20px 20px 20px;
overflow:auto; overflow:auto;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
...@@ -274,7 +326,8 @@ ul { ...@@ -274,7 +326,8 @@ ul {
text-align: center; text-align: center;
} }
.docTotalNode{ .docTotalNode{
padding: 0 0 10px 5px float:right;
padding: 10px 0 10px 5px
} }
.listNode{ .listNode{
min-height: 300px; min-height: 300px;
...@@ -334,7 +387,7 @@ ul { ...@@ -334,7 +387,7 @@ ul {
.conditionSelected{ .conditionSelected{
overflow: hidden; overflow: hidden;
margin-bottom: 10px; /*margin-bottom: 10px;*/
} }
.conditionSelected .item{ .conditionSelected .item{
float: left; float: left;
...@@ -373,8 +426,8 @@ ul { ...@@ -373,8 +426,8 @@ ul {
} }
.condition{ .condition{
width: 100%; width: 100%;
margin-bottom: 30px; margin-bottom: 20px;
border-radius: 0px 0px 30px 30px; border-radius: 0px 0px 20px 20px;
border: 1px solid #CCCCCC; border: 1px solid #CCCCCC;
padding-bottom: 10px; padding-bottom: 10px;
position: relative; position: relative;
...@@ -383,9 +436,9 @@ ul { ...@@ -383,9 +436,9 @@ ul {
cursor: pointer; cursor: pointer;
padding-left: 5px; padding-left: 5px;
position: absolute; position: absolute;
width: 60px; width: 120px;
height: 30px; height: 30px;
left: calc( 50% - 30px ); left: calc( 50% + 10px );
bottom: -20px; bottom: -20px;
background: #fff; background: #fff;
text-align: center; text-align: center;
...@@ -466,6 +519,7 @@ ul { ...@@ -466,6 +519,7 @@ ul {
line-height: 40px; line-height: 40px;
border: 1px solid #4A90E2; border: 1px solid #4A90E2;
background: rgba(74, 144, 226, 0.12); background: rgba(74, 144, 226, 0.12);
margin-bottom: 10px;
} }
.condition .item-multiselect .item-title{ .condition .item-multiselect .item-title{
float: left; float: left;
......
...@@ -74,18 +74,20 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({ ...@@ -74,18 +74,20 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
}, },
search: function(pageNum, query){ search: function(pageNum, query){
this.selectedConditionList = []; this.selectedConditionList = [];
this.loadSelectedCondition();
if( typeOf(this.collapseCondition) === "boolean" ){ if( typeOf(this.collapseCondition) === "boolean" ){
this._search(pageNum, query); this._search(pageNum, query, function () {
this.loadSelectedCondition();
}.bind(this));
}else{ }else{
MWF.UD.getDataJson("ftsearchCollapseCondition", function (json) { MWF.UD.getDataJson("ftsearchCollapseCondition", function (json) {
this.collapseCondition = json === "true"; this.collapseCondition = json === "true" || !json ;
this._search(pageNum, query); this._search(pageNum, query, function () {
this.loadSelectedCondition();
}.bind(this));
}.bind(this), true); }.bind(this), true);
} }
}, },
_search: function( pageNum, query ){ _search: function( pageNum, query, callback ){
pageNum = o2.typeOf(pageNum) === "number" ? pageNum : null; pageNum = o2.typeOf(pageNum) === "number" ? pageNum : null;
this.docPageNum = pageNum || 1; this.docPageNum = pageNum || 1;
this.currentKey = query || this.searchInput.get("value") || ""; this.currentKey = query || this.searchInput.get("value") || "";
...@@ -133,6 +135,9 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({ ...@@ -133,6 +135,9 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
this.loadDocPagination(); this.loadDocPagination();
} }
if( typeOf(callback) === "function" )callback();
}.bind(this)); }.bind(this));
}else{ }else{
this.docList = []; this.docList = [];
...@@ -142,6 +147,7 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({ ...@@ -142,6 +147,7 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
this.loadCondition( []); this.loadCondition( []);
this.loadDocList(); this.loadDocList();
this.loadDocPagination(); this.loadDocPagination();
if( typeOf(callback) === "function" )callback();
} }
}, },
orderFacet: function(facetList){ orderFacet: function(facetList){
...@@ -266,13 +272,13 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({ ...@@ -266,13 +272,13 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
if( this.collapseCondition ){ if( this.collapseCondition ){
this.switchNode.getElement("i").addClass( 'o2icon-chevron-thin-down' ).removeClass('o2icon-chevron-thin-up'); this.switchNode.getElement("i").addClass( 'o2icon-chevron-thin-down' ).removeClass('o2icon-chevron-thin-up');
this.switchNode.getElement("span").set("text", this.app.lp.expandCondition); this.switchNode.getElement("span").set("text", this.app.lp.expandCondition);
this.conditionNode.getElements(".item").each(function (item, index) { this.conditionNode.getElements(".itemWrap").each(function (item, index) {
item.setStyle("display", index ? "none": "") item.setStyle("display", index ? "none": "")
}) })
}else{ }else{
this.switchNode.getElement("i").removeClass( 'o2icon-chevron-thin-down' ).addClass('o2icon-chevron-thin-up'); this.switchNode.getElement("i").removeClass( 'o2icon-chevron-thin-down' ).addClass('o2icon-chevron-thin-up');
this.switchNode.getElement("span").set("text", this.app.lp.collapseCondition); this.switchNode.getElement("span").set("text", this.app.lp.collapseCondition);
this.conditionNode.getElements(".item").each(function (item, index) { this.conditionNode.getElements(".itemWrap").each(function (item, index) {
item.setStyle("display", ""); item.setStyle("display", "");
}) })
} }
...@@ -280,18 +286,61 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({ ...@@ -280,18 +286,61 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
}, },
loadSelectedCondition: function(){ loadSelectedCondition: function(){
this.conditionSelectedArea.empty(); this.conditionSelectedArea.empty();
this.conditionSelectedArea.loadHtml(this.path+this.options.style+"/conditionSelected.html", this.selectedConditionList.each(function (item) {
{ var condNode = new Element("div.item", {
"bind": {"lp": this.app.lp, "data": this.selectedConditionList}, events: {
"module": this, mouseover: function (ev) {
"reload": true this.conditionSelectedOver(ev)
}, }.bind(this),
function(){ mouseout: function (ev) {
this.conditionSelectedOut(ev)
}.bind(this)
}
}).inject( this.conditionSelectedArea );
condNode.addClass("mainColor_bg");
condNode.addEvents({
click: function (ev) {
this.removeSelectedConditionItem(ev, item, condNode)
}.bind(this),
});
}.bind(this) new Element("span", {
); text: item.parentLabel+":"
// }.bind(this)); }).inject(condNode);
},
var titleList = [];
item.labelList.each(function (label, i) {
if( i === 2 ){
new Element("div.item-text", {
text: "..."
}).inject(condNode);
}else if( i <= 1 ){
new Element("div.item-text", {
text: label
}).inject(condNode);
}
titleList.push( label );
});
var iconNode = new Element("i.o2icon-close").inject(condNode);
iconNode.addClass("icon");
condNode.set("title", item.parentLabel+":" + titleList.join(","));
}.bind(this))
},
// loadSelectedCondition: function(){
// this.conditionSelectedArea.empty();
// this.conditionSelectedArea.loadHtml(this.path+this.options.style+"/conditionSelected.html",
// {
// "bind": {"lp": this.app.lp, "data": this.selectedConditionList},
// "module": this,
// "reload": true
// },
// function(){
//
// }.bind(this)
// );
// },
iconOver: function(e){ iconOver: function(e){
e.target.addClass('mainColor_color'); e.target.addClass('mainColor_color');
...@@ -402,7 +451,7 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({ ...@@ -402,7 +451,7 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
ul.store("expand", true); ul.store("expand", true);
} }
}, },
changeCondition: function(e, item){ changeCondition: function(e, item, removedItemNode){
var index = -1; var index = -1;
this.selectedConditionList.each(function (cond, idx) { this.selectedConditionList.each(function (cond, idx) {
if( cond.field === item.field )index = idx; if( cond.field === item.field )index = idx;
...@@ -412,8 +461,11 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({ ...@@ -412,8 +461,11 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
}else{ }else{
this.selectedConditionList.push(item); this.selectedConditionList.push(item);
} }
this.loadSelectedCondition(); // this.loadSelectedCondition();
this._search(); this._search( null, null,function () {
// if(removedItemNode)removedItemNode.destroy();
this.loadSelectedCondition()
}.bind(this));
}, },
changeSingleCondition: function(e, item){ changeSingleCondition: function(e, item){
var itemIndex = -1, valueIndex = -1; var itemIndex = -1, valueIndex = -1;
...@@ -431,7 +483,6 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({ ...@@ -431,7 +483,6 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
if( !this.selectedConditionList[itemIndex].valueList.length ){ if( !this.selectedConditionList[itemIndex].valueList.length ){
this.selectedConditionList.splice(itemIndex, 1); this.selectedConditionList.splice(itemIndex, 1);
} }
this.loadSelectedCondition();
}else{ //还没有选择 }else{ //还没有选择
e.target.removeClass('mainColor_bg_opacity'); e.target.removeClass('mainColor_bg_opacity');
e.target.addClass('mainColor_bg'); e.target.addClass('mainColor_bg');
...@@ -447,9 +498,10 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({ ...@@ -447,9 +498,10 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
labelList: [item.label] labelList: [item.label]
}); });
} }
this.loadSelectedCondition();
} }
this._search(); this._search(null, null, function () {
this.loadSelectedCondition();
}.bind(this));
}, },
subConditionOver: function(e){ subConditionOver: function(e){
if(!e.target.retrieve("selected"))e.target.addClass('mainColor_bg_opacity'); if(!e.target.retrieve("selected"))e.target.addClass('mainColor_bg_opacity');
...@@ -465,8 +517,8 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({ ...@@ -465,8 +517,8 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
var target = this.app.getEventTarget(e, "subItem-content"); var target = this.app.getEventTarget(e, "subItem-content");
if(!target.retrieve("selected"))target.removeClass('mainColor_bg_opacity'); if(!target.retrieve("selected"))target.removeClass('mainColor_bg_opacity');
}, },
removeSelectedConditionItem: function(e, item){ removeSelectedConditionItem: function(e, item, itemNode){
this.changeCondition(e, item); this.changeCondition(e, item, itemNode);
}, },
conditionSelectedOver: function(e){ conditionSelectedOver: function(e){
this.app.getEventTarget(e, "item").getElement("i").addClass("icon_over"); this.app.getEventTarget(e, "item").getElement("i").addClass("icon_over");
......
...@@ -22,7 +22,9 @@ MWF.xApplication.ftsearch.Main = new Class({ ...@@ -22,7 +22,9 @@ MWF.xApplication.ftsearch.Main = new Class({
if( this.status && this.status.query ){ if( this.status && this.status.query ){
query = this.status.query; query = this.status.query;
} }
this.openFTSearchView( query ); if( query ){
this.openFTSearchView( query );
}
this.status = null; this.status = null;
}.bind(this)); }.bind(this));
}, },
...@@ -34,6 +36,16 @@ MWF.xApplication.ftsearch.Main = new Class({ ...@@ -34,6 +36,16 @@ MWF.xApplication.ftsearch.Main = new Class({
if( parentItem.hasClass(className) )return parentItem; if( parentItem.hasClass(className) )return parentItem;
} }
}, },
searchKeydown: function(e){
if( e.keyCode === 13 ){
var query = this.searchInput.get("value");
if(query)this.openFTSearchView( query );
}
},
searchClick: function(e){
var query = this.searchInput.get("value");
if(query)this.openFTSearchView( query );
},
doSearch: function(query){ doSearch: function(query){
this.openFTSearchView(query); this.openFTSearchView(query);
}, },
......
...@@ -97,6 +97,6 @@ MWF.xApplication.ftsearch.LP = { ...@@ -97,6 +97,6 @@ MWF.xApplication.ftsearch.LP = {
"switch": "切换", "switch": "切换",
"searchCorePlacholder": "请输入关键字,按“回车”搜索应用或流程", "searchCorePlacholder": "请输入关键字,按“回车”搜索应用或流程",
"expandCondition":"更多", "expandCondition":"更多过滤条件",
"collapseCondition": "收起" "collapseCondition": "收起过滤条件"
}; };
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册