https://itel-web.vercel.app/_next/static/chunks/pages/profile/rank-68821212d286102e.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6379],{32822:function(e,t,l){(window.__NEXT_P=window.__NEXT_P||[]).push(["/profile/rank",function(){return l(84210)}])},84210:function(e,t,l){"use strict";l.r(t),l.d(t,{default:function(){return B}});var n=l(85893),s=l(89255),a=l(9008),i=l.n(a),x=l(67294),r=l(86010),c=l(64857),d=l(11163);let m=()=>{let{push:e}=(0,d.useRouter)();return(0,n.jsxs)("div",{className:"flex flex-col max-lg:flex-row max-lg:gap-4 max-md:grid max-md:grid-cols-1",children:[(0,n.jsxs)("div",{className:"flex h-full w-[185px] flex-col items-center justify-center rounded-2xl bg-gradient-rank p-6 text-center text-neutral-0 w-full max-lg:h-auto",children:[(0,n.jsx)("img",{alt:"",src:"/images/iwow/silver.svg",className:"h-8 w-8 md:h-12 md:w-12"}),(0,n.jsx)("h5",{className:"mt-2 font-itel text-h4",children:"Hạng Bạc"}),(0,n.jsx)("div",{className:"flex justify-start items-center w-full h-1 mt-2",children:(0,n.jsx)("div",{className:(0,r.Z)("w-full h-1 bg-neutral-0/[0.5] overflow-hidden  rounded-full"),children:(0,n.jsx)("div",{className:(0,r.Z)("h-full bg-neutral-0 rounded-full"),style:{width:Math.floor(80).toString()+"%"}})})}),(0,n.jsxs)("p",{className:"mt-6 max-md:mt-1 text-xs",children:["Điểm cần để l\xean hạng V\xe0ng: ",(0,n.jsx)("b",{className:"max-md:hidden",children:"234"})]}),(0,n.jsx)("span",{className:"md:hidden text-xs",children:"234"})]}),(0,n.jsxs)("div",{className:"flex h-full w-[185px] flex-col items-center justify-center rounded-2xl bg-neutral-0 p-6 max-md:p-4 mt-4 max-lg:mt-0 text-center text-neutral-0 w-full",children:[(0,n.jsx)("p",{className:"text-neutral-800 font-bold text-h4",children:"48"}),(0,n.jsx)("p",{className:"text-neutral-500 font-sans",children:"điểm iTel Rewards"}),(0,n.jsx)("button",{type:"button",className:"btn-sm transition-default btn-primary btn rounded-full w-full mt-4",onClick:()=>e("https://itel-web.vercel.app/promotion/club"),children:"Đổi qu\xe0 iTel Club"}),(0,n.jsx)("p",{className:"mt-4 text-neutral-800 text-sm font-medium ",children:"48 điểm sẽ hết hạn v\xe0o 12/03/2023"}),(0,n.jsx)("p",{className:"text-neutral-500 mt-1 text-xs max-lg:hidden",children:"Để điểm thưởng kh\xf4ng bay mất, nhanh tay thực hiện 1 giao dịch t\xedch luỹ điểm thưởng để gia hạn thời gian sử dụng điểm nh\xe9!"}),(0,n.jsx)("div",{className:"box-border border-b border-b-divider-rank bottom-[0.5px] w-full h-px my-4"}),(0,n.jsxs)("div",{className:"flex justify-between w-full text-neutral-800 items-center cursor-pointer",onClick:()=>e("/profile/point-guide"),children:[(0,n.jsx)("p",{className:"text-neutral-800 font-medium text-sm",children:"Xem c\xe1ch t\xedch điểm"}),(0,n.jsx)(c.Z,{src:"/icons/bold/right-arrow.svg",width:16,height:16})]})]})]})};var o=l(9886),h=l(74576);let u=e=>{let{isActive:t=!1,url:l=""}=e;return l?(0,n.jsx)(c.Z,{src:l,width:32,height:32,className:(0,r.Z)("text-neutral-800",t?"text-red-500":"")}):null},g=e=>{let{text:t="",url:l="",isActive:s=!1}=e;return(0,n.jsxs)("div",{className:"flex items-center flex-col",children:[(0,n.jsx)(u,{isActive:s,url:l}),(0,n.jsx)("p",{className:"text-xs font-medium text-neutral-500",children:t})]})},b=e=>{let{tab:t,setTab:l,tabs:s,removeMargin:a=!1}=e,i=e=>{l(e)};return(0,n.jsxs)("div",{className:"relative ".concat(a?"mt-0":""," overflow-scroll whitespace-nowrap scrollbar-hide max-md:block hidden bg-neutral-0"),children:[(0,n.jsx)("div",{className:"overflow-scroll whitespace-nowrap scrollbar-hide flex",children:s.map(e=>{e.label;let l=()=>i(e.id),s=e.id===t;return(0,n.jsx)("button",{onClick:l,className:(0,r.Z)("cursor-pointer whitespace-nowrap border-b-2 border-transparent p-3 px-4 grow w-full text-neutral-500",s?"border-b-red-500 text-neutral-800 relative z-10":""),children:(0,n.jsx)("div",{className:(0,r.Z)("".concat(e.id===t?"text-neutral-800 font-bold":"")),children:(0,n.jsx)(g,{isActive:e.id===t,url:e.icon,text:e.label})})},e.id)})}),(0,n.jsx)("div",{className:"absolute box-border border-b border-b-neutral-300 bottom-[0.5px] w-full"})]})},p=[{id:h.qU,label:"Th\xe2n thiết",icon:"/images/iwow/standard-member.svg"},{id:h.vm,label:"Bạc",icon:"/images/iwow/silver.svg"},{id:h.RD,label:"V\xe0ng",icon:"/images/iwow/golden.svg"},{id:h.D,label:"Kim cương",icon:"/images/iwow/diamond.svg"}],f=[{title:"Ưu đ\xe3i hấp dẫn",content:(0,n.jsxs)("div",{className:"text-xs text-neutral-400 leading-4",children:[(0,n.jsx)("p",{children:"Hội vi\xean được sử dụng điểm để đổi c\xe1c ưu đ\xe3i hấp dẫn d\xe0nh ri\xeang cho Hội vi\xean Bạc."}),(0,n.jsx)("p",{children:"Nhận nhiều ưu đ\xe3i hấp dẫn kh\xe1c tr\xean Website v\xe0 ứng dụng My iTel."})]}),icon:"/icons/bold/tag-hot.svg"},{title:"Trải nghiệm trọn vẹn",content:(0,n.jsxs)("div",{className:"text-xs text-neutral-400 leading-4",children:[(0,n.jsx)("p",{children:"Sử dụng to\xe0n bộ c\xe1c t\xednh năng xem phim, chơi game tr\xean Website & ứng dụng My iTel."}),(0,n.jsx)("p",{children:"Tham dự c\xe1c chương tr\xecnh t\xedch điểm, nhận qu\xe0 tr\xean Website & ứng dụng My iTel."})]}),icon:"/icons/bold/star.svg"},{title:"Dịch vụ tận t\xe2m",content:"Nhận đầy đủ c\xe1c dịch vụ chăm s\xf3c kh\xe1ch h\xe0ng của Mạng di động iTel.",icon:"/icons/bold/membership.svg"}],j=e=>{let{title:t,icon:l,content:s,isFinal:a=!1}=e;return(0,n.jsxs)("div",{className:(0,r.Z)("flex text-neutral-200 py-6 max-md:py-4 border-b ".concat(a?"max-lg:border-hidden":"border-b")),children:[(0,n.jsx)("div",{className:" text-neutral-800 flex justify-center items-center",children:(0,n.jsx)("div",{className:"bg-neutral-200 w-12 h-12 text-center relative rounded-full",children:(0,n.jsx)(c.Z,{src:l,className:"inline absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2",width:23,height:23})})}),(0,n.jsxs)("div",{className:"ml-4",children:[(0,n.jsx)("div",{className:"text-neutral-800 font-medium",children:t}),(0,n.jsx)("div",{className:"mt-1 text-neutral-500 text-xs",children:s})]})]})},v=()=>{let[e,t]=(0,x.useState)(h.qU);return(0,n.jsxs)("div",{className:"flex h-full w-[185px] flex-col rounded-2xl bg-neutral-0 p-6 max-md:p-4 max-md:pb-2 pt-4 text-neutral-0 w-full",children:[(0,n.jsx)(o.D,{setTab:t,tab:e,tabs:p,removeMargin:!0}),(0,n.jsx)(b,{setTab:t,tab:e,tabs:p,removeMargin:!0}),(0,n.jsxs)("div",{className:"mt-6 max-lg:mt-4",children:[(0,n.jsx)("p",{className:"text-neutral-800 font-bold text-xl",children:"Quyền lợi hạng Bạc"}),(0,n.jsx)("p",{className:"text-neutral-500 text-xs mt-1",children:"24 điểm nữa l\xe0 Thăng hạng V\xe0ng!"}),(0,n.jsx)("div",{className:"flex flex-col",children:f.map((e,t)=>(0,n.jsx)(j,{title:e.title,content:e.content,icon:e.icon,isFinal:t===f.length-1},e.title))})]})]})},N=e=>(0,n.jsxs)("div",{className:"grid grid-cols-3 gap-6 max-lg:grid-cols-1 max-lg:gap-y-6 max-lg:gap-x-0 max-md:px-4",children:[(0,n.jsx)("div",{className:"...",children:(0,n.jsx)(m,{})}),(0,n.jsx)("div",{className:"col-span-2",children:(0,n.jsx)(v,{})})]});var w=l(24085),y=l(25675),k=l.n(y),T=l(96120);let Z=[{id:h.QY,label:"Điểm đ\xe3 nhận",icon:""},{id:h.yp,label:"Điểm đ\xe3 d\xf9ng",icon:""}],M=e=>{let t=Array.from(Array(10).keys());return t.map(t=>({title:"Bạn nhận được 26 điểm từ iMall",content:"Bạn đ\xe3 được t\xedch điểm khi mua sản phẩm",productName:"OPPO Reno8 T 5G",img:w.Z,date:e,point:"26"}))},_=e=>{let{isUsed:t=!1}=e,l=new Date,s=l.getHours(),a=l.getMinutes(),i=l.getDay(),x=l.getMonth(),c=l.getFullYear(),d="".concat(s,":").concat(a," ").concat(i,"/").concat(x,"/").concat(c);return(0,n.jsxs)("div",{className:"mb-8 max-md:mb-8",children:[M(d).map(e=>(0,n.jsxs)("div",{className:"flex h-full items-center rounded-2xl bg-neutral-0 p-6 max-md:p-4 px-8 max-lg:p-4 max-lg:px-6  max-lg:mt-4 text-neutral-0 w-full mt-3",children:[(0,n.jsx)("div",{className:"w-20 h-20",children:(0,n.jsx)(k(),{src:null==e?void 0:e.img,className:"",alt:"123"})}),(0,n.jsxs)("div",{className:"ml-6 flex flex-col grow",children:[(0,n.jsx)("p",{className:"text-neutral-800 font-bold max-md:text-sm max-md:mb-1",children:e.title}),(0,n.jsxs)("div",{className:"text-neutral-500 text-sm max-md:text-neutral-700",children:[e.content,"\xa0",(0,n.jsx)("span",{className:"text-neutral-700 font-bold max-md:font-normal max-md:text-sm",children:e.productName})]}),(0,n.jsxs)("div",{className:"mt-2 max-md:flex max-md:items-center",children:[(0,n.jsx)("span",{className:"text-neutral-500 text-xs max-md:grow",children:e.date})," ",(0,n.jsxs)("span",{className:(0,r.Z)("font-bold md:hidden max-md:text-sm",t?"text-red-500":"text-green-600"),children:[t?"

