GithubHelp home page GithubHelp logo

Drag and Drop Issue about svelte-gantt HOT 19 CLOSED

anovokmet avatar anovokmet commented on July 23, 2024
Drag and Drop Issue

from svelte-gantt.

Comments (19)

ANovokmet avatar ANovokmet commented on July 23, 2024 1

@labs20 Thank you, seems the tasks are rounded to the UTC date, instead of the local one. I am using your exact configuration, and when droppings tasks they last from 02:00-02:00 instead of 00:00-00:00. I issued a fix when using moment. It will need fixing for when using the default adapter, possibly leveraging Date.prototype.getTimezoneOffset.

from svelte-gantt.

ANovokmet avatar ANovokmet commented on July 23, 2024

I face one issue when drag and drop new task,
when week view selected and drop new task at last week day then new task not plot exact drop time (position) instead plot few hours early.

I can verify there is a bug here, thanks for reporting.

also plot working fine starting week days, when you drop new task incremental day then it plot few hours ago and increase plot hours.

Can you elaborate more? What do you mean by incremental day and plot here? Increase plot hours? Does the gantt date range get changed?

from svelte-gantt.

nitish-darji avatar nitish-darji commented on July 23, 2024

thanks @ANovokmet for quick reply

when week view selected and you drop new task week first day (SUN) then it looks drop and plot time all most same when drop new task week second day (Mon) then drop and plot time differ, when drop new task next day and continue the time different between drop and plot increase.

Thanks

from svelte-gantt.

ANovokmet avatar ANovokmet commented on July 23, 2024

This should be fixed with version 4.0.2-beta now on npm

from svelte-gantt.

nitish-darji avatar nitish-darji commented on July 23, 2024

thanks @ANovokmet

I'm working on Angular@12 and upgrade [email protected]

one issue generated when build angular project then below error occur

image

node_modules/svelte-gantt/types/modules/table/tableHeader.ts file need to replace import from "src/core/row" with "../../core/row"

thanks again @ANovokmet

from svelte-gantt.

nitish-darji avatar nitish-darji commented on July 23, 2024

Also, when upgrade [email protected] version, there is one issue found as below

when day or week view selected at that time hour header not start with 0

image

before upgrade [email protected] version it's look as below image
image

look into into example https://anovokmet.github.io/svelte-gantt/tree

image

Thanks

from svelte-gantt.

ANovokmet avatar ANovokmet commented on July 23, 2024

Also, when upgrade [email protected] version, there is one issue found as below

when day or week view selected at that time hour header not start with 0

image

before upgrade [email protected] version it's look as below image image

look into into example https://anovokmet.github.io/svelte-gantt/tree

image

Thanks

Thanks for noticing the issue. I'll try to fix it.

from svelte-gantt.

ANovokmet avatar ANovokmet commented on July 23, 2024

Issues fixed in 4.0.3-beta. Thanks.

from svelte-gantt.

nitish-darji avatar nitish-darji commented on July 23, 2024

Thanks @ANovokmet

after upgrade [email protected] version

Drag and Drop Issue Resolve
Build Issue Resolve
But below issue not resolve

when day or week view selected at that time hour header not start with 0

image

before upgrade [email protected] version it's look as below image
image

look into into example https://anovokmet.github.io/svelte-gantt/tree

image

only header hours display wrong, it show based on time zone.
I use moment.
dateAdapter: new MomentSvelteGanttDateAdapter(moment),

Thanks again @ANovokmet

from svelte-gantt.

ANovokmet avatar ANovokmet commented on July 23, 2024

Which time zone are you in?

from svelte-gantt.

nitish-darji avatar nitish-darji commented on July 23, 2024

IST (India Standard Time)

from svelte-gantt.

ANovokmet avatar ANovokmet commented on July 23, 2024

Thanks, there are some issues with timezones since dropping moment. Will have to take them into account when calculating the hours.

from svelte-gantt.

nitish-darji avatar nitish-darji commented on July 23, 2024

Hello @ANovokmet

