From 14ca792ff0a07c02e8c57f9e1375ae112ac4f110 Mon Sep 17 00:00:00 2001 From: chenyongxin <59717382+Cyx649312038@users.noreply.github.com> Date: Thu, 24 Oct 2024 19:48:33 +0800 Subject: [PATCH] feat: plugin-calendar add default view settings and internationalization configurations (#5487) * feat: changeBranch * feat: plugin-calendar add default view settings and internationalization configurations --- .../src/client/calendar/Calendar.tsx | 10 ++++-- .../src/client/calendar/Calender.Settings.tsx | 31 ++++++++++++++++++- .../CalendarBlockProvider.tsx | 4 ++- .../plugin-calendar/src/locale/zh-CN.json | 3 +- 4 files changed, 42 insertions(+), 6 deletions(-) diff --git a/packages/plugins/@nocobase/plugin-calendar/src/client/calendar/Calendar.tsx b/packages/plugins/@nocobase/plugin-calendar/src/client/calendar/Calendar.tsx index 3c83909f2..4e6134600 100644 --- a/packages/plugins/@nocobase/plugin-calendar/src/client/calendar/Calendar.tsx +++ b/packages/plugins/@nocobase/plugin-calendar/src/client/calendar/Calendar.tsx @@ -25,7 +25,7 @@ import { parseExpression } from 'cron-parser'; import type { Dayjs } from 'dayjs'; import dayjs from 'dayjs'; import get from 'lodash/get'; -import React, { useMemo, useState } from 'react'; +import React, { useMemo, useState, useEffect } from 'react'; import { Calendar as BigCalendar, View, dayjsLocalizer } from 'react-big-calendar'; import * as dates from 'react-big-calendar/lib/utils/dates'; import { i18nt, useTranslation } from '../../locale'; @@ -236,10 +236,10 @@ export const Calendar: any = withDynamicSchemaProps( }); // 新版 UISchema(1.0 之后)中已经废弃了 useProps,这里之所以继续保留是为了兼容旧版的 UISchema - const { dataSource, fieldNames, showLunar } = useProps(props); + const { dataSource, fieldNames, showLunar, defaultView } = useProps(props); const height = useCalenderHeight(); const [date, setDate] = useState(new Date()); - const [view, setView] = useState('month'); + const [view, setView] = useState(props.defaultView || 'month'); const { events, enumList } = useEvents(dataSource, fieldNames, date, view); const [record, setRecord] = useState({}); const { wrapSSR, hashId, componentCls: containerClassName } = useStyle(); @@ -254,6 +254,10 @@ export const Calendar: any = withDynamicSchemaProps( const startFieldName = fieldNames?.start?.[0]; const endFieldName = fieldNames?.end?.[0]; + useEffect(() => { + setView(props.defaultView); + }, [props.defaultView]); + const components = useMemo(() => { return { toolbar: (props) => , diff --git a/packages/plugins/@nocobase/plugin-calendar/src/client/calendar/Calender.Settings.tsx b/packages/plugins/@nocobase/plugin-calendar/src/client/calendar/Calender.Settings.tsx index e9cb4fb3a..3cc9a7ddb 100644 --- a/packages/plugins/@nocobase/plugin-calendar/src/client/calendar/Calender.Settings.tsx +++ b/packages/plugins/@nocobase/plugin-calendar/src/client/calendar/Calender.Settings.tsx @@ -116,7 +116,6 @@ export const calendarBlockSettings = new SchemaSettings({ { label: t('Not selected'), value: '' }, ...fliedList.filter((item) => item.interface === 'radioGroup' || item.interface === 'select'), ]; - return { title: t('Background color field'), value: fieldNames.colorFieldName || '', @@ -138,6 +137,36 @@ export const calendarBlockSettings = new SchemaSettings({ }; }, }, + { + name: 'defaultView', + Component: SchemaSettingsSelectItem, + useComponentProps() { + const { t } = useTranslation(); + const fieldSchema = useFieldSchema(); + const field = useField(); + const { dn } = useDesignable(); + return { + title: t('Default view'), + value: field['decoratorProps']['defaultView'] || 'month', + options: [ + { value: 'month', label: '月' }, + { value: 'week', label: '周' }, + { value: 'day', label: '天' }, + ], + onChange: (v) => { + field.decoratorProps.defaultView = v; + fieldSchema['x-decorator-props']['defaultView'] = v; + dn.emit('patch', { + schema: { + ['x-uid']: fieldSchema['x-uid'], + 'x-decorator-props': field.decoratorProps, + }, + }); + dn.refresh(); + }, + }; + }, + }, { name: 'showLunar', Component: ShowLunarDesignerItem, diff --git a/packages/plugins/@nocobase/plugin-calendar/src/client/schema-initializer/CalendarBlockProvider.tsx b/packages/plugins/@nocobase/plugin-calendar/src/client/schema-initializer/CalendarBlockProvider.tsx index 44f4cb710..74fd13972 100644 --- a/packages/plugins/@nocobase/plugin-calendar/src/client/schema-initializer/CalendarBlockProvider.tsx +++ b/packages/plugins/@nocobase/plugin-calendar/src/client/schema-initializer/CalendarBlockProvider.tsx @@ -17,7 +17,7 @@ export const CalendarBlockContext = createContext({}); CalendarBlockContext.displayName = 'CalendarBlockContext'; const InternalCalendarBlockProvider = (props) => { - const { fieldNames, showLunar } = props; + const { fieldNames, showLunar, defaultView } = props; const field = useField(); const { resource, service } = useBlockRequestContext(); @@ -30,6 +30,7 @@ const InternalCalendarBlockProvider = (props) => { resource, fieldNames, showLunar, + defaultView, fixedBlock: field?.decoratorProps?.fixedBlock, }} > @@ -83,6 +84,7 @@ export const useCalendarBlockProps = () => { return { fieldNames: ctx.fieldNames, showLunar: ctx.showLunar, + defaultView: ctx.defaultView, fixedBlock: ctx.fixedBlock, }; }; diff --git a/packages/plugins/@nocobase/plugin-calendar/src/locale/zh-CN.json b/packages/plugins/@nocobase/plugin-calendar/src/locale/zh-CN.json index ef08e7ff1..e7f76b1bc 100644 --- a/packages/plugins/@nocobase/plugin-calendar/src/locale/zh-CN.json +++ b/packages/plugins/@nocobase/plugin-calendar/src/locale/zh-CN.json @@ -48,5 +48,6 @@ "Week": "周", "{{count}} more items": "{{count}} 更多事项", "Background color field": "背景颜色字段", - "Not selected": "未选择" + "Not selected": "未选择", + "Default view": "默认视图" }