diff --git a/glm-card-generator/dist/assets/index-hkdwba_S.js b/glm-card-generator/dist/assets/index-CVcbyLxj.js similarity index 98% rename from glm-card-generator/dist/assets/index-hkdwba_S.js rename to glm-card-generator/dist/assets/index-CVcbyLxj.js index 6de7d68..f3c778d 100644 --- a/glm-card-generator/dist/assets/index-hkdwba_S.js +++ b/glm-card-generator/dist/assets/index-CVcbyLxj.js @@ -82,4 +82,4 @@ Resources:`;for(let t of c){if(!t||typeof t!=`string`)throw Error(`@supabase/aut
${u.role.toUpperCase()}
- `,s.appendChild(g);let v=Cc[u.language]||Cc.Esp,y=`${t}${v[d]||v.Generico}`,b=document.createElement(`div`);b.style.cssText=c,b.style.backgroundImage=`url('${y}')`;let x=document.createElement(`div`);x.style.cssText=`position: absolute; bottom: 27px; right: 27px; background: #ffffff; padding: 11px; border-radius: 16px; display: flex; align-items: center; justify-content: center; z-index: 5;`;let S=document.createElement(`canvas`);S.width=149,S.height=149,S.style.width=`100px`,S.style.height=`100px`;let C=S.getContext(`2d`);C&&(C.imageSmoothingEnabled=!1,C.drawImage(o,0,0,149,149)),x.appendChild(S),b.appendChild(x),s.appendChild(b),await new Promise(e=>setTimeout(e,30));let w=(await i(g,l)).toDataURL(`image/png`).split(`,`)[1];a.file(`${f}/Frente.png`,w,{base64:!0});let ee=(await i(b,l)).toDataURL(`image/png`).split(`,`)[1];a.file(`${f}/Reverso.png`,ee,{base64:!0}),h&&h.startsWith(`blob:`)&&URL.revokeObjectURL(h),s.removeChild(g),s.removeChild(b)}s.parentNode&&document.body.removeChild(s);let u=await a.generateAsync({type:`blob`}),d=document.createElement(`a`);d.href=URL.createObjectURL(u),d.download=`Lote_Carnets_GLM.zip`,document.body.appendChild(d),d.click(),document.body.removeChild(d),n&&n({processing:!1,text:`⬇ Descargar`})}function Fc(e,t){let n=document.createElement(`a`);n.href=e,n.download=t,document.body.appendChild(n),n.click(),document.body.removeChild(n)}async function Ic(e,t){let n=String(e||``).replace(/[-\s]/g,``),r=t||`Generico`;if(!n)throw Error(`Cédula vacía, no se puede guardar.`);let{error:i}=await vc.rpc(`upsert_carnet_cliente`,{p_cedula:n,p_cliente_proyecto:r});if(i)throw i}var Lc=e=>{if(!e)return null;try{if(typeof e==`object`&&e.type===`Buffer`&&Array.isArray(e.data)){let t=new Uint8Array(e.data),n=new Blob([t],{type:`image/jpeg`});return URL.createObjectURL(n)}if(Array.isArray(e)){let t=new Uint8Array(e),n=new Blob([t],{type:`image/jpeg`});return URL.createObjectURL(n)}if(typeof e==`string`){let t=e.replace(/^data:image\/\w+;base64,/,``),n=atob(t),r=Array(n.length);for(let e=0;e{E.current&&Mc(c,E.current)},[c]);let ae=async e=>{let t=e.target.files[0];if(t){p(t),d(URL.createObjectURL(t)),h(!0);try{let e=await oe(t);d(URL.createObjectURL(e)),p(new File([e],t.name,{type:e.type||`image/jpeg`}))}catch{alert(`No se pudo procesar la foto con IA. Se usará la foto original para la vista previa.`)}finally{h(!1)}}},oe=async t=>{let r=new FormData;r.append(`edited`,t,t.name),r.append(`name`,e),r.append(`role`,n),r.append(`employeeId`,c),r.append(`fechaProcesado`,new Date().toISOString());let i=await fetch(`https://agenteit.digitalcompass.agency/webhook/carnet`,{method:`POST`,headers:{Authorization:`h8G4tfQ8Bw00M/FtDFpkCW1bqaz8NriE5Z08SjyVDaI=`},body:r});if(!i.ok)throw Error(`El servidor de n8n rechazó la petición (Código: ${i.status})`);if((i.headers.get(`content-type`)||``).includes(`application/json`)){let e=await i.json(),t=Lc(e.edited||e.data||e.foto_processed_base64||e.photo||e.binary||Array.isArray(e)&&(e[0]?.edited||e[0]?.data));if(!t)throw Error(`n8n no devolvió un binario válido.`);return await(await fetch(t)).blob()}let a=await i.blob();if(!a||a.size===0)throw Error(`n8n devolvió un binario vacío.`);return a},se=e=>{l(e.target.value.replace(/[-\s]/g,``))},ce=async e=>{try{let t=await fetch(`https://agenteit.digitalcompass.agency/webhook/carnet`,{method:`POST`,headers:{"Content-Type":`application/json`,Authorization:`h8G4tfQ8Bw00M/FtDFpkCW1bqaz8NriE5Z08SjyVDaI=`},body:JSON.stringify({empleados:e,total:e.length,fechaProcesado:new Date().toISOString()})});if(!t.ok)throw Error(`El servidor de n8n rechazó la petición (Código: ${t.status})`);let n=await t.json();return Array.isArray(n)?n:n.empleados||n.data||[]}catch(e){throw e}},D=async(e,t,n)=>{let r=String(e).replace(/[-\s]/g,``);if(r)try{await Ic(r,n?.selectedClient||`Generico`)}catch{}},O=async e=>{let t=e.target.files[0];if(t){C(`Leyendo documento...`);try{let e=await Oc(),n=new FileReader;n.onload=async t=>{try{let n=t.target.result,r=e.read(n,{type:`binary`}),i=r.SheetNames[0],a=r.Sheets[i],o=e.utils.sheet_to_json(a);if(o.length===0){C(`❌ El archivo está vacío.`);return}let s=o.map(e=>{let t=String(e.lenguaje||`Esp`).trim().toLowerCase();t=t.includes(`es`)||t.includes(`esp`)?`Esp`:t.includes(`en`)||t.includes(`ing`)?`Ing`:`Esp`;let n=String(e[`cliente/proyecto`]||`Generico`).trim().normalize(`NFD`).replace(/[\u0300-\u036f]/g,``),r=n.toLowerCase();n=r.includes(`nestle`)?`Nestle`:r.includes(`claro`)?`Claro`:r.includes(`colgate`)?`Colgate`:r.includes(`kitchenaid`)||r.includes(`kitchen`)?`KitchenAid`:r.includes(`kraft`)?`Kraft`:r.includes(`motorola`)?`Motorola`:r.includes(`p&g`)||r.includes(`p y g`)?`P&G`:r.includes(`philip`)||r.includes(`morris`)?`Philip Morris`:r.includes(`whirlpool`)?`Whirlpool`:`Generico`;let i=String(e.cedula||``).replace(/[-\s]/g,``);return{name:String(e.nombre||``).trim(),role:String(e.puesto||``).trim(),selectedClient:n,language:t,employeeId:i,fotoUrl:String(e.foto_url||``).trim()}}).filter(e=>e.name&&e.role&&e.employeeId);x(s),C(`✅ ¡Cargados ${s.length} colaboradores! Listo para procesar.`),ee({processing:!1,text:`⬇ Descargar`})}catch{C(`❌ Error de lectura. Revisa el formato de columnas.`)}},n.readAsBinaryString(t)}catch{C(`❌ Error cargando el motor XLSX.`)}}},le=async()=>{if(b.length!==0){ee({processing:!0,text:`🔄 Descargando...`}),C(`Descargando retratos...`);try{let e=await ce(b);C(`Generando frentes, reversos y empaquetando en carpetas locales...`);let t=b.map((t,n)=>{let r=e[n]||e.find(e=>e.employeeId===t.employeeId)||{},i=Lc(r.data||r.foto_processed_base64||t.data)||t.fotoUrl,a=r.selectedClient||t.selectedClient||`Generico`,o=r.language||t.language||`Esp`;return{name:r.name||t.name,role:r.role||t.role,selectedClient:a,language:o,employeeId:r.employeeId||t.employeeId,fotoUrl:i}});await Pc({employees:t,baseUrl:ie,onStateChange:null,onProcessEmployeePhoto:(e,n)=>D(e,n,t.find(t=>t.employeeId===e))}),C(`✅ ¡Lote completado! ${t.length} carnets procesados.`),x([])}catch(e){C(`❌ Error al procesar: ${e.message||e}`)}finally{ee({processing:!1,text:`⬇ Descargar`})}}},ue=async()=>{if(de()){v({processing:!0,text:`🔄 Descargando...`});try{let t=null;if(u&&u.startsWith(`blob:`)){let e=await fetch(u);if(e.ok){let n=await e.blob();t=await new Promise(e=>{let t=new FileReader;t.onloadend=()=>e(t.result.split(`,`)[1]),t.readAsDataURL(n)})}}let r=await fetch(`https://agenteit.digitalcompass.agency/webhook/carnet`,{method:`POST`,headers:{"Content-Type":`application/json`,Authorization:`h8G4tfQ8Bw00M/FtDFpkCW1bqaz8NriE5Z08SjyVDaI=`},body:JSON.stringify({data:t,employeeId:c})});if(!r.ok)throw Error(`El servidor de n8n rechazó la petición (Código: ${r.status})`);await Nc({name:e,role:n,selectedClient:o,language:i,photoSrc:u,baseUrl:ie,qrCanvas:E.current,onStateChange:v});let a=String(c||``).replace(/[-\s]/g,``);a&&await Ic(a,o)}catch(e){alert(e.message),v({processing:!1,text:`⬇ Descargar`})}}},de=()=>e.trim()?n.trim()?c.trim()?f?!0:(alert(`Debe subir la foto del colaborador.`),!1):(alert(`Debe ingresar el ID del empleado.`),!1):(alert(`Debe ingresar el puesto.`),!1):(alert(`Debe ingresar el nombre.`),!1);return(0,U.jsxs)(U.Fragment,{children:[(0,U.jsxs)(`div`,{className:`page-title`,children:[(0,U.jsx)(`h1`,{children:`GLM ID Card Generator`}),(0,U.jsx)(`p`,{children:`GomezLee Marketing · Carnet Corporativo CR80`})]}),(0,U.jsxs)(`div`,{className:`main-container`,style:{display:`flex`,gap:`20px`,alignItems:`flex-start`},children:[(0,U.jsxs)(`div`,{className:`panel`,style:{minWidth:`320px`},children:[(0,U.jsxs)(`div`,{className:`preview-badge`,style:{background:`#FFF3E0`,color:`#E65100`},children:[(0,U.jsx)(`div`,{className:`dot`,style:{background:`#E65100`}}),(0,U.jsx)(`span`,{children:`Módulo de Lotes Automáticos`})]}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsxs)(`div`,{className:`panel-section-title`,style:{display:`flex`,alignItems:`center`,gap:`6px`,position:`relative`},children:[(0,U.jsx)(`span`,{children:`Carga Masiva de Colaboradores`}),(0,U.jsx)(`div`,{style:{display:`flex`,alignItems:`center`,justifyContent:`center`,width:`16px`,height:`16px`,borderRadius:`50%`,background:`#cbd5e1`,color:`#334155`,fontSize:`11px`,fontWeight:`bold`,cursor:`help`,userSelect:`none`},onMouseEnter:()=>ne(!0),onMouseLeave:()=>ne(!1),children:`?`}),te&&(0,U.jsxs)(`div`,{style:{position:`absolute`,top:`24px`,left:`0`,right:`0`,background:`#1e293b`,color:`#ffffff`,padding:`10px`,borderRadius:`6px`,fontSize:`11px`,lineHeight:`1.4`,zIndex:`99`,boxShadow:`0 4px 6px -1px rgb(0 0 0 / 0.1)`,fontWeight:`normal`,textTransform:`none`},children:[`Formato de columnas requeridas en el Excel: `,(0,U.jsx)(`br`,{}),(0,U.jsx)(`b`,{style:{color:`#6CC24A`},children:`nombre, puesto, cliente/proyecto, cedula, lenguaje, foto_url`}),`.`,(0,U.jsx)(`br`,{})]})]}),(0,U.jsxs)(`div`,{className:`upload-btn`,style:{background:`#475569`,marginTop:`12px`},onClick:()=>T.current.click(),children:[(0,U.jsxs)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,children:[(0,U.jsx)(`path`,{d:`M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z`}),(0,U.jsx)(`polyline`,{points:`14 2 14 8 20 8`}),(0,U.jsx)(`line`,{x1:`16`,y1:`13`,x2:`8`,y2:`13`}),(0,U.jsx)(`line`,{x1:`16`,y1:`17`,x2:`8`,y2:`17`})]}),`Seleccionar Archivo Excel`]}),(0,U.jsx)(`input`,{type:`file`,accept:`.xlsx, .xls, .csv`,style:{display:`none`},ref:T,onChange:O}),S&&(0,U.jsx)(`div`,{style:{fontSize:`12px`,marginTop:`8px`,fontWeight:`500`,color:`#475569`},children:S})]}),(0,U.jsx)(`div`,{className:`divider`}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsx)(`div`,{className:`panel-section-title`,children:`Exportar Lote`}),(0,U.jsx)(`button`,{className:`export-btn blue`,disabled:w.processing||b.length===0,onClick:le,style:{opacity:b.length===0?.6:1},children:w.text})]})]}),(0,U.jsxs)(`div`,{className:`panel`,children:[(0,U.jsxs)(`div`,{className:`preview-badge`,children:[(0,U.jsx)(`div`,{className:`dot`}),(0,U.jsx)(`span`,{children:`Vista previa en tiempo real`})]}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsx)(`div`,{className:`panel-section-title`,children:`Colaborador`}),(0,U.jsxs)(`div`,{className:`field`,children:[(0,U.jsx)(`label`,{children:`Nombre`}),(0,U.jsx)(`input`,{type:`text`,placeholder:`Ej: Alexi Zabala`,value:e,onChange:e=>t(e.target.value)})]}),(0,U.jsxs)(`div`,{className:`field`,children:[(0,U.jsx)(`label`,{children:`Puesto`}),(0,U.jsx)(`input`,{type:`text`,placeholder:`Ej: Mercaderista`,value:n,onChange:e=>r(e.target.value)})]}),(0,U.jsx)(`div`,{className:`upload-btn`,onClick:()=>!m&&re.current.click(),style:{opacity:m?.6:1,cursor:m?`wait`:`pointer`},children:m?`⏳ Procesando foto con IA...`:`Subir foto del colaborador`}),(0,U.jsx)(`input`,{type:`file`,accept:`image/*`,style:{display:`none`},ref:re,onChange:ae})]}),(0,U.jsx)(`div`,{className:`divider`}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsx)(`div`,{className:`panel-section-title`,children:`Cliente / Proyecto`}),(0,U.jsxs)(`div`,{className:`lang-container`,children:[(0,U.jsx)(`button`,{type:`button`,className:`lang-btn ${i===`Esp`?`active`:``}`,onClick:()=>a(`Esp`),children:`Español`}),(0,U.jsx)(`button`,{type:`button`,className:`lang-btn ${i===`Ing`?`active`:``}`,onClick:()=>a(`Ing`),children:`Inglés`})]}),(0,U.jsxs)(`div`,{className:`field`,children:[(0,U.jsx)(`label`,{children:`Seleccionar Cliente`}),(0,U.jsxs)(`select`,{value:o,onChange:e=>s(e.target.value),children:[(0,U.jsx)(`option`,{value:`Generico`,children:`Genérico (Por defecto)`}),(0,U.jsx)(`option`,{value:`Claro`,children:`Claro`}),(0,U.jsx)(`option`,{value:`Colgate`,children:`Colgate`}),(0,U.jsx)(`option`,{value:`KitchenAid`,children:`KitchenAid`}),(0,U.jsx)(`option`,{value:`Kraft`,children:`Kraft`}),(0,U.jsx)(`option`,{value:`Motorola`,children:`Motorola`}),(0,U.jsx)(`option`,{value:`Nestle`,children:`Nestle`}),(0,U.jsx)(`option`,{value:`P&G`,children:`P&G`}),(0,U.jsx)(`option`,{value:`Philip Morris`,children:`Philip Morris International`}),(0,U.jsx)(`option`,{value:`Whirlpool`,children:`Whirlpool`})]})]})]}),(0,U.jsx)(`div`,{className:`divider`}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsx)(`div`,{className:`panel-section-title`,children:`Código QR`}),(0,U.jsxs)(`div`,{className:`field`,children:[(0,U.jsx)(`label`,{children:`ID del empleado / Cédula`}),(0,U.jsx)(`input`,{type:`text`,placeholder:`Ej: 123456789 (Sin guiones ni espacios)`,value:c,onChange:se})]}),(0,U.jsx)(`button`,{className:`export-btn`,style:{background:`#6CC24A`,marginTop:`2px`},onClick:()=>Mc(c,E.current),children:`⟳ Generar QR`})]}),(0,U.jsx)(`div`,{className:`divider`}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsx)(`div`,{className:`panel-section-title`,children:`Exportar`}),(0,U.jsx)(`button`,{className:`export-btn blue`,disabled:g.processing||!y,onClick:ue,style:{opacity:!y||g.processing?.6:1},children:g.text})]})]}),(0,U.jsxs)(`div`,{className:`stage`,children:[(0,U.jsxs)(`div`,{className:`card-wrap`,children:[(0,U.jsx)(`div`,{className:`card-label`,children:`Frente`}),(0,U.jsxs)(`div`,{className:`card`,id:`cardFront`,style:{backgroundImage:`url('${ie}images/AF GLM Frente.png')`},children:[(0,U.jsxs)(`div`,{className:`front-photo-frame`,style:{position:`relative`,overflow:`hidden`},children:[u?(0,U.jsx)(`img`,{src:u,alt:`Foto Colaborador`,style:{width:`100%`,height:`100%`,objectFit:`cover`,display:`block`}}):null,m&&(0,U.jsx)(`div`,{style:{position:`absolute`,inset:0,display:`flex`,alignItems:`center`,justifyContent:`center`,background:`rgba(0,0,0,0.45)`,color:`#fff`,fontSize:`13px`,fontWeight:`600`,textAlign:`center`,padding:`8px`},children:`⏳ Editando foto con IA...`}),!u&&(0,U.jsxs)(`svg`,{className:`placeholder-svg`,viewBox:`0 0 28 28`,fill:`none`,style:{width:`60%`,height:`60%`,opacity:.4},children:[(0,U.jsx)(`circle`,{cx:`14`,cy:`10`,r:`5.5`,stroke:`currentColor`,strokeWidth:`1.5`}),(0,U.jsx)(`path`,{d:`M3 24c0-6 22-6 22 0`,stroke:`currentColor`,strokeWidth:`1.5`})]})]}),(0,U.jsx)(`div`,{className:`front-dynamic-name`,children:e?e.toUpperCase():`NOMBRE APELLIDO`}),(0,U.jsx)(`div`,{className:`front-dynamic-role`,children:n?n.toUpperCase():`PUESTO`})]})]}),(0,U.jsxs)(`div`,{className:`card-wrap`,children:[(0,U.jsx)(`div`,{className:`card-label`,children:`Reverso`}),(0,U.jsx)(`div`,{className:`card`,id:`cardBack`,style:{backgroundImage:`url('${ie}${(Cc[i]||Cc.Esp)[o]||(Cc[i]||Cc.Esp).Generico}')`},children:(0,U.jsx)(`div`,{className:`back-qr-zone`,children:(0,U.jsx)(`canvas`,{ref:E,width:55,height:55})})})]})]})]})]})}var Rc=(0,_.createContext)(null),zc=()=>(0,_.useContext)(Rc),Bc=`@gomezleemarketing.com`,Vc=`https://dbit.digitalcompass.agency/storage/v1/object/public/public-assets/GLM_completo.png`;function Hc({children:e}){let[t,n]=(0,_.useState)(null),[r,i]=(0,_.useState)(!0);return(0,_.useEffect)(()=>{if(!vc){i(!1);return}vc.auth.getSession().then(({data:{session:e}})=>{n(e?.user??null),i(!1)});let{data:{subscription:e}}=vc.auth.onAuthStateChange((e,t)=>{n(t?.user??null),i(!1)});return()=>e.unsubscribe()},[]),r?(0,U.jsx)(`div`,{style:{minHeight:`100vh`,display:`flex`,alignItems:`center`,justifyContent:`center`,background:`#EEF6E8`,fontFamily:`Arial, sans-serif`},children:(0,U.jsx)(`div`,{style:{width:40,height:40,border:`3px solid #D0D0D0`,borderTopColor:`#6CC24A`,borderRadius:`50%`,animation:`spin 0.8s linear infinite`}})}):(0,U.jsx)(Rc.Provider,{value:{user:t,signOut:async()=>{vc&&await vc.auth.signOut()},loading:r},children:e})}function Uc({children:e}){let{user:t,signOut:n,loading:r}=zc(),i=A();return r?null:t?t.email?.endsWith(Bc)?e:(n(),(0,U.jsxs)(`div`,{style:{minHeight:`100vh`,display:`flex`,flexDirection:`column`,alignItems:`center`,justifyContent:`center`,background:`#EEF6E8`,fontFamily:`Arial, sans-serif`,padding:`20px`,textAlign:`center`},children:[(0,U.jsx)(`img`,{src:Vc,alt:`GLM`,style:{maxWidth:220,marginBottom:24}}),(0,U.jsx)(`h1`,{style:{color:`#4F758B`,fontSize:24,fontWeight:700,marginBottom:16},children:`Acceso no autorizado`}),(0,U.jsxs)(`p`,{style:{color:`#6B8FA3`,fontSize:16,marginBottom:24,maxWidth:400},children:[`Solo se permite acceso con cuentas corporativas `,(0,U.jsx)(`strong`,{children:`@gomezleemarketing.com`}),`. Tu cuenta `,(0,U.jsx)(`strong`,{children:t.email}),` no tiene permisos.`]}),(0,U.jsx)(`button`,{onClick:n,style:{padding:`14px 32px`,fontSize:15,fontWeight:600,fontFamily:`Arial`,color:`#fff`,background:`#4F758B`,border:`none`,borderRadius:10,cursor:`pointer`},children:`Cerrar sesión y volver a intentar`})]})):(0,U.jsx)(Ht,{to:`/empleado-id/login`,state:{from:i},replace:!0})}function Wc({children:e}){let{user:t,loading:n}=zc(),r=A();return n?null:t?.email?.endsWith(Bc)?(0,U.jsx)(Ht,{to:r.state?.from?.pathname||`/empleado-id/`,replace:!0}):e}function Gc(){return(0,U.jsx)(Hc,{children:(0,U.jsx)(Nn,{children:(0,U.jsxs)(Gt,{children:[(0,U.jsx)(Ut,{path:`/empleado-id/login`,element:(0,U.jsx)(Wc,{children:(0,U.jsx)(Sc,{})})}),(0,U.jsx)(Ut,{path:`/empleado-id/`,element:(0,U.jsx)(Uc,{children:(0,U.jsx)(W,{})})}),(0,U.jsx)(Ut,{path:`*`,element:(0,U.jsx)(Ht,{to:`/empleado-id/`,replace:!0})})]})})})}(0,v.createRoot)(document.getElementById(`root`)).render((0,U.jsx)(_.StrictMode,{children:(0,U.jsx)(Gc,{})})); \ No newline at end of file + `,s.appendChild(g);let v=Cc[u.language]||Cc.Esp,y=`${t}${v[d]||v.Generico}`,b=document.createElement(`div`);b.style.cssText=c,b.style.backgroundImage=`url('${y}')`;let x=document.createElement(`div`);x.style.cssText=`position: absolute; bottom: 27px; right: 27px; background: #ffffff; padding: 11px; border-radius: 16px; display: flex; align-items: center; justify-content: center; z-index: 5;`;let S=document.createElement(`canvas`);S.width=149,S.height=149,S.style.width=`100px`,S.style.height=`100px`;let C=S.getContext(`2d`);C&&(C.imageSmoothingEnabled=!1,C.drawImage(o,0,0,149,149)),x.appendChild(S),b.appendChild(x),s.appendChild(b),await new Promise(e=>setTimeout(e,30));let w=(await i(g,l)).toDataURL(`image/png`).split(`,`)[1];a.file(`${f}/Frente.png`,w,{base64:!0});let ee=(await i(b,l)).toDataURL(`image/png`).split(`,`)[1];a.file(`${f}/Reverso.png`,ee,{base64:!0}),h&&h.startsWith(`blob:`)&&URL.revokeObjectURL(h),s.removeChild(g),s.removeChild(b)}s.parentNode&&document.body.removeChild(s);let u=await a.generateAsync({type:`blob`}),d=document.createElement(`a`);d.href=URL.createObjectURL(u),d.download=`Lote_Carnets_GLM.zip`,document.body.appendChild(d),d.click(),document.body.removeChild(d),n&&n({processing:!1,text:`⬇ Descargar`})}function Fc(e,t){let n=document.createElement(`a`);n.href=e,n.download=t,document.body.appendChild(n),n.click(),document.body.removeChild(n)}async function Ic(e,t){let n=String(e||``).replace(/[-\s]/g,``),r=t||`Generico`;if(!n)throw Error(`Cédula vacía, no se puede guardar.`);let{error:i}=await vc.rpc(`upsert_carnet_cliente`,{p_cedula:n,p_cliente_proyecto:r});if(i)throw i}var Lc=e=>{if(!e)return null;try{if(typeof e==`object`&&e.type===`Buffer`&&Array.isArray(e.data)){let t=new Uint8Array(e.data),n=new Blob([t],{type:`image/jpeg`});return URL.createObjectURL(n)}if(Array.isArray(e)){let t=new Uint8Array(e),n=new Blob([t],{type:`image/jpeg`});return URL.createObjectURL(n)}if(typeof e==`string`){let t=e.replace(/^data:image\/\w+;base64,/,``),n=atob(t),r=Array(n.length);for(let e=0;e{E.current&&Mc(c,E.current)},[c]);let ae=async e=>{let t=e.target.files[0];if(t){p(t),d(URL.createObjectURL(t)),h(!0);try{let e=await oe(t);d(URL.createObjectURL(e)),p(new File([e],t.name,{type:e.type||`image/jpeg`}))}catch{alert(`No se pudo procesar la foto con IA. Se usará la foto original para la vista previa.`)}finally{h(!1)}}},oe=async t=>{let r=new FormData;r.append(`edited`,t,t.name),r.append(`name`,e),r.append(`role`,n),r.append(`employeeId`,c),r.append(`fechaProcesado`,new Date().toISOString());let i=await fetch(`https://agenteit.digitalcompass.agency/webhook/carnet`,{method:`POST`,headers:{Authorization:`h8G4tfQ8Bw00M/FtDFpkCW1bqaz8NriE5Z08SjyVDaI=`},body:r});if(!i.ok)throw Error(`El servidor de n8n rechazó la petición (Código: ${i.status})`);if((i.headers.get(`content-type`)||``).includes(`application/json`)){let e=await i.json(),t=Lc(e.edited||e.data||e.foto_processed_base64||e.photo||e.binary||Array.isArray(e)&&(e[0]?.edited||e[0]?.data));if(!t)throw Error(`n8n no devolvió un binario válido.`);return await(await fetch(t)).blob()}let a=await i.blob();if(!a||a.size===0)throw Error(`n8n devolvió un binario vacío.`);return a},se=e=>{l(e.target.value.replace(/[-\s]/g,``))},ce=async e=>{try{let t=await fetch(`https://agenteit.digitalcompass.agency/webhook/carnet`,{method:`POST`,headers:{"Content-Type":`application/json`,Authorization:`h8G4tfQ8Bw00M/FtDFpkCW1bqaz8NriE5Z08SjyVDaI=`},body:JSON.stringify({empleados:e,total:e.length,fechaProcesado:new Date().toISOString()})});if(!t.ok)throw Error(`El servidor de n8n rechazó la petición (Código: ${t.status})`);let n=await t.json();return Array.isArray(n)?n:n.empleados||n.data||[]}catch(e){throw e}},D=async(e,t,n)=>{let r=String(e).replace(/[-\s]/g,``);if(r)try{await Ic(r,n?.selectedClient||`Generico`)}catch{}},O=async e=>{let t=e.target.files[0];if(t){C(`Leyendo documento...`);try{let e=await Oc(),n=new FileReader;n.onload=async t=>{try{let n=t.target.result,r=e.read(n,{type:`binary`}),i=r.SheetNames[0],a=r.Sheets[i],o=e.utils.sheet_to_json(a);if(o.length===0){C(`❌ El archivo está vacío.`);return}let s=o.map(e=>{let t=String(e.lenguaje||`Esp`).trim().toLowerCase();t=t.includes(`es`)||t.includes(`esp`)?`Esp`:t.includes(`en`)||t.includes(`ing`)?`Ing`:`Esp`;let n=String(e[`cliente/proyecto`]||`Generico`).trim().normalize(`NFD`).replace(/[\u0300-\u036f]/g,``),r=n.toLowerCase();n=r.includes(`nestle`)?`Nestle`:r.includes(`claro`)?`Claro`:r.includes(`colgate`)?`Colgate`:r.includes(`kitchenaid`)||r.includes(`kitchen`)?`KitchenAid`:r.includes(`kraft`)?`Kraft`:r.includes(`motorola`)?`Motorola`:r.includes(`p&g`)||r.includes(`p y g`)?`P&G`:r.includes(`philip`)||r.includes(`morris`)?`Philip Morris`:r.includes(`whirlpool`)?`Whirlpool`:`Generico`;let i=String(e.cedula||``).replace(/[-\s]/g,``);return{name:String(e.nombre||``).trim(),role:String(e.puesto||``).trim(),selectedClient:n,language:t,employeeId:i,fotoUrl:String(e.foto_url||``).trim()}}).filter(e=>e.name&&e.role&&e.employeeId);x(s),C(`✅ ¡Cargados ${s.length} colaboradores! Listo para procesar.`),ee({processing:!1,text:`⬇ Descargar`})}catch{C(`❌ Error de lectura. Revisa el formato de columnas.`)}},n.readAsBinaryString(t)}catch{C(`❌ Error cargando el motor XLSX.`)}}},le=async()=>{if(b.length!==0){ee({processing:!0,text:`🔄 Descargando...`}),C(`Descargando retratos...`);try{let e=await ce(b);C(`Generando frentes, reversos y empaquetando en carpetas locales...`);let t=b.map((t,n)=>{let r=e[n]||e.find(e=>e.employeeId===t.employeeId)||{},i=Lc(r.data||r.foto_processed_base64||t.data)||t.fotoUrl,a=r.selectedClient||t.selectedClient||`Generico`,o=r.language||t.language||`Esp`;return{name:r.name||t.name,role:r.role||t.role,selectedClient:a,language:o,employeeId:r.employeeId||t.employeeId,fotoUrl:i}});await Pc({employees:t,baseUrl:ie,onStateChange:null,onProcessEmployeePhoto:(e,n)=>D(e,n,t.find(t=>t.employeeId===e))}),C(`✅ ¡Lote completado! ${t.length} carnets procesados.`),x([])}catch(e){C(`❌ Error al procesar: ${e.message||e}`)}finally{ee({processing:!1,text:`⬇ Descargar`})}}},ue=async()=>{if(de()){v({processing:!0,text:`🔄 Descargando...`});try{let t=null;if(u&&u.startsWith(`blob:`)){let e=await fetch(u);if(e.ok){let n=await e.blob();t=await new Promise(e=>{let t=new FileReader;t.onloadend=()=>e(t.result.split(`,`)[1]),t.readAsDataURL(n)})}}let r=await fetch(`https://agenteit.digitalcompass.agency/webhook/carnet`,{method:`POST`,headers:{"Content-Type":`application/json`,Authorization:`h8G4tfQ8Bw00M/FtDFpkCW1bqaz8NriE5Z08SjyVDaI=`},body:JSON.stringify({data:t,employeeId:c})});if(!r.ok)throw Error(`El servidor de n8n rechazó la petición (Código: ${r.status})`);await Nc({name:e,role:n,selectedClient:o,language:i,photoSrc:u,baseUrl:ie,qrCanvas:E.current,onStateChange:v});let a=String(c||``).replace(/[-\s]/g,``);a&&await Ic(a,o)}catch(e){alert(e.message),v({processing:!1,text:`⬇ Descargar`})}}},de=()=>e.trim()?n.trim()?c.trim()?f?!0:(alert(`Debe subir la foto del colaborador.`),!1):(alert(`Debe ingresar el ID del empleado.`),!1):(alert(`Debe ingresar el puesto.`),!1):(alert(`Debe ingresar el nombre.`),!1);return(0,U.jsxs)(U.Fragment,{children:[(0,U.jsxs)(`div`,{className:`page-title`,children:[(0,U.jsx)(`h1`,{children:`GLM ID Card Generator`}),(0,U.jsx)(`p`,{children:`GomezLee Marketing · Carnet Corporativo CR80`})]}),(0,U.jsxs)(`div`,{className:`main-container`,style:{display:`flex`,gap:`20px`,alignItems:`flex-start`},children:[(0,U.jsxs)(`div`,{className:`panel`,style:{minWidth:`320px`},children:[(0,U.jsxs)(`div`,{className:`preview-badge`,style:{background:`#FFF3E0`,color:`#E65100`},children:[(0,U.jsx)(`div`,{className:`dot`,style:{background:`#E65100`}}),(0,U.jsx)(`span`,{children:`Módulo de Lotes Automáticos`})]}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsxs)(`div`,{className:`panel-section-title`,style:{display:`flex`,alignItems:`center`,gap:`6px`,position:`relative`},children:[(0,U.jsx)(`span`,{children:`Carga Masiva de Colaboradores`}),(0,U.jsx)(`div`,{style:{display:`flex`,alignItems:`center`,justifyContent:`center`,width:`16px`,height:`16px`,borderRadius:`50%`,background:`#cbd5e1`,color:`#334155`,fontSize:`11px`,fontWeight:`bold`,cursor:`help`,userSelect:`none`},onMouseEnter:()=>ne(!0),onMouseLeave:()=>ne(!1),children:`?`}),te&&(0,U.jsxs)(`div`,{style:{position:`absolute`,top:`24px`,left:`0`,right:`0`,background:`#1e293b`,color:`#ffffff`,padding:`10px`,borderRadius:`6px`,fontSize:`11px`,lineHeight:`1.4`,zIndex:`99`,boxShadow:`0 4px 6px -1px rgb(0 0 0 / 0.1)`,fontWeight:`normal`,textTransform:`none`},children:[`Formato de columnas requeridas en el Excel: `,(0,U.jsx)(`br`,{}),(0,U.jsx)(`b`,{style:{color:`#6CC24A`},children:`nombre, puesto, cliente/proyecto, cedula, lenguaje, foto_url`}),`.`,(0,U.jsx)(`br`,{})]})]}),(0,U.jsxs)(`div`,{style:{display:`flex`,flexDirection:`column`,gap:`8px`,marginTop:`12px`},children:[(0,U.jsx)(`div`,{style:{display:`flex`,alignItems:`center`,gap:`8px`,flexWrap:`wrap`},children:(0,U.jsxs)(`a`,{href:`https://docs.google.com/spreadsheets/d/1F5DAvLL82bpW2pL_jdu4FgcAnjbzV3VwlRh89aS2Khc/export?format=xlsx`,target:`_blank`,rel:`noopener noreferrer`,className:`upload-btn`,style:{background:`#6CC24A`,color:`#fff`,textDecoration:`none`,padding:`8px 16px`,fontSize:`13px`},children:[(0,U.jsxs)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,style:{marginRight:`6px`,verticalAlign:`middle`},children:[(0,U.jsx)(`path`,{d:`M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4`}),(0,U.jsx)(`polyline`,{points:`7 10 12 15 17 10`}),(0,U.jsx)(`line`,{x1:`12`,y1:`15`,x2:`12`,y2:`3`})]}),`Descargar plantilla Excel`]})}),(0,U.jsxs)(`div`,{className:`upload-btn`,style:{background:`#475569`},onClick:()=>T.current.click(),children:[(0,U.jsxs)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,children:[(0,U.jsx)(`path`,{d:`M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z`}),(0,U.jsx)(`polyline`,{points:`14 2 14 8 20 8`}),(0,U.jsx)(`line`,{x1:`16`,y1:`13`,x2:`8`,y2:`13`}),(0,U.jsx)(`line`,{x1:`16`,y1:`17`,x2:`8`,y2:`17`})]}),`Seleccionar Archivo Excel`]}),(0,U.jsx)(`input`,{type:`file`,accept:`.xlsx, .xls, .csv`,style:{display:`none`},ref:T,onChange:O})]}),S&&(0,U.jsx)(`div`,{style:{fontSize:`12px`,marginTop:`8px`,fontWeight:`500`,color:`#475569`},children:S})]}),(0,U.jsx)(`div`,{className:`divider`}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsx)(`div`,{className:`panel-section-title`,children:`Exportar Lote`}),(0,U.jsx)(`button`,{className:`export-btn blue`,disabled:w.processing||b.length===0,onClick:le,style:{opacity:b.length===0?.6:1},children:w.text})]})]}),(0,U.jsxs)(`div`,{className:`panel`,children:[(0,U.jsxs)(`div`,{className:`preview-badge`,children:[(0,U.jsx)(`div`,{className:`dot`}),(0,U.jsx)(`span`,{children:`Vista previa en tiempo real`})]}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsx)(`div`,{className:`panel-section-title`,children:`Colaborador`}),(0,U.jsxs)(`div`,{className:`field`,children:[(0,U.jsx)(`label`,{children:`Nombre`}),(0,U.jsx)(`input`,{type:`text`,placeholder:`Ej: Alexi Zabala`,value:e,onChange:e=>t(e.target.value)})]}),(0,U.jsxs)(`div`,{className:`field`,children:[(0,U.jsx)(`label`,{children:`Puesto`}),(0,U.jsx)(`input`,{type:`text`,placeholder:`Ej: Mercaderista`,value:n,onChange:e=>r(e.target.value)})]}),(0,U.jsx)(`div`,{className:`upload-btn`,onClick:()=>!m&&re.current.click(),style:{opacity:m?.6:1,cursor:m?`wait`:`pointer`},children:m?`⏳ Procesando foto con IA...`:`Subir foto del colaborador`}),(0,U.jsx)(`input`,{type:`file`,accept:`image/*`,style:{display:`none`},ref:re,onChange:ae})]}),(0,U.jsx)(`div`,{className:`divider`}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsx)(`div`,{className:`panel-section-title`,children:`Cliente / Proyecto`}),(0,U.jsxs)(`div`,{className:`lang-container`,children:[(0,U.jsx)(`button`,{type:`button`,className:`lang-btn ${i===`Esp`?`active`:``}`,onClick:()=>a(`Esp`),children:`Español`}),(0,U.jsx)(`button`,{type:`button`,className:`lang-btn ${i===`Ing`?`active`:``}`,onClick:()=>a(`Ing`),children:`Inglés`})]}),(0,U.jsxs)(`div`,{className:`field`,children:[(0,U.jsx)(`label`,{children:`Seleccionar Cliente`}),(0,U.jsxs)(`select`,{value:o,onChange:e=>s(e.target.value),children:[(0,U.jsx)(`option`,{value:`Generico`,children:`Genérico (Por defecto)`}),(0,U.jsx)(`option`,{value:`Claro`,children:`Claro`}),(0,U.jsx)(`option`,{value:`Colgate`,children:`Colgate`}),(0,U.jsx)(`option`,{value:`KitchenAid`,children:`KitchenAid`}),(0,U.jsx)(`option`,{value:`Kraft`,children:`Kraft`}),(0,U.jsx)(`option`,{value:`Motorola`,children:`Motorola`}),(0,U.jsx)(`option`,{value:`Nestle`,children:`Nestle`}),(0,U.jsx)(`option`,{value:`P&G`,children:`P&G`}),(0,U.jsx)(`option`,{value:`Philip Morris`,children:`Philip Morris International`}),(0,U.jsx)(`option`,{value:`Whirlpool`,children:`Whirlpool`})]})]})]}),(0,U.jsx)(`div`,{className:`divider`}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsx)(`div`,{className:`panel-section-title`,children:`Código QR`}),(0,U.jsxs)(`div`,{className:`field`,children:[(0,U.jsx)(`label`,{children:`ID del empleado / Cédula`}),(0,U.jsx)(`input`,{type:`text`,placeholder:`Ej: 123456789 (Sin guiones ni espacios)`,value:c,onChange:se})]}),(0,U.jsx)(`button`,{className:`export-btn`,style:{background:`#6CC24A`,marginTop:`2px`},onClick:()=>Mc(c,E.current),children:`⟳ Generar QR`})]}),(0,U.jsx)(`div`,{className:`divider`}),(0,U.jsxs)(`div`,{className:`panel-section`,children:[(0,U.jsx)(`div`,{className:`panel-section-title`,children:`Exportar`}),(0,U.jsx)(`button`,{className:`export-btn blue`,disabled:g.processing||!y,onClick:ue,style:{opacity:!y||g.processing?.6:1},children:g.text})]})]}),(0,U.jsxs)(`div`,{className:`stage`,children:[(0,U.jsxs)(`div`,{className:`card-wrap`,children:[(0,U.jsx)(`div`,{className:`card-label`,children:`Frente`}),(0,U.jsxs)(`div`,{className:`card`,id:`cardFront`,style:{backgroundImage:`url('${ie}images/AF GLM Frente.png')`},children:[(0,U.jsxs)(`div`,{className:`front-photo-frame`,style:{position:`relative`,overflow:`hidden`},children:[u?(0,U.jsx)(`img`,{src:u,alt:`Foto Colaborador`,style:{width:`100%`,height:`100%`,objectFit:`cover`,display:`block`}}):null,m&&(0,U.jsx)(`div`,{style:{position:`absolute`,inset:0,display:`flex`,alignItems:`center`,justifyContent:`center`,background:`rgba(0,0,0,0.45)`,color:`#fff`,fontSize:`13px`,fontWeight:`600`,textAlign:`center`,padding:`8px`},children:`⏳ Editando foto con IA...`}),!u&&(0,U.jsxs)(`svg`,{className:`placeholder-svg`,viewBox:`0 0 28 28`,fill:`none`,style:{width:`60%`,height:`60%`,opacity:.4},children:[(0,U.jsx)(`circle`,{cx:`14`,cy:`10`,r:`5.5`,stroke:`currentColor`,strokeWidth:`1.5`}),(0,U.jsx)(`path`,{d:`M3 24c0-6 22-6 22 0`,stroke:`currentColor`,strokeWidth:`1.5`})]})]}),(0,U.jsx)(`div`,{className:`front-dynamic-name`,children:e?e.toUpperCase():`NOMBRE APELLIDO`}),(0,U.jsx)(`div`,{className:`front-dynamic-role`,children:n?n.toUpperCase():`PUESTO`})]})]}),(0,U.jsxs)(`div`,{className:`card-wrap`,children:[(0,U.jsx)(`div`,{className:`card-label`,children:`Reverso`}),(0,U.jsx)(`div`,{className:`card`,id:`cardBack`,style:{backgroundImage:`url('${ie}${(Cc[i]||Cc.Esp)[o]||(Cc[i]||Cc.Esp).Generico}')`},children:(0,U.jsx)(`div`,{className:`back-qr-zone`,children:(0,U.jsx)(`canvas`,{ref:E,width:55,height:55})})})]})]})]})]})}var Rc=(0,_.createContext)(null),zc=()=>(0,_.useContext)(Rc),Bc=`@gomezleemarketing.com`,Vc=`https://dbit.digitalcompass.agency/storage/v1/object/public/public-assets/GLM_completo.png`;function Hc({children:e}){let[t,n]=(0,_.useState)(null),[r,i]=(0,_.useState)(!0);return(0,_.useEffect)(()=>{if(!vc){i(!1);return}vc.auth.getSession().then(({data:{session:e}})=>{n(e?.user??null),i(!1)});let{data:{subscription:e}}=vc.auth.onAuthStateChange((e,t)=>{n(t?.user??null),i(!1)});return()=>e.unsubscribe()},[]),r?(0,U.jsx)(`div`,{style:{minHeight:`100vh`,display:`flex`,alignItems:`center`,justifyContent:`center`,background:`#EEF6E8`,fontFamily:`Arial, sans-serif`},children:(0,U.jsx)(`div`,{style:{width:40,height:40,border:`3px solid #D0D0D0`,borderTopColor:`#6CC24A`,borderRadius:`50%`,animation:`spin 0.8s linear infinite`}})}):(0,U.jsx)(Rc.Provider,{value:{user:t,signOut:async()=>{vc&&await vc.auth.signOut()},loading:r},children:e})}function Uc({children:e}){let{user:t,signOut:n,loading:r}=zc(),i=A();return r?null:t?t.email?.endsWith(Bc)?e:(n(),(0,U.jsxs)(`div`,{style:{minHeight:`100vh`,display:`flex`,flexDirection:`column`,alignItems:`center`,justifyContent:`center`,background:`#EEF6E8`,fontFamily:`Arial, sans-serif`,padding:`20px`,textAlign:`center`},children:[(0,U.jsx)(`img`,{src:Vc,alt:`GLM`,style:{maxWidth:220,marginBottom:24}}),(0,U.jsx)(`h1`,{style:{color:`#4F758B`,fontSize:24,fontWeight:700,marginBottom:16},children:`Acceso no autorizado`}),(0,U.jsxs)(`p`,{style:{color:`#6B8FA3`,fontSize:16,marginBottom:24,maxWidth:400},children:[`Solo se permite acceso con cuentas corporativas `,(0,U.jsx)(`strong`,{children:`@gomezleemarketing.com`}),`. Tu cuenta `,(0,U.jsx)(`strong`,{children:t.email}),` no tiene permisos.`]}),(0,U.jsx)(`button`,{onClick:n,style:{padding:`14px 32px`,fontSize:15,fontWeight:600,fontFamily:`Arial`,color:`#fff`,background:`#4F758B`,border:`none`,borderRadius:10,cursor:`pointer`},children:`Cerrar sesión y volver a intentar`})]})):(0,U.jsx)(Ht,{to:`/empleado-id/login`,state:{from:i},replace:!0})}function Wc({children:e}){let{user:t,loading:n}=zc(),r=A();return n?null:t?.email?.endsWith(Bc)?(0,U.jsx)(Ht,{to:r.state?.from?.pathname||`/empleado-id/`,replace:!0}):e}function Gc(){return(0,U.jsx)(Hc,{children:(0,U.jsx)(Nn,{children:(0,U.jsxs)(Gt,{children:[(0,U.jsx)(Ut,{path:`/empleado-id/login`,element:(0,U.jsx)(Wc,{children:(0,U.jsx)(Sc,{})})}),(0,U.jsx)(Ut,{path:`/empleado-id/`,element:(0,U.jsx)(Uc,{children:(0,U.jsx)(W,{})})}),(0,U.jsx)(Ut,{path:`*`,element:(0,U.jsx)(Ht,{to:`/empleado-id/`,replace:!0})})]})})})}(0,v.createRoot)(document.getElementById(`root`)).render((0,U.jsx)(_.StrictMode,{children:(0,U.jsx)(Gc,{})})); \ No newline at end of file diff --git a/glm-card-generator/dist/index.html b/glm-card-generator/dist/index.html index 4095fb0..e4e42a6 100644 --- a/glm-card-generator/dist/index.html +++ b/glm-card-generator/dist/index.html @@ -5,7 +5,7 @@ glm-card-generator - + diff --git a/glm-card-generator/src/Generator.jsx b/glm-card-generator/src/Generator.jsx index 18ff259..da774ae 100644 --- a/glm-card-generator/src/Generator.jsx +++ b/glm-card-generator/src/Generator.jsx @@ -363,59 +363,77 @@ export default function IdCardGenerator() { }; const validateForm = () => { - if (!name.trim()) { alert("Debe ingresar el nombre."); return false; } - if (!role.trim()) { alert("Debe ingresar el puesto."); return false; } - if (!employeeId.trim()) { alert("Debe ingresar el ID del empleado."); return false; } - if (!photoFile) { alert("Debe subir la foto del colaborador."); return false; } - return true; - }; + if (!name.trim()) { alert("Debe ingresar el nombre."); return false; } + if (!role.trim()) { alert("Debe ingresar el puesto."); return false; } + if (!employeeId.trim()) { alert("Debe ingresar el ID del empleado."); return false; } + if (!photoFile) { alert("Debe subir la foto del colaborador."); return false; } + return true; + }; - return ( - <> -
-

