Skip to content

Commit 96159f0

Browse files
committed
feat(architecture): add 'AI 驱动的自验证' section and update onClickSection handlers for improved interaction
1 parent c9528d9 commit 96159f0

File tree

2 files changed

+109
-9
lines changed

2 files changed

+109
-9
lines changed

docs/ai-friendly/index.mdx

Lines changed: 81 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,8 @@ export const AIFriendlyArchitecture = () => {
1919
const retrievalToolRef = useRef(null);
2020
const refinedQuestionRef = useRef(null);
2121
const specPracticeRef = useRef(null);
22+
const actionRef = useRef(null);
23+
const validationRef = useRef(null);
2224

2325
const scrollToSection = (section) => {
2426
setActiveSection(section);
@@ -30,7 +32,9 @@ export const AIFriendlyArchitecture = () => {
3032
'refactor-tool': refactorToolRef,
3133
'retrieval-tool': retrievalToolRef,
3234
'refined-question': refinedQuestionRef,
33-
'spec-practice': specPracticeRef
35+
'spec-practice': specPracticeRef,
36+
'action': actionRef,
37+
'validation': validationRef
3438
};
3539

3640
const ref = refs[section];
@@ -916,6 +920,82 @@ prompts/rules/
916920
</div>
917921
</div>
918922
</div>
923+
924+
<div ref={validationRef} className="mt-12">
925+
<div className="section-header">
926+
<h2 className="section-title bg-green-600">AI 驱动的自验证</h2>
927+
<p className="text-slate-600">通过自动化工具确保代码质量和系统可靠性</p>
928+
</div>
929+
<div className="grid-2">
930+
<div className="card">
931+
<div className="icon-circle bg-green-600">
932+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
933+
stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
934+
<path d="M20 12v6a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-6"></path>
935+
<path d="M4 8V6a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v2"></path>
936+
<path d="M12 2v20"></path>
937+
</svg>
938+
</div>
939+
<h3 className="text-xl font-semibold mb-2">自动化验证</h3>
940+
<p className="text-slate-600 mb-4">通过自动化手段确认代码或系统是否满足预定标准、规范或要求</p>
941+
942+
<div className="bg-slate-100 p-4 rounded-lg">
943+
<h4 className="font-medium mb-2">验证类型</h4>
944+
<ul className="space-y-2">
945+
<li className="flex items-start">
946+
<span className="text-green-600 mr-2">•</span>
947+
<span>自动化测试:单元测试、集成测试、端到端测试</span>
948+
</li>
949+
<li className="flex items-start">
950+
<span className="text-green-600 mr-2">•</span>
951+
<span>代码质量检查:风格检查、复杂度分析、安全扫描</span>
952+
</li>
953+
<li className="flex items-start">
954+
<span className="text-green-600 mr-2">•</span>
955+
<span>规则检查:业务规则验证、架构约束检查</span>
956+
</li>
957+
<li className="flex items-start">
958+
<span className="text-green-600 mr-2">•</span>
959+
<span>幻觉检测:AI 生成内容的准确性和合理性验证</span>
960+
</li>
961+
</ul>
962+
</div>
963+
</div>
964+
965+
<div className="card">
966+
<div className="icon-circle bg-green-600">
967+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
968+
stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
969+
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"></path>
970+
</svg>
971+
</div>
972+
<h3 className="text-xl font-semibold mb-2">持续集成与交付</h3>
973+
<p className="text-slate-600 mb-4">在 CI/CD 流水线中集成自动化验证,确保代码质量和系统可靠性</p>
974+
975+
<div className="bg-slate-100 p-4 rounded-lg">
976+
<h4 className="font-medium mb-2">验证流程</h4>
977+
<ul className="space-y-2">
978+
<li className="flex items-start">
979+
<span className="text-green-600 mr-2">•</span>
980+
<span>代码提交前:本地预提交检查</span>
981+
</li>
982+
<li className="flex items-start">
983+
<span className="text-green-600 mr-2">•</span>
984+
<span>构建阶段:编译检查和依赖验证</span>
985+
</li>
986+
<li className="flex items-start">
987+
<span className="text-green-600 mr-2">•</span>
988+
<span>测试阶段:自动化测试套件执行</span>
989+
</li>
990+
<li className="flex items-start">
991+
<span className="text-green-600 mr-2">•</span>
992+
<span>部署前:环境配置和兼容性检查</span>
993+
</li>
994+
</ul>
995+
</div>
996+
</div>
997+
</div>
998+
</div>
919999
</div>
9201000
);
9211001
};

