https://web-static.linetv.tw/release-fargate/public/dist/pages-Pay…tVip-PaymentVipFormLinepay-cda913d4-prod.js

1"use strict";(self.__LOADABLE_LOADED_CHUNKS__=self.__LOADABLE_LOADED_CHUNKS__||[]).push([[8893],{22330:(e,t,n)=>{n.r(t),n.d(t,{default:()=>z});var a=n(96540),l=n(61225),s=n(7350),o=n.n(s),i=n(56347),r=n(54625),c=n(95260),m=n(46942),d=n.n(m),u=n(12215),p=n.n(u),v=n(77844),h=n.n(v),f=n(2056),g=n.n(f),x=n(95251),E=n(86663),y=n(85699),b=n(93172),N=n(91519),A=n(94395),_=n(34480),w=n(92867),C=n(34417),S=n(74550),R=n(35211),I=n(54543),O=n(32721),L=n(37053),P=n(8649),M=n(98672),T=n(7029),k=n(40482),j=n(58865),U=n(82664),Y=n(82256),$=n(86421),D=n(5281),B=n(52515),H=n(45759),V=n(34900);function F(){return F=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)({}).hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},F.apply(null,arguments)}const W=Object.freeze({SETUP:"SETUP",PAY:"PAY",ERROR_ANY:"ERROR_ANY",...w.R}),Z=[{emoji:"🇹🇼",language:"zh",region:"TW"}].map(e=>`${e.language}-${e.region}`),q={refreshProfile:N.XR},z=(0,l.Ng)(function(e){const t=(0,A.T_)(e),n=e=>{const t=e.split("-");return{cityCode:Number(t[0]),regionCode:Number(t[1])}};return{profile:t,phoneCountryCode:t.phoneCountryCode,phoneWithoutCountryCode:t.phoneWithoutCountryCode,cityCode:t.addressZipcode?n(t.addressZipcode).cityCode:"",regionCode:t.addressZipcode?n(t.addressZipcode).regionCode:"",address:t.address||""}},q)(function(e){var t;const{svod:n,profile:s,phoneWithoutCountryCode:m,cityCode:u,regionCode:v,address:f,refreshProfile:N}=e,A=(0,l.d4)(e=>Boolean(e.deviceType.isMobile)),{productId:q,svodId:z,groupId:K}=(0,b.A)(),G=(0,i.g)().model,[X,J]=(0,a.useState)(),[Q,ee]=(0,a.useState)(""),[te,ne]=(0,a.useState)(W.SETUP),[ae,le]=(0,a.useState)([{value:-1,code:-1,name:"請選擇縣市"}]),[se,oe]=(0,a.useState)(!1),[ie,re]=(0,a.useState)(!1),[ce,me]=(0,a.useState)({}),[de,ue]=(0,a.useState)(""),[pe,ve]=(0,a.useState)(""),[he]=(0,a.useState)({purchase_model:y.G7,svod_id:z,group_id:K}),[fe,ge]=(0,a.useState)(m?`0${m}`:""),[xe,Ee]=(0,a.useState)(u),[ye,be]=(0,a.useState)(v),[Ne,Ae]=(0,a.useState)(f),[_e,we]=(0,a.useState)(!0),[Ce,Se]=(0,a.useState)(!0),[Re,Ie]=(0,a.useState)(!0),[Oe,Le]=(0,a.useState)(!0),[Pe,Me]=(0,a.useState)(!0),Te=(0,a.useRef)(),{isFromApp:ke}=(0,a.useMemo)(()=>(0,E.parse)(location.search),[location.search]);function je(e,t){(0,T.L2)({action:"use_discount_code",action_value:e,status:t.toString()})}(0,a.useLayoutEffect)(()=>{(async()=>{try{const e=await(0,B.tX)();le([...ae,...e])}catch(e){le([{value:-1,code:-1,name:"請選擇縣市"}]),console.error(e)}})()},[]),(0,a.useEffect)(()=>{try{if(n&&Array.isArray(n.products)){const e=Date.now(),t=n.products.filter(t=>"LinePay"===t.source&&t.startedAt<=e&&t.expiredAt>e).find(e=>e.id==q);if(t)return void J(t)}ne(W.ERROR_NO_PRODUCT)}catch(e){ne(W.ERROR_ANY)}},[n,q]),(0,a.useEffect)(()=>{const e=new AbortController;te===W.PAY&&(fe&&(async()=>{try{await(0,H.yn)({address:Ne&&xe&&ye?Ne:"",addressZipcode:Ne&&xe&&ye?xe+"-"+ye:"",birthday:s.birthday,email:s.email,gender:s.gender,name:s.name,phoneCountryCode:fe?"886":"",phoneWithoutCountryCode:fe?fe.substring(1):""}),N()}catch(e){console.error(e)}})(),(async()=>{try{var t,n;const a=null===(t=Te.current)||void 0===t?void 0:t.getEInvoiceData(),l=await c.A.post(`${Y.apiHost}/v1/purchase/linepay/reserve`,{signal:e.signal,headers:{Authorization:M.A.getAccessToken()},searchParams:$.A,json:{productId:q,confirmUrl:(0,P.A)(`${window.location.origin}/payment/${G}/result/linepay`,{groupId:K,...he}),cancelUrl:(0,P.A)(`${window.location.origin}/payment/${G}/result/linepay`,{cancel:!0,groupId:K,...he}),capture:!0,platform:A?"mobile_web":"desktop_web",discountCode:null!==(n=null==ce?void 0:ce.code)&&void 0!==n?n:"",eInvoiceInfo:{email:a.email,businessName:a.businessName,businessAdminNum:a.businessAdminNum,businessAddress:a.businessAddress,purchaserName:Q}}}),s=await l.json();if(!h()(s.info.paymentUrl.web))throw new Error("invalid LINE PAY payment URL");window.location.assign(s.info.paymentUrl.web)}catch(e){try{if(e.response instanceof Response){const{code:t,message:n}=await e.response.json();if(y.tj.includes(t))return ve(n),ne(W.ERROR_IS_COUPON_INVALID),y.O4.includes(t)&&(0,T.$)({placement_title:"enter_discount_code_error"}),void me({code:null,price:null});switch(t){case y.__.IsVip:ne(W.ERROR_ALREADY_HAS);break;case 9113:ne(W.ERROR_IS_LIMITED_PURCHASE);break;default:ne(W.ERROR_ANY)}return}}catch{}ne(W.ERROR_ANY)}})())},[te,q,K,he,A,Te,Q,fe,Ne,xe,ye]),(0,a.useEffect)(()=>{window.scrollTo({top:0,behavior:"smooth"})},[ce]);const Ue=o()(()=>{window.scrollBy({top:200,behavior:"smooth"})},5e3,{leading:!0,trailing:!1}),Ye=(0,a.useMemo)(()=>{const e={value:-1,code:-1,name:"請選擇區域"};return xe>0&&ae.some(e=>e.code===xe)?[e,...ae.find(e=>e.code===xe).region]:[e]},[xe,ae]);return a.createElement("div",{className:"container flex flex-col px-4 lg:flex-row"},a.createElement(V.A,F({className:"flex-auto"},X,{couponInfo:ce})),a.createElement("div",{className:"mt-8 flex-none lg:mt-0 lg:w-4/6 lg:pl-10"},a.createElement("h2",{className:"mb-6 text-20 font-700 text-linetv-high-emphasis"}

1,"填寫付款資訊"),a.createElement("div",{className:"rounded-px-lg bg-linetv-grey-800 px-5 py-10 lg:p-10"},a.createElement(C.eI,{className:d()("mb-5",{"is-invalid":!_e})},a.createElement(C.lR,null,"付款人姓名",a.createElement("span",{className:"font-700"},"*")),a.createElement(C.zB,null,a.createElement(S.A,{className:d()({"is-invalid":!_e}),type:"text",value:Q,onChange:e=>{ee(e.target.value.trim()),we(!g()(e.target.value.trim()))},onBlur:()=>we(!g()(Q)),placeholder:"請輸入付款人姓名",autoComplete:"name",autoFocus:!0,required:!0}),a.createElement("div",{className:"mt-2 text-12 font-400 leading-4 text-linetv-negative"},_e?"":"此為必填資料"))),a.createElement(_.A,{ref:Te}),a.createElement("hr",{className:"my-5 border-b"}),a.createElement("div",null,a.createElement("div",{className:"mb-5 flex list-disc text-14 leading-5 text-linetv-medium-emphasis"},a.createElement("i",{className:"material-icons icon_web_information mr-2 flex-none text-20 text-linetv-grey-100"}),a.createElement("p",null,"若參與活動得獎，將以此資訊與您聯繫。")),a.createElement("div",{className:"mb-7 flex flex-col items-start"},a.createElement("div",{className:"mb-3 text-16 font-700 leading-6 text-linetv-high-emphasis"},"聯絡電話*"),a.createElement("div",{className:"flex w-full flex-row flex-wrap text-14 font-700 leading-5 text-linetv-high-emphasis"},a.createElement(S.A,{type:"text",inputMode:"tel",autoComplete:"tel",placeholder:"0900000000",value:fe,pattern:"09\\d{8}",onChange:e=>{ge(e.target.value),Se((0,x.Ay)(e.target.value,Z))},onBlur:()=>Se((0,x.Ay)(fe,Z)),maxLength:10,required:!0}),a.createElement("span",{className:"mt-2 h-4 text-12 font-400 leading-4 text-linetv-negative"},Ce?"":"請輸入有效的行動電話號碼，開頭為09"))),a.createElement("div",{className:"mb-7 flex flex-col items-start"},a.createElement("div",{className:"mb-3 text-16 font-700 leading-6 text-linetv-high-emphasis"},"地址"),a.createElement("div",{className:"mb-4 flex w-full flex-col gap-4 text-14 font-400 leading-5 text-linetv-high-emphasis lg:flex-row"},a.createElement("div",{className:"flex w-full flex-1 flex-col"},a.createElement(I.A,{value:xe||-1,optionList:ae,onSelect:e=>{Ee(e),be(-1),Ae("")},overlappingZindex:100,handleScrollOnClick:Ue}),a.createElement("span",{className:"mt-2 text-12 font-400 leading-4 text-linetv-negative"},Re?"":"未選擇縣市")),a.createElement("div",{className:"flex w-full flex-1 flex-col"},a.createElement(I.A,{value:ye||-1,optionList:Ye,onSelect:e=>be(e),overlappingZindex:100}),a.createElement("span",{className:"mt-2 text-12 font-400 leading-4 text-linetv-negative"},Oe?"":"未選擇區域"))),a.createElement("div",{className:"flex w-full flex-col"},a.createElement(S.A,{type:"text",inputMode:"text",autoComplete:"tel",placeholder:"街道地址",maxlength:"128",value:Ne,onChange:e=>{const t=e.target.value.trim(),n=""!==t;Ae(t),Ie(xe>0||!n),Le(ye>0||!n),Me(xe>0&&ye>0&&n)}}),a.createElement("span",{className:"mt-2 text-12 font-400 leading-4 text-linetv-negative"},Pe?"":"未填寫街道地址")))),a.createElement("hr",{className:"my-7 border-b"}),a.createElement("div",{className:d()("flex items-center justify-between",ce.code&&"my-[-1.75rem] py-7")},a.createElement("div",{className:"flex h-8 items-center text-linetv-high-emphasis"},a.createElement("span",{className:"mx-3 text-16 font-700"},"折扣碼"),a.createElement("span",{className:"max-w-[10rem] overflow-hidden text-ellipsis whitespace-nowrap text-14 md:max-w-[28rem]"},ce.code)),!ce.code&&a.createElement("button",{type:"button",className:"btn--secondary-sm h-8 px-3",onClick:()=>oe(!0)},"輸入折扣碼")),a.createElement("hr",{className:"my-7 border-b"}),a.createElement("div",{className:"mt-10 flex flex-col lg:mt-12 lg:flex-row-reverse"},a.createElement("button",{type:"button",className:"btn--primary inline-flex flex-none items-center justify-center lg:ml-4 lg:w-2/3",onClick:async function(){var e;if(null!=X&&null!==(e=X.metadata)&&void 0!==e&&e.hidden)try{if(!(await(0,D.hl)(q)).isValid)return void ne(W.ERROR_FOLKSONOMY)}catch(e){console.log(e),ne(W.ERROR_ANY)}!async function(){var e;const t=!g()(Q),a=null===(e=Te.current)||void 0===e?void 0:e.checkRequiredFields();t&&a?((0,T.WO)({api:"user_preference",event1:z,event3:n.name,event4:"Purchase_Page",event5:"LinePay",event6:"SVOD",event10:"Purchase_button",isMobile:A,profile:s}),ne(W.PAY)):we(t)}()},disabled:!_e||!Ce||!(null!==(t=Te.current)&&void 0!==t&&t.isValidEmail)},"LINE PAY 付款"),a.createElement(r.N_,{className:"btn--secondary mt-3 flex-auto lg:mt-0",to:(0,P.A)(`/payment/${G}

1/order`,{svodId:z,groupId:K,isFromApp:ke,...he})},"上一步")))),a.createElement(R.A,{isOpen:te===W.PAY,style:{overlay:{backgroundColor:U.theme.colors["linetv-background"]},content:{maxWidth:"15rem",backgroundColor:"transparent"}}},a.createElement("div",{className:"flex flex-col items-center leading-6"},a.createElement("div",{className:"flex text-14 font-700 text-linetv-primary"},a.createElement("span",null,"卡片資料驗證中，請稍候")," ",a.createElement(O.A,{width:"24px",height:"24px",path:`${j.A}/lottie_json/loading_button_green.json`})))),a.createElement(w.A,{isOpen:Boolean(w.R[te]),error:te,errorMessage:pe,backToPurchaseUrl:(0,P.A)("/purchase/vip",{groupId:K,purchase_model:y.G7,group_id:K}),closeModal:()=>ne(W.SETUP)}),a.createElement(L.A,{isOpen:se,closeModal:()=>oe(!1),handleUseCouponCode:async function(e){re(!0);try{var t,n;const{data:a}=await(0,D.if)({discountCode:e.trim(),svodId:parseInt(z),accountId:p().get(k.KA)});me({code:null==a||null===(t=a.discountInfo)||void 0===t?void 0:t.code,price:null==a||null===(n=a.discountInfo)||void 0===n?void 0:n.price}),je(e,null==a?void 0:a.code),oe(!1)}catch(t){if(null!=t&&t.data){const{code:n,message:a}=t.data;ue(a||"目前無法兌換，請稍候再試"),je(e,n)}else ue("目前無法兌換，請稍候再試")}re(!1)},isValidCouponLoading:ie,couponErrorMessage:de,setCouponErrorMessage:ue,isMobile:A}))})},32721:(e,t,n)=>{n.d(t,{A:()=>c});var a=n(96540),l=n(49891),s=n.n(l),o=n(92568),i=n(58865);const r=o.Ay.div.withConfig({displayName:"LottieLoading__StyledLoadingContainer",componentId:"sc-1c4fvhi-0"})(["width:",";height:",";"],e=>e.width,e=>e.height),c=e=>{const{width:t,height:n,path:l}=e;return(0,a.useEffect)(()=>{s().loadAnimation({container:document.querySelector("#lottie-loading"),renderer:"svg",loop:!0,autoplay:!0,speed:1.5,path:l||`${i.A}/lottie_json/loading.json`})},[]),a.createElement(r,{width:t,height:n,id:"lottie-loading"})}},34900:(e,t,n)=>{n.d(t,{A:()=>l});var a=n(96540);function l(e){var t;const{metadata:n,couponInfo:l}=e,s=(null==n?void 0:n.previousPriceText)||"",o=(null==n?void 0:n.priceText)||"",i=o.replace(/[^0-9]/g,"");return a.createElement("div",{className:e.className,style:e.style},a.createElement("h2",{className:"mb-4 text-18 font-700 text-linetv-high-emphasis md:mb-5 md:text-20"},"您購買的方案"),a.createElement("div",{className:"flex flex-col rounded-px-lg bg-linetv-grey-800 px-6 py-8 text-linetv-high-emphasis md:px-9 md:py-10"},a.createElement("div",{className:"mb-2 self-start rounded-px-2xl bg-linetv-yellow px-2 py-1 text-10 leading-4 text-linetv-btn-content md:text-12"},"VIP"),a.createElement("h3",{className:"mb-2 text-18 font-700 md:text-20"},null==n?void 0:n.name),(null==l?void 0:l.code)&&a.createElement(a.Fragment,null,a.createElement("div",{className:"mt-1 text-16 font-700 text-linetv-high-emphasis"},a.createElement("div",null,s?"優惠價 ":"",o,a.createElement("span",{className:"text-linetv-negative"},` - $${null==l?void 0:l.price}`))),a.createElement("div",{className:"mt-2 text-18 font-700 text-linetv-primary md:text-20"},"NT$ ",i-(null==l?void 0:l.price)<=0?0:i-(null==l?void 0:l.price))),!(null!=l&&l.code)&&n&&a.createElement(a.Fragment,null,s&&a.createElement("div",{className:"mt-1 text-linetv-negative line-through",style:{textDecorationThickness:"2px"}},a.createElement("div",{className:"text-16 font-700 text-linetv-high-emphasis"},s)),a.createElement("div",{className:"mt-2 text-18 font-700 text-linetv-primary md:text-20"},s?"優惠價 ":"",o)),(null==n?void 0:n.descHtml)&&a.createElement(a.Fragment,null,a.createElement("div",{className:"mb-2 mt-10 text-16 font-700"},"方案說明"),a.createElement("p",{className:"text-14 text-linetv-medium-emphasis",dangerouslySetInnerHTML:{__html:n.descHtml}})),(null==n||null===(t=n.lineItemsHtml)||void 0===t?void 0:t.length)>0&&a.createElement("ul",{className:"mt-6 list-disc rounded-px-lg bg-linetv-grey-600 p-6 text-14 font-500 text-linetv-high-emphasis"},n.lineItemsHtml.map((e,t)=>a.createElement("li",{key:t,className:"mb-1 ml-6",dangerouslySetInnerHTML:{__html:e}})))))}},37053:(e,t,n)=>{n.d(t,{A:()=>f});var a=n(96540),l=n(20312),s=n.n(l),o=n(46942),i=n.n(o),r=n(2056),c=n.n(r),m=n(45428),d=n(74550),u=n(32721

1),p=n(34417);function v(){return v=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)({}).hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},v.apply(null,arguments)}const h=["折扣碼優惠僅限訂閱首期，次期起將恢復以該方案定價續費，直至取消訂閱為止。","折扣碼僅限 LINE TV 官網訂閱使用，LINE TV APP不適用。"],f=function(e){const{handleUseCouponCode:t,closeModal:n,isMobile:l,isOpen:o,isValidCouponLoading:r,couponErrorMessage:f,setCouponErrorMessage:g,...x}=e,[E,y]=(0,a.useState)(""),[b,N]=(0,a.useState)(!0),[A,_]=(0,a.useState)(!1);return(0,a.useEffect)(()=>{_(!c()(E))},[E]),(0,a.useEffect)(()=>{o&&(0,m.A)({placement_title:"enter_discount_code"})},[o]),a.createElement(s(),v({isOpen:o},x,{className:i()("absolute bottom-0 h-[80vh] w-full rounded-xl bg-linetv-grey-800 px-4 pb-7 pt-6 sm:relative sm:bottom-[initial] sm:h-[37.5rem] sm:w-[32rem] sm:px-[3.25rem] sm:pt-7",l?"mobileCouponModal":""),isMobile:l,closeTimeoutMS:200,style:{overlay:Object.assign({backgroundColor:"rgba(0,0,0,0.6)",display:"flex",alignItems:"center",justifyContent:"center",padding:"2rem"})}}),a.createElement("div",{className:"flex h-full flex-col"},a.createElement("button",{type:"button",className:"AuthModal-floatButton AuthModal-floatButton--icon material-icons icon_web_close right-[16px] text-linetv-grey-100",onClick:()=>{n()}}),a.createElement("h1",{className:"mb-5 text-center text-18 font-500 text-linetv-high-emphasis sm:mb-7"},"折扣碼"),a.createElement("div",{className:"mb-4 text-20 font-700 text-linetv-high-emphasis"},"快輸入您的專屬折扣碼吧！"),a.createElement("div",null,a.createElement("fieldset",null,a.createElement(p.f6,null,a.createElement(p.eI,{className:i()({"is-invalid":!b})},a.createElement("div",{className:"mb-3 text-16 font-500 text-linetv-high-emphasis"},"折扣代碼"),a.createElement(d.A,{className:i()("block w-full text-14",f&&"is-invalid"),type:"text",maxLength:"50",value:E,onChange:e=>(e=>{y(e.target.value.toUpperCase()),g(null)})(e),onBlur:()=>N(!c()(E)),required:!0,autoFocus:!l}),a.createElement("div",{className:i()("mt-2 h-[17px] text-12",f?"text-linetv-fields-error":"text-linetv-medium-emphasis")},f||""))))),a.createElement("div",{className:"flex h-full flex-col-reverse md:flex-col"},a.createElement("ul",{className:"mt-auto list-disc text-14 text-linetv-medium-emphasis"},h.map((e,t)=>a.createElement("li",{className:"mb-1 ml-4",key:t},e))),a.createElement("div",{className:"StyledModal--btn-wrapper StyledModal--btn-wrapper-row StyledModal--btn-wrapper-rwd-column mt-4 sm:mt-12"},a.createElement("button",{type:"button",className:i()("btn h-11 w-full",r?"cursor-default bg-linetv-grey-100-transparent-5 text-linetv-low-emphasis":"btn--primary"),onClick:()=>{r||t(E.trim())},disabled:!A||f},r&&a.createElement(u.A,{height:"32px"}),!r&&"使用折扣碼")))))}}}]);