https://www.carmandi.pk/_next/static/chunks/6402.9641d23d0de478c9.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6402],{76402:function(e,t,a){a.r(t);var r=a(57437),s=a(2265),l=a(33145);t.default=e=>{let{inspectionData:t,openLightbox:a,isMobile:o}=e,[n,c]=(0,s.useState)(!1),[i,d]=(0,s.useState)(null),[x,m]=(0,s.useState)(null),h=(0,s.useMemo)(()=>{let e=[];return["bonnet","roof","front_bumper","rear_bumper","trunk_condition","front_left_fender","front_right_fender","rear_left_fender","rear_right_fender","front_left_door","front_right_door","rear_left_door","rear_right_door","left_foot_board","right_foot_board","rear_left_quarter","rear_right_quarter"].forEach(a=>{let r=t[a];Array.isArray(r)&&r.forEach(t=>{if(!t||"object"!=typeof t)return;let r=Number(t.x),s=Number(t.y);if(Number.isFinite(r)&&Number.isFinite(s)){let l="string"==typeof t.code?t.code.trim():"",o=("string"==typeof t.desc?t.desc:"string"==typeof t.description?t.description:"string"==typeof t.label?t.label:"").trim();e.push({x:r,y:s,code:l,desc:o,image:"string"==typeof t.image?t.image:"",part:a})}})}),e},[t]),f=new Set(["A1","B1","U1"]),u=n?h:h.filter(e=>!f.has(String(e.code).toUpperCase())),p=e=>e.split("_").map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(" "),g=e=>{let t=[];return t.push(e.image),Array.isArray(e.images)&&t.push(...e.images),t.push(e.photo,e.url,e.src),t.map(e=>"string"==typeof e?e.trim():"").filter(e=>e.length>0)},b=(e,t)=>{let a=e.x<.22?"left-0 translate-x-0":e.x>.78?"right-0 translate-x-0":"left-1/2 -translate-x-1/2",r=e.y<(t?.24:.2);return{horizontal:a,vertical:r?"top-full mt-2":"bottom-full mb-3",arrow:r?"absolute bottom-full left-1/2 -translate-x-1/2 -mb-1 border-4 border-transparent border-b-white":"absolute top-full left-1/2 -translate-x-1/2 -mt-1 border-4 border-transparent border-t-white"}},w=e=>{let t=g(e);0!==t.length&&a([t[0]])},j=e=>{let t=String(e||"").trim().toUpperCase();return"P"===t||t.startsWith("P")},N={A1:"Small Scratch",UI:"Small Dent",P:"Paint marked",A3:"Big Scratch",B2:"Dent with scratch (size like flat of the hand)"},y=(0,s.useMemo)(()=>{let e=new Map;h.forEach(t=>{let a=String(t.code||"").trim(),r=String(t.desc||"").trim();if(!a)return;let s=r||N[a.toUpperCase()]||"Not specified";e.set(a,s)});let t=Array.from(e.entries()).map(e=>{let[t,a]=e;return{code:t,desc:a}}).sort((e,t)=>e.code.localeCompare(t.code));return t.length>0?t:[{code:"A1",desc:"Small Scratch"},{code:"UI",desc:"Small Dent"},{code:"P",desc:"Paint marked"},{code:"A3",desc:"Big Scratch"},{code:"B2",desc:"Dent with scratch (size like flat of the hand)"}]},[h]);return o?(0,r.jsx)("div",{className:"bg-white",children:(0,r.jsxs)("div",{className:"flex flex-col items-center",children:[(0,r.jsxs)("div",{className:"relative w-full max-w-[320px] aspect-[828/1179] mb-8",children:[(0,r.jsx)(l.default,{src:"https://carmandi.s3.eu-north-1.amazonaws.com/uploads/layout-2.jpeg",alt:"Car Layout",fill:!0,className:"object-contain"}),u.map((e,t)=>(0,r.jsxs)("div",{className:"absolute ".concat(j(e.code)?"w-3 h-3 text-[6px]":"w-4 h-4 text-[7px]"," rounded-full ").concat(j(e.code)?"bg-[#E84832]":"bg-[#136BCF]"," text-white font-bold flex items-center justify-center cursor-pointer transform -translate-x-1/2 -translate-y-1/2 shadow-md ring-1 ring-white ").concat(x===t?"z-50":"z-10"),style:{left:"".concat(100*e.x,"%"),top:"".concat(100*e.y,"%")},onClick:()=>m(x===t?null:t),children:[e.code,x===t&&(0,r.jsxs)("div",{className:"absolute z-30 w-[168px] rounded-xl bg-white p-2 shadow-xl border border-gray-100 ".concat(b(e,!0).vertical," ").concat(b(e,!0).horizontal),children:[(0,r.jsxs)("button",{type:"button",className:"block w-full text-left",onClick:t=>{t.stopPropagation(),w(e),m(null)},children:[g(e)[0]&&(0,r.jsx)("div",{className:"relative w-full aspect-video mb-1.5 rounded-lg overflow-hidden bg-gray-100",children:(0,r.jsx)(l.default,{src:g(e)[0],alt:"Damage detail",fill:!0,className:"object-cover"})}),(0,r.jsx)("p",{className:"text-[11px] leading-tight font-semibold text-[#136BCF]",children:"".concat(e.code," : ").concat(e.desc)}),(0,r.jsx)("p",{className:"mt-0.5 text-[11px] leading-tight text-gray-700",children:p(e.part)})]}),(0,r.jsx)("div",{className:b(e,!0).arrow})]})]},t)),(0,r.jsxs)("div",{className:"absolute -bottom-4 right-0 flex items-center gap-2 bg-white px-3 py-1.5 rounded-full shadow-md border border-gray-100 z-20",children:[(0,r.jsx)("span",{className:"text-[10px] font-bold text-gray-600 uppercase",children:"Minor"}),(0,r.jsx)("button",{onClick:()=>c(!n),className:"w-8 h-4 rounded-full p-0.5 transition-colors duration-300 ".concat(n?"bg-[#136BCF]":"bg-gray-200"),children:(0,r.jsx)("div",{className:"w-3 h-3 rounded-full bg-white shadow-sm transition-transform duration-300 ".concat(n?"translate-x-4":"translate-x-0")})})]})]}),(0,r.jsxs)("div",{className:"w-full bg-gray-50 rounded-2xl p-4 mt-4",children:[(0,r.jsx)("h4",{className:"font-bold text-gray-900 text-sm mb-3",children:"Legends"}),(0,r.jsx)("div",{className:"grid grid-cols-2 gap-x-4 gap-y-2",children:y.map((e,t)=>(0,r.jsxs)("div",{className:"flex items-center gap-2 text-[11px]",children:[(0,r.jsx)("span",{className:"font-bold text-[#136BCF] w-5",children:e.code}),(0,r.jsx)("span",{className:"text-gray-600 truncate",children:e.desc})]},t))})]})]})}):(0,r.jsx)("div",{className:"bg-white rounded-2xl shadow-sm border border-gray-100 mt-8 overflow-visible",children:(0,r.jsxs)("div",{className:"flex flex-col lg:flex-row",children:[(0,r.jsxs)("div",{className:"p-8 lg:p-10 lg:w-[40%] flex flex-col",children:[(0,r.jsxs)("div",{className:"mb-12",children:[(0,r.jsx)("h3",{className:"text-2xl font-bold text-gray-900 mb-2",children:"Exterior Condition"}),(0,r.jsx)("p",{className:"text-sm text-gray-500 font-medium",children:"Click or tap on the number(s) to see defect details"})]}),(0,r.jsxs)("div",{className:"flex-1",children:[(0,r.jsx)("h4",{className:"font-bold text-gray-900 text-lg mb-6",children:"Legends"}),(0,r.jsx)("div",{className:"space-y-4",children:y.map((e,t)=>(0,r.jsxs)("div",{className:"flex items-baseline gap-3 text-sm",children:[(0,r.jsxs)("span",{className:"font-bold text-gray-900 w-8 shrink-0",children:[e.code,":"]}),(0,r.jsx)("span",{className:"text-gray-600 font-medium",children:e.desc})]},t))})]})]}),(0,r.jsxs)("div",{className:"flex-1 relative bg-white p-4 lg:p-8 flex items-center justify-center min-h-[550px] lg:border-l lg:border-gray-100/50",children:[(0,r.jsxs)("div",{className:"relative w-full max-w-[380px] aspect-[828/1179] mt-[-2rem]",children:[(0,r.jsx)(l.default,{src:"https://carmandi.s3.eu-north-1.amazonaws.com/uploads/layout-2.jpeg",alt:"Car Layout",fill:!0,className:"object-contain"}),u.map((e,t)=>(0,r.jsxs)("div",{className:"absolute ".concat(j(e.code)?"w-3.5 h-3.5 text-[7.5px]":"w-5 h-5 text-[9px]"," rounded-full ").concat(j(e.code)?"bg-[#E84832]":"bg-[#136BCF]"," text-white font-bold flex items-center justify-center cursor-pointer transform -translate-x-1/2 -translate-y-1/2 shadow-lg hover:scale-110 transition-transform ring-2 ring-white ").concat(i===t?"z-50":"z-10"),style:{left:"".concat(100*e.x,"%"),top:"".concat(100*e.y,"%")},onMouseEnter:()=>d(t),onMouseLeave:()=>d(null),onClick:()=>w(e),children:[e.code,i===t&&(0,r.jsxs)("div",{className:"absolute w-40 bg-white p-2 rounded-xl shadow-xl text-center z-50 ".concat(b(e,!1).vertical," ").concat(b(e,!1).horizontal),children:[(0,r.jsxs)("button",{type:"button",className:"block w-full text-left",onClick:t=>{t.stopPropagation(),w(e)},children:[g(e)[0]&&(0,r.jsx)("div",{className:"relative w-full aspect-video mb-2 rounded-lg overflow-hidden bg-gray-100",children:(0,r.jsx)(l.default,{src:g(e)[0],alt:"Damage",f

1ill:!0,className:"object-cover"})}),(0,r.jsx)("p",{className:"text-[#136BCF] text-xs font-bold px-1 text-center",children:"".concat(e.code," : ").concat(e.desc)}),(0,r.jsx)("p",{className:"text-gray-700 text-xs px-1 text-center mt-0.5",children:p(e.part)})]}),(0,r.jsx)("div",{className:b(e,!1).arrow})]})]},t))]}),(0,r.jsxs)("div",{className:"absolute bottom-8 right-6 flex items-center gap-3 bg-white px-4 py-2 rounded-full shadow-lg border border-gray-100 z-20",children:[(0,r.jsx)("span",{className:"text-xs font-semibold text-gray-700",children:"Show Minor"}),(0,r.jsx)("button",{onClick:()=>c(!n),className:"w-10 h-5 rounded-full p-0.5 transition-colors duration-300 ".concat(n?"bg-[#136BCF]":"bg-gray-200"),children:(0,r.jsx)("div",{className:"w-4 h-4 rounded-full bg-white shadow-sm transition-transform duration-300 ".concat(n?"translate-x-5":"translate-x-0")})})]})]})]})})}}}]);