提交 5cbbe3c9 编写于 作者: KK's avatar KK

Revert "Revert "删除dataview相关""

This reverts commit 03ec3b3d.
上级 03ec3b3d
<template>
<div class = "card-view ">
<div v-if="dataViewMode==='DATAVIEWEXPVIEW'" class="nav-card">
<ion-card v-for="(item,index) in items" :key="index" @click="switchView(index)">
<ion-card-header>
<ion-card-title>{{item.srfkey}}</ion-card-title>
</ion-card-header>
<ion-card-content>{{item.mobentityname}}</ion-card-content>
</ion-card>
</div>
<ion-row v-else>
<ion-col size="12" v-show="showCheack">
<div class="selectall">
<ion-checkbox :checked="selectAllIschecked" v-show="showCheack" @ionChange="checkboxAll"></ion-checkbox>
<ion-label class="selectal-label" v-show="showCheack">全选</ion-label>
</div>
</ion-col>
<ion-col :size="size" v-for="(item,index) in items" :key="index" >
<ion-checkbox :checked="item.checked" v-show="showCheack" class="ionic-checkbox" @click.stop="checkboxSelect(item)"></ion-checkbox>
<ion-card :class="[size == '12'? 'ios hydrated ibz-card-12':' ios hydrated ibz-card-6']">
<div :class="{'line':size == '12'}">
<img class="cardimg" :style="{width :size == '6' ?'':'30%'}" src="assets/images/card.jpg" />
<div :style="{width :size == '6' ?'':'70%'}">
<ion-card-header class="ibz-header">
<ion-card-title class="ibz-title">{{item.<#if appde.getMajorPSAppDEField()??>${appde.getMajorPSAppDEField().getCodeName()?lower_case}<#else>srfmajortext</#if>}}</ion-card-title>
</ion-card-header>
<#if ctrl.getPSDEDataViewItems?? && ctrl.getPSDEDataViewItems()??>
<#list ctrl.getPSDEDataViewItems() as cardItem>
<ion-card-content class="ibz-content">
{{item.<#if cardItem.getName?? && cardItem.getName()??>${cardItem.getName()?lower_case}</#if>}}
</ion-card-content>
</#list>
</#if>
</div>
</div>
<ion-icon v-show="!showCheack" :style="{color :size == '6' ?'#fff':'#333'}" @click="remove([item])" class="card-delete" name="close-outline"></ion-icon>
</ion-card>
</ion-col>
</ion-row>
</div>
</template>
\ No newline at end of file
<#ibizinclude>
./CONTROL-BASE.template.ftl
</#ibizinclude>
<#ibizinclude>
../@MACRO/CONTROL/CONTROL_HEADER-BASE.vue.ftl
</#ibizinclude>
/**
* 视图类型
*
* @type {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() protected viewType?: string | 'DEMOBMDVIEW' | 'DEMOBMDVIEW9' | 'DEMOBWFMDVIEW';
/**
* 显示处理提示
*
* @type {boolean}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop({ default: true }) protected showBusyIndicator?: boolean;
/**
* 部件行为--update
*
* @type {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() protected updateAction!: string;
/**
* 部件行为--fetch
*
* @type {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() protected fetchAction!: string;
/**
* 部件行为--remove
*
* @type {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() protected removeAction!: string;
/**
* 部件行为--load
*
* @type {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() protected loadAction!: string;
/**
* 部件行为--loaddraft
*
* @type {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() protected loaddraftAction!: string;
/**
* 部件行为--create
*
* @type {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() protected createAction!: string;
/**
* 部件样式
*
* @type {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop({default: '<#if ctrl.getMobListStyle?? && ctrl.getMobListStyle()??>${ctrl.getMobListStyle()}</#if>'}) protected controlStyle!: string | 'ICONVIEW' | 'LISTVIEW' | 'SWIPERVIEW' | 'LISTVIEW2' | 'LISTVIEW3' | 'LISTVIEW4';
/**
*上级传递的选中项
*@type {Array}
*@memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() public selectedData?:Array<any>;
/**
* 新建打开视图
*
* @type {Function}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() public newdata?: Function;
/**
* 打开视图
*
* @type {Function}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() public opendata?: Function;
/**
* 当前选中数组
*
* @type {array}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public selectdata :any = [];
/**
* 关闭行为
*
* @type {Function}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() public close?:Function;
/**
* 布局大小
*
* @memberof ${srfclassname('${ctrl.name}')}
*/
@Prop() public size?:string;
/**
* 是否为临时模式
*
* @type {boolean}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop({ default: false}) public isTempMode?:boolean;
/**
* 视图类型
*
* @type {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop({ default: 'DATAVIEW'}) public dataViewMode?:string;
<#if view.getViewType()?? && view.getViewType()=='DEMOBPICKUPMDVIEW'>
/**
* 存放多数据选择数组(多选)
*
* @type {array}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public checkboxList:Array<string> = [];
/**
* 存放数据选择数组(单选)
*
* @type {object}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public radio:any = '';
/**
* 点击多选按钮触发
*
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public change(){
if(this.isMutli){
let checkboxLists= this.items.filter((item,index)=>{
if(this.checkboxList.indexOf(item.srfkey)!=-1){
return true;
}else{
return false;
}
})
this.$emit('selectchange',checkboxLists);
}else{
let radioItem = this.items.filter((item,index)=>{return item.srfkey==this.radio});
this.$emit('selectchange',radioItem);
}
}
</#if>
/**
* 列表键值对
*
* @type {Map}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public listMap: any = new Map();
/**
* 分页大小
*
* @type {number}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public pageSize: number = ${ctrl.getPagingSize()?c};
/**
* 总页数
*
* @type {number}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public pageTotal: number = 0;
/**
* 当前页数
*
* @type {number}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public pageNumber: number = 1;
/**
* 判断底部数据是否全部加载完成,若为真,则 bottomMethod 不会被再次触发
*
* @type {number}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
get allLoaded() {
return ((this.pageNumber + 1) * this.pageSize) >= this.pageTotal ? true : false;
}
/**
* 底部状态
*
* @type {String}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
// public bottomStatus: String = "";
/**
* 顶部状态
*
* @type {String}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
// public topStatus: String = "";
/**
*
*
* @type {Number}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
// public moveTranslate: Number = 0;
/**
* searchKey 搜索关键字
*
* @type {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public searchKey:string = '';
/**
* 列表数组
*
* @param {Array<any>}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public items:Array<any> =[];
/**
* 选中数组
*
* @param {Array<any>}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public selectedArray:Array<any> = [];
/**
* 多选计数
*
* @param {number}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public selectednumber:number =0;
/**
* 搜索行为
*
* @param {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() public searchAction?:string;
/**
* 是否为选择视图
*
* @param {boolean}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop() public isSelected?:boolean;
/**
* 是否多选
*
* @type {boolean}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop({default:false}) public isMutli?: boolean;
/**
* 单选选择值
*
* @param {string}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public selectedValue:string = "";
/**
* 底部改变状态
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public handleBottomChange(status: String) {
// this.bottomStatus = status;
}
/**
* 顶部改变状态
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public handleTopChange(status: String) {
// this.moveTranslate = 1;
// this.topStatus = status;
}
/**
* 卡片切换回调
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public switchView(listIndex: number) {
this.items.findIndex((item, index) => {
if (index === listIndex) {
this.$emit("selectionchange", item);
}
});
}
/**
* 上拉加载更多数据
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public async loadBottom(): Promise<any> {
this.pageNumber++;
let params = {};
if (this.viewparams) {
Object.assign(params, this.viewparams);
}
Object.assign(params, { query: this.searchKey, page: this.pageNumber, size: this.pageSize });
let response: any = await this.load(params, 'bottom');
let loadmoreBottom: any = this.$refs.loadmoreBottom;
if (loadmoreBottom) {
loadmoreBottom.complete();
}
}
/**
* 删除
*
* @param {any[]} datas
* @returns {Promise<any>}
* @memberof ${srfclassname('${ctrl.name}')}
*/
public async remove(datas: any[]): Promise<any> {
let arg: any = {};
let keys: Array<string> = [];
let infoStr: string = '';
datas.forEach((data: any, index: number) => {
keys.push(data.${appde.getKeyPSAppDEField().getCodeName()?lower_case});
if (index < 5) {
if (!Object.is(infoStr, '')) {
infoStr += '、';
}
<#if appde.getMajorPSAppDEField()??>
infoStr += data.${appde.getMajorPSAppDEField().getCodeName()?lower_case};
<#else>
infoStr += data.srfmajortext;
</#if>
}
});
if (datas.length < 5) {
infoStr = infoStr + this.$t('app.message.totle') + datas.length + this.$t('app.message.data');
} else {
infoStr = infoStr + '...' + this.$t('app.message.totle') + datas.length + this.$t('app.message.data');
}
return new Promise((resolve, reject) => {
const _remove = async () => {
let _context: any = { ${appde.getCodeName()?lower_case}: keys.join(';') }
const response: any = await this.service.delete(this.removeAction, Object.assign({}, this.context, _context), arg, this.showBusyIndicator);
if (response && response.status === 200) {
this.$notice.success((this.$t('app.message.deleteSccess') as string));
this.load();
resolve(response);
} else {
this.$notice.error(response.message);
reject(response);
}
}
this.$dialog.confirm({
title: (this.$t('app.message.warning') as string),
message: this.$t('app.message.confirmToDelete') + infoStr +','+ this.$t('app.message.unrecoverable') + '?',
}).then(() => {
_remove();
}).catch(() => {
});
});
}
/**
* 刷新数据
*
* @returns {Promise<any>}
* @memberof ${srfclassname('${ctrl.name}')}
*/
public refresh(): Promise<any> {
return new Promise((resolve: any, reject: any) => {
this.load().then((res) => {
resolve(res);
}).catch((error: any) => {
reject(error);
})
})
}
/**
* 快速搜索
*
* @param {string} query
* @returns {Promise<any>}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public async quickSearch(query: string): Promise<any> {
this.searchKey = query;
this.pageNumber = 0;
const response = await this.load(Object.assign({ query: query }, { page: this.pageNumber, size: this.pageSize }), "init");
return response;
}
/**
* 数据加载
*
* @private
* @param {*} [data={}]
* @param {string} [type=""]
* @returns {Promise<any>}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
private async load(data: any = {}, type: string = ""): Promise<any> {
if (!data.page) {
Object.assign(data, { page: this.pageNumber });
}
if (!data.size) {
Object.assign(data, { size: this.pageSize });
}
const parentdata: any = {};
this.$emit('beforeload', parentdata);
Object.assign(data, parentdata);
const response: any = await this.service.search(this.fetchAction, this.context, data, this.showBusyIndicator);
if (!response || response.status !== 200) {
this.$notify({ type: 'danger', message: response.error.message });
return response;
}
this.items = [];
this.items = response.data.records;
this.$emit('load',this.items);
return response;
}
/**
* 全选
*
* @private
* @param {*} [arg={}]
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
private handleClick() {
this.items.forEach((item: any) => {
item.value = true;
});
this.selectednumber = this.items.length;
}
/**
* checkbox 选中回调
*
* @param {*} data
* @returns
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public checkboxChange(data: any) {
let { detail } = data;
if (!detail) {
return;
}
let { value } = detail;
this.selectednumber = 0;
this.items.forEach((item: any, index: number) => {
if (item.value) {
this.selectednumber++;
}
if (Object.is(item.${appde.getCodeName()?lower_case}id, value)) {
if (detail.checked) {
this.selectdata.push(this.items[index]);
} else {
this.selectdata.splice(this.selectdata.findIndex((i: any) => i.value === item.value), 1)
}
}
});
this.$emit('selectionchange', this.selectdata);
}
/**
* 下拉刷新
*
* @returns {Promise<any>}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public async pullDownToRefresh(): Promise<any> {
this.pageNumber = 0;
let params = {};
if (this.viewparams) {
Object.assign(params, this.viewparams);
}
Object.assign(params, { query: this.searchKey, pageNumber: this.pageNumber, pageSize: this.pageSize });
let response: any = await this.load(params, 'top');
return response;
}
/**
* 点击列表数据跳转
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public goPage(item: String) {
this.selectedArray.push(item);
this.$emit('rowclick',item);
}
/**
* 获取多项数据
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public getDatas(): any[] {
return this.selectedArray;
}
/**
* 获取单项数据
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public getData(): any {
return this.selectedArray[0];
}
/**
* vue生命周期created
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public created() {
this.afterCreated();
}
/**
* 执行created后的逻辑
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
protected afterCreated(){
if (this.viewState) {
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => {
if (!Object.is(this.name, tag)) {
return;
}
if (Object.is(action, "load")) {
this.pageNumber = 0;
this.load(Object.assign(data, { page: this.pageNumber, size: this.pageSize }), "init");
}
if (Object.is(action, "search")) {
this.pageNumber = 0;
this.load(Object.assign(data, { page: this.pageNumber, size: this.pageSize }), "init");
}
if (Object.is(action, "quicksearch")) {
this.searchKey = data;
this.pageNumber = 0;
this.load(Object.assign({ query: data }, { page: this.pageNumber, size: this.pageSize }), "init");
}
if (Object.is(action, "refresh")) {
this.refresh();
}
});
}
<#if view.getViewType()?? && view.getViewType()=='DEMOBPICKUPMDVIEW'>
if (!this.isMutli) {
if (this.selectedData && this.selectedData.length > 0) {
this.radio = this.selectedData[0].srfkey;
}
} else {
if (this.selectedData && this.selectedData.length > 0) {
this.checkboxList = [];
this.selectedData.forEach((item: any) => {
this.checkboxList.push(item.srfkey);
})
}
}
</#if>
}
/**
* vue 生命周期
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public destroyed() {
this.afterDestroy();
}
/**
* 执行destroyed后的逻辑
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
protected afterDestroy() {
if (this.viewStateEvent) {
this.viewStateEvent.unsubscribe();
}
<#if destroyed_block??>
${destroyed_block}
</#if>
}
/**
* 单选选中变化
*
* @memberof ${srfclassname('${ctrl.name}')}
*/
public onSimpleSelChange(item: any = {}) {
this.$emit('selectionchange', [item]);
this.selectedValue = item.srfkey;
this.selectedArray = [];
this.goPage(item);
}
/**
* 是否展示多选
*
* @memberof ${srfclassname('${ctrl.name}')}
*/
@Prop({default:false}) showCheack?: boolean;
/**
* 选中或取消事件
*
* @memberof ${srfclassname('${ctrl.name}')}
*/
public checkboxSelect(item:any){
let count = this.selectedArray.findIndex((i) => {
return i.${appde.getKeyPSAppDEField().getCodeName()?lower_case} == item.${appde.getKeyPSAppDEField().getCodeName()?lower_case};
});
let re = false;
if(count == -1){
re = true;
this.selectedArray.push(item);
}else{
this.selectedArray.splice(count,1);
}
this.items.forEach((_item: any, index: number) => {
if (_item.${appde.getKeyPSAppDEField().getCodeName()?lower_case} == item.${appde.getKeyPSAppDEField().getCodeName()?lower_case}) {
this.items[index].checked = re;
}
});
}
/**
* 长按定时器
*
* @memberof ${srfclassname('${ctrl.name}')}
*/
public loop :any;
/**
* 开始长按
*
* @memberof ${srfclassname('${ctrl.name}')}
*/
public start () {
      clearTimeout(this.loop); //再次清空定时器,防止重复注册定时器
      this.loop = setTimeout(() => {
this.$emit("showCheackChange", !this.showCheack);
      }, 1000);
    }
/**
* 结束长按
*
* @memberof ${srfclassname('${ctrl.name}')}
*/
public end () {
clearTimeout(this.loop); //清空定时器,防止重复注册定时器
}
/**
* 全选事件
*
* @memberof ${srfclassname('${ctrl.name}')}
*/
public checkboxAll(item:any) {
this.selectAllIschecked = item.detail.checked;
if(this.selectAllIschecked){
this.selectedArray = JSON.parse(JSON.stringify(this.items));
}else{
this.selectedArray = [];
}
this.items.forEach((item:any,index:number)=>{
this.items[index].checked = this.selectAllIschecked
});
this.$forceUpdate();
}
/**
* 全选按钮选中状态
*
* @memberof ${srfclassname('${ctrl.name}')}
*/
public selectAllIschecked = false;
<#ibizinclude>
../@MACRO/CONTROL/CONTROL_BOTTOM-BASE.vue.ftl
</#ibizinclude>
<#ibizinclude>
../@MACRO/CONTROL/CONTROL-BASE.style.ftl
</#ibizinclude>
\ No newline at end of file
<#-- content -->
<#assign content>
updateAction="<#if ctrl.getUpdatePSControlAction?? && ctrl.getUpdatePSControlAction()?? && ctrl.getUpdatePSControlAction().getPSAppDEMethod()??>${ctrl.getUpdatePSControlAction().getPSAppDEMethod().getCodeName()}</#if>"
removeAction="<#if ctrl.getRemovePSControlAction?? && ctrl.getRemovePSControlAction()?? && ctrl.getRemovePSControlAction().getPSAppDEMethod()??>${ctrl.getRemovePSControlAction().getPSAppDEMethod().getCodeName()}</#if>"
loaddraftAction="<#if ctrl.getGetDraftPSControlAction?? && ctrl.getGetDraftPSControlAction()?? && ctrl.getGetDraftPSControlAction().getPSAppDEMethod()??>${ctrl.getGetDraftPSControlAction().getPSAppDEMethod().getCodeName()}</#if>"
loadAction="<#if ctrl.getGetPSControlAction?? && ctrl.getGetPSControlAction()?? && ctrl.getGetPSControlAction().getPSAppDEMethod()??>${ctrl.getGetPSControlAction().getPSAppDEMethod().getCodeName()}</#if>"
createAction="<#if ctrl.getCreatePSControlAction?? && ctrl.getCreatePSControlAction()?? && ctrl.getCreatePSControlAction().getPSAppDEMethod()??>${ctrl.getCreatePSControlAction().getPSAppDEMethod().getCodeName()}</#if>"
fetchAction="<#if ctrl.getFetchPSControlAction?? && ctrl.getFetchPSControlAction()?? && ctrl.getFetchPSControlAction().getPSAppDEMethod()??>${ctrl.getFetchPSControlAction().getPSAppDEMethod().getCodeName()}</#if>"
<#if view.getViewType?? && view.getViewType()??>
dataViewMode="<#if view.getViewType()=='DEMOBDATAVIEWEXPVIEW'>DATAVIEWEXPVIEW<#else>DATAVIEW</#if>"
</#if>
<#if view.getViewType?? && view.getViewType()?? && view.getViewType() != 'DEMOBDATAVIEWEXPVIEW'>
:size="size"
:showCheack="showCheack"
@showCheackChange="showCheackChange"
</#if>
</#assign>
<#ibizinclude>
../@MACRO/HTML/DEFAULT.html.ftl
</#ibizinclude>
\ No newline at end of file
<#ibizinclude>
../@MACRO/CSS/DEFAULT.less.ftl
</#ibizinclude>
.ibz-ionic-item{
--inner-border-width:0;
}
.nav-card{
height: 40vh;
overflow: hidden;
overflow-y: scroll;
}
.card-view{
.ibz-card {
margin-bottom: 0;
}
.ibz-header {
padding: 10px;
}
.card-delete{
position: absolute;
top: 2px;
right: 2px;
font-size: 20px;
}
.ibz-title {
font-size: 15px;
}
.ibz-card-12 {
margin: 12px 12px 0 35px;
}
.ibz-card-6{
margin: 5px 10px 5px 30px;
}
.ibz-content {
padding: 10px;
padding-top: 0;
font-size: 12px;
}
.line {
display: flex;
justify-content: space-between;
}
.cardimg{
height: auto;
}
.ionic-checkbox {
position: absolute;
top: calc(50% - 13px);
}
.selectall{
padding: 0;
display: flex;
}
.selectal-label{
padding-left: 15px;
}
}
\ No newline at end of file
<#ibizinclude>
../@MACRO/CONTROL/CONTROL.vue.ftl
</#ibizinclude>
\ No newline at end of file
<#ibizinclude>
../@MACRO/MODEL/DEFAULT.ts.ftl
</#ibizinclude>
\ No newline at end of file
## ibiz数据视图部件相关文档(移动端)
### 一、卡片视图
##### (1)支持功能:样式切换、排序、删除、长按多选、长按显示批操工具栏
##### (2)界面UI
<div style = "display:flex; overflow:hidden;">
<div>
<img src="images/README/card_list.png" ></img>
<img src="images/README/card_box.png" ></img>
</div>
<div>
<img src="images/README/each.png" ></img>
<img src="images/README/each_box.png" ></img>
</div>
</div>
<#assign extendsClass>MdServiceBase</#assign>
<#ibizinclude>
../@MACRO/SERVICE/SERVICE_HEADER.ts.ftl
</#ibizinclude>
<#ibizinclude>
../@MACRO/SERVICE/SERVICE_BOTTOM.ts.ftl
</#ibizinclude>
\ No newline at end of file
<#ibizinclude>
../@MACRO/DEFAULT.less.ftl
</#ibizinclude>
.view-tool {
display: flex;
justify-content: space-between;
padding: 0 15px;
}
.batch_btn{
display: flex;
justify-content: center;
}
\ No newline at end of file
<#if view.hasPSControl('dataview')>
<#assign dataview = view.getPSControl('dataview')>
<#if !dataview.isNoSort()>
<#assign state = false />
<#list dataview.getPSDEDataViewItems() as item>
<#if item.isEnableSort()>
<#assign state = true/>
<#break>
</#if>
</#list>
<#if state>
<#assign view_header_botton>
<ion-toolbar class="${srffilepath2(view.getCodeName())}-toolbar default-sort">
<div class="view-tool">
<div class="view-tool-sorts">
<div class="view-tool-sorts">
<#list dataview.getPSDEDataViewItems() as item>
<#if item.isEnableSort()>
<div class="view-tool-sorts-item">
<span class="text" @click="setSort('<#if item.getName()??>${item.getName()}</#if>')"><#if item.getCaption()??>${item.getCaption()}</#if></span>
<span class="sort-icon" @click="setSort('<#if item.getName()??>${item.getName()}</#if>')">
<ion-icon :class="{'ios' : true ,'hydrated': true ,'sort-select': sort.asc == '<#if item.getName()??>${item.getName()}</#if>'}" name="chevron-up-outline" ></ion-icon>
<ion-icon :class="{'ios' : true ,'hydrated': true ,'sort-select': sort.desc == '<#if item.getName()??>${item.getName()}</#if>'}" name="chevron-down-outline" ></ion-icon>
</span>
</div>
</#if>
</#list>
</div>
<div class="view-tool-searchform">
<!-- <span>过滤<ion-icon name="filter-outline"></ion-icon></span> -->
</div>
</div>
<div class="view-tool-searchform">
<ion-icon @click="changeSize" :name="iconname"></ion-icon>
</div>
</div>
</ion-toolbar>
</#assign>
</#if>
</#if>
<#assign view_content>
${P.getCtrlCode('dataview', 'CONTROL.html').code}
</#assign>
<#assign view_footer>
<#if dataview.getBatchPSDEToolbar?? && dataview.getBatchPSDEToolbar()??>
<#assign batchToolbar = dataview.getBatchPSDEToolbar()>
<div v-show="showCheack" class="batch_btn">
<@ibizindent blank=8>
${P.getCtrlCode(batchToolbar, 'CONTROL.html').code}
</@ibizindent>
<ion-button class="app-view-toolbar-button" @click="cancelSelect" >
<ion-icon name="arrow-undo-outline"></ion-icon>
{{$t('app.button.cancel')}}
</ion-button>
</div>
</#if>
</#assign>
</#if>
<#ibizinclude>
../@MACRO/VIEW_LAYOUT_BASE.ftl
</#ibizinclude>
\ No newline at end of file
CTRLTYPE=VIEWLAYOUTPANEL#APPDEMOBDATAVIEW
\ No newline at end of file
<#ibizinclude>
../@MACRO/DEFAULT.less.ftl
</#ibizinclude>
\ No newline at end of file
<#if view.hasPSControl('dataviewexpbar')>
<#assign view_content>
${P.getCtrlCode('dataviewexpbar', 'CONTROL.html').code}
</#assign>
</#if>
<#ibizinclude>
../@MACRO/VIEW_LAYOUT_BASE.ftl
</#ibizinclude>
\ No newline at end of file
CTRLTYPE=VIEWLAYOUTPANEL#APPDEMOBDATAVIEWEXPVIEW
\ No newline at end of file
<#ibizinclude>
../@MACRO/LAYOUTPANEL_VIEW.template.ftl
</#ibizinclude>
<#ibizinclude>
../@MACRO/VIEW_HEADER-BASE.vue.ftl
</#ibizinclude>
<#ibizinclude>
../@MACRO/VIEW_CONTENT-BASE.vue.ftl
</#ibizinclude>
/**
* 布局大小
*
* @protected
* @memberof ${srfclassname('${view.name}')}Base
*/
protected size = "6"
/**
* 按钮icon
*
* @protected
* @memberof ${srfclassname('${view.name}')}Base
*/
protected iconname = "grid-outline"
/**
* 布局切换事件
*
* @protected
* @memberof ${srfclassname('${view.name}')}Base
*/
protected changeSize(){
if (this.size == "6") {
this.size = "12";
this.iconname = "list-outline"
} else {
this.size = "6";
this.iconname = "grid-outline"
}
}
/**
* 排序对象
*
* @type {*}
* @memberof ${srfclassname('${view.name}')}Base
*/
public sort: any = { asc: "", desc: "" };
/**
* 排序
*
* @param {*} field
* @memberof ${srfclassname('${view.name}')}Base
*/
public setSort(field: any) {
if (this.sort.desc == field) {
this.sort.desc = "";
this.viewState.next({ tag: 'dataview', action: 'load', data: {} });
return
}
if (this.sort.asc == field) {
this.sort.asc = "";
this.sort.desc = field;
this.viewState.next({ tag: 'dataview', action: 'load', data: { sort: field + ",desc" } });
} else {
this.sort.asc = field;
this.sort.desc = "";
this.viewState.next({ tag: 'dataview', action: 'load', data: { sort: field + ",asc" } });
}
}
/**
* 打开搜索表单
*
* @memberof ${srfclassname('${view.name}')}Base
*/
public openSearchform() {
let search :any = this.$refs.searchform<#if view.getName()??>${view.getName()?lower_case}</#if>;
if(search){
search.open();
}
}
/**
* 关闭搜索表单
*
* @memberof ${srfclassname('${view.name}')}Base
*/
public closeSearchform(){
let search :any = this.$refs.searchform<#if view.getName()??>${view.getName()?lower_case}</#if>;
if(search){
search.close();
}
}
/**
* 多选状态改变事件
*
* @memberof ${srfclassname('${view.name}')}Base
*/
public showCheackChange(value:any){
this.showCheack = value;
}
/**
* 多选状态
*
* @memberof ${srfclassname('${view.name}')}Base
*/
public showCheack = false;
/**
* 取消选择状态
* @memberof ${srfclassname('${view.name}')}Base
*/
public cancelSelect() {
this.showCheackChange(false);
}
<#if view.hasPSControl('dataview')>
<#assign dataview = view.getPSControl('dataview')>
<#if dataview.getBatchPSDEToolbar?? && dataview.getBatchPSDEToolbar()??>
<#assign batchToolbar = dataview.getBatchPSDEToolbar()>
public <#if batchToolbar.getName()??> ${batchToolbar.getName()}_click</#if>(tag:string,event:any) {
let dataview: any = this.$refs.dataview;
if(dataview && dataview.<#if batchToolbar.getName()??> ${batchToolbar.getName()}_click</#if> instanceof Function){
dataview.<#if batchToolbar.getName()??> ${batchToolbar.getName()}_click</#if>(tag,event);
}
}
</#if>
</#if>
<#ibizinclude>
../@MACRO/VIEW_BOTTOM-BASE.vue.ftl
</#ibizinclude>
<#ibizinclude>
../@MACRO/VIEW-BASE.style.ftl
</#ibizinclude>
\ No newline at end of file
${P.getLayoutCode().code}
\ No newline at end of file
<#ibizinclude>
../@MACRO/VIEW.vue.ftl
</#ibizinclude>
\ No newline at end of file
VIEWTYPE=APPDEMOBDATAVIEW
\ No newline at end of file
<#ibizinclude>
../@MACRO/LAYOUTPANEL_VIEW.template.ftl
</#ibizinclude>
<#ibizinclude>
../@MACRO/VIEW_HEADER-BASE.vue.ftl
</#ibizinclude>
<#ibizinclude>
../@MACRO/VIEW_CONTENT-BASE.vue.ftl
</#ibizinclude>
<#ibizinclude>
../@MACRO/VIEW_BOTTOM-BASE.vue.ftl
</#ibizinclude>
<#ibizinclude>
../@MACRO/VIEW-BASE.style.ftl
</#ibizinclude>
\ No newline at end of file
${P.getLayoutCode().code}
\ No newline at end of file
<#ibizinclude>
../@MACRO/VIEW.vue.ftl
</#ibizinclude>
\ No newline at end of file
VIEWTYPE=APPDEMOBDATAVIEWEXPVIEW
\ No newline at end of file
<#ibiztemplate>
TARGET=PSAPPVIEWCTRL_DATAVIEW
</#ibiztemplate>
${P.getCtrlCode('CONTROL-BASE.vue').code}
\ No newline at end of file
<#ibiztemplate>
TARGET=PSAPPVIEWCTRL_DATAVIEW
</#ibiztemplate>
${P.getCtrlCode('CONTROL.less').code}
\ No newline at end of file
<#ibiztemplate>
TARGET=PSAPPVIEWCTRL_DATAVIEW
</#ibiztemplate>
${P.getCtrlCode('CONTROL.vue').code}
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册