2 lines
7.7 KiB
JavaScript
2 lines
7.7 KiB
JavaScript
import{r as b,b as F,j as e,bP as S}from"./vendor-BKmmeuxg.js";import{I as w}from"./input-error-LaPr_4wd.js";import{B as k}from"./button-BpNwv2aE.js";import{C as i,a as c,c as d,d as n,b as m}from"./card-D9_SJYq6.js";import{I as l}from"./input-DM0goJrn.js";import{L as o}from"./label-HmIcv5Yx.js";import{S as C,a as f,b as v,c as y,d as x}from"./select-CD9o3HN1.js";import{T as L}from"./textarea-CyndvowL.js";import B from"./certificate-preview-vee_nlMq.js";import"./utils-DxSsnXxD.js";import"./index-WW_1X1qx.js";const J=({template:s})=>{const[j,N]=b.useState(s==null?void 0:s.logo_path),{data:t,setData:r,post:u,processing:g,errors:h}=F({type:(s==null?void 0:s.type)||"course",name:(s==null?void 0:s.name)||"My Certificate Template",logo:null,template_data:(s==null?void 0:s.template_data)||{primaryColor:"#3730a3",secondaryColor:"#4b5563",backgroundColor:"#dbeafe",borderColor:"#f59e0b",titleText:"Certificate of Completion",descriptionText:"This certificate is proudly presented to",completionText:"for successfully completing the course",footerText:"Authorized Certificate",fontFamily:"serif"}}),_=(a,p)=>{r(a,p),N(URL.createObjectURL(p))},T=a=>{a.preventDefault(),u(s?route("certificate.templates.update",s.id):route("certificate.templates.store"))};return e.jsxs("div",{className:"grid gap-6 lg:grid-cols-2",children:[e.jsxs("div",{className:"space-y-6",children:[e.jsxs(i,{children:[e.jsxs(c,{children:[e.jsx(d,{children:"Basic Information"}),e.jsx(n,{children:"Set the template name and activation status"})]}),e.jsxs(m,{className:"space-y-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"type",children:"Template Type"}),e.jsxs(C,{value:t.type,onValueChange:a=>r("type",a),children:[e.jsx(f,{children:e.jsx(v,{placeholder:"Select template type"})}),e.jsxs(y,{children:[e.jsx(x,{value:"course",children:"Course"}),e.jsx(x,{value:"exam",children:"Exam"})]})]}),h.type&&e.jsx("p",{className:"text-sm text-red-500",children:h.type})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"name",children:"Template Name"}),e.jsx(l,{id:"name",value:t.name,onChange:a=>r("name",a.target.value),placeholder:"e.g., Modern Blue Certificate"}),h.name&&e.jsx("p",{className:"text-sm text-red-500",children:h.name})]})]})]}),e.jsxs(i,{children:[e.jsxs(c,{children:[e.jsx(d,{children:"Logo & Branding"}),e.jsx(n,{children:"Upload your institution or course logo"})]}),e.jsx(m,{className:"space-y-4",children:e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"logo",children:"Logo Image"}),e.jsxs("div",{className:"space-y-2",children:[j&&e.jsx("div",{className:"h-20 w-20 overflow-hidden rounded border",children:e.jsx("img",{src:j,alt:"Logo preview",className:"h-full w-full object-contain"})}),e.jsx("div",{className:"flex-1",children:e.jsx(l,{id:"logo",type:"file",accept:"image/*",onChange:a=>{var p;return _("logo",(p=a.target.files)==null?void 0:p[0])}})})]}),e.jsx("p",{className:"text-muted-foreground text-xs",children:"Recommended: PNG or SVG, max 1MB"}),e.jsx(w,{message:h.logo})]})})]}),e.jsxs(i,{children:[e.jsxs(c,{children:[e.jsx(d,{children:"Colors"}),e.jsx(n,{children:"Customize the certificate color scheme"})]}),e.jsx(m,{className:"space-y-4",children:e.jsxs("div",{className:"grid grid-cols-2 gap-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"primaryColor",children:"Primary Color"}),e.jsxs("div",{className:"flex gap-2",children:[e.jsx(l,{id:"primaryColor",type:"color",value:t.template_data.primaryColor,onChange:a=>r("template_data",{...t.template_data,primaryColor:a.target.value}),className:"h-10 w-16"}),e.jsx(l,{value:t.template_data.primaryColor,onChange:a=>r("template_data",{...t.template_data,primaryColor:a.target.value}),placeholder:"#3730a3"})]})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"secondaryColor",children:"Secondary Color"}),e.jsxs("div",{className:"flex gap-2",children:[e.jsx(l,{id:"secondaryColor",type:"color",value:t.template_data.secondaryColor,onChange:a=>r("template_data",{...t.template_data,secondaryColor:a.target.value}),className:"h-10 w-16"}),e.jsx(l,{value:t.template_data.secondaryColor,onChange:a=>r("template_data",{...t.template_data,secondaryColor:a.target.value}),placeholder:"#4b5563"})]})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"backgroundColor",children:"Background Color"}),e.jsxs("div",{className:"flex gap-2",children:[e.jsx(l,{id:"backgroundColor",type:"color",value:t.template_data.backgroundColor,onChange:a=>r("template_data",{...t.template_data,backgroundColor:a.target.value}),className:"h-10 w-16"}),e.jsx(l,{value:t.template_data.backgroundColor,onChange:a=>r("template_data",{...t.template_data,backgroundColor:a.target.value}),placeholder:"#dbeafe"})]})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"borderColor",children:"Border Color"}),e.jsxs("div",{className:"flex gap-2",children:[e.jsx(l,{id:"borderColor",type:"color",value:t.template_data.borderColor,onChange:a=>r("template_data",{...t.template_data,borderColor:a.target.value}),className:"h-10 w-16"}),e.jsx(l,{value:t.template_data.borderColor,onChange:a=>r("template_data",{...t.template_data,borderColor:a.target.value}),placeholder:"#f59e0b"})]})]})]})})]}),e.jsxs(i,{children:[e.jsxs(c,{children:[e.jsx(d,{children:"Typography"}),e.jsx(n,{children:"Choose the font style for your certificate"})]}),e.jsx(m,{children:e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"fontFamily",children:"Font Family"}),e.jsxs(C,{value:t.template_data.fontFamily,onValueChange:a=>r("template_data",{...t.template_data,fontFamily:a}),children:[e.jsx(f,{children:e.jsx(v,{})}),e.jsxs(y,{children:[e.jsx(x,{value:"serif",children:"Serif (Classic)"}),e.jsx(x,{value:"sans-serif",children:"Sans Serif (Modern)"}),e.jsx(x,{value:"monospace",children:"Monospace (Technical)"}),e.jsx(x,{value:"cursive",children:"Cursive (Elegant)"})]})]})]})})]}),e.jsxs(i,{children:[e.jsxs(c,{children:[e.jsx(d,{children:"Certificate Text"}),e.jsx(n,{children:"Customize the text content of your certificate"})]}),e.jsxs(m,{className:"space-y-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"titleText",children:"Title Text"}),e.jsx(l,{id:"titleText",value:t.template_data.titleText,onChange:a=>r("template_data",{...t.template_data,titleText:a.target.value}),placeholder:"Certificate of Completion"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"descriptionText",children:"Description Text"}),e.jsx(L,{id:"descriptionText",value:t.template_data.descriptionText,onChange:a=>r("template_data",{...t.template_data,descriptionText:a.target.value}),placeholder:"This certificate is proudly presented to",rows:3})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"completionText",children:"Completion Text"}),e.jsx(l,{id:"completionText",value:t.template_data.completionText,onChange:a=>r("template_data",{...t.template_data,completionText:a.target.value}),placeholder:"for successfully completing the course"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(o,{htmlFor:"footerText",children:"Footer Text"}),e.jsx(l,{id:"footerText",value:t.template_data.footerText,onChange:a=>r("template_data",{...t.template_data,footerText:a.target.value}),placeholder:"Authorized Certificate"})]})]})]}),e.jsxs(k,{onClick:T,disabled:g,className:"w-full",children:[e.jsx(S,{className:"mr-2 h-4 w-4"}),g?"Saving...":s?"Update Template":"Create Template"]})]}),e.jsx("div",{className:"lg:sticky lg:top-6",children:e.jsxs(i,{children:[e.jsxs(c,{children:[e.jsx(d,{children:"Live Preview"}),e.jsx(n,{children:"See how your certificate will look"})]}),e.jsx(m,{children:e.jsx(B,{template:t,studentName:"John Doe",courseName:"Sample Course Name",completionDate:"January 1, 2025",logoUrl:j})})]})})]})};export{J as default};
|