How to off auto sorting after dropping an item from one column to another?

[vasiliypekhterev]

I want to avoid auto sorting, but can't find the way.
Could you help me with this issue?

Thank you in advance,
Vasyl

[BrockReece]

Hey Vasyl,

Sorry for the delay, its been a busy couple of weeks.
What do you mean by auto sorting?
What would be the desired outcome?

Cheers
Brock

[deep0410]

@BrockReece Once you drag and drop it auto sorts it based on id. Not considering where it was actually dropped. I believe that's what @vasiliypekhterev meant

[reppair]

@BrockReece same question here. How do we disable it so when the block is placed somewhere it stays there instead of being sorted by it's id? Can we reverse the ordering to desc instead? Or is there a way to specify the block property that should be used for ordering the block when dropped?

[BrockReece]

Hmm, yeah I see. I think this is because the parent is passing the blocks array back into the component after the change without any kind of sorting.

Is this a cosmetic issue or is it a functional issue (ie do we need to keep track of the order of the kanban blocks for prioritising?)

If this is a cosmetic issue, we could clone the blocks array in the parent component and pass that through as the prop so that when the initial blocks array is updated, Vue's reactivity won't trigger a reordering of the blocks.

https://codesandbox.io/s/9yy4vx132r

If it is a functional issue, I may have to have a bit more of a think about it.

[reppair]

Personally I think it will be best to have an option that specifies the default ordering if possible. In my case I use it for listing ordered products in different manufacturing processes.. It works fine this way too so more of a cosmetic issue in my case .. but it will be really cool if we can somehow tell the component to order the blocks by different prop of the blocks not the id..

[j4kim]

I had the same issue and forked the project to make it look more like what I needed:
https://github.com/j4kim/vue-kanban
Demo and readme up to date with my implementation.
Maybe it can help

[Valdas-Stonkus]

I 100% agree with @reppair. I have the same problem too and very need to make the items default order list by date for example.
@BrockReece do you have plan to resolve this issue?
Please, do it if you can.

[Valdas-Stonkus]

Finaly I made it byself. I sorted my items by activity data.

Change vue-kanban source code "node_modules/vuekanban/src/components/Kanban.vue":
57 line method to that

// MrStonkus personal change for sorting by activityDate
methods: {
getBlocks(status) {
const dateNow = new Date();

  let dealsUntilNow = this.localBlocks.filter(
    deal => deal.status === status && new Date(deal.activityDate) < dateNow
  );

  let dealsWithoutActivityDate = this.localBlocks.filter(
    deal => deal.status === status && !deal.activityDate
  );

  let dealsAfterNow = this.localBlocks.filter(
    deal => deal.status === status && new Date(deal.activityDate) > dateNow
  );

  const deals = [
    ...dealsUntilNow,
    ...dealsWithoutActivityDate,
    ...dealsAfterNow
  ];

  return deals.sort(function(a, b) {
    return (
      Number(new Date(a.activityDate)) - Number(new Date(b.activityDate))
    );
  });
}

},

my data
deals: [
{
id: 3,
status: "Įvesta",
title: "Antras",
activityDate: "2016-03-17T16:00:00.957Z",
isActivityDateAllDay: false
},
{
id: 2,
status: "Įvesta",
title: "Pirmas",
activityDate: "2015-03-17T08:58:09.957Z",
isActivityDateAllDay: false
}]