Any update regarding time zones issue,

Thanks

from svelte-gantt.

ANovokmet avatar ANovokmet commented on July 23, 2024

@nitish-darji sorry, working on it now

from svelte-gantt.

kevinleto-informaticon avatar kevinleto-informaticon commented on July 23, 2024

I've experienced this issue on the new versions v4.0.7-beta/v4.0.9-beta. Is there any update?
Thanks in advance!

from svelte-gantt.

labs20 avatar labs20 commented on July 23, 2024

Please, having the same issue here. Any workarouds?

from svelte-gantt.

V-Py avatar V-Py commented on July 23, 2024

Can you describe your problem in details ? And which timezone ? Thanks

from svelte-gantt.

labs20 avatar labs20 commented on July 23, 2024

Hi. Thanks for your attention.

Timezone -3 (pt-BR)

In the example below, I've dragged a task that was set on the gant beggining at 2022-10-17 and ending at 2022-10-19.

I have:

                    columnUnit: 'day',
                    columnOffset: 1,
                    magnetUnit: 'day',
                    magnetOffset: 1,
                   ...

So at the gantt, the task seems to start at 00:00hs of 2022-10-17 until 23:59 of 2022-10-19.

But as I drag it one day back, to 2022-10-16, this is what I got:

this.gantt.api.tasks.on.changed(async ([ev]) => {

                // ev.task.model=> from: 1665964800000, to: 1666224000000
                // Cast do date:
                //  new Date(ev.task.model.from).toISOString()    => '2022-10-17T00:00:00.000Z'
                //  new Date(ev.task.model.from).toDateString()  => 'Sun Oct 16 2022' (timestamp here is '21:00:00 GMT-0300'
                // I've lost the timezone here

                // And look whats happening with model.to
                // Cast do date:
                //  new Date(ev.task.model.to).toISOString()    => '2022-10-20T00:00:00.000Z'
                //  new Date(ev.task.model.from).toDateString()  => 'Wed Oct 19 2022' (timestamp here is '21:00:00 GMT-0300'
            

                if (ev) {
                    let i = new Date(ev.task.model.from)
                        , f =new Date(ev.task.model.to)
                    ;

                    // Have to force things here
                    i.setHours(0, 0, 0);
                    f.setHours(23, 23, 59);
                    f.setDate(f.getDate() - 1);

                    this.data_to_server = {
                        id      : ev.task.model.id,
                        inicio  : i.toISOString(),
                        fim     : f.toISOString(),
                        to_id   : ev.sourceRow.model.id !== ev.targetRow.model.id ? ev.targetRow.model.id : undefined
                    };

                    this.touched = true;
                    this.force_event = true;
                    await this.checkCompEvents();
                    this.rodou_comp_event = false;
                }
            });

Hope the details help.

from svelte-gantt.

labs20 avatar labs20 commented on July 23, 2024

My gantt config:

this.gantt = new SvelteGantt({
                target: this.$refs.gantt.$el,
                props: {
                    dateAdapter: new MomentSvelteGanttDateAdapter(moment),
                    from: this.inicio,
                    to: this.final,

                    rows: rows,
                    tasks: tasks,
                    dependences: dependences,
                    timeRanges: ranges,

                    reflectOnParentRows: false,
                    reflectOnChildRows: false,

                    highlightWeekends: false,

                    zoomLevels: [],

                    columnUnit: 'day',
                    columnOffset: 1,

                    magnetUnit: 'day',
                    magnetOffset: 1,

                    rowHeight: 28,
                    rowPadding: 2,

                    fitWidth: true,
                    minWidth: 2000,

                    tableWidth: this.header_width,
                    tableHeaders: headers,
                    headers: [{ unit: 'day', format: 'MMMM YYYY', offset: 7 }, { unit: 'day', format: ' DD ddd' }],

                    ganttTableModules: [SvelteGanttTable],
                    ganttBodyModules: [SvelteGanttDependencies]
                }
            });

from svelte-gantt.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.