1-":"+",e.point," điểm"]})]})]}),(0,n.jsx)("div",{className:"max-md:hidden",children:(0,n.jsxs)("span",{className:(0,r.Z)("font-bold",t?"text-red-500":"text-green-600"),children:[t?"-":"+",e.point," điểm"]})})]},e.title)),(0,n.jsx)("div",{className:"w-full text-center mt-6 max-md:mt-4",children:(0,n.jsx)("button",{className:"btn-secondary btn py-3 px-10 max-md:px-4 max-md:pt-2.5 rounded-full",onClick:()=>{},children:"Xem th\xeam"})})]})},C=()=>{let[e,t]=(0,x.useState)(h.QY);return(0,n.jsxs)("div",{className:"max-md:px-4",children:[(0,n.jsx)(o.D,{setTab:t,tab:e,tabs:Z,removeMargin:!0}),(0,n.jsx)(T.c,{setTab:t,tab:e,tabs:Z,customClass:" !pl-0 "}),(0,n.jsx)(_,{isUsed:e===h.yp})]})},D=()=>(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(i(),{children:(0,n.jsx)("title",{children:"Itel - profile"})}),(0,n.jsx)("section",{className:"bg-neutral-100 mb-[1rem] max-lg:mb-6 max-md:hidden",children:(0,n.jsx)("h2",{className:"font-itel text-h3 font-bold max-lg:text-h4 ",children:"Hạng th\xe0nh vi\xean"})}),(0,n.jsx)(N,{}),(0,n.jsx)("section",{className:"bg-neutral-100 mb-[1rem] mt-16 max-lg:mt-6 max-md:px-4",children:(0,n.jsx)("h2",{className:"font-itel text-h3 max-lg:text-h4 font-bold max-md:text-xl block",children:"Lịch sử t\xedch điểm"})}),(0,n.jsx)(C,{})]});D.getLayout=function(e){return(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(s.Z,{titleMobile:"Hạng th\xe0nh vi\xean",footerClassName:"bg-neutral-0",children:e})})};var B=D}},function(e){e.O(0,[9774,5375,5675,5151,5162,7866,2888,179],function(){return e(e.s=32822)}),_N_E=e.O()}]);