Alfred-Skyblue / vue-draggable-plus

Universal Drag-and-Drop Component Supporting both Vue 3 and Vue 2
https://vue-draggable-plus.pages.dev/en/
MIT License
2.71k stars 106 forks source link

feat: check if element existed when move between groups #150

Open solarcellsky opened 1 week ago

solarcellsky commented 1 week ago

Sometimes we need to check the element existed when move element between groups. So i made this PR.

netlify[bot] commented 1 week ago

Deploy Preview for vue-draggable-plus ready!

Name Link
Latest commit 66200f0060bf58ec003f8595913bf36f920f2455
Latest deploy log https://app.netlify.com/sites/vue-draggable-plus/deploys/667d406691c6bb0008f339a5
Deploy Preview https://deploy-preview-150--vue-draggable-plus.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

solarcellsky commented 1 week ago

I modified onAdd and onRemove function, add an attribute 'existed' for element in onAdd function. In onRemove function check this attribute, if existed the element will not moved to 'to' target and will kept in 'from' target.

Alfred-Skyblue commented 1 week ago

Are you dealing with a case where an element needs to exist in multiple groups simultaneously?

solarcellsky commented 1 week ago

Are you dealing with a case where an element needs to exist in multiple groups simultaneously?

Yes. I have been working on a module about scheduling recently, which is divided into different shifts and shifts, and these plans may be repeated, but the dates are different, and most of the personnel say that the time is fixed, but they are on duty at different times and shifts, so there must be duplication, and my need is to adjust by dragging the list of these personnel. The whole schedule plan, this is my practical application scenario.

Alfred-Skyblue commented 1 week ago

Thank you for your PR

I don't think this is an issue that needs to be handled by vue-draggable-plus, because if my array elements are primitive types, for example:

const list1 = [1, 2, 3, 4];

const list2 = [2, 3, 4, 5];

Then it is very clear that 2, 3, and 4 are duplicates. However, dragging between groups is allowed. You can try using filter to disable the dragging of elements that already exist in list2, instead of prohibiting the dragging of identical elements between multiple lists.

solarcellsky commented 6 days ago

https://github.com/Alfred-Skyblue/vue-draggable-plus/assets/546897/e1e97d8d-c6f9-4e7b-9fbd-441022e5045b

There is a screen record to show how i use vue-draggable-plus. Maybe my needs are not common. Thank you for your patient reply.