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

Merge branch 'fix/ftsearch' into 'develop'

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

See merge request o2oa/o2oa!1303
......@@ -5,37 +5,39 @@
{{each $.data}}
{{if $.valueCountPairList && $.valueCountPairList.length}}
<div class="item-multiselect mainColor_border mainColor_bg_opacity"></div>
<div class="item" style="display: {{($._.status.collapseCondition && $.index) ? 'none': ''}};">
<div class="item-title">{{$.label}}</div>
<div class="item-content">
{{if $.valueCountPairList.length>1}}
<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 class="itemWrap" style="display: {{($._.status.collapseCondition && $.index) ? 'none': ''}};">
<div class="item-multiselect mainColor_border mainColor_bg_opacity"></div>
<div class="item">
<div class="item-title">{{$.label}}</div>
<div class="item-content">
{{if $.valueCountPairList.length>1}}
<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>
{{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>
{{end if}}
......
......@@ -5,15 +5,6 @@
{{each $.labelList}}
<div class="item-text">{{$}}</div>
{{end each}}
<!-- {{if $.labelList}}-->
<!-- {{each $.labelList}}-->
<!-- {{$}}-->
<!-- {{end each}}-->
<!-- {{end if}}-->
<!-- {{if !$.labelList}}-->
<!-- {{$.label}}-->
<!-- {{end if}}-->
<!-- </span>-->
<i class="o2icon-close icon"></i>
</div>
{{end each}}
......
<div class="ftsearch-wrap">
<div class="ftsearch-top">
<div class="ftsearch-top-inner">
<div data-o2-element="docTotalNode" class="docTotalNode"></div>
<div>
<div class="view_inputArea mainColor_border">
<i class="view_inputButton o2icon-search1" data-o2-events="click:search:1:;mouseover:iconOver;mouseout:iconOut"></i>
......@@ -12,9 +13,8 @@
</div>
<div data-o2-element="docContent" class="docContent-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="docTotalNode" class="docTotalNode"></div>
<div class="listNode" data-o2-element="docListNode"></div>
<div data-o2-element="docPaginationNode"></div>
</div>
......
<div class="appNode" data-o2-element="appNode">
<div class="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>
\ No newline at end of file
......@@ -28,6 +28,58 @@
-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 {
content: "\e900";
......@@ -203,8 +255,8 @@ ul {
.ftsearch-top{
background-color: #ffffff;
padding: 20px;
margin-bottom: 10px;
padding: 15px 20px;
/*margin-bottom: 10px;*/
overflow: hidden;
}
.ftsearch-top-inner{
......@@ -237,9 +289,9 @@ ul {
}
.docContent-ftsearch{
height: calc( 100% - 140px );
height: calc( 100% - 90px );
background:#ffffff;
padding:20px;
padding:0 20px 20px 20px;
overflow:auto;
display: flex;
flex-direction: column;
......@@ -274,7 +326,8 @@ ul {
text-align: center;
}
.docTotalNode{
padding: 0 0 10px 5px
float:right;
padding: 10px 0 10px 5px
}
.listNode{
min-height: 300px;
......@@ -334,7 +387,7 @@ ul {
.conditionSelected{
overflow: hidden;
margin-bottom: 10px;
/*margin-bottom: 10px;*/
}
.conditionSelected .item{
float: left;
......@@ -373,8 +426,8 @@ ul {
}
.condition{
width: 100%;
margin-bottom: 30px;
border-radius: 0px 0px 30px 30px;
margin-bottom: 20px;
border-radius: 0px 0px 20px 20px;
border: 1px solid #CCCCCC;
padding-bottom: 10px;
position: relative;
......@@ -383,9 +436,9 @@ ul {
cursor: pointer;
padding-left: 5px;
position: absolute;
width: 60px;
width: 120px;
height: 30px;
left: calc( 50% - 30px );
left: calc( 50% + 10px );
bottom: -20px;
background: #fff;
text-align: center;
......@@ -466,6 +519,7 @@ ul {
line-height: 40px;
border: 1px solid #4A90E2;
background: rgba(74, 144, 226, 0.12);
margin-bottom: 10px;
}
.condition .item-multiselect .item-title{
float: left;
......
......@@ -74,18 +74,20 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
},
search: function(pageNum, query){
this.selectedConditionList = [];
this.loadSelectedCondition();
if( typeOf(this.collapseCondition) === "boolean" ){
this._search(pageNum, query);
this._search(pageNum, query, function () {
this.loadSelectedCondition();
}.bind(this));
}else{
MWF.UD.getDataJson("ftsearchCollapseCondition", function (json) {
this.collapseCondition = json === "true";
this._search(pageNum, query);
this.collapseCondition = json === "true" || !json ;
this._search(pageNum, query, function () {
this.loadSelectedCondition();
}.bind(this));
}.bind(this), true);
}
},
_search: function( pageNum, query ){
_search: function( pageNum, query, callback ){
pageNum = o2.typeOf(pageNum) === "number" ? pageNum : null;
this.docPageNum = pageNum || 1;
this.currentKey = query || this.searchInput.get("value") || "";
......@@ -133,6 +135,9 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
this.loadDocPagination();
}
if( typeOf(callback) === "function" )callback();
}.bind(this));
}else{
this.docList = [];
......@@ -142,6 +147,7 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
this.loadCondition( []);
this.loadDocList();
this.loadDocPagination();
if( typeOf(callback) === "function" )callback();
}
},
orderFacet: function(facetList){
......@@ -266,13 +272,13 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
if( this.collapseCondition ){
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.conditionNode.getElements(".item").each(function (item, index) {
this.conditionNode.getElements(".itemWrap").each(function (item, index) {
item.setStyle("display", index ? "none": "")
})
}else{
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.conditionNode.getElements(".item").each(function (item, index) {
this.conditionNode.getElements(".itemWrap").each(function (item, index) {
item.setStyle("display", "");
})
}
......@@ -280,18 +286,61 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
},
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(){
this.selectedConditionList.each(function (item) {
var condNode = new Element("div.item", {
events: {
mouseover: function (ev) {
this.conditionSelectedOver(ev)
}.bind(this),
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)
);
// }.bind(this));
},
new Element("span", {
text: item.parentLabel+":"
}).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){
e.target.addClass('mainColor_color');
......@@ -402,7 +451,7 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
ul.store("expand", true);
}
},
changeCondition: function(e, item){
changeCondition: function(e, item, removedItemNode){
var index = -1;
this.selectedConditionList.each(function (cond, idx) {
if( cond.field === item.field )index = idx;
......@@ -412,8 +461,11 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
}else{
this.selectedConditionList.push(item);
}
this.loadSelectedCondition();
this._search();
// this.loadSelectedCondition();
this._search( null, null,function () {
// if(removedItemNode)removedItemNode.destroy();
this.loadSelectedCondition()
}.bind(this));
},
changeSingleCondition: function(e, item){
var itemIndex = -1, valueIndex = -1;
......@@ -431,7 +483,6 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
if( !this.selectedConditionList[itemIndex].valueList.length ){
this.selectedConditionList.splice(itemIndex, 1);
}
this.loadSelectedCondition();
}else{ //还没有选择
e.target.removeClass('mainColor_bg_opacity');
e.target.addClass('mainColor_bg');
......@@ -447,9 +498,10 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
labelList: [item.label]
});
}
this.loadSelectedCondition();
}
this._search();
this._search(null, null, function () {
this.loadSelectedCondition();
}.bind(this));
},
subConditionOver: function(e){
if(!e.target.retrieve("selected"))e.target.addClass('mainColor_bg_opacity');
......@@ -465,8 +517,8 @@ MWF.xApplication.ftsearch.FTSearchView = new Class({
var target = this.app.getEventTarget(e, "subItem-content");
if(!target.retrieve("selected"))target.removeClass('mainColor_bg_opacity');
},
removeSelectedConditionItem: function(e, item){
this.changeCondition(e, item);
removeSelectedConditionItem: function(e, item, itemNode){
this.changeCondition(e, item, itemNode);
},
conditionSelectedOver: function(e){
this.app.getEventTarget(e, "item").getElement("i").addClass("icon_over");
......
......@@ -22,7 +22,9 @@ MWF.xApplication.ftsearch.Main = new Class({
if( this.status && this.status.query ){
query = this.status.query;
}
this.openFTSearchView( query );
if( query ){
this.openFTSearchView( query );
}
this.status = null;
}.bind(this));
},
......@@ -34,6 +36,16 @@ MWF.xApplication.ftsearch.Main = new Class({
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){
this.openFTSearchView(query);
},
......
......@@ -97,6 +97,6 @@ MWF.xApplication.ftsearch.LP = {
"switch": "切换",
"searchCorePlacholder": "请输入关键字,按“回车”搜索应用或流程",
"expandCondition":"更多",
"collapseCondition": "收起"
"expandCondition":"更多过滤条件",
"collapseCondition": "收起过滤条件"
};
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册