react-big-schedule 4.4.4 → 4.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +21 -21
- package/package.json +24 -21
- package/dist/components/AddMore.js +0 -41
- package/dist/components/AddMorePopover.js +0 -98
- package/dist/components/AgendaEventItem.js +0 -77
- package/dist/components/AgendaResourceEvents.js +0 -80
- package/dist/components/AgendaView.js +0 -44
- package/dist/components/BodyView.js +0 -50
- package/dist/components/DnDContext.js +0 -157
- package/dist/components/DnDSource.js +0 -110
- package/dist/components/EventItem.js +0 -692
- package/dist/components/EventItemPopover.js +0 -125
- package/dist/components/HeaderView.js +0 -102
- package/dist/components/ResourceEvents.js +0 -401
- package/dist/components/ResourceView.js +0 -105
- package/dist/components/SchedulerData.js +0 -1232
- package/dist/components/SchedulerHeader.js +0 -150
- package/dist/components/SelectedArea.js +0 -25
- package/dist/components/Summary.js +0 -52
- package/dist/components/WrapperFun.js +0 -11
- package/dist/components/index.js +0 -510
- package/dist/config/default.js +0 -30
- package/dist/config/scheduler.js +0 -102
- package/dist/css/style.css +0 -257
- package/dist/helper/behaviors.js +0 -97
- package/dist/helper/utility.js +0 -16
- package/dist/index.d.ts +0 -378
- package/dist/index.js +0 -1
- package/dist/sample-data/sample1.js +0 -331
package/README.md
CHANGED
|
@@ -5,11 +5,11 @@
|
|
|
5
5
|
[npm-image]: http://img.shields.io/npm/v/react-big-schedule.svg
|
|
6
6
|
[npm-url]: http://npmjs.org/package/react-big-schedule
|
|
7
7
|
[mit-image]: https://img.shields.io/badge/License-MIT-green.svg
|
|
8
|
-
[mit-url]: https://github.com/
|
|
9
|
-
[codeql-image]: https://github.com/
|
|
10
|
-
[codeql-url]: https://github.com/
|
|
11
|
-
[codeFactor-badge]: https://www.codefactor.io/repository/github/
|
|
12
|
-
[codeFactor-link]: https://www.codefactor.io/repository/github/
|
|
8
|
+
[mit-url]: https://github.com/ansulagrawal/react-big-schedule/blob/master/LICENSE
|
|
9
|
+
[codeql-image]: https://github.com/ansulagrawal/react-big-schedule/actions/workflows/github-code-scanning/codeql/badge.svg?branch=master
|
|
10
|
+
[codeql-url]: https://github.com/ansulagrawal/react-big-schedule/actions/workflows/github-code-scanning/codeql
|
|
11
|
+
[codeFactor-badge]: https://www.codefactor.io/repository/github/ansulagrawal/react-big-schedule/badge
|
|
12
|
+
[codeFactor-link]: https://www.codefactor.io/repository/github/ansulagrawal/react-big-schedule
|
|
13
13
|
|
|
14
14
|
React Big Schedule is a powerful and intuitive scheduler and resource planning solution built with React. Seamlessly integrate this modern, browser-compatible component into your applications to effectively manage time, appointments, and resources. With drag-and-drop functionality, interactive UI, and granular views, react-big-schedule empowers users to effortlessly schedule and allocate resources with precision.
|
|
15
15
|
|
|
@@ -63,11 +63,11 @@ Please ensure that your code adheres to the project's coding conventions and inc
|
|
|
63
63
|
|
|
64
64
|
## License
|
|
65
65
|
|
|
66
|
-
React Big Schedule is released under the MIT License. See the [LICENSE](https://github.com/
|
|
66
|
+
React Big Schedule is released under the MIT License. See the [LICENSE](https://github.com/ansulagrawal/react-big-schedule/blob/master/LICENSE) file for more details.
|
|
67
67
|
|
|
68
68
|
## Support
|
|
69
69
|
|
|
70
|
-
If you have any questions or need support, please create an issue in the [GitHub repository](https://github.com/
|
|
70
|
+
If you have any questions or need support, please create an issue in the [GitHub repository](https://github.com/ansulagrawal/react-big-schedule/issues).
|
|
71
71
|
|
|
72
72
|
## Credits
|
|
73
73
|
|
|
@@ -99,7 +99,7 @@ We are continuously working on enhancing react-big-schedule and welcome your fee
|
|
|
99
99
|
|
|
100
100
|
## Changelog
|
|
101
101
|
|
|
102
|
-
Please refer to the [CHANGELOG.md](https://github.com/
|
|
102
|
+
Please refer to the [CHANGELOG.md](https://github.com/ansulagrawal/react-big-schedule/blob/master/CHANGELOG.md) file.
|
|
103
103
|
|
|
104
104
|
## Use and Setup
|
|
105
105
|
|
|
@@ -241,10 +241,10 @@ constructor(date=dayjs().format(DATE_FORMAT), viewType = ViewType.Week,
|
|
|
241
241
|
`groupName` property to every event object, so that the events having the same `groupId` will belong to the same big task and
|
|
242
242
|
be rendered in the same slot in task view. If `groupId` and `groupName` are not provided, SchedulerData will take
|
|
243
243
|
the `id` as the `groupId`, and take the `title` as the `groupName`. See the `eventsForTaskView` in the
|
|
244
|
-
[sample1.js](https://github.com/
|
|
245
|
-
- `newConfig` is a config object, used to override the [default config](https://github.com/
|
|
244
|
+
[sample1.js](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/sample-data/sample1.js) for details.
|
|
245
|
+
- `newConfig` is a config object, used to override the [default config](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/config/scheduler.js)
|
|
246
246
|
fully or partly.
|
|
247
|
-
- `newBehaviors` is a config object, used to override the [default behaviors](https://github.com/
|
|
247
|
+
- `newBehaviors` is a config object, used to override the [default behaviors](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/helper/behaviors.js)
|
|
248
248
|
fully or partly.
|
|
249
249
|
- `localeDayjs` is a locale dayjs object, which is unified used in react-big-scheduler. If not provided, Scheduler will come
|
|
250
250
|
with English(en, United States) locale strings.
|
|
@@ -294,7 +294,7 @@ setResources(resources);
|
|
|
294
294
|
```
|
|
295
295
|
|
|
296
296
|
Used to set the resources(the slots in resource view), make sure that there are no duplicated `resource.id` in the `resources`.
|
|
297
|
-
See the demo `resources` in the [sample1.js](https://github.com/
|
|
297
|
+
See the demo `resources` in the [sample1.js](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/sample-data/sample1.js).
|
|
298
298
|
|
|
299
299
|
#### setEvents
|
|
300
300
|
|
|
@@ -303,9 +303,9 @@ setEvents(events);
|
|
|
303
303
|
```
|
|
304
304
|
|
|
305
305
|
Used to set the events. the event array should be sorted in ascending order by event.start property.
|
|
306
|
-
See the demo `events` in the [sample1.js](https://github.com/
|
|
306
|
+
See the demo `events` in the [sample1.js](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/sample-data/sample1.js).
|
|
307
307
|
If we use the task view, we'd better add the `groupId` and the `groupName` property to each event object, see the
|
|
308
|
-
`eventsForTaskView` in the [sample1.js](https://github.com/
|
|
308
|
+
`eventsForTaskView` in the [sample1.js](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/sample-data/sample1.js) for details.
|
|
309
309
|
|
|
310
310
|
#### prev
|
|
311
311
|
|
|
@@ -544,9 +544,9 @@ The locale string of non-agenda view cell header format of other view types.
|
|
|
544
544
|
|
|
545
545
|
#### SchedulerData.behaviors.getDateLabelFunc
|
|
546
546
|
|
|
547
|
-
Used to resolve the locale string of date label of Scheduler component.(Refer to the [getDateLabel](https://github.com/
|
|
547
|
+
Used to resolve the locale string of date label of Scheduler component.(Refer to the [getDateLabel](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/helper/behaviors.js) func for example)
|
|
548
548
|
|
|
549
|
-
### SchedulerData.config(See the [config file](https://github.com/
|
|
549
|
+
### SchedulerData.config(See the [config file](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/config/scheduler.js) for details.)
|
|
550
550
|
|
|
551
551
|
#### schedulerWidth
|
|
552
552
|
|
|
@@ -626,7 +626,7 @@ Selected cells color in resource view and task view, cells are selectable only w
|
|
|
626
626
|
#### nonWorkingTimeHeadColor
|
|
627
627
|
|
|
628
628
|
Color of non-working time head cells. Modify `SchedulerData.behaviors.isNonWorkingTimeFunc` to re-define non-working time.
|
|
629
|
-
Refer the `isNonWorkingTime` func in the [behaviors.js](https://github.com/
|
|
629
|
+
Refer the `isNonWorkingTime` func in the [behaviors.js](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/helper/behaviors.js).
|
|
630
630
|
|
|
631
631
|
#### nonWorkingTimeHeadBgColor
|
|
632
632
|
|
|
@@ -639,7 +639,7 @@ Background color of non-working time body cells.
|
|
|
639
639
|
#### summaryColor
|
|
640
640
|
|
|
641
641
|
Color of cell summary. Modify `SchedulerData.behaviors.getSummaryFunc` to display summary in a cell.
|
|
642
|
-
Refer the `getSummary` func in the [behaviors.js](https://github.com/
|
|
642
|
+
Refer the `getSummary` func in the [behaviors.js](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/helper/behaviors.js).
|
|
643
643
|
|
|
644
644
|
#### summaryPos
|
|
645
645
|
|
|
@@ -739,9 +739,9 @@ Array of view that Scheduler will support.
|
|
|
739
739
|
|
|
740
740
|
#### dragAndDropEnabled
|
|
741
741
|
|
|
742
|
-
Controls whether the dragAndDrop funcionality is enabled. If false there's no need for the [withDnDContext wrapper function](https://github.com/
|
|
742
|
+
Controls whether the dragAndDrop funcionality is enabled. If false there's no need for the [withDnDContext wrapper function](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/components/WrapperFun.jsx).
|
|
743
743
|
|
|
744
|
-
### SchedulerData.behaviors(See the [behaviors.js](https://github.com/
|
|
744
|
+
### SchedulerData.behaviors(See the [behaviors.js](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/helper/behaviors.js) for details.)
|
|
745
745
|
|
|
746
746
|
#### getEventTextFunc
|
|
747
747
|
|
|
@@ -991,7 +991,7 @@ to [this example](https://stephenchou1017.github.io/scheduler/#/resourceclickabl
|
|
|
991
991
|
dndSources: PropTypes.array;
|
|
992
992
|
```
|
|
993
993
|
|
|
994
|
-
DnDSource array that registered to Scheduler. Use [DnDSource](https://github.com/
|
|
994
|
+
DnDSource array that registered to Scheduler. Use [DnDSource](https://github.com/ansulagrawal/react-big-schedule/blob/master/src/components/DnDSource.js),
|
|
995
995
|
we can simplify the drag and drop coding in React-Big-Scheduler. Refer
|
|
996
996
|
to [this example](https://stephenchou1017.github.io/scheduler/#/draganddrop).
|
|
997
997
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-big-schedule",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.5.0",
|
|
4
4
|
"description": "React Big Schedule is a powerful and intuitive scheduler and resource planning solution built with React. Seamlessly integrate this modern browser-compatible component into your applications to effectively manage time, appointments, and resources. With drag-and-drop functionality, interactive UI, and granular views, react-big-schedule empowers users to effortlessly schedule and allocate resources with precision. Enhance productivity and streamline your workflow with this React-based solution, designed to optimize time management and simplify calendar-based operations. Perfect for applications requiring advanced scheduling capabilities, react-big-schedule offers a seamless and intuitive experience for managing appointments, resource allocation, and time slots. Unlock the potential of your React projects with react-big-schedule and revolutionize the way you handle scheduling and resource planning. It is the updated version of react-big-scheduler",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react-big-schedule",
|
|
@@ -39,56 +39,59 @@
|
|
|
39
39
|
"README.md",
|
|
40
40
|
"License"
|
|
41
41
|
],
|
|
42
|
-
"type": "module",
|
|
43
42
|
"main": "dist/index.js",
|
|
44
43
|
"homepage": "https://react-big-schedule.vercel.app",
|
|
45
44
|
"repository": {
|
|
46
45
|
"type": "git",
|
|
47
|
-
"url": "https://github.com/
|
|
46
|
+
"url": "https://github.com/ansulagrawal/react-big-schedule"
|
|
48
47
|
},
|
|
49
48
|
"bugs": {
|
|
50
|
-
"url": "https://github.com/
|
|
49
|
+
"url": "https://github.com/ansulagrawal/react-big-schedule/issues"
|
|
51
50
|
},
|
|
52
51
|
"publishConfig": {
|
|
53
52
|
"registry": "https://registry.npmjs.org/"
|
|
54
53
|
},
|
|
55
54
|
"scripts": {
|
|
56
|
-
"
|
|
57
|
-
"build": "
|
|
58
|
-
"build
|
|
59
|
-
"clean": "rimraf
|
|
60
|
-
"lint": "eslint ./src"
|
|
55
|
+
"dev": "webpack serve --open",
|
|
56
|
+
"build": "webpack --mode production",
|
|
57
|
+
"build:lib": "node scripts/build.js",
|
|
58
|
+
"clean": "npx rimraf dist",
|
|
59
|
+
"lint": "eslint ./src",
|
|
60
|
+
"lint:fix": "eslint ./src/**/*.{js,jsx} --fix"
|
|
61
61
|
},
|
|
62
62
|
"dependencies": {
|
|
63
63
|
"@ant-design/icons": "^5.5.1",
|
|
64
|
-
"
|
|
65
|
-
"antd": "^5.21.3",
|
|
64
|
+
"antd": "^5.22.1",
|
|
66
65
|
"dayjs": "^1.11.13",
|
|
67
66
|
"prop-types": "^15.8.1",
|
|
68
67
|
"react": "^18.3.1",
|
|
69
68
|
"react-dnd": "^14.0.5",
|
|
70
69
|
"react-dnd-html5-backend": "^14.1.0",
|
|
71
70
|
"react-dom": "^18.3.1",
|
|
72
|
-
"react-router-dom": "^
|
|
71
|
+
"react-router-dom": "^7.0.1",
|
|
73
72
|
"rrule": "^2.8.1"
|
|
74
73
|
},
|
|
75
74
|
"devDependencies": {
|
|
76
|
-
"@babel/
|
|
77
|
-
"@babel/
|
|
75
|
+
"@babel/cli": "^7.25.7",
|
|
76
|
+
"@babel/core": "^7.25.7",
|
|
77
|
+
"@babel/eslint-parser": "^7.25.7",
|
|
78
|
+
"@babel/preset-env": "^7.25.7",
|
|
78
79
|
"@babel/preset-react": "^7.25.7",
|
|
79
|
-
"
|
|
80
|
-
"
|
|
81
|
-
"
|
|
82
|
-
"@vitejs/plugin-react": "^4.3.2",
|
|
83
|
-
"babel-plugin-transform-runtime": "^6.23.0",
|
|
80
|
+
"babel-loader": "^9.2.1",
|
|
81
|
+
"copy-webpack-plugin": "^12.0.2",
|
|
82
|
+
"css-loader": "^7.1.2",
|
|
84
83
|
"eslint": "^8.2.0",
|
|
85
84
|
"eslint-config-airbnb": "^19.0.4",
|
|
86
85
|
"eslint-plugin-import": "^2.31.0",
|
|
87
86
|
"eslint-plugin-jsx-a11y": "^6.10.0",
|
|
88
87
|
"eslint-plugin-react": "^7.37.1",
|
|
89
88
|
"eslint-plugin-react-hooks": "^4.6.2",
|
|
89
|
+
"eslint-webpack-plugin": "^4.2.0",
|
|
90
90
|
"fs-extra": "^11.2.0",
|
|
91
|
-
"
|
|
92
|
-
"
|
|
91
|
+
"html-webpack-plugin": "^5.6.0",
|
|
92
|
+
"style-loader": "^4.0.0",
|
|
93
|
+
"webpack": "^5.95.0",
|
|
94
|
+
"webpack-cli": "^5.1.4",
|
|
95
|
+
"webpack-dev-server": "^5.1.0"
|
|
93
96
|
}
|
|
94
97
|
}
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import PropTypes from 'prop-types';
|
|
3
|
-
function AddMore(_ref) {
|
|
4
|
-
var schedulerData = _ref.schedulerData,
|
|
5
|
-
number = _ref.number,
|
|
6
|
-
left = _ref.left,
|
|
7
|
-
width = _ref.width,
|
|
8
|
-
top = _ref.top,
|
|
9
|
-
clickAction = _ref.clickAction,
|
|
10
|
-
headerItem = _ref.headerItem;
|
|
11
|
-
var config = schedulerData.config;
|
|
12
|
-
var content = "+".concat(number, " more");
|
|
13
|
-
return /*#__PURE__*/React.createElement("button", {
|
|
14
|
-
type: "button",
|
|
15
|
-
className: "timeline-event",
|
|
16
|
-
style: {
|
|
17
|
-
left: left,
|
|
18
|
-
width: width,
|
|
19
|
-
top: top
|
|
20
|
-
},
|
|
21
|
-
onClick: function onClick() {
|
|
22
|
-
return clickAction(headerItem);
|
|
23
|
-
}
|
|
24
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
25
|
-
style: {
|
|
26
|
-
height: config.eventItemHeight,
|
|
27
|
-
color: '#999',
|
|
28
|
-
textAlign: 'center'
|
|
29
|
-
}
|
|
30
|
-
}, content));
|
|
31
|
-
}
|
|
32
|
-
AddMore.propTypes = {
|
|
33
|
-
schedulerData: PropTypes.object.isRequired,
|
|
34
|
-
number: PropTypes.number.isRequired,
|
|
35
|
-
left: PropTypes.number.isRequired,
|
|
36
|
-
width: PropTypes.number.isRequired,
|
|
37
|
-
top: PropTypes.number.isRequired,
|
|
38
|
-
clickAction: PropTypes.func.isRequired,
|
|
39
|
-
headerItem: PropTypes.object.isRequired
|
|
40
|
-
};
|
|
41
|
-
export default AddMore;
|
|
@@ -1,98 +0,0 @@
|
|
|
1
|
-
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
2
|
-
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
3
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
-
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
5
|
-
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
6
|
-
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
7
|
-
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
8
|
-
import React, { useState } from 'react';
|
|
9
|
-
import PropTypes from 'prop-types';
|
|
10
|
-
import { Col, Row } from 'antd';
|
|
11
|
-
import { CloseOutlined } from '@ant-design/icons';
|
|
12
|
-
import EventItem from './EventItem';
|
|
13
|
-
import DnDSource from './DnDSource';
|
|
14
|
-
function AddMorePopover(props) {
|
|
15
|
-
var schedulerData = props.schedulerData,
|
|
16
|
-
headerItem = props.headerItem,
|
|
17
|
-
left = props.left,
|
|
18
|
-
top = props.top,
|
|
19
|
-
height = props.height,
|
|
20
|
-
closeAction = props.closeAction;
|
|
21
|
-
var config = schedulerData.config,
|
|
22
|
-
localeDayjs = schedulerData.localeDayjs;
|
|
23
|
-
var time = headerItem.time,
|
|
24
|
-
start = headerItem.start,
|
|
25
|
-
end = headerItem.end,
|
|
26
|
-
events = headerItem.events;
|
|
27
|
-
var _useState = useState(new DnDSource(function (p) {
|
|
28
|
-
return p.eventItem;
|
|
29
|
-
}, EventItem, schedulerData.config.dragAndDropEnabled)),
|
|
30
|
-
_useState2 = _slicedToArray(_useState, 1),
|
|
31
|
-
dndSource = _useState2[0];
|
|
32
|
-
var header = localeDayjs(new Date(time)).format(config.addMorePopoverHeaderFormat);
|
|
33
|
-
var durationStart = localeDayjs(new Date(start));
|
|
34
|
-
var durationEnd = localeDayjs(end);
|
|
35
|
-
var DnDEventItem = dndSource.getDragSource();
|
|
36
|
-
var eventList = events.map(function (evt, i) {
|
|
37
|
-
if (evt !== undefined) {
|
|
38
|
-
var eventStart = localeDayjs(evt.eventItem.start);
|
|
39
|
-
var eventEnd = localeDayjs(evt.eventItem.end);
|
|
40
|
-
var isStart = eventStart >= durationStart;
|
|
41
|
-
var isEnd = eventEnd < durationEnd;
|
|
42
|
-
var eventItemTop = 12 + (i + 1) * config.eventItemLineHeight;
|
|
43
|
-
return /*#__PURE__*/React.createElement(DnDEventItem, _extends({}, props, {
|
|
44
|
-
key: evt.eventItem.id,
|
|
45
|
-
eventItem: evt.eventItem,
|
|
46
|
-
leftIndex: 0,
|
|
47
|
-
isInPopover: true,
|
|
48
|
-
isStart: isStart,
|
|
49
|
-
isEnd: isEnd,
|
|
50
|
-
rightIndex: 1,
|
|
51
|
-
left: 10,
|
|
52
|
-
width: 138,
|
|
53
|
-
top: eventItemTop
|
|
54
|
-
}));
|
|
55
|
-
}
|
|
56
|
-
return null;
|
|
57
|
-
});
|
|
58
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
59
|
-
className: "add-more-popover-overlay",
|
|
60
|
-
style: {
|
|
61
|
-
left: left,
|
|
62
|
-
top: top,
|
|
63
|
-
height: height,
|
|
64
|
-
width: '170px'
|
|
65
|
-
}
|
|
66
|
-
}, /*#__PURE__*/React.createElement(Row, {
|
|
67
|
-
justify: "space-between",
|
|
68
|
-
align: "middle"
|
|
69
|
-
}, /*#__PURE__*/React.createElement(Col, {
|
|
70
|
-
span: 22
|
|
71
|
-
}, /*#__PURE__*/React.createElement("span", {
|
|
72
|
-
className: "base-text"
|
|
73
|
-
}, header)), /*#__PURE__*/React.createElement(Col, {
|
|
74
|
-
span: 2
|
|
75
|
-
}, /*#__PURE__*/React.createElement("button", {
|
|
76
|
-
type: "button",
|
|
77
|
-
onClick: function onClick() {
|
|
78
|
-
return closeAction(undefined);
|
|
79
|
-
}
|
|
80
|
-
}, /*#__PURE__*/React.createElement(CloseOutlined, null)))), eventList === null || eventList === void 0 ? void 0 : eventList.filter(Boolean));
|
|
81
|
-
}
|
|
82
|
-
AddMorePopover.propTypes = {
|
|
83
|
-
schedulerData: PropTypes.object.isRequired,
|
|
84
|
-
headerItem: PropTypes.object.isRequired,
|
|
85
|
-
left: PropTypes.number.isRequired,
|
|
86
|
-
top: PropTypes.number.isRequired,
|
|
87
|
-
height: PropTypes.number.isRequired,
|
|
88
|
-
closeAction: PropTypes.func.isRequired,
|
|
89
|
-
subtitleGetter: PropTypes.func,
|
|
90
|
-
moveEvent: PropTypes.func,
|
|
91
|
-
eventItemClick: PropTypes.func,
|
|
92
|
-
viewEventClick: PropTypes.func,
|
|
93
|
-
viewEventText: PropTypes.string,
|
|
94
|
-
viewEvent2Click: PropTypes.func,
|
|
95
|
-
viewEvent2Text: PropTypes.string,
|
|
96
|
-
eventItemTemplateResolver: PropTypes.func
|
|
97
|
-
};
|
|
98
|
-
export default AddMorePopover;
|
|
@@ -1,77 +0,0 @@
|
|
|
1
|
-
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
|
-
import { Popover } from 'antd';
|
|
5
|
-
import EventItemPopover from './EventItemPopover';
|
|
6
|
-
function AgendaEventItem(props) {
|
|
7
|
-
var eventItem = props.eventItem,
|
|
8
|
-
isStart = props.isStart,
|
|
9
|
-
isEnd = props.isEnd,
|
|
10
|
-
eventItemClick = props.eventItemClick,
|
|
11
|
-
schedulerData = props.schedulerData,
|
|
12
|
-
eventItemTemplateResolver = props.eventItemTemplateResolver;
|
|
13
|
-
var config = schedulerData.config,
|
|
14
|
-
behaviors = schedulerData.behaviors;
|
|
15
|
-
var roundCls = 'round-none';
|
|
16
|
-
if (isStart && isEnd) {
|
|
17
|
-
roundCls = 'round-all';
|
|
18
|
-
} else if (isStart) {
|
|
19
|
-
roundCls = 'round-head';
|
|
20
|
-
} else if (isEnd) {
|
|
21
|
-
roundCls = 'round-tail';
|
|
22
|
-
}
|
|
23
|
-
var backgroundColor = eventItem.bgColor || config.defaultEventBgColor;
|
|
24
|
-
var titleText = behaviors.getEventTextFunc(schedulerData, eventItem);
|
|
25
|
-
var eventItemStyle = {
|
|
26
|
-
height: config.eventItemHeight,
|
|
27
|
-
maxWidth: config.agendaMaxEventWidth,
|
|
28
|
-
backgroundColor: backgroundColor
|
|
29
|
-
};
|
|
30
|
-
var eventItemTemplate = /*#__PURE__*/React.createElement("div", {
|
|
31
|
-
className: "".concat(roundCls, " event-item"),
|
|
32
|
-
key: eventItem.id,
|
|
33
|
-
style: eventItemStyle
|
|
34
|
-
}, /*#__PURE__*/React.createElement("span", {
|
|
35
|
-
style: {
|
|
36
|
-
marginLeft: '10px',
|
|
37
|
-
lineHeight: "".concat(config.eventItemHeight, "px")
|
|
38
|
-
}
|
|
39
|
-
}, titleText));
|
|
40
|
-
if (eventItemTemplateResolver) {
|
|
41
|
-
eventItemTemplate = eventItemTemplateResolver(schedulerData, eventItem, backgroundColor, isStart, isEnd, 'event-item', config.eventItemHeight, config.agendaMaxEventWidth);
|
|
42
|
-
}
|
|
43
|
-
var handleClick = function handleClick() {
|
|
44
|
-
return eventItemClick === null || eventItemClick === void 0 ? void 0 : eventItemClick(schedulerData, eventItem);
|
|
45
|
-
};
|
|
46
|
-
var eventLink = /*#__PURE__*/React.createElement("button", {
|
|
47
|
-
type: "button",
|
|
48
|
-
className: "day-event txt-btn-dis",
|
|
49
|
-
onClick: handleClick
|
|
50
|
-
}, eventItemTemplate);
|
|
51
|
-
var content = /*#__PURE__*/React.createElement(EventItemPopover, _extends({}, props, {
|
|
52
|
-
title: eventItem.title,
|
|
53
|
-
startTime: eventItem.start,
|
|
54
|
-
endTime: eventItem.end,
|
|
55
|
-
statusColor: backgroundColor
|
|
56
|
-
}));
|
|
57
|
-
return config.eventItemPopoverEnabled ? /*#__PURE__*/React.createElement(Popover, {
|
|
58
|
-
placement: "bottomLeft",
|
|
59
|
-
content: content,
|
|
60
|
-
trigger: "hover",
|
|
61
|
-
overlayClassName: "scheduler-agenda-event-popover"
|
|
62
|
-
}, eventLink) : /*#__PURE__*/React.createElement("span", null, eventLink);
|
|
63
|
-
}
|
|
64
|
-
AgendaEventItem.propTypes = {
|
|
65
|
-
schedulerData: PropTypes.object.isRequired,
|
|
66
|
-
eventItem: PropTypes.object.isRequired,
|
|
67
|
-
isStart: PropTypes.bool.isRequired,
|
|
68
|
-
isEnd: PropTypes.bool.isRequired,
|
|
69
|
-
subtitleGetter: PropTypes.func,
|
|
70
|
-
eventItemClick: PropTypes.func,
|
|
71
|
-
viewEventClick: PropTypes.func,
|
|
72
|
-
viewEventText: PropTypes.string,
|
|
73
|
-
viewEvent2Click: PropTypes.func,
|
|
74
|
-
viewEvent2Text: PropTypes.string,
|
|
75
|
-
eventItemTemplateResolver: PropTypes.func
|
|
76
|
-
};
|
|
77
|
-
export default AgendaEventItem;
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
|
-
import AgendaEventItem from './AgendaEventItem';
|
|
5
|
-
function AgendaResourceEvents(props) {
|
|
6
|
-
var schedulerData = props.schedulerData,
|
|
7
|
-
resourceEvents = props.resourceEvents,
|
|
8
|
-
slotClickedFunc = props.slotClickedFunc,
|
|
9
|
-
slotItemTemplateResolver = props.slotItemTemplateResolver;
|
|
10
|
-
var startDate = schedulerData.startDate,
|
|
11
|
-
endDate = schedulerData.endDate,
|
|
12
|
-
config = schedulerData.config,
|
|
13
|
-
localeDayjs = schedulerData.localeDayjs;
|
|
14
|
-
var width = schedulerData.getResourceTableWidth() - 2;
|
|
15
|
-
var events = resourceEvents.headerItems.flatMap(function (item) {
|
|
16
|
-
var start = localeDayjs(new Date(startDate));
|
|
17
|
-
var end = localeDayjs(endDate).add(1, 'days');
|
|
18
|
-
var headerStart = localeDayjs(new Date(item.start));
|
|
19
|
-
var headerEnd = localeDayjs(new Date(item.end));
|
|
20
|
-
if (start === headerStart && end === headerEnd) {
|
|
21
|
-
return item.events.map(function (evt) {
|
|
22
|
-
var durationStart = localeDayjs(new Date(startDate));
|
|
23
|
-
var durationEnd = localeDayjs(endDate).add(1, 'days');
|
|
24
|
-
var eventStart = localeDayjs(evt.eventItem.start);
|
|
25
|
-
var eventEnd = localeDayjs(evt.eventItem.end);
|
|
26
|
-
var isStart = eventStart >= durationStart;
|
|
27
|
-
var isEnd = eventEnd < durationEnd;
|
|
28
|
-
return /*#__PURE__*/React.createElement(AgendaEventItem, _extends({}, props, {
|
|
29
|
-
key: evt.eventItem.id,
|
|
30
|
-
eventItem: evt.eventItem,
|
|
31
|
-
isStart: isStart,
|
|
32
|
-
isEnd: isEnd
|
|
33
|
-
}));
|
|
34
|
-
});
|
|
35
|
-
}
|
|
36
|
-
return [];
|
|
37
|
-
});
|
|
38
|
-
var slotItemContent = slotClickedFunc ? /*#__PURE__*/React.createElement("button", {
|
|
39
|
-
className: "txt-btn-dis",
|
|
40
|
-
type: "button",
|
|
41
|
-
onClick: function onClick() {
|
|
42
|
-
return slotClickedFunc(schedulerData, resourceEvents);
|
|
43
|
-
}
|
|
44
|
-
}, resourceEvents.slotName) : /*#__PURE__*/React.createElement("span", null, resourceEvents.slotName);
|
|
45
|
-
var slotItem = /*#__PURE__*/React.createElement("div", {
|
|
46
|
-
style: {
|
|
47
|
-
width: width
|
|
48
|
-
},
|
|
49
|
-
title: resourceEvents.slotTitle || resourceEvents.slotName,
|
|
50
|
-
className: "overflow-text header2-text"
|
|
51
|
-
}, slotItemContent);
|
|
52
|
-
if (slotItemTemplateResolver) {
|
|
53
|
-
var temp = slotItemTemplateResolver(schedulerData, resourceEvents, slotClickedFunc, width, 'overflow-text header2-text');
|
|
54
|
-
if (temp) {
|
|
55
|
-
slotItem = temp;
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
return /*#__PURE__*/React.createElement("tr", {
|
|
59
|
-
style: {
|
|
60
|
-
minHeight: config.eventItemLineHeight + 2
|
|
61
|
-
}
|
|
62
|
-
}, /*#__PURE__*/React.createElement("td", {
|
|
63
|
-
"data-resource-id": resourceEvents.slotId
|
|
64
|
-
}, slotItem), /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("div", {
|
|
65
|
-
className: "day-event-container"
|
|
66
|
-
}, events)));
|
|
67
|
-
}
|
|
68
|
-
AgendaResourceEvents.propTypes = {
|
|
69
|
-
schedulerData: PropTypes.object.isRequired,
|
|
70
|
-
resourceEvents: PropTypes.object.isRequired,
|
|
71
|
-
subtitleGetter: PropTypes.func,
|
|
72
|
-
eventItemClick: PropTypes.func,
|
|
73
|
-
viewEventClick: PropTypes.func,
|
|
74
|
-
viewEventText: PropTypes.string,
|
|
75
|
-
viewEvent2Click: PropTypes.func,
|
|
76
|
-
viewEvent2Text: PropTypes.string,
|
|
77
|
-
slotClickedFunc: PropTypes.func,
|
|
78
|
-
slotItemTemplateResolver: PropTypes.func
|
|
79
|
-
};
|
|
80
|
-
export default AgendaResourceEvents;
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
|
-
import AgendaResourceEvents from './AgendaResourceEvents';
|
|
5
|
-
function AgendaView(props) {
|
|
6
|
-
var schedulerData = props.schedulerData;
|
|
7
|
-
var config = schedulerData.config,
|
|
8
|
-
renderData = schedulerData.renderData;
|
|
9
|
-
var agendaResourceTableWidth = schedulerData.getResourceTableWidth();
|
|
10
|
-
var tableHeaderHeight = schedulerData.getTableHeaderHeight();
|
|
11
|
-
var resourceName = schedulerData.isEventPerspective ? config.taskName : config.resourceName;
|
|
12
|
-
var agendaViewHeader = config.agendaViewHeader;
|
|
13
|
-
var resourceEventsList = renderData.map(function (item) {
|
|
14
|
-
return /*#__PURE__*/React.createElement(AgendaResourceEvents, _extends({}, props, {
|
|
15
|
-
resourceEvents: item,
|
|
16
|
-
key: item.slotId
|
|
17
|
-
}));
|
|
18
|
-
});
|
|
19
|
-
return /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("table", {
|
|
20
|
-
className: "scheduler-table"
|
|
21
|
-
}, /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", {
|
|
22
|
-
style: {
|
|
23
|
-
height: tableHeaderHeight
|
|
24
|
-
}
|
|
25
|
-
}, /*#__PURE__*/React.createElement("th", {
|
|
26
|
-
style: {
|
|
27
|
-
width: agendaResourceTableWidth
|
|
28
|
-
},
|
|
29
|
-
className: "header3-text"
|
|
30
|
-
}, resourceName), /*#__PURE__*/React.createElement("th", {
|
|
31
|
-
className: "header3-text"
|
|
32
|
-
}, agendaViewHeader))), /*#__PURE__*/React.createElement("tbody", null, resourceEventsList))));
|
|
33
|
-
}
|
|
34
|
-
AgendaView.propTypes = {
|
|
35
|
-
schedulerData: PropTypes.object.isRequired,
|
|
36
|
-
subtitleGetter: PropTypes.func,
|
|
37
|
-
eventItemClick: PropTypes.func,
|
|
38
|
-
viewEventClick: PropTypes.func,
|
|
39
|
-
viewEventText: PropTypes.string,
|
|
40
|
-
viewEvent2Click: PropTypes.func,
|
|
41
|
-
viewEvent2Text: PropTypes.string,
|
|
42
|
-
slotClickedFunc: PropTypes.func
|
|
43
|
-
};
|
|
44
|
-
export default AgendaView;
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import PropTypes from 'prop-types';
|
|
3
|
-
function BodyView(_ref) {
|
|
4
|
-
var schedulerData = _ref.schedulerData;
|
|
5
|
-
var renderData = schedulerData.renderData,
|
|
6
|
-
headers = schedulerData.headers,
|
|
7
|
-
config = schedulerData.config,
|
|
8
|
-
behaviors = schedulerData.behaviors;
|
|
9
|
-
var width = schedulerData.getContentCellWidth();
|
|
10
|
-
var tableRows = renderData.filter(function (o) {
|
|
11
|
-
return o.render;
|
|
12
|
-
}).map(function (_ref2) {
|
|
13
|
-
var slotId = _ref2.slotId,
|
|
14
|
-
groupOnly = _ref2.groupOnly,
|
|
15
|
-
rowHeight = _ref2.rowHeight;
|
|
16
|
-
var rowCells = headers.map(function (header, index) {
|
|
17
|
-
var key = "".concat(slotId, "_").concat(header.time);
|
|
18
|
-
var style = index === headers.length - 1 ? {} : {
|
|
19
|
-
width: width
|
|
20
|
-
};
|
|
21
|
-
if (header.nonWorkingTime) {
|
|
22
|
-
style.backgroundColor = config.nonWorkingTimeBodyBgColor;
|
|
23
|
-
}
|
|
24
|
-
if (groupOnly) {
|
|
25
|
-
style.backgroundColor = config.groupOnlySlotColor;
|
|
26
|
-
}
|
|
27
|
-
if (behaviors.getNonAgendaViewBodyCellBgColorFunc) {
|
|
28
|
-
var cellBgColor = behaviors.getNonAgendaViewBodyCellBgColorFunc(schedulerData, slotId, header);
|
|
29
|
-
if (cellBgColor) {
|
|
30
|
-
style.backgroundColor = cellBgColor;
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
return /*#__PURE__*/React.createElement("td", {
|
|
34
|
-
key: key,
|
|
35
|
-
style: style
|
|
36
|
-
}, /*#__PURE__*/React.createElement("div", null));
|
|
37
|
-
});
|
|
38
|
-
return /*#__PURE__*/React.createElement("tr", {
|
|
39
|
-
key: slotId,
|
|
40
|
-
style: {
|
|
41
|
-
height: rowHeight
|
|
42
|
-
}
|
|
43
|
-
}, rowCells);
|
|
44
|
-
});
|
|
45
|
-
return /*#__PURE__*/React.createElement("tbody", null, tableRows);
|
|
46
|
-
}
|
|
47
|
-
BodyView.propTypes = {
|
|
48
|
-
schedulerData: PropTypes.object.isRequired
|
|
49
|
-
};
|
|
50
|
-
export default BodyView;
|