feat(UniverSheet): add Lang parameter (#401)

* refactor: 更新样式

* refactor: 移除不需要的设置

* refactor: 重构代码

* refactor: 增加 WorkbookData 参数

* refactor: 精简 options 提高可读性

* refactor: 增加内置接收数据处理逻辑

* refactor: 更新 lang 转换

* refactor: 增加lang配置

* feat: 增加 Lang 自动设置

* chore: bump version 9.0.3

---------

Co-authored-by: zhaijunlei <276318515@qq.com>

Author: ArgoZhang

src/components/BootstrapBlazor.UniverSheet/BootstrapBlazor.UniverSheet.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>9.0.2</Version>
+    <Version>9.0.3</Version>
   </PropertyGroup>
 
   <PropertyGroup>

src/components/BootstrapBlazor.UniverSheet/Components/UniverSheet.razor.cs

@@ -3,6 +3,7 @@
 // Website: https://www.blazor.zone or https://argozhang.github.io/
 
 using Microsoft.AspNetCore.Components;
+using System.Globalization;
 
 namespace BootstrapBlazor.Components;
 
@@ -47,6 +48,16 @@ public partial class UniverSheet
 
     private UniverSheetData? _lastData;
 
+    /// <summary>
+    /// <inheritdoc/>
+    /// </summary>
+    protected override void OnParametersSet()
+    {
+        base.OnParametersSet();
+
+        Lang ??= CultureInfo.CurrentUICulture.Name;
+    }
+
     /// <summary>
     /// <inheritdoc/>
     /// </summary>

src/components/BootstrapBlazor.UniverSheet/Components/UniverSheet.razor.js

@@ -8,11 +8,16 @@ export async function init(id, invoke, options) {
         return;
     }
 
+    const { theme, lang, plugins, data } = options;
     const univerSheet = {
         el,
         invoke,
-        options
+        data,
+        plugins,
+        theme,
+        lang
     };
+
     await createUniverSheetAsync(univerSheet);
     Data.set(id, univerSheet);
 

src/components/BootstrapBlazor.UniverSheet/Components/UniverSheetData.cs

@@ -21,7 +21,12 @@ public class UniverSheetData
     public string? CommandName { get; set; }
 
     /// <summary>
-    /// 获得/设置 数据 默认 null 未设置
+    /// 获得/设置 UniverSheet workbook 数据 默认 null 未设置
+    /// </summary>
+    public object? WorkbookData { get; set; }
+
+    /// <summary>
+    /// 获得/设置 附加业务数据 默认 null 未设置
     /// </summary>
     public object? Data { get; set; }
 }

src/components/BootstrapBlazor.UniverSheet/wwwroot/plugin.js

@@ -1,8 +1,7 @@
 import DataService from './data-service.js'
 
-const { Plugin, Injector, setDependencies, UniverInstanceType } = UniverCore;
+const { Plugin, Injector, setDependencies } = UniverCore;
 
