diff --git a/.env b/.env index 9522659..41e7780 100644 --- a/.env +++ b/.env @@ -1,6 +1,9 @@ # API基础URL NEXT_PUBLIC_API_BASE_URL=/ +# code-server服务地址 +NEXT_PUBLIC_DEV_CODE_SERVER_HOST='http://192.168.5.119:8443' + # 开发服务器主机地址 129穿透 #NEXT_PUBLIC_DEV_SERVER_HOST=https://p29.ngsk.tech:7001 diff --git a/src/api/global.ts b/src/api/global.ts new file mode 100644 index 0000000..182114a --- /dev/null +++ b/src/api/global.ts @@ -0,0 +1,20 @@ +import axios from 'axios'; +import { GlobalParams } from '@/api/interface'; + +// 公共路径 +const urlPrefix = '/api/v1/bpms-workbench'; + +// 新增全局变量 +export function addGlobal(data: GlobalParams) { + return axios.post(`${urlPrefix}/global/add`, data); +} + +// 获取全局变量列表 +export function getGlobalList(sceneId: string) { + return axios.get(`${urlPrefix}/global/${sceneId}/map`); +} + +// 删除全局变量 +export function deleteGlobal(id: string) { + return axios.delete(`${urlPrefix}/global/${id}`); +} \ No newline at end of file diff --git a/src/api/interface/index.ts b/src/api/interface/index.ts index 5c5ba29..0af6396 100644 --- a/src/api/interface/index.ts +++ b/src/api/interface/index.ts @@ -222,4 +222,12 @@ export interface ExecuteCurrentEventParams { export interface ReconnectRunParams { instanceId: string, newSocketId: string +} + +export interface GlobalParams { + name: string, + dataType: any, + arrayType: any, + defaultValue: any, + sceneId: string, } \ No newline at end of file diff --git a/src/components/FlowEditor/nodeEditors/components/EventSelect.tsx b/src/components/FlowEditor/nodeEditors/components/EventSelect.tsx index 8db875b..f79785b 100644 --- a/src/components/FlowEditor/nodeEditors/components/EventSelect.tsx +++ b/src/components/FlowEditor/nodeEditors/components/EventSelect.tsx @@ -84,7 +84,6 @@ const EventSelect: React.FC = ({ nodeData, eventList, type, on }; const handelSelect = (e) => { - console.log('e:', e); const data = { type: typeMap[type], customDef: { diff --git a/src/components/FlowEditor/nodeEditors/components/EventSendEditor.tsx b/src/components/FlowEditor/nodeEditors/components/EventSendEditor.tsx index e595ff6..6c34c88 100644 --- a/src/components/FlowEditor/nodeEditors/components/EventSendEditor.tsx +++ b/src/components/FlowEditor/nodeEditors/components/EventSendEditor.tsx @@ -7,12 +7,17 @@ import EventSelect from '@/components/FlowEditor/nodeEditors/components/EventSel import { queryEventItemBySceneId } from '@/api/event'; import ParamsTable from '@/components/FlowEditor/nodeEditors/components/ParamsTable'; -const EventSendEditor: React.FC = ({ nodeData, updateNodeData }) => { +const EventSendEditor: React.FC = ({ node, nodeData, updateNodeData }) => { const [eventList, setEventList] = useState(); const { currentAppData } = useSelector(state => state.ideContainer); const getEventList = async () => { - const res = await queryEventItemBySceneId({sceneId:currentAppData.sceneId}); + const params = { + nodeId: node.id, + appId: currentAppData.id, + sceneId: currentAppData.sceneId + }; + const res = await queryEventItemBySceneId(params); setEventList(res.data); }; diff --git a/src/components/FlowEditor/nodeEditors/components/ParamsTable.tsx b/src/components/FlowEditor/nodeEditors/components/ParamsTable.tsx index 2fd852e..683748e 100644 --- a/src/components/FlowEditor/nodeEditors/components/ParamsTable.tsx +++ b/src/components/FlowEditor/nodeEditors/components/ParamsTable.tsx @@ -1,6 +1,7 @@ import React, { useState, useEffect } from 'react'; import { Input, Select, Table, Button } from '@arco-design/web-react'; import { IconDelete } from '@arco-design/web-react/icon'; +import { useSelector } from 'react-redux'; interface TableDataItem { key: number | string; @@ -23,6 +24,7 @@ const ParamsTable: React.FC = ({ onUpdateData }) => { const [data, setData] = useState([]); + const { gloBalVarList } = useSelector((state: any) => state.ideContainer); useEffect(() => { // 为现有数据添加key属性（如果不存在） @@ -34,19 +36,36 @@ const ParamsTable: React.FC = ({ }, [initialData]); const dataTypeOptions = [ - { label: '字符串', value: 'STRING' }, - { label: '数字', value: 'INTEGER' }, - { label: '布尔值', value: 'BOOLEAN' }, - { label: '数组', value: 'ARRAY' }, - { label: '对象', value: 'OBJECT' } + { label: 'STRING', value: 'STRING' }, + { label: 'INTEGER', value: 'INTEGER' }, + { label: 'BOOLEAN', value: 'BOOLEAN' }, + { label: 'ARRAY', value: 'ARRAY' }, + { label: 'OBJECT', value: 'OBJECT' }, + { label: 'JSON', value: 'JSON' }, + { label: 'DOUBLE', value: 'DOUBLE' } ]; const arrayTypeOptions = [ - { label: '字符串数组', value: 'STRING' }, - { label: '数字数组', value: 'INTEGER' }, - { label: '布尔数组', value: 'BOOLEAN' } + { label: 'STRING', value: 'STRING' }, + { label: 'INTEGER', value: 'INTEGER' }, + { label: 'DOUBLE', value: 'DOUBLE' }, + { label: 'BOOLEAN', value: 'BOOLEAN' }, + { label: 'JSON', value: 'JSON' }, + { label: 'OBJECT', value: 'OBJECT' } ]; + // 根据数据类型获取对应的选项列表 + const getOptionsByDataType = (dataType: string) => { + // 这里可以根据数据类型从gloBalVarList中筛选出对应的选项 + if (gloBalVarList[dataType]) { + return gloBalVarList[dataType].map((item: any) => ({ + label: item.name, + value: item.id + })); + } + return []; + }; + const columns = [ { title: '标识', @@ -83,7 +102,7 @@ const ParamsTable: React.FC = ({ title: '数组类型', dataIndex: 'arrayType', render: (_: any, record: TableDataItem) => ( - record.dataType === 'array' ? ( + record.dataType === 'ARRAY' ? ( handleSave({ ...record, defaultValue: value })} - /> - ) : ( - handleSave({ ...record, defaultValue: value })} - /> - ) - ) + render: (_: any, record: TableDataItem) => { + // 获取当前数据类型对应的选项 + const options = getOptionsByDataType(record.dataType); + + // 如果有选项则显示下拉选择框，否则显示输入框 + if (options.length > 0) { + return ( + <> + handleSave({ ...record, defaultValue: value })} + placeholder="请输入默认值" + /> + + ); + } + else { + // 特殊处理maxTime的情况 + if (record.id === 'maxTime') { + return ( + handleSave({ ...record, defaultValue: value })} + /> + ); + } + + return ( + handleSave({ ...record, defaultValue: value })} + placeholder="请输入默认值" + /> + ); + } + } }, { title: '操作', diff --git a/src/pages/componentDevelopment/componentCoding/index.tsx b/src/pages/componentDevelopment/componentCoding/index.tsx index e501927..7309ad9 100644 --- a/src/pages/componentDevelopment/componentCoding/index.tsx +++ b/src/pages/componentDevelopment/componentCoding/index.tsx @@ -10,12 +10,10 @@ const ComponentCoding = () => { useEffect(() => { - const uri = process.env.NEXT_PUBLIC_DEV_SERVER_HOST; - // const uri = 'http://api.myserver.com:4121'; - const codeServerPrefix = '/code-server'; + const uri = process.env.NEXT_PUBLIC_DEV_CODE_SERVER_HOST; const codeServerFolderPre = '/app/data'; const tempData = '/000000/admin_testcode1/master'; - setServerUrl(`${uri}${codeServerPrefix}?folder=${codeServerFolderPre}${tempData}`); + setServerUrl(`${uri}?folder=${codeServerFolderPre}${tempData}`); }); diff --git a/src/pages/componentDevelopment/componentTest/instanceList.tsx b/src/pages/componentDevelopment/componentTest/instanceList.tsx index f3aa92a..54fe967 100644 --- a/src/pages/componentDevelopment/componentTest/instanceList.tsx +++ b/src/pages/componentDevelopment/componentTest/instanceList.tsx @@ -1,10 +1,44 @@ import React from 'react'; +import { Button, Popconfirm, Table } from '@arco-design/web-react'; +import { IconDelete } from '@arco-design/web-react/icon'; const InstanceList = () => { + const data = []; + + // 定义表格列 + const columns = [ + { + title: '实例名', + dataIndex: 'name' + }, + { + title: '实例标识', + dataIndex: 'dataType' + }, + { + title: '运行类型', + dataIndex: 'defaultValue' + }, + { + title: '实例状态', + dataIndex: 'description' + }, + { + title: '实例测试时间', + dataIndex: 'description1' + }, + { + title: '操作', + dataIndex: 'operations' + } + ]; return ( -
- 实例列表 -
+ ); }; diff --git a/src/pages/componentDevelopment/componentTest/sideBar.tsx b/src/pages/componentDevelopment/componentTest/sideBar.tsx index a442d92..0621fa0 100644 --- a/src/pages/componentDevelopment/componentTest/sideBar.tsx +++ b/src/pages/componentDevelopment/componentTest/sideBar.tsx @@ -1,10 +1,39 @@ -import React from 'react'; +import React, { useState } from 'react'; +import { Input, Tree } from '@arco-design/web-react'; +import { IconSearch } from '@arco-design/web-react/icon'; +import { menu } from './test/data'; + +const TreeNode = Tree.Node; const SideBar = () => { + const [searchValue, setSearchValue] = useState(''); + + const handleSearchChange = (value: string) => { + setSearchValue(value); + }; + return ( -
- 侧边栏 -
+ <> + } + placeholder={'搜索'} + style={{ width: '90%' }} + value={searchValue} + onChange={handleSearchChange} + /> + + { + console.log(value, info); + }} + onExpand={(keys, info) => { + console.log(keys, info); + }} + treeData={menu} + > + + + ); }; diff --git a/src/pages/componentDevelopment/componentTest/test/data.ts b/src/pages/componentDevelopment/componentTest/test/data.ts new file mode 100644 index 0000000..d8342e9 --- /dev/null +++ b/src/pages/componentDevelopment/componentTest/test/data.ts @@ -0,0 +1,152 @@ +export const menu = [ + { + 'id': '1770647707245903873', + 'tenantId': '000000', + 'parentId': '1658394185466220545', + 'code': 'component_classify', + 'dictKey': '设备数采与控制交互组件', + 'dictValue': '设备数采与控制交互组件', + 'title': '设备数采与控制交互组件', + 'sort': 0, + 'remark': '', + 'isSealed': -1, + 'isDeleted': -1, + 'parentName': '', + 'hasChildren': false + }, + { + 'id': '1770647743455330305', + 'tenantId': '000000', + 'parentId': '1658394185466220545', + 'code': 'component_classify', + 'dictKey': '视觉AI组件', + 'dictValue': '视觉AI组件', + 'title': '视觉AI组件', + 'sort': 1, + 'remark': '', + 'isSealed': -1, + 'isDeleted': -1, + 'parentName': '', + 'hasChildren': false + }, + { + 'id': '1770647774937776129', + 'tenantId': '000000', + 'parentId': '1658394185466220545', + 'code': 'component_classify', + 'dictKey': '运动规划组件', + 'dictValue': '运动规划组件', + 'title': '运动规划组件', + 'sort': 2, + 'remark': '', + 'isSealed': -1, + 'isDeleted': -1, + 'parentName': '', + 'hasChildren': false + }, + { + 'id': '1770647807334580225', + 'tenantId': '000000', + 'parentId': '1658394185466220545', + 'code': 'component_classify', + 'dictKey': '工艺知识服务组件', + 'dictValue': '工艺知识服务组件', + 'title': '工艺知识服务组件', + 'sort': 2, + 'remark': '', + 'isSealed': -1, + 'isDeleted': -1, + 'parentName': '', + 'hasChildren': false + }, + { + 'id': '1770647842776449026', + 'tenantId': '000000', + 'parentId': '1658394185466220545', + 'code': 'component_classify', + 'dictKey': '网络通信组件', + 'dictValue': '网络通信组件', + 'title': '网络通信组件', + 'sort': 4, + 'remark': '', + 'isSealed': -1, + 'isDeleted': -1, + 'parentName': '', + 'hasChildren': false + }, + { + 'id': '1770647878029574145', + 'tenantId': '000000', + 'parentId': '1658394185466220545', + 'code': 'component_classify', + 'dictKey': '数据存取组件', + 'dictValue': '数据存取组件', + 'title': '数据存取组件', + 'sort': 5, + 'remark': '', + 'isSealed': -1, + 'isDeleted': -1, + 'parentName': '', + 'hasChildren': false + }, + { + 'id': '1770647908987731969', + 'tenantId': '000000', + 'parentId': '1658394185466220545', + 'code': 'component_classify', + 'dictKey': '时序数据AI组件', + 'dictValue': '时序数据AI组件', + 'title': '时序数据AI组件', + 'sort': 6, + 'remark': '', + 'isSealed': -1, + 'isDeleted': -1, + 'parentName': '', + 'hasChildren': false + }, + { + 'id': '1770647940654727170', + 'tenantId': '000000', + 'parentId': '1658394185466220545', + 'code': 'component_classify', + 'dictKey': '文本数据AI组件', + 'dictValue': '文本数据AI组件', + 'title': '文本数据AI组件', + 'sort': 7, + 'remark': '', + 'isSealed': -1, + 'isDeleted': -1, + 'parentName': '', + 'hasChildren': false + }, + { + 'id': '1770648447733497858', + 'tenantId': '000000', + 'parentId': '1658394185466220545', + 'code': 'component_classify', + 'dictKey': '测试组件', + 'dictValue': '测试组件', + 'title': '测试组件', + 'sort': 999, + 'remark': '', + 'isSealed': -1, + 'isDeleted': -1, + 'parentName': '', + 'hasChildren': false + }, + { + 'id': '1938074918032830465', + 'tenantId': '000000', + 'parentId': '1658394185466220545', + 'code': 'component_classify', + 'dictKey': '监听组件', + 'dictValue': '监听组件', + 'title': '监听组件', + 'sort': 10, + 'remark': '', + 'isSealed': -1, + 'isDeleted': -1, + 'parentName': '', + 'hasChildren': false + } +]; \ No newline at end of file diff --git a/src/pages/flowEditor/components/nodeContentOther.tsx b/src/pages/flowEditor/components/nodeContentOther.tsx index b78785a..32db837 100644 --- a/src/pages/flowEditor/components/nodeContentOther.tsx +++ b/src/pages/flowEditor/components/nodeContentOther.tsx @@ -272,15 +272,13 @@ const NodeContent = ({ data }: { data: NodeContentData }) => { {/*content栏-data部分*/}
- {!isStartNode && ( -
- {dataIns.map((input, index) => ( -
- {input.id || `输入${index + 1}`} {input.dataType} -
- ))} -
- )} +
+ {dataIns.map((input, index) => ( +
+ {input.id || `输入${index + 1}`} {input.dataType} +
+ ))} +
{dataOuts.length > 0 && !isEndNode && (
diff --git a/src/pages/ideContainer/index.tsx b/src/pages/ideContainer/index.tsx index ac37cb9..466526f 100644 --- a/src/pages/ideContainer/index.tsx +++ b/src/pages/ideContainer/index.tsx @@ -14,7 +14,8 @@ import { updateCurrentAppData, updateInfo, updateProjectComponentData, - updateEventList + updateEventList, + updateGlobalVarList } from '@/store/ideContainer'; import { getAppListBySceneId } from '@/api/apps'; import { getProjectComp } from '@/api/scene'; @@ -32,6 +33,7 @@ import ComponentTest from '@/pages/componentDevelopment/componentTest'; import { getUserToken } from '@/api/user'; import { Message } from '@arco-design/web-react'; import { queryEventItemBySceneId, queryEventItemBySceneIdOld } from '@/api/event'; +import { getGlobalList } from '@/api/global'; type UrlParamsOptions = { identity?: string; @@ -225,6 +227,11 @@ function IDEContainer() { if (res1.code === 200) dispatch(updateEventListOld(res1.data)); }; + const getGlobalVar = async () => { + const res: any = await getGlobalList(urlParams.id); + if (res.code === 200) dispatch(updateGlobalVarList(res.data)); + }; + useEffect(() => { setUrlParams(getUrlParams(window.location.href) as UrlParamsOptions); dispatch(updateInfo(getUrlParams(window.location.href) as UrlParamsOptions)); @@ -241,6 +248,7 @@ function IDEContainer() { if (urlParams.identity && urlParams.identity === 'scene') { connectWS(); getEvent(); + getGlobalVar(); } }, [urlParams.identity]); diff --git a/src/pages/orchestration/globalVar/addModal.tsx b/src/pages/orchestration/globalVar/addModal.tsx new file mode 100644 index 0000000..f4c8735 --- /dev/null +++ b/src/pages/orchestration/globalVar/addModal.tsx @@ -0,0 +1,257 @@ +import React from 'react'; +import { Form, Input, Modal, Select } from '@arco-design/web-react'; +import { useSelector } from 'react-redux'; + +const FormItem = Form.Item; + +// 定义数据类型枚举 +const dataTypeEnum = [ + 'OBJECT', + 'JSON', + 'ARRAY', + 'BOOLEAN', + 'INTEGER', + 'DOUBLE', + 'STRING' +]; + +// 定义数组元素类型枚举 +const arrayElementTypeEnum = [ + 'STRING', + 'INTEGER', + 'DOUBLE', + 'BOOLEAN', + 'ARRAY', + 'JSON', + 'OBJECT' +]; + +// 默认值类型校验方法 +const validateDefaultValue = (value, dataType, arrayType) => { + // 如果没有值，则不进行校验 + if (value === undefined || value === null || value === '') { + return true; + } + + switch (dataType) { + case 'STRING': + case 'DATE': + case 'DATETIME': + case 'TIMESTAMP': + case 'DATABASE': + // 字符串类型 - 任何值都是有效的 + return true; + + case 'INTEGER': + // 整数类型 - 必须是整数 + const intRegex = /^-?\d+$/; + return intRegex.test(value); + + case 'DOUBLE': + // 双精度浮点类型 - 必须是数字 + const doubleRegex = /^-?\d+(\.\d+)?$/; + return doubleRegex.test(value); + + case 'BOOLEAN': + // 布尔类型 - 必须是 true 或 false + return value === 'true' || value === 'false' || value === true || value === false; + + case 'ARRAY': + // 数组类型 - 尝试解析为JSON数组 + try { + const parsed = JSON.parse(value); + if (!Array.isArray(parsed)) { + return false; + } + + // 根据数组元素类型进行校验 + if (arrayType) { + for (const item of parsed) { + switch (arrayType) { + case 'STRING': + case 'DATE': + case 'DATETIME': + case 'TIMESTAMP': + if (typeof item !== 'string') { + return false; + } + break; + case 'INTEGER': + if (!Number.isInteger(item)) { + return false; + } + break; + case 'DOUBLE': + if (typeof item !== 'number') { + return false; + } + break; + case 'BOOLEAN': + if (typeof item !== 'boolean') { + return false; + } + break; + } + } + } + return true; + } catch (e) { + return false; + } + + case 'JSON': + // JSON类型 - 必须是有效的JSON + try { + JSON.parse(value); + return true; + } catch (e) { + return false; + } + + case 'OBJECT': + // 对象类型 - 必须是有效的JSON对象 + try { + const parsed = JSON.parse(value); + return typeof parsed === 'object' && parsed !== null && !Array.isArray(parsed); + } catch (e) { + return false; + } + + default: + // 其他类型暂时不做特殊校验 + return true; + } +}; + +const AddGlobalVarModal = ({ visible, onOk, onChangeVisible, form }) => { + const { info } = useSelector((state: any) => state.ideContainer); + + // 获取表单字段值 + const formData = Form.useWatch('dataType', form); + const arrayTypeData = Form.useWatch('arrayType', form); + + return ( + onOk()} + onCancel={() => onChangeVisible(false)} + autoFocus={false} + focusLock={true} + maskClosable={false} + > +
+ + + + + + + {/* 只有在数据类型选择为ARRAY时才展示数组类型选项 */} + {formData === 'ARRAY' && ( + + + + )} + + + + + + ); +}; + +export default AddGlobalVarModal; \ No newline at end of file diff --git a/src/pages/orchestration/globalVar/index.tsx b/src/pages/orchestration/globalVar/index.tsx index 3557fa4..528f672 100644 --- a/src/pages/orchestration/globalVar/index.tsx +++ b/src/pages/orchestration/globalVar/index.tsx @@ -1,20 +1,177 @@ -import React, { useState } from 'react'; +import React, { useEffect, useState, useMemo } from 'react'; import styles from './style/index.module.less'; -import { Button, Divider, Input, Space, Table } from '@arco-design/web-react'; -import { IconSearch } from '@arco-design/web-react/icon'; +import { Button, Divider, Input, Space, Table, Form, Message, Popconfirm } from '@arco-design/web-react'; +import { IconSearch, IconDelete } from '@arco-design/web-react/icon'; +import { addGlobal, deleteGlobal, getGlobalList } from '@/api/global'; +import { useSelector } from 'react-redux'; +import AddGlobalVarModal from './addModal'; + +// 定义数据类型映射对象 +const dataTypeMap = { + OBJECT: '复合类型', + JSON: 'JSON类型', + ARRAY: '数组类型', + BOOLEAN: '布尔类型', + INTEGER: '整数类型', + DOUBLE: '双精度浮点类型', + STRING: '字符串类型', + DATE: '日期类型', + DATETIME: '日期时间类型', + TIMESTAMP: '时间戳类型', + DATABASE: '数据库类型' +}; const GlobalVarContainer = () => { - const [selectedItem, setSelectedItem] = useState('数字类型'); - - const menuItems = [ - '数字类型', - '字符串类型', - '布尔类型', - '复合类型', - '集合类型', - '元祖类型', - '实例类型', - '列表类型' + const [selectedItem, setSelectedItem] = useState('OBJECT'); + const { info } = useSelector((state: any) => state.ideContainer); + const [addModalVisible, setAddModalVisible] = useState(false); // 控制弹窗显示状态 + const [form] = Form.useForm(); // 创建表单实例 + const [globalVarData, setGlobalVarData] = useState({}); // 存储全局变量数据 + const [searchText, setSearchText] = useState(''); // 搜索文本 + + const menuItems = Object.keys(dataTypeMap); + + const getGlobalVar = async () => { + try { + const res: any = await getGlobalList(info.id); + if (res.code === 200) { + const initData = {}; + menuItems.forEach(item => { + initData[item] = []; + }); + + // 处理接口返回的数据，按类型分类 + if (res.data) { + Object.keys(res.data).forEach(dataType => { + const items = res.data[dataType]; + if (Array.isArray(items) && initData[dataType]) { + initData[dataType] = items; + } + }); + } + + setGlobalVarData(initData); + } + else { + Message.error('获取全局变量失败'); + } + } catch (error) { + console.error('获取全局变量失败:', error); + Message.error('获取全局变量失败'); + } + }; + + const handleAddGlobalVar = () => { + setAddModalVisible(true); // 显示弹窗 + }; + + // 处理弹窗确认 + const handleAddModalOk = async () => { + try { + const values = await form.validate(); + const params = { + ...values, + sceneId: info.id + }; + if (!params?.arrayType) params.arrayType = null; + + const res: any = await addGlobal(params); + if (res.code === 200) { + Message.success('添加成功'); + await getGlobalVar(); // 重新获取数据 + } + else { + Message.error('添加失败: ' + res.msg); + } + + form.resetFields(); // 重置表单 + setAddModalVisible(false); // 关闭弹窗 + } catch (error) { + console.log('表单验证失败:', error); + Message.error('添加失败'); + } + }; + + // 处理弹窗关闭 + const handleAddModalCancel = () => { + form.resetFields(); // 重置表单 + setAddModalVisible(false); // 关闭弹窗 + }; + + // 处理删除全局变量 + const handleDeleteGlobalVar = async (id) => { + console.log('删除全局变量:', id); + try { + const res: any = await deleteGlobal(id); + if (res.code === 200) { + Message.success('删除成功'); + await getGlobalVar(); // 重新获取数据 + } + else { + Message.error('删除失败: ' + res.msg); + } + } catch (error) { + console.log('删除失败:', error); + Message.error('删除失败'); + } + }; + + // 处理搜索输入变化 + const handleSearchChange = (value) => { + setSearchText(value); + }; + + const filteredData = useMemo(() => { + const currentData = globalVarData[selectedItem] || []; + if (!searchText) { + return currentData; + } + + return currentData.filter(item => { + // 在变量名、数据类型、默认值和描述中搜索 + return ( + item.name?.toLowerCase().includes(searchText.toLowerCase()) || + item.dataType?.toLowerCase().includes(searchText.toLowerCase()) || + item.defaultValue?.toLowerCase().includes(searchText.toLowerCase()) || + item.description?.toLowerCase().includes(searchText.toLowerCase()) + ); + }); + }, [globalVarData, selectedItem, searchText]); + + useEffect(() => { + getGlobalVar(); + }, []); + + // 定义表格列 + const columns = [ + { + title: '变量名', + dataIndex: 'name' + }, + { + title: '数据类型', + dataIndex: 'dataType' + }, + { + title: '默认值', + dataIndex: 'defaultValue' + }, + { + title: '描述', + dataIndex: 'description' + }, + { + title: '操作', + dataIndex: 'operations', + render: (_, record) => ( + handleDeleteGlobalVar(record.id)} + > + @@ -53,9 +213,22 @@ const GlobalVarContainer = () => {
{/*数据列表*/}
- {/*
*/} +
+ + {/* 添加全局变量弹窗 */} + ); }; diff --git a/src/store/ideContainer.ts b/src/store/ideContainer.ts index 5c9e9e4..9bfff28 100644 --- a/src/store/ideContainer.ts +++ b/src/store/ideContainer.ts @@ -24,6 +24,7 @@ interface IDEContainerState { eventSendNodeList: any[], // [{nodeID:topic}] eventlisteneList: any[] // [{nodeID:topic}] }>; + gloBalVarList: any; } // 初始状态 @@ -41,7 +42,8 @@ const initialState: IDEContainerState = { socketId: '', // 工程的socketId nodeStatusMap: {}, // 初始化节点状态映射 isRunning: false, // 默认未运行 - appRuntimeData: {} // 按应用ID隔离的应用运行状态和日志数据 + appRuntimeData: {}, // 按应用ID隔离的应用运行状态和日志数据 + gloBalVarList: [] // 工程级全局变量列表 }; // 创建切片 @@ -82,6 +84,9 @@ const ideContainerSlice = createSlice({ updateSocketId(state, action) { state.socketId = action.payload; }, + updateGlobalVarList(state, action) { + state.gloBalVarList = action.payload; + }, // 更新节点状态 updateNodeStatus: (state, { payload }) => { const { nodeId, status, actionType } = payload; @@ -208,6 +213,7 @@ export const { updateEventTopicList, updateLogBarStatus, updateSocketId, + updateGlobalVarList, updateNodeStatus, resetNodeStatus, updateIsRunning,