+ +
+
+

Python代码测评

+
+
+ + + +
+
+ +
+
+
+
+

代码评分

+
+ 0 +
/ 10
+
+
待评分
+
+
+

问题列表 0

+
+

请运行测评查看代码中的问题

+
+
+
+
+

测评总结

+
+

请运行测评查看代码质量总结

+
+
+
+
diff --git a/front/frontend/styles.css b/front/frontend/styles.css index 508db0f..90b2b2a 100644 --- a/front/frontend/styles.css +++ b/front/frontend/styles.css @@ -98,6 +98,273 @@ body { .project-header-inline { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1rem; } .project-header-inline h2 { margin:0; font-size:1.25rem; font-weight:700; } .badge { display:inline-block; padding:.25rem .6rem; font-size:.65rem; letter-spacing:.5px; background:rgba(0,212,255,.15); border:1px solid rgba(0,212,255,.4); border-radius:6px; color:#00d4ff; font-weight:600; } + +/* 代码测评页面样式 */ +.code-review-container { + padding: 2rem 0; +} + +.code-review-container h2 { + font-size: 1.5rem; + font-weight: 700; + margin-bottom: 1.5rem; + color: #ffffff; +} + +.code-input-section { + background: rgba(255, 255, 255, 0.05); + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 12px; + padding: 1.5rem; + margin-bottom: 1.5rem; +} + +.code-editor-controls { + display: flex; + gap: 1rem; + margin-bottom: 1rem; + flex-wrap: wrap; +} + +.btn-secondary { + background: rgba(255, 255, 255, 0.1); + border: 1px solid rgba(255, 255, 255, 0.2); + color: #ffffff; + padding: 0.5rem 1rem; + border-radius: 8px; + cursor: pointer; + font-weight: 500; + transition: all 0.2s ease; + display: flex; + align-items: center; + gap: 0.5rem; +} + +.btn-secondary:hover { + background: rgba(255, 255, 255, 0.15); + border-color: rgba(255, 255, 255, 0.3); +} + +.code-editor-wrapper { + position: relative; +} + +#python-code-input { + width: 100%; + min-height: 300px; + background: rgba(0, 0, 0, 0.3); + border: 1px solid rgba(255, 255, 255, 0.2); + border-radius: 8px; + color: #ffffff; + font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace; + font-size: 0.9rem; + line-height: 1.5; + padding: 1rem; + resize: vertical; + outline: none; +} + +#python-code-input:focus { + border-color: #00d4ff; + box-shadow: 0 0 0 2px rgba(0, 212, 255, 0.25); +} + +.results-section { + display: grid; + grid-template-columns: 1fr 3fr; + gap: 1.5rem; + margin-bottom: 1.5rem; +} + +.score-card { + background: rgba(255, 255, 255, 0.05); + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 12px; + padding: 1.5rem; + text-align: center; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + +.score-card h3 { + font-size: 1rem; + font-weight: 600; + margin-bottom: 1rem; + color: rgba(255, 255, 255, 0.8); +} + +.score-display { + display: flex; + align-items: baseline; + justify-content: center; + gap: 0.5rem; + margin-bottom: 1rem; +} + +#code-score { + font-size: 3rem; + font-weight: 700; + color: #00d4ff; +} + +.score-label { + font-size: 1.25rem; + color: rgba(255, 255, 255, 0.6); +} + +#score-quality { + font-size: 1rem; + font-weight: 600; + padding: 0.25rem 0.75rem; + border-radius: 6px; + background: rgba(0, 212, 255, 0.2); + border: 1px solid rgba(0, 212, 255, 0.3); + color: #00d4ff; +} + +.issues-container { + background: rgba(255, 255, 255, 0.05); + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 12px; + padding: 1.5rem; +} + +.issues-container h3 { + font-size: 1rem; + font-weight: 600; + margin-bottom: 1rem; + color: rgba(255, 255, 255, 0.8); + display: flex; + align-items: center; + justify-content: space-between; +} + +#issues-count { + font-size: 0.85rem; + padding: 0.2rem 0.5rem; + background: rgba(0, 212, 255, 0.2); + border-radius: 4px; + color: #00d4ff; +} + +.issues-list { + max-height: 400px; + overflow-y: auto; +} + +.issue-item { + background: rgba(0, 0, 0, 0.2); + border: 1px solid rgba(255, 255, 255, 0.05); + border-radius: 6px; + padding: 0.75rem; + margin-bottom: 0.75rem; +} + +.issue-header { + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: 0.5rem; +} + +.issue-type { + font-size: 0.75rem; + padding: 0.2rem 0.5rem; + border-radius: 4px; + font-weight: 600; +} + +.issue-type.error { + background: rgba(255, 0, 0, 0.2); + color: #ff6b6b; + border: 1px solid rgba(255, 0, 0, 0.3); +} + +.issue-type.warning { + background: rgba(255, 165, 0, 0.2); + color: #ffcc66; + border: 1px solid rgba(255, 165, 0, 0.3); +} + +.issue-type.info { + background: rgba(0, 128, 0, 0.2); + color: #66ff99; + border: 1px solid rgba(0, 128, 0, 0.3); +} + +.issue-line { + font-size: 0.75rem; + color: rgba(255, 255, 255, 0.6); +} + +.issue-message { + font-size: 0.85rem; + color: rgba(255, 255, 255, 0.8); + line-height: 1.4; +} + +.summary-section { + background: rgba(255, 255, 255, 0.05); + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 12px; + padding: 1.5rem; +} + +.summary-section h3 { + font-size: 1rem; + font-weight: 600; + margin-bottom: 1rem; + color: rgba(255, 255, 255, 0.8); +} + +.summary-content { + font-size: 0.9rem; + line-height: 1.6; + color: rgba(255, 255, 255, 0.7); +} + +.summary-content ul { + list-style: none; + padding: 0; +} + +.summary-content li { + margin-bottom: 0.75rem; + display: flex; + align-items: flex-start; + gap: 0.75rem; +} + +.summary-content li i { + color: #00d4ff; + margin-top: 0.25rem; + min-width: 16px; +} + +.empty-message { + color: rgba(255, 255, 255, 0.5); + font-style: italic; + text-align: center; + padding: 2rem 0; +} + +/* 响应式设计 */ +@media (max-width: 768px) { + .results-section { + grid-template-columns: 1fr; + } + + .code-editor-controls { + flex-direction: column; + } + + .btn-primary, .btn-secondary { + width: 100%; + justify-content: center; + } +} .badge.approx { background:rgba(255,193,7,.15); border-color:rgba(255,193,7,.4); color:#ffc107; } .badge.full { background:rgba(0,255,136,.15); border-color:rgba(0,255,136,.4); color:#00ff88; }