提交 d5dc2685 编写于 作者: laowang's avatar laowang

合并分支 'dev' 到 'master'

Dev

查看合并请求 !3
......@@ -16,7 +16,15 @@
{
name: '${dataitem.getName()}',
<#if dataitem.getPSDEField()??>
<#if ctrl.getControlType() == 'SEARCHFORM'>
<#if dataitem.getPSDEFSearchMode?? && dataitem.getPSDEFSearchMode()??>
prop: '${dataitem.getPSDEFSearchMode().getCodeName()?lower_case}',
<#else>
prop: '${dataitem.getPSDEField().getCodeName()?lower_case}',
</#if>
<#else>
prop: '${dataitem.getPSDEField().getCodeName()?lower_case}',
</#if>
dataType: '${dataitem.getPSDEField().getDataType()}',
</#if>
},
......@@ -52,7 +60,7 @@
</#if>
</#list>
</#if>
]
];
}
<#ibizinclude>
......
此差异已折叠。
<#assign content>
:showBusyIndicator="${ctrl.isShowBusyIndicator()?c}"
<#if ctrl.getPSControlActions()??>
<#list ctrl.getPSControlActions() as action>
<#if action.getPSAppDEMethod?? && action.getPSAppDEMethod()??>
${action.name?lower_case}Action='${action.getPSAppDEMethod().getCodeName()}'
</#if>
</#list>
</#if>
</#assign>
<#ibizinclude>
../@MACRO/HTML/DEFAULT.html.ftl
</#ibizinclude>
\ No newline at end of file
<#ibizinclude>
../@MACRO/CSS/DEFAULT.less.ftl
</#ibizinclude>
.app-wizard-footer{
text-align: center;
}
\ No newline at end of file
<#ibizinclude>
../@MACRO/CONTROL/CONTROL.vue.ftl
</#ibizinclude>
\ No newline at end of file
## ibiz向导视图相关文档(移动端)
### 一、向导部件
##### (1)支持功能:操作向导(上一步、下一步)、提交向导表单
##### (2)界面UI
<div style = "display:flex; overflow:hidden; ">
<img src="images/README/xd_1.png" ></img>
<img src="images/README/xd_2.png" ></img>
</div>
<div style = "display:flex; overflow:hidden; ">
<img src="images/README/xd_3.png" ></img>
</div>
\ No newline at end of file
......@@ -15,9 +15,12 @@
<#-- 流程操作菜单:END -->
<#elseif ctrl.getToolbarStyle() == 'MOBBOTTOMMENU'>
<#-- 底部菜单:BEGIN -->
<div class = "bottom_menu">
<div <#if view.hasPSControl('mdctrl') || view.hasPSControl('dataview') || view.hasPSControl('calendar')>v-show="!showCheack"</#if> class = "bottom_menu">
<#list ctrl.getPSDEToolbarItems() as item>
${P.getPartCode(item).code}
<#if custom_toolbar??>
${custom_toolbar}
</#if>
</#list>
</div>
<#-- 底部菜单:END -->
......@@ -27,6 +30,9 @@
<div class="app-quick-toolbar">
<#list ctrl.getPSDEToolbarItems() as item>
${P.getPartCode(item).code}
<#if custom_toolbar??>
${custom_toolbar}
</#if>
</#list>
</div>
</div>
......@@ -37,6 +43,9 @@
<div class="app-quick-toolbar">
<#list ctrl.getPSDEToolbarItems() as item>
${P.getPartCode(item).code}
<#if custom_toolbar??>
${custom_toolbar}
</#if>
</#list>
</div>
</div>
......@@ -46,6 +55,9 @@
<div class="app-quick-toolbar">
<#list ctrl.getPSDEToolbarItems() as item>
${P.getPartCode(item).code}
<#if custom_toolbar??>
${custom_toolbar}
</#if>
</#list>
</div>
</div>
......
......@@ -74,6 +74,9 @@ ion-backdrop {
width: 40%;
right: 20px;
}
.app-quick-toolbar{
text-align: center;
}
<#assign havestyle = 0>
<#if ctrl.getToolbarStyle() == 'MOBNAVLEFTMENU'|| ctrl.getToolbarStyle() == 'MOBNAVRIGHTMENU' && havestyle = 0>
<#assign havestyle = 1>
......
......@@ -5,17 +5,25 @@
<#if ctrl.render??>
${ctrl.render.code}
<#else>
<van-form ref='${ctrl.name}' class="app-form <#if ctrl.getPSSysCss()??><#assign singleCss = ctrl.getPSSysCss()> ${singleCss.getCssName()}</#if>">
<div ref='${ctrl.name}' class="app-form <#if ctrl.getPSSysCss()??><#assign singleCss = ctrl.getPSSysCss()> ${singleCss.getCssName()}</#if>">
<#-- isNoTabHeader是否隐藏分页头部-->
<#if ctrl.isNoTabHeader()>
<#list ctrl.getPSDEFormPages() as formmenber>
${P.getPartCode(formmenber).code}
</#list>
<#else>
<van-tabs v-model="detailsModel.${ctrl.name}.activiedPage" @click="detailsModel.${ctrl.name}.clickPage($event)">
<ion-tabs class="app-form-tabs" @ionTabsDidChange="detailsModel.${ctrl.name}.clickPage($event)">
<#list ctrl.getPSDEFormPages() as formpage>
<van-tab name='${formpage.name}' :disabled="!detailsModel.${formpage.name}.visible">
<div slot="title" class="caption<#if formpage.getLabelPSSysCss?? && formpage.getLabelPSSysCss()??> ${formpage.getLabelPSSysCss().getCssName()}</#if>">
<ion-tab class="app-form-tab" tab="${formpage.name}">
<ion-row>
${P.getPartCode(formpage).code}
</ion-row>
</ion-tab>
</#list>
<ion-tab-bar slot="top">
<#list ctrl.getPSDEFormPages() as formpage>
<ion-tab-button tab="${formpage.name}" :disabled="!detailsModel.${formpage.name}.visible">
<ion-label class="caption<#if formpage.getLabelPSSysCss?? && formpage.getLabelPSSysCss()??> ${formpage.getLabelPSSysCss().getCssName()}</#if>">
<#if formpage.getPSSysImage()??>
<#assign sysimage = formpage.getPSSysImage()/>
<#if sysimage.getImagePath() == "">
......@@ -25,12 +33,12 @@
</#if>
</#if>
{{<#if langbase??>$t('${langbase}.details.${formpage.name}')<#else>'${formpage.getCaption()}'</#if>}}
</div>
${P.getPartCode(formpage).code}
</van-tab>
</ion-label>
</ion-tab-button>
</#list>
</van-tabs>
</ion-tab-bar>
</ion-tabs>
</#if>
</van-form>
</div>
</#if>
</template>
\ No newline at end of file
......@@ -17,7 +17,8 @@ ${item.render.code}
</#list>
</#if>
]"
:viewParam="context"
:context="context"
:viewparams="viewparams"
parameterName='${appde.getCodeName()?lower_case}'
refviewtype='<#if refView.getPSViewType()??>${refView.getPSViewType().getId()}</#if>'
refreshitems='<#if item.getRefreshItems()??>${item.getRefreshItems()}</#if>'
......@@ -25,6 +26,6 @@ ${item.render.code}
viewname='${srffilepath2(refView.codeName)}'
:data="JSON.stringify(this.data)"
@drdatasaved="drdatasaved($event)"
style="<#if item.getPSLayoutPos()?? && item.getPSLayoutPos().getLayout() == "FLEX">height: 100%</#if><#if item.getContentHeight() == 0><#if refView.getHeight() gt 0>height:${refView.getHeight()?c}px</#if><#else>height:${item.getContentHeight()?c}px</#if>;overflow: auto;">
style="<#if item.getPSLayoutPos()?? && item.getPSLayoutPos().getLayout() == "FLEX">height: 100%;</#if><#if item.getContentHeight() == 0><#if refView.getHeight() gt 0>height:${refView.getHeight()?c}px</#if><#else>height:${item.getContentHeight()?c}px;</#if>">
</app-form-druipart>
</#if>
......@@ -5,7 +5,7 @@
<#if item.render??>
${item.render.code}
<#else>
<app-form-item v-show="detailsModel.${item.name}.visible" name='${item.name}' :itemRules="this.rules.${item.name}" class='<#if item.getPSSysCss?? && item.getPSSysCss()??>${item.getPSSysCss().getCssName()}</#if>'<#if item.getLabelPSSysCss?? && item.getLabelPSSysCss()??> labelStyle="${item.getLabelPSSysCss().getCssName()}"</#if> :caption="<#if langbase??>$t('${langbase}.details.${item.name}')<#else>'${item.getCaption()}'</#if>" uiStyle="${item.getDetailStyle()}" :labelWidth="${item.getLabelWidth()?c}" :isShowCaption="${item.isShowCaption()?c}" :error="detailsModel.${item.name}.error" :isEmptyCaption="${item.isEmptyCaption()?c}" labelPos="${item.getLabelPos()}">
<app-form-item ref="${item.name}rules" :checkValue="this.data.${item.name}" v-show="detailsModel.${item.name}.visible" name='${item.name}' :itemRules="this.rules.${item.name}" class='<#if item.getPSSysCss?? && item.getPSSysCss()??>${item.getPSSysCss().getCssName()}</#if>'<#if item.getLabelPSSysCss?? && item.getLabelPSSysCss()??> labelStyle="${item.getLabelPSSysCss().getCssName()}"</#if> :caption="<#if langbase??>$t('${langbase}.details.${item.name}')<#else>'${item.getCaption()}'</#if>" uiStyle="${item.getDetailStyle()}" :labelWidth="${item.getLabelWidth()?c}" :isShowCaption="${item.isShowCaption()?c}" :error="detailsModel.${item.name}.error" :isEmptyCaption="${item.isEmptyCaption()?c}" labelPos="${item.getLabelPos()}">
<#if item.isCompositeItem()>
<#assign formitems=item.getPSDEFormItems()>
<app-range-editor v-model="data.${item.name}" :activeData="data" :disabled="detailsModel.${item.name}.disabled" name="${item.name}" editorType="${item.getEditorType()}" format="${item.getEditorParam("TIMEFMT","")}" :refFormItem="[<#list formitems as formitem><#if formitem_index gt 0>,</#if>'${formitem.name}'</#list>]" @formitemvaluechange="onFormItemValueChange" style="${item.getEditorCssStyle()}"></app-range-editor>
......
......@@ -21,9 +21,7 @@ ${item.render.code}
${content}
</div>
<#else>
<van-row>
${content}
</van-row>
</#if>
</app-form-group>
</#if>
......@@ -336,7 +336,7 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
<#if formitem.getPSDEFormItemUpdate()??>
<#assign itemUpdate=formitem.getPSDEFormItemUpdate()/>
if(Object.is(name, '${formitem.name}')){
if (Object.is(name, '${formitem.name}')) {
const details: string[] = [<#list itemUpdate.getPSDEFIUpdateDetails() as detail><#if detail_index gt 0>, </#if>'${detail.getPSDEFormDetailName()?lower_case}'</#list>];
this.updateFormItems('${itemUpdate.codeName}', this.data, details, ${itemUpdate.isShowBusyIndicator()?c});
}
......@@ -473,12 +473,23 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
protected formValidateStatus(): boolean {
const form: any = this.$refs.${ctrl.name};
<#-- const form: any = this.$refs.${ctrl.name};
let validatestate: boolean = true;
<#-- form.validate((valid: boolean) => {
form.validate((valid: boolean) => {
validatestate = valid ? true : false;
}); -->
return validatestate
return this.cheackRules();
}
public cheackRules() :boolean{
let refArr: Array<string> = [<#list ctrl.getAllPSDEFormDetails() as formdetail><#if formdetail.getDetailType?? && formdetail.getDetailType() == 'FORMITEM'>"${formdetail.getName()}rules",</#if></#list>];
let falg = true ;
refArr.forEach((item:any) => {
if(this.$refs[item] && (this.$refs[item] as any).checkRule && !(this.$refs[item] as any).checkRule()){
falg = false;
}
});
return falg;
}
/**
......@@ -822,8 +833,8 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
this.$nextTick(() => {
this.formState.next({ type: 'load', data: data });
});
} else if (response && response.status === 401) {
const { data: _data } = response;
} else if (response && response.status !== 401) {
const { error: _data } = response;
this.$notice.error(_data.message);
}
return response;
......@@ -856,8 +867,8 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
this.$nextTick(() => {
this.formState.next({ type: 'load', data: data });
});
} else if (response && response.status === 401) {
const { data: _data } = response;
} else if (response && response.status !== 401) {
const { error: _data } = response;
this.$notice.error(_data.message);
}
return response;
......@@ -897,7 +908,7 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
this.formState.next({ type: 'save', data: data });
});
} else if (response.status && response.status !== 401) {
const { data: _data } = response;
const { error: _data } = response;
if (Object.is(_data.status, 'BAD_REQUEST') && _data.parameters && _data.parameters.fieldErrors) {
this.resetValidates();
this.fillValidates(_data.parameters.fieldErrors)
......@@ -972,7 +983,7 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
}
</#if>
} else if (response && response.status !== 401) {
const { data: _data } = response;
const { error: _data } = response;
if (Object.is(_data.status, 'BAD_REQUEST') && _data.parameters && _data.parameters.fieldErrors) {
this.resetValidates();
this.fillValidates(_data.parameters.fieldErrors)
......@@ -1007,7 +1018,7 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
this.data.ismodify = false;
this.$notice.success((data.srfmajortext ? data.srfmajortext : '') + '&nbsp;删除成功!');
} else if (response && response.status !== 401) {
const { data: _data } = response;
const { error: _data } = response;
this.$notice.error(_data.message);
}
return response;
......@@ -1034,7 +1045,7 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
if (response && response.status === 200) {
this.$notice.success('工作流启动成功');
} else if (response && response.status !== 401) {
this.$notice.error('工作流启动失败, ' + response.info);
this.$notice.error('工作流启动失败, ' + response.error.message);
}
return response;
}
......@@ -1059,7 +1070,7 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
if (response && response.status === 200) {
this.$notice.success('工作流提交成功');
} else if (response && response.status !== 401) {
this.$notice.error('工作流提交失败, ' + response.info);
this.$notice.error('工作流提交失败, ' + response.error.message);
}
return response;
}
......@@ -1082,7 +1093,7 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
}
const arg: any = { ...data };
Object.assign(arg, this.viewparams);
const response: any = this.service.frontLogic(mode, { ...this.context }, arg, showloading);
const response: any = await this.service.frontLogic(mode, { ...this.context }, arg, showloading);
if (response && response.status === 200) {
const data = response.data;
const _data: any = {};
......@@ -1100,7 +1111,7 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
this.formState.next({ type: 'updateformitem', ufimode: arg.srfufimode, data: _data });
});
} else if (response && response.status !== 401) {
const { data: _data } = response;
const { error: _data } = response;
if (Object.is(_data.status, 'BAD_REQUEST') && _data.parameters && _data.parameters.fieldErrors) {
this.resetValidates();
this.fillValidates(_data.parameters.fieldErrors)
......@@ -1268,6 +1279,8 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
this.$emit('load', this.data);
}
</#if>
</#if>
......
......@@ -4,7 +4,15 @@
{
name: '${dataitem.getName()}',
<#if dataitem.getPSDEField()??>
<#if ctrl.getControlType() == 'SEARCHFORM'>
<#if dataitem.getPSDEFSearchMode?? && dataitem.getPSDEFSearchMode()??>
prop: '${dataitem.getPSDEFSearchMode().getCodeName()?lower_case}',
<#else>
prop: '${dataitem.getPSDEField().getCodeName()?lower_case}',
</#if>
<#else>
prop: '${dataitem.getPSDEField().getCodeName()?lower_case}',
</#if>
dataType: '${dataitem.getPSDEField().getDataType()}',
</#if>
},
......
## ibiz搜索表单相关文档(移动端)
### 一、搜索表单
##### (1)支持功能:重置、条件搜索
##### (2)界面UI
<div style = "display : flex ; overflow: hidden; ">
<img src="images/serch.png" ></img>
</div>
<#-- 绘图极坐标系的角度轴 -->
<#if item.render??>
${item.render.code}
<#else>
{
min: 0,
max: 360,
interval: 30,
startAngle: 45
}
</#if>
\ No newline at end of file
<#-- 绘图X轴 -->
<#if item.render??>
${item.render.code}
<#else>
{
<#if item.getIndex()??>gridIndex:${item.getIndex()},</#if>
position:<#if item.getPosition()?? && item.getPosition() =='bottom'>"bottom"<#else>"top"</#if>,
type:<#if item.getType()??>'${item.getType()}'<#else>'category'</#if>,
name:<#if item.getCaption()??>'${item.getCaption()}'</#if>,
<#if item.getMinValue()??>min:${item.getMinValue()},</#if>
<#if item.getMaxValue()??>max:${item.getMaxValue()},</#if>
<#if item.getBaseOptionJOString()??>
${item.getBaseOptionJOString()}
</#if>
}
</#if>
\ No newline at end of file
<#-- 绘图极坐标系的径向轴 -->
<#if item.render??>
${item.render.code}
<#else>
{
min: 0,
max: 10,
interval: 2
}
</#if>
\ No newline at end of file
<#-- 绘图平行坐标系 -->
<#if item.render??>
${item.render.code}
<#else>
{
}
</#if>
\ No newline at end of file
<#-- 绘图单轴 -->
<#if item.render??>
${item.render.code}
<#else>
{
}
</#if>
\ No newline at end of file
<#-- 绘图Y轴 -->
<#if item.render??>
${item.render.code}
<#else>
{
<#if item.getIndex()??>gridIndex:${item.getIndex()},</#if>
position:<#if item.getPosition()?? && item.getPosition() =='bottom'>"bottom"<#else>"top"</#if>,
type:<#if item.getType()?? && item.getType() == 'numeric'>'value'<#else>'${item.getType()}'</#if>,
name:<#if item.getCaption()??>'${item.getCaption()}'</#if>,
<#if item.getMinValue()??>min:${item.getMinValue()},</#if>
<#if item.getMaxValue()??>max:${item.getMaxValue()},</#if>
<#if item.getBaseOptionJOString()??>
${item.getBaseOptionJOString()}
</#if>
}
</#if>
\ No newline at end of file
<#-- 绘图X轴 -->
<#if item.render??>
${item.render.code}
<#else>
{
<#if item.getIndex()??>gridIndex:${item.getIndex()},</#if>
position:<#if item.getPosition()?? && item.getPosition() =='bottom'>"bottom"<#else>"top"</#if>,
type:<#if item.getType()??>'${item.getType()}'<#else>'category'</#if>,
name:<#if item.getCaption()??>'${item.getCaption()}'</#if>,
<#if item.getMinValue()??>min:${item.getMinValue()},</#if>
<#if item.getMaxValue()??>max:${item.getMaxValue()},</#if>
<#if item.getBaseOptionJOString()??>
${item.getBaseOptionJOString()}
</#if>
}
</#if>
\ No newline at end of file
<#-- 绘图Y轴 -->
<#if item.render??>
${item.render.code}
<#else>
{
<#if item.getIndex()??>gridIndex:${item.getIndex()},</#if>
position:<#if item.getPosition()?? && item.getPosition() =='bottom'>"bottom"<#else>"top"</#if>,
type:<#if item.getType()?? && item.getType() == 'numeric'>'value'<#else>'${item.getType()}'</#if>,
name:<#if item.getCaption()??>'${item.getCaption()}'</#if>,
<#if item.getMinValue()??>min:${item.getMinValue()},</#if>
<#if item.getMaxValue()??>max:${item.getMaxValue()},</#if>
<#if item.getBaseOptionJOString()??>
${item.getBaseOptionJOString()}
</#if>
}
</#if>
\ No newline at end of file
<#-- 绘图网格start -->
<#if item.render??>
${item.render.code}
<#else>
{
<#if item.getBaseOptionJOString()??>
${item.getBaseOptionJOString()}
</#if>
}
</#if>
<#-- 绘图网格end -->
\ No newline at end of file
<#-- 柱状图序列start -->
<#if item.render??>
${item.render.code}
<#else>
{
id:'<#if item.getName()??>${item.getName()?lower_case}</#if>',
name:'<#if item.getCaption()??>${item.getCaption()}</#if>',
type:'bar',
xAxisIndex:${item.getIndex()},
yAxisIndex:${item.getIndex()},
datasetIndex:${item.getIndex()},
encode: {
<#if item.getPSChartSeriesEncode()??><#assign chartSeriesEncode = item.getPSChartSeriesEncode() /></#if>
x: [<#if chartSeriesEncode.getX()??><#list chartSeriesEncode.getX() as xValue>'${xValue?lower_case}'<#if xValue_has_next>,</#if></#list></#if>],
y: [<#if chartSeriesEncode.getY()??><#list chartSeriesEncode.getY() as yValue>'${yValue?lower_case}'<#if yValue_has_next>,</#if></#list></#if>]
}<#if item.getBaseOptionJOString()??>,
${item.getBaseOptionJOString()}
</#if>
}
</#if>
<#-- 柱状图序列end -->
\ No newline at end of file
<#-- 折线图序列start -->
<#if item.render??>
${item.render.code}
<#else>
{
id:'<#if item.getName()??>${item.getName()?lower_case}</#if>',
name:'<#if item.getCaption()??>${item.getCaption()}</#if>',
type:'funnel',
datasetIndex:${item.getIndex()},
<#compress><#if item.getLeft()?? && item.getLeft() != "">left:"${item.getLeft()}",</#if>
<#if item.getTop()?? && item.getTop() != 0>top:"${item.getTop()}",</#if>
<#if item.getBottom()?? && item.getBottom() != 0>bottom:"${item.getBottom()}",</#if>
<#if item.getRight()?? && item.getRight() != "">right:"${item.getRight()}",</#if>
<#if item.getWidth()?? && item.getWidth() != "">width:"${item.getWidth()}",</#if>
<#if item.getHeight()?? && item.getHeight() != "">height:"${item.getHeight()}",</#if>
<#if item.getMinValue()?? && item.getMinValue() != 0 >min:"${item.getMinValue()}",</#if>
<#if item.getMaxValue()?? && item.getMaxValue() != 0 >max:"${item.getMaxSize()}",</#if>
<#if item.getMinSize()?? && item.getMinSize() != "">minSize:"${item.getMinSize()}",</#if>
<#if item.getMaxSize()?? && item.getMaxSize() != "">maxSize: "${item.getMaxSize()}",</#if>
<#if item.getFunnelAlign()?? && item.getFunnelAlign() != "">funnelAlign:"${item.getFunnelAlign()}",</#if></#compress>
seriesLayoutBy:"${item.getSeriesLayoutBy()}",
encode:{
<#if item.getPSChartSeriesEncode()??><#assign chartSeriesEncode = item.getPSChartSeriesEncode() /></#if>
itemName:"<#if chartSeriesEncode.getCategory()??>${chartSeriesEncode.getCategory()?lower_case}<#else>${item.getCatalogField()?lower_case}</#if>",
value:"<#if chartSeriesEncode.getValue()??>${chartSeriesEncode.getValue()?lower_case}<#else>${item.getValueField()?lower_case}</#if>"
}<#if item.getBaseOptionJOString()??>,
${item.getBaseOptionJOString()}
</#if>
}
</#if>
<#-- 折线图序列end -->
\ No newline at end of file
<#-- 折线图序列start -->
<#if item.render??>
${item.render.code}
<#else>
{
id:'<#if item.getName()??>${item.getName()?lower_case}</#if>',
name:'<#if item.getCaption()??>${item.getCaption()}</#if>',
type:'line',
xAxisIndex:${item.getIndex()},
yAxisIndex:${item.getIndex()},
datasetIndex:${item.getIndex()},
encode: {
<#if item.getPSChartSeriesEncode()??><#assign chartSeriesEncode = item.getPSChartSeriesEncode() /></#if>
x: [<#if chartSeriesEncode.getX()??><#list chartSeriesEncode.getX() as xValue>'${xValue?lower_case}'<#if xValue_has_next>,</#if></#list></#if>],
y: [<#if chartSeriesEncode.getY()??><#list chartSeriesEncode.getY() as yValue>'${yValue?lower_case}'<#if yValue_has_next>,</#if></#list></#if>]
}<#if item.getBaseOptionJOString()??>,
${item.getBaseOptionJOString()}
</#if>
}
</#if>
<#-- 折线图序列end -->
\ No newline at end of file
<#-- 折线图序列start -->
<#if item.render??>
${item.render.code}
<#else>
{
id:'<#if item.getName()??>${item.getName()?lower_case}</#if>',
name:'<#if item.getCaption()??>${item.getCaption()}</#if>',
type:'pie',
datasetIndex:${item.getIndex()},
<#compress><#if item.getLeft()?? && item.getLeft() != "">left:"${item.getLeft()}",</#if>
<#if item.getTop()?? && item.getTop() != 0>top:"${item.getTop()}",</#if>
<#if item.getBottom()?? && item.getBottom() != 0>bottom:"${item.getBottom()}",</#if>
<#if item.getRight()?? && item.getRight() != "">right:"${item.getRight()}",</#if>
<#if item.getWidth()?? && item.getWidth() != "">width:"${item.getWidth()}",</#if>
<#if item.getHeight()?? && item.getHeight() != "">height:"${item.getHeight()}",</#if></#compress>
seriesLayoutBy:"${item.getSeriesLayoutBy()}",
encode:{
<#if item.getPSChartSeriesEncode()??><#assign chartSeriesEncode = item.getPSChartSeriesEncode() /></#if>
itemName:"<#if chartSeriesEncode.getCategory()??>${chartSeriesEncode.getCategory()?lower_case}<#else>${item.getCatalogField()?lower_case}</#if>",
value:"<#if chartSeriesEncode.getValue()??>${chartSeriesEncode.getValue()?lower_case}<#else>${item.getValueField()?lower_case}</#if>"
}<#if item.getBaseOptionJOString()??>,
${item.getBaseOptionJOString()}
</#if>
}
</#if>
<#-- 折线图序列end -->
\ No newline at end of file
此差异已折叠。
<#assign content>
fetchAction="<#if ctrl.getFetchPSControlAction()?? && ctrl.getFetchPSControlAction().getPSAppDEMethod()??>${ctrl.getFetchPSControlAction().getPSAppDEMethod().getCodeName()}</#if>"
:showBusyIndicator="${ctrl.isShowBusyIndicator()?c}"
</#assign>
<#ibizinclude>
../@MACRO/HTML/DEFAULT.html.ftl
</#ibizinclude>
\ No newline at end of file
<#ibizinclude>
../@MACRO/CSS/DEFAULT.less.ftl
</#ibizinclude>
.app-data-chart {
width: 100%;
height: 100%;
}
\ No newline at end of file
<#ibizinclude>
../@MACRO/CONTROL/CONTROL.vue.ftl
</#ibizinclude>
\ No newline at end of file
<#ibizinclude>
../@MACRO/MODEL/MODEL_HEADER.ts.ftl
</#ibizinclude>
/**
* 获取数据项集合
*
* @returns {any[]}
* @memberof ${srfclassname('${ctrl.getCodeName()}')}${srfclassname('${ctrl.name}')}Mode
*/
public getDataItems(): any[] {
return [
{
name:'query',
prop:'query'
},
]
}
<#ibizinclude>
../@MACRO/MODEL/MODEL_BOTTOM.ts.ftl
</#ibizinclude>
\ No newline at end of file
## ibiz图表视图相关文档(移动端)
### 一、图表(序列)类型
#### 1、漏斗图
##### (1) 支持功能
- ###### 自定义分组:需配置代码表
- ###### 图例数据自定义切换
##### (2) 平台配置
- 选择序列类型为漏斗图、坐标系为:无坐标系、分类属性为该实体的分类属性、值属性为该实体的值属性
<div style = "display:flex; overflow:hidden; ">
<img src="images/README/pz_funnel_1.png" ></img>
</div>
-
##### (3) 界面UI
<div style = "display:flex; overflow:hidden; ">
<img src="images/README/funnel.png" ></img>
</div>
#### 2、条形图
##### (1)支持功能:
- ###### 自定义分组:季度分组、年分组、月分组(示例为季度分组)
- ###### 图例数据自定义切换
##### (2) 平台配置
- 建立坐标轴(x、y)数据字段为该轴展示的数据(见二坐标轴配置)
- 选择序列类型为条形图、x、y坐标轴(为第一步建立的坐标轴)、分类属性为该实体的分类属性、值属性为该实体的值属性、分组模式
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/pz_bar_2.png" ></img>
</div>
##### (3)界面UI
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/bar.png" ></img>
</div>
#### 3、饼图
##### (1)支持功能
- ###### 自定义分组:季度分组、年分组、月分组(示例为季度分组)、代码表
- ###### 图例数据自定义切换
##### (2) 平台配置
- 建立坐标轴(x、y)数据字段为该轴展示的数据(见二坐标轴配置)
- 选择序列类型为饼图、x、y坐标轴(为第一步建立的坐标轴)、分类属性为该实体的分类属性、值属性为该实体的值属性
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/pz_bing_1.png" ></img>
</div>
##### (3)界面UI
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/bing.png" ></img>
</div>
#### 4、折线图
##### (1)支持功能:
- ###### 自定义分组:需配置代码表
- ###### 图例数据自定义切换
##### (2)平台配置
- 建立坐标轴(x、y)数据字段为该轴展示的数据(见二坐标轴配置)
- 选择序列类型为折线图、x、y坐标轴(为第一步建立的坐标轴)、分类属性为该实体的分类属性、值属性为该实体的值属性
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/pz_line_1.png" ></img>
</div>
##### (3)界面UI
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/line.png" ></img>
</div>
### 二、坐标轴
新建坐标轴:标题为该坐标轴的标题、坐标轴类型(分类、数值、时间)、坐标轴位置(坐标轴展示数据的位置)
数据字段(该坐标轴的数据属性)
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/pz_bar_1.png" ></img>
</div>
\ No newline at end of file
<#assign extendsClass>ChartServiceBase</#assign>
<#ibizinclude>
../@MACRO/SERVICE/SERVICE_HEADER.ts.ftl
</#ibizinclude>
<#ibizinclude>
../@MACRO/SERVICE/SERVICE_BOTTOM.ts.ftl
</#ibizinclude>
\ No newline at end of file
CTRLTYPE=CHART#NEW
\ No newline at end of file
......@@ -69,7 +69,7 @@
<#-- END:输出分页头部 -->
<#if ctrl.getCalendarStyle() == "TIMELINE">
<div class="calendar-events">
<van-steps direction="vertical">
<van-steps active-icon="passed" inactive-icon="passed" direction="vertical">
<van-step v-for="i in count" :key="i">
<p>{{year}}-{{month+1}}-{{i}}</p>
<template v-for="(it,index) in evendata[activeItem]">
......@@ -88,14 +88,17 @@
<#elseif ctrl.getCalendarStyle() == "MONTH_TIMELINE" || ctrl.getCalendarStyle() == "WEEK_TIMELINE">
<div class="calendar-events">
<van-steps direction="vertical">
<van-steps active-icon="passed" inactive-icon="passed" direction="vertical">
<van-step v-for="(i,index) in evendata[activeItem]" :key="index">
<p>{{i.time}}</p>
<div v-for="item in i.evens" :key="item.id" class="even-box">
<#-- BENGIN: 事件内容项 -->
<#ibizinclude>./EVENTS_CONTENT.vue.ftl</#ibizinclude>
<#-- END: 事件内容项 -->
<ion-icon @click="remove([item])" class="event-delete" name="close-outline"></ion-icon>
<div class="touch" v-for="(item,index) in i.evens" :key="index" @touchstart="touchStart" @touchend="touchEnd">
<ion-checkbox v-show="showCheack" class="touch-checkbox" @click.stop="checkboxSelect(item)"></ion-checkbox>
<div :key="item.id" class="even-box">
<#-- BENGIN: 事件内容项 -->
<#ibizinclude>./EVENTS_CONTENT.vue.ftl</#ibizinclude>
<#-- END: 事件内容项 -->
<ion-icon v-show="!showCheack" @click="remove([item])" class="event-delete" name="close-outline"></ion-icon>
</div>
</div>
</van-step>
</van-steps>
......
......@@ -167,6 +167,7 @@ import moment from 'moment';
*/
public count :number = 20;
/**
* 获取单项树
*
......@@ -243,7 +244,6 @@ import moment from 'moment';
return ;
}
this.activeItem = _value;
this.formatData(new Date(this.year+'/'+(this.month+1)+'/'+this.day));
}
/**
......@@ -486,6 +486,26 @@ import moment from 'moment';
}
});
for (const key in obj) {
<#if ctrl.getPSSysCalendarItems()??>
<#list ctrl.getPSSysCalendarItems() as calendaritem>
<#if calendaritem.getItemType()??>
let ${calendaritem.getItemType()?lower_case} = false;
</#if>
</#list>
</#if>
obj[key].forEach((item:any,index:number) => {
<#if ctrl.getPSSysCalendarItems()??>
<#list ctrl.getPSSysCalendarItems() as calendaritem>
<#if calendaritem.getItemType()??>
if(item.itemType=="${calendaritem.getItemType()?lower_case}" && ${calendaritem.getItemType()?lower_case}){
obj[key].splice(0,index);
}else{
${calendaritem.getItemType()?lower_case} = true;
}
</#if>
</#list>
</#if>
});
this.sign.push({time:key,evens:obj[key]});
}
}
......@@ -616,7 +636,7 @@ import moment from 'moment';
<#list ctrl.getPSSysCalendarItems() as calendarItem>
<#if calendarItem.getPSAppDataEntity()??>
<#assign _appde = calendarItem.getPSAppDataEntity() />
case "${calendarItem.getItemType()}":
case "${calendarItem.getItemType()?lower_case}":
_context.${_appde.getCodeName()?lower_case} = $event.${_appde.getCodeName()?lower_case};
view = this.getEditView("${_appde.getCodeName()?lower_case}");
break;
......@@ -632,7 +652,7 @@ import moment from 'moment';
if (Object.is(view.placement, 'POPUPMODAL')) {
container = await this.$appmodal.openModal(view, JSON.parse(JSON.stringify(_context)), JSON.parse(JSON.stringify(this.viewparams)));
} else if (view.placement.startsWith('DRAWER')) {
container = this.$appdrawer.openDrawer(view, JSON.parse(JSON.stringify(_context)), JSON.parse(JSON.stringify(this.viewparams)));
container = await this.$appdrawer.openDrawer(view, JSON.parse(JSON.stringify(_context)), JSON.parse(JSON.stringify(this.viewparams)));
}
container.subscribe((result: any) => {
if (!result || !Object.is(result.ret, 'OK')) {
......@@ -658,6 +678,66 @@ import moment from 'moment';
this.formatData(new Date(year + '/' + month + '/' + (week*7 - weekline + 1)));
}
}
/**
* 选中数组
*
* @param {Array<any>}
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public selectedArray:Array<any> = [];
/**
* 是否展示多选
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
@Prop({default:false}) showCheack?: boolean;
/**
* 选中或取消事件
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public checkboxSelect(item:any){
let count = this.selectedArray.findIndex((i) => {
return i.mobile_entity1id == item.mobile_entity1id;
});
if(count == -1){
this.selectedArray.push(item);
}else{
this.selectedArray.splice(count,1);
}
}
/**
* 长按定时器
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public loop :any;
/**
* 开始长按
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public touchStart () {
      clearTimeout(this.loop); //再次清空定时器,防止重复注册定时器
      this.loop = setTimeout(() => {
this.$emit('showCheackChange', !this.showCheack);
      }, 1000);
    }
/**
* 结束长按
*
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
public touchEnd () {
clearTimeout(this.loop); //清空定时器,防止重复注册定时器
}
<#ibizinclude>
../@MACRO/CONTROL/CONTROL_BOTTOM-BASE.vue.ftl
</#ibizinclude>
......
<#-- content -->
<#assign content>
:showBusyIndicator="${ctrl.isShowBusyIndicator()?c}"
:showCheack="showCheack"
@showCheackChange="showCheackChange"
</#assign>
<#ibizinclude>
../@MACRO/HTML/DEFAULT.html.ftl
......
......@@ -120,6 +120,7 @@
margin-bottom: 5px;
border-radius: 4px;
color: #333;
width: 100%;
}
.evenname {
padding: 5px 0;
......@@ -137,4 +138,14 @@
}
</#if>
.van-step__icon--active, .van-step__title--active {
color: #969799;
}
.touch{
display:flex ;
align-items: center;
.touch-checkbox{
min-width: 25px;
margin-right: 10px;
}
}
\ No newline at end of file
<#assign import_block>
import Calendar from "mpvue-calendar";
import "mpvue-calendar/src/browser-style.css";
import moment from 'moment';
</#assign>
<#assign components>
Calendar
</#assign>
<#ibizinclude>
../@MACRO/CONTROL/CONTROL.vue.ftl
</#ibizinclude>
\ No newline at end of file
<#if ctrl.getPSSysCalendarItems()??>
<#list ctrl.getPSSysCalendarItems() as calendarItem>
<div v-if="activeItem == '<#if calendarItem.getItemType()??>${calendarItem.getItemType()?lower_case}</#if>'" <#if ctrl.getCalendarStyle() == "TIMELINE">:key="item.id"</#if>>
<div v-if="activeItem == '<#if calendarItem.getItemType()??>${calendarItem.getItemType()?lower_case}</#if>'" <#if ctrl.getCalendarStyle() == "TIMELINE">:key="item.id"</#if><#if calendarItem.getPSSysCalendarItemRVs()??>@click="onEventClick(item)"</#if>>
<#if calendarItem.getPSLayoutPanel?? && calendarItem.getPSLayoutPanel()??>
<#assign layoutpanel=calendarItem.getPSLayoutPanel()>
<layout_${layoutpanel.getName()} :context="{}" :viewparams="{}" :item="item"></layout_${layoutpanel.getName()}>
<#else>
<#if calendarItem.getTextPSAppDEField()??>
<#assign text=true>
<div class="evenname">{{item.${calendarItem.getTextPSAppDEField().getName()?lower_case}}}</div>
......@@ -16,6 +20,7 @@
<#if !text>
<div class="evenname">{{item.<#if appde.getMajorPSAppDEField()??>${appde.getMajorPSAppDEField().getCodeName()?lower_case}<#else>srfmajortext</#if>}}}</div>
</#if>
</#if>
</div>
</#list>
</#if>
\ No newline at end of file
## ibiz日历样式相关文档(移动端)
### 一、日历部件样式
#### 1、月/月(复合时间轴)
##### (1)支持功能:年/月/日切换、切换日历样式、删除日程、日程展示标识、点击日期更新日程
##### (1)支持功能:年/月/日切换、切换日历样式、删除日程、日程展示标识、点击日期更新日程、长按事件多选、长按显示批操工具栏
##### (2)界面UI
<div style = "display : flex ; overflow: hidden; ">
<div style = "display:flex; overflow:hidden; ">
<img src="images/README/mounth.png" ></img>
<img src="images/README/mounth_top.png" ></img>
</div>
<div style = "display:flex; overflow:hidden; ">
<img src="images/README/each.png" ></img>
</div>
#### 2、周/周(复合时间轴)
##### (1)支持功能:年/月/日切换、删除日程、日程展示标识、时间轴日程
##### (1)支持功能:年/月/日切换、删除日程、日程展示标识、时间轴日程、长按事件多选
##### (2)界面UI
​ ![week](images/README/week.png)
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/week.png" ></img>
<img src="images/README/week_touch.png" ></img>
</div>
#### 3、天
##### (1)支持功能:展示日程
......
......@@ -8,7 +8,11 @@
<div class="app-mob-mdctrl-${ctrl.name}">
<ion-list class="items">
<template v-if="(viewType == 'DEMOBMDVIEW9') && controlStyle != 'SWIPERVIEW' ">
<ion-item-sliding v-for="(item, index) in items" @click="goPage(item)" :key="index" class="app-mob-mdctrl-item">
<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-item-sliding v-for="(item, index) in items" @click="goPage(item)" :key="index" class="app-mob-mdctrl-item" @touchstart="start" @touchend="end">
<#-- BENGIN:输出界面行为组 -->
<@outPutActionGroup ctrl />
<#-- END:输出界面行为组 -->
......@@ -18,6 +22,7 @@
<#-- END:输出项布局面板 -->
<#else>
<ion-item>
<ion-checkbox :checked="item.checked" v-show="showCheack" @click.stop="checkboxSelect(item)"></ion-checkbox>
<#--实体列表项集合-->
<#if ctrl.getPSDEListItems()??>
<!-- 列表视图样式 -->
......@@ -36,7 +41,11 @@
<ion-list class="items">
<#--多数据视图||多数据视图(部件视图)-->
<template v-if="(viewType == 'DEMOBMDVIEW') && controlStyle != 'SWIPERVIEW' ">
<ion-item-sliding v-for="(item, index) in items" @click="goPage(item)" :key="index" class="app-mob-mdctrl-item">
<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-item-sliding v-for="(item, index) in items" @click="goPage(item)" :key="index" class="app-mob-mdctrl-item" @touchstart="start" @touchend="end">
<#-- BENGIN:输出界面行为组 -->
<@outPutActionGroup ctrl />
<#-- END:输出界面行为组 -->
......@@ -46,6 +55,7 @@
<#-- END:输出项布局面板 -->
<#else>
<ion-item>
<ion-checkbox :checked="item.checked" v-show="showCheack" @click.stop="checkboxSelect(item)"></ion-checkbox>
<#--实体列表项集合-->
<#if ctrl.getPSDEListItems()??>
<!-- 列表视图样式 -->
......
......@@ -674,6 +674,91 @@
this.goPage(item);
}
/**
* 是否展示多选
*
* @memberof Mdctrl
*/
@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>
......
......@@ -10,6 +10,10 @@
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>"
:isMutli="!isSingleSelect"
<#if view.getViewType?? && view.getViewType()?? && view.getViewType() == 'DEMOBMDVIEW' || view.getViewType() == 'DEMOBMDVIEW9'>
:showCheack="showCheack"
@showCheackChange="showCheackChange"
</#if>
:isTempMode="<#if ctrl.isTempMode?? && ctrl.isTempMode()??>${ctrl.isTempMode()?c}</#if>"
</#assign>
<#ibizinclude>
......
......@@ -8,3 +8,14 @@
.ibz-ionic-item{
--inner-border-width:0;
}
.iconcheck{
width: 70px;
}
.selectall{
padding: 5px 20px;
padding: 0 20px;
display: flex;
}
.selectal-label{
padding-left: 15px;
}
\ No newline at end of file
......@@ -2,6 +2,7 @@
<#assign layoutpanel=ctrl.getItemPSLayoutPanel()>
<div style="width:100%;">
<ion-item class="ibz-ionic-item">
<ion-checkbox class="iconcheck" v-show="showCheack" @click.stop="checkboxSelect(item)"></ion-checkbox>
<layout_${layoutpanel.getName()} :context="{}" :viewparams="{}" :item="item"></layout_${layoutpanel.getName()}>
</ion-item>
</div>
......
......@@ -11,7 +11,7 @@
public getDataItems(): any[] {
return [
<#-- 表格数据项 -->
<#if ctrl.getPSListDataItems?? && ctrl.getPSListDataItems()??>
<#if ctrl.getPSListDataItems?? && ctrl.getPSListDataItems()??>
<#list ctrl.getPSListDataItems() as dataitem>
{
name: '${dataitem.getName()}',
......@@ -21,7 +21,7 @@
</#if>
},
</#list>
</#if>
</#if>
<#-- 关联主实体的主键 -->
<#if ctrl.getPSAppDataEntity()??>
<#assign appDataEntity = ctrl.getPSAppDataEntity() />
......@@ -78,7 +78,7 @@ ${P.getCtrlCode('searchform', 'MODEL_CONTENT.ts').code}
name:'srfparentdata',
prop:'srfparentdata'
}
]
];
}
<#ibizinclude>
......
......@@ -28,11 +28,11 @@
#### 三、效果展示
1、列表视图(默认)、(无刷新)、(无滑动)
1、列表视图(默认)、(无刷新)、(无滑动)、长按多选、排序、批操工具栏
​ (1)、展示效果
![默认列表样式](./imgs/default-list-view.png)
![1589010711651](./imgs/each.png) ![默认列表样式](./imgs/default-list-view.png)
​ (2)、支持功能(刷新、滑动) ps:无刷新不支持刷新、无滑动不支持滑动
......
......@@ -2,7 +2,14 @@
<div class = "card-view ">
<#if view.getViewType?? && view.getViewType()?? && view.getViewType() == 'DEMOBDATAVIEW'>
<ion-row >
<ion-col :size="size" v-for="(item,index) in items" :key="index">
<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" @touchstart="start" @touchend="end">
<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" />
......@@ -19,7 +26,7 @@
</#if>
</div>
</div>
<ion-icon :style="{color :size == '6' ?'#fff':'#333'}" @click="remove([item])" class="card-delete" name="close-outline"></ion-icon>
<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>
......
......@@ -642,6 +642,91 @@
}
/**
* 是否展示多选
*
* @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>
......
......@@ -7,6 +7,8 @@
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>"
:showCheack="showCheack"
@showCheackChange="showCheackChange"
</#assign>
<#ibizinclude>
../@MACRO/HTML/DEFAULT.html.ftl
......
......@@ -21,12 +21,10 @@
font-size: 15px;
}
.ibz-card-12 {
margin: 12px;
margin-bottom: 0;
margin: 12px 12px 0 35px;
}
.ibz-card-6{
margin-bottom: 0;
margin: 5px 10px;
margin: 5px 10px 5px 30px;
}
.ibz-content {
padding: 10px;
......@@ -40,4 +38,15 @@
.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
## 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>
......@@ -5,7 +5,7 @@
<#if item.render??>
${item.render.code}
<#else>
<app-form-item v-show="detailsModel.${item.name}.visible" name='${item.name}' :itemRules="this.rules.${item.name}" class='<#if item.getPSSysCss?? && item.getPSSysCss()??>${item.getPSSysCss().getCssName()}</#if>'<#if item.getLabelPSSysCss?? && item.getLabelPSSysCss()??> labelStyle="${item.getLabelPSSysCss().getCssName()}"</#if> :caption="<#if langbase??>$t('${langbase}.details.${item.name}')<#else>'${item.getCaption()}'</#if>" uiStyle="${item.getDetailStyle()}" :labelWidth="${item.getLabelWidth()?c}" :isShowCaption="${item.isShowCaption()?c}" :error="detailsModel.${item.name}.error" :isEmptyCaption="${item.isEmptyCaption()?c}" labelPos="${item.getLabelPos()}">
<app-form-item ref="${item.name}rules" :checkValue="this.data.${item.name}" v-show="detailsModel.${item.name}.visible" name='${item.name}' :itemRules="this.rules.${item.name}" class='<#if item.getPSSysCss?? && item.getPSSysCss()??>${item.getPSSysCss().getCssName()}</#if>'<#if item.getLabelPSSysCss?? && item.getLabelPSSysCss()??> labelStyle="${item.getLabelPSSysCss().getCssName()}"</#if> :caption="<#if langbase??>$t('${langbase}.details.${item.name}')<#else>'${item.getCaption()}'</#if>" uiStyle="${item.getDetailStyle()}" :labelWidth="${item.getLabelWidth()?c}" :isShowCaption="${item.isShowCaption()?c}" :error="detailsModel.${item.name}.error" :isEmptyCaption="${item.isEmptyCaption()?c}" labelPos="${item.getLabelPos()}">
<#if item.isCompositeItem()>
<#assign formitems=item.getPSDEFormItems()>
<app-range-editor v-model="data.${item.name}" :activeData="data" :disabled="detailsModel.${item.name}.disabled" name="${item.name}" editorType="${item.getEditorType()}" format="${item.getEditorParam("TIMEFMT","")}" :refFormItem="[<#list formitems as formitem><#if formitem_index gt 0>,</#if>'${formitem.name}'</#list>]" @formitemvaluechange="onFormItemValueChange" style="${item.getEditorCssStyle()}"></app-range-editor>
......
......@@ -473,12 +473,23 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
* @memberof ${srfclassname('${ctrl.codeName}')}
*/
protected formValidateStatus(): boolean {
const form: any = this.$refs.${ctrl.name};
<#-- const form: any = this.$refs.${ctrl.name};
let validatestate: boolean = true;
<#-- form.validate((valid: boolean) => {
form.validate((valid: boolean) => {
validatestate = valid ? true : false;
}); -->
return validatestate
return this.cheackRules();
}
public cheackRules() :boolean{
let refArr: Array<string> = [<#list ctrl.getAllPSDEFormDetails() as formdetail><#if formdetail.getDetailType?? && formdetail.getDetailType() == 'FORMITEM'>"${formdetail.getName()}rules",</#if></#list>];
let falg = true ;
refArr.forEach((item:any) => {
if(this.$refs[item] && (this.$refs[item] as any).checkRule && !(this.$refs[item] as any).checkRule()){
falg = false;
}
});
return falg;
}
/**
......@@ -1268,6 +1279,8 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
this.$emit('load', this.data);
}
</#if>
</#if>
......
......@@ -3,7 +3,12 @@
</#ibizinclude>
.app-form {
<#if ctrl.getFormFuncMode?? && ctrl.getFormFuncMode()?? && ctrl.getFormFuncMode() == "WIZARDFORM">
height: calc(100vh - 105px - 52px);
overflow: auto;
<#else>
height: 100%;
</#if>
>.app-form-tabs {
height: 100%;
>.app-form-tab {
......
## ibiz表单部件相关文档(移动端)
### 一、动态标签位置
#### 1、 LEFT
##### 界面UI
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/left.png" ></img>
</div>
#### 2、RIGHT
##### 界面UI
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/right.png" ></img>
</div>
#### 3、 TOP
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/top.png" ></img>
</div>
### 二、表单项校验
<div style = "display : flex ; overflow: hidden; ">
<img src="images/README/jiaoyan.png" ></img>
</div>
\ No newline at end of file
......@@ -92,3 +92,19 @@ ${css.getCssStyle()}
}
</#if>
</#list>
<#if view.hasPSControl('searchform')>
//搜索表单按钮
.search-btn{
display: flex;
margin-bottom: 15px;
.search-btn-item{
width: 50%;
}
}
</#if>
<#if view.isEnableQuickSearch?? && view.isEnableQuickSearch() == true>
.filter-btn{
position: relative;
top: 5px;
}
</#if>
\ No newline at end of file
......@@ -10,6 +10,7 @@
<#assign isStyleName = false/>
</#if>
<ion-page :className="{ 'view-container': true<#if !isStyleName>, 'default-mode-view': true</#if>, '${view.getViewType()?lower_case}': true, '${srffilepath2(view.getCodeName())}': true<#if view.getPSSysCss?? && view.getPSSysCss()??>, '${view.getPSSysCss().getCssName()}': true</#if> }">
<ion-header>
<ion-toolbar class="ionoc-view-header">
<ion-buttons slot="start">
......@@ -67,6 +68,9 @@
<#if view.isEnableQuickSearch?? && view.isEnableQuickSearch() == true>
<ion-toolbar>
<ion-searchbar style="height: 36px; padding-bottom: 0px;" :placeholder="$t('app.fastsearch')" debounce="500" @ionChange="quickValueChange($event)" show-cancel-button="focus" :cancel-button-text="$t('app.button.cancel')"></ion-searchbar>
<#if view.hasPSControl('searchform')>
<ion-button class="filter-btn" size="small" slot="end" @click="openSearchform"><ion-icon slot="end" name="filter-outline"></ion-icon>过滤</ion-button>
</#if>
</ion-toolbar>
</#if>
<#-- 输出快速搜索:END -->
......@@ -78,6 +82,29 @@
</#if>
<#-- 自定义头部按钮:END -->
</ion-header>
<#-- 搜索表单:BEGIN -->
<#if view.hasPSControl('searchform')>
<ion-menu side="start" content-id="searchform<#if view.getName()??>${view.getName()?lower_case}</#if>" ref='searchform<#if view.getName()??>${view.getName()?lower_case}</#if>'>
<ion-header>
<ion-toolbar translucent>
<ion-title>条件搜索</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
${P.getCtrlCode('searchform', 'CONTROL.html').code}
</ion-content>
<ion-footer>
<div class="search-btn">
<ion-button class="search-btn-item" shape="round" size="small" expand="full" color="light" @click="onReset">重置</ion-button>
<ion-button class="search-btn-item" shape="round" size="small" expand="full" @click="onSearch">搜索</ion-button>
</div>
</ion-footer>
</ion-menu>
<div id="searchform<#if view.getName()??>${view.getName()?lower_case}</#if>"></div>
</#if>
<#-- 搜索表单:END -->
<ion-content>
<#-- 视图是否支持下拉刷新:BEGIN -->
<#if view.isEnablePullDownRefresh?? && view.isEnablePullDownRefresh()>
......
<div class="view-container ${srffilepath2(view.getCodeName())}<#if view.getPSSysCss?? && view.getPSSysCss()??> ${view.getPSSysCss().getCssName()}</#if>">
<card class='view-card<#if !view.isShowCaptionBar()> view-no-caption</#if>' :dis-hover='true' :padding='0' :bordered='false'>
<ion-page class="view-container ${srffilepath2(view.getCodeName())}<#if view.getPSSysCss?? && view.getPSSysCss()??> ${view.getPSSysCss().getCssName()}</#if>">
<#if view.isShowCaptionBar()>
<p slot="title">
${view.getCaption()}
</p>
<ion-header>
<ion-toolbar class="ionoc-view-header">
<ion-buttons slot="start">
<ion-button v-show="isShowBackButton" @click="closeView">
<ion-icon name="chevron-back"></ion-icon>
{{$t('app.button.back')}}
</ion-button>
</ion-buttons>
<ion-title>{{$t(model.srfCaption)}}</ion-title>
</ion-toolbar>
</ion-header>
</#if>
<div class="content-container">
<ion-content class="content-container">
<@ibizindent blank=12>
<#if view.hasPSControl('wizardpanel')>
${P.getCtrlCode('wizardpanel', 'CONTROL.html').code}
</#if>
</@ibizindent>
</div>
</card>
</div>
\ No newline at end of file
</ion-content>
</ion-page>
\ No newline at end of file
......@@ -6,3 +6,7 @@
justify-content: space-between;
padding: 0 15px;
}
.batch_btn{
display: flex;
justify-content: center;
}
\ No newline at end of file
......@@ -15,7 +15,7 @@
<div class="view-tool-sorts">
<div class="view-tool-sorts">
<#list dataview.getPSDEDataViewItems() as item>
<#if item.isEnableSort() && !item.getPSCodeList()??>
<#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>')">
......@@ -41,6 +41,20 @@
<#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
......
<#if view.hasPSControl('wizardpanel')>
<#assign wizardpanel = view.getPSControl('wizardpanel')>
<#assign view_content>
<div>暂不支持</div>
${P.getCtrlCode('wizardpanel', 'CONTROL.html').code}
</#assign>
</#if>
<#ibizinclude>
../@MACRO/VIEW_LAYOUT_BASE.ftl
</#ibizinclude>
\ No newline at end of file
......@@ -19,3 +19,7 @@
}
}
</#if>
.batch_btn{
display: flex;
justify-content: center;
}
\ No newline at end of file
......@@ -25,34 +25,38 @@
</#if>
</#list>
</div>
<div class="view-tool-searchform">
<!-- <span>过滤<ion-icon name="filter-outline"></ion-icon></span> -->
</div>
</div>
<div class="code-box" style="display:flex; overflow: auto;">
</ion-toolbar>
<div style="display:flex;overflow: auto;">
<#list mdctrl.getPSListItems() as item>
<#if item.isEnableSort() && item.getPSCodeList?? && item.getPSCodeList()??>
<#assign codelist = item.getPSCodeList()>
<#if codelist.getCodeListType() == 'STATIC' && codelist.getAllPSCodeItems()??>
<ion-item class="ibz-item">
<ion-label style="margin:0"><#if item.getCaption()??>${item.getCaption()}</#if></ion-label>
<ion-select name="<#if item.getName()??>n_${item.getName()?lower_case}_eq</#if>" style="padding: 3px;" @ionChange="setQueryparam" interface="popover">
<#list codelist.getAllPSCodeItems() as codeitem>
<ion-select-option value="<#if codeitem.getValue()??>${codeitem.getValue()}</#if>"><#if codeitem.getName()??>${codeitem.getName()}</#if></ion-select-option>
</#list>
</ion-select>
</ion-item>
<app-van-select name="<#if item.getName()??>n_${item.getName()?lower_case}_eq</#if>" title="<#if item.getCaption()??>${item.getCaption()}</#if>" :items="[<#list codelist.getAllPSCodeItems() as codeitem>{value:'<#if codeitem.getValue()??>${codeitem.getValue()}</#if>',label:'<#if codeitem.getName()??>${codeitem.getName()}</#if>'},</#list>]"></app-van-select>
</#if>
</#if>
</#list>
</div>
</ion-toolbar>
</#assign>
</#if>
</#if>
<#assign view_content>
${P.getCtrlCode('mdctrl', 'CONTROL.html').code}
</#assign>
<#assign view_footer>
<#if mdctrl.getBatchPSDEToolbar?? && mdctrl.getBatchPSDEToolbar()??>
<#assign batchToolbar = mdctrl.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
......
<#if view.hasPSControl('mdctrl')>
<#assign mdctrl = view.getPSControl('mdctrl')>
<#assign view_content>
${P.getCtrlCode('mdctrl', 'CONTROL.html').code}
</#assign>
<#assign view_footer>
<#if mdctrl.getBatchPSDEToolbar?? && mdctrl.getBatchPSDEToolbar()??>
<#assign batchToolbar = mdctrl.getBatchPSDEToolbar()>
<div v-show="showCheack" >
<@ibizindent blank=8>
${P.getCtrlCode(batchToolbar, 'CONTROL.html').code}
</@ibizindent>
</div>
</#if>
</#assign>
</#if>
<#ibizinclude>
../@MACRO/EMBED_VIEW_LAYOUT_BASE.ftl
......
<#ibizinclude>
../@MACRO/DEFAULT.less.ftl
</#ibizinclude>
.batch_btn{
display: flex;
justify-content: center;
}
\ No newline at end of file
<#if view.hasPSControl('calendar')>
<#assign calendar = view.getPSControl('calendar')>
<#assign view_content>
${P.getCtrlCode('calendar', 'CONTROL.html').code}
</#assign>
<#assign view_footer>
<#if calendar.getBatchPSDEToolbar?? && calendar.getBatchPSDEToolbar()??>
<#assign batchToolbar = calendar.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
......
此差异已折叠。
此差异已折叠。
此差异已折叠。
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册