zhihao-ui 1.3.21 → 1.3.23

package/dist/es/{Map-Bs3yh61N.js → Map-CRPS0mWA.js}

@@ -6,14 +6,14 @@ const _hoisted_1$2 = { id: "scale-line-container" }, _sfc_main$2 = /* @__PURE__
   __name: "scaleLine",
   setup(e, { expose: l }) {
     return l({
-      setScaleLine: (s, c) => {
-        c || (c = "metric");
+      setScaleLine: (s, i) => {
+        i || (i = "metric");
         const t = new ScaleLine$1({
-          units: c
-        }), L = document.getElementById("scale-line-container");
-        L && (t.setTarget(L), s.addControl(t));
+          units: i
+        }), f = document.getElementById("scale-line-container");
+        f && (t.setTarget(f), s.addControl(t));
       }
-    }), (s, c) => (openBlock(), createElementBlock("div", _hoisted_1$2));
+    }), (s, i) => (openBlock(), createElementBlock("div", _hoisted_1$2));
   }
 }), ScaleLine = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-2bc5dee8"]]), _hoisted_1$1 = { class: "zoom" }, _sfc_main$1 = /* @__PURE__ */ defineComponent({
   __name: "zoomControl",
@@ -28,17 +28,17 @@ const _hoisted_1$2 = { id: "scale-line-container" }, _sfc_main$2 = /* @__PURE__
     console.log("props", l);
     const n = () => {
       console.log("props");
-      const { setZoom: c, getZoom: t, getInstall: L } = l.mapInstance.methods;
-      if (!L()) return;
+      const { setZoom: i, getZoom: t, getInstall: f } = l.mapInstance.methods;
+      if (!f()) return;
       const o = t();
-      o && c(o + 1);
+      o && i(o + 1);
     }, s = () => {
-      const { setZoom: c, getZoom: t, getInstall: L } = l.mapInstance.methods;
-      if (!L()) return;
+      const { setZoom: i, getZoom: t, getInstall: f } = l.mapInstance.methods;
+      if (!f()) return;
       const o = t();
-      o && c(o - 1);
+      o && i(o - 1);
     };
-    return (c, t) => (openBlock(), createElementBlock("div", _hoisted_1$1, [
+    return (i, t) => (openBlock(), createElementBlock("div", _hoisted_1$1, [
       createElementVNode("div", {
         class: "button big-button",
         onClick: n
@@ -73,33 +73,33 @@ const _hoisted_1$2 = { id: "scale-line-container" }, _sfc_main$2 = /* @__PURE__
 var BASE_MAP_LINK = ((e) => (e.vectorTile = `https://t0.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&TILEMATRIXSET=w&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${TIAN_DI_TU_KEY}`, e.vectorTileMark = `https://t0.tianditu.gov.cn/cva_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&TILEMATRIXSET=w&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${TIAN_DI_TU_KEY}`, e.satelliteImgTile = `https://t0.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&TILEMATRIXSET=w&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${TIAN_DI_TU_KEY}`, e.satelliteImgTileMark = `https://t0.tianditu.gov.cn/cia_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&TILEMATRIXSET=w&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=${TIAN_DI_TU_KEY}`, e.greenTile = `${CDN_URL}/map/tile/{z}/{x}/{y}.png`, e))(BASE_MAP_LINK || {}), LENGTH_UNIT = /* @__PURE__ */ ((e) => (e[e.M = 1] = "M", e[e.KM = 2] = "KM", e[e.NM = 3] = "NM", e))(LENGTH_UNIT || {});
 function useMapInitializer() {
   const e = ref(), l = () => e.value, n = () => l().getView(), s = () => {
-    var y;
-    return (y = n()) == null ? void 0 : y.getZoom();
-  }, c = (y) => {
-    var N;
-    (N = n()) == null || N.setZoom(y);
-  }, t = (y, N) => {
+    var m;
+    return (m = n()) == null ? void 0 : m.getZoom();
+  }, i = (m) => {
+    var F;
+    (F = n()) == null || F.setZoom(m);
+  }, t = (m, F) => {
     var $;
-    ($ = n()) == null || $.setCenter(fromLonLat([y, N]));
-  }, L = () => {
-    var N;
-    const y = (N = n()) == null ? void 0 : N.getCenter();
-    return toLonLat(y);
-  }, m = () => {
-    var y;
-    return (y = l()) == null ? void 0 : y.getSize();
-  }, o = new Map$2(), r = (y, N) => {
-    p(N);
+    ($ = n()) == null || $.setCenter(fromLonLat([m, F]));
+  }, f = () => {
+    var F;
+    const m = (F = n()) == null ? void 0 : F.getCenter();
+    return toLonLat(m);
+  }, v = () => {
+    var m;
+    return (m = l()) == null ? void 0 : m.getSize();
+  }, o = new Map$2(), r = (m, F) => {
+    L(F);
     const $ = {
-      zoom: N.zoom,
-      center: fromLonLat(N.center),
+      zoom: F.zoom,
+      center: fromLonLat(F.center),
       minZoom: MAP_ZOOM.min,
       maxZoom: MAP_ZOOM.max,
       constrainResolution: !0,
       enableRotation: !1,
       multiWorld: !0
-    }, f = new Map$2({
-      target: y,
+    }, y = new Map$2({
+      target: m,
       controls: defaults({
         zoom: !1
       }),
@@ -111,35 +111,35 @@ function useMapInitializer() {
       ],
       view: new View($)
     });
-    e.value = f;
-  }, p = (y) => {
+    e.value = y;
+  }, L = (m) => {
     o.set("vectorTile", new TileLayer({
       source: new XYZ({ url: BASE_MAP_LINK.vectorTile }),
-      visible: y.layerType === "vector",
+      visible: m.layerType === "vector",
       zIndex: 0,
       preload: 1,
       className: "vector"
     })), o.set("vectorTileMark", new TileLayer({
       source: new XYZ({ url: BASE_MAP_LINK.vectorTileMark }),
-      visible: y.layerType === "vector",
+      visible: m.layerType === "vector",
       zIndex: 1,
       preload: 1,
       className: "vector"
     })), o.set("satelliteImgTile", new TileLayer({
       source: new XYZ({ url: BASE_MAP_LINK.satelliteImgTile }),
-      visible: y.layerType === "satellite",
+      visible: m.layerType === "satellite",
       zIndex: 0,
       preload: 1,
       className: "satellite"
     })), o.set("satelliteImgTileMark", new TileLayer({
       source: new XYZ({ url: BASE_MAP_LINK.satelliteImgTileMark }),
-      visible: y.layerType === "satellite",
+      visible: m.layerType === "satellite",
       zIndex: 1,
       preload: 1,
       className: "satellite"
     })), o.set("greenMark", new TileLayer({
       source: new XYZ({ url: BASE_MAP_LINK.greenTile }),
-      visible: y.showGreenLayer,
+      visible: m.showGreenLayer,
       zIndex: 2,
       className: "greenTile"
     }));
@@ -148,24 +148,24 @@ function useMapInitializer() {
     getInstall: l,
     getView: n,
     getZoom: s,
-    setZoom: c,
+    setZoom: i,
     setCenter: t,
-    getCenter: L,
-    getSize: m,
+    getCenter: f,
+    getSize: v,
     initMap: r,
-    setBaseLayerMap: p
+    setBaseLayerMap: L
   };
 }
 const convertSixHundredThousandToLatLng = function(e, l) {
   const n = Number(l) / 6e5;
   return [Number(e) / 6e5, n];
 }, calculateCirclePoints = (e, l) => {
-  const n = fromLonLat(e), s = l * 1e3, c = [
+  const n = fromLonLat(e), s = l * 1e3, i = [
     n[0] - s,
     n[1] - s,
     n[0] + s,
     n[1] + s
-  ], t = transformExtent(c, projection.mercator, projection.data);
+  ], t = transformExtent(i, projection.mercator, projection.data);
   return {
     leftTopPoint: { lng: t[0], lat: t[3] },
     rightTopPoint: { lng: t[2], lat: t[3] },
@@ -174,19 +174,19 @@ const convertSixHundredThousandToLatLng = function(e, l) {
   };
 }, formatLength = function(e, l) {
   const s = getLength(e);
-  let c = "";
+  let i = "";
   switch (console.log(l, LENGTH_UNIT), l) {
     case LENGTH_UNIT.M:
-      c = Math.round(s * 100) / 100 + " m";
+      i = Math.round(s * 100) / 100 + " m";
       break;
     case LENGTH_UNIT.KM:
-      c = Math.round(s / 1e3 * 100) / 100 + " km";
+      i = Math.round(s / 1e3 * 100) / 100 + " km";
       break;
     case LENGTH_UNIT.NM:
-      c = (Math.round(s / 1e3 * 100) / 100 / 1.852).toFixed(2) + " nm";
+      i = (Math.round(s / 1e3 * 100) / 100 / 1.852).toFixed(2) + " nm";
       break;
   }
-  return c;
+  return i;
 };
 function lonLatToMercator(e) {
   const l = e[0] * equatorialCircumference / 180;
@@ -209,22 +209,22 @@ const getIconStyle = (e) => {
   });
 }, mercatorToLonLat = (e, l = "lonlat") => {
   const n = { lon: 0, lat: 0 }, s = e[0] / equatorialCircumference * 180;
-  let c = e[1] / equatorialCircumference * 180;
-  return c = 180 / Math.PI * (2 * Math.atan(Math.exp(c * Math.PI / 180)) - Math.PI / 2), n.lon = s, n.lat = c, l === "lonlat" ? n : [s, c];
+  let i = e[1] / equatorialCircumference * 180;
+  return i = 180 / Math.PI * (2 * Math.atan(Math.exp(i * Math.PI / 180)) - Math.PI / 2), n.lon = s, n.lat = i, l === "lonlat" ? n : [s, i];
 }, formatMinutesToDDHHMM = (e) => {
-  const l = hooks.duration(e, "minutes"), n = Math.floor(l.asDays()), s = l.hours(), c = l.minutes();
-  let t = `${String(c).padStart(2, "0")}分`;
+  const l = hooks.duration(e, "minutes"), n = Math.floor(l.asDays()), s = l.hours(), i = l.minutes();
+  let t = `${String(i).padStart(2, "0")}分`;
   return s !== 0 && (t = `${String(s).padStart(2, "0")}时${t}`), n !== 0 && (t = `${String(n).padStart(2, "0")}天${t}`), t;
 }, useCarTrackManager = (e, l) => {
   let n = null;
-  const s = async (p) => {
-    if (!e || (console.log("vehicleInfo", p), !(p != null && p.lon && (p != null && p.lat)))) return;
-    const y = Math.abs(Number(p.lon)) > 180 ? convertSixHundredThousandToLatLng(p.lon, p.lat) : [p.lon, p.lat];
-    c(p, fromLonLat(y));
-    const N = e == null ? void 0 : e.getView(), $ = new Point(y);
-    N.setCenter(transform($.getCoordinates(), projection.data, projection.mercator));
-  }, c = (p, y) => {
-    const N = `${CDN_URL}map/car-icon.gif`;
+  const s = async (L) => {
+    if (!e || (console.log("vehicleInfo", L), !(L != null && L.lon && (L != null && L.lat)))) return;
+    const m = Math.abs(Number(L.lon)) > 180 ? convertSixHundredThousandToLatLng(L.lon, L.lat) : [L.lon, L.lat];
+    i(L, fromLonLat(m));
+    const F = e == null ? void 0 : e.getView(), $ = new Point(m);
+    F.setCenter(transform($.getCoordinates(), projection.data, projection.mercator));
+  }, i = (L, m) => {
+    const F = `${CDN_URL}map/car-icon.gif`;
     n || (n = new Overlay({
       element: document.createElement("div"),
       positioning: "center-center",
@@ -232,27 +232,27 @@ const getIconStyle = (e) => {
       // 允许交互事件穿透
     }), e.addOverlay(n));
     const $ = n.getElement();
-    $.style.backgroundImage = `url(${N})`, $.style.width = "80px", $.style.height = "80px";
-    const f = (p == null ? void 0 : p.drc) || "";
-    $.style.transform = `rotate(${f}deg)`, $.style.backgroundSize = "cover", n == null || n.setPosition(y);
+    $.style.backgroundImage = `url(${F})`, $.style.width = "80px", $.style.height = "80px";
+    const y = (L == null ? void 0 : L.drc) || "";
+    $.style.transform = `rotate(${y}deg)`, $.style.backgroundSize = "cover", n == null || n.setPosition(m);
   };
   return {
     location: s,
     remove: () => {
-      const p = n == null ? void 0 : n.getElement();
-      p && (p.innerHTML = "");
+      const L = n == null ? void 0 : n.getElement();
+      L && (L.innerHTML = "");
     },
-    renderTrack: (p, y, N) => {
-      l.render(p, y, N, "truck", 1e3);
+    renderTrack: (L, m, F) => {
+      l.render(L, m, F, "truck", 1e3);
     },
-    setCenter: (p) => {
-      l.setCenter(p);
+    setCenter: (L) => {
+      l.setCenter(L);
     },
     closeTrack: () => {
       l.close();
     },
-    playTrack: (p, y) => {
-      l.play(p, y);
+    playTrack: (L, m) => {
+      l.play(L, m);
     }
   };
 };
@@ -260,30 +260,30 @@ var SHIP_SAIL_STATUS = /* @__PURE__ */ ((e) => (e[e.发动机使用中 = 0] = "
 const useTrackManager = (e) => {
   const l = /* @__PURE__ */ new Map(), n = {};
   let s = null;
-  const c = "--";
+  const i = "--";
   let t = null;
-  const L = document.createElement("div"), m = new Overlay({
-    element: L,
+  const f = document.createElement("div"), v = new Overlay({
+    element: f,
     positioning: "top-left",
     stopEvent: !1,
     className: "track-label-popup"
   });
-  let o, r, p, y, N, $ = !1, f = Date.now(), v, k = 0, x = null, C = 20, A = !1;
-  const H = 5, B = [], W = (i) => {
+  let o, r, L, m, F, $ = !1, y = Date.now(), w, k = 0, p = null, C = 20, A = !1;
+  const H = 5, B = [], W = (a) => {
     var u;
-    for (B.unshift(i); B.length > H; ) {
+    for (B.unshift(a); B.length > H; ) {
       const g = B.pop(), b = l.get(g);
       b && ((u = b.getSource()) == null || u.clear(), e == null || e.removeLayer(b), l.delete(g), delete n[g]);
     }
   };
   let d = "";
-  const w = ["#ff0000", "#00ff00", "#0079ff", "#ffa500", "#800080", "#008080", "#ffc0cb", "#800000", "#000080", "#808000"], a = debounce(() => {
+  const x = ["#ff0000", "#00ff00", "#0079ff", "#ffa500", "#800080", "#008080", "#ffc0cb", "#800000", "#000080", "#808000"], c = debounce(() => {
     if (s && n[s] && l.get(s).getVisible() && A) {
       console.log("reRenderTrackLine------------");
-      const i = cloneDeep(M(s, n[s]));
-      ae(s, i);
+      const a = cloneDeep(M(s, n[s]));
+      ce(s, a);
     }
-  }, 300), M = (i, u) => {
+  }, 300), M = (a, u) => {
     let g = [];
     const b = Math.max(1, Math.floor(u.length / C));
     return g = u.filter((T, _) => _ % b === 0).map((T, _) => {
@@ -291,107 +291,107 @@ const useTrackManager = (e) => {
         const [D, z] = convertSixHundredThousandToLatLng(T.lon, T.lat);
         T.lon = D, T.lat = z;
       }
-      return T.center = [T.lon, T.lat], T.centerPoint = lonLatToMercator(T.center), T.time = hooks(T.createdAt).format("YYYY-MM-DD HH:mm:ss"), T.id = i, T.index = _, T;
+      return T.center = [T.lon, T.lat], T.centerPoint = lonLatToMercator(T.center), T.time = hooks(T.createdAt).format("YYYY-MM-DD HH:mm:ss"), T.id = a, T.index = _, T;
     }), g;
-  }, F = async (i, u, g, b = "ship", E = 200) => {
-    if (!e || (u = u == null ? void 0 : u.reverse(), m && b === "ship" && (e != null && e.getOverlays().getArray().includes(m) || e.addOverlay(m)), (u == null ? void 0 : u.length) < 2))
+  }, N = async (a, u, g, b = "ship", E = 200) => {
+    if (!e || (u = u == null ? void 0 : u.reverse(), v && b === "ship" && (e != null && e.getOverlays().getArray().includes(v) || e.addOverlay(v)), (u == null ? void 0 : u.length) < 2))
       return;
-    W(i), s = i, n[i] = u, C = E;
-    const T = Object.keys(n).findIndex((_) => _ === i) || 0;
-    d = g || w[T > 10 ? 10 : T], A = !0, await R(), await se(s);
-  }, V = (i) => {
+    W(a), s = a, n[a] = u, C = E;
+    const T = Object.keys(n).findIndex((_) => _ === a) || 0;
+    d = g || x[T > 10 ? 10 : T], A = !0, await R(), await se(s);
+  }, V = (a) => {
     const u = new VectorSource();
     return new VectorLayer({
       source: u,
       visible: !1,
       // 默认隐藏
-      className: `track-layer-${i}`,
+      className: `track-layer-${a}`,
       renderBuffer: 1024
       // 增大渲染缓冲区
     });
-  }, O = (i) => {
+  }, O = (a) => {
     l.forEach((u, g) => {
       var E;
-      const b = g === i;
+      const b = g === a;
       u.getVisible() !== b && (u.setVisible(b), e.getLayers().getArray().includes(u) || e.addLayer(u), b || (E = u.getSource()) == null || E.clear());
-    }), s = i;
+    }), s = a;
   }, R = async () => {
-    const i = s;
-    if (!l.has(i)) {
-      const T = V(i);
-      l.set(i, T);
+    const a = s;
+    if (!l.has(a)) {
+      const T = V(a);
+      l.set(a, T);
     }
-    await O(i);
-    const u = d || "", g = n[i] || [];
+    await O(a);
+    const u = d || "", g = n[a] || [];
     if (!(g && g.length > 1)) return [];
     let b = [];
-    b = M(i, g);
+    b = M(a, g);
     const E = b.map((T) => T.centerPoint);
-    b.length >= 2 && await P(i, E, u);
-  }, P = (i, u, g) => {
-    const b = new LineString(u), E = l.get(i).getSource(), T = E.getFeatureById(i);
+    b.length >= 2 && await P(a, E, u);
+  }, P = (a, u, g) => {
+    const b = new LineString(u), E = l.get(a).getSource(), T = E.getFeatureById(a);
     if (T)
-      T.setGeometry(b), T.setId(i), T.setStyle(Z(g)), x = T;
+      T.setGeometry(b), T.setId(a), T.setStyle(Z(g)), p = T;
     else {
       const _ = new Feature({ geometry: b });
-      _.setId(i), _.set("type", "line"), _.setStyle(Z(g)), E.addFeature(_), x = _;
+      _.setId(a), _.set("type", "line"), _.setStyle(Z(g)), E.addFeature(_), p = _;
     }
-    return x;
-  }, Z = (i) => new Style({
+    return p;
+  }, Z = (a) => new Style({
     stroke: new Stroke({
-      color: i,
+      color: a,
       width: 2
     })
-  }), K = (i, u, g) => {
-    const b = i == null ? void 0 : i.get("trackId");
-    if (i && b && u === "hover") {
+  }), K = (a, u, g) => {
+    const b = a == null ? void 0 : a.get("trackId");
+    if (a && b && u === "hover") {
       e.getTargetElement().style.cursor = b ? "pointer" : "";
-      const E = i.get("data"), T = Q(E), _ = g == null ? void 0 : g.coordinate;
-      _ && (L.querySelector(".popup-content"), L.innerHTML = T, m == null || m.setPosition(_));
+      const E = a.get("data"), T = Q(E), _ = g == null ? void 0 : g.coordinate;
+      _ && (f.querySelector(".popup-content"), f.innerHTML = T, v == null || v.setPosition(_));
     } else
-      m && m.setPosition(void 0);
-  }, Q = (i) => {
-    if (!(i != null && i.time)) return;
+      v && v.setPosition(void 0);
+  }, Q = (a) => {
+    if (!(a != null && a.time)) return;
     let u = "";
-    return i != null && i.stayTime && (u = `
+    return a != null && a.stayTime && (u = `
             <div class="item w-100">
                 <div class="item-label">停泊时间约</div>
-                <div class="item-item">${formatMinutesToDDHHMM(Number(i.stayTime))}</div>
+                <div class="item-item">${formatMinutesToDDHHMM(Number(a.stayTime))}</div>
             </div>
         `), `
         <div class="track-point-popup">
             <div class="item">
                 <div class="item-label">状态</div>
-                <div class="item-item">${i != null && i.sailStatus ? SHIP_SAIL_STATUS[i.sailStatus] : c}</div>
+                <div class="item-item">${a != null && a.sailStatus ? SHIP_SAIL_STATUS[a.sailStatus] : i}</div>
             </div>
             <div class="item">
                 <div class="item-label">航速</div>
-                <div class="item-item">${i.speed || c}</div>
+                <div class="item-item">${a.speed || i}</div>
             </div>
             <div class="item">
                 <div class="item-label">艏向</div>
-                <div class="item-item">${i.hdg || c}</div>
+                <div class="item-item">${a.hdg || i}</div>
             </div>
             <div class="item">
                 <div class="item-label">航向</div>
-                <div class="item-item">${i.cog || c}</div>
+                <div class="item-item">${a.cog || i}</div>
             </div>
             <div class="item">
                 <div class="item-label">经度</div>
-                <div class="item-item">${i.lon || c}</div>
+                <div class="item-item">${a.lon || i}</div>
             </div>
             <div class="item">
                 <div class="item-label">纬度</div>
-                <div class="item-item">${i.lat || c}</div>
+                <div class="item-item">${a.lat || i}</div>
             </div>
             <div class="item w-100">
                 <div class="item-label">时间</div>
-                <div class="item-item">${i.time}</div>
+                <div class="item-item">${a.time}</div>
             </div>
             ${u ?? u}
         </div>`;
-  }, U = (i) => {
-    const g = i.map((D) => {
+  }, U = (a) => {
+    const g = a.map((D) => {
       const z = e.getPixelFromCoordinate(fromLonLat(D.center));
       return {
         ...D,
@@ -438,9 +438,9 @@ const useTrackManager = (e) => {
       distance: D.distance
     }));
   };
-  function J(i, u) {
-    for (let g = 1; g < i.length; g++) {
-      const b = i[g - 1], E = i[g];
+  function J(a, u) {
+    for (let g = 1; g < a.length; g++) {
+      const b = a[g - 1], E = a[g];
       if (u >= b.distance && u <= E.distance) {
         const T = (u - b.distance) / (E.distance - b.distance), _ = b.pixel[0] + T * (E.pixel[0] - b.pixel[0]), D = b.pixel[1] + T * (E.pixel[1] - b.pixel[1]), z = e == null ? void 0 : e.getCoordinateFromPixel([_, D]);
         return {
@@ -456,24 +456,24 @@ const useTrackManager = (e) => {
     }
     return null;
   }
-  const ae = async (i, u) => {
-    await le(), await ge(i);
+  const ce = async (a, u) => {
+    await le(), await ge(a);
     const g = U(u), b = g.map((T) => de(T));
-    l.get(i).getSource().addFeatures(b), me(i, g, u, d), g.forEach((T) => {
-      const _ = ue(i, d, T);
+    l.get(a).getSource().addFeatures(b), me(a, g, u, d), g.forEach((T) => {
+      const _ = ue(a, d, T);
       e.addOverlay(_);
     });
-  }, de = (i) => {
+  }, de = (a) => {
     const u = new Feature({
-      geometry: new Point(i.centerPoint),
-      data: i
+      geometry: new Point(a.centerPoint),
+      data: a
     });
-    u.set("type", "track_point"), u.set("trackId", i.id), u.set("data", i);
+    u.set("type", "track_point"), u.set("trackId", a.id), u.set("data", a);
     let g = [
-      ...fe(i, d)
+      ...fe(a, d)
     ];
-    return (i.index === 0 || i.index === n[i.id].length - 1) && (g = [...ve(i)], u.set("type", "track_begin")), i.state !== void 0 && i.state !== null && (g = [...ye(i)], u.set("type", "track_icon")), u.setStyle(g), u;
-  }, ue = (i, u, g) => {
+    return (a.index === 0 || a.index === n[a.id].length - 1) && (g = [...ve(a)], u.set("type", "track_begin")), a.state !== void 0 && a.state !== null && (g = [...ye(a)], u.set("type", "track_icon")), u.setStyle(g), u;
+  }, ue = (a, u, g) => {
     const b = document.createElement("div");
     b.className = "track-overlay-label", b.style.position = "relative", b.style.backgroundColor = "rgba(255,255,255,0.8)", b.style.border = `1px solid ${u}`, b.style.fontSize = "12px", b.innerHTML = `
         <span>${g.time}</span>
@@ -496,18 +496,18 @@ const useTrackManager = (e) => {
       stopEvent: !1,
       className: "track-label-time-overlay"
     });
-    return E.set("class", "track-label-overlay"), E.set("trackId", i), E;
+    return E.set("class", "track-label-overlay"), E.set("trackId", a), E;
   }, le = () => {
-    const i = e == null ? void 0 : e.getOverlays().getArray(), u = i == null ? void 0 : i.filter((g) => g.get("class") === "track-label-overlay");
+    const a = e == null ? void 0 : e.getOverlays().getArray(), u = a == null ? void 0 : a.filter((g) => g.get("class") === "track-label-overlay");
     u && u.length > 0 && u.forEach((g) => {
       g.setPosition(void 0), g.dispose();
     });
-  }, ge = (i) => {
-    const u = l.get(i).getSource();
+  }, ge = (a) => {
+    const u = l.get(a).getSource();
     u.forEachFeature((g) => {
       g.get("type") !== "line" && u.removeFeature(g);
     });
-  }, fe = (i, u) => (`${i.time}`, [
+  }, fe = (a, u) => (`${a.time}`, [
     new Style({
       // 扩大交互热区
       image: new CircleStyle({
@@ -524,20 +524,20 @@ const useTrackManager = (e) => {
       })
     })
     // textStyle,
-  ]), ye = (i) => {
+  ]), ye = (a) => {
     const u = "#E31818", g = "#1890FF", b = "&#xe6d2", E = new Style({
       text: new Text({
         font: "Normal 22px map-iconfont",
         text: getIconFont(b),
         offsetY: -10,
         fill: new Fill({
-          color: Number(i.state) === 0 ? u : Number(i.state) === 1 ? g : ""
+          color: Number(a.state) === 0 ? u : Number(a.state) === 1 ? g : ""
         })
       }),
       zIndex: 99
     }), _ = getIconStyle("&#xe6e2;"), z = getIconStyle("&#xe703;"), Y = [];
-    return Number(i.state) === 0 ? Y.push(_) : Number(i.state) === 1 && Y.push(z), Y.push(E), Y;
-  }, me = (i, u, g, b) => {
+    return Number(a.state) === 0 ? Y.push(_) : Number(a.state) === 1 && Y.push(z), Y.push(E), Y;
+  }, me = (a, u, g, b) => {
     const E = u || [], T = u.length;
     T || (E.push(g[0]), E.push(g[g.length - 1]));
     const _ = [];
@@ -573,11 +573,11 @@ const useTrackManager = (e) => {
         ), _.push(G);
       }
     }
-    const D = l.get(i).getSource();
+    const D = l.get(a).getSource();
     D == null || D.addFeatures(_);
-  }, se = (i) => {
+  }, se = (a) => {
     var T, _;
-    const u = e.getView(), g = (T = l == null ? void 0 : l.get(i)) == null ? void 0 : T.getSource(), b = x || (i ? g == null ? void 0 : g.getFeatureById(i) : null);
+    const u = e.getView(), g = (T = l == null ? void 0 : l.get(a)) == null ? void 0 : T.getSource(), b = p || (a ? g == null ? void 0 : g.getFeatureById(a) : null);
     if (!b) return;
     const E = (_ = b == null ? void 0 : b.getGeometry()) == null ? void 0 : _.getExtent();
     if (E != null && E.length)
@@ -587,8 +587,8 @@ const useTrackManager = (e) => {
       } catch (D) {
         console.log(D);
       }
-  }, ve = (i) => {
-    const u = "&#xe69b;", E = i.index === 0 ? "#fcdc3f" : "#ff0000";
+  }, ve = (a) => {
+    const u = "&#xe69b;", E = a.index === 0 ? "#fcdc3f" : "#ff0000";
     return [new Style({
       text: new Text({
         font: "Normal 14px map-iconfont",
@@ -604,8 +604,8 @@ const useTrackManager = (e) => {
     }), Object.keys(n).forEach((u) => {
       l.delete(u), delete n[u];
     }), A = !1, le();
-  }, we = (i) => {
-    const u = l.get(i || s);
+  }, we = (a) => {
+    const u = l.get(a || s);
     u == null || u.setVisible(!1);
     const g = e.getOverlays().getArray();
     for (let b = 0; b < g.length; ) {
@@ -613,18 +613,18 @@ const useTrackManager = (e) => {
       E.get("class") === "track-label-overlay" ? (E.setPosition(void 0), e.removeOverlay(E)) : b++;
     }
     I();
-  }, Le = (i, u = LENGTH_UNIT.NM) => {
+  }, Le = (a, u = LENGTH_UNIT.NM) => {
     const g = {
-      id: i,
+      id: a,
       length: "--"
-    }, E = (n[i] || []).map(
+    }, E = (n[a] || []).map(
       (_) => transform([_.lon, _.lat], projection.data, projection.mercator)
     ), T = new LineString(E);
     return g.length = formatLength(T, u) || "--", g;
-  }, pe = (i, u) => {
-    xe(String(i), u);
-  }, xe = (i, u) => {
-    const g = n[String(i)], b = g == null ? void 0 : g.map((E) => [E.lon, E.lat]);
+  }, pe = (a, u) => {
+    xe(String(a), u);
+  }, xe = (a, u) => {
+    const g = n[String(a)], b = g == null ? void 0 : g.map((E) => [E.lon, E.lat]);
     b && ke(b, u);
   }, re = new Style({
     text: new Text({
@@ -634,10 +634,10 @@ const useTrackManager = (e) => {
       rotation: 0
       // 初始旋转角度
     })
-  }), be = (i, u) => {
+  }), be = (a, u) => {
     var S, G;
-    const g = Number(50 * u), b = ((S = i.frameState) == null ? void 0 : S.time) ?? Date.now(), E = b - f;
-    if (k = (k + g * E / 1e6) % 2, f = b, k >= 1) {
+    const g = Number(50 * u), b = ((S = a.frameState) == null ? void 0 : S.time) ?? Date.now(), E = b - y;
+    if (k = (k + g * E / 1e6) % 2, y = b, k >= 1) {
       I();
       return;
     }
@@ -651,37 +651,37 @@ const useTrackManager = (e) => {
       mercatorToLonLat(_, "array"),
       mercatorToLonLat(D, "array")
     ) * Math.PI / 180;
-    (G = re.getText()) == null || G.setRotation(Y), y.setCoordinates(T);
-    const X = getVectorContext(i);
-    X.setStyle(re), X.drawGeometry(y), e == null || e.render();
+    (G = re.getText()) == null || G.setRotation(Y), m.setCoordinates(T);
+    const X = getVectorContext(a);
+    X.setStyle(re), X.drawGeometry(m), e == null || e.render();
   }, Me = () => {
-    var i;
-    $ = !0, f = Date.now(), k = 0, y = ((i = p.getGeometry()) == null ? void 0 : i.clone()) || new Point([0, 0]), t && (v == null || v.on("postrender", t)), N == null || N.setGeometry(void 0);
+    var a;
+    $ = !0, y = Date.now(), k = 0, m = ((a = L.getGeometry()) == null ? void 0 : a.clone()) || new Point([0, 0]), t && (w == null || w.on("postrender", t)), F == null || F.setGeometry(void 0);
   }, I = () => {
-    $ && ($ = !1, N == null || N.setGeometry(void 0), t && v && v.un("postrender", t), v && (e == null || e.removeLayer(v)), v = null, N = null);
-  }, ke = (i, u) => {
+    $ && ($ = !1, F == null || F.setGeometry(void 0), t && w && w.un("postrender", t), w && (e == null || e.removeLayer(w)), w = null, F = null);
+  }, ke = (a, u) => {
     $ && I(), o = new Polyline({
       factor: 1e6
-    }).writeGeometry(new LineString(i)), r = new Polyline({
+    }).writeGeometry(new LineString(a)), r = new Polyline({
       factor: 1e6
     }).readGeometry(o, {
       dataProjection: projection.data,
       featureProjection: projection.mercator
-    }), p = new Feature({
+    }), L = new Feature({
       type: "icon",
       geometry: new Point(r.getFirstCoordinate())
     });
-    const g = p.getGeometry();
-    y = g ? g.clone() : new Point([0, 0]), N = new Feature({
+    const g = L.getGeometry();
+    m = g ? g.clone() : new Point([0, 0]), F = new Feature({
       type: "geoMarker",
       style: re,
-      geometry: y
-    }), v = new VectorLayer({
+      geometry: m
+    }), w = new VectorLayer({
       source: new VectorSource({
-        features: [N]
+        features: [F]
       })
-    }), e == null || e.addLayer(v), t = (b) => be(b, u), Me();
-  }, ie = (i, u, g) => {
+    }), e == null || e.addLayer(w), t = (b) => be(b, u), Me();
+  }, ie = (a, u, g) => {
     function b(S) {
       return 180 * (S % (2 * Math.PI)) / Math.PI;
     }
@@ -707,7 +707,7 @@ const useTrackManager = (e) => {
         return function(Te, Se) {
           return (_(Se, Te) + 180) % 360;
         }(S, G);
-      const q = T(S), ee = T(G), te = E(q[0]), oe = E(ee[0]), ce = E(q[1]), ne = E(ee[1]), Ce = Math.sin(oe - te) * Math.cos(ne), Ee = Math.cos(ce) * Math.sin(ne) - Math.sin(ce) * Math.cos(ne) * Math.cos(oe - te);
+      const q = T(S), ee = T(G), te = E(q[0]), oe = E(ee[0]), ae = E(q[1]), ne = E(ee[1]), Ce = Math.sin(oe - te) * Math.cos(ne), Ee = Math.cos(ae) * Math.sin(ne) - Math.sin(ae) * Math.cos(ne) * Math.cos(oe - te);
       return b(Math.atan2(Ce, Ee));
     }
     function D(S) {
@@ -726,18 +726,18 @@ const useTrackManager = (e) => {
       };
       return j.id !== void 0 && (q.id = j.id), j.bbox && (q.bbox = j.bbox), q.properties = G, q.geometry = S, q;
     }
-    const X = _(z(i), z(u), g);
+    const X = _(z(a), z(u), g);
     return X < 0 ? 360 + X : X;
   };
   return {
-    render: F,
+    render: N,
     remove: he,
     play: pe,
     setCenter: se,
     close: we,
     getLength: Le,
     handleTrackMapEvent: K,
-    reRenderTrackLine: a
+    reRenderTrackLine: c
   };
 };
 function useShipOverlay(e) {
@@ -768,7 +768,7 @@ function useShipOverlay(e) {
     "align-items": "center",
     animation: e.selected ? e.colors && e.colors.length >= 2 ? "blink-dual 2s ease-in-out infinite" : "blink-single 1.5s ease-in-out infinite" : "none"
     // "animation": props.selected ? 'blink 1.5s ease-in-out infinite' : 'none', // 动画开关
-  })), c = computed(() => ({
+  })), i = computed(() => ({
     width: "14px",
     height: "14px",
     margin: "1px 5px 1px 1px",
@@ -798,7 +798,7 @@ function useShipOverlay(e) {
       },
       [
         h("div", {
-          style: e.selected ? c.value : {}
+          style: e.selected ? i.value : {}
         }, ""),
         h("div", {
           class: "text",
@@ -855,7 +855,7 @@ function useShipOverlay(e) {
 ref([]);
 function addOverlay(e, l, n, s) {
   if (l) {
-    const c = new Overlay({
+    const i = new Overlay({
       element: n,
       positioning: "top-left",
       id: "label-" + (s == null ? void 0 : s.id),
@@ -864,32 +864,32 @@ function addOverlay(e, l, n, s) {
       position: l,
       className: s.blinking ? "ship-label-overlay-blinking" : "ship-label-overlay"
     });
-    c.set("class", "zh-map-ship-overlay"), e.addOverlay(c);
+    i.set("class", "zh-map-ship-overlay"), e.addOverlay(i);
   }
 }
 const getShipDirectPath = (e) => {
   const { spd: l, hdg: n, cog: s } = e;
   return l ? n !== null && +n != 511 && s !== null ? s - +n >= 3 ? SHIP_DIRECT.right : s - +n <= -3 ? SHIP_DIRECT.left : SHIP_DIRECT.front : SHIP_DIRECT.front : "";
 }, createShipStyle = (e, l) => {
-  const { shipData: n } = l.getProperties(), s = getShipType(e), c = getShipScale(e, n, s);
-  return initShipStyle(l, c, s);
+  const { shipData: n } = l.getProperties(), s = getShipType(e), i = getShipScale(e, n, s);
+  return initShipStyle(l, i, s);
 }, getShipType = (e) => {
   const l = e == null ? void 0 : e.getView().getZoom();
   return l <= MAP_ZOOM.shipModelMax && l >= MAP_ZOOM.shipTriggleMin ? "ship" : "triangle";
 }, getShipScale = (e, l, n) => {
   if (n === "ship") {
-    const { len: s, wid: c } = l, t = 97, L = 20, o = 1 / (e == null ? void 0 : e.getView().getResolution()), r = s * o / t, p = c * o / L, y = Math.min(r, p);
-    return y < 0.2 ? 0.2 : y > 2 ? 2 : y;
+    const { len: s, wid: i } = l, t = 97, f = 20, o = 1 / (e == null ? void 0 : e.getView().getResolution()), r = s * o / t, L = i * o / f, m = Math.min(r, L);
+    return m < 0.2 ? 0.2 : m > 2 ? 2 : m;
   }
   return MAP_ZOOM.scaleNum;
 }, initShipStyle = (e, l, n) => {
-  const { color: s, direct: c, isHighlight: t, shipData: L } = e.getProperties(), m = ((L == null ? void 0 : L.cog) - 90 + 360) % 360;
+  const { color: s, direct: i, isHighlight: t, shipData: f } = e.getProperties(), v = ((f == null ? void 0 : f.cog) - 90 + 360) % 360;
   return new Style({
     image: new Icon({
       src: o(),
       scale: l || MAP_ZOOM.scaleNum,
       anchor: [0.5, 0.5],
-      rotation: m * Math.PI / 180,
+      rotation: v * Math.PI / 180,
       rotateWithView: !1
     })
   });
@@ -903,20 +903,20 @@ const getShipDirectPath = (e) => {
                 <path d="M30.8843 12.6777L2.21343 21.7067C1.75559 21.8509 1.28947 21.509 1.28947 21.029L1.28947 2.97103C1.28947 2.49102 1.75558 2.14913 2.21342 2.29331L30.8843 11.3223C31.5471 11.531 31.5471 12.469 30.8843 12.6777Z" 
                  fill="${s}" stroke="${t ? "#FF2424" : "black"}"  stroke-width="${t ? "2" : "0.578947"}" />
                 <!--path船航向左边或者向前-->
-                ${c === SHIP_DIRECT.left && `<path d="M30 12L40 12L40 8" stroke="${t ? "#FF2424" : "black"}" stroke-width="2"/>`}
+                ${i === SHIP_DIRECT.left && `<path d="M30 12L40 12L40 8" stroke="${t ? "#FF2424" : "black"}" stroke-width="2"/>`}
                 <!--path船航向右边-->
-                ${c === SHIP_DIRECT.right && `<path d="M30 12L40 12L40 16" stroke="${t ? "#FF2424" : "black"}" stroke-width="2"/>`}
+                ${i === SHIP_DIRECT.right && `<path d="M30 12L40 12L40 16" stroke="${t ? "#FF2424" : "black"}" stroke-width="2"/>`}
                 <!--path黑线无左右-->
-                ${c === SHIP_DIRECT.front && `<path d="M30 12L40 12" stroke="${t ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
+                ${i === SHIP_DIRECT.front && `<path d="M30 12L40 12" stroke="${t ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
             </svg>
             `;
       case "ship":
         return `<svg width="97" height="20" viewBox="0 0 97 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                 <path d="M0.289474 17.3433L0.289474 2.65655C0.289474 2.28572 0.574654 1.97725 0.944343 1.9482L22.0544 0.289473L67.5204 0.289473C67.6295 0.289473 67.7372 0.314613 67.835 0.362943L86.0565 9.3629C86.5844 9.6236 86.5844 10.3763 86.0565 10.637L67.835 19.6371C67.7372 19.6854 67.6295 19.7105 67.5203 19.7105L22.0544 19.7105L0.944343 18.0517C0.574653 18.0226 0.289474 17.7142 0.289474 17.3433Z" 
                 fill="${s}" stroke="${t ? "#FF2424" : "black"}"  stroke-width="${t ? "4" : "0.578947"}"/>
-                ${c === SHIP_DIRECT.left && `<path d="M86 10L96 10L96 6" stroke="${t ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
-                ${c === SHIP_DIRECT.right && `<path d="M86 10L96 10L96 14" stroke="${t ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
-                ${c === SHIP_DIRECT.front && `<path  d="M86 10L96 10" stroke="${t ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
+                ${i === SHIP_DIRECT.left && `<path d="M86 10L96 10L96 6" stroke="${t ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
+                ${i === SHIP_DIRECT.right && `<path d="M86 10L96 10L96 14" stroke="${t ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
+                ${i === SHIP_DIRECT.front && `<path  d="M86 10L96 10" stroke="${t ? "#FF2424" : "black"}" stroke-width="1.5"/>`}
             </svg>
             `;
       default:
@@ -924,35 +924,35 @@ const getShipDirectPath = (e) => {
     }
   }
 }, selectedShipStyle = (e, l) => {
-  const n = selectedShipElement(e, l), s = l.id, { lon: c, lat: t } = l, L = new Overlay({
+  const n = selectedShipElement(e, l), s = l.id, { lon: i, lat: t } = l, f = new Overlay({
     element: n,
-    position: fromLonLat([c, t]),
+    position: fromLonLat([i, t]),
     id: "selected-" + s,
     positioning: "center-center",
     offset: [0, 5],
     className: "ship-selected-overlay"
   });
-  return L.set("class", "ship-overlay-selected"), L;
+  return f.set("class", "ship-overlay-selected"), f;
 }, selectedShipElement = (e, l) => {
-  const n = getShipType(e), s = getShipScale(e, l, n), c = n === "ship" ? 109 : 49, t = `
-      <svg style="transform:scale(${s});" xmlns="http://www.w3.org/2000/svg" width="${c}" height="${c}" viewBox="0 0 49 49" fill="none">
+  const n = getShipType(e), s = getShipScale(e, l, n), i = n === "ship" ? 109 : 49, t = `
+      <svg style="transform:scale(${s});" xmlns="http://www.w3.org/2000/svg" width="${i}" height="${i}" viewBox="0 0 49 49" fill="none">
           <path d="M1.99982 46.9998L1.99982 1.99982L46.9998 1.99982L46.9998 46.9998L1.99982 46.9998Z" fill="#FF2424" fill-opacity="0.2"/>
           <path fill-rule="evenodd" clip-rule="evenodd" d="M19.9998 0.5V3.5L3.49976 3.5V20H0.499756V0.500002L19.9998 0.5ZM45.4998 3.5H28.9998V0.5H48.4998V20H45.4998V3.5ZM48.4998 29L48.4998 48.5H28.9998V45.5H45.4998L45.4998 29H48.4998ZM3.49976 45.5L3.49976 29H0.499756L0.499758 48.5L19.9998 48.5V45.5L3.49976 45.5Z" fill="#FF2424"/>
       </svg>
-    `, L = document.createElement("div");
-  return L.className = "ship-overlay-selected", L.innerHTML = t, L;
+    `, f = document.createElement("div");
+  return f.className = "ship-overlay-selected", f.innerHTML = t, f;
 }, createLabelStyle = (e, l) => {
-  const { lon: n, lat: s, blinking: c } = l, t = createLabelElement(l);
-  n && s && addOverlay(e, fromLonLat([n, s]), t, { ...l, blinking: c });
+  const { lon: n, lat: s, blinking: i } = l, t = createLabelElement(l);
+  n && s && addOverlay(e, fromLonLat([n, s]), t, { ...l, blinking: i });
 }, createLabelElement = (e) => {
   const l = document.createElement("div");
   l.className = "ship-overlay-box", l.style.position = "relative";
-  const { lon: n, lat: s, blinking: c, blinkingColors: t, name: L } = e, m = createVNode({
+  const { lon: n, lat: s, blinking: i, blinkingColors: t, name: f } = e, v = createVNode({
     setup() {
       return useShipOverlay({
         position: [n + 2e-3, s + 2e-3],
-        selected: c,
-        name: L,
+        selected: i,
+        name: f,
         colors: t || [],
         existDevice: e == null ? void 0 : e.existDevice,
         existMobile: e == null ? void 0 : e.existMobile,
@@ -960,7 +960,7 @@ const getShipDirectPath = (e) => {
       });
     }
   });
-  return render(m, l), l;
+  return render(v, l), l;
 }, getRightIcons = (e) => {
   const l = [];
   return e.existDevice && l.push("&#xe687;"), e.existMobile && l.push("&#xe688;"), e.existWaterGauge && l.push("&#xe686;"), l;
@@ -978,112 +978,111 @@ function getRandomLineDirection() {
 }
 const devicePixelRatio = window.devicePixelRatio || 1;
 function generateBase64Icon(e, l, n = "left-bottom", s = 2) {
-  const c = document.createElement("canvas"), t = c.getContext("2d");
+  const i = document.createElement("canvas"), t = i.getContext("2d");
   if (!t) return "";
-  const L = 2, m = 16, o = window.devicePixelRatio || 1, r = "500 12px Arial", p = "14px map-iconfont";
+  const f = 2, v = 16, o = window.devicePixelRatio || 1, r = "500 12px Arial", L = "14px map-iconfont";
   t.font = r;
-  const N = t.measureText(e).width;
-  t.font = p;
-  const $ = l.map((V) => ({ width: t.measureText(getIconFont(V)).width, height: 14 })), f = $.reduce((V, O) => V + O.width, 0), v = (l.length - 1) * s, k = L + N + f + v + L * 2, x = L + 16 + L;
-  let C, A, H = 0, B = 0, W = 0, d = 0, w = 0, a = 0;
-  switch (C = m + k, n) {
+  const F = t.measureText(e).width;
+  t.font = L;
+  const $ = l.map((V) => ({ width: t.measureText(getIconFont(V)).width, height: 14 })), y = $.reduce((V, O) => V + O.width, 0), w = (l.length - 1) * s, k = f + F + y + w + f * 2, p = f + 16 + f;
+  let C, A, H = 0, B = 0, W = 0, d = 0, x = 0, c = 0;
+  switch (C = v + k, n) {
     case "right-top":
-      A = m + x, H = 0, B = m + x, W = m, d = 0, w = m, a = 0;
+      A = v + p, H = 0, B = v + p, W = v, d = 0, x = v, c = 0;
       break;
     case "right-middle":
-      A = x, H = 0, B = x / 2, W = m, d = x / 2, w = m, a = 0;
+      A = p, H = 0, B = p / 2, W = v, d = p / 2, x = v, c = 0;
       break;
     case "right-bottom":
-      A = m + x, H = 0, B = 0, W = m, d = m, w = m, a = m;
+      A = v + p, H = 0, B = 0, W = v, d = v, x = v, c = v;
       break;
     case "left-top":
-      A = m + x, H = k, B = m, W = k + m, d = x + m, w = 0, a = 0;
+      A = v + p, H = k, B = v, W = k + v, d = p + v, x = 0, c = 0;
       break;
     case "left-middle":
-      A = x, H = k, B = x / 2, W = k + m, d = x / 2, w = 0, a = 0;
+      A = p, H = k, B = p / 2, W = k + v, d = p / 2, x = 0, c = 0;
       break;
     case "left-bottom":
-      A = m + x, H = k, B = x, W = k + m, d = 0, w = 0, a = m;
+      A = v + p, H = k, B = p, W = k + v, d = 0, x = 0, c = v;
       break;
   }
-  c.width = Math.round(C * o), c.height = Math.round(A * o), c.style.width = `${C}px`, c.style.height = `${A}px`, t.scale(o, o), t.clearRect(0, 0, C, A), t.beginPath(), t.moveTo(H, B), t.lineTo(W, d), t.strokeStyle = "#FFF", t.lineWidth = 1, t.stroke(), t.fillStyle = "#FFF", t.fillRect(w, a, k, x), t.font = r, t.textBaseline = "middle";
-  const M = a + L + x / 2;
-  t.strokeStyle = "#ffffff", t.lineWidth = 1, t.strokeText(e, w + L, M), t.fillStyle = "#000000", t.fillText(e, w + L, M), t.font = p, t.fillStyle = "#3370ff";
-  let F = w + L + N + s;
+  i.width = Math.round(C * o), i.height = Math.round(A * o), i.style.width = `${C}px`, i.style.height = `${A}px`, t.scale(o, o), t.clearRect(0, 0, C, A), t.beginPath(), t.moveTo(H, B), t.lineTo(W, d), t.strokeStyle = "#FFF", t.lineWidth = 1, t.stroke(), t.fillStyle = "#FFF", t.fillRect(x, c, k, p), t.font = r, t.textBaseline = "middle";
+  const M = c + f + p / 2;
+  t.strokeStyle = "#ffffff", t.lineWidth = 1, t.strokeText(e, x + f, M), t.fillStyle = "#000000", t.fillText(e, x + f, M), t.font = L, t.fillStyle = "#3370ff";
+  let N = x + f + F + s;
   return l.forEach((V, O) => {
-    const R = a + L + x / 2;
-    t.fillText(getIconFont(V), F, R), F += $[O].width + s;
-  }), c.toDataURL("image/png");
+    const R = c + f + p / 2;
+    t.fillText(getIconFont(V), N, R), N += $[O].width + s;
+  }), i.toDataURL("image/png");
 }
 const createLabelFeatureStyle = (e) => {
-  const { name: l, rightIcons: n } = e.getProperties(), s = getRandomLineDirection(), c = generateBase64Icon(l, n, s);
-  let t = [0, 0];
-  switch (s) {
+  const { name: l, rightIcons: n, selected: s } = e.getProperties(), i = getRandomLineDirection(), t = generateBase64Icon(l, n, i);
+  let f = [0, 0];
+  switch (i) {
     case "right-top":
-      t = [0, 1];
+      f = [0, 1];
       break;
     case "right-middle":
-      t = [0, 0.5];
+      f = [0, 0.5];
       break;
     case "right-bottom":
-      t = [0, 0];
+      f = [0, 0];
       break;
     case "left-top":
-      t = [1, 1];
+      f = [1, 1];
       break;
     case "left-middle":
-      t = [1, 0.5];
+      f = [1, 0.5];
       break;
     case "left-bottom":
-      t = [1, 0];
+      f = [1, 0];
       break;
   }
   return new Style({
     image: new Icon({
-      src: c,
-      anchor: t,
+      src: t,
+      anchor: f,
       displacement: [0, 0],
       scale: 1 / devicePixelRatio,
       anchorXUnits: "fraction",
       anchorYUnits: "fraction"
-    })
+    }),
+    zIndex: s ? 100 : 10
   });
 }, useShipManager = (e) => {
   let l = null, n = null;
-  const s = new VectorSource(), c = new VectorImageLayer({
+  const s = new VectorSource(), i = new VectorImageLayer({
     source: s,
     className: "zh-map--ship-layer",
     renderBuffer: 300,
     zIndex: 101
-  }), t = new VectorSource(), L = new VectorLayer({
+  }), t = new VectorSource(), f = new VectorLayer({
     source: t,
     className: "zh-map--ship-label-layer",
     zIndex: 102,
     updateWhileInteracting: !1,
     updateWhileAnimating: !1,
-    declutter: function(d, w) {
-      return !(w && (w != null && w.get("selected")));
-    }
+    declutter: !0
   });
-  e == null || e.addLayer(c), e == null || e.addLayer(L);
-  let m = "", o = {}, r = {};
-  const p = (d) => {
+  e == null || e.addLayer(i), e == null || e.addLayer(f);
+  let v = "", o = {}, r = {};
+  const L = (d) => {
     if (!d || !e) return;
-    const w = (n == null ? void 0 : n.id) || (l == null ? void 0 : l.get("id"));
+    const x = (n == null ? void 0 : n.id) || (l == null ? void 0 : l.get("id"));
     if (n) {
-      const a = d.filter((M) => M.id === w);
-      a.length === 0 ? d.push(n) : n = a[0];
+      const c = d.filter((M) => M.id === x);
+      c.length === 0 ? d.push(n) : n = c[0];
     }
-    $(), f(!0), W(d), N();
-  }, y = (d) => {
+    $(), y(!0), W(d), F();
+  }, m = (d) => {
     var P;
-    const w = (n == null ? void 0 : n.id) || (l == null ? void 0 : l.get("id")), a = fromLonLat([d == null ? void 0 : d.lon, d == null ? void 0 : d.lat]), M = ((P = r[d.id]) == null ? void 0 : P.blinkColors) || [], V = M[M.length - 1] || d.fill || "#04C900", O = getShipDirectPath(d), R = new Feature({
-      geometry: new Point(a),
+    const x = (n == null ? void 0 : n.id) || (l == null ? void 0 : l.get("id")), c = fromLonLat([d == null ? void 0 : d.lon, d == null ? void 0 : d.lat]), M = ((P = r[d.id]) == null ? void 0 : P.blinkColors) || [], V = M[M.length - 1] || d.fill || "#04C900", O = getShipDirectPath(d), R = new Feature({
+      geometry: new Point(c),
       // 船舶数据
       shipData: d,
       id: d.id,
       name: d.cnname || d.enname || d.id || "未命名船舶",
-      selected: d.id === w,
+      selected: d.id === x,
       // 图标
       rightIcons: getRightIcons(d),
       // 是否闪烁
@@ -1097,55 +1096,55 @@ const createLabelFeatureStyle = (e) => {
       // 高亮
       isHighlight: !1
     });
-    return R.set("clickGeometry", new Circle(a)), R;
-  }, N = async () => {
+    return R.set("clickGeometry", new Circle(c)), R;
+  }, F = async () => {
     if (!n || !e) return;
-    let w = e.getOverlays().getArray().find((a) => a.get("class") == "ship-overlay-selected");
-    if (console.log("selectedOverlay----------", w), w) {
-      const a = selectedShipElement(e, n);
-      await w.setElement(a), await w.setPosition(fromLonLat([n.lon, n.lat]));
+    let x = e.getOverlays().getArray().find((c) => c.get("class") == "ship-overlay-selected");
+    if (console.log("selectedOverlay----------", x), x) {
+      const c = selectedShipElement(e, n);
+      await x.setElement(c), await x.setPosition(fromLonLat([n.lon, n.lat]));
     } else
-      w = selectedShipStyle(e, n), w && e.addOverlay(w);
+      x = selectedShipStyle(e, n), x && e.addOverlay(x);
     setTimeout(() => {
-      var a;
-      w && ((a = w.get("element")) != null && a.parentElement) && (w.get("element").parentElement.style.display = "block");
+      var c;
+      x && ((c = x.get("element")) != null && c.parentElement) && (x.get("element").parentElement.style.display = "block");
     }, 20);
   }, $ = () => {
-    e && s && (s.clear(), t.clear(), f());
-  }, f = (d) => {
-    const w = e.getOverlays().getArray().filter((a) => a.get("class") == "zh-map-ship-overlay");
-    if (w && w.length > 0) {
-      for (let a = 0; a < w.length; a++)
-        if (!d && w[a].get("class") !== "ship-overlay-selected") {
-          const M = w[a];
+    e && s && (s.clear(), t.clear(), y());
+  }, y = (d) => {
+    const x = e.getOverlays().getArray().filter((c) => c.get("class") == "zh-map-ship-overlay");
+    if (x && x.length > 0) {
+      for (let c = 0; c < x.length; c++)
+        if (!d && x[c].get("class") !== "ship-overlay-selected") {
+          const M = x[c];
           M.setPosition(void 0), e.removeOverlay(M), M.dispose();
         }
     }
-  }, v = (d, w) => {
-    o = d, r = w;
-    const a = e.getOverlays().getArray(), M = s.getFeatures();
-    for (const F in o) {
-      const V = o[F], O = a.find((P) => P.getId() === "label-" + F), R = M.find((P) => F === P.get("id"));
+  }, w = (d, x) => {
+    o = d, r = x;
+    const c = e.getOverlays().getArray(), M = s.getFeatures();
+    for (const N in o) {
+      const V = o[N], O = c.find((P) => P.getId() === "label-" + N), R = M.find((P) => N === P.get("id"));
       if (O && R) {
-        const P = w[F].blinkColors, { shipData: Z, name: K } = R == null ? void 0 : R.getProperties();
+        const P = x[N].blinkColors, { shipData: Z, name: K } = R == null ? void 0 : R.getProperties();
         R.set("color", P[P.length - 1] || ""), R.set("blinking", V);
         const Q = {
           ...Z,
           blinking: V,
           blinkingColors: P || [],
-          name: K + "(" + w[F].shipState + ")"
+          name: K + "(" + x[N].shipState + ")"
         }, U = O.getElement(), J = createLabelElement(Q);
         U && U !== J && O.setElement(J);
       }
     }
   }, k = (d) => {
     if (!e) return;
-    const w = s.getFeatures(), a = t.getFeatures(), M = l ? l.get("id") : "", F = w.filter((P) => P.get("id") !== M), V = a == null ? void 0 : a.filter((P) => P.get("id") !== M), O = /* @__PURE__ */ new Map();
+    const x = s.getFeatures(), c = t.getFeatures(), M = l ? l.get("id") : "", N = x.filter((P) => P.get("id") !== M), V = c == null ? void 0 : c.filter((P) => P.get("id") !== M), O = /* @__PURE__ */ new Map();
     d.forEach((P) => {
       O.set(P.id, !0);
     });
     const R = e.getOverlays().getArray();
-    F.forEach((P) => {
+    N.forEach((P) => {
       const Z = P.get("id");
       if (!O.has(Z))
         P.setStyle([]);
@@ -1164,82 +1163,80 @@ const createLabelFeatureStyle = (e) => {
         (K == null ? void 0 : K.length) == 0 && P.setStyle(createLabelFeatureStyle(P));
       }
     });
-  }, x = (d) => {
+  }, p = (d) => {
     if (d) {
       console.log("选中", d);
-      const w = s.getFeatures().find((M) => M.get("id") === d.id), a = t.getFeatures().find((M) => M.get("id") === d.id);
-      w && (l = w), a && a.set("selected", !0), n = d, N();
+      const x = s.getFeatures().find((M) => M.get("id") === d.id), c = t.getFeatures().find((M) => M.get("id") === d.id);
+      x && (l = x), c && c.set("selected", !0), n = d, F();
     } else
       console.log("取消选中"), n = null, l = null, H();
-  }, C = debounce((d, w, a) => {
+  }, C = debounce((d, x, c) => {
     if (d) {
-      const M = d.get("shipData"), F = d.get("id");
-      if (e.getTargetElement().style.cursor = F ? "pointer" : "", w === "click" && (x(M), a && a(F)), w === "hover") {
-        m && m !== F && A(), m = F;
-        const V = s.getFeatures().find((O) => O.get("id") === m);
+      const M = d.get("shipData"), N = d.get("id");
+      if (e.getTargetElement().style.cursor = N ? "pointer" : "", x === "click" && (p(M), c && c(N)), x === "hover") {
+        v && v !== N && A(), v = N;
+        const V = s.getFeatures().find((O) => O.get("id") === v);
         V == null || V.set("isHighlight", !0), V == null || V.setStyle(createShipStyle(e, V));
       }
     } else
       e.getTargetElement().style.cursor = "", A();
   }, 10), A = () => {
-    const d = m ? s.getFeatures().find((w) => w.get("id") === m) : null;
-    m = null, d == null || d.set("isHighlight", !1), d == null || d.setStyle(createShipStyle(e, d));
+    const d = v ? s.getFeatures().find((x) => x.get("id") === v) : null;
+    v = null, d == null || d.set("isHighlight", !1), d == null || d.setStyle(createShipStyle(e, d));
   }, H = () => {
     try {
-      const w = e.getOverlays().getArray().find((a) => a.get("class") == "ship-overlay-selected");
-      w && w.setPosition(void 0);
+      const x = e.getOverlays().getArray().find((c) => c.get("class") == "ship-overlay-selected");
+      x && x.setPosition(void 0);
     } catch (d) {
       console.log(d);
     }
   }, B = (d) => {
-    const w = fromLonLat([d == null ? void 0 : d.lon, d == null ? void 0 : d.lat]), a = new Feature({
-      geometry: new Point(w),
+    const x = fromLonLat([d == null ? void 0 : d.lon, d == null ? void 0 : d.lat]), c = new Feature({
+      geometry: new Point(x),
       name: d.cnname || d.enname || d.id || "未命名船舶",
       // 图标
       rightIcons: getRightIcons(d),
       selected: (d == null ? void 0 : d.id) === (n == null ? void 0 : n.id),
       shipData: d
     });
-    a.set("id", d.id);
-    const M = createLabelFeatureStyle(a);
-    return a.setStyle(M), a;
+    c.set("id", d.id);
+    const M = createLabelFeatureStyle(c);
+    return c.setStyle(M), c;
   }, W = (d) => {
-    const w = e.getView().getZoom();
-    d.forEach((a) => {
-      const M = y(a);
-      if (M.setStyle(createShipStyle(e, M)), s.addFeature(M), (n == null ? void 0 : n.id) == a.id || w >= MAP_ZOOM.shipModelMin)
-        if (o[a.id]) {
-          if (a.id && r[a == null ? void 0 : a.id]) {
-            const F = r[a == null ? void 0 : a.id] || {};
-            console.log(F);
-            const V = (F == null ? void 0 : F.blinkColors) || [], O = (F == null ? void 0 : F.shipState) || "", R = (a.cnname || a.enname || a.id || "未命名船舶") + "(" + O + ")", P = {
-              ...a,
+    const x = e.getView().getZoom();
+    d.forEach((c) => {
+      const M = m(c);
+      if (M.setStyle(createShipStyle(e, M)), s.addFeature(M), (n == null ? void 0 : n.id) == c.id || x >= MAP_ZOOM.shipModelMin)
+        if (o[c.id]) {
+          if (c.id && r[c == null ? void 0 : c.id]) {
+            const N = r[c == null ? void 0 : c.id] || {}, V = (N == null ? void 0 : N.blinkColors) || [], O = (N == null ? void 0 : N.shipState) || "", R = (c.cnname || c.enname || c.id || "未命名船舶") + "(" + O + ")", P = {
+              ...c,
               name: R,
-              blinking: o[a.id],
+              blinking: o[c.id],
               blinkingColors: V || []
             };
             createLabelStyle(e, P);
           }
         } else {
-          const F = B(a);
-          t.addFeature(F);
+          const N = B(c);
+          t.addFeature(N);
         }
     });
   };
   return {
-    render: p,
-    selected: x,
+    render: L,
+    selected: p,
     filter: k,
-    blinking: v,
+    blinking: w,
     clear: $,
     handleShipMapEvent: C
   };
 }, useLayerManager = (e) => {
-  const l = () => e == null ? void 0 : e.getLayers(), n = ref("vector"), s = () => n.value, c = (o) => {
+  const l = () => e == null ? void 0 : e.getLayers(), n = ref("vector"), s = () => n.value, i = (o) => {
     n.value = o;
     const r = l();
-    r && (r == null || r.getArray().forEach((p) => {
-      (p.className_ === "vector" || p.className_ === "satellite") && p.setVisible(p.className_ === o);
+    r && (r == null || r.getArray().forEach((L) => {
+      (L.className_ === "vector" || L.className_ === "satellite") && L.setVisible(L.className_ === o);
     }));
   }, t = ref(!1);
   return {
@@ -1249,24 +1246,24 @@ const createLabelFeatureStyle = (e) => {
       if (o !== t.value) {
         if (o) {
           const r = l();
-          if (!r.getArray().find((y) => y.className_ === "greenTile")) {
-            const y = new TileLayer({
+          if (!r.getArray().find((m) => m.className_ === "greenTile")) {
+            const m = new TileLayer({
               source: new XYZ({ url: BASE_MAP_LINK.greenTile }),
               visible: o,
               zIndex: 2,
               className: "greenTile"
             });
-            r.push(y);
+            r.push(m);
           }
         } else {
-          const r = l(), p = r.getArray().find((y) => y.className_ === "greenTile");
-          p && r.remove(p);
+          const r = l(), L = r.getArray().find((m) => m.className_ === "greenTile");
+          L && r.remove(L);
         }
         t.value = o;
       }
     },
     getShowLayerType: s,
-    setShowLayerType: c
+    setShowLayerType: i
   };
 }, usePropsManager = () => {
   const e = ref();
@@ -1278,35 +1275,35 @@ const createLabelFeatureStyle = (e) => {
   };
 }, usePositionManager = (e) => {
   const l = "zh-map-location-layer";
-  let n, s, c = null, t = null;
-  const L = (f) => {
-    if (!(!f || f.length === 0)) {
+  let n, s, i = null, t = null;
+  const f = (y) => {
+    if (!(!y || y.length === 0)) {
       if (s || (s = new VectorSource()), s.clear(), t) {
-        const v = f.find((k) => k.id === t.id);
-        v ? t = v : f.push(t);
+        const w = y.find((k) => k.id === t.id);
+        w ? t = w : y.push(t);
       }
-      f.forEach((v) => {
-        m(v);
+      y.forEach((w) => {
+        v(w);
       }), n || (n = new VectorLayer({
         className: l,
         source: s,
         zIndex: 100
       }), e == null || e.addLayer(n));
     }
-  }, m = (f) => {
-    const v = e == null ? void 0 : e.getView().getZoom(), [k, x] = f.latLon.split(","), C = new Feature({
-      geometry: new Point(fromLonLat([Number(k), Number(x)]))
+  }, v = (y) => {
+    const w = e == null ? void 0 : e.getView().getZoom(), [k, p] = y.latLon.split(","), C = new Feature({
+      geometry: new Point(fromLonLat([Number(k), Number(p)]))
     });
-    C.setStyle(o(f, v, f.id === (t == null ? void 0 : t.id))), C.set("loactionData", f), s.addFeature(C);
-  }, o = (f, v, k) => {
-    const x = {
+    C.setStyle(o(y, w, y.id === (t == null ? void 0 : t.id))), C.set("loactionData", y), s.addFeature(C);
+  }, o = (y, w, k) => {
+    const p = {
       image: new Icon({
-        src: k && f.selectedPath || f.defaultPath,
-        scale: 0.5 * v / 10
+        src: k && y.selectedPath || y.defaultPath,
+        scale: 0.5 * w / 10
       })
     };
-    return f.name && (x.text = new Text({
-      text: f.name,
+    return y.name && (p.text = new Text({
+      text: y.name,
       font: "12px sans-serif",
       fill: new Fill({
         color: "#000000"
@@ -1315,37 +1312,37 @@ const createLabelFeatureStyle = (e) => {
         color: "#FFFFFF"
       }),
       offsetY: 30
-    })), new Style(x);
+    })), new Style(p);
   }, r = () => {
-    if (c) {
-      const f = c.get("loactionData").id;
-      s.getFeatures().forEach((v) => {
-        v.get("loactionData").id !== f && s.removeFeature(v);
+    if (i) {
+      const y = i.get("loactionData").id;
+      s.getFeatures().forEach((w) => {
+        w.get("loactionData").id !== y && s.removeFeature(w);
       });
     } else
       s.clear();
-  }, p = () => {
-    var x;
-    const f = c.get("loactionData"), v = (x = e == null ? void 0 : e.getView()) == null ? void 0 : x.getZoom();
+  }, L = () => {
+    var p;
+    const y = i.get("loactionData"), w = (p = e == null ? void 0 : e.getView()) == null ? void 0 : p.getZoom();
     s.getFeatures().forEach((C) => {
-      C.get("loactionData").id === f.id && (C == null || C.setStyle(o(f, v, !1)));
-    }), t = null, c = null;
-  }, y = (f) => {
-    f ? (N(), $(f)) : clearSelectedPort();
-  }, N = () => {
-    var f;
-    if (c) {
-      const v = c.get("loactionData"), k = (f = e == null ? void 0 : e.getView()) == null ? void 0 : f.getZoom();
-      c.setStyle(o(v, k, !1));
+      C.get("loactionData").id === y.id && (C == null || C.setStyle(o(y, w, !1)));
+    }), t = null, i = null;
+  }, m = (y) => {
+    y ? (F(), $(y)) : clearSelectedPort();
+  }, F = () => {
+    var y;
+    if (i) {
+      const w = i.get("loactionData"), k = (y = e == null ? void 0 : e.getView()) == null ? void 0 : y.getZoom();
+      i.setStyle(o(w, k, !1));
     }
-  }, $ = (f) => {
-    const v = s.getFeatures();
-    t = f, c = v.find((k) => k.get("loactionData").id === f.id);
+  }, $ = (y) => {
+    const w = s.getFeatures();
+    t = y, i = w.find((k) => k.get("loactionData").id === y.id);
   };
   return {
-    render: L,
-    selected: y,
-    clearSelected: p,
+    render: f,
+    selected: m,
+    clearSelected: L,
     clear: r
   };
 }, disableDoubleClickZoom = (e) => {
@@ -1360,17 +1357,17 @@ const createLabelFeatureStyle = (e) => {
   const n = e.getViewport();
   n && (n.style.cursor = l);
 }, useDrawLineManager = (e, l) => {
-  const n = ref([]), s = ref("km"), c = (a) => {
-    s.value = a;
+  const n = ref([]), s = ref("km"), i = (c) => {
+    s.value = c;
   };
   let t;
-  const L = ref(!1), m = () => {
-    p(), disableDoubleClickZoom(e), changeCursor(e, "crosshair"), e.on("pointermove", $), e.getViewport().addEventListener("mouseout", () => {
+  const f = ref(!1), v = () => {
+    L(), disableDoubleClickZoom(e), changeCursor(e, "crosshair"), e.on("pointermove", $), e.getViewport().addEventListener("mouseout", () => {
       t && t.classList.add("hidden");
-    }), v(), L.value = !0;
+    }), w(), f.value = !0;
   };
   let o, r;
-  const p = () => {
+  const L = () => {
     o = new VectorSource(), r = new VectorLayer({
       source: o,
       zIndex: 1e3,
@@ -1383,16 +1380,16 @@ const createLabelFeatureStyle = (e) => {
       }
     }), e == null || e.addLayer(r);
   };
-  let y, N;
-  const $ = (a) => {
-    if (a.dragging)
+  let m, F;
+  const $ = (c) => {
+    if (c.dragging)
       return;
     let M = "点击选择起点";
-    y && (M = "单击继续，双击结束"), t && (t.innerHTML = M, N.setPosition(a.coordinate), t.classList.remove("hidden"));
+    m && (M = "单击继续，双击结束"), t && (t.innerHTML = M, F.setPosition(c.coordinate), t.classList.remove("hidden"));
   };
-  let f;
-  const v = () => {
-    f = new Draw({
+  let y;
+  const w = () => {
+    y = new Draw({
       source: o,
       type: "LineString",
       style: new Style({
@@ -1416,107 +1413,107 @@ const createLabelFeatureStyle = (e) => {
       }),
       // 添加条件函数，判断是否应该出发点绘制
       condition: (M) => M.originalEvent.target.tagName !== "DIV"
-    }), e == null || e.addInteraction(f), A(), H();
-    let a;
-    f.on("drawstart", function(M) {
+    }), e == null || e.addInteraction(y), A(), H();
+    let c;
+    y.on("drawstart", function(M) {
       var V;
-      y = M.feature, y.set("randomId", k());
-      let F;
-      a = (V = y.getGeometry()) == null ? void 0 : V.on("change", function(O) {
+      m = M.feature, m.set("randomId", k());
+      let N;
+      c = (V = m.getGeometry()) == null ? void 0 : V.on("change", function(O) {
         const R = O.target, P = computedDistance(R, s.value);
-        F = R.getLastCoordinate(), x && P && (x.innerHTML = P), C.setPosition(F);
+        N = R.getLastCoordinate(), p && P && (p.innerHTML = P), C.setPosition(N);
       });
-    }), f.on("drawend", function() {
-      var M, F, V;
-      if (x && (x.className = "ol-tooltip ol-tooltip-static ol-tooltip-measure"), x != null && x.innerHTML) {
-        const O = (y == null ? void 0 : y.get("randomId")) || k();
-        n.value.push({ id: O, value: x == null ? void 0 : x.innerHTML }), x.innerHTML = `${x.innerHTML}<div class="ol-tooltip-delete-button" data-id="${O}"><i class="map-iconfont icon-delete"></i></div>`;
+    }), y.on("drawend", function() {
+      var M, N, V;
+      if (p && (p.className = "ol-tooltip ol-tooltip-static ol-tooltip-measure"), p != null && p.innerHTML) {
+        const O = (m == null ? void 0 : m.get("randomId")) || k();
+        n.value.push({ id: O, value: p == null ? void 0 : p.innerHTML }), p.innerHTML = `${p.innerHTML}<div class="ol-tooltip-delete-button" data-id="${O}"><i class="map-iconfont icon-delete"></i></div>`;
       }
       (M = document.querySelector(".ol-selectable:has(.ol-tooltip-delete-button):last-child .ol-tooltip-delete-button")) == null || M.addEventListener("click", (O) => {
         var P;
         O.preventDefault(), O.stopPropagation();
         const R = (P = O.target) == null ? void 0 : P.getAttribute("data-id");
         R && W(R);
-      }), C.setOffset([0, -7]), y = null, x = null, A(), a && unByKey(a), (V = (F = l.getProps()) == null ? void 0 : F.lineDrawEnd) == null || V.call(F, n.value);
+      }), C.setOffset([0, -7]), m = null, p = null, A(), c && unByKey(c), (V = (N = l.getProps()) == null ? void 0 : N.lineDrawEnd) == null || V.call(N, n.value);
     });
   }, k = () => Math.random().toString(36).substring(2, 9);
-  let x, C;
+  let p, C;
   const A = () => {
-    x != null && x.parentNode && x.parentNode.removeChild(x), x = document.createElement("div"), x.className = "ol-tooltip ol-tooltip-measure", C = new Overlay({
-      element: x,
+    p != null && p.parentNode && p.parentNode.removeChild(p), p = document.createElement("div"), p.className = "ol-tooltip ol-tooltip-measure", C = new Overlay({
+      element: p,
       offset: [0, -15],
       positioning: "bottom-center",
       stopEvent: !1,
       insertFirst: !1
     }), e == null || e.addOverlay(C);
   }, H = () => {
-    t != null && t.parentNode && t.parentNode.removeChild(t), t = document.createElement("div"), t.className = "ol-tooltip hidden", N = new Overlay({
+    t != null && t.parentNode && t.parentNode.removeChild(t), t = document.createElement("div"), t.className = "ol-tooltip hidden", F = new Overlay({
       element: t,
       offset: [15, 0],
       positioning: "center-left"
-    }), e == null || e.addOverlay(N);
+    }), e == null || e.addOverlay(F);
   }, B = () => {
-    n.value.forEach((a, M) => {
+    n.value.forEach((c, M) => {
       var O, R;
-      const F = document.querySelectorAll(".ol-tooltip.ol-tooltip-static.ol-tooltip-measure");
-      F[M] && ((R = (O = F[M]) == null ? void 0 : O.parentNode) == null || R.removeChild(F[M]));
+      const N = document.querySelectorAll(".ol-tooltip.ol-tooltip-static.ol-tooltip-measure");
+      N[M] && ((R = (O = N[M]) == null ? void 0 : O.parentNode) == null || R.removeChild(N[M]));
       const V = o.getFeatures();
       V[M] && o.removeFeature(V[M]);
-    }), d(), enableDoubleClickZoom(e), L.value = !1;
-  }, W = (a) => {
-    var F, V, O, R;
-    const M = n.value.findIndex((P) => P.id === a);
+    }), d(), enableDoubleClickZoom(e), f.value = !1, changeCursor(e, "pointer");
+  }, W = (c) => {
+    var N, V, O, R;
+    const M = n.value.findIndex((P) => P.id === c);
     if (M !== -1) {
       n.value.splice(M, 1);
       const P = document.querySelectorAll(".ol-tooltip.ol-tooltip-static.ol-tooltip-measure");
-      P[M] && ((V = (F = P[M]) == null ? void 0 : F.parentNode) == null || V.removeChild(P[M]));
+      P[M] && ((V = (N = P[M]) == null ? void 0 : N.parentNode) == null || V.removeChild(P[M]));
       const Z = o.getFeatures();
       Z[M] && o.removeFeature(Z[M]);
     }
     (R = (O = l.getProps()) == null ? void 0 : O.lineDrawEnd) == null || R.call(O, n.value);
   }, d = () => {
-    if (n.value = [], document.querySelectorAll(".ol-tooltip.ol-tooltip-static").forEach((a) => {
+    if (n.value = [], document.querySelectorAll(".ol-tooltip.ol-tooltip-static").forEach((c) => {
       var M;
-      (M = a == null ? void 0 : a.parentNode) == null || M.removeChild(a);
-    }), o.clear(), f) {
-      const a = e.getInteractions().getArray().find((M) => getUid(M) === getUid(f));
-      a && e.removeInteraction(a);
+      (M = c == null ? void 0 : c.parentNode) == null || M.removeChild(c);
+    }), o.clear(), y) {
+      const c = e.getInteractions().getArray().find((M) => getUid(M) === getUid(y));
+      c && e.removeInteraction(c);
     }
-    e.removeLayer(r), t != null && t.parentNode && t.parentNode.removeChild(t), x != null && x.parentNode && x.parentNode.removeChild(x);
+    e.removeLayer(r), t != null && t.parentNode && t.parentNode.removeChild(t), p != null && p.parentNode && p.parentNode.removeChild(p);
   };
   return {
-    open: m,
+    open: v,
     close: B,
     deleteLine: W,
-    setUnit: c,
-    getState: () => L.value
+    setUnit: i,
+    getState: () => f.value
   };
 }, computedDistance = (e, l) => {
   const s = getLength(e);
-  let c = "";
+  let i = "";
   switch (l) {
     case "m":
-      c = `${Math.round(s * 100) / 100} m`;
+      i = `${Math.round(s * 100) / 100} m`;
       break;
     case "km":
-      c = `${Math.round(s / 1e3 * 100) / 100} km`;
+      i = `${Math.round(s / 1e3 * 100) / 100} km`;
       break;
     case "nm":
-      c = `${Math.round(s / 1.852 * 100) / 100} nm`;
+      i = `${Math.round(s / 1.852 * 100) / 100} nm`;
       break;
   }
-  return c;
+  return i;
 }, useDrawPolygonManager = (e, l) => {
   let n, s;
-  const c = () => {
+  const i = () => {
     t(), changeCursor(e, "crosshair");
   }, t = () => {
-    o(), x(), H(), $();
+    o(), p(), H(), $();
   };
-  let L = null, m = null;
+  let f = null, v = null;
   const o = () => {
-    if (L && m) return;
-    const d = new VectorSource(), w = new VectorLayer({
+    if (f && v) return;
+    const d = new VectorSource(), x = new VectorLayer({
       source: d,
       style: new Style({
         stroke: new Stroke({
@@ -1525,29 +1522,29 @@ const createLabelFeatureStyle = (e) => {
         })
       })
     });
-    L = w, m = d, e.on("pointermove", p), e.addLayer(w), e.on(["dblclick"], function(a) {
-      y && (a.stopPropagation(), a.preventDefault());
+    f = x, v = d, e.on("pointermove", L), e.addLayer(x), e.on(["dblclick"], function(c) {
+      m && (c.stopPropagation(), c.preventDefault());
     });
   };
   let r;
-  const p = (d) => {
+  const L = (d) => {
     if (d.dragging) return;
-    const w = r ? "单击继续，双击结束" : "点击选择起点";
-    C && (C.innerHTML = w, A.setPosition(d.coordinate));
+    const x = r ? "单击继续，双击结束" : "点击选择起点";
+    C && (C.innerHTML = x, A.setPosition(d.coordinate));
   };
-  let y, N = !1;
+  let m, F = !1;
   const $ = () => {
     if (n) {
       C != null && C.parentNode && C.parentNode.removeChild(C);
       const d = n.getGeometry();
       if (!d) return;
-      const w = f(d, "nm");
-      v && (v.innerHTML = `
-                    <span class="text">面积：${w}${N ? '<span class="error pl-12">超出可以绘画的距离</span>' : ""}</span>
-                `), v && (v.innerHTML += '<span class="delete-icon" ><i class="map-iconfont icon-delete" /></div>');
-      const a = d.getCoordinates(), M = a[0][a[0].length - 2];
-      if (k.setPosition(M), L) {
-        const V = L.getSource();
+      const x = y(d, "nm");
+      w && (w.innerHTML = `
+                    <span class="text">面积：${x}${F ? '<span class="error pl-12">超出可以绘画的距离</span>' : ""}</span>
+                `), w && (w.innerHTML += '<span class="delete-icon" ><i class="map-iconfont icon-delete" /></div>');
+      const c = d.getCoordinates(), M = c[0][c[0].length - 2];
+      if (k.setPosition(M), f) {
+        const V = f.getSource();
         V && n && (V.clear(), V.addFeature(n));
       }
       setTimeout(() => {
@@ -1557,13 +1554,13 @@ const createLabelFeatureStyle = (e) => {
           console.log("delete"), B(), (R = (O = l.getProps()) == null ? void 0 : O.areaDrawEnd) == null || R.call(O, []);
         });
       }, 0);
-      const F = getCenter(n.getGeometry().getExtent());
-      e == null || e.getView().setCenter(F);
+      const N = getCenter(n.getGeometry().getExtent());
+      e == null || e.getView().setCenter(N);
       return;
     }
-    y = new Draw({
+    m = new Draw({
       type: "Polygon",
-      source: m,
+      source: v,
       trace: !0,
       style: [new Style({
         stroke: new Stroke({
@@ -1582,28 +1579,28 @@ const createLabelFeatureStyle = (e) => {
           })
         }),
         geometry: function(d) {
-          const w = d.getGeometry().getCoordinates();
-          return new MultiPoint(w);
+          const x = d.getGeometry().getCoordinates();
+          return new MultiPoint(x);
         }
       })]
-    }), e == null || e.addInteraction(y), y.on("drawstart", (d) => {
-      var w;
-      r = d.feature, s = (w = r.getGeometry()) == null ? void 0 : w.on("change", (a) => {
-        const M = a.target, F = f(M, "nm"), O = M.getCoordinates()[0], R = new LineString([O[O.length - 2], O[O.length - 1]]), P = computedDistance(R, "nm");
-        if (N = Number(getLength(R) / 1e3) > 150, !F) return;
+    }), e == null || e.addInteraction(m), m.on("drawstart", (d) => {
+      var x;
+      r = d.feature, s = (x = r.getGeometry()) == null ? void 0 : x.on("change", (c) => {
+        const M = c.target, N = y(M, "nm"), O = M.getCoordinates()[0], R = new LineString([O[O.length - 2], O[O.length - 1]]), P = computedDistance(R, "nm");
+        if (F = Number(getLength(R) / 1e3) > 150, !N) return;
         const Z = '<span class="error pl-4">超出可以绘画的距离</span>';
-        v && (v.innerHTML = `
+        w && (w.innerHTML = `
                         <div class="text">
-                            面积：${F} 
-                            ${N ? Z : ""}
+                            面积：${N} 
+                            ${F ? Z : ""}
                         </div>
                     `), C && (C.innerHTML = `
                         <div class="text">
-                            面积：${F}
+                            面积：${N}
                         </div>
-                        <div class="text ${N ? "error" : ""}">
+                        <div class="text ${F ? "error" : ""}">
                             线段 ${O.length - 2}: ${P} 
-                            ${N ? Z : ""}
+                            ${F ? Z : ""}
                           
                         </div>
                           <div>
@@ -1611,35 +1608,35 @@ const createLabelFeatureStyle = (e) => {
                         </div>
                     `);
       });
-    }), y.on("drawend", (d) => {
-      var F, V, O, R;
+    }), m.on("drawend", (d) => {
+      var N, V, O, R;
       if (!d.feature.getGeometry()) return;
-      n = d.feature, v && (v.innerHTML += '<span class="delete-icon"><i class="map-iconfont icon-delete" /></div>'), k.setOffset([10, 0]);
-      const a = d.feature.getGeometry().getCoordinates(), M = a[0][a[0].length - 2];
-      if (k.setPosition(M), C != null && C.parentNode && C.parentNode.removeChild(C), (F = l.getProps()) != null && F.areaDrawEnd) {
-        const P = a[0].map((Z) => transform(Z, projection.mercator, projection.data));
+      n = d.feature, w && (w.innerHTML += '<span class="delete-icon"><i class="map-iconfont icon-delete" /></div>'), k.setOffset([10, 0]);
+      const c = d.feature.getGeometry().getCoordinates(), M = c[0][c[0].length - 2];
+      if (k.setPosition(M), C != null && C.parentNode && C.parentNode.removeChild(C), (N = l.getProps()) != null && N.areaDrawEnd) {
+        const P = c[0].map((Z) => transform(Z, projection.mercator, projection.data));
         (O = (V = l.getProps()) == null ? void 0 : V.areaDrawEnd) == null || O.call(V, P);
       }
-      y && (y.setActive(!1), e == null || e.removeInteraction(y), (e == null ? void 0 : e.getInteractions()).forEach((Z) => {
+      m && (m.setActive(!1), e == null || e.removeInteraction(m), (e == null ? void 0 : e.getInteractions()).forEach((Z) => {
         Z instanceof Draw && (Z.setActive(!1), e == null || e.removeInteraction(Z));
       })), s && unByKey(s), (R = document.querySelector(".delete-icon")) == null || R.addEventListener("click", () => {
         var P, Z;
         B(), (Z = (P = l.getProps()) == null ? void 0 : P.areaDrawEnd) == null || Z.call(P, []);
       });
     });
-  }, f = (d, w) => {
-    const a = getArea(d);
-    switch (w) {
+  }, y = (d, x) => {
+    const c = getArea(d);
+    switch (x) {
       case "km":
-        return a > 1e4 ? Math.round(a / 1e6 * 100) / 100 + " km<sup>2</sup>" : Math.round(a * 100) / 100 + " m<sup>2</sup>";
+        return c > 1e4 ? Math.round(c / 1e6 * 100) / 100 + " km<sup>2</sup>" : Math.round(c * 100) / 100 + " m<sup>2</sup>";
       case "nm":
-        return a > 1e4 ? Math.round(a / 1e6 / Math.pow(1.852, 2) * 100) / 100 + " nm<sup>2</sup>" : Math.round(a * 100) / 100 + " m<sup>2</sup>";
+        return c > 1e4 ? Math.round(c / 1e6 / Math.pow(1.852, 2) * 100) / 100 + " nm<sup>2</sup>" : Math.round(c * 100) / 100 + " m<sup>2</sup>";
     }
   };
-  let v, k;
-  const x = () => {
-    v != null && v.parentNode && v.parentNode.removeChild(v), v = document.createElement("div"), v.style.display = "flex", v.className = "ol-tooltip ol-tooltip-draw-polygon", k = new Overlay({
-      element: v,
+  let w, k;
+  const p = () => {
+    w != null && w.parentNode && w.parentNode.removeChild(w), w = document.createElement("div"), w.style.display = "flex", w.className = "ol-tooltip ol-tooltip-draw-polygon", k = new Overlay({
+      element: w,
       offset: [0, -15],
       positioning: "bottom-center",
       stopEvent: !1,
@@ -1654,40 +1651,40 @@ const createLabelFeatureStyle = (e) => {
       positioning: "center-left"
     }), e == null || e.addOverlay(A);
   }, B = () => {
-    m == null || m.clear(), n = null, x(), H(), $();
+    v == null || v.clear(), n = null, p(), H(), $();
   };
   return {
-    open: c,
+    open: i,
     close: () => {
-      m == null || m.clear(), m = null, L && (e.removeLayer(L), L = null), r = null, y && (y.setActive(!1), (e == null ? void 0 : e.getInteractions()).forEach((w) => {
-        w instanceof Draw && (w.setActive(!1), e == null || e.removeInteraction(w));
-      }), y = null), s && unByKey(s), C != null && C.parentElement && C.parentElement.removeChild(C), v != null && v.parentElement && v.parentElement.removeChild(v), A && e.removeOverlay(A), k && e.removeOverlay(k), changeCursor(e, "pointer");
+      v == null || v.clear(), v = null, f && (e.removeLayer(f), f = null), r = null, m && (m.setActive(!1), (e == null ? void 0 : e.getInteractions()).forEach((x) => {
+        x instanceof Draw && (x.setActive(!1), e == null || e.removeInteraction(x));
+      }), m = null), s && unByKey(s), C != null && C.parentElement && C.parentElement.removeChild(C), w != null && w.parentElement && w.parentElement.removeChild(w), A && e.removeOverlay(A), k && e.removeOverlay(k), changeCursor(e, "pointer");
     },
     reset: B
   };
 }, PORT_LAYER_CLASS_NAME = "zh-map-port-layer", usePortManager = (e) => {
   const l = e.getInstall();
-  let n, s, c = null, t = null;
-  const L = (f, v = !0) => {
-    if (!(!f || f.length === 0)) {
+  let n, s, i = null, t = null;
+  const f = (y, w = !0) => {
+    if (!(!y || y.length === 0)) {
       if (s || (s = new VectorSource()), s.clear(), t) {
-        const k = f.find((x) => x.id === t.id);
-        k ? t = k : f.push(t);
+        const k = y.find((p) => p.id === t.id);
+        k ? t = k : y.push(t);
       }
-      f.forEach((k) => {
-        m(k, v);
+      y.forEach((k) => {
+        v(k, w);
       }), n || (n = new VectorLayer({
         className: PORT_LAYER_CLASS_NAME,
         source: s,
         zIndex: 100
       }), l.addLayer(n));
     }
-  }, m = (f, v = !0) => {
-    const k = e.getZoom(), [x, C] = f.latLon.split(","), A = new Feature({
-      geometry: new Point(fromLonLat([Number(x), Number(C)]))
+  }, v = (y, w = !0) => {
+    const k = e.getZoom(), [p, C] = y.latLon.split(","), A = new Feature({
+      geometry: new Point(fromLonLat([Number(p), Number(C)]))
     });
-    A.setStyle(o(f, k, f.id === (t == null ? void 0 : t.id), v)), A.set("portData", f), s.addFeature(A);
-  }, o = (f, v, k, x = !0) => {
+    A.setStyle(o(y, k, y.id === (t == null ? void 0 : t.id), w)), A.set("portData", y), s.addFeature(A);
+  }, o = (y, w, k, p = !0) => {
     const C = (H) => `<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
                 <path fill-rule="evenodd" clip-rule="evenodd" d="M22.6563 44.9304C22.5453 44.8844 22.4445 44.817 22.3595 44.7321C22.3595 44.7321 9.36986 31.7424 9.32952 31.6913C7.09059 29.0791 5.64794 25.8802 5.17255 22.4736C4.69716 19.0671 5.20896 15.5957 6.64728 12.471C8.08561 9.34625 10.3902 6.69909 13.2878 4.84325C16.1855 2.98741 19.5548 2.00068 22.9965 2C26.4381 1.99932 29.8078 2.98473 32.7062 4.83943C35.6046 6.69414 37.9102 9.34039 39.3498 12.4646C40.7893 15.5888 41.3025 19.0599 40.8284 22.4666C40.3544 25.8734 38.913 29.0729 36.6751 31.686C36.6401 31.737 23.6531 44.7321 23.6531 44.7321C23.5682 44.817 23.4674 44.8844 23.3564 44.9304C23.2454 44.9763 23.1265 45 23.0063 45C22.8862 45 22.7673 44.9763 22.6563 44.9304Z" fill="${H}"/>
                 <g clip-path="url(#clip0_10059_122082)">
@@ -1700,9 +1697,15 @@ const createLabelFeatureStyle = (e) => {
                 </defs>
                 </svg>
             `, A = () => `data:image/svg+xml;utf8,${encodeURIComponent(C(k ? "#FF5733" : "#3370FF"))}`;
-    return x ? new Style({
+    return !p && !k ? new Style({
+      image: new Icon({
+        src: A(),
+        scale: 0.5 * w / 10
+      }),
+      zIndex: k ? 110 : 100
+    }) : new Style({
       text: new Text({
-        text: f.shortName,
+        text: y.shortName,
         font: "12px sans-serif",
         fill: new Fill({
           color: k ? "#ffffff" : "#000000"
@@ -1714,64 +1717,58 @@ const createLabelFeatureStyle = (e) => {
       }),
       image: new Icon({
         src: A(),
-        scale: 0.5 * v / 10
-      }),
-      zIndex: k ? 110 : 100
-    }) : new Style({
-      image: new Icon({
-        src: A(),
-        scale: 0.5 * v / 10
+        scale: 0.5 * w / 10
       }),
       zIndex: k ? 110 : 100
     });
   }, r = () => {
-    if (c) {
+    if (i) {
       console.log("清除非选中的港口");
-      const f = c.get("portData").id;
-      s.getFeatures().forEach((v) => {
-        v.get("portData").id !== f && s.removeFeature(v);
+      const y = i.get("portData").id;
+      s.getFeatures().forEach((w) => {
+        w.get("portData").id !== y && s.removeFeature(w);
       });
     } else
       console.log("清除所有港口", s), s == null || s.clear();
-  }, p = (f) => {
-    if (!f)
-      return y();
-    (c == null ? void 0 : c.get("portData").id) !== f.id && (y(), N(f));
-  }, y = () => {
-    if (c) {
-      const f = c == null ? void 0 : c.get("portData"), v = e.getZoom();
-      s.getFeatures().forEach((x) => {
-        x.get("portData").id === f.id && (x.setStyle(o(x.get("portData"), v, !1)), c = null);
+  }, L = (y) => {
+    if (!y)
+      return m();
+    (i == null ? void 0 : i.get("portData").id) !== y.id && (m(), F(y));
+  }, m = () => {
+    if (i) {
+      const y = i == null ? void 0 : i.get("portData"), w = e.getZoom();
+      s.getFeatures().forEach((p) => {
+        p.get("portData").id === y.id && (p.setStyle(o(p.get("portData"), w, !1)), i = null);
       });
     }
-  }, N = (f) => {
-    const v = s.getFeatures();
-    t = f, c = v.find((k) => k.get("portData").id === f.id), c == null || c.setStyle(o(f, e.getZoom(), !0));
+  }, F = (y) => {
+    const w = s.getFeatures();
+    t = y, i = w.find((k) => k.get("portData").id === y.id), i == null || i.setStyle(o(y, e.getZoom(), !0));
   };
   return {
-    render: L,
+    render: f,
     clear: r,
-    selected: p,
-    handlePortHover: (f) => {
-      const v = l == null ? void 0 : l.getTargetElement();
-      f && f.get("portData") && v && (v.style.cursor = "pointer");
+    selected: L,
+    handlePortHover: (y) => {
+      const w = l == null ? void 0 : l.getTargetElement();
+      y && y.get("portData") && w && (w.style.cursor = "pointer");
     }
   };
-}, useEventManager = (e, l, n, s, c, t) => {
-  const L = e.getInstall();
-  L.on("moveend", () => {
+}, useEventManager = (e, l, n, s, i, t) => {
+  const f = e.getInstall();
+  f.on("moveend", () => {
     var o, r;
-    const m = e.getZoom();
-    (r = (o = l.getProps()).mapMoveEnd) == null || r.call(o, m), n.reRenderTrackLine();
-  }), L.on("pointermove", (m) => {
-    const o = L.getEventPixel(m.originalEvent), r = L.forEachFeatureAtPixel(o, (p) => p);
-    s.handleShipMapEvent(r, "hover"), n.handleTrackMapEvent(r, "hover", m), r && c.handlePortHover(r);
-  }), L.on("movestart", () => {
+    const v = e.getZoom();
+    (r = (o = l.getProps()).mapMoveEnd) == null || r.call(o, v), n.reRenderTrackLine();
+  }), f.on("pointermove", (v) => {
+    const o = f.getEventPixel(v.originalEvent), r = f.forEachFeatureAtPixel(o, (L) => L);
+    s.handleShipMapEvent(r, "hover"), n.handleTrackMapEvent(r, "hover", v), r && i.handlePortHover(r);
+  }), f.on("movestart", () => {
     console.log("movestart-----------------------");
-  }), L.on("click", debounce((m) => {
-    var p, y, N;
+  }), f.on("click", debounce((v) => {
+    var L, m, F;
     if (console.log("1", t.getState()), t.getState()) return;
-    const o = L.getEventPixel(m.originalEvent), r = L.forEachFeatureAtPixel(
+    const o = f.getEventPixel(v.originalEvent), r = f.forEachFeatureAtPixel(
       o,
       ($) => {
         if ($ != null && $.get("shipData") || $ != null && $.get("portData"))
@@ -1779,48 +1776,48 @@ const createLabelFeatureStyle = (e) => {
       }
     );
     if (console.log("2", r), !!r) {
-      if (m.preventDefault(), m.stopPropagation(), r.get("shipData"))
-        s.handleShipMapEvent(r, "click", (p = l.getProps()) == null ? void 0 : p.selectShip);
+      if (v.preventDefault(), v.stopPropagation(), r.get("shipData"))
+        s.handleShipMapEvent(r, "click", (L = l.getProps()) == null ? void 0 : L.selectShip);
       else if (r.get("portData")) {
         const $ = r.get("portData");
-        c.selected($), (N = (y = l.getProps()) == null ? void 0 : y.selectPort) == null || N.call(y, $);
+        i.selected($), (F = (m = l.getProps()) == null ? void 0 : m.selectPort) == null || F.call(m, $);
       }
     }
   }, 150));
 }, useMapController = () => {
   const e = reactive([]);
   return {
-    createInstance: (s, c) => {
+    createInstance: (s, i) => {
       const t = useMapInitializer();
-      t.initMap(s, c);
-      const L = t.getInstall(), m = useLayerManager(L), o = usePropsManager();
-      o.setProps(c), m.setShowLayerType(c.layerType), m.setGreenTileVisible(c.showGreenLayer);
-      const r = useTrackManager(L), p = useCarTrackManager(L, r), y = useShipManager(L), N = usePositionManager(L), $ = useDrawLineManager(L, o), f = useDrawPolygonManager(L, o), v = usePortManager(t);
-      useEventManager(t, o, r, y, v, $);
+      t.initMap(s, i);
+      const f = t.getInstall(), v = useLayerManager(f), o = usePropsManager();
+      o.setProps(i), v.setShowLayerType(i.layerType), v.setGreenTileVisible(i.showGreenLayer);
+      const r = useTrackManager(f), L = useCarTrackManager(f, r), m = useShipManager(f), F = usePositionManager(f), $ = useDrawLineManager(f, o), y = useDrawPolygonManager(f, o), w = usePortManager(t);
+      useEventManager(t, o, r, m, w, $);
       const k = () => {
-        const C = L.getView().calculateExtent(t.getSize()), A = transform([C[0], C[1]], projection.mercator, projection.data), H = transform([C[2], C[3]], projection.mercator, projection.data);
+        const C = f.getView().calculateExtent(t.getSize()), A = transform([C[0], C[1]], projection.mercator, projection.data), H = transform([C[2], C[3]], projection.mercator, projection.data);
         return [A[0], A[1], H[0], H[1]];
-      }, x = {
+      }, p = {
         id: Symbol("map-instance"),
         innerMap: null,
         map: t.getInstall(),
         destroy: () => {
-          e.splice(e.indexOf(x), 1);
+          e.splice(e.indexOf(p), 1);
         },
         methods: {
           ...t,
-          layer: m,
-          ship: y,
+          layer: v,
+          ship: m,
           track: r,
-          carTrack: p,
+          carTrack: L,
           port: {
-            render: v.render,
-            clear: v.clear,
-            selected: v.selected
+            render: w.render,
+            clear: w.clear,
+            selected: w.selected
           },
-          position: N,
+          position: F,
           drawLine: $,
-          drawPolygon: f,
+          drawPolygon: y,
           // 子模块
           utils: {
             getCalculateExtent: k,
@@ -1829,11 +1826,11 @@ const createLabelFeatureStyle = (e) => {
           }
         }
       };
-      return e.push(x), x;
+      return e.push(p), p;
     },
     destroyInstance: (s) => {
-      const c = e.findIndex((t) => t.id === s);
-      c > -1 && (e[c].destroy(), e.splice(c, 1));
+      const i = e.findIndex((t) => t.id === s);
+      i > -1 && (e[i].destroy(), e.splice(i, 1));
     },
     destroyAll: () => {
       e.forEach((s) => s.destroy()), e.splice(0, e.length);
@@ -1860,16 +1857,16 @@ const createLabelFeatureStyle = (e) => {
     } }
   },
   setup(e, { expose: l }) {
-    const n = ref(), s = ref(), c = useMapController(), t = ref(), L = e, m = ref({
+    const n = ref(), s = ref(), i = useMapController(), t = ref(), f = e, v = ref({
       getInstall() {
       }
     });
     return onMounted(() => {
       var o;
-      t.value = c.createInstance(n.value, L), console.log(" instance.value?.methods", t.value.map), m.value = t.value.methods, (o = s.value) == null || o.setScaleLine(t.value.map, L.scaleLineUnit);
+      t.value = i.createInstance(n.value, f), console.log(" instance.value?.methods", t.value.map), v.value = t.value.methods, (o = s.value) == null || o.setScaleLine(t.value.map, f.scaleLineUnit);
     }), onUnmounted(() => {
       var o, r;
-      c.destroyInstance((o = t == null ? void 0 : t.value) == null ? void 0 : o.id), (r = t.value) == null || r.destroy();
+      i.destroyInstance((o = t == null ? void 0 : t.value) == null ? void 0 : o.id), (r = t.value) == null || r.destroy();
     }), l({
       getZoom: () => {
         var o;
@@ -1888,16 +1885,16 @@ const createLabelFeatureStyle = (e) => {
         return (o = t.value) == null ? void 0 : o.methods.getView();
       },
       setCenter: (o, r) => {
-        var p;
-        return (p = t.value) == null ? void 0 : p.methods.setCenter(o, r);
+        var L;
+        return (L = t.value) == null ? void 0 : L.methods.setCenter(o, r);
       },
       getSize: () => {
         var o;
         return (o = t.value) == null ? void 0 : o.methods.getSize();
       },
       getCenter: (o, r) => {
-        var p;
-        return (p = t.value) == null ? void 0 : p.methods.getCenter();
+        var L;
+        return (L = t.value) == null ? void 0 : L.methods.getCenter();
       },
       layer: {
         setGreenTileVisible: (o) => {
@@ -1993,8 +1990,8 @@ const createLabelFeatureStyle = (e) => {
       },
       port: {
         render: (o, r) => {
-          var p;
-          return (p = t.value) == null ? void 0 : p.methods.port.render(o, r);
+          var L;
+          return (L = t.value) == null ? void 0 : L.methods.port.render(o, r);
         },
         clear: () => {
           var o;
@@ -2070,8 +2067,8 @@ const createLabelFeatureStyle = (e) => {
           return (r = t.value) == null ? void 0 : r.methods.utils.convertSixHundredThousandToLatLng(...o);
         },
         calculateCirclePoints: (o, r) => {
-          var p;
-          return (p = t.value) == null ? void 0 : p.methods.utils.calculateCirclePoints(o, r);
+          var L;
+          return (L = t.value) == null ? void 0 : L.methods.utils.calculateCirclePoints(o, r);
         }
       }
     }), (o, r) => (openBlock(), createElementBlock("div", _hoisted_1, [