From c0555b56fb7b8dccf59a1517d169f3709b45b90e Mon Sep 17 00:00:00 2001 From: ZLY Date: Tue, 11 Nov 2025 17:57:32 +0800 Subject: [PATCH] =?UTF-8?q?feat(component):=20=E6=B7=BB=E5=8A=A0=E7=BB=84?= =?UTF-8?q?=E4=BB=B6=E9=A2=84=E8=A7=88=E5=8A=9F=E8=83=BD=20-=20=E5=9C=A8?= =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=BB=84=E4=BB=B6=E5=BC=B9=E7=AA=97=E4=B8=AD?= =?UTF-8?q?=E9=9B=86=E6=88=90=E7=BB=84=E4=BB=B6=E9=A2=84=E8=A7=88=E6=A8=A1?= =?UTF-8?q?=E5=9D=97=20-=20=E6=96=B0=E5=A2=9E=20CompReview=20=E7=BB=84?= =?UTF-8?q?=E4=BB=B6=E7=94=A8=E4=BA=8E=E5=B1=95=E7=A4=BA=E7=BB=84=E4=BB=B6?= =?UTF-8?q?=E8=AE=BE=E8=AE=A1=E6=95=B0=E6=8D=AE=20-=20=E8=B0=83=E6=95=B4?= =?UTF-8?q?=E7=BB=84=E4=BB=B6=E5=B8=82=E5=9C=BA=E5=A4=8D=E5=88=B6=E6=8E=A5?= =?UTF-8?q?=E5=8F=A3=E8=B7=AF=E5=BE=84=E8=87=B3=20componentBase=20-=20?= =?UTF-8?q?=E4=BC=98=E5=8C=96=E7=BB=84=E4=BB=B6=E9=A2=84=E8=A7=88=E6=A0=B7?= =?UTF-8?q?=E5=BC=8F=E4=B8=8E=E5=B8=83=E5=B1=80=E7=BB=93=E6=9E=84=20-=20?= =?UTF-8?q?=E6=94=AF=E6=8C=81=E7=BB=84=E4=BB=B6=E8=BE=93=E5=85=A5=E8=BE=93?= =?UTF-8?q?=E5=87=BA=E5=8F=82=E6=95=B0=E7=9A=84=E5=8A=A8=E6=80=81=E6=B8=B2?= =?UTF-8?q?=E6=9F=93=20-=20=E5=A2=9E=E5=8A=A0=E6=97=A0=E5=8F=82=E6=95=B0?= =?UTF-8?q?=E6=97=B6=E7=9A=84=E5=8D=A0=E4=BD=8D=E6=8F=90=E7=A4=BA=E4=BF=A1?= =?UTF-8?q?=E6=81=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/componentMarket.ts | 2 +- .../componentList/addComponentModal.tsx | 8 +- .../componentList/compReview.tsx | 91 ++++++++++++++++++ .../style/compReview.module.less | 94 +++++++++++++++++++ 4 files changed, 190 insertions(+), 5 deletions(-) create mode 100644 src/pages/componentDevelopment/componentList/compReview.tsx create mode 100644 src/pages/componentDevelopment/componentList/style/compReview.module.less diff --git a/src/api/componentMarket.ts b/src/api/componentMarket.ts index 423374a..f6a089c 100644 --- a/src/api/componentMarket.ts +++ b/src/api/componentMarket.ts @@ -11,5 +11,5 @@ export function getReviewGroupByNew(params: ReviewGroup) { // 复制组件设计 export function copyDesign(params) { - return axios.post(`${urlPrefix}/componentMarket/copyDesign`, params); + return axios.post(`${urlPrefix}/componentBase/copyDesign`, params); } \ No newline at end of file diff --git a/src/pages/componentDevelopment/componentList/addComponentModal.tsx b/src/pages/componentDevelopment/componentList/addComponentModal.tsx index d89fe48..8d6cf50 100644 --- a/src/pages/componentDevelopment/componentList/addComponentModal.tsx +++ b/src/pages/componentDevelopment/componentList/addComponentModal.tsx @@ -18,6 +18,7 @@ import { IconPlus, IconEdit } from '@arco-design/web-react/icon'; import styles from './style/addComponentModal.module.less'; import EditorSection from '@/components/EditorSection'; import AddApiModal from '@/pages/componentDevelopment/componentList/addApiModal'; +import CompReview from '@/pages/componentDevelopment/componentList/compReview'; import { getComponentClassify } from '@/api/componentClassify'; import { compProjectValidate, compSubmit, getTagList, copyAll } from '@/api/componentBase'; import { copyDesign } from '@/api/componentMarket'; @@ -500,11 +501,10 @@ const AddComponentModal = ({ visible, baseInfo, setVisible, onReFresh, mode = 'c
组件外壳 + > +
diff --git a/src/pages/componentDevelopment/componentList/compReview.tsx b/src/pages/componentDevelopment/componentList/compReview.tsx new file mode 100644 index 0000000..77953c4 --- /dev/null +++ b/src/pages/componentDevelopment/componentList/compReview.tsx @@ -0,0 +1,91 @@ +import React from 'react'; +import styles from './style/compReview.module.less'; + +const CompReview = ({ componentDesignData }) => { + console.log('componentDesignData:', componentDesignData); + + // 确保数据是数组格式 + const dataArray = Array.isArray(componentDesignData) ? componentDesignData : + componentDesignData ? [componentDesignData] : []; + + return ( +
+
+
组件预览
+
+
+
+ {/* 上方内容 - 根据数组长度渲染 */} +
+ {dataArray.map((data, index) => ( +
+
{data.ident}
+
+ ))} +
+ + {/* 输入输出部分 - 根据数组长度渲染 */} +
+ {/* 输入部分 */} +
+
input
+
+ {dataArray.map((data, index) => { + // 确保参数始终是数组格式 + const parameters = Array.isArray(data.parameters) ? data.parameters : + (data.parameters ? [data.parameters] : []); + + return ( +
+ {parameters.length > 0 ? ( + parameters.map((param, paramIndex) => ( +
+ {param.ident} {param.type} +
+ )) + ) : ( +
+ 无输入参数 +
+ )} +
+ ); + })} +
+
+ + {/* 输出部分 */} +
+
output
+
+ {dataArray.map((data, index) => { + // 确保响应始终是数组格式 + const responses = Array.isArray(data.responses) ? data.responses : + (data.responses ? [data.responses] : []); + + return ( +
+ {responses.length > 0 ? ( + responses.map((response, responseIndex) => ( +
+ {response.type} {response.ident} +
+ )) + ) : ( +
+ 无输出参数 +
+ )} +
+ ); + })} +
+
+
+
+
+
+ ); +}; + +export default CompReview; \ No newline at end of file diff --git a/src/pages/componentDevelopment/componentList/style/compReview.module.less b/src/pages/componentDevelopment/componentList/style/compReview.module.less new file mode 100644 index 0000000..3a95b2f --- /dev/null +++ b/src/pages/componentDevelopment/componentList/style/compReview.module.less @@ -0,0 +1,94 @@ +.comp-review-container { + width: 300px; + border-radius: 8px; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); + overflow: hidden; +} + +.comp-review-header { + background-color: #FFA500; + color: white; + padding: 8px 12px; + display: flex; + align-items: center; + justify-content: space-between; + font-size: 14px; +} + +.comp-review-icon { + font-size: 16px; + margin-right: 8px; +} + +.comp-review-title { + font-weight: bold; +} + +.comp-review-actions { + font-size: 12px; + cursor: pointer; +} + +.comp-review-body { + background-color: white; + padding: 12px; +} + +.comp-review-content { + border-radius: 4px; + padding: 8px; + min-height: 120px; +} + +.comp-review-top { + margin-bottom: 12px; + border-bottom: 1px solid #ebeef5; +} + +.comp-review-name { + font-weight: bold; + margin-bottom: 4px; +} + +.comp-review-desc { + color: #666; + font-size: 12px; +} + +.comp-review-io { + height: 100%; +} + +.comp-review-input, +.comp-review-output { + flex: 1; + padding: 8px; +} + +.comp-review-output { + border-right: none; + text-align: right; +} + +.comp-review-io-label { + font-weight: bold; + margin-bottom: 4px; + font-size: 12px; +} + +.comp-review-io-items { + margin-top: 4px; +} + +.comp-review-io-item { + margin-bottom: 4px; + position: relative; +} + + +.comp-review-io-placeholder { + color: #999; + font-size: 12px; + text-align: center; + padding: 8px 0; +} \ No newline at end of file