https://twprobe.com/_next/static/chunks/56259-96b8b0a35d08e5cf.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[56259],{34160:(e,t,a)=>{a.d(t,{CY:()=>p,Ce:()=>n,Ek:()=>l,Hx:()=>s,JM:()=>c,KO:()=>m,L4:()=>N,MZ:()=>i,Nk:()=>d,T4:()=>x,VE:()=>r,cg:()=>f,jc:()=>j,mT:()=>u,pA:()=>b,tK:()=>h,tM:()=>o});let s=["#0a2540","#2563eb","#62748e","#8a6a1f","#0f766e"],l="#cad5e2",n={3:["#0a2540","#2563eb","#3b82f6"],4:["#0a2540","#1e3a8a","#2563eb","#3b82f6"],5:["#0a2540","#1e3a8a","#1d4ed8","#2563eb","#3b82f6"]},r="#059669",i="#e11d48",o="#d97706",x="#94a3b8",m="#e2e8f0",d="#f1f5f9",c="#64748b",h="#475569",b="#94a3b8",f="#cbd5e1",u="#f8fafc",N="#ffffff",p="#0f172a",j="#1e293b"},56259:(e,t,a)=>{a.r(t),a.d(t,{default:()=>R});var s=a(95155),l=a(33546),n=a(11012),r=a(93954),i=a(12115),o=a(99003),x=a(21742),m=a(48035),d=a(28408),c=a(32539),h=a(59656),b=a(65671),f=a(54945),u=a(67389),N=a(76105),p=a(13993),j=a(64086),y=a(21831),g=a(87459),v=a(34160);let k=(e,t=0)=>{let a=Number(e);return Number.isFinite(a)?a:t};function w(e,t,a,s=0){let l=Math.max(0,k(e)),n=Math.max(1,Math.min(50,k(a,30))),r=Math.max(0,Math.min(n-1,k(s,0))),i=Math.max(0,k(t))/100;if(l<=0||n<=0)return{monthly:0,totalInterestNTD:0};let o=12*n,x=12*r,m=o-x;if(i<=0){let e=l/o;return{monthly:Number.isFinite(e)?e:0,totalInterestNTD:0}}let d=i/12;if(x>0&&m>0){let e=(1+d)**m;if(!Number.isFinite(e)||e<=1){let e=l/m;return{monthly:Number.isFinite(e)?e:0,totalInterestNTD:0}}let t=l*d*e/(e-1),a=Math.max(0,l*d*x+t*m-l);return{monthly:Number.isFinite(t)?t:0,totalInterestNTD:Number.isFinite(a)?a:0}}{let e=(1+d)**o;if(!Number.isFinite(e)||e<=1){let e=l/o;return{monthly:Number.isFinite(e)?e:0,totalInterestNTD:0}}let t=l*d*e/(e-1),a=Math.max(0,t*o-l);return{monthly:Number.isFinite(t)?t:0,totalInterestNTD:Number.isFinite(a)?a:0}}}function M(e){let t=Math.max(0,k(e?.loanAmount,1e3)),a=Math.max(0,k(e?.baseRate,2.185)),s=Math.max(0,k(e?.hikeRate,.25)),l=Math.max(1,Math.min(50,k(e?.years,30))),n=Math.max(0,Math.min(l-1,k(e?.graceYears,0))),r=1e4*t,i=w(r,a,l,n),o=w(r,a+s,l,n),x=Math.round(i.monthly),m=parseFloat((i.totalInterestNTD/1e4).toFixed(2)),d=Math.round(o.monthly),c=parseFloat((o.totalInterestNTD/1e4).toFixed(2)),h=Math.max(0,d-x),b=parseFloat(Math.max(0,c-m).toFixed(2)),f=x>0?parseFloat((h/x*100).toFixed(2)):0,u=[{hikePercent:.125,label:"升息半碼 (+0.125%)"},{hikePercent:.25,label:"升息一碼 (+0.25%)"},{hikePercent:.375,label:"升息 1.5 碼 (+0.375%)"},{hikePercent:.5,label:"升息二碼 (+0.50%)"}].map(e=>{let t=w(r,a+e.hikePercent,l,n),s=Math.round(t.monthly),i=parseFloat((t.totalInterestNTD/1e4).toFixed(2));return{hikePercent:e.hikePercent,label:e.label,newRate:parseFloat((a+e.hikePercent).toFixed(3)),monthlyPayment:s,monthlyDiff:Math.max(0,s-x),totalInterest:i,totalInterestDiff:parseFloat(Math.max(0,i-m).toFixed(2))}}),N=w(r,a,30,n),p=w(r,a+s,30,n),j={monthlyDiff:Math.max(0,Math.round(p.monthly-N.monthly)),totalInterestDiff:parseFloat(Math.max(0,(p.totalInterestNTD-N.totalInterestNTD)/1e4).toFixed(2))},y=w(r,a,40,n),g=w(r,a+s,40,n),v={monthlyDiff:Math.max(0,Math.round(g.monthly-y.monthly)),totalInterestDiff:parseFloat(Math.max(0,(g.totalInterestNTD-y.totalInterestNTD)/1e4).toFixed(2))};return{loanAmount:Number.isFinite(t)?t:0,baseRate:Number.isFinite(a)?a:0,hikeRate:Number.isFinite(s)?s:0,newRate:Number.isFinite(a+s)?parseFloat((a+s).toFixed(3)):0,years:Number.isFinite(l)?l:30,graceYears:Number.isFinite(n)?n:0,baseMonthlyPayment:Number.isFinite(x)?x:0,baseTotalInterest:Number.isFinite(m)?m:0,hikedMonthlyPayment:Number.isFinite(d)?d:0,hikedTotalInterest:Number.isFinite(c)?c:0,monthlyDiff:Number.isFinite(h)?h:0,totalInterestDiff:Number.isFinite(b)?b:0,increasePercent:Number.isFinite(f)?f:0,scenarios:u,comp30Year:j,comp40Year:v}}var F=a(42743);let D=F.Ik({loanAmount:F.ai().min(10,"貸款總額不可小於 10 萬").max(1e4,"貸款總額不可超過 1 億"),baseRate:F.ai().min(.1,"基準利率不可小於 0.1%").max(15,"基準利率不可超過 15%"),hikeRate:F.ai().min(0,"升息幅度不可小於 0%").max(5,"升息幅度不可超過 5%"),years:F.ai().min(1,"貸款年限至少 1 年").max(50,"貸款年限最多 50 年"),graceYears:F.ai().min(0,"寬限期不可為負").max(10,"寬限期最多 10 年")}),I=(e,t=0)=>{let a=Number(e);return Number.isFinite(a)?a:t};function R(){let[e,t]=(0,i.useState)(!1),[a,k]=(0,i.useState)(null),{setValue:w,watch:F}=(0,o.mN)({resolver:(0,l.u)(D),defaultValues:{loanAmount:1e3,baseRate:2.185,hikeRate:.25,years:30,graceYears:0}}),R=F(),T=(0,g.Qb)("interest_rate_hike",F(),e=>{for(let[t,a]of Object.entries(e))w(t,a)});if((0,i.useEffect)(()=>{t(!0),fetch("/api/twp/rate").then(e=>e.json()).then(e=>{e?.rate&&w("baseRate",e.rate)}).catch(e=>{console.error(e)});let e=F(e=>{k(M({loanAmount:Math.max(10,I(e.loanAmount,1e3)),baseRate:Math.max(.1,I(e.baseRate,2.185)),hikeRate:Math.max(0,I(e.hikeRate,.25)),years:Math.max(1,I(e.years,30)),graceYears:Math.max(0,I(e.graceYears,0))}))}),a=F();return k(M({loanAmount:Math.max(10,I(a.loanAmount,1e3)),baseRate:Math.max(.1,I(a.baseRate,2.185)),hikeRate:Math.max(0,I(a.hikeRate,.25)),years:Math.max(1,I(a.years,30)),graceYears:Math.max(0,I(a.graceYears,0))})),()=>e.unsubscribe()},[w,F]),!e)return(0,s.jsxs)("div",{className:"animate-pulse flex flex-col lg:flex-row gap-6 lg:gap-8 w-full",children:[(0,s.jsxs)("div",{className:"flex-1 w-full lg:min-w-[300px] space-y-6",children:[(0,s.jsx)("div",{className:"h-[220px] bg-slate-100 rounded-2xl w-full"}),(0,s.jsx)("div",{className:"h-[220px] bg-slate-100 rounded-2xl w-full"})]}),(0,s.jsxs)("div",{className:"flex-1 w-full lg:min-w-[350px] space-y-6",children:[(0,s.jsx)("div",{className:"h-[160px] bg-slate-100 rounded-2xl w-full"}),(0,s.jsx)("div",{className:"h-[240px] bg-slate-100 rounded-2xl w-full"})]})]});let P=a?a.scenarios.map(e=>({name:e.label.split(" ")[0],monthlyDiff:e.monthlyDiff,totalInterestDiff:e.totalInterestDiff})):[];return(0,s.jsx)(N.Z,{children:(0,s.jsx)(y.default,{toolType:"interest_rate_hike",toolInput:T,title:"",children:(0,s.jsx)(j.X,{inputs:(0,s.jsx)("div",{className:"space-y-6",children:(0,s.jsxs)("div",{children:[(0,s.jsxs)("h3",{className:"font-bold text-slate-900 text-base flex items-center gap-2 mb-4",children:[(0,s.jsx)("span",{className:"w-1.5 h-5 bg-slate-900 rounded-full inline-block shrink-0"}),"房貸現況與升息參數設定"]}),(0,s.jsxs)("div",{className:"space-y-4",children:[(0,s.jsx)(p.Cw,{label:"房屋貸款總額 (萬元)",value:F("loanAmount")||0,min:100,max:5e3,step:50,unit:"萬元",onChange:e=>w("loanAmount",e)}

