1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
<script setup lang="ts">
import text2videoService from "@/api/service/text2videoService";
import utils from "@/utils/utils";
import {
ElMessage, genFileId,
type UploadInstance,
type UploadProps,
type UploadRawFile
} from "element-plus";
import { nextTick, onMounted, reactive, ref } from "vue";
const debug = ref(import.meta.env.MODE === 'production' ? false : true);
// const debug = ref(false);
const loading = ref(false);
const form = reactive({
task_id: "",
birth: "1982-04",
sex_value: "男",
sex_option: [
{
value: '男',
label: '男',
},
{
value: '女50岁退休',
label: '女（普通）50岁退',
},
{
value: '女55岁退休',
label: '女（管理、灵活就业）55岁退',
},
],
retire_age: "",
retire_date: "",
how_long_to_retire: "",
});
onMounted(() => {
// 初始化task_id
form.task_id = utils.genDateTimeStr();
console.log('页面加载，task_id=', form.task_id)
});
const calculateRetirement = (birthStr: string, gender: string) => {
let parts = birthStr.split('-'); // 使用'-'作为分隔符来拆分字符串
let birthYear = parseInt(parts[0], 10); // 年份
let birthMonth = parseInt(parts[1], 10); // 月份
const currentYear = new Date().getFullYear();
const birthDate = new Date(`${birthYear}-${birthMonth < 10 ? '0' + birthMonth : birthMonth}-01`);
let retirementAge, delayMonths, retirementYear, retirementMonth;
if (gender === '男') {
retirementAge = 60;
delayMonths = Math.floor((currentYear - birthYear) / 4) * 4;
} else if (gender === '女50岁退休') {
retirementAge = 50;
delayMonths = Math.floor((currentYear - birthYear) / 2) * 2;
} else if (gender === '女55岁退休') {
retirementAge = 55;
delayMonths = Math.floor((currentYear - birthYear) / 4) * 4;
} else {
console.log("Invalid gender input. Please choose '男', '女50岁退休', or '女55岁退休'.");
return;
}
retirementAge += Math.floor(delayMonths / 12);
console.log(retirementAge, delayMonths)
let retirementDate = new Date(birthDate);
console.log(retirementDate)
retirementDate.setFullYear(retirementDate.getFullYear() + retirementAge);
retirementDate.setMonth(retirementDate.getMonth() + delayMonths % 12);
console.log(retirementDate)
retirementYear = retirementDate.getFullYear();
retirementMonth = retirementDate.getMonth() + 1; // getMonth() returns 0-11
console.log(retirementYear, retirementMonth)
let yearsUntilRetirement = retirementDate.getFullYear() - currentYear -1;
let monthsUntilRetirement = (retirementDate.getMonth() - new Date().getMonth() + 12) % 12 -1;
if (monthsUntilRetirement < 0) {
yearsUntilRetirement--;
monthsUntilRetirement += 12;
}
form.retire_age = `${retirementAge}岁+${delayMonths % 12}个月`,
form.retire_date = `${retirementYear}-${retirementMonth < 10 ? '0' + retirementMonth : retirementMonth}-01`,
form.how_long_to_retire = `${yearsUntilRetirement}年${monthsUntilRetirement}个月`
};
</script>
<!-- ============================================================================================================ -->
<!-- ============================================================================================================ -->
<!-- ============================================================================================================ -->
<template>
<main class="home-container">
<!-- 标题 -->
<el-divider content-position="left">延迟退休年龄计算器</el-divider>
<el-form :model="form" label-width="114px" v-loading="loading">
<!-- 输入出生年月 -->
<el-form-item label="出生年月">
<el-date-picker v-model="form.birth" type="month" placeholder="Pick a month" />
</el-form-item>
<!-- 性别 -->
<el-form-item label="性别">
<el-select
v-model="form.sex_value"
placeholder="Select"
size="large"
style="width: 240px"
>
<el-option
v-for="item in form.sex_option"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<!-- 计算 -->
<el-form-item>
<el-button type="primary" @click="calculateRetirement(form.birth, form.sex_value)"
>开始计算</el-button
>
</el-form-item>
<!-- 结果 -->
<el-form-item label="您的退休年龄">
<el-text class="mx-1">{{ form.retire_age }}</el-text>
</el-form-item>
<el-form-item label="您的退休日期">
<el-text class="mx-1">{{ form.retire_date }}</el-text>
</el-form-item>
<el-form-item label="距离退休还有">
<el-text class="mx-1">{{ form.how_long_to_retire }}</el-text>
</el-form-item>
</el-form>
</main>
</template>
<style lang="scss" scoped>
.home-container {
width: 100%;
}
</style>