light-chaser-pro 1.0.0

package/light-chaser-app/src/comps/common-component/data-source-config/ApiDataConfig.tsx

@@ -0,0 +1,285 @@
+/*
+ * Copyright © 2023-2025 puyinzhen
+ * All rights reserved.
+ *
+ * The copyright of this work (or idea/project/document) is owned by puyinzhen. Without explicit written permission, no part of this work may be reproduced, distributed, or modified in any form for commercial purposes.
+ *
+ * This copyright statement applies to, but is not limited to: concept descriptions, design documents, source code, images, presentation files, and any related content.
+ *
+ * For permission to use this work or any part of it, please contact 1182810784@qq.com to obtain written authorization.
+ */
+
+import {useRef, useState} from "react";
+import {Control, FieldChangeData, globalMessage, LCGUI} from "light-chaser-ui/lib/main";
+import ObjectUtil from "light-chaser-util/lib/ObjectUtil.ts";
+import {APIConfig} from "light-chaser-types/types/DataSourceTypes.ts";
+import {SafeEvalUtil} from "light-chaser-util/lib/SafeEvalUtil.ts";
+import FetchUtil from "../../../util/FetchUtil.ts";
+import DataUtil from "../../../util/DataUtil.ts";
+
+export interface ApiDataConfigProps {
+    data: APIConfig;
+    doTestBefore?: (config: APIConfig) => APIConfig;
+    doTestAfter?: (data: any) => any;
+    /**
+     * @param config 配置数据
+     * @param testData 测试数据
+     */
+    onSave: (config: APIConfig, testData?: any) => void;
+}
+
+export function ApiDataConfig(props: ApiDataConfigProps) {
+    const {data, onSave, doTestBefore, doTestAfter} = props;
+    const dataRef = useRef<APIConfig>(ObjectUtil.merge({
+        url: '',
+        method: 'get',
+        header: {},
+        params: {},
+        autoFlush: false,
+        frequency: 5,
+        filter: undefined,
+    }, data));
+    const apiTestResRef = useRef<string>("")
+    const [count, setCount] = useState(0);
+
+    const schema: Control = {
+        type: 'grid',
+        config: {gridGap: '10px'},
+        children: [
+            {
+                key: 'url',
+                type: 'input',
+                label: '接口地址',
+                value: dataRef.current?.url || '',
+            },
+            {
+                key: 'method',
+                label: '请求方式',
+                type: 'select',
+                value: dataRef.current?.method,
+                config: {
+                    options: [
+                        {value: 'get', label: 'GET'},
+                        {value: 'post', label: 'POST'},
+                    ]
+                }
+            },
+            {
+                type: 'grid',
+                label: '自动更新',
+                config: {columns: 8},
+                children: [
+                    {
+                        key: 'autoFlush',
+                        type: 'switch',
+                        value: !!dataRef.current?.autoFlush,
+                    },
+                    {
+                        key: 'frequency',
+                        type: 'number-input',
+                        config: {
+                            min: 5,
+                            containerStyle: {
+                                gridColumn: '2/9',
+                            }
+                        },
+                        value: dataRef.current?.frequency || 5,
+                    },
+                ]
+            },
+            {
+
+                type: 'card-panel',
+                label: '请求头',
+                tip: '请求头信息，json格式或函数（支持异步）',
+                config: {
+                    contentStyle: {padding: 0}
+                },
+                children: [
+                    {
+                        id: 'headers',
+                        key: 'headers',
+                        type: 'code-editor',
+                        config: {
+                            language: 'javascript',
+                            height: 100,
+                            fullScreen: true
+                        },
+                        value: typeof dataRef.current?.headers === 'object' ? JSON.stringify(dataRef.current?.headers ?? {}, null, 2) : dataRef.current?.headers,
+                    }
+                ]
+            },
+            {
+                type: 'card-panel',
+                tip: '请求参数，json格式或函数（支持异步）',
+                label: '请求参数',
+                config: {
+                    contentStyle: {padding: 0}
+                },
+                children: [
+                    {
+                        id: 'params',
+                        key: 'params',
+                        type: 'code-editor',
+                        config: {
+                            height: 100,
+                            language: 'javascript',
+                            fullScreen: true
+                        },
+                        value: typeof dataRef.current?.params === 'object' ? JSON.stringify(dataRef.current?.params ?? {}, null, 2) : dataRef.current?.params,
+                    }
+                ]
+            },
+            {
+                type: 'card-panel',
+                label: '过滤器',
+                config: {
+                    contentStyle: {padding: 0}
+                },
+                children: [
+                    {
+                        key: 'filter',
+                        type: 'code-editor',
+                        config: {
+                            height: 100,
+                            language: 'javascript',
+                            fullScreen: true
+                        },
+                        value: dataRef.current?.filter || "function filter(data){\n\treturn data\n}",
+                    }
+                ]
+            },
+            {
+                type: 'card-panel',
+                label: '响应结果',
+                config: {
+                    contentStyle: {padding: 0}
+                },
+                children: [
+                    {
+                        id: 'apiTestRes',
+                        type: 'code-editor',
+                        config: {
+                            readonly: true,
+                            height: 130,
+                        },
+                        reRender: true,
+                        value: apiTestResRef.current,
+                    }
+                ]
+            },
+            {
+                type: 'grid',
+                config: {columns: 2},
+                children: [
+                    {
+                        id: 'doTest',
+                        type: 'button',
+                        config: {
+                            children: '测试',
+                            type: 'default',
+                            background: '#474747',
+                        }
+                    },
+                    {
+                        id: 'doSave',
+                        type: 'button',
+                        config: {
+                            children: '保存',
+                        }
+                    }
+                ]
+            },
+        ]
+    }
+
+
+    const validate = () => {
+        if (!dataRef.current?.url) {
+            globalMessage.messageApi?.error('接口地址不能为空');
+            return false;
+        }
+        if (!dataRef.current?.method) {
+            globalMessage.messageApi?.error('请求方式不能为空');
+            return false;
+        }
+        if (typeof dataRef.current.headers === 'string') {
+            const headerStr = dataRef.current.headers.trim();
+            if (headerStr.startsWith('{') || headerStr.startsWith('[')) {
+                // 如果是 JSON 字符串，尝试解析
+                const header = SafeEvalUtil.run(headerStr);
+                if (!header) {
+                    globalMessage.messageApi?.warning('请求头不是标准的json格式，将尝试作为JS对象解析');
+                }
+            }
+        }
+        if (typeof dataRef.current.params === 'string') {
+            const paramStr = dataRef.current.params.trim();
+            if (paramStr.startsWith('{') || paramStr.startsWith('[')) {
+                // 如果是 JSON 字符串，尝试解析
+                const param = SafeEvalUtil.run(paramStr)
+                if (!param) {
+                    globalMessage.messageApi?.warning('请求参数不是标准的json格式，将尝试作为JS对象解析');
+                }
+            }
+        }
+        return true;
+    }
+
+    const doTest = () => {
+        if (!validate())
+            return;
+        let testConfig = dataRef.current;
+        if (doTestBefore)
+            testConfig = doTestBefore(dataRef.current);
+        const {params, headers, url, method, filter} = testConfig!;
+        Promise.all([
+            DataUtil.resolveHeaders(headers),
+            DataUtil.resolveParams(params)
+        ]).then(([resolvedHeaders, resolvedParams]) => {
+            FetchUtil.doRequestNativeResult(url!, method!, resolvedHeaders, resolvedParams).then(res => {
+                if (res) {
+                    if (filter && filter !== '') {
+                        const func = SafeEvalUtil.run(filter);
+                        res = typeof func === 'function' ? func(res) : res;
+                    }
+                    if (res != null) {
+                        apiTestResRef.current = JSON.stringify(res, null, 2);
+                        doTestAfter && doTestAfter(res);
+                    }
+                } else {
+                    apiTestResRef.current = JSON.stringify({msg: '请求错误'}, null, 2);
+                    doTestAfter && doTestAfter(null);
+                    globalMessage.messageApi?.warning('测试未通过');
+                }
+            }).finally(() => {
+                setCount(count + 1);
+            })
+        })
+    }
+
+    const doSave = () => {
+        if (!validate())
+            return;
+        onSave(dataRef.current, SafeEvalUtil.run(apiTestResRef.current));
+    }
+
+    const onFieldChange = (fieldChangeData: FieldChangeData) => {
+        const {reRender, id, dataFragment} = fieldChangeData;
+        if (id === 'doTest')
+            doTest();
+        else if (id === 'doSave')
+            doSave();
+        else if (id === 'apiTestRes')
+            return
+        else {
+            dataRef.current = ObjectUtil.merge(dataRef.current, dataFragment)
+        }
+        if (reRender)
+            setCount(count + 1)
+    }
+
+    return (
+        <LCGUI schema={schema} onFieldChange={onFieldChange}/>
+    );
+}

