https://www.click.ir/build/assets/OnboardingPage-ipFRNVri.js

1import{A as e,M as t,V as n,X as r,at as i,it as a,l as o,m as s,nt as ee,o as c,ot as l,r as u,s as d,u as f,w as te}from"./runtime-core.esm-bundler-CnsP0n0C.js";import{t as ne}from"./useSeo-BjxFByyI.js";import{C as p,n as re,t as ie,v as m,x as ae}from"./app-BunDKUxZ.js";var h={mainCategories:()=>m.get(`/onboarding/categories`),subCategories:e=>m.get(`/onboarding/categories/children`,{params:{slugs:e.join(`,`)}}),hotTags:()=>m.get(`/onboarding/tags`),agencies:()=>m.get(`/onboarding/agencies`),saveInterests:(e,t)=>m.post(`/onboarding/interests`,{category_ids:e,tag_ids:t}),followAgencies:e=>m.post(`/onboarding/follow`,{agency_ids:e}),complete:()=>m.post(`/onboarding/complete`)},oe={class:`fixed inset-0 bg-white dark:bg-slate-950 z-[200] flex flex-col overflow-hidden`},se={key:0,class:`pt-6 px-6 flex justify-center gap-1.5 shrink-0`},ce={class:`flex-1 overflow-y-auto px-5 sm:px-8`},le={key:`0`,class:`h-full flex flex-col items-center justify-center text-center gap-6 py-10`},ue=[`src`],de={class:`flex items-start gap-3 mb-6`},fe={class:`flex-1 bg-slate-50 dark:bg-slate-900 border border-slate-100 dark:border-slate-800 rounded-2xl rounded-tr-md px-4 py-3`},pe={class:`text-[13px] sm:text-sm text-slate-700 dark:text-slate-200 leading-6 font-medium`},me={key:0,class:`grid grid-cols-3 gap-3 animate-pulse`},he=[`onClick`],ge={class:`text-[11px] sm:text-xs font-bold text-slate-700 dark:text-slate-200`},_e={key:0,class:`absolute top-2 left-2 w-5 h-5 rounded-full bg-brand-500 text-white flex items-center justify-center`},ve={key:0,class:`grid grid-cols-3 gap-3 animate-pulse`},ye={key:1,class:`grid grid-cols-3 gap-3`},be=[`onClick`],xe={class:`text-[11px] sm:text-xs font-bold text-slate-700 dark:text-slate-200 text-center leading-tight px-1`},g={key:0,class:`absolute top-2 left-2 w-5 h-5 rounded-full bg-brand-500 text-white flex items-center justify-center`},_={key:0,class:`grid grid-cols-3 gap-3 animate-pulse`},v=[`onClick`],y={class:`text-[11px] sm:text-xs font-bold text-slate-700 dark:text-slate-200 text-center leading-tight px-1`},b={key:0,class:`absolute top-2 left-2 w-5 h-5 rounded-full bg-brand-500 text-white flex items-center justify-center`},x={key:0,class:`space-y-2.5 animate-pulse`},S={key:1,class:`space-y-2.5`},C={class:`w-11 h-11 rounded-full overflow-hidden shrink-0 bg-slate-200 dark:bg-slate-700 flex items-center justify-center`},w=[`src`],T={key:1,class:`text-white font-bold`},E={class:`flex-1 min-w-0`},D={class:`flex items-center gap-1.5`},O={class:`text-sm font-bold text-slate-800 dark:text-white truncate`},k={key:0,class:`fa-solid fa-circle-check text-blue-500 text-xs`},A=[`onClick`],j={key:0,class:`mt-4 flex items-center gap-2 text-amber-600 dark:text-amber-400 text-xs font-medium`},M={key:`5`,class:`h-full flex flex-col items-center justify-center text-center gap-6 py-10`},Se={class:`text-xs text-slate-400`},Ce={class:`shrink-0 px-5 sm:px-8 pb-[env(safe-area-inset-bottom)] pt-4 border-t border-slate-100 dark:border-slate-800 bg-white dark:bg-slate-950`},we={class:`pb-5 flex items-center gap-3`},Te={key:0,class:`flex-1 flex flex-row gap-2.5`},N=re({__name:`OnboardingPage`,setup(re){let m=ae(),N=r(0),P=r(!1),F=r([]),I=r([]),L=r([]),R=r([]),z=r(new Set),B=r(new Set),V=r(new Set),H=r(new Set),U=r(0),W=r(!1),G=r(!1);function K(e,t){e.has(t)?e.delete(t):e.add(t),U.value=0,G.value=!1}let q={blue:`from-blue-500 to-blue-600`,emerald:`from-emerald-500 to-emerald-600`,orange:`from-orange-500 to-orange-600`,sky:`from-sky-500 to-sky-600`,pink:`from-pink-500 to-pink-600`,slate:`from-slate-500 to-slate-600`};function J(e){return q[e]||q.slate}let Ee=c(()=>F.value.filter(e=>z.value.has(e.id)).map(e=>e.name)),De=c(()=>{if(N.value===1)return`برای شروع بگو دنبال چه‌جور خبرهایی هستی؟ هر چند تا دوست داری انتخاب کن، هر چی دقیق‌تر بگی فیدت هوشمندتر می‌شه.`;if(N.value===2){let e=Ee.value;return e.length?e.length===1?`توی «${e[0]}» دقیقاً دنبال چه بخشی هستی؟`:`توی ${e.slice(0,-1).join(`، `)} و ${e.at(-1)} کدوم بخش‌ها بیشتر مدنظرته؟`:`بیا دقیق‌تر بریم سراغ زیرشاخه‌ها.`}return N.value===3?`حالا بریم سراغ موضوعات داغ. کدوم هشتگ‌ها همین الان بیشتر تو ذهنته؟`:N.value===4?`عالیه! یه Ù

1‚دم آخر مونده — چند تا خبرگزاری معتبر رو فالو کن تا اخبارشون همیشه دم دستت باشه.`:``});async function Oe(){P.value=!0;let{data:e}=await h.mainCategories();F.value=e.data,P.value=!1}async function ke(){let e=F.value.filter(e=>z.value.has(e.id)).map(e=>e.slug);if(!e.length){N.value=3,await Y();return}P.value=!0;let{data:t}=await h.subCategories(e);I.value=t.data,P.value=!1,I.value.length||(N.value=3,await Y())}async function Y(){P.value=!0;let{data:e}=await h.hotTags();L.value=e.data,P.value=!1}async function Ae(){P.value=!0;let{data:e}=await h.agencies();R.value=e.data,P.value=!1}function X(){return N.value===1?z.value.size===0:N.value===3&&V.value.size===0}function je(){W.value=!0,U.value++,U.value>=2&&(G.value=!0),setTimeout(()=>W.value=!1,420)}async function Me(){if(X()){je();return}await Z()}async function Z(){if(U.value=0,G.value=!1,N.value===1){N.value=2,await ke();return}if(N.value===2){N.value=3,await Y();return}if(N.value===3){let e=[...z.value,...B.value];await h.saveInterests(e,[...V.value]),N.value=4,await Ae();return}

1N.value===4&&(H.value.size&&await h.followAgencies([...H.value]),await h.complete(),N.value=5,Le())}function Ne(){Z()}function Pe(){U.value=0,G.value=!1,N.value===2?N.value=1:N.value===3?N.value=I.value.length?2:1:N.value===4&&(N.value=3)}async function Fe(){N.value=1,await Oe()}async function Ie(){await h.complete(),m.replace(`/`)}let Q=r(5),$=null;function Le(){$=setInterval(()=>{Q.value--,Q.value<=0&&(clearInterval($),m.replace(`/`))},1e3)}function Re(){clearInterval($),m.replace(`/`)}return ne({title:`شروع کار با کلیک`,description:`حساب کاربری خود را تنظیم کنید و علاقه‌مندی‌های خود را برای دریافت اخبار مرتبط انتخاب کنید`,path:`/onboarding`,noindex:!0}),te(()=>clearInterval($)),(r,c)=>(e(),f(`div`,oe,[N.value>=1&&N.value<=4?(e(),f(`div`,se,[(e(),f(u,null,t([1,2,3,4],e=>d(`span`,{key:e,class:a([`h-1.5 rounded-full transition-all duration-300 ease-out`,e===N.value?`w-8 bg-brand-500`:e<N.value?`w-4 bg-brand-300`:`w-4 bg-slate-200 dark:bg-slate-700`])},null,2)),64))])):o(``,!0),d(`div`,ce,[s(p,{name:`step-fade`,mode:`out-in`},{default:n(()=>[N.value===0?(e(),f(`div`,le,[d(`img`,{src:ee(ie),alt:`کلیک`,class:`w-28 h-28 sm:w-32 sm:h-32 md:w-36 md:h-36 object-contain animate-float`},null,8,ue),c[0]||=d(`div`,null,[d(`h1`,{class:`text-xl sm:text-2xl font-black text-slate-900 dark:text-white`},` به کلیک خوش اومدی! 🎉 `),d(`p`,{class:`text-xs sm:text-sm text-slate-500 dark:text-slate-400 mt-3 leading-7 max-w-xs mx-auto`},` عضویتت با موفقیت انجام شد. بیا چند تا سوال کوتاه بپرسم تا فید خبریت رو دقیقاً مطابق سلیقه‌ات بچینیم. `)],-1)])):N.value>=1&&N.value<=4?(e(),f(`div`,{key:N.value,class:`py-6`},[d(`div`,de,[c[1]||=d(`span`,{class:`w-10 h-10 sm:w-11 sm:h-11 rounded-2xl bg-gradient-to-tr from-brand-500 to-blue-600 flex items-center justify-center text-white shrink-0 shadow-md shadow-brand-500/20 animate-pulse-soft`},[d(`i`,{class:`fa-solid fa-wand-magic-sparkles text-sm sm:text-base`})],-1),d(`div`,fe,[d(`p`,pe,l(De.value),1)])]),N.value===1?(e(),f(u,{key:0},[P.value?(e(),f(`div`,me,[(e(),f(u,null,t(9,e=>d(`div`,{key:e,class:`aspect-square rounded-2xl bg-slate-100 dark:bg-slate-800`})),64))])):(e(),f(`div`,{key:1,class:a([`grid grid-cols-3 gap-3`,W.value&&`animate-shake`])},[(e(!0),f(u,null,t(F.value,(t,r)=>(e(),f(`button`,{key:t.id,onClick:e=>K(z.value,t.id),type:`button`,class:a([`stagger-item relative aspect-square rounded-2xl flex flex-col items-center justify-center gap-2 transition-all duration-200 border-2 active:scale-95`,z.value.has(t.id)?`border-brand-500 bg-brand-50 dark:bg-brand-500/10 scale-[1.03]`:`border-slate-100 dark:border-slate-800 bg-slate-50 dark:bg-slate-900 hover:border-slate-200 dark:hover:border-slate-700`]),style:i({"--d":`${r*30}ms`})},[d(`span`,{class:a([`w-11 h-11 sm:w-12 sm:h-12 rounded-xl bg-gradient-to-tr flex items-center justify-center text-white shadow-sm`,J(t.color)])},[d(`i`,{class:a([`fa-solid text-lg sm:text-xl`,t.icon])},null,2)],2),d(`span`,ge,l(t.name),1),s(p,{name:`pop`},{default:n(()=>[z.value.has(t.id)?(e(),f(`span`,_e,[...c[2]||=[d(`i`,{class:`fa-solid fa-check text-[9px]`},null,-1)]])):o(``,!0)]),_:2},1024)],14,he))),128))],2))],64)):N.value===2?(e(),f(u,{key:1},[P.value?(e(),f(`div`,ve,[(e(),f(u,null,t(6,e=>d(`div`,{key:e,class:`aspect-square rounded-2xl bg-slate-100 dark:bg-slate-800`})),64))])):(e(),f(`div`,ye,[(e(!0),f(u,null,t(I.value,(t,r)=>(e(),f(`button`,{key:t.id,onClick:e=>K(B.value,t.id),type:`button`,class:a([`stagger-item relative aspect-square rounded-2xl flex flex-col items-center justify-center gap-2 transition-all duration-200 border-2 active:scale-95`,B.value.has(t.id)?`border-brand-500 bg-brand-50 dark:bg-brand-500/10 scale-[1.03]`:`border-slate-100 dark:border-slate-800 bg-slate-50 dark:bg-slate-900`]),style:i({"--d":`${r*30}ms`})},[d(`span`,{class:a([`w-11 h-11 sm:w-12 sm:h-12 rounded-xl bg-gradient-to-tr flex items-center justify-center text-white shadow-sm`,J(t.color)])},[d(`i`,{class:a([`fa-solid text-lg sm:text-xl`,t.icon])},null,2)],2),d(`span`,xe,l(t.name),1),s(p,{name:`pop`},{default:n(()=>[B.value.has(t.id)?(e(),f(`span`,g,[...c[3]||=[d(`i`,{class:`fa-solid fa-check text-[9px]`},null,-1)]])):o(``,!0)]),_:2},1024)],14,be))),128))]))],64)):N.value===3?(e(),f(u,{key:2},[P.value?(e(),f(`div`,_,[(e(),f(u,null,t(9,e=>d(`div`,{key:e,class:`aspect-square rounded-2xl bg-slate-100 dar

1k:bg-slate-800`})),64))])):(e(),f(`div`,{key:1,class:a([`grid grid-cols-3 gap-3`,W.value&&`animate-shake`])},[(e(!0),f(u,null,t(L.value,(t,r)=>(e(),f(`button`,{key:t.id,onClick:e=>K(V.value,t.id),type:`button`,class:a([`stagger-item relative aspect-square rounded-2xl flex flex-col items-center justify-center gap-1.5 transition-all duration-200 border-2 active:scale-95`,V.value.has(t.id)?`border-brand-500 bg-brand-50 dark:bg-brand-500/10 scale-[1.03]`:`border-slate-100 dark:border-slate-800 bg-slate-50 dark:bg-slate-900`]),style:i({"--d":`${r*25}ms`})},[c[5]||=d(`i`,{class:`fa-solid fa-hashtag text-brand-500 text-base sm:text-lg`},null,-1),d(`span`,y,l(t.name),1),s(p,{name:`pop`},{default:n(()=>[V.value.has(t.id)?(e(),f(`span`,b,[...c[4]||=[d(`i`,{class:`fa-solid fa-check text-[9px]`},null,-1)]])):o(``,!0)]),_:2},1024)],14,v))),128))],2))],64)):N.value===4?(e(),f(u,{key:3},[P.value?(e(),f(`div`,x,[(e(),f(u,null,t(6,e=>d(`div`,{key:e,class:`h-16 rounded-2xl bg-slate-100 dark:bg-slate-800`})),64))])):(e(),f(`div`,S,[(e(!0),f(u,null,t(R.value,(t,n)=>(e(),f(`div`,{key:t.id,class:`stagger-item flex items-center gap-3 p-3 rounded-2xl border border-slate-100 dark:border-slate-800 bg-slate-50 dark:bg-slate-900`,style:i({"--d":`${n*40}ms`})},[d(`span`,C,[t.avatar?(e(),f(`img`,{key:0,src:t.avatar,class:`w-full h-full object-cover`},null,8,w)):(e(),f(`span`,T,l(t.name?.slice(0,1)),1))]),d(`span`,E,[d(`span`,D,[d(`span`,O,l(t.name),1),t.isVerified?(e(),f(`i`,k)):o(``,!0)])]),d(`button`,{onClick:e=>K(H.value,t.id),type:`button`,class:a([`shrink-0 text-xs font-bold px-4 py-2 rounded-full transition-all active:scale-95`,H.value.has(t.id)?`bg-slate-200 dark:bg-slate-700 text-slate-600 dark:text-slate-300`:`bg-brand-500 text-white`])},l(H.value.has(t.id)?`فالو شد ✓`:`فالو کردن`),11,A)],4))),128))]))],64)):o(``,!0),s(p,{name:`warn-fade`},{default:n(()=>[W.value?(e(),f(`div`,j,[...c[6]||=[d(`i`,{class:`fa-solid fa-circle-info`},null,-1),d(`span`,null,`هنوز چیزی انتخاب نکردی — حداقل یکی رو بزن تا فیدت رو بهتر بچینم`,-1)]])):o(``,!0)]),_:1}),s(p,{name:`warn-fade`},{default:n(()=>[G.value?(e(),f(`button`,{key:0,onClick:Ne,type:`button`,class:`mt-2 text-[11px] text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 transition-colors underline underline-offset-2`},` باشه، فعلاً این مرحله رو رد کن `)):o(``,!0)]),_:1})])):N.value===5?(e(),f(`div`,M,[c[7]||=d(`div`,{class:`w-24 h-24 rounded-full bg-emerald-50 dark:bg-emerald-500/10 flex items-center justify-center animate-scale-in`},[d(`i`,{class:`fa-solid fa-check text-emerald-500 text-4xl`})],-1),c[8]||=d(`div`,null,[d(`h1`,{class:`text-xl font-black text-slate-900 dark:text-white`},`عالی بود! 🎉`),d(`p`,{class:`text-sm text-slate-500 dark:text-slate-400 mt-3 leading-7 max-w-xs mx-auto`},` فید خبریت دقیقاً بر اساس چیزهایی که انتخاب کردی چیده شد. آماده‌ست که ببینیش! `)],-1),d(`p`,Se,`تا `+l(Q.value)+` ثانیه دیگه می‌ریم صفحه اصلی...`,1)])):o(``,!0)]),_:1})]),d(`div`,Ce,[d(`div`,we,[N.value===0?(e(),f(`div`,Te,[d(`button`,{onClick:Ie,class:`flex-1 text-center text-xs text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 transition-colors`},` رد کردن `),d(`button`,{onClick:Fe,class:`flex-1 bg-brand-500 hover:bg-brand-600 text-white font-bold text-sm py-3.5 rounded-2xl transition-all active:scale-[0.98] shadow-lg shadow-brand-500/20`},` بزن بریم `)])):N.value>=1&&N.value<=4?(e(),f(u,{key:1},[N.value>1?(e(),f(`button`,{key:0,onClick:Pe,type:`button`,class:`w-12 h-12 shrink-0 rounded-2xl bg-slate-100 dark:bg-slate-800 flex items-center justify-center text-slate-600 dark:text-slate-300 transition-all active:scale-95`},[...c[9]||=[d(`i`,{class:`fa-solid fa-arrow-right`},null,-1)]])):o(``,!0),d(`button`,{onClick:Me,class:`flex-1 bg-brand-500 hover:bg-brand-600 text-white font-bold text-sm py-3.5 rounded-2xl transition-all active:scale-[0.98] shadow-lg shadow-brand-500/20`},l(N.value===4?`تمام کن`:`ادامه`),1)],64)):N.value===5?(e(),f(`button`,{key:2,onClick:Re,class:`w-full bg-brand-500 hover:bg-brand-600 text-white font-bold text-sm py-3.5 rounded-2xl transition-all active:scale-[0.98]`},` برو به صفحه اصلی `)):o(``,!0)])])]))}},[[`__scopeId`,`data-v-004f3f48`]]);export{N as default};