Appearance
实现 GPA 计算器 工具
分类:general | 标签:GPA、成绩、绩点 按学分加权计算 GPA
2.1 功能说明
按学分加权计算 GPA
2.1.1 使用指南
功能说明
按「学分,百分制成绩」逐行录入课程,按学分加权计算 GPA(支持 4.0 与 5.0 两种算法自动切换)。
使用场景
绩点核算、升学申请。
2.2 代码实现
2.2.1 组件结构
本工具是一个基于 Vue 3 <script setup> 语法的单文件组件(SFC),统一包裹在 ToolPageShell 组件内,由它提供页面标题、工具 ID、分类与「使用指南」插槽等通用外壳;核心业务逻辑(响应式状态、计算属性、事件处理函数)全部写在 <script setup> 中,输入/输出通过 el-input、el-button 等 Element Plus 组件与用户交互,所有数据均在浏览器本地处理,不会上传服务器。
2.2.2 核心逻辑概览
<script setup> 中定义的主要函数/方法:
toPoint()run()clear()
2.2.3 关键实现代码
以下是该工具的完整 <script setup> 实现(核心代码)。模板(<template>)与样式(<style>)已省略。
vue
import { ref } from 'vue'
import ToolPageShell from '@/components/ToolPageShell.vue'
const courses = ref('')
const scale = ref('4')
const error = ref('')
const result = ref(null)
function toPoint(score, s) {
if (score >= 90) return s === '4' ? 4.0 : 5.0
if (score >= 85) return s === '4' ? 3.7 : 4.5
if (score >= 82) return s === '4' ? 3.3 : 4.2
if (score >= 78) return s === '4' ? 3.0 : 3.8
if (score >= 75) return s === '4' ? 2.7 : 3.5
if (score >= 72) return s === '4' ? 2.3 : 3.2
if (score >= 68) return s === '4' ? 2.0 : 2.8
if (score >= 64) return s === '4' ? 1.5 : 2.3
if (score >= 60) return s === '4' ? 1.0 : 1.5
return 0
}
function run() {
error.value = result.value = null
const lines = courses.value.split('\n').map(s => s.trim()).filter(Boolean)
if (!lines.length) { error.value = '请录入课程'; return }
let credits = 0, sumScore = 0, sumPoint = 0
for (const l of lines) {
const [c, sc] = l.split(/[,,]/).map(x => Number(x.trim()))
if (isNaN(c) || isNaN(sc)) { error.value = '格式应为 学分,成绩:' + l; return }
if (c <= 0) { error.value = '学分须为正:' + l; return }
if (sc < 0 || sc > 100) { error.value = '成绩须在 0~100:' + l; return }
credits += c
sumScore += c * sc
sumPoint += c * toPoint(sc, scale.value)
}
result.value = { credits, avg: (sumScore / credits).toFixed(2), gpa: (sumPoint / credits).toFixed(2) }
}
function clear() { courses.value = error.value = result.value = '' }2.3 效果截图
