Browse Source

fix(nc-gui): some changes

pull/7611/head
DarkPhoenix2704 9 months ago
parent
commit
c472ce0339
  1. 11
      packages/nc-gui/components/smartsheet/calendar/SideMenu.vue
  2. 61
      packages/nc-gui/composables/useCalendarViewStore.ts

11
packages/nc-gui/components/smartsheet/calendar/SideMenu.vue

@ -286,7 +286,14 @@ const sideBarListScrollHandle = useDebounceFn(async (e: Event) => {
<div class="px-4 relative flex flex-col gap-y-6 pt-4">
<div class="flex items-center gap-2">
<a-input v-model:value="searchQuery.value" class="!rounded-lg !h-8 !border-gray-200 !px-4" placeholder="Search records">
<a-input
v-model:value="searchQuery.value"
:class="{
'!border-brand-500': searchQuery.value.length > 0,
}"
class="!rounded-lg !h-8 !border-gray-200 !px-4"
placeholder="Search records"
>
<template #prefix>
<component :is="iconMap.search" class="h-4 w-4 mr-1 text-gray-500" />
</template>
@ -306,7 +313,7 @@ const sideBarListScrollHandle = useDebounceFn(async (e: Event) => {
>
<NcButton
v-if="isUIAllowed('dataEdit') && props.visible"
class="!absolute right-5 bottom-5 !h-12 !w-12"
class="!absolute right-5 !border-brand-500 bottom-5 !h-12 !w-12"
type="secondary"
@click="emit('new-record', { row: {} })"
>

61
packages/nc-gui/composables/useCalendarViewStore.ts

@ -157,17 +157,23 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
sideBarFilterOption.value === 'selectedDate' ||
sideBarFilterOption.value === 'selectedHours'
) {
let prevDate: string | null | dayjs.Dayjs = null
let fromDate: string | null | dayjs.Dayjs = null
let toDate: string | null | dayjs.Dayjs = null
let nextDate: string | null | dayjs.Dayjs = null
switch (sideBarFilterOption.value) {
case 'day':
fromDate = selectedDate.value.startOf('day')
toDate = selectedDate.value.endOf('day')
prevDate = selectedDate.value.subtract(1, 'day').endOf('day')
nextDate = selectedDate.value.add(1, 'day').startOf('day')
break
case 'week':
prevDate = selectedDateRange.value.start.subtract(1, 'day').endOf('day')
fromDate = selectedDateRange.value.start.startOf('day')
toDate = selectedDateRange.value.end.endOf('day')
nextDate = selectedDateRange.value.end.add(1, 'day').startOf('day')
break
case 'month': {
const startOfMonth = selectedMonth.value.startOf('month')
@ -176,29 +182,36 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
const daysToDisplay = Math.max(endOfMonth.diff(startOfMonth, 'day') + 1, 35)
fromDate = startOfMonth.subtract((startOfMonth.day() + 7) % 7, 'day').add(1, 'day')
toDate = fromDate.add(daysToDisplay, 'day').endOf('day')
prevDate = fromDate.subtract(1, 'day').endOf('day')
nextDate = toDate.add(1, 'day').startOf('day')
break
}
case 'year':
fromDate = selectedDate.value.startOf('year')
toDate = selectedDate.value.endOf('year')
prevDate = fromDate.subtract(1, 'day').endOf('day')
nextDate = toDate.add(1, 'day').startOf('day')
break
case 'selectedDate':
fromDate = selectedDate.value.startOf('day')
toDate = selectedDate.value.endOf('day')
prevDate = selectedDate.value.subtract(1, 'day').endOf('day')
nextDate = selectedDate.value.add(1, 'day').startOf('day')
break
case 'selectedHours':
fromDate = selectedTime.value?.startOf('hour')
toDate = selectedTime.value?.endOf('hour')
prevDate = fromDate?.subtract(1, 'hour').endOf('hour')
nextDate = toDate?.add(1, 'hour').startOf('hour')
break
}
if (calDataType.value === UITypes.Date) {
fromDate = fromDate!.format('YYYY-MM-DD')
toDate = toDate!.format('YYYY-MM-DD')
} else {
fromDate = fromDate!.format('YYYY-MM-DD HH:mm:ssZ')
toDate = toDate!.format('YYYY-MM-DD HH:mm:ssZ')
}
prevDate = prevDate!.format('YYYY-MM-DD HH:mm:ssZ')
nextDate = nextDate!.format('YYYY-MM-DD HH:mm:ssZ')
calendarRange.value.forEach((range) => {
const fromCol = range.fk_from_col
@ -221,15 +234,15 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
children: [
{
fk_column_id: fromCol.id,
comparison_op: 'lte',
comparison_op: 'lt',
comparison_sub_op: 'exactDate',
value: toDate,
value: nextDate,
},
{
fk_column_id: toCol.id,
comparison_op: 'gte',
comparison_op: 'gt',
comparison_sub_op: 'exactDate',
value: fromDate,
value: prevDate,
},
],
},
@ -265,7 +278,7 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
fk_column_id: fromCol.id,
comparison_op: 'btw',
comparison_sub_op: 'exactDate',
value: `${fromDate},${toDate}`,
value: `${prevDate},${nextDate}`,
},
]
}
@ -341,13 +354,17 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
children: [],
}
let prevDate: string | null | dayjs.Dayjs = null
let fromDate: dayjs.Dayjs | null | string = null
let toDate: dayjs.Dayjs | null | string = null
let nextDate: string | null | dayjs.Dayjs = null
switch (activeCalendarView.value) {
case 'week':
fromDate = selectedDateRange.value.start.startOf('day')
toDate = selectedDateRange.value.end.endOf('day')
prevDate = selectedDateRange.value.start.subtract(1, 'day').endOf('day')
nextDate = selectedDateRange.value.end.add(1, 'day').startOf('day')
break
case 'month': {
const startOfMonth = selectedMonth.value.startOf('month')
@ -356,20 +373,28 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
const daysToDisplay = Math.max(endOfMonth.diff(startOfMonth, 'day') + 1, 35)
fromDate = startOfMonth.subtract((startOfMonth.day() + 7) % 7, 'day')
toDate = fromDate.add(daysToDisplay, 'day')
prevDate = fromDate.subtract(1, 'day').endOf('day')
nextDate = toDate.add(1, 'day').startOf('day')
break
}
case 'year':
fromDate = selectedDate.value.startOf('year')
toDate = selectedDate.value.endOf('year')
prevDate = fromDate.subtract(1, 'day').endOf('day')
nextDate = toDate.add(1, 'day').startOf('day')
break
case 'day':
fromDate = selectedDate.value.startOf('day')
toDate = selectedDate.value.endOf('day')
prevDate = selectedDate.value.subtract(1, 'day').endOf('day')
nextDate = selectedDate.value.add(1, 'day').startOf('day')
break
}
fromDate = fromDate!.format('YYYY-MM-DD HH:mm:ssZ')
toDate = toDate!.format('YYYY-MM-DD HH:mm:ssZ')
prevDate = prevDate!.format('YYYY-MM-DD HH:mm:ssZ')
nextDate = nextDate!.format('YYYY-MM-DD HH:mm:ssZ')
calendarRange.value.forEach((range) => {
const fromCol = range.fk_from_col
@ -392,15 +417,15 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
children: [
{
fk_column_id: fromCol.id,
comparison_op: 'lte',
comparison_op: 'lt',
comparison_sub_op: 'exactDate',
value: toDate,
value: nextDate,
},
{
fk_column_id: toCol.id,
comparison_op: 'gte',
comparison_op: 'gt',
comparison_sub_op: 'exactDate',
value: fromDate,
value: prevDate,
},
],
},
@ -436,7 +461,7 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
fk_column_id: fromCol.id,
comparison_op: 'btw',
comparison_sub_op: 'exactDate',
value: `${fromDate},${toDate}`,
value: `${prevDate},${nextDate}`,
},
]
}
@ -701,6 +726,12 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
}
})
watch(selectedTime, async () => {
if (calDataType.value !== UITypes.Date) {
await loadSidebarData()
}
})
watch(selectedMonth, async (value, oldValue) => {
if (activeCalendarView.value !== 'month') return
if (value.month() !== oldValue.month()) {

Loading…
Cancel
Save