UI - МЕЖПРОЕКТНАЯ КОММУНИКАЦИЯ: выравнивание home Gantt-шкалы
This commit is contained in:
@@ -167,7 +167,14 @@ const getTimelineBounds = (items: TGanttTimelinePreviewItem[], settings: TRangeS
|
||||
};
|
||||
};
|
||||
|
||||
const getTimelineTicks = (startDate: Date, endDate: Date, dayWidth: number, stepDays: number, locale: string) => {
|
||||
const getTimelineTicks = (
|
||||
startDate: Date,
|
||||
endDate: Date,
|
||||
dayWidth: number,
|
||||
stepDays: number,
|
||||
locale: string,
|
||||
today: Date
|
||||
) => {
|
||||
const formatter = new Intl.DateTimeFormat(locale || "ru-RU", {
|
||||
day: "numeric",
|
||||
month: "short",
|
||||
@@ -178,6 +185,7 @@ const getTimelineTicks = (startDate: Date, endDate: Date, dayWidth: number, step
|
||||
const date = addDays(startDate, index * stepDays);
|
||||
return {
|
||||
id: date.toISOString(),
|
||||
isToday: startOfDay(date).getTime() === startOfDay(today).getTime(),
|
||||
label: formatter.format(date).toUpperCase(),
|
||||
left: getDaysBetween(startDate, date) * dayWidth,
|
||||
};
|
||||
@@ -320,8 +328,7 @@ export function GanttTimelinePreview(props: TGanttTimelinePreviewProps) {
|
||||
blocks,
|
||||
canvasWidth,
|
||||
gridLines: getTimelineGridLines(startDate, endDate, settings.dayWidth),
|
||||
ticks: getTimelineTicks(startDate, endDate, settings.dayWidth, settings.tickStepDays, locale),
|
||||
todayLabel: getShortDateLabel(today, locale),
|
||||
ticks: getTimelineTicks(startDate, endDate, settings.dayWidth, settings.tickStepDays, locale, today),
|
||||
timelineWidth,
|
||||
todayLeft: getDaysBetween(startDate, today) * settings.dayWidth,
|
||||
};
|
||||
@@ -557,13 +564,17 @@ export function GanttTimelinePreview(props: TGanttTimelinePreviewProps) {
|
||||
/>
|
||||
))}
|
||||
{timeline.ticks.map((tick) => (
|
||||
<div key={tick.id} className="nodedc-home-gantt-grid-label" style={{ left: `${tick.left}px` }}>
|
||||
{tick.label}
|
||||
<div
|
||||
key={tick.id}
|
||||
className={cn("nodedc-home-gantt-grid-label", {
|
||||
"nodedc-home-gantt-grid-label-today": tick.isToday,
|
||||
})}
|
||||
style={{ left: `${tick.left}px` }}
|
||||
>
|
||||
<span>{tick.label}</span>
|
||||
</div>
|
||||
))}
|
||||
<div className="nodedc-home-gantt-today-marker" style={{ left: `${timeline.todayLeft}px` }}>
|
||||
<span className="nodedc-home-gantt-today-pill">Сегодня · {timeline.todayLabel}</span>
|
||||
</div>
|
||||
<div className="nodedc-home-gantt-today-marker" style={{ left: `${timeline.todayLeft}px` }} />
|
||||
</div>
|
||||
|
||||
{selectedPreviewItemId && selectedPreviewItem && (
|
||||
|
||||
Reference in New Issue
Block a user