vxe-gantt 3.0.26 → 3.1.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/es/gantt/src/gantt-header.js +11 -2
- package/es/gantt/src/gantt-view.js +306 -45
- package/es/gantt/src/gantt.js +23 -5
- package/es/gantt/src/util.js +11 -0
- package/es/ui/index.js +2 -2
- package/es/ui/src/log.js +1 -1
- package/lib/gantt/src/gantt-header.js +9 -1
- package/lib/gantt/src/gantt-header.min.js +1 -1
- package/lib/gantt/src/gantt-view.js +341 -49
- package/lib/gantt/src/gantt-view.min.js +1 -1
- package/lib/gantt/src/gantt.js +25 -5
- package/lib/gantt/src/gantt.min.js +1 -1
- package/lib/gantt/src/util.js +12 -0
- package/lib/gantt/src/util.min.js +1 -1
- package/lib/index.umd.js +395 -62
- package/lib/index.umd.min.js +1 -1
- package/lib/ui/index.js +2 -2
- package/lib/ui/index.min.js +1 -1
- package/lib/ui/src/log.js +1 -1
- package/lib/ui/src/log.min.js +1 -1
- package/package.json +3 -3
- package/packages/gantt/src/gantt-header.ts +9 -2
- package/packages/gantt/src/gantt-view.ts +316 -47
- package/packages/gantt/src/gantt.ts +26 -5
- package/packages/gantt/src/util.ts +13 -0
- package/packages/ui/index.ts +1 -1
|
@@ -57,9 +57,10 @@ export default defineVxeComponent({
|
|
|
57
57
|
});
|
|
58
58
|
})),
|
|
59
59
|
h('thead', {}, headerGroups.map(({ scaleItem, columns }, $rowIndex) => {
|
|
60
|
-
const { type, titleMethod, headerCellStyle, slots } = scaleItem;
|
|
60
|
+
const { type, titleFormat, titleMethod, headerCellStyle, slots } = scaleItem;
|
|
61
61
|
const titleSlot = slots ? slots.title : null;
|
|
62
|
-
const
|
|
62
|
+
const isLast = $rowIndex === headerGroups.length - 1;
|
|
63
|
+
const todayValue = isLast && showNowLine ? todayDateMaps[type] : null;
|
|
63
64
|
return h('tr', {
|
|
64
65
|
key: $rowIndex
|
|
65
66
|
}, columns.map((column, cIndex) => {
|
|
@@ -73,6 +74,11 @@ export default defineVxeComponent({
|
|
|
73
74
|
label = getI18n(`vxe.gantt.${!$rowIndex && headerGroups.length > 1 ? 'tFullFormat' : 'tSimpleFormat'}.${type}`, dateObj);
|
|
74
75
|
}
|
|
75
76
|
}
|
|
77
|
+
else {
|
|
78
|
+
if (isLast && scaleItem.type === 'week') {
|
|
79
|
+
label = getI18n(`vxe.gantt.tSimpleFormat.${type}`, dateObj);
|
|
80
|
+
}
|
|
81
|
+
}
|
|
76
82
|
let cellVNs = label;
|
|
77
83
|
const ctParams = { source: sourceType, type: viewType, column, scaleObj: scaleItem, title: label, dateObj: dateObj, $rowIndex };
|
|
78
84
|
if (titleSlot) {
|
|
@@ -81,6 +87,9 @@ export default defineVxeComponent({
|
|
|
81
87
|
else if (titleMethod) {
|
|
82
88
|
cellVNs = `${titleMethod(ctParams)}`;
|
|
83
89
|
}
|
|
90
|
+
else if (titleFormat) {
|
|
91
|
+
cellVNs = XEUtils.toDateString(dateObj.date, titleFormat);
|
|
92
|
+
}
|
|
84
93
|
let cellStys = {};
|
|
85
94
|
if (headerCellStyle) {
|
|
86
95
|
if (XEUtils.isFunction(headerCellStyle)) {
|
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
import { defineVxeComponent } from '../../ui/src/comp';
|
|
2
2
|
import { VxeUI } from '@vxe-ui/core';
|
|
3
3
|
import { setScrollTop, setScrollLeft, removeClass, addClass } from '../../ui/src/dom';
|
|
4
|
-
import { getRefElem } from './util';
|
|
4
|
+
import { getRefElem, getStandardGapTime } from './util';
|
|
5
5
|
import XEUtils from 'xe-utils';
|
|
6
6
|
import GanttViewHeaderComponent from './gantt-header';
|
|
7
7
|
import GanttViewBodyComponent from './gantt-body';
|
|
8
8
|
import GanttViewFooterComponent from './gantt-footer';
|
|
9
9
|
const { globalEvents } = VxeUI;
|
|
10
10
|
const sourceType = 'gantt';
|
|
11
|
+
const minuteMs = 1000 * 60;
|
|
12
|
+
const dayMs = minuteMs * 60 * 24;
|
|
11
13
|
function createInternalData() {
|
|
12
14
|
return {
|
|
13
15
|
xeTable: null,
|
|
@@ -64,39 +66,17 @@ function updateTodayData($xeGanttView) {
|
|
|
64
66
|
second: `${yyyy}_${MM}_${dd}_${HH}_${mm}_${ss}`
|
|
65
67
|
};
|
|
66
68
|
}
|
|
67
|
-
function
|
|
69
|
+
function handleColumnHeader($xeGanttView) {
|
|
68
70
|
const $xeGantt = $xeGanttView.$xeGantt;
|
|
69
|
-
const reactData = $xeGanttView.reactData;
|
|
70
|
-
const internalData = $xeGanttView.internalData;
|
|
71
|
-
const ganttProps = $xeGantt;
|
|
72
71
|
const ganttReactData = $xeGantt.reactData;
|
|
73
|
-
const { treeConfig } = ganttProps;
|
|
74
72
|
const { taskScaleList } = ganttReactData;
|
|
75
|
-
const
|
|
76
|
-
const minScale =
|
|
73
|
+
const scaleUnit = $xeGantt.computeScaleUnit;
|
|
74
|
+
const minScale = $xeGantt.computeMinScale;
|
|
75
|
+
const weekScale = $xeGantt.computeWeekScale;
|
|
76
|
+
const scaleDateList = $xeGanttView.computeScaleDateList;
|
|
77
77
|
const fullCols = [];
|
|
78
78
|
const groupCols = [];
|
|
79
|
-
if (minScale &&
|
|
80
|
-
const minSType = minScale.type;
|
|
81
|
-
const weekScale = taskScaleList.find(item => item.type === 'week');
|
|
82
|
-
let gapTime = 1000 * 60 * 60 * 24;
|
|
83
|
-
switch (minScale.type) {
|
|
84
|
-
case 'hour':
|
|
85
|
-
gapTime = 1000 * 60 * 60;
|
|
86
|
-
break;
|
|
87
|
-
case 'minute':
|
|
88
|
-
gapTime = 1000 * 60;
|
|
89
|
-
break;
|
|
90
|
-
case 'second':
|
|
91
|
-
gapTime = 1000;
|
|
92
|
-
break;
|
|
93
|
-
default: {
|
|
94
|
-
break;
|
|
95
|
-
}
|
|
96
|
-
}
|
|
97
|
-
const currTime = minViewDate.getTime();
|
|
98
|
-
const diffDayNum = maxViewDate.getTime() - minViewDate.getTime();
|
|
99
|
-
const countSize = Math.max(5, Math.floor(diffDayNum / gapTime) + 1);
|
|
79
|
+
if (minScale && scaleUnit && scaleDateList.length) {
|
|
100
80
|
const renderListMaps = {
|
|
101
81
|
year: [],
|
|
102
82
|
quarter: [],
|
|
@@ -120,7 +100,7 @@ function handleParseColumn($xeGanttView) {
|
|
|
120
100
|
second: {}
|
|
121
101
|
};
|
|
122
102
|
const handleData = (type, colMaps, minCol) => {
|
|
123
|
-
if (
|
|
103
|
+
if (minScale.type === type) {
|
|
124
104
|
return;
|
|
125
105
|
}
|
|
126
106
|
const currCol = colMaps[type];
|
|
@@ -138,14 +118,14 @@ function handleParseColumn($xeGanttView) {
|
|
|
138
118
|
currGpCol.children.push(minCol);
|
|
139
119
|
}
|
|
140
120
|
};
|
|
141
|
-
for (let i = 0; i <
|
|
142
|
-
const itemDate =
|
|
121
|
+
for (let i = 0; i < scaleDateList.length; i++) {
|
|
122
|
+
const itemDate = scaleDateList[i];
|
|
143
123
|
const [yyyy, MM, dd, HH, mm, ss] = XEUtils.toDateString(itemDate, 'yyyy-M-d-H-m-s').split('-');
|
|
144
124
|
const e = itemDate.getDay();
|
|
145
125
|
const E = e + 1;
|
|
146
126
|
const q = Math.ceil((itemDate.getMonth() + 1) / 3);
|
|
147
127
|
const W = XEUtils.getYearWeek(itemDate, weekScale ? weekScale.startDay : undefined);
|
|
148
|
-
const dateObj = { yy: yyyy, M: MM, d: dd, H: HH, m: mm, s: ss, q, W, E, e };
|
|
128
|
+
const dateObj = { date: itemDate, yy: yyyy, M: MM, d: dd, H: HH, m: mm, s: ss, q, W, E, e };
|
|
149
129
|
const colMaps = {
|
|
150
130
|
year: {
|
|
151
131
|
field: yyyy,
|
|
@@ -193,7 +173,7 @@ function handleParseColumn($xeGanttView) {
|
|
|
193
173
|
dateObj
|
|
194
174
|
}
|
|
195
175
|
};
|
|
196
|
-
const minCol = colMaps[
|
|
176
|
+
const minCol = colMaps[minScale.type];
|
|
197
177
|
if (minScale.level < 19) {
|
|
198
178
|
handleData('year', colMaps, minCol);
|
|
199
179
|
}
|
|
@@ -221,7 +201,7 @@ function handleParseColumn($xeGanttView) {
|
|
|
221
201
|
fullCols.push(minCol);
|
|
222
202
|
}
|
|
223
203
|
taskScaleList.forEach(scaleItem => {
|
|
224
|
-
if (scaleItem.type ===
|
|
204
|
+
if (scaleItem.type === minScale.type) {
|
|
225
205
|
groupCols.push({
|
|
226
206
|
scaleItem,
|
|
227
207
|
columns: fullCols
|
|
@@ -240,6 +220,216 @@ function handleParseColumn($xeGanttView) {
|
|
|
240
220
|
columns: list
|
|
241
221
|
});
|
|
242
222
|
});
|
|
223
|
+
}
|
|
224
|
+
return {
|
|
225
|
+
fullCols,
|
|
226
|
+
groupCols
|
|
227
|
+
};
|
|
228
|
+
}
|
|
229
|
+
function createChartRender($xeGanttView, fullCols) {
|
|
230
|
+
const $xeGantt = $xeGanttView.$xeGantt;
|
|
231
|
+
const reactData = $xeGanttView.reactData;
|
|
232
|
+
const { minViewDate } = reactData;
|
|
233
|
+
const minScale = $xeGantt.computeMinScale;
|
|
234
|
+
const scaleUnit = $xeGantt.computeScaleUnit;
|
|
235
|
+
const weekScale = $xeGantt.computeWeekScale;
|
|
236
|
+
switch (scaleUnit) {
|
|
237
|
+
case 'year': {
|
|
238
|
+
const indexMaps = {};
|
|
239
|
+
fullCols.forEach(({ dateObj }, i) => {
|
|
240
|
+
const yyyyMM = XEUtils.toDateString(dateObj.date, 'yyyy');
|
|
241
|
+
indexMaps[yyyyMM] = i;
|
|
242
|
+
});
|
|
243
|
+
return (startValue, endValue) => {
|
|
244
|
+
const startDate = parseStringDate($xeGanttView, startValue);
|
|
245
|
+
const endDate = parseStringDate($xeGanttView, endValue);
|
|
246
|
+
const startStr = XEUtils.toDateString(startDate, 'yyyy');
|
|
247
|
+
const startFirstDate = XEUtils.getWhatYear(startDate, 0, 'first');
|
|
248
|
+
const endStr = XEUtils.toDateString(endDate, 'yyyy');
|
|
249
|
+
const endFirstDate = XEUtils.getWhatYear(endDate, 0, 'first');
|
|
250
|
+
const dateSize = Math.floor((XEUtils.getWhatYear(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / dayMs);
|
|
251
|
+
const subtract = (startDate.getTime() - startFirstDate.getTime()) / dayMs / dateSize;
|
|
252
|
+
const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / dayMs + 1) / dateSize;
|
|
253
|
+
const offsetLeftSize = (indexMaps[startStr] || 0) + subtract;
|
|
254
|
+
return {
|
|
255
|
+
offsetLeftSize,
|
|
256
|
+
offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
|
|
257
|
+
};
|
|
258
|
+
};
|
|
259
|
+
}
|
|
260
|
+
case 'quarter': {
|
|
261
|
+
const indexMaps = {};
|
|
262
|
+
fullCols.forEach(({ dateObj }, i) => {
|
|
263
|
+
const q = XEUtils.toDateString(dateObj.date, 'yyyy-q');
|
|
264
|
+
indexMaps[q] = i;
|
|
265
|
+
});
|
|
266
|
+
return (startValue, endValue) => {
|
|
267
|
+
const startDate = parseStringDate($xeGanttView, startValue);
|
|
268
|
+
const endDate = parseStringDate($xeGanttView, endValue);
|
|
269
|
+
const startStr = XEUtils.toDateString(startDate, 'yyyy-q');
|
|
270
|
+
const startFirstDate = XEUtils.getWhatQuarter(startDate, 0, 'first');
|
|
271
|
+
const endStr = XEUtils.toDateString(endDate, 'yyyy-q');
|
|
272
|
+
const endFirstDate = XEUtils.getWhatQuarter(endDate, 0, 'first');
|
|
273
|
+
const dateSize = Math.floor((XEUtils.getWhatQuarter(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / dayMs);
|
|
274
|
+
const subtract = (startDate.getTime() - startFirstDate.getTime()) / dayMs / dateSize;
|
|
275
|
+
const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / dayMs + 1) / dateSize;
|
|
276
|
+
const offsetLeftSize = (indexMaps[startStr] || 0) + subtract;
|
|
277
|
+
return {
|
|
278
|
+
offsetLeftSize,
|
|
279
|
+
offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
|
|
280
|
+
};
|
|
281
|
+
};
|
|
282
|
+
}
|
|
283
|
+
case 'month': {
|
|
284
|
+
const indexMaps = {};
|
|
285
|
+
fullCols.forEach(({ dateObj }, i) => {
|
|
286
|
+
const yyyyMM = XEUtils.toDateString(dateObj.date, 'yyyy-MM');
|
|
287
|
+
indexMaps[yyyyMM] = i;
|
|
288
|
+
});
|
|
289
|
+
return (startValue, endValue) => {
|
|
290
|
+
const startDate = parseStringDate($xeGanttView, startValue);
|
|
291
|
+
const endDate = parseStringDate($xeGanttView, endValue);
|
|
292
|
+
const startStr = XEUtils.toDateString(startDate, 'yyyy-MM');
|
|
293
|
+
const startFirstDate = XEUtils.getWhatMonth(startDate, 0, 'first');
|
|
294
|
+
const endStr = XEUtils.toDateString(endDate, 'yyyy-MM');
|
|
295
|
+
const endFirstDate = XEUtils.getWhatMonth(endDate, 0, 'first');
|
|
296
|
+
const dateSize = Math.floor((XEUtils.getWhatMonth(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / dayMs);
|
|
297
|
+
const subtract = (startDate.getTime() - startFirstDate.getTime()) / dayMs / dateSize;
|
|
298
|
+
const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / dayMs + 1) / dateSize;
|
|
299
|
+
const offsetLeftSize = (indexMaps[startStr] || 0) + subtract;
|
|
300
|
+
return {
|
|
301
|
+
offsetLeftSize,
|
|
302
|
+
offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
|
|
303
|
+
};
|
|
304
|
+
};
|
|
305
|
+
}
|
|
306
|
+
case 'week': {
|
|
307
|
+
const indexMaps = {};
|
|
308
|
+
fullCols.forEach(({ dateObj }, i) => {
|
|
309
|
+
const yyyyW = XEUtils.toDateString(dateObj.date, 'yyyy-W', { firstDay: weekScale ? weekScale.startDay : undefined });
|
|
310
|
+
indexMaps[yyyyW] = i;
|
|
311
|
+
});
|
|
312
|
+
return (startValue, endValue) => {
|
|
313
|
+
const startDate = parseStringDate($xeGanttView, startValue);
|
|
314
|
+
const endDate = parseStringDate($xeGanttView, endValue);
|
|
315
|
+
const startStr = XEUtils.toDateString(startDate, 'yyyy-W', { firstDay: weekScale ? weekScale.startDay : undefined });
|
|
316
|
+
const startFirstDate = XEUtils.getWhatWeek(startDate, 0, weekScale ? weekScale.startDay : undefined, weekScale ? weekScale.startDay : undefined);
|
|
317
|
+
const endStr = XEUtils.toDateString(endDate, 'yyyy-W', { firstDay: weekScale ? weekScale.startDay : undefined });
|
|
318
|
+
const endFirstDate = XEUtils.getWhatWeek(endDate, 0, weekScale ? weekScale.startDay : undefined, weekScale ? weekScale.startDay : undefined);
|
|
319
|
+
const dateSize = Math.floor((XEUtils.getWhatWeek(endDate, 1, weekScale ? weekScale.startDay : undefined, weekScale ? weekScale.startDay : undefined).getTime() - endFirstDate.getTime()) / dayMs);
|
|
320
|
+
const subtract = (startDate.getTime() - startFirstDate.getTime()) / dayMs / dateSize;
|
|
321
|
+
const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / dayMs + 1) / dateSize;
|
|
322
|
+
const offsetLeftSize = (indexMaps[startStr] || 0) + subtract;
|
|
323
|
+
return {
|
|
324
|
+
offsetLeftSize,
|
|
325
|
+
offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
|
|
326
|
+
};
|
|
327
|
+
};
|
|
328
|
+
}
|
|
329
|
+
case 'day':
|
|
330
|
+
case 'date': {
|
|
331
|
+
const indexMaps = {};
|
|
332
|
+
fullCols.forEach(({ dateObj }, i) => {
|
|
333
|
+
const yyyyMM = XEUtils.toDateString(dateObj.date, 'yyyy-MM-dd');
|
|
334
|
+
indexMaps[yyyyMM] = i;
|
|
335
|
+
});
|
|
336
|
+
return (startValue, endValue) => {
|
|
337
|
+
const startDate = parseStringDate($xeGanttView, startValue);
|
|
338
|
+
const endDate = parseStringDate($xeGanttView, endValue);
|
|
339
|
+
const startStr = XEUtils.toDateString(startDate, 'yyyy-MM-dd');
|
|
340
|
+
const startFirstDate = XEUtils.getWhatDay(startDate, 0, 'first');
|
|
341
|
+
const endStr = XEUtils.toDateString(endDate, 'yyyy-MM-dd');
|
|
342
|
+
const endFirstDate = XEUtils.getWhatDay(endDate, 0, 'first');
|
|
343
|
+
const minuteSize = Math.floor((XEUtils.getWhatDay(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / minuteMs);
|
|
344
|
+
const subtract = (startDate.getTime() - startFirstDate.getTime()) / minuteMs / minuteSize;
|
|
345
|
+
const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / minuteMs + 1) / minuteSize;
|
|
346
|
+
const offsetLeftSize = (indexMaps[startStr] || 0) + subtract;
|
|
347
|
+
return {
|
|
348
|
+
offsetLeftSize,
|
|
349
|
+
offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
|
|
350
|
+
};
|
|
351
|
+
};
|
|
352
|
+
}
|
|
353
|
+
case 'hour': {
|
|
354
|
+
const indexMaps = {};
|
|
355
|
+
fullCols.forEach(({ dateObj }, i) => {
|
|
356
|
+
const yyyyMM = XEUtils.toDateString(dateObj.date, 'yyyy-MM-dd HH');
|
|
357
|
+
indexMaps[yyyyMM] = i;
|
|
358
|
+
});
|
|
359
|
+
return (startValue, endValue) => {
|
|
360
|
+
const startDate = parseStringDate($xeGanttView, startValue);
|
|
361
|
+
const endDate = parseStringDate($xeGanttView, endValue);
|
|
362
|
+
const startStr = XEUtils.toDateString(startDate, 'yyyy-MM-dd HH');
|
|
363
|
+
const startFirstDate = XEUtils.getWhatHours(startDate, 0, 'first');
|
|
364
|
+
const endStr = XEUtils.toDateString(endDate, 'yyyy-MM-dd HH');
|
|
365
|
+
const endFirstDate = XEUtils.getWhatHours(endDate, 0, 'first');
|
|
366
|
+
const minuteSize = Math.floor((XEUtils.getWhatHours(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / minuteMs);
|
|
367
|
+
const subtract = (startDate.getTime() - startFirstDate.getTime()) / minuteMs / minuteSize;
|
|
368
|
+
const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / minuteMs + 1) / minuteSize;
|
|
369
|
+
const offsetLeftSize = (indexMaps[startStr] || 0) + subtract;
|
|
370
|
+
return {
|
|
371
|
+
offsetLeftSize,
|
|
372
|
+
offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
|
|
373
|
+
};
|
|
374
|
+
};
|
|
375
|
+
}
|
|
376
|
+
case 'minute': {
|
|
377
|
+
const indexMaps = {};
|
|
378
|
+
fullCols.forEach(({ dateObj }, i) => {
|
|
379
|
+
const yyyyMM = XEUtils.toDateString(dateObj.date, 'yyyy-MM-dd HH:mm');
|
|
380
|
+
indexMaps[yyyyMM] = i;
|
|
381
|
+
});
|
|
382
|
+
return (startValue, endValue) => {
|
|
383
|
+
const startDate = parseStringDate($xeGanttView, startValue);
|
|
384
|
+
const endDate = parseStringDate($xeGanttView, endValue);
|
|
385
|
+
const startStr = XEUtils.toDateString(startDate, 'yyyy-MM-dd HH:mm');
|
|
386
|
+
const startFirstDate = XEUtils.getWhatMinutes(startDate, 0, 'first');
|
|
387
|
+
const endStr = XEUtils.toDateString(endDate, 'yyyy-MM-dd HH:mm');
|
|
388
|
+
const endFirstDate = XEUtils.getWhatMinutes(endDate, 0, 'first');
|
|
389
|
+
const minuteSize = Math.floor((XEUtils.getWhatMinutes(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / minuteMs);
|
|
390
|
+
const subtract = (startDate.getTime() - startFirstDate.getTime()) / minuteMs / minuteSize;
|
|
391
|
+
const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / minuteMs + 1) / minuteSize;
|
|
392
|
+
const offsetLeftSize = (indexMaps[startStr] || 0) + subtract;
|
|
393
|
+
return {
|
|
394
|
+
offsetLeftSize,
|
|
395
|
+
offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
|
|
396
|
+
};
|
|
397
|
+
};
|
|
398
|
+
}
|
|
399
|
+
case 'second': {
|
|
400
|
+
const gapTime = getStandardGapTime(minScale.type);
|
|
401
|
+
return (startValue, endValue) => {
|
|
402
|
+
const startDate = parseStringDate($xeGanttView, startValue);
|
|
403
|
+
const endDate = parseStringDate($xeGanttView, endValue);
|
|
404
|
+
let offsetLeftSize = 0;
|
|
405
|
+
let offsetWidthSize = 0;
|
|
406
|
+
if (minViewDate) {
|
|
407
|
+
offsetLeftSize = (startDate.getTime() - minViewDate.getTime()) / gapTime;
|
|
408
|
+
offsetWidthSize = ((endDate.getTime() - startDate.getTime()) / gapTime) + 1;
|
|
409
|
+
}
|
|
410
|
+
return {
|
|
411
|
+
offsetLeftSize,
|
|
412
|
+
offsetWidthSize
|
|
413
|
+
};
|
|
414
|
+
};
|
|
415
|
+
}
|
|
416
|
+
}
|
|
417
|
+
return () => {
|
|
418
|
+
return {
|
|
419
|
+
offsetLeftSize: 0,
|
|
420
|
+
offsetWidthSize: 0
|
|
421
|
+
};
|
|
422
|
+
};
|
|
423
|
+
}
|
|
424
|
+
function handleParseColumn($xeGanttView) {
|
|
425
|
+
const $xeGantt = $xeGanttView.$xeGantt;
|
|
426
|
+
const reactData = $xeGanttView.reactData;
|
|
427
|
+
const internalData = $xeGanttView.internalData;
|
|
428
|
+
const ganttProps = $xeGantt;
|
|
429
|
+
const { treeConfig } = ganttProps;
|
|
430
|
+
const { minViewDate, maxViewDate } = reactData;
|
|
431
|
+
const { fullCols, groupCols } = handleColumnHeader($xeGanttView);
|
|
432
|
+
if (minViewDate && maxViewDate) {
|
|
243
433
|
const $xeTable = internalData.xeTable;
|
|
244
434
|
if ($xeTable) {
|
|
245
435
|
const startField = $xeGantt.computeStartField;
|
|
@@ -253,20 +443,18 @@ function handleParseColumn($xeGanttView) {
|
|
|
253
443
|
const { transform } = treeOpts;
|
|
254
444
|
const childrenField = treeOpts.children || treeOpts.childrenField;
|
|
255
445
|
const ctMaps = {};
|
|
446
|
+
const renderFn = createChartRender($xeGanttView, fullCols);
|
|
256
447
|
const handleParseRender = (row) => {
|
|
257
448
|
const rowid = $xeTable.getRowid(row);
|
|
258
449
|
const startValue = XEUtils.get(row, startField);
|
|
259
450
|
const endValue = XEUtils.get(row, endField);
|
|
260
451
|
if (startValue && endValue) {
|
|
261
|
-
const
|
|
262
|
-
const endDate = parseStringDate($xeGanttView, endValue);
|
|
263
|
-
const oLeftSize = Math.floor((startDate.getTime() - minViewDate.getTime()) / gapTime);
|
|
264
|
-
const oWidthSize = Math.floor((endDate.getTime() - startDate.getTime()) / gapTime) + 1;
|
|
452
|
+
const { offsetLeftSize, offsetWidthSize } = renderFn(startValue, endValue);
|
|
265
453
|
ctMaps[rowid] = {
|
|
266
454
|
row,
|
|
267
455
|
rowid,
|
|
268
|
-
oLeftSize,
|
|
269
|
-
oWidthSize
|
|
456
|
+
oLeftSize: offsetLeftSize,
|
|
457
|
+
oWidthSize: offsetWidthSize
|
|
270
458
|
};
|
|
271
459
|
}
|
|
272
460
|
};
|
|
@@ -527,10 +715,10 @@ function handleLazyRecalculate($xeGanttView) {
|
|
|
527
715
|
return new Promise(resolve => {
|
|
528
716
|
const { rceTimeout, rceRunTime } = internalData;
|
|
529
717
|
const $xeTable = internalData.xeTable;
|
|
530
|
-
let refreshDelay =
|
|
718
|
+
let refreshDelay = 30;
|
|
531
719
|
if ($xeTable) {
|
|
532
720
|
const resizeOpts = $xeTable.computeResizeOpts;
|
|
533
|
-
refreshDelay = resizeOpts.refreshDelay ||
|
|
721
|
+
refreshDelay = resizeOpts.refreshDelay || refreshDelay;
|
|
534
722
|
}
|
|
535
723
|
if (rceTimeout) {
|
|
536
724
|
clearTimeout(rceTimeout);
|
|
@@ -918,15 +1106,88 @@ export default defineVxeComponent({
|
|
|
918
1106
|
internalData
|
|
919
1107
|
};
|
|
920
1108
|
},
|
|
921
|
-
computed: Object.assign({}, {}),
|
|
1109
|
+
computed: Object.assign(Object.assign({}, {}), { computeScaleDateList() {
|
|
1110
|
+
const $xeGanttView = this;
|
|
1111
|
+
const $xeGantt = $xeGanttView.$xeGantt;
|
|
1112
|
+
const reactData = $xeGanttView.reactData;
|
|
1113
|
+
const { minViewDate, maxViewDate } = reactData;
|
|
1114
|
+
const minScale = $xeGantt.computeMinScale;
|
|
1115
|
+
const dateList = [];
|
|
1116
|
+
if (!minViewDate || !maxViewDate) {
|
|
1117
|
+
return dateList;
|
|
1118
|
+
}
|
|
1119
|
+
const startTime = minViewDate.getTime();
|
|
1120
|
+
const endTime = maxViewDate.getTime();
|
|
1121
|
+
switch (minScale.type) {
|
|
1122
|
+
case 'year': {
|
|
1123
|
+
let currDate = XEUtils.getWhatYear(minViewDate, 0, 'first');
|
|
1124
|
+
while (currDate <= maxViewDate) {
|
|
1125
|
+
const itemDate = currDate;
|
|
1126
|
+
dateList.push(itemDate);
|
|
1127
|
+
currDate = XEUtils.getWhatYear(currDate, 1);
|
|
1128
|
+
}
|
|
1129
|
+
break;
|
|
1130
|
+
}
|
|
1131
|
+
case 'quarter': {
|
|
1132
|
+
let currDate = XEUtils.getWhatQuarter(minViewDate, 0, 'first');
|
|
1133
|
+
while (currDate <= maxViewDate) {
|
|
1134
|
+
const itemDate = currDate;
|
|
1135
|
+
dateList.push(itemDate);
|
|
1136
|
+
currDate = XEUtils.getWhatQuarter(currDate, 1);
|
|
1137
|
+
}
|
|
1138
|
+
break;
|
|
1139
|
+
}
|
|
1140
|
+
case 'month': {
|
|
1141
|
+
let currDate = XEUtils.getWhatMonth(minViewDate, 0, 'first');
|
|
1142
|
+
while (currDate <= maxViewDate) {
|
|
1143
|
+
const itemDate = currDate;
|
|
1144
|
+
dateList.push(itemDate);
|
|
1145
|
+
currDate = XEUtils.getWhatMonth(currDate, 1);
|
|
1146
|
+
}
|
|
1147
|
+
break;
|
|
1148
|
+
}
|
|
1149
|
+
case 'week': {
|
|
1150
|
+
let currDate = XEUtils.getWhatWeek(minViewDate, 0, minScale.startDay, minScale.startDay);
|
|
1151
|
+
while (currDate <= maxViewDate) {
|
|
1152
|
+
const itemDate = currDate;
|
|
1153
|
+
dateList.push(itemDate);
|
|
1154
|
+
currDate = XEUtils.getWhatWeek(currDate, 1);
|
|
1155
|
+
}
|
|
1156
|
+
break;
|
|
1157
|
+
}
|
|
1158
|
+
case 'day':
|
|
1159
|
+
case 'date':
|
|
1160
|
+
case 'hour':
|
|
1161
|
+
case 'minute':
|
|
1162
|
+
case 'second': {
|
|
1163
|
+
const gapTime = getStandardGapTime(minScale.type);
|
|
1164
|
+
let currTime = startTime;
|
|
1165
|
+
while (currTime <= endTime) {
|
|
1166
|
+
const itemDate = new Date(currTime);
|
|
1167
|
+
dateList.push(itemDate);
|
|
1168
|
+
currTime += gapTime;
|
|
1169
|
+
}
|
|
1170
|
+
break;
|
|
1171
|
+
}
|
|
1172
|
+
}
|
|
1173
|
+
return dateList;
|
|
1174
|
+
} }),
|
|
922
1175
|
methods: {
|
|
923
1176
|
//
|
|
924
1177
|
// Method
|
|
925
1178
|
//
|
|
926
1179
|
refreshData() {
|
|
927
1180
|
const $xeGanttView = this;
|
|
1181
|
+
const internalData = $xeGanttView.internalData;
|
|
928
1182
|
handleUpdateData($xeGanttView);
|
|
929
|
-
|
|
1183
|
+
handleRecalculateStyle($xeGanttView);
|
|
1184
|
+
return $xeGanttView.$nextTick().then(() => {
|
|
1185
|
+
const $xeTable = internalData.xeTable;
|
|
1186
|
+
handleRecalculateStyle($xeGanttView);
|
|
1187
|
+
if ($xeTable) {
|
|
1188
|
+
return $xeTable.recalculate();
|
|
1189
|
+
}
|
|
1190
|
+
});
|
|
930
1191
|
},
|
|
931
1192
|
updateViewData() {
|
|
932
1193
|
const $xeGanttView = this;
|
package/es/gantt/src/gantt.js
CHANGED
|
@@ -68,7 +68,7 @@ export default {
|
|
|
68
68
|
mixins: [
|
|
69
69
|
globalMixins.sizeMixin
|
|
70
70
|
],
|
|
71
|
-
props: Object.assign(Object.assign({}, tableProps), { columns: Array, pagerConfig: Object, proxyConfig: Object, toolbarConfig: Object, formConfig: Object, zoomConfig: Object, layouts: Array, taskConfig: Object,
|
|
71
|
+
props: Object.assign(Object.assign({}, tableProps), { columns: Array, pagerConfig: Object, proxyConfig: Object, toolbarConfig: Object, formConfig: Object, zoomConfig: Object, layouts: Array, taskConfig: Object, taskViewScaleConfig: Object, taskViewConfig: Object, taskBarConfig: Object, taskSplitConfig: Object, taskBarResizeConfig: Object, taskBarDragConfig: Object, size: {
|
|
72
72
|
type: String,
|
|
73
73
|
default: () => getConfig().gantt.size || getConfig().size
|
|
74
74
|
} }),
|
|
@@ -149,10 +149,10 @@ export default {
|
|
|
149
149
|
const props = $xeGantt;
|
|
150
150
|
return Object.assign({}, getConfig().gantt.taskConfig, props.taskConfig);
|
|
151
151
|
},
|
|
152
|
-
|
|
152
|
+
computeTaskViewScaleOpts() {
|
|
153
153
|
const $xeGantt = this;
|
|
154
154
|
const props = $xeGantt;
|
|
155
|
-
return XEUtils.merge({}, getConfig().gantt.
|
|
155
|
+
return XEUtils.merge({}, getConfig().gantt.taskViewScaleConfig, props.taskViewScaleConfig);
|
|
156
156
|
},
|
|
157
157
|
computeTaskViewOpts() {
|
|
158
158
|
const $xeGantt = this;
|
|
@@ -179,6 +179,23 @@ export default {
|
|
|
179
179
|
const props = $xeGantt;
|
|
180
180
|
return Object.assign({}, getConfig().gantt.taskSplitConfig, props.taskSplitConfig);
|
|
181
181
|
},
|
|
182
|
+
computeScaleUnit() {
|
|
183
|
+
const $xeGantt = this;
|
|
184
|
+
const minScale = $xeGantt.computeMinScale;
|
|
185
|
+
return minScale ? minScale.type : 'date';
|
|
186
|
+
},
|
|
187
|
+
computeMinScale() {
|
|
188
|
+
const $xeGantt = this;
|
|
189
|
+
const reactData = $xeGantt.reactData;
|
|
190
|
+
const { taskScaleList } = reactData;
|
|
191
|
+
return XEUtils.last(taskScaleList);
|
|
192
|
+
},
|
|
193
|
+
computeWeekScale() {
|
|
194
|
+
const $xeGantt = this;
|
|
195
|
+
const reactData = $xeGantt.reactData;
|
|
196
|
+
const { taskScaleList } = reactData;
|
|
197
|
+
return taskScaleList.find(item => item.type === 'week');
|
|
198
|
+
},
|
|
182
199
|
computeTaskScaleConfs() {
|
|
183
200
|
const $xeGantt = this;
|
|
184
201
|
const taskViewOpts = $xeGantt.computeTaskViewOpts;
|
|
@@ -435,6 +452,7 @@ export default {
|
|
|
435
452
|
computeTaskScaleConfs() {
|
|
436
453
|
const $xeGantt = this;
|
|
437
454
|
$xeGantt.handleTaskScaleConfig();
|
|
455
|
+
$xeGantt.refreshTaskView();
|
|
438
456
|
}
|
|
439
457
|
},
|
|
440
458
|
methods: Object.assign(Object.assign({}, tableMethods), { dispatchEvent(type, params, evnt) {
|
|
@@ -445,7 +463,7 @@ export default {
|
|
|
445
463
|
const $xeGantt = this;
|
|
446
464
|
const reactData = $xeGantt.reactData;
|
|
447
465
|
const taskScaleConfs = $xeGantt.computeTaskScaleConfs;
|
|
448
|
-
const
|
|
466
|
+
const taskViewScaleOpts = $xeGantt.computeTaskViewScaleOpts;
|
|
449
467
|
const scaleConfs = [];
|
|
450
468
|
if (taskScaleConfs) {
|
|
451
469
|
const keyMaps = {};
|
|
@@ -461,7 +479,7 @@ export default {
|
|
|
461
479
|
return;
|
|
462
480
|
}
|
|
463
481
|
keyMaps[type] = true;
|
|
464
|
-
scaleConfs.push(Object.assign({}, type ?
|
|
482
|
+
scaleConfs.push(Object.assign({}, type ? taskViewScaleOpts[type] || {} : {}, sConf, {
|
|
465
483
|
level: getViewTypeLevel(type)
|
|
466
484
|
}));
|
|
467
485
|
});
|
package/es/gantt/src/util.js
CHANGED
|
@@ -7,3 +7,14 @@ export function getRefElem(refEl) {
|
|
|
7
7
|
export function getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight) {
|
|
8
8
|
return rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
|
|
9
9
|
}
|
|
10
|
+
export function getStandardGapTime(type) {
|
|
11
|
+
switch (type) {
|
|
12
|
+
case 'hour':
|
|
13
|
+
return 1000 * 60 * 60;
|
|
14
|
+
case 'minute':
|
|
15
|
+
return 1000 * 60;
|
|
16
|
+
case 'second':
|
|
17
|
+
return 1000;
|
|
18
|
+
}
|
|
19
|
+
return 1000 * 60 * 60 * 24;
|
|
20
|
+
}
|
package/es/ui/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { VxeUI } from '@vxe-ui/core';
|
|
2
2
|
import { errLog } from './src/log';
|
|
3
3
|
const { setConfig, setIcon, checkVersion } = VxeUI;
|
|
4
|
-
VxeUI.ganttVersion = "3.0
|
|
4
|
+
VxeUI.ganttVersion = "3.1.0";
|
|
5
5
|
setConfig({
|
|
6
6
|
gantt: {
|
|
7
7
|
// size: null,
|
|
@@ -40,7 +40,7 @@ setConfig({
|
|
|
40
40
|
// beforeSave: null,
|
|
41
41
|
// afterSave: null
|
|
42
42
|
},
|
|
43
|
-
|
|
43
|
+
taskViewScaleConfig: {
|
|
44
44
|
week: {
|
|
45
45
|
startDay: 1
|
|
46
46
|
}
|
package/es/ui/src/log.js
CHANGED
|
@@ -64,11 +64,13 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
|
|
|
64
64
|
var scaleItem = _ref.scaleItem,
|
|
65
65
|
columns = _ref.columns;
|
|
66
66
|
var type = scaleItem.type,
|
|
67
|
+
titleFormat = scaleItem.titleFormat,
|
|
67
68
|
titleMethod = scaleItem.titleMethod,
|
|
68
69
|
headerCellStyle = scaleItem.headerCellStyle,
|
|
69
70
|
slots = scaleItem.slots;
|
|
70
71
|
var titleSlot = slots ? slots.title : null;
|
|
71
|
-
var
|
|
72
|
+
var isLast = $rowIndex === headerGroups.length - 1;
|
|
73
|
+
var todayValue = isLast && showNowLine ? todayDateMaps[type] : null;
|
|
72
74
|
return h('tr', {
|
|
73
75
|
key: $rowIndex
|
|
74
76
|
}, columns.map(function (column, cIndex) {
|
|
@@ -82,6 +84,10 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
|
|
|
82
84
|
} else {
|
|
83
85
|
label = getI18n("vxe.gantt.".concat(!$rowIndex && headerGroups.length > 1 ? 'tFullFormat' : 'tSimpleFormat', ".").concat(type), dateObj);
|
|
84
86
|
}
|
|
87
|
+
} else {
|
|
88
|
+
if (isLast && scaleItem.type === 'week') {
|
|
89
|
+
label = getI18n("vxe.gantt.tSimpleFormat.".concat(type), dateObj);
|
|
90
|
+
}
|
|
85
91
|
}
|
|
86
92
|
var cellVNs = label;
|
|
87
93
|
var ctParams = {
|
|
@@ -97,6 +103,8 @@ var _default = exports.default = (0, _comp.defineVxeComponent)({
|
|
|
97
103
|
cellVNs = $xeGantt.callSlot(titleSlot, ctParams, h);
|
|
98
104
|
} else if (titleMethod) {
|
|
99
105
|
cellVNs = "".concat(titleMethod(ctParams));
|
|
106
|
+
} else if (titleFormat) {
|
|
107
|
+
cellVNs = _xeUtils.default.toDateString(dateObj.date, titleFormat);
|
|
100
108
|
}
|
|
101
109
|
var cellStys = {};
|
|
102
110
|
if (headerCellStyle) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var getI18n=_core.VxeUI.getI18n,sourceType="gantt",viewType="header",_default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeGanttViewHeader",inject:{$xeGantt:{default:null},$xeGanttView:{default:null}},computed:Object.assign({},{}),methods:{renderVN:function(
|
|
1
|
+
Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var getI18n=_core.VxeUI.getI18n,sourceType="gantt",viewType="header",_default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeGanttViewHeader",inject:{$xeGantt:{default:null},$xeGanttView:{default:null}},computed:Object.assign({},{}),methods:{renderVN:function(h){var w=this.$xeGantt,e=this.$xeGanttView,t=e.reactData,a=e.internalData,g=t.headerGroups,n=t.viewCellWidth,r=a.todayDateMaps,t=a.visibleColumn,y=w.computeTaskViewOpts.showNowLine;return h("div",{ref:"refElem",class:"vxe-gantt-view--header-wrapper"},[h("div",{ref:"refHeaderScroll",class:"vxe-gantt-view--header-inner-wrapper",on:{scroll:e.triggerHeaderScrollEvent}},[h("div",{ref:"refHeaderXSpace",class:"vxe-body--x-space"}),h("table",{ref:"refHeaderTable",class:"vxe-gantt-view--header-table"},[h("colgroup",{},t.map(function(e,t){return h("col",{key:t,style:{width:"".concat(n,"px")}})})),h("thead",{},g.map(function(e,i){var u=e.scaleItem,e=e.columns,s=u.type,d=u.titleFormat,p=u.titleMethod,f=u.headerCellStyle,t=u.slots,x=t?t.title:null,m=i===g.length-1,v=m&&y?r[s]:null;return h("tr",{key:i},e.map(function(e,t){var a=e.field,n=e.childCount,r=e.dateObj,l="".concat(e.title),o=(i<g.length-1?l="day"===u.type?getI18n("vxe.gantt.dayss.w".concat(r.e)):getI18n("vxe.gantt.".concat(!i&&1<g.length?"tFullFormat":"tSimpleFormat",".").concat(s),r):m&&"week"===u.type&&(l=getI18n("vxe.gantt.tSimpleFormat.".concat(s),r)),l),c={source:sourceType,type:viewType,column:e,scaleObj:u,title:l,dateObj:r,$rowIndex:i},e=(x?o=w.callSlot(x,c,h):p?o="".concat(p(c)):d&&(o=_xeUtils.default.toDateString(r.date,d)),{});return f&&(e=_xeUtils.default.isFunction(f)?f(c):f),h("th",{key:t,class:["vxe-gantt-view--header-column",{"is--now":y&&v&&v===a}],attrs:{colspan:n||null,title:x?null:l},style:e,on:{contextmenu:function(e){w.handleTaskHeaderContextmenuEvent(e,c)}}},o)}))}))])])])}},mounted:function(){var e=this,t=e.$xeGanttView.internalData.elemStore,a="main-header-";t["".concat(a,"wrapper")]=e.$refs.refElem,t["".concat(a,"scroll")]=e.$refs.refHeaderScroll,t["".concat(a,"table")]=e.$refs.refHeaderTable,t["".concat(a,"xSpace")]=e.$refs.refHeaderXSpace},destroyed:function(){var e=this.$xeGanttView.internalData.elemStore,t="main-header-";e["".concat(t,"wrapper")]=null,e["".concat(t,"scroll")]=null,e["".concat(t,"table")]=null,e["".concat(t,"xSpace")]=null},render:function(e){return this.renderVN(e)}});
|