https://hiview.ai/assets/ContainerWorkflowSVG-Ct4plvSY.js

1import{j as t,m as l}from"./index-DetOtPnn.js";const r="M 85 240 Q 250 140 420 310",n=[{x:70,label:"Order"},{x:160,label:"Gate-in"},{x:250,label:"At sea"},{x:340,label:"Discharge"},{x:430,label:"Delivery"}],a=new Date,s=i=>{const e=new Date(a);return e.setDate(a.getDate()+i),e},x=s(30),o=s(32),c=x.toLocaleDateString("en-US",{month:"short",day:"numeric",year:"numeric"}).toUpperCase(),h=`ETA ${o.toLocaleDateString("en-US",{month:"short",day:"numeric"}).toUpperCase()}`,F=()=>t.jsx("div",{className:"relative w-full aspect-square max-w-lg mx-auto rounded-[28px] drop-shadow-[0_24px_48px_rgba(11,31,58,0.10)]",children:t.jsxs("svg",{viewBox:"0 0 500 500",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"w-full h-full",children:[t.jsxs("defs",{children:[t.jsx("clipPath",{id:"cwm-card",children:t.jsx("rect",{x:"30",y:"30",width:"440",height:"440",rx:"20"})}),t.jsx("pattern",{id:"cwm-waves",x:"0",y:"0",width:"100",height:"22",patternUnits:"userSpaceOnUse",children:t.jsx("path",{d:"M0 11 Q 25 1, 50 11 T 100 11",fill:"none",stroke:"#1597D4",strokeWidth:"1"})})]}),t.jsx("rect",{x:"30",y:"30",width:"440",height:"440",rx:"20",fill:"#FFFFFF",stroke:"#E2E8F0",strokeWidth:"1"}),t.jsxs("g",{clipPath:"url(#cwm-card)",children:[t.jsx("rect",{x:"30",y:"95",width:"440",height:"305",fill:"#EAF7FF"}),t.jsx("rect",{x:"30",y:"95",width:"440",height:"305",fill:"url(#cwm-waves)",opacity:"0.15"}

1),t.jsx("path",{d:"M 30 130 Q 90 115 105 190 T 60 300 L 30 320 Z",fill:"#FFFFFF",opacity:"0.9"}),t.jsx("path",{d:"M 470 140 Q 400 125 390 210 T 445 330 L 470 350 Z",fill:"#FFFFFF",opacity:"0.9"}),t.jsx("path",{d:"M 30 130 Q 90 115 105 190 T 60 300",fill:"none",stroke:"#BAE6FD",strokeWidth:"1.5",opacity:"0.6"}),t.jsx("path",{d:"M 470 140 Q 400 125 390 210 T 445 330",fill:"none",stroke:"#BAE6FD",strokeWidth:"1.5",opacity:"0.6"}),t.jsx("path",{d:r,stroke:"#0B1F3A",strokeOpacity:"0.22",strokeWidth:"2",strokeDasharray:"6 5"}),t.jsx("path",{d:"M 85 240 Q 165 197 232 178",stroke:"#1597D4",strokeWidth:"2.5",strokeLinecap:"round",children:t.jsx("animate",{attributeName:"stroke-dasharray",values:"0 300;300 0",dur:"3s",fill:"freeze"})}),t.jsx("circle",{cx:"85",cy:"240",r:"5.5",fill:"#0B1F3A"}),t.jsxs("circle",{cx:"85",cy:"240",r:"10",fill:"none",stroke:"#0B1F3A",strokeOpacity:"0.15",strokeWidth:"1.5",children:[t.jsx("animate",{attributeName:"r",values:"8;14;8",dur:"3s",repeatCount:"indefinite"}),t.jsx("animate",{attributeName:"stroke-opacity",values:"0.25;0;0.25",dur:"3s",repeatCount:"indefinite"})]}),t.jsx("rect",{x:"52",y:"254",width:"66",height:"20",rx:"10",fill:"#FFFFFF",stroke:"#E2E8F0"}),t.jsx("text",{x:"85",y:"268",textAnchor:"middle",fontSize:"10",fontWeight:"700",fill:"#0B1F3A",children:"Shanghai"}),t.jsx("text",{x:"85",y:"222",textAnchor:"middle",fontSize:"9",fontWeight:"600",fill:"#64748B",children:"ORIGIN"}),t.jsx("circle",{cx:"420",cy:"310",r:"5.5",fill:"#0B1F3A",opacity:"0.35"}),t.jsx("rect",{x:"382",y:"324",width:"76",height:"20",rx:"10",fill:"#FFFFFF",stroke:"#E2E8F0"}),t.jsx("text",{x:"420",y:"338",textAnchor:"middle",fontSize:"10",fontWeight:"700",fill:"#64748B",children:"Long Beach"}),t.jsx("text",{x:"420",y:"292",textAnchor:"middle",fontSize:"9",fontWeight:"600",fill:"#94A3B8",children:"DESTINATION"}),t.jsx("rect",{x:"336",y:"248",width:"86",height:"20",rx:"10",fill:"#FFFFFF",stroke:"#BAE6FD",strokeWidth:"1"}),t.jsx("circle",{cx:"348",cy:"258",r:"3",fill:"#1597D4"}),t.jsx("text",{x:"357",y:"262",fontSize:"9",fontWeight:"700",fill:"#1597D4",children:h}),t.jsxs("g",{transform:"translate(240, 172)",children:[t.jsx("circle",{r:"7",fill:"#EF4444",children:t.jsx("animate",{attributeName:"r",values:"6;12;6",dur:"2s",repeatCount:"indefinite"})}),t.jsxs("circle",{r:"7",fill:"#EF4444",opacity:"0.25",children:[t.jsx("animate",{attributeName:"r",values:"7;18;7",dur:"2s",repeatCount:"indefinite"}),t.jsx("animate",{attributeName:"opacity",values:"0.25;0;0.25",dur:"2s",repeatCount:"indefinite"})]})]}),t.jsxs(l.g,{initial:{opacity:0}

1,animate:{opacity:[0,1,1,0]},transition:{duration:4.5,times:[0,.15,.75,1],repeat:1/0,repeatDelay:1.5},children:[t.jsx("rect",{x:"172",y:"118",width:"158",height:"26",rx:"13",fill:"#FEF2F2",stroke:"#FECACA"}),t.jsx("circle",{cx:"187",cy:"131",r:"2.5",fill:"#EF4444",children:t.jsx("animate",{attributeName:"opacity",values:"1;0.3;1",dur:"1.5s",repeatCount:"indefinite"})}),t.jsx("text",{x:"197",y:"134.5",fontSize:"9",fontWeight:"600",letterSpacing:"0.4",fill:"#DC2626",children:"WEATHER DELAY +24H"})]}),t.jsxs("g",{children:[t.jsx("animateMotion",{dur:"11s",repeatCount:"indefinite",path:r,rotate:"auto"}),t.jsxs("g",{children:[t.jsx("animateTransform",{attributeName:"transform",type:"rotate",values:"-1.5;1.5;-1.5",dur:"3s",repeatCount:"indefinite",additive:"sum"}),t.jsx("path",{d:"M -24 -2 Q -34 -5 -44 -3",stroke:"#FFFFFF",strokeWidth:"2",strokeLinecap:"round",opacity:"0.8"}),t.jsx("path",{d:"M -24 3 Q -36 5 -46 4",stroke:"#FFFFFF",strokeWidth:"2",strokeLinecap:"round",opacity:"0.6"}),t.jsx("path",{d:"M -17 0 L 18 0 L 13 7 L -13 7 Z",fill:"#0B1F3A"}),t.jsx("rect",{x:"-13",y:"-7",width:"8",height:"7",rx:"1",fill:"#1597D4"}),t.jsx("rect",{x:"-3",y:"-7",width:"8",height:"7",rx:"1",fill:"#1597D4",opacity:"0.75"}),t.jsx("rect",{x:"7",y:"-5",width:"5",height:"5",rx:"1",fill:"#1597D4",opacity:"0.5"})]})]}),t.jsx("rect",{x:"330",y:"347",width:"128",height:"42",rx:"12",fill:"#0B1F3A"}),t.jsx("text",{x:"342",y:"364",fontSize:"6.5",fontWeight:"700",fill:"#94A3B8",letterSpacing:"0.8",children:"REQUIRED DELIVERY"}),t.jsx("text",{x:"342",y:"380",fontSize:"10",fontWeight:"700",fill:"#FFFFFF",children:c})]}),t.jsx("text",{x:"52",y:"60",fontSize:"12",fontWeight:"700",fill:"#0B1F3A",children:"Container MSKU 9283741"}),t.jsx("text",{x:"52",y:"77",fontSize:"10",fontWeight:"500",fill:"#64748B",children:"Transit: Shanghai → Long Beach"}),t.jsx("rect",{x:"374",y:"50",width:"76",height:"22",rx:"11",fill:"#EAF7FF"}),t.jsx("circle",{cx:"386",cy:"61",r:"3",fill:"#1597D4",children:t.jsx("animate",{attributeName:"opacity",values:"1;0.35;1",dur:"1.8s",repeatCount:"indefinite"})}),t.jsx("text",{x:"417",y:"65",textAnchor:"middle",fontSize:"10",fontWeight:"700",fill:"#1597D4",children:"IN TRANSIT"}),t.jsx("rect",{x:"70",y:"428",width:"360",height:"6",rx:"3",fill:"#E2E8F0"}),t.jsx("rect",{x:"70",y:"428",rx:"3",height:"6",fill:"#1597D4",width:"0",children:t.jsx("animate",{attributeName:"width",values:"0;150;150;360",keyTimes:"0;0.4;0.75;1",dur:"11s",repeatCount:"indefinite"})}),t.jsx("circle",{r:"5",fill:"#FFFFFF",stroke:"#1597D4",strokeWidth:"2.5",cy:"431",children:t.jsx("animate",{attributeName:"cx",values:"70;220;220;430",keyTimes:"0;0.4;0.75;1",dur:"11s",repeatCount:"indefinite"})}),n.map((i,e)=>t.jsxs("g",{children:[t.jsx("circle",{cx:i.x,cy:"431",r:"4.5",fill:e<=1?"#1597D4":"#CBD5E1",stroke:"#FFFFFF",strokeWidth:"2"}),t.jsx("text",{x:i.x,y:"456",textAnchor:"middle",fontSize:"10",fontWeight:e<=1?700:500,fill:e<=1?"#0B1F3A":"#94A3B8",children:i.label})]},e))]})});export{F as default};