chore: Wizard组件在第一步时可以隐藏默认prev按钮,按钮数据域支持currentStep

This commit is contained in:
lurunze1226 2023-10-24 14:24:05 +08:00
parent 5d89128ed9
commit 8a4b97d0c0
3 changed files with 21 additions and 60 deletions

View File

@ -57,7 +57,14 @@ order: 73
## 自定义按钮
可以在每个 `step` 中配置 `actions` 来自定义按钮。
可以在每个 `step` 中配置 `actions` 来自定义按钮。按钮所在数据域查看`WizardActionData`定义(`3.5.0`及以上版本支持)
```typescript
interface WizardActionData {
/* 当前步骤数值从1开始 */
currentStep: number;
}
```
```schema: scope="body"
{
@ -78,6 +85,12 @@ order: 73
}
],
actions: [
{
"label": "Prev",
"type": "button",
"actionType": "prev",
"disabledOn": "${currentStep === 1}"
},
{
label: "Next",
type: 'button',
@ -100,7 +113,6 @@ order: 73
type: 'button',
actionType: 'prev'
},
{
label: "Submit",
type: 'button',

View File

@ -385,14 +385,6 @@ exports[`Renderer:Wizard actionPrevLabel actionNextLabel actionFinishLabel class
class="cxd-Wizard-footer cxd-Panel-footer"
role="wizard-footer"
>
<div
class="cxd-Button cxd-Button--default cxd-Button--size-default is-disabled btn-lg btn-primary"
disabled=""
>
<span>
PrevStep
</span>
</div>
<button
class="cxd-Button cxd-Button--primary cxd-Button--size-default btn-lg btn-primary"
type="button"
@ -815,14 +807,6 @@ exports[`Renderer:Wizard dialog 1`] = `
class="cxd-Wizard-footer cxd-Panel-footer"
role="wizard-footer"
>
<div
class="cxd-Button cxd-Button--default cxd-Button--size-default is-disabled"
disabled=""
>
<span>
上一步
</span>
</div>
<button
class="cxd-Button cxd-Button--primary cxd-Button--size-default"
type="button"
@ -1202,14 +1186,6 @@ exports[`Renderer:Wizard dialog 2`] = `
class="cxd-Wizard-footer cxd-Panel-footer"
role="wizard-footer"
>
<div
class="cxd-Button cxd-Button--default cxd-Button--size-default is-disabled"
disabled=""
>
<span>
上一步
</span>
</div>
<button
class="cxd-Button cxd-Button--primary cxd-Button--size-default"
type="button"
@ -1512,14 +1488,6 @@ exports[`Renderer:Wizard initApi default 1`] = `
class="cxd-Wizard-footer cxd-Panel-footer"
role="wizard-footer"
>
<div
class="cxd-Button cxd-Button--default cxd-Button--size-default is-disabled"
disabled=""
>
<span>
上一步
</span>
</div>
<button
class="cxd-Button cxd-Button--primary cxd-Button--size-default"
type="button"
@ -1789,14 +1757,6 @@ exports[`Renderer:Wizard initApi reload 1`] = `
class="cxd-Wizard-footer cxd-Panel-footer"
role="wizard-footer"
>
<div
class="cxd-Button cxd-Button--default cxd-Button--size-default is-disabled"
disabled=""
>
<span>
上一步
</span>
</div>
<button
class="cxd-Button cxd-Button--primary cxd-Button--size-default"
type="button"
@ -2593,14 +2553,6 @@ exports[`Renderer:Wizard initApi show loading 2`] = `
class="cxd-Wizard-footer cxd-Panel-footer"
role="wizard-footer"
>
<div
class="cxd-Button cxd-Button--default cxd-Button--size-default is-disabled"
disabled=""
>
<span>
上一步
</span>
</div>
<button
class="cxd-Button cxd-Button--primary cxd-Button--size-default"
type="button"
@ -3912,14 +3864,6 @@ exports[`Renderer:Wizard validate 1`] = `
class="cxd-Wizard-footer cxd-Panel-footer"
role="wizard-footer"
>
<div
class="cxd-Button cxd-Button--default cxd-Button--size-default is-disabled"
disabled=""
>
<span>
上一步
</span>
</div>
<button
class="cxd-Button cxd-Button--primary cxd-Button--size-default"
type="button"

View File

@ -1117,6 +1117,9 @@ export default class Wizard extends React.Component<WizardProps, WizardState> {
{step.actions.map((action, index) =>
render(`action/${index}`, action, {
key: index,
data: createObject(this.props.data, {
currentStep: currentStepIndex
}),
onAction: this.handleAction,
disabled:
action.disabled ||
@ -1140,11 +1143,13 @@ export default class Wizard extends React.Component<WizardProps, WizardState> {
type: 'button',
label: __(actionPrevLabel),
actionType: 'prev',
className: actionClassName
className: actionClassName,
hiddenOn: '${currentStep === 1}'
},
{
disabled: waiting || !prevCanJump || disabled,
onAction: this.handleAction
onAction: this.handleAction,
data: createObject(this.props.data, {currentStep: currentStepIndex})
}
)}