提交 7d9f1aab 编写于 作者: tony001's avatar tony001

调整状态向导面板

上级 8c08f0ad
<template>
<layout class="app-wizard">
<#if ctrl.getPSDEWizard?? && ctrl.getPSDEWizard()?? && ctrl.getPSDEWizard().getPSDEWizardSteps?? && ctrl.getPSDEWizard().getPSDEWizardSteps()??>
<#if ctrl.getPSDEWizard?? && ctrl.getPSDEWizard()?? && ctrl.getPSDEWizard().getPSDEWizardSteps?? && ctrl.getPSDEWizard().getPSDEWizardSteps()??>
<el-steps class="wizard-steps" :active="wizardForms.indexOf(activeForm)" finish-status="success">
<#list ctrl.getPSDEWizard().getPSDEWizardSteps() as step>
<el-step title="${step.getTitle()}"></el-step>
<el-step>
<template v-slot:title>
<div v-popover:wizardpanel_form_FirstForm_popover>${step.getTitle()}</div>
</template>
</el-step>
</#list>
</el-steps>
</#if>
<i-content class="app-wizard-content">
<#if ctrl.getPSDEEditForms()??>
<#if ctrl.getPSDEEditForms()??>
<#list ctrl.getPSDEEditForms() as form>
<#assign handler = form.getPSAjaxControlHandler() />
<el-popover v-if="activeForm === '${form.getName()}'" ref="${form.getName()}_popover" popper-class="app-wizard-popover-container" placement="bottom-start" trigger="click">
<div class="app-wizard-container">
<div class="app-wizard-header">
<div class="app-wizard-header-extra">
<Icon type="md-open" size="18" @click="handleOPen"/>
<Icon type="md-close" size="18" @click="handleClose"/>
</div>
</div>
<div class="app-wizard-content">
<view_${form.getName()}
v-if="activeForm == '${form.getName()}'"
:key="'${form.name}'"
:viewState='wizardState'
:context="context"
......@@ -28,14 +38,17 @@
name='${form.name}'
ref='${form.name}'>
</view_${form.getName()}>
</div>
<div class="app-wizard-footer">
<i-button size="small" :disabled="isDisabled('PREV')" @click="onClickPrev()" type="primary">上一步</i-button>
<i-button size="small" :disabled="isDisabled('NEXT')" @click="onClickNext()" type="primary">下一步</i-button>
<i-button size="small" :disabled="isDisabled('FINISH')" @click="onClickFinish()" type="primary">完成</i-button>
</div>
</div>
</el-popover>
</#list>
</#if>
</i-content>
<footer class="app-wizard-footer">
<i-button :disabled="isDisabled('PREV')" @click="onClickPrev()" type="primary">上一步</i-button>
<i-button :disabled="isDisabled('NEXT')" @click="onClickNext()" type="primary">下一步</i-button>
<i-button :disabled="isDisabled('FINISH')" @click="onClickFinish()" type="primary">完成</i-button>
</footer>
</#if>
</#if>
</layout>
</template>
<#ibizinclude>
......@@ -308,6 +321,24 @@
}
}
/**
* 打开链接
*
* @memberof ${srfclassname('${ctrl.codeName}')}Base
*/
public handleOPen(){
console.log("open");
}
/**
* 关闭
*
* @memberof ${srfclassname('${ctrl.codeName}')}Base
*/
public handleClose(){
this.activeForm = "";
}
/**
* 获取下一步向导表单
*
......
......@@ -3,7 +3,6 @@
height: 100%;
.wizard-steps{
padding: 10px 50px;
border-bottom: 1px solid #ddd;
margin-bottom: 10px;
.el-step__head.is-process{
border-color: #7e8187;
......@@ -19,20 +18,35 @@
.el-step__title.is-success{
color: #1890ff;
}
.el-step__title:hover{
cursor: pointer;
}
}
}
.app-wizard-popover-container{
.app-wizard-container{
width: 100%;
.app-wizard-header{
width: 100%;
height: 22px;
line-height: 22px;
padding: 2px;
.app-wizard-header-extra{
float: right;
}
}
.app-wizard-content{
height: 100%;
overflow-y: auto;
width: 100%;
padding: 4px 0px;
}
.app-wizard-footer{
float: right;
>button{
margin-right: 6px;
}
.app-wizard-footer {
padding: 10px;
text-align: right;
.ivu-btn {
margin: 0 5px;
}
}
}
<#ibizinclude>
../@MACRO/CSS/DEFAULT.less.ftl
</#ibizinclude>
\ No newline at end of file
.el-popper[x-placement^=bottom] {
margin-top: 0px;
}
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册