https://www.redai.vn/_next/static/chunks/997-14ede4695b2fdf75.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[997],{70997:function(e,t,a){a.d(t,{Z:function(){return m}});var l=a(85893),n=a(67294),i=a(11163),r=a(29882),s=a(40971);let o="<section><h1>Landing Page</h1><p>Noi dung HTML.</p></section>",d=[{key:"name",label:"Ho va ten",type:"text",required:!0,width:"half",placeholder:"Ho va ten"},{key:"email",label:"Email",type:"email",required:!1,width:"half",placeholder:"Email"},{key:"phone",label:"So dien thoai",type:"tel",required:!0,width:"half",placeholder:"So dien thoai"},{key:"company_name",label:"Ten doanh nghiep",type:"text",required:!1,width:"half",placeholder:"Ten doanh nghiep"},{key:"message",label:"Nhu cau",type:"textarea",required:!1,width:"full",placeholder:"Nhu cau hien tai cua ban"}],c={name:"",slug:"",html_content:"",status:"draft",is_active:!0,meta_title:"",meta_description:"",canonical_url:"",og_image:"",audit_form_enabled:!0,audit_form_title:"Dang ky tu van",audit_form_description:"De lai thong tin de doi ngu lien he.",audit_form_button_text:"Nhan tu van",audit_form_success_message:"Cam on ban.",audit_form_config:{fields:d,telegram:{bot_token:"",chat_id:""},button_params:{}}},u=e=>{let{title:t,description:a,children:n}=e;return(0,l.jsxs)("section",{className:"rounded-2xl border border-gray-200 bg-white p-4 md:p-5",children:[(0,l.jsx)("h3",{className:"text-sm font-bold text-gray-900",children:t}),a?(0,l.jsx)("p",{className:"mt-1 text-xs text-gray-500",children:a}):null,(0,l.jsx)("div",{className:"mt-4",children:n})]})};function m(e){let{initialData:t,isEdit:a}=e,m=(0,i.useRouter)(),{showToast:p}=(0,s.p)(),h="/api",[g,x]=(0,n.useState)({...c,...t||{}}),[f,_]=(0,n.useState)(o),[b,y]=(0,n.useState)("desktop"),[v,j]=(0,n.useState)(!1),[N,w]=(0,n.useState)(!1),[k,C]=(0,n.useState)("{}"),T=(0,n.useMemo)(()=>`/${g.slug||"slug-cua-ban"}/`,[g.slug]);(0,n.useEffect)(()=>{let e={...c,...t||{},audit_form_config:{fields:t?.audit_form_config?.fields?.length?t.audit_form_config.fields:d,telegram:t?.audit_form_config?.telegram||{bot_token:"",chat_id:""},button_params:t?.audit_form_config?.button_params||{}}};x(e),C(JSON.stringify(e.audit_form_config?.button_params||{},null,2))},[t]),(0,n.useEffect)(()=>{(async()=>{let e=t?.html_content||"";if(!e)return _(o);if(!/^https?:\/\//i.test(e))return _(e);try{let t=await fetch(e),a=t.ok?await t.text():"";_(a||o)}catch{_(o)}})()},[t?.html_content]);let S=async(e,t)=>{let a=localStorage.getItem("admin_token"),l=new Blob([t],{type:"text/html"}),n=await fetch(`${h}/upload/presigned`,{method:"POST",headers:{"Content-Type":"application/json",Authorization:`Bearer ${a}`},body:JSON.stringify({filename:`${e||"landing-page"}.html`,mime_type:"text/html",file_size:l.size,file_type:"document",folder:"landing-pages"})}),i=await n.json();if(!i.success)throw Error(i.message||"Khong lay duoc URL upload");let{presigned_url:r,cdn_url:s}=i.data;return await fetch(r,{method:"PUT",headers:{"Content-Type":"text/html"},body:l}),s},L=(e,t)=>{let a=[...g.audit_form_config?.fields||[]];a[e]={...a[e],...t},x({...g,audit_form_config:{...g.audit_form_config,fields:a}})},$=e=>{let t=[...g.audit_form_config?.fields||[]];t.splice(e,1),x({...g,audit_form_config:{...g.audit_form_config,fields:t}})},D=async()=>{try{if(!g.name?.trim()||!g.slug?.trim()||!f.trim()){p("error","Ten, slug, HTML la bat buoc.");return}let e={};try{e=JSON.parse(k||"{}")}catch{p("error","Button params phai la JSON hop le.");return}w(!0);let t=await S(g.slug,f),l=localStorage.getItem("admin_token"),n=a?`${h}/landing-pages/${g.id}`:`${h}/landing-pages`,i={...g,html_content:t,audit_form_config:{...g.audit_form_config||{},fields:g.audit_form_config?.fields||d,button_params:e}};delete i.css_content,delete i.js_content;let r=await fetch(n,{method:a?"PUT":"POST",headers:{"Content-Type":"application/json",Authorization:`Bearer ${l}`},body:JSON.stringify(i)}),s=await r.json();if(!s.success)throw Error(s.message||"Luu that bai");p("success","Da luu landing page."),m.push("/admin/landing-pages")}catch(e){p("error",e?.message||"Loi luu landing page.")}finally{w(!1)}};return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)("div",{className:"space-y-4",children:(0,l.jsxs)("div",{className:"space-y-4",children:[(0,l.jsx)(u,{title:"Thong tin co ban",description:"Ten, duong dan slug va trang thai hien thi.",children:(0,l.jsxs)("div",{className:"grid grid-cols-1 gap-3 md:grid-cols-2",children:[(0,l.jsx)("input",{className:"rounded-xl border px-3 py-2",placeholder:"Ten landing page",value:g.name||"",onChange:e=>x({...g,name:e.target.value})}),(0,l.jsx)("input",{className:"rounded-xl border px-3 py-2",placeholder:"slug",value:g.slug||"",onChange:e=>x({...g,slug:e.target.value.toLowerCase().replace(/\s+/g,"-")})}),(0,l.jsxs)("div",{className:"rounded-xl border border-dashed px-3 py-2 text-sm text-gray-600 md:col-span-2",children:["Public URL: ",(0,l.jsx)("span",{className:"font-semibold text-gray-900",children:T})]}),(0,l.jsxs)("div",{className:"flex items-center gap-2",children:[(0,l.jsx)("label",{className:"text-sm text-gray-600",children:"Status"}),(0,l.jsxs)("select",{className:"rounded-xl border px-3 py-2 text-sm",value:g.status,onChange:e=>x({...g,status:e.target.value}),children:[(0,l.jsx)("option",{value:"draft",children:"draft"}),(0,l.jsx)("option",{value:"published",children:"published"}),(0,l.jsx)("option",{value:"archived",children:"archived"})]})]}),(0,l.jsxs)("label",{className:"inline-flex items-center gap-2 text-sm",children:[(0,l.jsx)("input",{type:"checkbox",checked:!!g.is_active,onChange:e=>x({...g,is_active:e.target.checked})})," Active"]})]})}),(0,l.jsx)(u,{title:"SEO",description:"Meta title, description, canonical, OG image.",children:(0,l.jsxs)("div",{className:"grid grid-cols-1 gap-3 md:grid-cols-2",children:[(0,l.jsx)("input",{className:"rounded-xl border px-3 py-2",placeholder:"Meta title",value:g.meta_title||"",onChange:e=>x({...g,meta_title:e.target.value})}),(0,l.jsx)("input",{className:"rounded-xl border px-3 py-2",placeholder:"Canonical URL",value:g.canonical_url||"",onChange:e=>x({...g,canonical_url:e.target.value})}),(0,l.jsx)("input",{className:"rounded-xl border px-3 py-2 md:col-span-2",placeholder:"OG image URL",value:g.og_image||"",onChange:e=>x({...g,og_image:e.target.value})}),(0,l.jsx)("textarea",{className:"rounded-xl border px-3 py-2 md:col-span-2",rows:2,placeholder:"Meta description",value:g.meta_description||"",onChange:e=>x({...g,meta_description:e.target.value})})]})}),(0,l.jsxs)(u,{title:"Audit Form",description:"Cau hinh form dong, telegram bot va button params.",children:[(0,l.jsxs)("div",{className:"mb-3 flex items-center justify-between",children:[(0,l.jsxs)("label",{className:"inline-flex items-center gap-2 text-sm font-medium",children:[(0,l.jsx)("input",{type:"checkbox",checked:!!g.audit_form_enabled,onChange:e=>x({...g,audit_form_enabled:e.target.checked})})," Bat form audit"]}),(0,l.jsx)("button",{type:"button",onClick:()=>{let e=[...g.audit_form_config?.fields||[],{key:`field_${Date.now()}`,label:"Truong moi",type:"text",required:!1,width:"half",placeholder:""}];x({...g,audit_form_config:{...g.audit_form_config,fields:e}})},className:"rounded-xl border px-3 py-1.5 text-sm",children:"Them field"})]}),g.audit_form_enabled?(0,l.jsxs)(l.Fragment,{children:[(0,l.jsxs)("div",{className:"grid grid-cols-1 gap-3 md:grid-cols-2",children:[(0,l.jsx)("input",{className:"rounded-xl border px-3 py-2",placeholder:"Tieu de form",value:g.audit_form_title||"",onChange:e=>x({...g,audit_form_title:e.target.value})}),(0,l.jsx)("input",{className:"rounded-xl border px-3 py-2",placeholder:"Text button",value:g.audit_form_button_text||"",onChange:e=>x({...g,audit_form_button_text:e.target.value})}),(0,l.jsx)("textarea",{className:"rounded-xl border px-3 py-2 md:col-span-2",rows:2,placeholder:"Mo ta form",value:g.audit_form_description||"",onChange:e=>x({...g,audit_form_description:e.target.value})}),(0,l.jsx)("input",{className:"rounded-xl border px-3 py-2 md:col-span-2",placeholder:"Thong bao thanh cong",value:g.audit_form_success_message||"",onChange:e=>x({...g,audit_form_success_message:e.target.value})})]}),(0,l.jsx)("div",{className:"mt-4 space-y-3",children:(g.audit_form_config?.fields||[]).map((e,t)=>(0,l.jsxs)("div",{className:"grid grid-cols-1 gap-2 rounded-xl border p-3 md:grid-cols-6",children:[(0,l.jsx)("input",{className:"rounded border px-2 py-1.5 text-sm",value:e.key,onChange:e=>L(t,{key:e.target.value}),placeholder:"key"}),(0,l.jsx)("input",{className:"rounded border px-2 py-1.5 text-sm",value:e.label,onChange:e=>L(t,{label:e.target.value}),placeholder:"label"}),(0,l.jsxs)("select",{className:"rounded border px-2 py-1.5 text-sm",value:e.type,onCh

