feat: plugin-calendar add default view settings and internationalization configurations (#5487)

* feat: changeBranch

* feat: plugin-calendar add default view settings and internationalization configurations

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<Date>(new Date());
-      const [view, setView] = useState<View>('month');
+      const [view, setView] = useState<View>(props.defaultView || 'month');
       const { events, enumList } = useEvents(dataSource, fieldNames, date, view);
       const [record, setRecord] = useState<any>({});
       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) => <Toolbar {...props} showLunar={showLunar}></Toolbar>,

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,

packages/plugins/@nocobase/plugin-calendar/src/client/schema-initializer/CalendarBlockProvider.tsx

@@ -17,7 +17,7 @@ export const CalendarBlockContext = createContext<any>({});
 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,
   };
 };

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": "默认视图"
 }