package/light-chaser-app/src/comps/common-component/data-source-config/CommonApiConfig.tsx

@@ -0,0 +1,210 @@
+/*
+ * Copyright © 2023-2025 puyinzhen
+ * All rights reserved.
+ *
+ * The copyright of this work (or idea/project/document) is owned by puyinzhen. Without explicit written permission, no part of this work may be reproduced, distributed, or modified in any form for commercial purposes.
+ *
+ * This copyright statement applies to, but is not limited to: concept descriptions, design documents, source code, images, presentation files, and any related content.
+ *
+ * For permission to use this work or any part of it, please contact 1182810784@qq.com to obtain written authorization.
+ */
+
+import {Control} from "light-chaser-ui/lib/types.ts";
+import {FieldChangeData, LCGUI} from "light-chaser-ui/lib/gui/LCGUI.tsx";
+import {useRef, useState} from "react";
+import {ICommonApi} from "light-chaser-types/types/DataSourceTypes.ts";
+import ObjectUtil from "light-chaser-util/lib/ObjectUtil.ts";
+import {globalMessage} from "light-chaser-ui/lib/message/GlobalMessage.tsx";
+import AuthFetchUtil from "../../../util/AuthFetchUtil.ts";
+import {SafeEvalUtil} from "light-chaser-util/lib/SafeEvalUtil.ts";
+import FetchUtil from "../../../util/FetchUtil.ts";
+import DataUtil from "../../../util/DataUtil.ts";
+
+export interface CommonApiConfigProps {
+    data: ICommonApi;
+    doTestBefore?: (config: ICommonApi) => ICommonApi;
+    doTestAfter?: (data: any) => void;
+    /**
+     * @param config 配置数据
+     * @param testData 测试数据
+     */
+    onSave: (config: ICommonApi, testData?: any) => void;
+}
+
+export default function CommonApiConfig(props: CommonApiConfigProps) {
+    const {data, onSave, doTestBefore, doTestAfter} = props;
+    const configRef = useRef<ICommonApi>(data ?? {});
+    const [count, setCount] = useState(0);
+    const testResultRef = useRef<string>("");
+
+    const schema: Control = {
+        type: 'grid',
+        config: {gridGap: '10px'},
+        children: [
+            {
+                key: 'commonApiId',
+                label: '公共API',
+                type: 'select',
+                config: {
+                    showSearch: true,
+                    handleSearch: async (search: string) => {
+                        const response = await AuthFetchUtil.get<any>(`/api/commonApi/quickSearch?search=${search}`);
+                        if (response !== 200)
+                            return response.map((item: any) => ({label: item.name, value: item.id}));
+                        else
+                            return [];
+                    }
+                },
+                value: configRef.current?.commonApiId,
+            },
+            {
+                type: 'grid',
+                label: '自动更新',
+                config: {columns: 8},
+                children: [
+                    {
+                        key: 'autoFlush',
+                        type: 'switch',
+                        value: !!configRef.current?.autoFlush,
+                    },
+                    {
+                        key: 'frequency',
+                        type: 'number-input',
+                        config: {
+                            min: 5,
+                            containerStyle: {
+                                gridColumn: '2/9',
+                            }
+                        },
+                        value: configRef.current?.frequency || 5,
+                    },
+                ]
+            },
+            {
+                type: 'card-panel',
+                label: '过滤器',
+                config: {
+                    contentStyle: {padding: 0}
+                },
+                children: [
+                    {
+                        key: 'filter',
+                        type: 'code-editor',
+                        config: {
+                            height: 200,
+                            language: 'javascript',
+                            fullScreen: true
+                        },
+                        value: configRef.current?.filter || "function filter(data){\n\treturn data\n}",
+                    }
+                ]
+            },
+            {
+                type: 'card-panel',
+                label: '测试结果',
+                config: {
+                    contentStyle: {padding: 0}
+                },
+                children: [
+                    {
+                        type: 'code-editor',
+                        reRender: true,
+                        config: {
+                            height: 200,
+                            language: 'javascript',
+                        },
+                        value: testResultRef.current ?? '',
+                    }
+                ]
+            },
+            {
+                type: 'grid',
+                config: {
+                    columns: 2
+                },
+                children: [
+                    {
+                        id: 'doTest',
+                        type: 'button',
+                        config: {
+                            children: '测试',
+                            type: 'default',
+                            background: '#474747',
+                        }
+                    },
+                    {
+                        id: 'doSave',
+                        type: 'button',
+                        config: {
+                            children: '保存',
+                        }
+                    }
+                ]
+            }
+        ]
+    }
+
+    const doTest = () => {
+        if (!configRef.current?.commonApiId) {
+            globalMessage.messageApi?.error('请先选择一个公共API');
+            return;
+        }
+        AuthFetchUtil.get<ICommonApi>(`/api/commonApi/getCommonApi/${configRef.current?.commonApiId}`).then((response) => {
+            if (response !== null) {
+                const {url = '', method = 'GET', headers, params} = response;
+                Promise.all([
+                    DataUtil.resolveHeaders(headers),
+                    DataUtil.resolveParams(params)
+                ]).then(([resolvedHeaders, resolvedParams]) => {
+                    FetchUtil.doRequestNativeResult(url, method as any, resolvedHeaders, resolvedParams).then(result => {
+                        let testConfig = configRef.current;
+                        if (doTestBefore)
+                            testConfig = doTestBefore(configRef.current);
+                        if (result) {
+                            if (testConfig && testConfig.filter !== '') {
+                                const func = SafeEvalUtil.run(testConfig.filter);
+                                result = typeof func === 'function' ? func(result) : result;
+                            }
+                            if (result != null) {
+                                testResultRef.current = JSON.stringify(result, null, 2);
+                                doTestAfter && doTestAfter(result);
+                            }
+                        } else {
+                            testResultRef.current = JSON.stringify({msg: '请求错误'}, null, 2);
+                            doTestAfter && doTestAfter(null);
+                            globalMessage.messageApi?.warning('测试未通过');
+                        }
+                    }).catch((e) => {
+                        console.error('请求测试失败', e)
+                    }).finally(() => {
+                        setCount(count + 1);
+                    })
+                })
+            }
+        })
+    }
+
+    const doSave = () => {
+        if (!configRef.current?.commonApiId) {
+            globalMessage.messageApi?.error('请先选择一个公共API');
+            return;
+        }
+        onSave(configRef.current, SafeEvalUtil.run(testResultRef.current))
+    }
+
+    const onFieldChange = (fieldChangeData: FieldChangeData) => {
+        const {reRender, id, dataFragment} = fieldChangeData;
+        if (id === 'doTest')
+            doTest();
+        else if (id === 'doSave')
+            doSave();
+        else
+            configRef.current = ObjectUtil.merge(configRef.current, dataFragment)
+        if (reRender)
+            setCount(count + 1);
+    }
+
+    return (
+        <LCGUI schema={schema} onFieldChange={onFieldChange}/>
+    );
+}