GLM ID Card Generator

-

GomezLee Marketing · Carnet Corporativo CR80

-
+ return ( + <> +
+

GLM ID Card Generator

+

GomezLee Marketing · Carnet Corporativo CR80

+
-
- {/* FORMULARIO MASIVO EXCEL */} -
-
-
- Módulo de Lotes Automáticos -
+
+ {/* FORMULARIO MASIVO EXCEL */} +
+
+
+ Módulo de Lotes Automáticos +
-
-
- Carga Masiva de Colaboradores -
setShowTooltip(true)} - onMouseLeave={() => setShowTooltip(false)} - > - ? -
- - {showTooltip && ( -
- Formato de columnas requeridas en el Excel:
- nombre, puesto, cliente/proyecto, cedula, lenguaje, foto_url.
-
- )} +
+
+ Carga Masiva de Colaboradores +
setShowTooltip(true)} + onMouseLeave={() => setShowTooltip(false)} + > + ?
-
excelInputRef.current.click()}> + {showTooltip && ( +
+ Formato de columnas requeridas en el Excel:
+ nombre, puesto, cliente/proyecto, cedula, lenguaje, foto_url.
+
+ )} +
+ +
+ + +
excelInputRef.current.click()}> @@ -425,152 +443,153 @@ export default function IdCardGenerator() { Seleccionar Archivo Excel
- - {bulkStatusText && ( -
- {bulkStatusText} -
- )}
-
+ {bulkStatusText && ( +
+ {bulkStatusText} +
+ )} +
-
-
Exportar Lote
- +
+ +
+
Exportar Lote
+ +
+
+ + {/* FORMULARIO INDIVIDUAL */} +
+
+
+ Vista previa en tiempo real +
+ +
+
Colaborador
+
+ + setName(e.target.value)} /> +
+
+ + setRole(e.target.value)} /> +
+
!photoProcessing && fileInputRef.current.click()} style={{ opacity: photoProcessing ? 0.6 : 1, cursor: photoProcessing ? 'wait' : 'pointer' }}> + {photoProcessing ? '⏳ Procesando foto con IA...' : 'Subir foto del colaborador'} +
+ +
+ +
+ +
+
Cliente / Proyecto
+
+ + +
+
+ +
- {/* FORMULARIO INDIVIDUAL */} -
-
-
- Vista previa en tiempo real +
+ +
+
Código QR
+
+ +
+ +
-
-
Colaborador
-
- - setName(e.target.value)} /> +
+ +
+
Exportar
+ +
+
+ + {/* VISTA PREVIA */} +
+
+
Frente
+
+
+ {photoSrc ? ( + Foto Colaborador + ) : (null)} + {photoProcessing && ( +
+ ⏳ Editando foto con IA... +
+ )} + {!photoSrc && ( + + + + + )}
-
- - setRole(e.target.value)} /> -
-
!photoProcessing && fileInputRef.current.click()} style={{ opacity: photoProcessing ? 0.6 : 1, cursor: photoProcessing ? 'wait' : 'pointer' }}> - {photoProcessing ? '⏳ Procesando foto con IA...' : 'Subir foto del colaborador'} -
- -
- -
- -
-
Cliente / Proyecto
-
- - -
-
- - -
-
- -
- -
-
Código QR
-
- - -
- -
- -
- -
-
Exportar
- +
{name ? name.toUpperCase() : 'NOMBRE APELLIDO'}
+
{role ? role.toUpperCase() : 'PUESTO'}
- {/* VISTA PREVIA */} -
-
-
Frente
-
-
- {photoSrc ? ( - Foto Colaborador - ) : (null)} - {photoProcessing && ( -
- ⏳ Editando foto con IA... -
- )} - {!photoSrc && ( - - - - - )} -
-
{name ? name.toUpperCase() : 'NOMBRE APELLIDO'}
-
{role ? role.toUpperCase() : 'PUESTO'}
-
-
- -
-
Reverso
-
-
- -
+
+
Reverso
+
+
+
- - ); - } \ No newline at end of file +
+ + ); +} \ No newline at end of file