Browse Source

fix: disable spanning events if no fk_to_column fix: correct hover and drag effect for dragging and resizing

pull/9831/head
DarkPhoenix2704 2 days ago
parent
commit
f4aa6bc22a
  1. 6
      packages/nc-gui/components/smartsheet/calendar/DayView/DateTimeField.vue
  2. 12
      packages/nc-gui/components/smartsheet/calendar/MonthView.vue
  3. 18
      packages/nc-gui/components/smartsheet/calendar/WeekView/DateTimeField.vue

6
packages/nc-gui/components/smartsheet/calendar/DayView/DateTimeField.vue

@ -895,7 +895,11 @@ const expandRecord = (record: Row) => {
<template>
<div class="h-[calc(100vh-5.3rem)] overflow-y-auto nc-scrollbar-md">
<SmartsheetCalendarDateTimeSpanningContainer :records="recordsAcrossAllRange.spanningRecords" @expand-record="expandRecord" />
<SmartsheetCalendarDateTimeSpanningContainer
v-if="calendarRange.some((range) => range.fk_to_col !== null && range.fk_to_col !== undefined)"
:records="recordsAcrossAllRange.spanningRecords"
@expand-record="expandRecord"
/>
<div ref="container" class="w-full flex relative no-selection" data-testid="nc-calendar-day-view" @drop="dropEvent">
<div
v-if="shouldEnableOverlay"

12
packages/nc-gui/components/smartsheet/calendar/MonthView.vue

@ -872,7 +872,11 @@ const addRecord = (date: dayjs.Dayjs) => {
? ' 0px 12px 16px -4px rgba(0, 0, 0, 0.10), 0px 4px 6px -2px rgba(0, 0, 0, 0.06)'
: 'none',
opacity: draggingId === null || record.rowMeta.id === draggingId ? 1 : 0.3,
opacity:
(draggingId === null || record.rowMeta.id === draggingId) &&
(resizeRecord === undefined || record.rowMeta.id === resizeRecord?.rowMeta.id)
? 1
: 0.3,
}"
:class="{
'cursor-pointer': !resizeInProgress,
@ -884,7 +888,11 @@ const addRecord = (date: dayjs.Dayjs) => {
>
<LazySmartsheetRow :row="record">
<LazySmartsheetCalendarRecordCard
:hover="hoverRecord === record.rowMeta.id || record.rowMeta.id === draggingId"
:hover="
hoverRecord === record.rowMeta.id ||
record.rowMeta.id === draggingId ||
record.rowMeta.id === resizeRecord?.rowMeta.id
"
:position="record.rowMeta.position"
:record="record"
:resize="!!record.rowMeta.range?.fk_to_col && isUIAllowed('dataEdit')"

18
packages/nc-gui/components/smartsheet/calendar/WeekView/DateTimeField.vue

@ -907,6 +907,10 @@ const spanningRecordsContainer = ref<HTMLElement | null>(null)
const isExpanded = ref(false)
const isRangeEnabled = computed(() =>
calendarRange.value.some((range) => range.fk_to_col !== null && range.fk_to_col !== undefined),
)
watch(
() => spanningRecordsContainer.value?.isSpanningRecordExpanded(),
() => {
@ -926,8 +930,8 @@ watch(
v-if="!isPublic && dayjs().isBetween(selectedDateRange.start, selectedDateRange.end)"
class="absolute top-16 ml-16 pointer-events-none z-2"
:class="{
'mt-38.5': isExpanded,
'mt-23': !isExpanded,
'mt-38.5': isExpanded && isRangeEnabled,
'mt-23': !isExpanded && isRangeEnabled,
}"
:style="overlayStyle"
>
@ -957,8 +961,8 @@ watch(
</div>
<div
:class="{
'top-16': !isExpanded,
'top-32': isExpanded,
'top-16': !isExpanded && isRangeEnabled,
'top-32': isExpanded && isRangeEnabled,
}"
class="absolute bg-white w-16 z-1"
>
@ -970,7 +974,7 @@ watch(
{{ hour.format('hh a') }}
</div>
</div>
<div class="sticky top-6 bg-white z-3 inset-x-0 w-full">
<div v-if="isRangeEnabled" class="sticky top-6 bg-white z-3 inset-x-0 w-full">
<SmartsheetCalendarDateTimeSpanningContainer
ref="spanningRecordsContainer"
:records="recordsAcrossAllRange.spanningRecords"
@ -980,8 +984,8 @@ watch(
<div
ref="container"
:class="{
'!mt-16 ': !isExpanded,
'mt-32': isExpanded,
'!mt-16 ': !isExpanded && isRangeEnabled,
'mt-32': isExpanded && isRangeEnabled,
}"
class="absolute ml-16 flex w-[calc(100%-64px)]"
>

Loading…
Cancel
Save