package/light-chaser-app/src/comps/common-component/data-source-config/DataSourceConfig.less

@@ -0,0 +1,19 @@
+/*
+ * Copyright © 2023-2025 puyinzhen
+ * All rights reserved.
+ *
+ * The copyright of this work (or idea/project/document) is owned by puyinzhen. Without explicit written permission, no part of this work may be reproduced, distributed, or modified in any form for commercial purposes.
+ *
+ * This copyright statement applies to, but is not limited to: concept descriptions, design documents, source code, images, presentation files, and any related content.
+ *
+ * For permission to use this work or any part of it, please contact 1182810784@qq.com to obtain written authorization.
+ */
+
+.data-config {
+  padding: 10px;
+
+  .card-panel-label {
+    color: #b6b8bb !important;
+    font-size: 12px !important;
+  }
+}

package/light-chaser-app/src/comps/common-component/data-source-config/DataSourceConfig.tsx

@@ -0,0 +1,151 @@
+/*
+ * Copyright © 2023-2025 puyinzhen
+ * All rights reserved.
+ *
+ * The copyright of this work (or idea/project/document) is owned by puyinzhen. Without explicit written permission, no part of this work may be reproduced, distributed, or modified in any form for commercial purposes.
+ *
+ * This copyright statement applies to, but is not limited to: concept descriptions, design documents, source code, images, presentation files, and any related content.
+ *
+ * For permission to use this work or any part of it, please contact 1182810784@qq.com to obtain written authorization.
+ */
+
+import {useState} from 'react';
+import './DataSourceConfig.less';
+import {Control, FieldChangeData, LCGUI} from "light-chaser-ui/lib/main";
+import {APIConfig, DataConfigType, ICommonApi, IDatabase, IGlobalVariableDataConfigType, IMQTTConfig, IWebSocketConfig} from "light-chaser-types/types/DataSourceTypes.ts";
+import {StaticDataConfig} from "./StaticDataConfig.tsx";
+import {ApiDataConfig} from "./ApiDataConfig.tsx";
+import {DatabaseDataConfig} from "./DatabaseConfig.tsx";
+import CommonApiConfig from "./CommonApiConfig.tsx";
+import {GlobalVariableConfig} from "./GlobalVariableConfig.tsx";
+import {WebSocketConfig} from "./WebSocketConfig.tsx";
+import {MQTTConfig} from "./MQTTConfig.tsx";
+import DataUtil from "../../../util/DataUtil.ts";
+
+export interface DataSourceConfigProps {
+    sourceLabel?: string;
+    data: DataConfigType;
+    onSave?: (config: DataConfigType, testResult?: any) => void;
+    range?: (DataConfigType['sourceType'])[];
+    apiTestBefore?: (config: APIConfig) => APIConfig;
+    apiTestAfter?: (data: any) => void;
+    commonApiTestBefore?: (config: ICommonApi) => ICommonApi;
+    commonApiTestAfter?: (data: any) => void;
+    databaseTestBefore?: (config: IDatabase) => IDatabase;
+    databaseTestAfter?: (data: any) => void;
+    globalVariableTestBefore?: (config: IGlobalVariableDataConfigType) => IGlobalVariableDataConfigType;
+    globalVariableTestAfter?: (data: any) => void;
+    wsTestBefore?: (config: IWebSocketConfig) => IWebSocketConfig;
+    wsTestAfter?: (data: any) => void;
+    mqttTestBefore?: (config: IMQTTConfig) => IMQTTConfig;
+    mqttTestAfter?: (data: any) => void;
+}
+
+const DataSourceConfig = (props: DataSourceConfigProps) => {
+    const {data: config, sourceLabel, range, onSave} = props;
+    const [sourceType, setSourceType] = useState<DataConfigType['sourceType']>(config.sourceType!);
+
+    let sourceOptions = [
+        {value: 'static', label: '静态数据'},
+        {value: 'api', label: '接口(API)'},
+        {value: 'commonApi', label: '公共API'},
+        {value: 'database', label: '数据库'},
+        {value: 'globalVariable', label: '全局变量'},
+        {value: 'webSocket', label: 'WebSocket'},
+        {value: 'mqtt', label: 'mqtt'},
+    ]
+    if (range && range.length > 0)
+        sourceOptions = sourceOptions.filter(item => range.includes(item.value as DataConfigType['sourceType']));
+
+    const onFieldChange = (fieldChangeData: FieldChangeData) => {
+        const {data} = fieldChangeData;
+        const sourceType = data as DataConfigType['sourceType'];
+        setSourceType(sourceType);
+    }
+
+    const schema: Control = {
+        type: 'grid',
+        config: {gridGap: '10px'},
+        children: [
+            {
+                key: 'sourceType',
+                label: sourceLabel ?? '数据源',
+                type: 'select',
+                reRender: true,
+                value: sourceType || 'static',
+                config: {
+                    options: sourceOptions,
+                    containerStyle: {
+                        marginBottom: 10
+                    }
+                }
+            }
+        ]
+    }
+
+    const configComponentMap = {
+        static: <StaticDataConfig data={DataUtil.getStaticDataConfig(config)!} defaultValue={config.value}
+                                  onSave={(data, testResult) => onSave && onSave({
+                                      sourceType: 'static',
+                                      staticData: data,
+                                      value: testResult
+                                  }, testResult)}/>,
+        api: <ApiDataConfig data={config.apiData!}
+                            onSave={(data: APIConfig, testResult) => onSave && onSave({sourceType: 'api', apiData: data, value: testResult})}
+                            doTestBefore={props.apiTestBefore}
+                            doTestAfter={props.apiTestAfter}/>,
+        database: <DatabaseDataConfig data={config.database!}
+                                      onSave={(data: IDatabase, testResult) => onSave && onSave({
+                                          sourceType: 'database',
+                                          database: data,
+                                          value: testResult
+                                      })}
+                                      doTestBefore={props.databaseTestBefore}
+                                      doTestAfter={props.databaseTestAfter}/>,
+        commonApi: <CommonApiConfig data={config.commonApi!}
+                                    onSave={(data: ICommonApi, testResult) => onSave && onSave({
+                                        sourceType: 'commonApi',
+                                        commonApi: data,
+                                        value: testResult
+                                    })}
+                                    doTestBefore={props.commonApiTestBefore}
+                                    doTestAfter={props.commonApiTestAfter}/>,
+        globalVariable: <GlobalVariableConfig data={config.globalVariable!}
+                                              doTestAfter={props.globalVariableTestAfter}
+                                              onSave={(data: IGlobalVariableDataConfigType, testResult) => onSave && onSave({
+                                                  sourceType: 'globalVariable',
+                                                  globalVariable: data!,
+                                                  value: testResult
+                                              })}/>,
+        webSocket: <WebSocketConfig data={config.webSocket!}
+                                    doTestBefore={props.wsTestBefore}
+                                    doTestAfter={props.wsTestAfter}
+                                    onSave={(data: IWebSocketConfig, testResult) => onSave && onSave({
+                                        sourceType: 'webSocket',
+                                        webSocket: data!,
+                                        value: testResult
+                                    })}/>,
+        mqtt: <MQTTConfig data={config.mqtt!}
+                          doTestBefore={props.mqttTestBefore}
+                          doTestAfter={props.mqttTestAfter}
+                          onSave={(data: IWebSocketConfig, testResult) => onSave && onSave({
+                              sourceType: 'mqtt',
+                              mqtt: data!,
+                              value: testResult
+                          })}/>
+    }
+
+    return (
+        <div className={'data-config'}>
+            <LCGUI schema={schema} onFieldChange={onFieldChange}/>
+            {configComponentMap[sourceType!]}
+        </div>
+    );
+}
+
+export default DataSourceConfig;
+
+
+
+
+