1),(0,s.jsx)(p.Cw,{label:"現行基準房貸利率 (%)",value:F("baseRate")||0,min:.5,max:8,step:.01,unit:"%",onChange:e=>w("baseRate",e)}),(0,s.jsxs)("div",{className:"space-y-2",children:[(0,s.jsx)(p.Cw,{label:"預期央行升息幅度 (%)",value:F("hikeRate")||0,min:0,max:2,step:.025,unit:"%",onChange:e=>w("hikeRate",e)}),(0,s.jsx)("div",{className:"flex flex-wrap gap-2 pt-1",children:[{label:"半碼 (+0.125%)",val:.125},{label:"一碼 (+0.25%)",val:.25},{label:"1.5碼 (+0.375%)",val:.375},{label:"二碼 (+0.50%)",val:.5}].map(e=>(0,s.jsx)("button",{type:"button",onClick:()=>w("hikeRate",e.val),className:`px-3 py-1 text-xs font-bold rounded-lg border transition-colors ${F("hikeRate")===e.val?"bg-slate-900 text-white border-slate-900":"bg-white text-slate-700 border-slate-200 hover:bg-slate-100"}`,children:e.label},e.val))})]}),(0,s.jsx)(p.Cw,{label:"房屋貸款年限 (年)",value:F("years")||0,min:10,max:40,step:1,unit:"年",onChange:e=>w("years",e)}),(0,s.jsx)(p.Cw,{label:"寬限期 (年)",sub:"若未申辦寬限期請填 0",value:F("graceYears")||0,min:0,max:5,step:1,unit:"年",onChange:e=>w("graceYears",e)})]})]})}),results:a?(0,s.jsxs)("div",{className:"space-y-6",children:[a.monthlyDiff>0?(0,s.jsxs)("div",{className:"p-5 bg-white border border-slate-200/90 border-l-4 border-l-rose-600 rounded-2xl shadow-2xs flex items-start gap-4",children:[(0,s.jsx)(n.A,{className:"w-6 h-6 text-rose-600 shrink-0 mt-0.5"}),(0,s.jsxs)("div",{children:[(0,s.jsxs)("h4",{className:"font-bold text-slate-900 text-base",children:["升息衝擊：每月負擔增加 NT$"," ",(0,s.jsx)("span",{className:"font-mono tabular-nums text-rose-700",children:a.monthlyDiff.toLocaleString()})]}),(0,s.jsxs)("p",{className:"text-sm text-slate-600 mt-1 leading-relaxed font-medium",children:["在升息"," ",(0,s.jsxs)("strong",{className:"font-mono tabular-nums text-slate-900 font-bold",children:["+",a.hikeRate,"%"]})," ","(新利率"," ",(0,s.jsxs)("strong",{className:"font-mono tabular-nums text-slate-900 font-bold",children:[a.newRate,"%"]}),") 情境下，你的每月攤還金額增加"," ",(0,s.jsxs)("strong",{className:"font-mono tabular-nums text-rose-700 font-bold",children:["+",a.increasePercent,"%"]}),"；在 ",a.years," 年貸款期內，長期累積利息將多出"," ",(0,s.jsxs)("strong",{className:"font-mono tabular-nums text-rose-700 font-bold",children:[a.totalInterestDiff," 萬元"]}),"。"]})]})]}):(0,s.jsxs)("div",{className:"p-5 bg-white border border-slate-200/90 border-l-4 border-l-emerald-600 rounded-2xl shadow-2xs flex items-start gap-4",children:[(0,s.jsx)(r.A,{className:"w-6 h-6 text-emerald-600 shrink-0 mt-0.5"}),(0,s.jsxs)("div",{children:[(0,s.jsx)("h4",{className:"font-bold text-slate-900 text-base",children:"升息幅度為 0%"}),(0,s.jsx)("p",{className:"text-sm text-slate-600 mt-1 leading-relaxed font-medium",children:"目前未設定升息幅度，請在左側調整升息幅度 (%) 以模擬不同升息情境。"})]})]}),(0,s.jsxs)("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4",children:[(0,s.jsxs)("div",{className:"bg-white p-5 rounded-2xl border border-slate-200/90 shadow-2xs space-y-2",children:[(0,s.jsx)("span",{className:"text-xs font-bold text-slate-500 block",children:"每月攤還金額"}),(0,s.jsxs)("div",{className:"flex items-baseline justify-between",children:[(0,s.jsxs)("div",{className:"text-2xl font-black text-blue-600 font-mono tabular-nums",children:["NT$ ",a.hikedMonthlyPayment.toLocaleString()]}),(0,s.jsxs)("span",{className:"text-xs font-bold text-rose-700 font-mono tabular-nums",children:["+NT$ ",a.monthlyDiff.toLocaleString(),"/月"]})]}),(0,s.jsxs)("div",{className:"text-xs text-slate-500 font-mono tabular-nums",children:["升息前：NT$ ",a.baseMonthlyPayment.toLocaleString()]})]}),(0,s.jsxs)("div",{className:"bg-white p-5 rounded-2xl border border-slate-200/90 shadow-2xs space-y-2",children:[(0,s.jsxs)("span",{className:"text-xs font-bold text-slate-500 block",children:[a.years," 年總利息負擔"]}),(0,s.jsxs)("div",{className:"flex items-baseline justify-between",children:[(0,s.jsxs)("div",{className:"text-2xl font-black text-rose-600 font-mono tabular-nums",children:[a.hikedTotalInterest," 萬"]}),(0,s.jsxs)("span",{className:"text-xs font-bold text-rose-700 font-mono tabular-nums",children:["+",a.totalInterestDiff," 萬"]})]}),(0,s.jsxs)("div",{className:"text-xs text-slate-500 font-mono tabular-nums",children:["升息前總利息：",a.baseTotalInterest," 萬元"]})]})]}),(0,s.jsxs)("div",{className:"bg-white border border-slate-200/90 rounded-2xl overflow-hidden shadow-2xs space-y-0",children:[(0,s.jsxs)("div",{className:"bg-slate-50/80 px-5 py-3 border-b border-slate-200/90 flex items-center gap-2",children:[(0,s.jsx)("span",{className:"w-1.5 h-5 bg-slate-900 rounded-full inline-block shrink-0"}),(0,s.jsx)("h4",{className:"font-bold text-slate-900 text-sm",children:"央行升息情境矩陣對比 (半碼至二碼)"})]}),(0,s.jsx)("div",{className:"overflow-x-auto",children:(0,s.jsxs)("table",{className:"twp-registry-table w-full text-xs text-left",children:[(0,s.jsx)("caption",{className:"sr-only",children:"升息影響試算：各升息情境下的房貸利率、每月攤還、每月增加額與累積多付利息"}),(0,s.jsx)("thead",{className:"bg-slate-100/80 text-slate-700 font-bold border-b border-slate-200/90",children:(0,s.jsxs)("tr",{children:[(0,s.jsx)("th",{scope:"col",className:"px-4 py-3",children:"升息情境"}),(0,s.jsx)("th",{scope:"col",className:"px-4 py-3 text-right",children:"房貸利率"}),(0,s.jsx)("th",{scope:"col",className:"px-4 py-3 text-right",children:"每月攤還"}),(0,s.jsx)("th",{scope:"col",className:"px-4 py-3 text-right",children:"每月增加"}),(0,s.jsx)("th",{scope:"col",className:"px-4 py-3 text-right",children:"累積多繳利息"})]})}),(0,s.jsx)("tbody",{className:"divide-y divide-slate-100 font-medium",children:a.scenarios.map(e=>(0,s.jsxs)("tr",{className:`hover:bg-slate-50 transition-colors ${R.hikeRate===e.hikePercent?"bg-rose-50/40":""}`,children:[(0,s.jsx)("td",{className:"px-4 py-3 font-bold text-slate-900",children:e.label}),(0,s.jsxs)("td",{className:"px-4 py-3 text-right font-mono tabular-nums text-slate-700",children:[e.newRate,"%"]}),(0,s.jsxs)("td",{className:"px-4 py-3 text-right font-mono tabular-nums text-blue-600 font-bold",children:["NT$ ",e.monthlyPayment.toLocaleStr

1ing()]}),(0,s.jsxs)("td",{className:"px-4 py-3 text-right font-mono tabular-nums text-rose-700 font-bold",children:["+NT$ ",e.monthlyDiff.toLocaleString()]}),(0,s.jsxs)("td",{className:"px-4 py-3 text-right font-mono tabular-nums text-rose-700 font-bold",children:["+",e.totalInterestDiff," 萬"]})]},e.hikePercent))})]})})]}),(0,s.jsxs)("div",{className:"bg-white border border-slate-200/90 rounded-2xl p-5 shadow-2xs space-y-4",children:[(0,s.jsxs)("h4",{className:"font-bold text-slate-900 text-sm flex items-center gap-2 border-b border-slate-100 pb-3",children:[(0,s.jsx)("span",{className:"w-1.5 h-5 bg-slate-900 rounded-full inline-block shrink-0"}),"30年期 vs 40年期房貸升息衝擊對比 (升息 +",a.hikeRate,"%)"]}),(0,s.jsxs)("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4",children:[(0,s.jsxs)("div",{className:"bg-slate-50 border border-slate-200/90 rounded-xl p-4 space-y-1.5",children:[(0,s.jsx)("span",{className:"text-xs font-bold text-slate-600",children:"30 年期房貸衝擊"}),(0,s.jsxs)("div",{className:"text-base font-bold text-slate-900 font-mono tabular-nums",children:["每月多繳:"," ",(0,s.jsxs)("span",{className:"text-rose-700 font-mono tabular-nums",children:["+NT$ ",a.comp30Year.monthlyDiff.toLocaleString()]})]}),(0,s.jsxs)("div",{className:"text-xs text-slate-500 font-mono tabular-nums",children:["總利息多繳: +",a.comp30Year.totalInterestDiff," 萬元"]})]}),(0,s.jsxs)("div",{className:"bg-slate-50 border border-slate-200/90 rounded-xl p-4 space-y-1.5",children:[(0,s.jsx)("span",{className:"text-xs font-bold text-slate-600",children:"40 年期房貸衝擊"}),(0,s.jsxs)("div",{className:"text-base font-bold text-slate-900 font-mono tabular-nums",children:["每月多繳:"," ",(0,s.jsxs)("span",{className:"text-rose-700 font-mono tabular-nums",children:["+NT$ ",a.comp40Year.monthlyDiff.toLocaleString()]})]}),(0,s.jsxs)("div",{className:"text-xs text-rose-700 font-mono tabular-nums font-bold",children:["總利息多繳: +",a.comp40Year.totalInterestDiff," 萬元"]})]})]})]}),(0,s.jsxs)("div",{className:"bg-white p-5 rounded-2xl border border-slate-200/90 shadow-2xs space-y-3",children:[(0,s.jsx)("h4",{className:"text-xs font-bold text-slate-500 text-center",children:"各升息情境每月增加金額對比 (NT$)"}),(0,s.jsx)("div",{className:"h-56 w-full",children:(0,s.jsx)(x.u,{width:"100%",height:"100%",children:(0,s.jsxs)(m.E,{data:P,margin:{top:10,right:10,left:0,bottom:0},children:[(0,s.jsx)(d.d,{strokeDasharray:"3 3",vertical:!1,stroke:v.KO}),(0,s.jsx)(c.W,{dataKey:"name",axisLine:!1,tickLine:!1,tick:{fontSize:12,fill:v.JM}}),(0,s.jsx)(h.h,{axisLine:!1,tickLine:!1,tick:{fontSize:12,fill:v.JM}}),(0,s.jsx)(b.m,{cursor:{fill:"transparent"},contentStyle:{borderRadius:"12px",border:`1px solid ${v.KO}`,boxShadow:"0 4px 6px -1px rgb(0 0 0 / 0.1)"},formatter:e=>[`+NT$ ${e.toLocaleString()}`,"每月增加"]}),(0,s.jsx)(f.yP,{dataKey:"monthlyDiff",radius:[6,6,0,0],maxBarSize:50,children:P.map((e,t)=>(0,s.jsx)(u.f,{fill:3===t?v.MZ:v.Hx[0]},`cell-${t}`))})]})})})]})]}):(0,s.jsx)("div",{className:"flex items-center justify-center h-full text-slate-400",children:"請在左側輸入數值開始試算"})})})})}}}]);