-// 定义插件类
 export class DefaultPlugin extends Plugin {
     static pluginName = 'DefaultPlugin';
 
@@ -28,10 +27,10 @@ export class DefaultPlugin extends Plugin {
     }
 
     receiveData(payload) {
-        const { messageName, commandName, data } = payload;
+        const { messageName, commandName, data, workbookData } = payload;
         if (messageName === null) {
             if (commandName === 'SetWorkbook') {
-                this.setWorkbookData(JSON.parse(data));
+                this.setWorkbookData(JSON.parse(workbookData));
             }
             else if (commandName === 'GetWorkbook') {
                 return this.getWorkbookData();
@@ -65,7 +64,7 @@ export class DefaultPlugin extends Plugin {
         delete data.resources;
         return {
             messageName: null,
-            commandName: 'Save',
+            commandName: null,
             data: JSON.stringify(data)
         };
     }

src/components/BootstrapBlazor.UniverSheet/wwwroot/univer.js

@@ -1,28 +1,28 @@
 import { addScript, addLink } from '../BootstrapBlazor/modules/utility.js'
 import DataService from './data-service.js'
 
-const loadAssets = async () => {
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/react.production.min.js');
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/react-dom.production.min.js');
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/rxjs.umd.min.js');
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/univerjs.presets.umd.min.js');
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/univerjs.preset-sheets-core.umd.min.js');
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/univerjs.preset-sheets-drawing.umd.min.js');
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/univerjs.sheets-zen-editor.umd.min.js');
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/univerjs.preset-sheets-data-validation.umd.min.js');
+const loadAssets = async lang => {
+    console.log(lang, 'lang');
+    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/react.production.min.js');
+    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/react-dom.production.min.js');
+    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/rxjs.umd.min.js');
+    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/univerjs.presets.umd.min.js');
+    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/univerjs.preset-sheets-core/index.umd.min.js');
+    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/univerjs.preset-sheets-drawing/index.umd.min.js');
+    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/univerjs.sheets-zen-editor/index.umd.min.js');
+    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/univerjs.preset-sheets-data-validation/index.umd.min.js');
 
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/univerjs.preset-sheets-core.locales.zh-CN.js');
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/univerjs.preset-sheets-drawing.locales.zhCN.js');
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/univerjs.sheets-zen-editor.locales.zh-CN.js');
-    await addScript('./_content/BootstrapBlazor.UniverSheet/univer/js/univerjs.preset-sheets-data-validation.locales.zh-CN.js');
+    await addScript(`./_content/BootstrapBlazor.UniverSheet/univer/univerjs.preset-sheets-core/locales/${lang}.js`);
+    await addScript(`./_content/BootstrapBlazor.UniverSheet/univer/univerjs.preset-sheets-drawing/locales/${lang}.js`);
+    await addScript(`./_content/BootstrapBlazor.UniverSheet/univer/univerjs.sheets-zen-editor/locales/${lang}.js`);
+    await addScript(`./_content/BootstrapBlazor.UniverSheet/univer/univerjs.preset-sheets-data-validation/locales/${lang}.js`);
 
-    await addLink('./_content/BootstrapBlazor.UniverSheet/univer/css/univer-sheet.bundle.css');
+    await addLink('./_content/BootstrapBlazor.UniverSheet/univer/univer-sheet.bundle.css');
 }
 
-
 export async function createUniverSheetAsync(sheet) {
-    await loadAssets();
-
+    await loadAssets(sheet.lang);
+    
     const { el } = sheet;
     const { LocaleType, merge } = UniverCore;
     const { createUniver } = UniverPresets;
@@ -31,18 +31,18 @@ export async function createUniverSheetAsync(sheet) {
     const { UniverSheetsZenEditorPlugin } = UniverSheetsZenEditor
     const { UniverSheetsDataValidationPlugin } = UniverSheetsDataValidation
     const { UniverSheetsDataValidationUIPlugin } = UniverSheetsDataValidationUi
-    const { defaultTheme } = UniverDesign;
-
+    const lang = sheet.lang.replace('-', '')
+    const langStr = lang.charAt(0).toUpperCase() + lang.slice(1)
     const options = {
-        theme: sheet.options.theme ?? defaultTheme,
-        locale: sheet.options.lang ?? LocaleType.ZH_CN,
+        theme: UniverDesign[sheet.theme] ?? UniverDesign.defaultTheme, //'defaultTheme' | greenTheme
+        locale: lang,
         locales: {
-            [LocaleType.ZH_CN]: merge(
+            [lang]: merge(
                 {},
-                UniverPresetSheetsCoreZhCN,
-                UniverPresetSheetsDrawingZhCN,
-                UniverSheetsZenEditorZhCN,
-                UniverSheetsDataValidationUiZhCN,
+                window[`UniverPresetSheetsCore${langStr}`],
+                window[`UniverPresetSheetsDrawing${langStr}`],
+                window[`UniverSheetsZenEditor${langStr}`],
+                window[`UniverSheetsDataValidationUi${langStr}`],
             ),
         },
         plugins: [
@@ -51,7 +51,7 @@ export async function createUniverSheetAsync(sheet) {
             UniverSheetsDataValidationUIPlugin,
         ]
     };
-    const plugins = sheet.options.plugins ?? {
+    const plugins = sheet.plugins ?? {
         DefaultPlugin: '_content/BootstrapBlazor.UniverSheet/plugin.js'
     };
     for (const name in plugins) {
@@ -70,9 +70,9 @@ export async function createUniverSheetAsync(sheet) {
         ...options
     });
 
-    const { data } = sheet.options.data || {};
-    if (data) {
-        const option = typeof data === 'string' ? JSON.parse(data) : data;
+    const { workbookData } = sheet.data || {};
+    if (workbookData) {
+        const option = typeof workbookData === 'string' ? JSON.parse(workbookData) : workbookData;
         univerAPI.createWorkbook(option);
     }
     else {