src/components/ArchitectureFlow.jsx

Lines changed: 28 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react';
1+
import React, { useState } from 'react';
22

33
export const ArchitectureFlow = ({ onClickSection }) => {
44
// 定义颜色常量,与您原始代码中的颜色对应
@@ -24,7 +24,7 @@ export const ArchitectureFlow = ({ onClickSection }) => {
2424
{/* 节点 */}
2525
{/* 顶部行 */}
2626
<g
27-
onClick={() => onClickSection('domain-language')}
27+
onClick={(e) => onClickSection('domain-language', e)}
2828
className="cursor-pointer"
2929
>
3030
<rect
@@ -58,7 +58,7 @@ export const ArchitectureFlow = ({ onClickSection }) => {
5858
</g>
5959

6060
<g
61-
onClick={() => onClickSection('refined-question')}
61+
onClick={(e) => onClickSection('refined-question', e)}
6262
className="cursor-pointer"
6363
>
6464
<rect
@@ -75,7 +75,7 @@ export const ArchitectureFlow = ({ onClickSection }) => {
7575
</g>
7676

7777
<g
78-
onClick={() => onClickSection('planner')}
78+
onClick={(e) => onClickSection('planner', e)}
7979
className="cursor-pointer"
8080
>
8181
<rect
@@ -105,6 +105,23 @@ export const ArchitectureFlow = ({ onClickSection }) => {
105105
</text>
106106
</g>
107107

108+
<g
109+
onClick={(e) => onClickSection('validation', e)}
110+
className="cursor-pointer"
111+
>
112+
<rect
113+
x="1340"
114+
y="415"
115+
width="180"
116+
height="60"
117+
rx="4"
118+
fill={colors.green600}
119+
/>
120+
<text x="1430" y="450" textAnchor="middle" fill="white" fontSize="18" fontWeight="500">
121+
AI 驱动的自验证
122+
</text>
123+
</g>
124+
108125
<g>
109126
<rect
110127
x="67"
@@ -120,7 +137,7 @@ export const ArchitectureFlow = ({ onClickSection }) => {
120137
</g>
121138

122139
<g
123-
onClick={() => onClickSection('spec-practice')}
140+
onClick={(e) => onClickSection('spec-practice', e)}
124141
className="cursor-pointer"
125142
>
126143
<rect
@@ -140,7 +157,7 @@ export const ArchitectureFlow = ({ onClickSection }) => {
140157
</g>
141158

142159
<g
143-
onClick={() => onClickSection('semantic-code')}
160+
onClick={(e) => onClickSection('semantic-code', e)}
144161
className="cursor-pointer"
145162
>
146163
<rect
@@ -157,7 +174,7 @@ export const ArchitectureFlow = ({ onClickSection }) => {
157174
</g>
158175

159176
<g
160-
onClick={() => onClickSection('refactor-tool')}
177+
onClick={(e) => onClickSection('refactor-tool', e)}
161178
className="cursor-pointer"
162179
>
163180
<rect
@@ -174,7 +191,7 @@ export const ArchitectureFlow = ({ onClickSection }) => {
174191
</g>
175192

176193
<g
177-
onClick={() => onClickSection('retrieval-tool')}
194+
onClick={(e) => onClickSection('retrieval-tool', e)}
178195
className="cursor-pointer"
179196
>
180197
<rect
@@ -223,6 +240,9 @@ export const ArchitectureFlow = ({ onClickSection }) => {
223240
{/* 智能任务规划 到 Action */}
224241
<path d="M1246 202 L1340 202" stroke="green" strokeWidth="1.5" fill="none" markerEnd="url(#arrowhead)" />
225242

243+
{/* Action 到 AI 驱动的自验证 */}
244+
<path d="M1430 232 L1430 415" stroke="green" strokeWidth="1.5" fill="none" markerEnd="url(#arrowhead)" />
245+
226246
{/* 代码补全 到 团队编码规范 */}
227247
<path d="M247 445 L330 445" stroke="black" strokeWidth="1.5" fill="none" markerEnd="url(#arrowhead)" />
228248

0 commit comments

Comments
 (0)