Zwavejs2mqtt: [feat] Rearrange table columns

[crxporter]

PR #407 added ability to show/hide columns, I really like that feature.

Can we get the ability to rearrange columns? Could be dragging left/right on the table or dragging up/down in this view:

I would like to put "Name" and "Location" columns to the far left on my screen, would be pretty cool if we could rearrange them as we like.

[robertsLando]

@ahochsteger Thoughts?

[ahochsteger]

@crxporter, @robertsLando, yes, this makes a lot of sense!

In fact I already considered it while implementing the column selection but I did not find an easy way to rearrange the checkboxes with drag'n'drop in vuetify (what I'd expect to be a provided feature).
I found some approaches but all that I found required you to implement a lot of UI code which causes increased maintenance on the zjs2m UI code.

The other problem I faced was that when I enable an item in the middle of the list the item gets appended out-of-the-box in the resulting array, so I also would have to do the array creation myself without relying on the vuetify model of the checkboxes. Another thing that adds to increased code :-/.

Any thoughts on which approach we can/should take to make this possible?

[robertsLando]

https://codepen.io/uglyhobbitfeet/pen/ExxaNGO @ahochsteger

[ahochsteger]

https://codepen.io/uglyhobbitfeet/pen/ExxaNGO @ahochsteger

Thanks, I already stumbled upon this one (and some others as well).
I just thought that using the columns array was a cleaner approach, since it is already persisted in the local storage and it could also fulfill the purpose of the column order as well.
It's just the problem that deactivating and activating columns does not preserve the order of the list when using v-model (e.g. checking a checkbox in the middle of the list always appends it to the end).
But I'll find a solution for it ...

[robertsLando]

Instead of re-arranging the columns directly we could make the sort happen on the columns menu, what do you think?

[robertsLando]

We could use: https://github.com/SortableJS/Vue.Draggable

Should be quite easy

[ahochsteger]

We could use: https://github.com/SortableJS/Vue.Draggable

Should be quite easy

Yep, looks good.
I can give it a try this evening.

[ahochsteger]

@robertsLando, @crxporter the feature is implemented in PR #534 - give it a try!

[crxporter]

This is very cool, @ahochsteger - excellent work. Thank you!