Appearance
实现 养老金计算器 工具
分类：career ｜ 标签：养老、社保、退休规划 根据个人社保信息估算退休后每月可领取的养老金金额
2.1 功能说明
根据个人社保信息估算退休后每月可领取的养老金金额
核心能力
- 养老金计算器
- 政策解读
- 意见反馈
2.2 代码实现
2.2.1 组件结构
本工具是一个基于 Vue 3 <script setup> 语法的单文件组件（SFC），统一包裹在 ToolPageShell 组件内，由它提供页面标题、工具 ID、分类与「使用指南」插槽等通用外壳；核心业务逻辑（响应式状态、计算属性、事件处理函数）全部写在 <script setup> 中，输入/输出通过 el-input、el-button 等 Element Plus 组件与用户交互，所有数据均在浏览器本地处理，不会上传服务器。
本工具目录 PensionCalculator/ 下除 index.vue 外，还包含以下源文件：
CalculatorPage.vue（2128 行）GuidePage.vue（367 行）
2.2.2 核心逻辑概览
<script setup> 中定义的主要函数/方法：
goBack()
2.2.3 关键实现代码
以下是该工具的完整 <script setup> 实现（核心代码）。模板（<template>）与样式（<style>）已省略。
vue
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import { ElTabs, ElTabPane, ElButton, ElIcon } from 'element-plus'
import { ArrowLeft } from '@element-plus/icons-vue'
import CalculatorPage from './CalculatorPage.vue'
import GuidePage from './GuidePage.vue'
import FeedbackForm from '@/components/FeedbackForm.vue'
const router = useRouter()
const activeTab = ref('calculator')
// 返回板块列表
const goBack = () => {
router.push('/retirement')
}2.3 效果截图
暂未生成该工具的效果截图。