Merge branch 'develop'

# Conflicts:
#	README_ZH.md
#	src/test/Demo.tsx

Dockerfile

@@ -1,40 +1,40 @@
-#############如果你想Docker执行全流程的构建，则运行下面的多阶段构建任务######################
-# 第一阶段：编译构建
-#使用node镜像作为基础镜像(lts:node长期支持版本)
-FROM node:lts as build
-#设置工作目录
-WORKDIR /usr/app
-#复制构建编译所必须的文件到工作目录
-COPY . .
-#安装pnpm
-RUN npm install -g [email protected]
-#安装依赖并构建
-RUN pnpm install && pnpm run build
+##############如果你想Docker执行全流程的构建，则运行下面的多阶段构建任务######################
+## 第一阶段：编译构建
+##使用node镜像作为基础镜像(lts:node长期支持版本)
+#FROM node:lts as build
+##设置工作目录
+#WORKDIR /usr/app
+##复制构建编译所必须的文件到工作目录
+#COPY . .
+##安装pnpm
+#RUN npm install -g [email protected]
+##安装依赖并构建
+#RUN pnpm install && pnpm run build
+#
+## 第二阶段：运行
+##使用nginx镜像作为基础镜像
+#FROM nginx:alpine as runner
+##设置工作目录
+#WORKDIR /usr/app/light-chaser
+##覆盖默认配置文件
+#COPY ./nginx.conf /etc/nginx/conf.d/default.conf
+## 将构建阶段的 dist 目录复制到 Nginx 的 web 根目录
+#COPY --from=build /usr/app/dist /usr/app/light-chaser
+## 启动 Nginx
+#CMD ["nginx", "-g", "daemon off;"]
+
+
+#############如果你想自己编译后上传文件到Docker镜像，请使用下面的构建脚本######################
 
-# 第二阶段：运行
 #使用nginx镜像作为基础镜像
-FROM nginx:alpine as runner
+FROM nginx:alpine
 #设置工作目录
 WORKDIR /usr/app/light-chaser
-#覆盖默认配置文件
+#将dist文件夹中的文件复制到工作目录
+COPY ./dist .
+#将nginx配置文件复制到/etc/nginx/conf.d/目录
 COPY ./nginx.conf /etc/nginx/conf.d/default.conf
-# 将构建阶段的 dist 目录复制到 Nginx 的 web 根目录
-COPY --from=build /usr/app/dist /usr/app/light-chaser
-# 启动 Nginx
+#暴露80端口
+EXPOSE 80
+## 启动Nginx服务
 CMD ["nginx", "-g", "daemon off;"]
-
-
-#############如果你想自己编译后上传文件到Docker镜像，请使用下面的构建脚本######################
-
-##使用nginx镜像作为基础镜像
-#FROM node:lts
-##设置工作目录
-#WORKDIR /usr/app/light-chaser
-##将dist文件夹中的文件复制到工作目录
-#COPY ./dist /usr/app/light-chaser
-##将nginx配置文件复制到/etc/nginx/conf.d/目录
-#COPY ./nginx.conf /etc/nginx/conf.d/default.conf
-##暴露80端口
-#EXPOSE 80
-### 启动Nginx服务
-#CMD ["nginx", "-g", "daemon off;"]

package.json

@@ -17,6 +17,8 @@
     "@scena/react-ruler": "^0.17.1",
     "antd": "^5.12.2",
     "countup.js": "^2.8.0",
+    "flv.js": "^1.6.2",
+    "hls.js": "^1.5.11",
     "localforage": "^1.10.0",
     "lodash": "^4.17.21",
     "mobx": "^6.7.0",

src/comps/antd-common/bar/AntdCommonBarController.ts

