diff --git a/components/calculator/career/labor.vue b/components/calculator/career/labor.vue
index 472143f..d1d5c28 100644
--- a/components/calculator/career/labor.vue
+++ b/components/calculator/career/labor.vue
@@ -92,7 +92,7 @@
{{ Number(career.insurance?.expense).toLocaleString() }} (負擔率{{
- laborInsurace.premiumRate[career.insuredUnit] }}%)
+ laborInsurace.premiumRate[career.insuredUnit] }}%)
@@ -125,7 +125,7 @@
-
+
@@ -249,9 +249,7 @@ function calculateCareer(options: any = { propagate: true }) {
calculatePensionSalary()
calculateCareerPensionContribution()
calculateHealthPremium()
- debounce(() => {
- drawChartAndCalculateIncome(propagate)
- })(propagate)
+ drawChartAndCalculateIncome(propagate)
if (propagate) {
emits('update:modelValue', career.value)
}
@@ -421,6 +419,7 @@ function calculateMonthlySaving() {
}
// 畫圖
let incomeChartInstance = ref()
+const debounceId = ref()
function drawChartAndCalculateIncome(propagate = false) {
const { monthlyBasicSalary, insuredUnit, employeeWelfareFund, insurance, pension } = career.value
if (isUnableToDraw.value) {
@@ -516,16 +515,12 @@ function drawChartAndCalculateIncome(propagate = false) {
})
}
- if (0 <= fv) {
+ if (0 < fv) {
dataAndDataIndex.push({
label: '定期定額',
data: [0, fv],
datasetIndex: 0,
})
- } else {
- if (!errorMssage.pending()) {
- errorMssage()
- }
}
const labels = dataAndDataIndex.map(item => item.label)
@@ -558,34 +553,44 @@ function drawChartAndCalculateIncome(propagate = false) {
]
}
- if (incomeChartInstance.value) {
- incomeChartInstance.value.data = data
- incomeChartInstance.value.update()
- return
- }
- const ctx: any = document.getElementById('incomeChart')
- const chartInstance = new Chart(ctx, {
- type: 'bar',
- data: data,
- options: {
- plugins: {
- tooltip: {
- callbacks: {
- label: tooltipFormat,
+ clearTimeout(debounceId.value)
+ debounceId.value = setTimeout(() => {
+ // 錯誤訊息
+ if (fv <= 0) {
+ if (!errorMssage.pending()) {
+ errorMssage()
+ }
+ }
+ // 繪圖
+ if (incomeChartInstance.value) {
+ incomeChartInstance.value.data = data
+ incomeChartInstance.value.update()
+ } else {
+ const ctx: any = document.getElementById('incomeChart')
+ const chartInstance = new Chart(ctx, {
+ type: 'bar',
+ data: data,
+ options: {
+ plugins: {
+ tooltip: {
+ callbacks: {
+ label: tooltipFormat,
+ }
+ }
+ },
+ scales: {
+ x: {
+ stacked: true,
+ },
+ y: {
+ stacked: true
+ }
}
}
- },
- scales: {
- x: {
- stacked: true,
- },
- y: {
- stacked: true
- }
- }
+ })
+ incomeChartInstance = shallowRef(chartInstance)
}
- })
- incomeChartInstance = shallowRef(chartInstance)
+ }, 250)
}
function tooltipFormat(tooltipItems) {
const { raw } = tooltipItems
@@ -594,27 +599,11 @@ function tooltipFormat(tooltipItems) {
}
import { ElMessage, } from 'element-plus'
-import { throttle, debounce } from '../lodash.js'
+import { throttle, } from '../lodash.js'
const errorMssage = throttle(() => {
- // ElMessage.error('收入:兩袖清風!')
+ ElMessage.error('收入:兩袖清風!')
}, 4000)
-
-const debounceId = ref()
-function debounce(func, delay = 250) {
- return (immediate) => {
- clearTimeout(debounceId.value)
- if (immediate) {
- func()
- } else {
- debounceId.value = setTimeout(() => {
- debounceId.value = undefined
- func()
- }, delay)
- }
- }
-}
-
defineExpose({
calculateCareer,
})
diff --git a/components/calculator/index.vue b/components/calculator/index.vue
index fae0a2b..896a8e6 100644
--- a/components/calculator/index.vue
+++ b/components/calculator/index.vue
@@ -344,6 +344,8 @@ const userForm = reactive({
monthlyContribution: 0,
weddingExpense: 0,
yearOfBirth: '',
+ monthlyNetPay: 0,
+ monthlyExpense: 0,
},
parenting: {
childAnnualExpense: 212767,
@@ -366,6 +368,7 @@ const userForm = reactive({
downpayGoal: 0,
monthlyRepay: 0,
downpayYear: 0,
+ downpayTotalPrice: 0,
},
estatePrice: {
county: '',
diff --git a/components/calculator/retirement.vue b/components/calculator/retirement.vue
index dd0fcdf..bca2ef9 100644
--- a/components/calculator/retirement.vue
+++ b/components/calculator/retirement.vue
@@ -28,7 +28,8 @@
- {{ retirement.lifeExpectancy }} 年
+ {{ retirement.lifeExpectancy }} 年
+ ({{ Math.ceil(retirement.yearOfRetire + retirement.lifeExpectancy) }})
-->
@@ -285,8 +286,9 @@ const retirement = computed(() => {
return props.modelValue
})
const isFormDisabled = computed(() => {
- const { monthlyBasicSalary } = props.career
- return !monthlyBasicSalary
+ const { monthlyBasicSalary, } = props.career
+ const { careerInsuranceType } = props.profile
+ return !monthlyBasicSalary || !careerInsuranceType
})
const unableToDraw = computed(() => {
const { monthlyBasicSalary } = props.career
diff --git a/components/calculator/spouse.vue b/components/calculator/spouse.vue
index 127508b..69f6b39 100644
--- a/components/calculator/spouse.vue
+++ b/components/calculator/spouse.vue
@@ -151,7 +151,11 @@ function calculatecSpouse(options: any = { propagate: true }) {
}
function calculateMonthlyContribution() {
const { monthlyNetPay, monthlyExpense } = spouse.value
- spouse.value.monthlyContribution = monthlyNetPay - monthlyExpense
+ if (monthlyNetPay) {
+ spouse.value.monthlyContribution = monthlyNetPay - monthlyExpense
+ } else {
+ spouse.value.monthlyContribution = 0
+ }
}
function calculateYearOfMarriage() {
const { yearOfMarriage } = spouse.value