fix(Step): active-color should effect circle (#6229)

* fix(Step): active-color should effect circle

* chore: improve line style
This commit is contained in:
neverland 2020-05-07 16:28:05 +08:00 committed by GitHub
parent 9eb88df562
commit 14530f3709
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -21,6 +21,14 @@ export default createComponent({
active() { active() {
return this.status === 'process'; return this.status === 'process';
}, },
lineStyle() {
if (this.status === 'finish' && this.parent.activeColor) {
return {
background: this.parent.activeColor,
};
}
},
}, },
methods: { methods: {
@ -47,7 +55,7 @@ export default createComponent({
); );
} }
return <i class={bem('circle')} />; return <i class={bem('circle')} style={this.lineStyle} />;
}, },
onClickStep() { onClickStep() {
@ -60,7 +68,6 @@ export default createComponent({
const { activeColor, direction } = this.parent; const { activeColor, direction } = this.parent;
const titleStyle = active && { color: activeColor }; const titleStyle = active && { color: activeColor };
const lineStyle = status === 'finish' && { background: activeColor };
return ( return (
<div class={[BORDER, bem([direction, { [status]: status }])]}> <div class={[BORDER, bem([direction, { [status]: status }])]}>
@ -74,7 +81,7 @@ export default createComponent({
<div class={bem('circle-container')} onClick={this.onClickStep}> <div class={bem('circle-container')} onClick={this.onClickStep}>
{this.genCircle()} {this.genCircle()}
</div> </div>
<div class={bem('line')} style={lineStyle} /> <div class={bem('line')} style={this.lineStyle} />
</div> </div>
); );
}, },