@@ -13,7 +13,7 @@ export interface AntdBarProps extends ComponentBaseProps {
 export default class AntdCommonBarController extends AntdBaseDesignerController<Bar, AntdBarProps> {
 
     async create(container: HTMLElement, config: AntdBarProps): Promise<void> {
-        await super.commonCreate(container, Bar, config);
+        super.commonCreate(container, Bar, config);
     }
 
     destroy(): void {

src/comps/antd-common/column/AntdCommonColumnController.ts

@@ -13,7 +13,7 @@ export interface AntdColumnProps extends ComponentBaseProps {
 export default class AntdCommonColumnController extends AntdBaseDesignerController<Column, AntdColumnProps> {
 
     async create(container: HTMLElement, config: AntdColumnProps): Promise<void> {
-        await super.commonCreate(container, Column, config);
+        super.commonCreate(container, Column, config);
     }
 
     destroy(): void {

src/comps/antd-common/config/axis/AxisConfig.tsx

@@ -1,13 +1,13 @@
-import React, {Component, useState} from 'react';
-import './AxisConfig.less';
+import React, {Component, lazy, useState} from 'react';
 import {Axis} from "@antv/g2plot";
 import {isEqual} from "lodash";
 import {Control} from "../../../../json-schema/SchemaTypes";
 import {FieldChangeData, LCGUI} from "../../../../json-schema/LCGUI";
-import Accordion from "../../../../json-schema/ui/accordion/Accordion";
-import Radio from "../../../../json-schema/ui/radio/Radio";
 import {ShapeAttrs} from "@antv/g-base";
 
+const Accordion = lazy(() => import("../../../../json-schema/ui/accordion/Accordion"));
+const Radio = lazy(() => import("../../../../json-schema/ui/radio/Radio"));
+
 
 interface AxisConfigProps {
     config?: Axis;

src/comps/antd-common/line/AntdCommonLineController.ts

@@ -13,7 +13,7 @@ export interface AntdLineProps extends ComponentBaseProps {
 export default class AntdCommonLineController extends AntdBaseDesignerController<Line, AntdLineProps> {
 
     async create(container: HTMLElement, config: AntdLineProps): Promise<void> {
-        await super.commonCreate(container, Line, config);
+        super.commonCreate(container, Line, config);
     }
 
     destroy(): void {

src/comps/antd-common/rose/AntdCommonRoseController.ts

@@ -13,7 +13,7 @@ export interface AntdRoseProps extends ComponentBaseProps {
 export default class AntdCommonRoseController extends AntdBaseDesignerController<Rose, AntdRoseProps> {
 
     async create(container: HTMLElement, config: AntdRoseProps): Promise<void> {
-        await super.commonCreate(container, Rose, config);
+        super.commonCreate(container, Rose, config);
     }
 
     destroy(): void {

src/comps/antd-common/scatter/AntdCommonScatterController.ts

@@ -13,7 +13,7 @@ export interface AntdScatterProps extends ComponentBaseProps {
 export default class AntdCommonScatterController extends AntdBaseDesignerController<Scatter, AntdScatterProps> {
 
     async create(container: HTMLElement, config: AntdScatterProps): Promise<void> {
-        await super.commonCreate(container, Scatter, config);
+        super.commonCreate(container, Scatter, config);
     }
 
     destroy(): void {

src/comps/common-component/data-config/database/DatabaseConfig.tsx

@@ -2,12 +2,13 @@ import AbstractDesignerController from "../../../../framework/core/AbstractDesig
 import {FieldChangeData, LCGUI} from "../../../../json-schema/LCGUI.tsx";
 import {Control} from "../../../../json-schema/SchemaTypes.ts";
 import {useEffect, useRef, useState} from "react";
-import {DataSourceConfigType} from "../../../../pages/home/datasource/edit/EditDataSourceDialog.tsx";
 import {globalMessage} from "../../../../framework/message/GlobalMessage.tsx";
 import {ISelectOption} from "../../../../json-schema/ui/select/Select.tsx";
 import ObjectUtil from "../../../../utils/ObjectUtil.ts";
 import {IDatabase} from "../../../../designer/DesignerType.ts";
 import FetchUtil from "../../../../utils/FetchUtil.ts";
+import {IDataSource} from "../../../../pages/home/datasource/DataSourceStore.ts";
+import Base64Util from "../../../../utils/Base64Util.ts";
 
 export interface DatabaseDataConfigProps {
     controller: AbstractDesignerController;
@@ -24,7 +25,7 @@ export function DatabaseDataConfig(props: DatabaseDataConfigProps) {
     useEffect(() => {
         FetchUtil.get(`/api/datasource/list`).then(res => {
             if (res.code === 200) {
-                const options = (res.data as Array<DataSourceConfigType>).map(item => {
+                const options = (res.data as Array<IDataSource>).map(item => {
                     return {label: item.name, value: item.id}
                 })
                 setDataSourceList(options as ISelectOption[]);
@@ -55,7 +56,9 @@ export function DatabaseDataConfig(props: DatabaseDataConfigProps) {
             return;
 
         const {targetDb, sql, filter} = dataRef.current;
-        FetchUtil.post(`/api/db/executor/execute`, {id: targetDb, sql}).then(res => {
+        if (!sql || sql === '')
+            return;
+        FetchUtil.post(`/api/db/executor/execute`, {id: targetDb, sql: Base64Util.toBase64(sql)}).then(res => {
             let {data, code, msg} = res;
             if (code === 200) {
                 if (filter && filter !== '') {

src/comps/group-layer/GroupLayer.tsx

@@ -1,9 +1,9 @@
 import React from "react";
 import GroupLayerController from "./GroupLayerController";
 import {AbstractDefinition} from "../../framework/core/AbstractDefinition";
-import DesignerLoaderFactory from "../../designer/loader/DesignerLoaderFactory";
-import {DesignerMode, ILayerItem} from "../../designer/DesignerType";
+import {ILayerItem} from "../../designer/DesignerType";
 import layerManager from "../../designer/manager/LayerManager.ts";
+import editorDesignerLoader from "../../designer/loader/EditorDesignerLoader.ts";
 
 export interface GroupLayerStyleProps {
     children?: React.ReactNode;
@@ -24,7 +24,7 @@ export default class GroupLayer extends React.PureComponent<GroupLayerStyleProps
     componentDidMount(): void {
         const {layer} = this.props;
         const {elemConfigs, compController} = layerManager;
-        const groupDefinition: AbstractDefinition = DesignerLoaderFactory.getLoader(DesignerMode.EDIT).definitionMap['group'];
+        const groupDefinition: AbstractDefinition = editorDesignerLoader.definitionMap['group'];
         let config;
         if (layer.id! in compController!) {
             //重新编组后，被编组组件会重新渲染，需从之前的实例中获取原有数据

src/comps/lc/base-table/BaseTableController.ts

@@ -23,8 +23,8 @@ export class BaseTableController extends AbstractDesignerController<BaseTableCom
     }
 
     changeData(data: any) {
-        const style = ObjectUtil.merge(this.config?.style, {data});
-        this.instance?.updateConfig(style);
+        this.config = ObjectUtil.merge(this.config, {style: {data}, data: {staticData: data}});
+        this.instance?.updateConfig(this.config!);
     }
 
     update(config: BaseTableComponentProps, upOp?: UpdateOptions | undefined): void {

src/comps/lc/base-text/BaseTextComponent.tsx

@@ -1,6 +1,17 @@
-import {CSSProperties, ForwardedRef, forwardRef, useImperativeHandle, useRef, useState} from 'react';
+import {
+    ChangeEvent,
+    Component,
+    CSSProperties,
+    ForwardedRef,
+    forwardRef,
+    useImperativeHandle,
+    useRef,
+    useState
+} from 'react';
 import {ComponentBaseProps} from "../../common-component/CommonTypes.ts";
 import './BaseTextComponent.less';
+import layerManager from "../../../designer/manager/LayerManager.ts";
+import layerListStore from "../../../designer/left/layer-list/LayerListStore.ts";
 
 export interface BaseTextComponentStyle {
     color?: string;
@@ -46,6 +57,18 @@ export const BaseTextComponent = forwardRef((props: BaseTextComponentProps, ref:
         WebkitTextStrokeColor: style?.strokeColor,
     }
 
+    /**
+     * 只在编辑模式下有效
+     * @param e
+     */
+    const changeContent = (e: ChangeEvent<HTMLInputElement>) => {
+        data!.staticData = e.target.value;
+        layerManager.layerConfigs[config.base?.id!].name = e.target.value;
+        const {layerInstances} = layerListStore;
+        const layerInstance = layerInstances[config.base?.id!];
+        layerInstance && (layerInstance as Component).setState({name: e.target.value});
+    }
+
     return (
         <div onDoubleClick={() => setEdit(true)}
              ref={textRef}
@@ -55,7 +78,7 @@ export const BaseTextComponent = forwardRef((props: BaseTextComponentProps, ref:
              onClick={onClick}>
             {edit ? <input
                 ref={(ref) => ref?.select()}
-                onChange={(e) => data!.staticData = e.target.value}
+                onChange={changeContent}
                 onBlur={() => setEdit(false)}
                 autoFocus={true}
                 type={'text'}

src/comps/lc/base-text/BaseTextConfig.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {Component} from 'react';
 import {FieldChangeData, LCGUI} from "../../../json-schema/LCGUI";
 import {Control} from "../../../json-schema/SchemaTypes";
 import {BaseTextController} from "./BaseTextController";
@@ -11,14 +11,27 @@ import {
     AlignTopTwo,
     AlignVerticalCenterTwo
 } from "@icon-park/react";
+import layerListStore from "../../../designer/left/layer-list/LayerListStore.ts";
+import layerManager from "../../../designer/manager/LayerManager.ts";
 
 export const BaseTextStyleConfig: React.FC<ConfigType<BaseTextController>> = ({controller}) => {
 
-    const {data, style} = controller.getConfig()!;
+    const {data, style, base} = controller.getConfig()!;
+
+    const changeContent = (data: string) => {
+        controller.update({data: {staticData: data}});
+        layerManager.layerConfigs[base?.id!].name = data;
+        const {layerInstances} = layerListStore;
+        const layerInstance = layerInstances[base?.id!];
+        layerInstance && (layerInstance as Component).setState({name: data});
+    }
 
     const onFieldChange = (fieldChangeData: FieldChangeData) => {
-        const {dataFragment} = fieldChangeData;
-        controller.update(dataFragment!);
+        const {dataFragment, id, data} = fieldChangeData;
+        if (id === 'baseTextContent')
+            changeContent(data as string)
+        else
+            controller.update(dataFragment!);
     }
 
     const schema: Control = {
@@ -29,6 +42,7 @@ export const BaseTextStyleConfig: React.FC<ConfigType<BaseTextController>> = ({c
                 key: 'data',
                 children: [
                     {
+                        id: 'baseTextContent',
                         key: 'staticData',
                         type: 'text-area',
                         label: '内容',