提交 ef753f43 编写于 作者: Shine-zwj's avatar Shine-zwj

数据视图批量操作栏样式

上级 e2f0d18f
...@@ -128,12 +128,15 @@ ...@@ -128,12 +128,15 @@
<el-backtop target=".content-container .app-data-view"></el-backtop> <el-backtop target=".content-container .app-data-view"></el-backtop>
<#if ctrl.getBatchPSDEToolbar?? && ctrl.getBatchPSDEToolbar()??> <#if ctrl.getBatchPSDEToolbar?? && ctrl.getBatchPSDEToolbar()??>
<row class='dataview-pagination' v-if="selections.length > 0"> <row class='dataview-pagination' v-if="selections.length > 0">
<span class="batch-toolbar"> <div v-show="flag" class="batch-toolbar">
<#assign batchToolbar = ctrl.getBatchPSDEToolbar()/> <#assign batchToolbar = ctrl.getBatchPSDEToolbar()/>
<@ibizindent blank=12> <@ibizindent blank=12>
${P.getCtrlCode(batchToolbar, 'CONTROL.html').code} ${P.getCtrlCode(batchToolbar, 'CONTROL.html').code}
</@ibizindent> </@ibizindent>
</span> </div>
<div class="dataview-pagination-icon">
<Icon type="md-code-working" @click="onClick"/>
</div>
</row> </row>
</#if> </#if>
</div> </div>
...@@ -501,6 +504,24 @@ import CodeListService from "@/codelist/codelist-service"; ...@@ -501,6 +504,24 @@ import CodeListService from "@/codelist/codelist-service";
*/ */
public appStateEvent: Subscription | undefined; public appStateEvent: Subscription | undefined;
/**
* 默认隐藏批量操作工具栏
*
* @type {boolean}
* @memberof ${srfclassname('${ctrl.codeName}')}Base
*/
public flag: boolean = false;
/**
* 更改批量操作工具栏显示状态
*
* @param $event
* @memberof ${srfclassname('${ctrl.codeName}')}Base
*/
public onClick($event: any){
this.flag = !this.flag;
}
/** /**
* 排序点击事件 * 排序点击事件
* @param {string} field 属性名 * @param {string} field 属性名
...@@ -552,13 +573,15 @@ import CodeListService from "@/codelist/codelist-service"; ...@@ -552,13 +573,15 @@ import CodeListService from "@/codelist/codelist-service";
* @memberof ${srfclassname('${ctrl.codeName}')}Base * @memberof ${srfclassname('${ctrl.codeName}')}Base
*/ */
public afterMounted(){ public afterMounted(){
<#if ctrl.isEnablePagingBar()>
this.$el.addEventListener('scroll', ()=> { this.$el.addEventListener('scroll', ()=> {
let el: any = this.$el.getElementsByClassName('dataview-pagination')[0];
el.style.top = -655 + this.$el.scrollTop + 'px';
<#if ctrl.isEnablePagingBar()>
if( this.$el.scrollTop + this.$el.clientHeight >= this.$el.scrollHeight) { if( this.$el.scrollTop + this.$el.clientHeight >= this.$el.scrollHeight) {
this.loadMore(); this.loadMore();
} }
})
</#if> </#if>
})
} }
/** /**
......
...@@ -163,16 +163,35 @@ ...@@ -163,16 +163,35 @@
} }
<#if ctrl.getBatchPSDEToolbar?? && ctrl.getBatchPSDEToolbar()??> <#if ctrl.getBatchPSDEToolbar?? && ctrl.getBatchPSDEToolbar()??>
.dataview-pagination { .dataview-pagination {
position: fixed; position: relative;
background-color: #fff; right: 42px;
height: 50px; top: -655px;
bottom: 30px; text-align: center;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px; font-size: 20px;
z-index: 5; z-index: 5;
} .batch-toolbar{
float: right;
}
.dataview-pagination-icon{
width: 30px;
height: 30px;
position: absolute;
right: -36px;
top: 4px;
float: right;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
border:1px solid #dcdee2;
border-radius: 50%;
background-color: #FFF;
margin: 3px;
}
.dataview-pagination-icon:hover{
background-color: #409eff;
color: #fff;
}
</#if> </#if>
} }
<#ibizinclude> <#ibizinclude>
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册