Duguay/jiaowu-test
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 修复面试评价页面UI和功能优化

Browse Source 
- 重新设计面试评价三板块(专业能力、现场表现力、综合评价)的布局
- 移除专业能力和现场表现力图标的彩色背景框
- 删除综合评价板块的图标
- 修复评价内容字符串解析错误
- 优化三个评价板块的视觉样式和内容提取逻辑

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
KQL
2025-09-08 04:29:40 +08:00
parent d1f6f2ee0d
commit ec7b14e3e8
11 changed files with 5374 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
src/pages/InterviewSimulationPage/components/InterviewRating/index.jsx
View File

@@ -339,14 +339,72 @@ export default ({ selectedItem = "求职面试初体验" }) => {
</div>
</div>
{/* 基础面试评价区域 */}
<div className="interview-evaluation-text-wrapper">
<div className="interview-rating-header" style={{ justifyContent: 'flex-start' }}>
<img src="https://ddcz-1315997005.cos.ap-nanjing.myqcloud.com/static/img/teach_sys_icon/recuUY5vlvUj2X.png" alt="icon" style={{ width: '28px', height: '28px', marginRight: '10px' }} />
<span className="interview-rating-header-title">{getEvaluationData().title}</span>
{/* 面试评价三板块区域 */}
<div className="interview-evaluation-sections">
{/* 专业能力板块 */}
<div className="evaluation-section">
<div className="section-header">
<div className="section-icon professional-icon">
<img src="https://ddcz-1315997005.cos.ap-nanjing.myqcloud.com/static/img/teach_sys_icon/recuUY5vlvUj2X.png" alt="专业能力" />
</div>
<h3 className="section-title">专业能力</h3>
<div className="section-score">
<span className="score-label">得分</span>
<span className="score-value">{getEvaluationData().professionalScore}</span>
<span className="score-total">/60</span>
</div>
</div>
<div className="section-content">
<ReactMarkdown>
{(() => {
const content = getEvaluationData().content;
const sections = content.split('#');
if (sections.length > 1) {
const professionalContent = sections[1].split('\n\n');
return professionalContent.slice(1, -1).join('\n\n');
}
return '';
})()}
</ReactMarkdown>
</div>
</div>
<div className="interview-rating-text">
<ReactMarkdown>{getEvaluationData().content}</ReactMarkdown>
{/* 现场表现力板块 */}
<div className="evaluation-section">
<div className="section-header">
<div className="section-icon performance-icon">
<img src="https://ddcz-1315997005.cos.ap-nanjing.myqcloud.com/static/img/teach_sys_icon/recuUY5uY7Ek50.png" alt="现场表现力" />
</div>
<h3 className="section-title">现场表现力</h3>
<div className="section-score">
<span className="score-label">得分</span>
<span className="score-value">{getEvaluationData().performanceScore}</span>
<span className="score-total">/40</span>
</div>
</div>
<div className="section-content">
<ReactMarkdown>
{getEvaluationData().content.split('# 现场表现力')[1].split('# 综合评价')[0].trim()}
</ReactMarkdown>
</div>
</div>
{/* 综合评价板块 */}
<div className="evaluation-section comprehensive-section">
<div className="section-header">
<h3 className="section-title">综合评价</h3>
<div className="section-badge">
{getEvaluationData().totalScore >= 80 ? '优秀' :
getEvaluationData().totalScore >= 60 ? '良好' :
getEvaluationData().totalScore >= 40 ? '及格' : '需努力'}
</div>
</div>
<div className="section-content">
<ReactMarkdown>
{getEvaluationData().content.split('# 综合评价')[1].trim()}
</ReactMarkdown>
</div>
</div>
</div>
</>