https://zemangat.com/_next/static/chunks/4191-a8c07cf2e9cb2aa7.js?dpl=dpl_qPtf8FvYcXyZtfW8xvXeQ5rem95v

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[4191],{24191:(e,s,t)=>{t.d(s,{A:()=>u});var a=t(95155),l=t(12115),r=t(66766),i=t(40646),c=t(14186),m=t(69074),d=t(35169),n=t(4516),x=t(17580),o=t(84355),h=t(54416),p=t(57658);let g=[{id:"1",clientName:"PT. Beton Utama Lancar",address:"Jl. Sudirman No. 123, Jakarta",visitTime:"09:00 - 11:30",status:"Completed",employee:"Zara Tsania",employeePhoto:{src:"/_next/static/media/zara.d1111b61.webp",height:810,width:540,blurDataURL:"data:image/webp;base64,UklGRkwAAABXRUJQVlA4IEAAAADwAQCdASoFAAgAAkA4JZwCdEf/gegCtqAA/rgzY2hTnJylOWQcv52pHO8jKopLeP6otodwBA+QCuiB6oEgAAAA",blurWidth:5,blurHeight:8},duration:"2h 30m",photos:1,notes:"Equipment maintenance completed",priority:"High"},{id:"2",clientName:"MDM Group",address:"Jl. Thamrin No. 456, Jakarta",visitTime:"13:00 - 15:00",status:"In Progress",employee:"Heny Irawati",employeePhoto:{src:"/_next/static/media/heny.b5358d79.webp",height:810,width:540,blurDataURL:"data:image/webp;base64,UklGRk4AAABXRUJQVlA4IEIAAADQAQCdASoFAAgAAkA4JZQCw7D0oTlUXADLTZ09rQBjn/LJzoUeYSEh4obymOkFaDxJ267txlaqnAFV50HBUWiAAAA=",blurWidth:5,blurHeight:8},duration:"1h 45m",photos:1,notes:"System installation in progress",priority:"Medium"},{id:"3",clientName:"LNJ Corporation",address:"Jl. Gatot Subroto No. 789, Jakarta",visitTime:"10:30 - 12:00",status:"Scheduled",employee:"Jansen",employeePhoto:{src:"/_next/static/media/jansen.05b93493.webp",height:810,width:540,blurDataURL:"data:image/webp;base64,UklGRk4AAABXRUJQVlA4IEIAAACwAQCdASoFAAgAAkA4JYwCdAEOZ/HeAMyj1idu9BPSK7qEC2Z37DYuV3xr9366Qq6Der+O7hdbaaE5vKOClruwAAA=",blurWidth:5,blurHeight:8},duration:"-",photos:1,notes:"Scheduled",priority:"Low"}];function u(){let[e,s]=(0,l.useState)(null),[t,u]=(0,l.useState)("All"),[b,j]=(0,l.useState)(!1),[N,f]=(0,l.useState)(!1),w=e=>{switch(e){case"Completed":return"bg-green-100 text-green-800";case"In Progress":return"bg-blue-100 text-blue-800";case"Scheduled":return"bg-yellow-100 text-yellow-800";case"Overdue":return"bg-red-100 text-red-800";default:return"bg-gray-100 text-gray-800"}},y=e=>{switch(e){case"Completed":return(0,a.jsx)(i.A,{className:"w-4 h-4"});case"In Progress":case"Overdue":default:return(0,a.jsx)(c.A,{className:"w-4 h-4"});case"Scheduled":return(0,a.jsx)(m.A,{className:"w-4 h-4"})}},A="All"===t?g:g.filter(e=>e.status===t);return e?(0,a.jsxs)("div",{className:"w-full h-full bg-white rounded-xl shadow-lg border border-gray-200 flex flex-col overflow-hidden",children:[(0,a.jsx)("div",{className:"p-3 sm:p-4 border-b border-gray-200 bg-red-500 flex-shrink-0",children:(0,a.jsxs)("div",{className:"flex items-center justify-between",children:[(0,a.jsxs)("div",{className:"flex items-center space-x-2 sm:space-x-3",children:[(0,a.jsx)("button",{onClick:()=>s(null),className:"p-1 hover:bg-red-400 rounded transition-colors",children:(0,a.jsx)(d.A,{className:"w-4 h-4 sm:w-5 sm:h-5 text-white"})}),(0,a.jsxs)("div",{className:"flex items-center space-x-2",children:[(0,a.jsx)(n.A,{className:"w-4 h-4 sm:w-5 sm:h-5 text-white"}),(0,a.jsx)("h2",{className:"text-sm sm:text-lg font-semibold text-white",children:"Job Visit Tracking"})]})]}),(0,a.jsx)("div",{className:"text-white text-xs sm:text-sm hidden sm:block",children:new Date().toLocaleDateString("id-ID",{weekday:"long",year:"numeric",month:"long",day:"numeric"})})]})}),(0,a.jsxs)("div",{className:"flex-1 overflow-y-auto p-3 sm:p-6",children:[(0,a.jsxs)("div",{className:"mb-4 sm:mb-6",children:[(0,a.jsxs)("div",{className:"flex flex-col sm:flex-row sm:items-center gap-2 sm:gap-4 mb-3",children:[(0,a.jsx)("h3",{className:"text-lg sm:text-2xl font-bold text-gray-900",children:e.clientName}),(0,a.jsxs)("span",{className:"inline-flex items-center px-2 sm:px-3 py-1 rounded-full text-xs sm:text-sm font-medium ".concat(w(e.status)),children:[y(e.status),(0,a.jsx)("span",{className:"ml-1 sm:ml-2",children:e.status})]})]}),(0,a.jsxs)("div",{className:"flex flex-col sm:flex-row sm:items-center space-y-2 sm:space-y-0 sm:space-x-6 text-xs sm:text-sm",children:[(0,a.jsxs)("div",{className:"flex items-center space-x-2",children:[(0,a.jsx)(n.A,{className:"w-3 h-3 sm:w-4 sm:h-4 text-gray-500"}),(0,a.jsx)("span",{className:"text-gray-600 truncate",children:e.address})]}),(0,a.jsxs)("div",{className:"flex items-center space-x-2",children:[(0,a.jsx)(c.A,{className:"w-3 h-3 sm:w-4 sm:h-4 text-gray-500"}),(0,a.jsx)("span",{className:"text-gray-600",children:e.visitTime})]}),(0,a.jsxs)("div",{className:"flex items-center space-x-2",children:[(0,a.jsx)(x.A,{className:"w-3 h-3 sm:w-4 sm:h-4 text-gray-500"}),(0,a.jsx)("span",{className:"text-gray-600 truncate",children:e.employee})]})]})]}),(0,a.jsxs)("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6 mb-4 sm:mb-6",children:[(0,a.jsxs)("div",{className:"bg-gray-50 p-3 sm:p-6 rounded-lg",children:[(0,a.jsx)("h4",{className:"text-sm sm:text-lg font-semibold text-gray-900 mb-2 sm:mb-4",children:"Employee Selfie"}),(0,a.jsx)("div",{className:"flex justify-center",children:(0,a.jsx)(r.default,{src:e.employeePhoto,alt:"".concat(e.employee," selfie"),width:200,height:200,className:"max-w-full h-auto rounded-lg shadow-lg cursor-pointer hover:opacity-80 transition-opacity",onClick:()=>j(!0)})}),(0,a.jsx)("p",{className:"text-center text-xs sm:text-sm text-gray-600 mt-2 sm:mt-3",children:e.employee})]}),(0,a.jsxs)("div",{className:"bg-gray-50 p-3 sm:p-6 rounded-lg",children:[(0,a.jsx)("h4",{className:"text-sm sm:text-lg font-semibold text-gray-900 mb-2 sm:mb-4",children:"Location"}),(0,a.jsxs)("div",{className:"relative",children:[(0,a.jsx)(r.default,{src:p.A,alt:"Google Maps location",width:400,height:192,className:"w-full h-32 sm:h-48 rounded-lg object-cover border border-gray-200"}),(0,a.jsx)("div",{className:"absolute top-1 sm:top-2 right-1 sm:right-2 bg-white px-1 sm:px-2 py-0.5 

1sm:py-1 rounded text-xs text-gray-600 shadow-sm",children:"Google Maps"})]}),(0,a.jsx)("p",{className:"text-xs sm:text-sm text-gray-600 mt-2 sm:mt-3",children:e.address}),e.notes&&(0,a.jsxs)("div",{className:"mt-3 sm:mt-4 pt-3 sm:pt-4 border-t border-gray-200",children:[(0,a.jsx)("h4",{className:"text-sm sm:text-lg font-semibold text-gray-900 mb-2 sm:mb-3",children:"Notes"}),(0,a.jsx)("p",{className:"text-gray-700",children:e.notes})]})]})]}),(0,a.jsxs)("div",{className:"flex space-x-4",children:[(0,a.jsxs)("button",{className:"flex-1 py-3 px-6 bg-green-500 hover:bg-green-600 text-white rounded-lg font-medium transition-colors",children:[(0,a.jsx)(i.A,{className:"w-5 h-5 inline mr-2"}),"Validate"]}),(0,a.jsxs)("button",{className:"flex-1 py-3 px-6 bg-red-500 hover:bg-red-600 text-white rounded-lg font-medium transition-colors",children:[(0,a.jsx)(c.A,{className:"w-5 h-5 inline mr-2"}),"Not Valid"]})]})]})]}):(0,a.jsxs)("div",{className:"w-full h-full bg-white rounded-xl shadow-lg border border-gray-200 flex flex-col overflow-hidden",children:[(0,a.jsx)("div",{className:"p-3 sm:p-4 border-b border-gray-200 bg-red-500",children:(0,a.jsxs)("div",{className:"flex items-center justify-between",children:[(0,a.jsxs)("div",{className:"flex items-center space-x-2",children:[(0,a.jsx)(n.A,{className:"w-4 h-4 sm:w-5 sm:h-5 text-white"}),(0,a.jsx)("h2",{className:"text-sm sm:text-lg font-semibold text-white",children:"Job Visit Tracking"})]}),(0,a.jsx)("div",{className:"text-white text-xs sm:text-sm hidden sm:block",children:new Date().toLocaleDateString("id-ID",{weekday:"long",year:"numeric",month:"long",day:"numeric"})})]})}),(0,a.jsxs)("div",{className:"flex-1 flex flex-col overflow-hidden",children:[(0,a.jsx)("div",{className:"p-2 sm:p-4 border-b border-gray-200",children:(0,a.jsx)("div",{className:"flex space-x-1 sm:space-x-2 overflow-x-auto",children:["All","Completed","In Progress","Scheduled","Overdue"].map(e=>(0,a.jsx)("button",{onClick:()=>u(e),className:"px-2 sm:px-3 py-1 rounded-full text-xs font-medium transition-colors whitespace-nowrap ".concat(t===e?"bg-red-500 text-white":"bg-gray-100 text-gray-600 hover:bg-red-100 hover:text-red-600"),children:e},e))})}),(0,a.jsx)("div",{className:"flex-1 overflow-y-auto p-2 sm:p-4",children:(0,a.jsx)("div",{className:"space-y-2 sm:space-y-3",children:A.map(e=>(0,a.jsx)("div",{onClick:()=>s(e),className:"p-2 sm:p-4 border border-gray-200 rounded-lg cursor-pointer transition-all duration-200 hover:border-red-300 hover:shadow-sm",children:(0,a.jsxs)("div",{className:"flex items-start gap-2 sm:gap-3",children:[(0,a.jsx)("div",{className:"flex-shrink-0 w-12 h-12 sm:w-16 sm:h-16 rounded-lg border border-gray-200 overflow-hidden bg-gray-100 flex items-center justify-center",children:(0,a.jsx)(r.default,{src:e.employeePhoto,alt:"".concat(e.employee," thumbnail"),width:48,height:48,className:"w-full h-full object-cover"})}),(0,a.jsxs)("div",{className:"flex-1 min-w-0",children:[(0,a.jsx)("div",{className:"flex items-center space-x-2 mb-1 sm:mb-2",children:(0,a.jsx)("h3",{className:"text-xs sm:text-sm font-semibold text-gray-900 truncate",children:e.clientName})}),(0,a.jsx)("div",{className:"flex items-center space-x-2 sm:space-x-4 text-xs text-gray-500 mb-1 sm:mb-2",children:(0,a.jsxs)("span",{className:"flex items-center space-x-1",children:[(0,a.jsx)(n.A,{className:"w-3 h-3"}),(0,a.jsx)("span",{className:"truncate text-xs",children:e.address})]})}),(0,a.jsxs)("div",{className:"flex flex-col sm:flex-row sm:items-center space-y-1 sm:space-y-0 sm:space-x-4 text-xs text-gray-500",children:[(0,a.jsxs)("span",{className:"flex items-center space-x-1",children:[(0,a.jsx)(c.A,{className:"w-3 h-3"}),(0,a.jsx)("span",{children:e.visitTime})]}),(0,a.jsxs)("span",{className:"flex items-center space-x-1",children:[(0,a.jsx)(x.A,{className:"w-3 h-3"}),(0,a.jsx)("span",{className:"truncate",children:e.employee})]})]})]}),(0,a.jsxs)("div",{className:"flex flex-col items-end space-y-1",children:[(0,a.jsxs)("span",{className:"inline-flex items-center px-1.5 sm:px-2 py-0.5 sm:py-1 rounded-full text-xs font-medium ".concat(w(e.status)),children:[y(e.status),(0,a.jsx)("span",{className:"ml-1 hidden sm:inline",children:e.status})]}),e.photos>0&&(0,a.jsxs)("span",{className:"flex items-center space-x-1 text-xs text-gray-500",children:[(0,a.jsx)(o.A,{className:"w-3 h-3"}),(0,a.jsx)("span",{children:e.photos})]})]})]})},e.id))})})]}),b&&e&&(0,a.jsx)("div",{className:"fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50 p-4",children:(0,a.jsxs)("div",{className:"relative max-w-4xl max-h-full",children:[(0,a.jsx)("button",{onClick:()=>j(!1),className:"absolute -top-4 -right-4 bg-white rounded-full p-2 shadow-lg hover:bg-gray-100 transition-colors z-10",children:(0,a.jsx)(h.A,{className:"w-6 h-6 text-gray-600"})}),(0,a.jsxs)("div",{className:"bg-white rounded-lg overflow-hidden",children:[(0,a.jsx)(r.default,{src:e.employeePhoto,alt:"".concat(e.employee," selfie - Full View"),width:800,height:600,className:"max-w-full max-h-[80vh] object-contain"}),(0,a.jsxs)("div",{className:"p-4 bg-gray-50",children:[(0,a.jsx)("p",{className:"text-center text-lg font-semibold text-gray-900",children:e.employee}),(0,a.jsx)("p",{className:"text-center text-sm text-gray-600",children:"Employee Selfie"})]})]})]})})]})}}}]);