ahwgs / react-gantt Goto Github PK

View Code? Open in Web Editor NEW

79.0 2.0 29.0 2.76 MB

Gantt Component for React

Home Page: https://ahwgs.github.io/react-gantt/#/en-US

License: MIT License

JavaScript 2.04% TypeScript 85.94% Less 11.98% CSS 0.04%

gantt react component gantt-chart

react-gantt's Introduction

rc-gantt

React Gantt Component

English | 简体中文

WebSite

https://ahwgs.github.io/react-gantt/#/en-US

Quick Start

# Install Dependencies
$ yarn add rc-gantt

# Use

import RcGantt, { GanttProps, enUS } from 'rc-gantt'

const data = new Array(100).fill({
  name: 'Title',
  startDate: '2021-07-10',
  endDate: '2021-07-12',
  collapsed: false,
  children: [
    {
      startDate: '2021-07-10',
      endDate: '2021-07-12',
      name: 'TitleTitle',
      collapsed: false,
      content: '123123123',
    },
  ],
})

const App = () => {
  return (
    <div style={{ width: '100%', height: 500 }}>
      <RcGantt
        data={data}
        locale={enUS}
        columns={[
          {
            name: 'name',
            label: 'Title',
            width: 200,
            maxWidth: 200,
            minWidth: 200,
          },
        ]}
        onUpdate={async () => {
          return true
        }}
      />
    </div>
  )
}

ReactDOM.render(<App />, document.getElementById('root'))

Feedback

Please visit Github Or add WeChat, note rc-gantt

WeChat ID: JavaScript_97

react-gantt's People

Contributors

Stargazers

Watchers

react-gantt's Issues

When updating a row the whole Gantt reloads

Hey there, first of all great component. I have a question and issue to report.
When I drag and update an item/row's date it immediately jumps back to it's initial scroll position and closes or opens all collapsed sidebar items.

Question: is there any way to keep the current state and not move the Gantt view after each update.

Thanks

能否支持移动端左右滑动

在没有开始和结束时间时，在点击周一的情况下，下图中的起始时间会跨到周日，怎么解决下，求指教

@ahwgs

是否能允许自定义“小时图”“半小时图”“分钟图”

左侧隐藏table后再点击显示,样式错乱

左侧隐藏table后再点击显示,样式错乱, 如图:

在数据里设置disabled为true，甘特图仍然能够拖动

Multilple MobX instances – There are multiple, different versions of MobX active

I have a project where I am using this package, I also have mobx and mobx-react-lite packages in it:

"mobx": "^6.12.0",
"mobx-react-lite": "^4.0.5",

When I am trying to use RcGantt component I am getting this error in console:

rc-gantt.js?v=ce4c31c5:3737 Uncaught Error: [mobx] There are multiple, different versions of MobX active. Make sure MobX is loaded only once or use `configure({ isolateGlobalState: true })`

I've tried overriding rc-gantt mobx version in my package.json file like a so:

"overrides": {
  "mobx": "^6.12.0",
  "mobx-react-lite": "^4.0.5"
}

... and I've also tried configuring my project's mobx with this line isolateGlobalState: true. Nothing seems to work. Error still occures.

Although it seems to be working just fine for now I was wondering whether you could update your package's mobx and mobx-react-lite version. Or, at least, put isolateGlobalState: true in mobx configuration (issue).

Best regards 👋🏼