1ange:e=>L(t,{type:e.target.value}),children:[(0,l.jsx)("option",{value:"text",children:"text"}),(0,l.jsx)("option",{value:"email",children:"email"}),(0,l.jsx)("option",{value:"tel",children:"tel"}),(0,l.jsx)("option",{value:"textarea",children:"textarea"})]}),(0,l.jsxs)("select",{className:"rounded border px-2 py-1.5 text-sm",value:e.width||"half",onChange:e=>L(t,{width:e.target.value}),children:[(0,l.jsx)("option",{value:"half",children:"half"}),(0,l.jsx)("option",{value:"full",children:"full"})]}),(0,l.jsxs)("label",{className:"inline-flex items-center gap-2 text-sm",children:[(0,l.jsx)("input",{type:"checkbox",checked:!!e.required,onChange:e=>L(t,{required:e.target.checked})}),"required"]}),(0,l.jsx)("button",{type:"button",onClick:()=>$(t),className:"rounded border px-2 py-1 text-sm text-red-600",children:"Xoa"}),(0,l.jsx)("input",{className:"rounded border px-2 py-1.5 text-sm md:col-span-6",value:e.placeholder||"",onChange:e=>L(t,{placeholder:e.target.value}),placeholder:"placeholder"})]},`${e.key}-${t}`))}),(0,l.jsxs)("div",{className:"mt-4 grid grid-cols-1 gap-3 md:grid-cols-2",children:[(0,l.jsx)("input",{className:"rounded-xl border px-3 py-2",placeholder:"Telegram Bot Token",value:g.audit_form_config?.telegram?.bot_token||"",onChange:e=>x({...g,audit_form_config:{...g.audit_form_config,telegram:{...g.audit_form_config?.telegram||{},bot_token:e.target.value}}})}),(0,l.jsx)("input",{className:"rounded-xl border px-3 py-2",placeholder:"Telegram Chat ID",value:g.audit_form_config?.telegram?.chat_id||"",onChange:e=>x({...g,audit_form_config:{...g.audit_form_config,telegram:{...g.audit_form_config?.telegram||{},chat_id:e.target.value}}})}),(0,l.jsx)("textarea",{className:"rounded-xl border px-3 py-2 font-mono md:col-span-2",rows:4,placeholder:'Button params JSON, vd: {"campaign":"summer_2026"}',value:k,onChange:e=>C(e.target.value)})]})]}):(0,l.jsx)("div",{className:"rounded-xl bg-gray-50 p-3 text-sm text-gray-600",children:"Form audit dang tat. Khach chi xem noi dung landing."})]}),(0,l.jsx)(u,{title:"HTML Source",description:"Noi dung nay se upload len CDN khi luu.",children:(0,l.jsx)("textarea",{className:"w-full rounded-xl border px-3 py-2 font-mono text-sm",rows:16,placeholder:"HTML source",value:f,onChange:e=>_(e.target.value)})}),(0,l.jsxs)("div",{className:"sticky bottom-4 z-10 flex justify-end gap-2 rounded-2xl border bg-white p-3 shadow-sm",children:[(0,l.jsxs)("button",{onClick:()=>j(!0),className:"inline-flex items-center rounded-xl border px-4 py-2 text-sm",children:[(0,l.jsx)(r.Z,{name:"eye",className:"mr-2 h-4 w-4"}),"Preview"]}),(0,l.jsx)("button",{onClick:()=>m.push("/admin/landing-pages"),className:"rounded-xl border px-4 py-2 text-sm",children:"Huy"}),(0,l.jsxs)("button",{onClick:D,disabled:N,className:"inline-flex items-center rounded-xl bg-red-500 px-4 py-2 text-sm font-semibold text-white disabled:opacity-60",children:[N?(0,l.jsx)(r.Z,{name:"loader-2",className:"mr-2 h-4 w-4 animate-spin"}):null,N?"Dang luu...":a?"Cap nhat va dong goi CDN":"Tao moi va dong goi CDN"]})]})]})}),v?(0,l.jsx)("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4",children:(0,l.jsxs)("div",{className:"max-h-[92vh] w-full max-w-6xl overflow-hidden rounded-2xl bg-white shadow-xl",children:[(0,l.jsxs)("div",{className:"flex items-center justify-between border-b px-4 py-3",children:[(0,l.jsx)("p",{className:"text-sm font-semibold text-gray-700",children:"Preview Landing"}),(0,l.jsxs)("div",{className:"flex items-center gap-2",children:[(0,l.jsx)("button",{type:"button",onClick:()=>y("desktop"),className:`rounded px-3 py-1 text-xs ${"desktop"===b?"bg-gray-900 text-white":"border bg-white"}`,children:"Desktop"}),(0,l.jsx)("button",{type:"button",onClick:()=>y("mobile"),className:`rounded px-3 py-1 text-xs ${"mobile"===b?"bg-gray-900 text-white":"border bg-white"}`,children:"Mobile"}),(0,l.jsx)("button",{type:"button",onClick:()=>j(!1),className:"rounded border px-3 py-1 text-xs",children:"Dong"})]})]}),(0,l.jsx)("div",{className:"overflow-auto p-4",children:(0,l.jsx)("iframe",{title:"Landing Preview",srcDoc:f||'<html><body style="font-family:Arial;padding:16px">No preview content</body></html>',className:`rounded-xl border bg-white ${"desktop"===b?"h-[76vh] w-full":"mx-auto h-[76vh] w-[390px]"}`,sandbox:"allow-forms allow-scripts allow-same-origin"})})]})}):null]})}}}]);