Vue-storefront: Add components for form inputs

Created on 7 Feb 2018  路  17Comments  路  Source: DivanteLtd/vue-storefront

Right now we have a mess in code in places where we use many inputs (Checkout, MyAccount, Login/Register). Also the styles are often duplicated.

We should create reusable components to replace existing inputs and checkboxes.
For input component there should be an option to optionally add validation, icon (show/hide password) and so on.

refactor

Most helpful comment

Maybe we could even mix FormInput and ValidationError components to one? Then just pass validation as optional prop to FormInput component? It may be too complicated but it'll be nice to try.

All 17 comments

@Aekal, You can assign me to this.

Sure, additionally, it'll be nice to remove #my_account and #checkout styles in pages/Checkout.vue and pages/MyAccount.vue and change styles scope there to <style lang="scss" scoped>. We have duplicated styles for inputs because of this.

@pkarw Could you assign PanMisza to this issue? I don't see him on the list.

@Aekal It's merged now ;)

@PanMisza it would be also wise to make validation errors a component (i've started it long ago, there is a validationError.vue file). Instead of adding multiple div's (or other actions) for different validation errors we can do it in one components and just pass the error messages here.

Maybe we could even mix FormInput and ValidationError components to one? Then just pass validation as optional prop to FormInput component? It may be too complicated but it'll be nice to try.

@Aekal very good idea!
@PanMisza will you take care of it?

@filrak
Yes, at the beginning of next week :)

@PanMisza great, thanks ;)

@PanMisza please do accept the github invitation to allow me to assign the task to you please :)

@PanMisza we do have release on 1st March; could you handle it before?

@pkarw
Sorry for delay... I'm currently changing my flat and have no time for this.
I can finish this task this weekend.

@PanMisza Great ;)

@PanMisza how the progress looks like for this one ?:)

@PanMisza any progress on that?

@Aekal any chance that you'll take care of this one maybe next week? It doesn't seem like any body is working on this :)

@pkarw Ok, I'll work on it

Was this page helpful?
0 / 5 - 0 ratings