vue-openlayers-plugin 1.0.88 → 1.0.89

package/lib/{index-30ef3c66.mjs → index-05da77ba.mjs}

@@ -389,22 +389,6 @@ var _sfc_main106 = /* @__PURE__ */ defineComponent({
   }
 });
 var flag_default = _sfc_main106;
-var _sfc_main107 = /* @__PURE__ */ defineComponent({
-  name: "Fold",
-  __name: "fold",
-  setup(__props) {
-    return (_ctx, _cache) => (openBlock(), createElementBlock("svg", {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 1024 1024"
-    }, [
-      createElementVNode("path", {
-        fill: "currentColor",
-        d: "M896 192H128v128h768zm0 256H384v128h512zm0 256H128v128h768zM320 384 128 512l192 128z"
-      })
-    ]));
-  }
-});
-var fold_default = _sfc_main107;
 var _sfc_main111 = /* @__PURE__ */ defineComponent({
   name: "FolderOpened",
   __name: "folder-opened",
@@ -80062,21 +80046,6 @@ let BaseLayer$2 = class BaseLayer2 {
       this.layer.setOpacity(normalizedOpacity);
     }
   }
-  /**
-   * 设置图层层级
-   */
-  setZIndex(zIndex2) {
-    if (this.layer) {
-      this.layer.setZIndex(zIndex2);
-    }
-  }
-  /**
-   * 获取当前图层层级
-   */
-  getZIndex() {
-    var _a3;
-    return (_a3 = this.layer) == null ? void 0 : _a3.getZIndex();
-  }
   /**
    * 设置图层可见性
    */
@@ -466359,7 +466328,7 @@ const _hoisted_3$d = {
 };
 const _hoisted_4$c = { class: "image-popup-main" };
 const _hoisted_5$c = { class: "image-container" };
-const _hoisted_6$a = ["src", "alt"];
+const _hoisted_6$9 = ["src", "alt"];
 const _hoisted_7$9 = {
   key: 0,
   class: "image-loading"
@@ -466382,12 +466351,12 @@ const _hoisted_11$7 = {
 };
 const _hoisted_12$7 = ["onClick"];
 const _hoisted_13$7 = ["src", "alt"];
-const _hoisted_14$6 = {
+const _hoisted_14$5 = {
   key: 3,
   class: "slideshow-controls"
 };
-const _hoisted_15$5 = { class: "fullscreen-container" };
-const _hoisted_16$5 = ["src", "alt"];
+const _hoisted_15$4 = { class: "fullscreen-container" };
+const _hoisted_16$4 = ["src", "alt"];
 const _sfc_main$g = /* @__PURE__ */ defineComponent({
   __name: "ImagePopup",
   props: {
@@ -466544,7 +466513,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
                   onLoad: handleImageLoad,
                   onError: handleImageError,
                   onClick: handleImageClick
-                }, null, 40, _hoisted_6$a),
+                }, null, 40, _hoisted_6$9),
                 imageLoading.value ? (openBlock(), createElementBlock("div", _hoisted_7$9, [..._cache[4] || (_cache[4] = [
                   createElementVNode("div", { class: "loading-spinner" }, null, -1),
                   createElementVNode("span", null, "加载中...", -1)
@@ -466595,7 +466564,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
                 ], 10, _hoisted_12$7);
               }), 128))
             ])) : createCommentVNode("", true),
-            _ctx.config.slideshow && imageList.value.length > 1 ? (openBlock(), createElementBlock("div", _hoisted_14$6, [
+            _ctx.config.slideshow && imageList.value.length > 1 ? (openBlock(), createElementBlock("div", _hoisted_14$5, [
               createVNode$1(unref(ElButton), {
                 class: normalizeClass(["slideshow-btn", { active: isSlideshow.value }]),
                 onClick: toggleSlideshow,
@@ -466614,14 +466583,14 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
             class: "image-fullscreen",
             onClick: closeFullscreen
           }, [
-            createElementVNode("div", _hoisted_15$5, [
+            createElementVNode("div", _hoisted_15$4, [
               createElementVNode("img", {
                 src: currentImage.value,
                 alt: `全屏图片 ${currentIndex.value + 1}`,
                 class: "fullscreen-image",
                 onClick: _cache[0] || (_cache[0] = withModifiers(() => {
                 }, ["stop"]))
-              }, null, 8, _hoisted_16$5),
+              }, null, 8, _hoisted_16$4),
               createVNode$1(unref(ElButton), {
                 class: "fullscreen-close",
                 onClick: closeFullscreen,
@@ -466659,7 +466628,7 @@ const _hoisted_5$b = {
   key: 3,
   class: "search-container"
 };
-const _hoisted_6$9 = {
+const _hoisted_6$8 = {
   key: 4,
   class: "data-stats"
 };
@@ -466676,19 +466645,19 @@ const _hoisted_12$6 = {
   class: "sort-indicator"
 };
 const _hoisted_13$6 = ["onClick"];
-const _hoisted_14$5 = { key: 0 };
-const _hoisted_15$4 = ["src", "alt"];
-const _hoisted_16$4 = { key: 1 };
-const _hoisted_17$4 = ["href"];
-const _hoisted_18$4 = { key: 2 };
-const _hoisted_19$3 = { key: 3 };
-const _hoisted_20$3 = { key: 4 };
-const _hoisted_21$3 = {
+const _hoisted_14$4 = { key: 0 };
+const _hoisted_15$3 = ["src", "alt"];
+const _hoisted_16$3 = { key: 1 };
+const _hoisted_17$3 = ["href"];
+const _hoisted_18$3 = { key: 2 };
+const _hoisted_19$2 = { key: 3 };
+const _hoisted_20$2 = { key: 4 };
+const _hoisted_21$2 = {
   key: 6,
   class: "list-view"
 };
-const _hoisted_22$2 = ["onClick"];
-const _hoisted_23$2 = { class: "field-label" };
+const _hoisted_22$1 = ["onClick"];
+const _hoisted_23$1 = { class: "field-label" };
 const _hoisted_24$1 = { class: "field-value" };
 const _hoisted_25$1 = ["src", "alt"];
 const _hoisted_26$1 = ["href"];
@@ -466923,7 +466892,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
                 clearable: ""
               }, null, 8, ["modelValue"])
             ])) : createCommentVNode("", true),
-            _ctx.config.showStats ? (openBlock(), createElementBlock("div", _hoisted_6$9, [
+            _ctx.config.showStats ? (openBlock(), createElementBlock("div", _hoisted_6$8, [
               createElementVNode("span", null, "共 " + toDisplayString(filteredData.value.length) + " 条记录", 1),
               searchQuery.value ? (openBlock(), createElementBlock("span", _hoisted_7$8, "（已过滤 " + toDisplayString(arrayData.value.length - filteredData.value.length) + " 条）", 1)) : createCommentVNode("", true)
             ])) : createCommentVNode("", true),
@@ -466954,19 +466923,19 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
                           return openBlock(), createElementBlock("td", {
                             key: field.key
                           }, [
-                            field.type === "image" ? (openBlock(), createElementBlock("span", _hoisted_14$5, [
+                            field.type === "image" ? (openBlock(), createElementBlock("span", _hoisted_14$4, [
                               createElementVNode("img", {
                                 src: getFieldValue(item, field.key || field.name),
                                 alt: field.label,
                                 class: "table-image"
-                              }, null, 8, _hoisted_15$4)
-                            ])) : field.type === "link" ? (openBlock(), createElementBlock("span", _hoisted_16$4, [
+                              }, null, 8, _hoisted_15$3)
+                            ])) : field.type === "link" ? (openBlock(), createElementBlock("span", _hoisted_16$3, [
                               createElementVNode("a", {
                                 href: getFieldValue(item, field.key || field.name),
                                 target: "_blank",
                                 class: "table-link"
-                              }, toDisplayString(getFieldValue(item, field.key || field.name)), 9, _hoisted_17$4)
-                            ])) : field.type === "date" ? (openBlock(), createElementBlock("span", _hoisted_18$4, toDisplayString(formatDate(getFieldValue(item, field.key || field.name))), 1)) : field.type === "number" ? (openBlock(), createElementBlock("span", _hoisted_19$3, toDisplayString(formatNumber2(getFieldValue(item, field.key || field.name))), 1)) : (openBlock(), createElementBlock("span", _hoisted_20$3, toDisplayString(getFieldValue(item, field.key || field.name)), 1))
+                              }, toDisplayString(getFieldValue(item, field.key || field.name)), 9, _hoisted_17$3)
+                            ])) : field.type === "date" ? (openBlock(), createElementBlock("span", _hoisted_18$3, toDisplayString(formatDate(getFieldValue(item, field.key || field.name))), 1)) : field.type === "number" ? (openBlock(), createElementBlock("span", _hoisted_19$2, toDisplayString(formatNumber2(getFieldValue(item, field.key || field.name))), 1)) : (openBlock(), createElementBlock("span", _hoisted_20$2, toDisplayString(getFieldValue(item, field.key || field.name)), 1))
                           ]);
                         }), 128))
                       ], 8, _hoisted_13$6);
@@ -466975,7 +466944,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
                 ])
               ])
             ])) : createCommentVNode("", true),
-            currentView.value === "list" ? (openBlock(), createElementBlock("div", _hoisted_21$3, [
+            currentView.value === "list" ? (openBlock(), createElementBlock("div", _hoisted_21$2, [
               (openBlock(true), createElementBlock(Fragment, null, renderList(paginatedData.value, (item, index2) => {
                 return openBlock(), createElementBlock("div", {
                   key: index2,
@@ -466987,7 +466956,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
                       key: field.key,
                       class: "list-field"
                     }, [
-                      createElementVNode("span", _hoisted_23$2, toDisplayString(field.label) + ":", 1),
+                      createElementVNode("span", _hoisted_23$1, toDisplayString(field.label) + ":", 1),
                       createElementVNode("span", _hoisted_24$1, [
                         field.type === "image" ? (openBlock(), createElementBlock("img", {
                           key: 0,
@@ -467003,7 +466972,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
                       ])
                     ]);
                   }), 128))
-                ], 8, _hoisted_22$2);
+                ], 8, _hoisted_22$1);
               }), 128))
             ])) : createCommentVNode("", true),
             currentView.value === "card" ? (openBlock(), createElementBlock("div", _hoisted_30$1, [
@@ -468745,16 +468714,16 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
   }
 });
 const defaultComponents = {
-  "measurement": () => import("./MeasurementDialog-48a220c5.mjs"),
-  "basemap": () => import("./BasemapPanel-ca055f97.mjs"),
-  "print": () => import("./MapPrintDialog-cde4a9cc.mjs"),
-  "layer-panel": () => import("./LayerPanel-467aaf4a.mjs"),
-  "coordinate": () => import("./CoordinateLocationDialog-bcb93549.mjs"),
+  "measurement": () => import("./MeasurementDialog-7fce097a.mjs"),
+  "basemap": () => import("./BasemapPanel-cba3afd6.mjs"),
+  "print": () => import("./MapPrintDialog-03c0823b.mjs"),
+  "layer-panel": () => import("./LayerPanel-be35370b.mjs"),
+  "coordinate": () => import("./CoordinateLocationDialog-6e8a5f24.mjs"),
   "region-navigation": () => import("./RegionNavigationDialog-0808549f.mjs"),
-  "my-markers": () => import("./MyMarkersDialog-6cd29bfa.mjs"),
-  "view-bookmarks": () => import("./ViewBookmarksDialog-2e388ac1.mjs"),
-  "map-drawing": () => import("./index-9a7511e2.mjs"),
-  "filter-panel": () => import("./FilterPanel-5493db0e.mjs")
+  "my-markers": () => import("./MyMarkersDialog-7dd24d9a.mjs"),
+  "view-bookmarks": () => import("./ViewBookmarksDialog-60c9e851.mjs"),
+  "map-drawing": () => import("./index-7aae577e.mjs"),
+  "filter-panel": () => import("./FilterPanel-9a8e2aca.mjs")
 };
 const _DialogRegistry = class _DialogRegistry {
   constructor() {
@@ -469133,7 +469102,7 @@ const _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const OlDrawToolbar = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-65f64ab9"]]);
+const OlDrawToolbar = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-b8c938a3"]]);
 const TIANDITU_CONFIG = {
   baseUrl: "https://api.tianditu.gov.cn/v2/search",
   key: "9a7244dd5d1a1299a52946a3d0f8ff68"
@@ -469864,7 +469833,7 @@ const _hoisted_3$a = {
 };
 const _hoisted_4$a = { class: "section-title" };
 const _hoisted_5$a = ["onClick"];
-const _hoisted_6$8 = { class: "item-content" };
+const _hoisted_6$7 = { class: "item-content" };
 const _hoisted_7$7 = { class: "item-name" };
 const _hoisted_8$7 = { class: "item-address" };
 const _hoisted_9$6 = {
@@ -469878,17 +469847,17 @@ const _hoisted_10$6 = {
 const _hoisted_11$5 = { class: "result-count" };
 const _hoisted_12$5 = ["onClick"];
 const _hoisted_13$5 = { class: "item-content" };
-const _hoisted_14$4 = ["innerHTML"];
-const _hoisted_15$3 = ["innerHTML"];
-const _hoisted_16$3 = {
+const _hoisted_14$3 = ["innerHTML"];
+const _hoisted_15$2 = ["innerHTML"];
+const _hoisted_16$2 = {
   key: 0,
   class: "item-type"
 };
-const _hoisted_17$3 = {
+const _hoisted_17$2 = {
   key: 0,
   class: "item-confidence"
 };
-const _hoisted_18$3 = {
+const _hoisted_18$2 = {
   key: 0,
   class: "no-results"
 };
@@ -470239,7 +470208,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
                       ]),
                       _: 1
                     }),
-                    createElementVNode("div", _hoisted_6$8, [
+                    createElementVNode("div", _hoisted_6$7, [
                       createElementVNode("div", _hoisted_7$7, toDisplayString(item.name), 1),
                       createElementVNode("div", _hoisted_8$7, toDisplayString(item.address), 1)
                     ])
@@ -470281,14 +470250,14 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
                       createElementVNode("div", {
                         class: "item-name",
                         innerHTML: highlightText(result.name, searchQuery.value)
-                      }, null, 8, _hoisted_14$4),
+                      }, null, 8, _hoisted_14$3),
                       createElementVNode("div", {
                         class: "item-address",
                         innerHTML: highlightText(result.address, searchQuery.value)
-                      }, null, 8, _hoisted_15$3),
-                      result.type ? (openBlock(), createElementBlock("div", _hoisted_16$3, toDisplayString(result.type), 1)) : createCommentVNode("", true)
+                      }, null, 8, _hoisted_15$2),
+                      result.type ? (openBlock(), createElementBlock("div", _hoisted_16$2, toDisplayString(result.type), 1)) : createCommentVNode("", true)
                     ]),
-                    result.confidence ? (openBlock(), createElementBlock("div", _hoisted_17$3, toDisplayString(Math.round(result.confidence * 100)) + "%", 1)) : createCommentVNode("", true)
+                    result.confidence ? (openBlock(), createElementBlock("div", _hoisted_17$2, toDisplayString(Math.round(result.confidence * 100)) + "%", 1)) : createCommentVNode("", true)
                   ], 10, _hoisted_12$5)
                 ]);
               }), 128))
@@ -470298,7 +470267,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
               searchResults: searchResults.value,
               isLoading: isLoading.value
             }, () => [
-              searchQuery.value && searchResults.value.length === 0 && !isLoading.value ? (openBlock(), createElementBlock("div", _hoisted_18$3, [
+              searchQuery.value && searchResults.value.length === 0 && !isLoading.value ? (openBlock(), createElementBlock("div", _hoisted_18$2, [
                 createVNode$1(unref(ElIcon), null, {
                   default: withCtx(() => [
                     createVNode$1(unref(info_filled_default))
@@ -470994,366 +470963,289 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const OlControlPanel = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-e2bbe659"]]);
-const _hoisted_1$a = { class: "flex items-center justify-between px-4 py-3 border-b border-gray-200 bg-gray-50 rounded-t-lg" };
-const _hoisted_2$9 = { class: "panel-actions" };
-const _hoisted_3$9 = { class: "panel-content max-h-125 overflow-y-auto" };
-const _hoisted_4$9 = { class: "p-2" };
-const _hoisted_5$9 = { class: "legend-content p-2" };
-const _hoisted_6$7 = { key: 0 };
-const _hoisted_7$6 = { class: "text-xs text-gray-600" };
-const _hoisted_8$6 = { key: 1 };
-const _hoisted_9$5 = { class: "text-xs text-gray-600" };
-const _hoisted_10$5 = { key: 2 };
-const _hoisted_11$4 = { class: "relative mb-2" };
-const _hoisted_12$4 = { class: "flex justify-between mt-1 text-xs text-gray-500" };
-const _hoisted_13$4 = { class: "text-center text-xs text-gray-500" };
-const _hoisted_14$3 = { key: 3 };
-const _hoisted_15$2 = { class: "flex-1 text-xs text-gray-600" };
-const _hoisted_16$2 = { key: 4 };
-const _hoisted_17$2 = ["src", "alt"];
-const _hoisted_18$2 = {
-  key: 1,
-  class: "w-4 h-4 mr-2 border border-gray-300 rounded-sm bg-gray-100"
+const OlControlPanel = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-2fc6cae7"]]);
+const _hoisted_1$a = { class: "ol-legend-header" };
+const _hoisted_2$9 = { class: "header-actions" };
+const _hoisted_3$9 = { class: "ol-legend-body custom-scrollbar" };
+const _hoisted_4$9 = ["title"];
+const _hoisted_5$9 = { class: "legend-content" };
+const _hoisted_6$6 = {
+  key: 0,
+  class: "legend-gradient-box"
 };
-const _hoisted_19$2 = { class: "text-xs text-gray-600" };
-const _hoisted_20$2 = {
-  key: 5,
-  class: "text-xs text-gray-600 leading-relaxed"
+const _hoisted_7$6 = { class: "gradient-labels" };
+const _hoisted_8$6 = {
+  key: 0,
+  class: "gradient-unit"
 };
-const _hoisted_21$2 = ["innerHTML"];
-const _hoisted_22$1 = {
-  key: 6,
-  class: "text-xs text-gray-500 leading-relaxed mt-2"
+const _hoisted_9$5 = ["innerHTML"];
+const _hoisted_10$5 = ["src"];
+const _hoisted_11$4 = ["title"];
+const _hoisted_12$4 = {
+  key: 3,
+  class: "legend-desc"
 };
-const _hoisted_23$1 = {
+const _hoisted_13$4 = {
   key: 1,
-  class: "py-10 px-5 text-center"
+  class: "empty-state"
 };
 const _sfc_main$a = /* @__PURE__ */ defineComponent({
   __name: "OlLegendPanel",
   props: {
-    position: { default: "right" },
-    width: { default: 280 },
-    collapsible: { type: Boolean, default: true },
+    position: { default: "left" },
+    width: { default: 260 },
     defaultCollapsed: { type: Boolean, default: false },
     showOnlyVisible: { type: Boolean, default: true },
-    visible: { type: Boolean, default: false },
-    leftOffset: { default: void 0 },
-    rightOffset: { default: void 0 },
-    topOffset: { default: void 0 },
-    bottomOffset: { default: void 0 }
+    leftOffset: {},
+    rightOffset: {},
+    topOffset: {},
+    bottomOffset: {}
   },
-  emits: ["update:visible"],
-  setup(__props, { emit: __emit }) {
+  setup(__props) {
     const props = __props;
-    const activeNames = ref([]);
     const isCollapsed = ref(props.defaultCollapsed);
-    const visibleLayerIds = ref([]);
+    const activeNames = ref([]);
     const legends = ref([]);
-    const handleLayersInitialized = (layers) => {
-      console.log("Layers initialized, updating legends", layers);
-      initializeLegendsFromConfig(layers);
-    };
-    layerEventBus.on("layers-initialized", handleLayersInitialized);
+    const visibleLayerIds = ref([]);
     const panelStyle = computed(() => {
-      const styles = {
-        width: `${props.width}px`
+      const style = {
+        width: `${props.width}px`,
+        backgroundColor: "var(--el-bg-color-overlay)",
+        backdropFilter: "blur(10px)"
+      };
+      const setOffset = (key, value) => {
+        if (value !== void 0)
+          style[key] = typeof value === "number" ? `${value}px` : value;
+      };
+      setOffset("top", props.topOffset);
+      setOffset("bottom", props.bottomOffset);
+      if (props.leftOffset !== void 0)
+        setOffset("left", props.leftOffset);
+      else if (props.rightOffset !== void 0)
+        setOffset("right", props.rightOffset);
+      else
+        style[props.position] = "20px";
+      if (!style.top && !style.bottom)
+        style.bottom = "100px";
+      return style;
+    });
+    const visibleLegends = computed(() => {
+      const list2 = props.showOnlyVisible ? legends.value.filter((l2) => visibleLayerIds.value.includes(l2.layerId)) : legends.value;
+      return list2;
+    });
+    const shouldShowLegend = computed(() => visibleLegends.value.length > 0);
+    const getGradientStyle = (legend) => {
+      var _a3;
+      if ((_a3 = legend.colors) == null ? void 0 : _a3.length) {
+        return { background: `linear-gradient(to right, ${legend.colors.join(", ")})` };
+      }
+      return {};
+    };
+    const getIconWrapperStyle = (type, item) => {
+      const size2 = item.size || 16;
+      return {
+        width: `${size2}px`,
+        height: `${size2}px`,
+        minWidth: `${size2}px`
+        // 防止压缩
       };
-      if (props.leftOffset !== void 0) {
-        styles.left = typeof props.leftOffset === "number" ? `${props.leftOffset}px` : props.leftOffset;
-      } else if (props.rightOffset !== void 0) {
-        styles.right = typeof props.rightOffset === "number" ? `${props.rightOffset}px` : props.rightOffset;
+    };
+    const getSymbolInnerStyle = (type, item) => {
+      const style = {
+        width: "100%",
+        height: "100%",
+        backgroundColor: item.color || "#ccc"
+      };
+      if (type === "symbol" && item.shape) {
+        if (item.shape === "circle")
+          style.borderRadius = "50%";
+        else if (item.shape === "triangle")
+          style.clipPath = "polygon(50% 0%, 0% 100%, 100% 100%)";
+        else
+          style.borderRadius = "2px";
       } else {
-        styles[props.position] = "0";
-      }
-      if (props.topOffset !== void 0) {
-        styles.top = typeof props.topOffset === "number" ? `${props.topOffset}px` : props.topOffset;
+        style.borderRadius = "2px";
       }
-      if (props.bottomOffset !== void 0) {
-        styles.bottom = typeof props.bottomOffset === "number" ? `${props.bottomOffset}px` : props.bottomOffset;
+      if (item.borderColor) {
+        style.border = `1px solid ${item.borderColor}`;
+        style.boxSizing = "border-box";
       }
-      return styles;
-    });
-    const visibleLegends = computed(() => {
-      if (!props.showOnlyVisible) {
-        return legends.value;
+      if (item.pattern) {
+        style.backgroundImage = `url(${item.pattern})`;
+        style.backgroundSize = "cover";
       }
-      return legends.value.filter(
-        (legend) => visibleLayerIds.value.includes(legend.layerId)
-      );
-    });
-    const shouldShowLegend = computed(() => {
-      return visibleLegends.value.length > 0;
-    });
-    const toggleCollapse = () => {
-      isCollapsed.value = !isCollapsed.value;
+      return style;
     };
-    const initializeLegendsFromConfig = (layers) => {
+    const toggleCollapse = () => isCollapsed.value = !isCollapsed.value;
+    const handleImageError = (e8) => e8.target.style.display = "none";
+    const updateLegends = (layers) => {
       const newLegends = [];
-      const newVisibleLayerIds = [];
+      const newVisibleIds = [];
       layers.forEach((layer2) => {
         var _a3;
-        if (layer2.visible) {
-          newVisibleLayerIds.push(layer2.id);
-        }
-        const legendConfig = layer2.legend || ((_a3 = layer2.config) == null ? void 0 : _a3.legend);
-        if (legendConfig) {
-          const newLegend = {
+        if (layer2.visible)
+          newVisibleIds.push(layer2.id);
+        const config = layer2.legend || ((_a3 = layer2.config) == null ? void 0 : _a3.legend);
+        if (config) {
+          newLegends.push({
             layerId: layer2.id,
-            title: legendConfig.title || layer2.name || layer2.id,
-            items: legendConfig.items || [],
+            title: config.title || layer2.name || layer2.id,
+            items: config.items || [],
             visible: layer2.visible,
-            type: legendConfig.type || "color"
-            // 默认类型为color
-          };
-          newLegends.push(newLegend);
+            type: config.type || "color",
+            colors: config.colors,
+            min: config.min,
+            max: config.max,
+            unit: config.unit,
+            content: config.content,
+            description: config.description
+          });
+          if (!activeNames.value.includes(layer2.id))
+            activeNames.value.push(layer2.id);
         }
       });
       legends.value = newLegends;
-      visibleLayerIds.value = newVisibleLayerIds;
+      visibleLayerIds.value = newVisibleIds;
     };
-    const handleLayerVisibilityChange = (event) => {
-      if (event.visible) {
-        if (!visibleLayerIds.value.includes(event.layerId)) {
-          visibleLayerIds.value.push(event.layerId);
-        }
+    const handleLayerVisibility = ({ layerId, visible }) => {
+      if (visible) {
+        if (!visibleLayerIds.value.includes(layerId))
+          visibleLayerIds.value.push(layerId);
       } else {
-        const index2 = visibleLayerIds.value.indexOf(event.layerId);
-        if (index2 > -1) {
-          visibleLayerIds.value.splice(index2, 1);
-        }
-      }
-      const legendIndex = legends.value.findIndex((legend) => legend.layerId === event.layerId);
-      if (legendIndex > -1) {
-        legends.value[legendIndex].visible = event.visible;
+        visibleLayerIds.value = visibleLayerIds.value.filter((id) => id !== layerId);
       }
     };
-    const handleLayerAdded = (event) => {
-      var _a3;
-      const layerConfig = event.layerConfig;
-      if (layerConfig) {
-        const legendConfig = layerConfig.legend || ((_a3 = layerConfig.config) == null ? void 0 : _a3.legend);
-        if (legendConfig) {
-          const newLegend = {
-            layerId: event.layerId,
-            title: legendConfig.title || layerConfig.name || event.layerName,
-            items: legendConfig.items || [],
-            visible: event.visible,
-            type: legendConfig.type || "color"
-            // 默认类型为color
-          };
-          legends.value.push(newLegend);
-          if (event.visible) {
-            visibleLayerIds.value.push(event.layerId);
-          }
-        }
+    const handleLayerAdded = (evt) => {
+      var _a3, _b3, _c2;
+      const config = ((_a3 = evt.layerConfig) == null ? void 0 : _a3.legend) || ((_c2 = (_b3 = evt.layerConfig) == null ? void 0 : _b3.config) == null ? void 0 : _c2.legend);
+      if (config) {
+        legends.value.push({
+          layerId: evt.layerId,
+          title: config.title || evt.layerName,
+          items: config.items || [],
+          visible: evt.visible,
+          type: config.type || "color"
+        });
+        if (evt.visible)
+          visibleLayerIds.value.push(evt.layerId);
+        activeNames.value.push(evt.layerId);
       }
     };
-    const handleLayerRemoved = (event) => {
-      const legendIndex = legends.value.findIndex((legend) => legend.layerId === event.layerId);
-      if (legendIndex > -1) {
-        legends.value.splice(legendIndex, 1);
-      }
-      const visibleIndex = visibleLayerIds.value.indexOf(event.layerId);
-      if (visibleIndex > -1) {
-        visibleLayerIds.value.splice(visibleIndex, 1);
-      }
+    const handleLayerRemoved = ({ layerId }) => {
+      legends.value = legends.value.filter((l2) => l2.layerId !== layerId);
+      visibleLayerIds.value = visibleLayerIds.value.filter((id) => id !== layerId);
     };
     onMounted(() => {
-      console.log("LegendPanel mounted");
-      layerEventBus.on("layer-visibility-change", handleLayerVisibilityChange);
+      layerEventBus.on("layers-initialized", updateLegends);
+      layerEventBus.on("layer-visibility-change", handleLayerVisibility);
       layerEventBus.on("layer-added", handleLayerAdded);
       layerEventBus.on("layer-removed", handleLayerRemoved);
     });
     onUnmounted(() => {
-      layerEventBus.off("layer-visibility-change", handleLayerVisibilityChange);
+      layerEventBus.off("layers-initialized", updateLegends);
+      layerEventBus.off("layer-visibility-change", handleLayerVisibility);
       layerEventBus.off("layer-added", handleLayerAdded);
       layerEventBus.off("layer-removed", handleLayerRemoved);
-      layerEventBus.off("layers-initialized", handleLayersInitialized);
     });
-    const getSymbolStyle = (item) => {
-      const style = {};
-      if (item.shape === "circle") {
-        style.borderRadius = "50%";
-      } else if (item.shape === "square") {
-        style.borderRadius = "2px";
-      } else if (item.shape === "triangle") {
-        style.clipPath = "polygon(50% 0%, 0% 100%, 100% 100%)";
-      }
-      if (item.color) {
-        style.backgroundColor = item.color;
-      }
-      if (item.borderColor) {
-        style.border = `2px solid ${item.borderColor}`;
-      }
-      if (item.size) {
-        style.width = `${item.size}px`;
-        style.height = `${item.size}px`;
-      }
-      return style;
-    };
-    const getGradientStyle = (legend) => {
-      if (legend.colors && legend.colors.length > 1) {
-        const gradient2 = legend.colors.join(", ");
-        return {
-          background: `linear-gradient(to right, ${gradient2})`
-        };
-      }
-      return {};
-    };
-    const getCategoryStyle = (item) => {
-      const style = {
-        width: "16px",
-        height: "16px",
-        borderRadius: "2px"
-      };
-      if (item.color) {
-        style.backgroundColor = item.color;
-      }
-      if (item.pattern) {
-        style.backgroundImage = `url(${item.pattern})`;
-        style.backgroundSize = "cover";
-      }
-      return style;
-    };
-    const getIconStyle = (item) => {
-      const style = {
-        width: item.size ? `${item.size}px` : "16px",
-        height: item.size ? `${item.size}px` : "16px",
-        maxWidth: "24px",
-        maxHeight: "24px"
-      };
-      return style;
-    };
-    const handleImageError = (event) => {
-      const img = event.target;
-      img.style.display = "none";
-      console.warn("图例图标加载失败:", img.src);
-    };
     return (_ctx, _cache) => {
-      const _component_el_button = resolveComponent("el-button");
+      const _component_el_icon = resolveComponent("el-icon");
       const _component_el_collapse_item = resolveComponent("el-collapse-item");
       const _component_el_collapse = resolveComponent("el-collapse");
       const _component_el_empty = resolveComponent("el-empty");
       return withDirectives((openBlock(), createElementBlock("div", {
-        class: normalizeClass(["custom-legend-box absolute bg-white rounded-lg bottom-40px shadow-lg transition-all duration-300 max-h-[calc(100vh-40px)] overflow-hidden z-1000", { "legend-collapsed": isCollapsed.value }]),
+        class: normalizeClass(["ol-legend-panel", { "is-collapsed": isCollapsed.value }]),
         style: normalizeStyle$1(panelStyle.value)
       }, [
         createElementVNode("div", _hoisted_1$a, [
-          _cache[1] || (_cache[1] = createElementVNode("h3", { class: "m-0 text-sm font-semibold text-gray-800" }, "图例", -1)),
+          _cache[1] || (_cache[1] = createElementVNode("span", { class: "header-title" }, "图例", -1)),
           createElementVNode("div", _hoisted_2$9, [
-            createVNode$1(_component_el_button, {
-              link: "",
-              size: "small",
+            createVNode$1(_component_el_icon, {
+              class: "action-icon",
               onClick: toggleCollapse,
-              icon: isCollapsed.value ? unref(expand_default) : unref(fold_default)
-            }, null, 8, ["icon"])
-          ])
-        ]),
-        createElementVNode("div", _hoisted_3$9, [
-          createElementVNode("div", _hoisted_4$9, [
-            visibleLegends.value.length > 0 ? (openBlock(), createBlock(_component_el_collapse, {
-              key: 0,
-              modelValue: activeNames.value,
-              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => activeNames.value = $event),
-              class: "legend-collapse"
+              title: isCollapsed.value ? "展开" : "收起"
             }, {
               default: withCtx(() => [
-                (openBlock(true), createElementBlock(Fragment, null, renderList(visibleLegends.value, (legend) => {
-                  return openBlock(), createBlock(_component_el_collapse_item, {
-                    key: legend.layerId,
-                    title: legend.title || "未命名图例",
-                    name: legend.id,
-                    class: "legend-item"
-                  }, {
-                    default: withCtx(() => [
-                      createElementVNode("div", _hoisted_5$9, [
-                        legend.type === "symbol" ? (openBlock(), createElementBlock("div", _hoisted_6$7, [
-                          (openBlock(true), createElementBlock(Fragment, null, renderList(legend.items, (item) => {
-                            return openBlock(), createElementBlock("div", {
-                              key: item.value,
-                              class: "flex items-center mb-2"
-                            }, [
-                              createElementVNode("div", {
-                                class: "w-4 h-4 mr-2 border border-gray-300",
-                                style: normalizeStyle$1(getSymbolStyle(item))
-                              }, null, 4),
-                              createElementVNode("span", _hoisted_7$6, toDisplayString(item.label), 1)
-                            ]);
-                          }), 128))
-                        ])) : legend.type === "color" ? (openBlock(), createElementBlock("div", _hoisted_8$6, [
-                          (openBlock(true), createElementBlock(Fragment, null, renderList(legend.items, (item) => {
-                            return openBlock(), createElementBlock("div", {
-                              key: item.value,
-                              class: "flex items-center mb-1.5"
-                            }, [
-                              createElementVNode("div", {
-                                class: "w-4 h-4 mr-2 border border-gray-300 rounded-sm",
-                                style: normalizeStyle$1({ backgroundColor: item.color })
-                              }, null, 4),
-                              createElementVNode("span", _hoisted_9$5, toDisplayString(item.label), 1)
-                            ]);
-                          }), 128))
-                        ])) : legend.type === "gradient" ? (openBlock(), createElementBlock("div", _hoisted_10$5, [
-                          createElementVNode("div", _hoisted_11$4, [
-                            createElementVNode("div", {
-                              class: "w-full h-5 border border-gray-300 rounded-sm",
-                              style: normalizeStyle$1(getGradientStyle(legend))
-                            }, null, 4),
-                            createElementVNode("div", _hoisted_12$4, [
-                              createElementVNode("span", null, toDisplayString(legend.min), 1),
-                              createElementVNode("span", null, toDisplayString(legend.max), 1)
-                            ])
-                          ]),
-                          createElementVNode("div", _hoisted_13$4, toDisplayString(legend.unit || ""), 1)
-                        ])) : legend.type === "category" ? (openBlock(), createElementBlock("div", _hoisted_14$3, [
-                          (openBlock(true), createElementBlock(Fragment, null, renderList(legend.items, (item) => {
-                            return openBlock(), createElementBlock("div", {
-                              key: item.value,
-                              class: "flex items-center mb-1.5"
-                            }, [
-                              createElementVNode("div", {
-                                class: "mr-2 border border-gray-300",
-                                style: normalizeStyle$1(getCategoryStyle(item))
-                              }, null, 4),
-                              createElementVNode("span", _hoisted_15$2, toDisplayString(item.label), 1)
-                            ]);
-                          }), 128))
-                        ])) : legend.type === "icon" ? (openBlock(), createElementBlock("div", _hoisted_16$2, [
-                          (openBlock(true), createElementBlock(Fragment, null, renderList(legend.items, (item) => {
-                            return openBlock(), createElementBlock("div", {
-                              key: item.value,
-                              class: "flex items-center mb-1.5"
-                            }, [
-                              item.image ? (openBlock(), createElementBlock("img", {
-                                key: 0,
-                                src: item.image,
-                                alt: item.label,
-                                class: "mr-2 object-contain border border-gray-200 rounded-sm",
-                                style: normalizeStyle$1(getIconStyle(item)),
-                                onError: handleImageError
-                              }, null, 44, _hoisted_17$2)) : (openBlock(), createElementBlock("div", _hoisted_18$2)),
-                              createElementVNode("span", _hoisted_19$2, toDisplayString(item.label), 1)
-                            ]);
-                          }), 128))
-                        ])) : legend.type === "custom" ? (openBlock(), createElementBlock("div", _hoisted_20$2, [
-                          createElementVNode("div", {
-                            innerHTML: legend.content
-                          }, null, 8, _hoisted_21$2)
-                        ])) : createCommentVNode("", true),
-                        legend.description ? (openBlock(), createElementBlock("div", _hoisted_22$1, toDisplayString(legend.description), 1)) : createCommentVNode("", true)
-                      ])
-                    ]),
-                    _: 2
-                  }, 1032, ["title", "name"]);
-                }), 128))
+                (openBlock(), createBlock(resolveDynamicComponent(isCollapsed.value ? "Expand" : "Fold")))
               ]),
               _: 1
-            }, 8, ["modelValue"])) : (openBlock(), createElementBlock("div", _hoisted_23$1, [
-              createVNode$1(_component_el_empty, { description: "暂无图例" })
-            ]))
+            }, 8, ["title"])
           ])
+        ]),
+        createElementVNode("div", _hoisted_3$9, [
+          visibleLegends.value.length > 0 ? (openBlock(), createBlock(_component_el_collapse, {
+            key: 0,
+            modelValue: activeNames.value,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => activeNames.value = $event),
+            class: "legend-collapse"
+          }, {
+            default: withCtx(() => [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(visibleLegends.value, (legend) => {
+                return openBlock(), createBlock(_component_el_collapse_item, {
+                  key: legend.layerId,
+                  name: legend.layerId
+                }, {
+                  title: withCtx(() => [
+                    createElementVNode("span", {
+                      class: "layer-title",
+                      title: legend.title
+                    }, toDisplayString(legend.title || "未命名图例"), 9, _hoisted_4$9)
+                  ]),
+                  default: withCtx(() => [
+                    createElementVNode("div", _hoisted_5$9, [
+                      legend.type === "gradient" ? (openBlock(), createElementBlock("div", _hoisted_6$6, [
+                        createElementVNode("div", {
+                          class: "gradient-bar",
+                          style: normalizeStyle$1(getGradientStyle(legend))
+                        }, null, 4),
+                        createElementVNode("div", _hoisted_7$6, [
+                          createElementVNode("span", null, toDisplayString(legend.min), 1),
+                          createElementVNode("span", null, toDisplayString(legend.max), 1)
+                        ]),
+                        legend.unit ? (openBlock(), createElementBlock("div", _hoisted_8$6, toDisplayString(legend.unit), 1)) : createCommentVNode("", true)
+                      ])) : legend.type === "custom" ? (openBlock(), createElementBlock("div", {
+                        key: 1,
+                        class: "legend-custom",
+                        innerHTML: legend.content
+                      }, null, 8, _hoisted_9$5)) : (openBlock(true), createElementBlock(Fragment, { key: 2 }, renderList(legend.items, (item, idx) => {
+                        return openBlock(), createElementBlock("div", {
+                          key: idx,
+                          class: "legend-row"
+                        }, [
+                          createElementVNode("div", {
+                            class: "legend-icon",
+                            style: normalizeStyle$1(getIconWrapperStyle(legend.type, item))
+                          }, [
+                            legend.type === "icon" && item.image ? (openBlock(), createElementBlock("img", {
+                              key: 0,
+                              src: item.image,
+                              class: "icon-img",
+                              onError: handleImageError
+                            }, null, 40, _hoisted_10$5)) : (openBlock(), createElementBlock("div", {
+                              key: 1,
+                              class: "symbol-shape",
+                              style: normalizeStyle$1(getSymbolInnerStyle(legend.type, item))
+                            }, null, 4))
+                          ], 4),
+                          createElementVNode("span", {
+                            class: "legend-label",
+                            title: item.label
+                          }, toDisplayString(item.label), 9, _hoisted_11$4)
+                        ]);
+                      }), 128)),
+                      legend.description ? (openBlock(), createElementBlock("div", _hoisted_12$4, toDisplayString(legend.description), 1)) : createCommentVNode("", true)
+                    ])
+                  ]),
+                  _: 2
+                }, 1032, ["name"]);
+              }), 128))
+            ]),
+            _: 1
+          }, 8, ["modelValue"])) : (openBlock(), createElementBlock("div", _hoisted_13$4, [
+            createVNode$1(_component_el_empty, {
+              description: "暂无图例",
+              "image-size": 60
+            })
+          ]))
         ])
       ], 6)), [
         [vShow, shouldShowLegend.value]
@@ -471361,6 +471253,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const OlLegendPanel = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-b1b6d5ed"]]);
 class ConfigLoader {
   /**
    * 从URL加载配置文件
@@ -472488,7 +472381,7 @@ const _hoisted_2$8 = { class: "config-section" };
 const _hoisted_3$8 = { class: "config-item" };
 const _hoisted_4$8 = { class: "value-text" };
 const _hoisted_5$8 = { class: "config-item" };
-const _hoisted_6$6 = { class: "value-text" };
+const _hoisted_6$5 = { class: "value-text" };
 const _hoisted_7$5 = { class: "config-item" };
 const _hoisted_8$5 = { class: "value-text" };
 const _hoisted_9$4 = { class: "config-item" };
@@ -472549,7 +472442,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
               step: 1,
               onInput: handleFilterChange
             }, null, 8, ["modelValue"]),
-            createElementVNode("span", _hoisted_6$6, toDisplayString(_ctx.filters.saturate) + "%", 1)
+            createElementVNode("span", _hoisted_6$5, toDisplayString(_ctx.filters.saturate) + "%", 1)
           ]),
           createElementVNode("div", _hoisted_7$5, [
             _cache[13] || (_cache[13] = createElementVNode("label", null, "亮度:", -1)),
@@ -472682,7 +472575,7 @@ const _hoisted_3$7 = {
 };
 const _hoisted_4$7 = { class: "config-item" };
 const _hoisted_5$7 = { class: "value-text" };
-const _hoisted_6$5 = { class: "config-item" };
+const _hoisted_6$4 = { class: "config-item" };
 const _hoisted_7$4 = { class: "value-text" };
 const _hoisted_8$4 = {
   key: 1,
@@ -472740,7 +472633,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
             }, null, 8, ["modelValue"]),
             createElementVNode("span", _hoisted_5$7, toDisplayString(_ctx.layerData.clusterDistance) + "px", 1)
           ]),
-          createElementVNode("div", _hoisted_6$5, [
+          createElementVNode("div", _hoisted_6$4, [
             _cache[7] || (_cache[7] = createElementVNode("label", null, "最小距离:", -1)),
             createVNode$1(_component_el_slider, {
               modelValue: _ctx.layerData.minDistance,
@@ -473185,7 +473078,7 @@ const _hoisted_2$5 = { class: "pb-2 flex items-center justify-between" };
 const _hoisted_3$5 = { class: "text-xs font-semibold text-gray-700 px-1 py-1 border-b border-gray-200 mb-2" };
 const _hoisted_4$5 = { class: "global-style-panel" };
 const _hoisted_5$5 = { class: "config-section" };
-const _hoisted_6$4 = { class: "config-item" };
+const _hoisted_6$3 = { class: "config-item" };
 const _hoisted_7$3 = { class: "current-style-display" };
 const _hoisted_8$3 = { class: "style-preview" };
 const dialogType = "layer-panel";
@@ -473958,7 +473851,10 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
       return openBlock(), createBlock(unref(X$1), mergeProps({
         modelValue: visible.value,
         "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => visible.value = $event)
-      }, dialogProps2.value, { onClose: handleClose }), createSlots({
+      }, dialogProps2.value, {
+        "append-to-body": "",
+        onClose: handleClose
+      }), createSlots({
         default: withCtx(() => [
           _ctx.$slots.default ? renderSlot(_ctx.$slots, "default", {
             key: 0,
@@ -474128,7 +474024,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
                         }, {
                           default: withCtx(() => [
                             createElementVNode("div", _hoisted_5$5, [
-                              createElementVNode("div", _hoisted_6$4, [
+                              createElementVNode("div", _hoisted_6$3, [
                                 createVNode$1(unref(ElInput), {
                                   modelValue: unref(globalCustomCss),
                                   "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(globalCustomCss) ? globalCustomCss.value = $event : null),
@@ -474347,7 +474243,7 @@ const _hoisted_2$3 = { class: "h-150 overflow-y-auto" };
 const _hoisted_3$3 = { class: "flex items-center justify-between" };
 const _hoisted_4$3 = { class: "mb-5" };
 const _hoisted_5$3 = { class: "mb-3" };
-const _hoisted_6$3 = {
+const _hoisted_6$2 = {
   key: 0,
   class: "mb-3"
 };
@@ -474923,7 +474819,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
                                 _: 1
                               }, 8, ["modelValue"])
                             ]),
-                            printSettings.paperSize === "Custom" ? (openBlock(), createElementBlock("div", _hoisted_6$3, [
+                            printSettings.paperSize === "Custom" ? (openBlock(), createElementBlock("div", _hoisted_6$2, [
                               createElementVNode("div", _hoisted_7$2, [
                                 createVNode$1(_component_el_input, {
                                   modelValue: printSettings.customWidth,
@@ -475426,7 +475322,7 @@ const _hoisted_2$2 = ["innerHTML"];
 const _hoisted_3$2 = { key: 1 };
 const _hoisted_4$2 = { class: "layer-title" };
 const _hoisted_5$2 = ["onClick"];
-const _hoisted_6$2 = { class: "property-key" };
+const _hoisted_6$1 = { class: "property-key" };
 const _hoisted_7$1 = { class: "property-value" };
 const _hoisted_8$1 = ["innerHTML"];
 const _hoisted_9$1 = { key: 3 };
@@ -475620,7 +475516,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
                         key,
                         class: "property-item"
                       }, [
-                        createElementVNode("span", _hoisted_6$2, toDisplayString(key) + ":", 1),
+                        createElementVNode("span", _hoisted_6$1, toDisplayString(key) + ":", 1),
                         createElementVNode("span", _hoisted_7$1, toDisplayString(formatValue(value)), 1)
                       ]);
                     }), 128))
@@ -475667,15 +475563,17 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$2 = {
-  key: 11,
-  class: "absolute top-15 right-2.5 w-62.5 max-h-75 bg-white rounded-md shadow-lg z-1000 overflow-hidden md:w-50 md:top-20 md:right-1.25"
-};
-const _hoisted_2$1 = { class: "flex items-center justify-between px-4 py-3 border-b border-gray-200 bg-gray-50" };
-const _hoisted_3$1 = { class: "max-h-50 overflow-y-auto p-2" };
-const _hoisted_4$1 = { class: "flex-1 flex flex-col gap-0.5" };
-const _hoisted_5$1 = { class: "text-xs text-gray-500" };
-const _hoisted_6$1 = { class: "text-sm font-semibold text-gray-800 font-mono" };
+const _hoisted_1$2 = { class: "flex items-center justify-between" };
+const _hoisted_2$1 = { class: "max-h-50 overflow-y-auto p-2" };
+const _hoisted_3$1 = { class: "flex-1 flex flex-col gap-0.5" };
+const _hoisted_4$1 = {
+  class: "text-xs",
+  style: { "color": "var(--el-text-color-secondary)" }
+};
+const _hoisted_5$1 = {
+  class: "text-sm font-semibold font-mono",
+  style: { "color": "var(--el-text-color-regular)" }
+};
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   __name: "OlMap",
   props: {
@@ -476847,6 +476745,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
       var _a3;
       const _component_el_icon = resolveComponent("el-icon");
       const _component_el_button = resolveComponent("el-button");
+      const _component_el_card = resolveComponent("el-card");
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["relative w-full h-full overflow-hidden", { "fixed top-0 left-0 w-screen h-screen z-9999": isFullscreen.value }])
       }, [
@@ -476880,7 +476779,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
               formattedData,
               coordinate,
               pixel
-            })
+            }, void 0, true)
           ]),
           _: 3
         }, 8, ["config", "width", "height", "loading"]),
@@ -476969,20 +476868,19 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
           "left-offset": finalControlsConfig.value.leftOffset,
           "right-offset": finalControlsConfig.value.rightOffset,
           "top-offset": finalControlsConfig.value.topOffset,
-          "bottom-offset": finalControlsConfig.value.bottomOffset,
-          class: "bg-white p-2 rounded-lg shadow-lg"
+          "bottom-offset": finalControlsConfig.value.bottomOffset
         }, {
           custom: withCtx(({ controls }) => [
             renderSlot(_ctx.$slots, "controls", {
               controls,
               map: map2.value
-            })
+            }, void 0, true)
           ]),
           _: 3
         }, 8, ["config", "position", "direction", "left-offset", "right-offset", "top-offset", "bottom-offset"])) : createCommentVNode("", true),
-        hasToolbarSlot.value ? renderSlot(_ctx.$slots, "toolbar", { key: 5 }) : createCommentVNode("", true),
-        hasMapInfoSlot.value ? renderSlot(_ctx.$slots, "mapInfo", { key: 6 }) : createCommentVNode("", true),
-        hasMapInfoSlot.value ? renderSlot(_ctx.$slots, "map-info", { key: 7 }) : createCommentVNode("", true),
+        hasToolbarSlot.value ? renderSlot(_ctx.$slots, "toolbar", { key: 5 }, void 0, true) : createCommentVNode("", true),
+        hasMapInfoSlot.value ? renderSlot(_ctx.$slots, "mapInfo", { key: 6 }, void 0, true) : createCommentVNode("", true),
+        hasMapInfoSlot.value ? renderSlot(_ctx.$slots, "map-info", { key: 7 }, void 0, true) : createCommentVNode("", true),
         finalEnableLayerPanel.value ? (openBlock(), createBlock(_sfc_main$6, {
           key: 8,
           modelValue: showLayerPanel.value,
@@ -476991,30 +476889,30 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
           hasLayerPanelSlot.value ? {
             name: "default",
             fn: withCtx((panel) => [
-              renderSlot(_ctx.$slots, "layerPanel", normalizeProps(guardReactiveProps(panel))),
-              renderSlot(_ctx.$slots, "layer-panel", normalizeProps(guardReactiveProps(panel)))
+              renderSlot(_ctx.$slots, "layerPanel", normalizeProps(guardReactiveProps(panel)), void 0, true),
+              renderSlot(_ctx.$slots, "layer-panel", normalizeProps(guardReactiveProps(panel)), void 0, true)
             ]),
             key: "0"
           } : void 0,
           hasLayerPanelTitleSlot.value ? {
             name: "title",
             fn: withCtx(() => [
-              renderSlot(_ctx.$slots, "layerPanelTitle"),
-              renderSlot(_ctx.$slots, "layer-panel-title"),
-              renderSlot(_ctx.$slots, "title")
+              renderSlot(_ctx.$slots, "layerPanelTitle", {}, void 0, true),
+              renderSlot(_ctx.$slots, "layer-panel-title", {}, void 0, true),
+              renderSlot(_ctx.$slots, "title", {}, void 0, true)
             ]),
             key: "1"
           } : void 0,
           hasLayerPanelFooterSlot.value ? {
             name: "footer",
             fn: withCtx((panel) => [
-              renderSlot(_ctx.$slots, "layerPanelFooter", normalizeProps(guardReactiveProps(panel))),
-              renderSlot(_ctx.$slots, "layer-panel-footer", normalizeProps(guardReactiveProps(panel)))
+              renderSlot(_ctx.$slots, "layerPanelFooter", normalizeProps(guardReactiveProps(panel)), void 0, true),
+              renderSlot(_ctx.$slots, "layer-panel-footer", normalizeProps(guardReactiveProps(panel)), void 0, true)
             ]),
             key: "2"
           } : void 0
         ]), 1032, ["modelValue"])) : createCommentVNode("", true),
-        showLegend.value ? (openBlock(), createBlock(_sfc_main$a, {
+        showLegend.value ? (openBlock(), createBlock(OlLegendPanel, {
           key: 9,
           position: finalLegendPosition.value,
           width: finalLegendWidth.value,
@@ -477026,42 +476924,55 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
           "top-offset": props.legendTopOffset,
           "bottom-offset": props.legendBottomOffset
         }, null, 8, ["position", "width", "collapsible", "default-collapsed", "show-only-visible", "left-offset", "right-offset", "top-offset", "bottom-offset"])) : createCommentVNode("", true),
-        hasLegendSlot.value ? renderSlot(_ctx.$slots, "legend", { key: 10 }) : createCommentVNode("", true),
-        measurementResults.value.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_1$2, [
-          createElementVNode("div", _hoisted_2$1, [
-            _cache[6] || (_cache[6] = createElementVNode("h4", { class: "m-0 text-sm font-semibold text-gray-800" }, "测量结果", -1)),
-            createVNode$1(_component_el_button, {
-              link: "",
-              size: "small",
-              onClick: clearAllMeasurements,
-              icon: unref(delete_default)
-            }, {
-              default: withCtx(() => [..._cache[5] || (_cache[5] = [
-                createTextVNode(" 清除 ", -1)
-              ])]),
-              _: 1
-            }, 8, ["icon"])
+        hasLegendSlot.value ? renderSlot(_ctx.$slots, "legend", { key: 10 }, void 0, true) : createCommentVNode("", true),
+        measurementResults.value.length > 0 ? (openBlock(), createBlock(_component_el_card, {
+          key: 11,
+          class: "measurement-card absolute top-15 right-2.5 w-62.5 max-h-75 z-1000 md:w-50 md:top-20 md:right-1.25",
+          "body-style": { padding: "0px" },
+          shadow: "always"
+        }, {
+          header: withCtx(() => [
+            createElementVNode("div", _hoisted_1$2, [
+              _cache[6] || (_cache[6] = createElementVNode("span", {
+                class: "text-sm font-bold",
+                style: { "color": "var(--el-text-color-primary)" }
+              }, "测量结果", -1)),
+              createVNode$1(_component_el_button, {
+                link: "",
+                size: "small",
+                onClick: clearAllMeasurements,
+                icon: unref(delete_default)
+              }, {
+                default: withCtx(() => [..._cache[5] || (_cache[5] = [
+                  createTextVNode(" 清除 ", -1)
+                ])]),
+                _: 1
+              }, 8, ["icon"])
+            ])
           ]),
-          createElementVNode("div", _hoisted_3$1, [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(measurementResults.value, (result, index2) => {
-              return openBlock(), createElementBlock("div", {
-                key: result.id,
-                class: "flex items-center justify-between px-3 py-2 mb-1 bg-gray-50 rounded transition-colors duration-200 hover:bg-blue-50"
-              }, [
-                createElementVNode("div", _hoisted_4$1, [
-                  createElementVNode("span", _hoisted_5$1, toDisplayString(result.type === "length" ? "长度" : "面积"), 1),
-                  createElementVNode("span", _hoisted_6$1, toDisplayString(formatMeasurementValue(result)), 1)
-                ]),
-                createVNode$1(_component_el_button, {
-                  link: "",
-                  size: "small",
-                  onClick: ($event) => removeMeasurement(result.id),
-                  icon: unref(close_default)
-                }, null, 8, ["onClick", "icon"])
-              ]);
-            }), 128))
-          ])
-        ])) : createCommentVNode("", true),
+          default: withCtx(() => [
+            createElementVNode("div", _hoisted_2$1, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(measurementResults.value, (result, index2) => {
+                return openBlock(), createElementBlock("div", {
+                  key: result.id,
+                  class: "measurement-item flex items-center justify-between px-3 py-2 mb-1 rounded transition-colors duration-200"
+                }, [
+                  createElementVNode("div", _hoisted_3$1, [
+                    createElementVNode("span", _hoisted_4$1, toDisplayString(result.type === "length" ? "长度" : "面积"), 1),
+                    createElementVNode("span", _hoisted_5$1, toDisplayString(formatMeasurementValue(result)), 1)
+                  ]),
+                  createVNode$1(_component_el_button, {
+                    link: "",
+                    size: "small",
+                    onClick: ($event) => removeMeasurement(result.id),
+                    icon: unref(close_default)
+                  }, null, 8, ["onClick", "icon"])
+                ]);
+              }), 128))
+            ])
+          ]),
+          _: 1
+        })) : createCommentVNode("", true),
         map2.value && ((_a3 = finalMapConfig.value.baseLayers) == null ? void 0 : _a3.length) ? (openBlock(), createBlock(OlBaseLayerSwitcher, {
           key: 12,
           map: map2.value,
@@ -477078,6 +476989,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const OlMap = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-736d12b7"]]);
 const _hoisted_1$1 = ["href"];
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   __name: "index",
@@ -488789,7 +488701,7 @@ function(t3) {
  */
 function(t3) {
   function e8() {
-    return (n.canvg ? Promise.resolve(n.canvg) : import("./index.es-051b071d.mjs")).catch(function(t4) {
+    return (n.canvg ? Promise.resolve(n.canvg) : import("./index.es-e4a6ccb9.mjs")).catch(function(t4) {
       return Promise.reject(new Error("Could not load canvg: " + t4));
     }).then(function(t4) {
       return t4.default ? t4.default : t4;
@@ -497663,30 +497575,30 @@ const getAssetUrl = (path2) => {
   }
 };
 const install = (app) => {
-  app.component("OlMap", _sfc_main$2);
+  app.component("OlMap", OlMap);
   app.component("OlMapContainer", _sfc_main$e);
   app.component("OlDrawToolbar", OlDrawToolbar);
   app.component("OlControlPanel", OlControlPanel);
   app.component("OlMapSearch", _sfc_main$c);
   app.component("OlMapTooltip", _sfc_main$3);
-  app.component("OlLegendPanel", _sfc_main$a);
+  app.component("OlLegendPanel", OlLegendPanel);
   app.component("OlBaseLayerSwitcher", OlBaseLayerSwitcher);
-  app.component("CustomOpenlayer", _sfc_main$2);
+  app.component("CustomOpenlayer", OlMap);
   app.component("CustomDialog", _sfc_main);
   app.component("EPlusDialog", X$1);
   app.component("SvgIcon", _sfc_main$1);
 };
 const index = {
   install,
-  OlMap: _sfc_main$2,
-  CustomOpenlayer: _sfc_main$2,
+  OlMap,
+  CustomOpenlayer: OlMap,
   CustomDialog: _sfc_main,
   EPlusDialog: X$1,
   SvgIcon: _sfc_main$1
 };
 const version = "1.0.0";
 export {
-  DrawingManager as $,
+  debugWarn as $,
   ElButton as A,
   ElFocusTrap as B,
   ElInput as C,
@@ -497710,73 +497622,74 @@ export {
   isClient as U,
   hasOwn$2 as V,
   isObject$e as W,
-  isUndefined$3 as X,
-  isElement$2 as Y,
-  debugWarn as Z,
+  X$1 as X,
+  isUndefined$3 as Y,
+  isElement$2 as Z,
   _asyncToGenerator as _,
   _$1 as a,
-  close_default as a0,
-  _sfc_main$9 as a1,
-  _sfc_main$2 as a2,
-  _sfc_main$e as a3,
-  OlDrawToolbar as a4,
-  OlControlPanel as a5,
-  _sfc_main$c as a6,
-  _sfc_main$3 as a7,
-  _sfc_main$a as a8,
-  OlBaseLayerSwitcher as a9,
-  TextDrawingFactory as aA,
-  PointWithTextDrawing as aB,
-  PointWithTextDrawingFactory as aC,
-  IconDrawing as aD,
-  IconDrawingFactory as aE,
-  LineDrawing as aF,
-  LineDrawingFactory as aG,
-  PolygonDrawing as aH,
-  PolygonDrawingFactory as aI,
-  MultiPolygonDrawing as aJ,
-  MultiPolygonDrawingFactory as aK,
-  MultiPointDrawing as aL,
-  MultiPointDrawingFactory as aM,
-  MultiLineStringDrawing as aN,
-  MultiLineStringDrawingFactory as aO,
-  ImageDrawing as aP,
-  ImageDrawingFactory as aQ,
-  MilitaryDrawing as aR,
-  MilitaryDrawingFactory as aS,
-  DrawingManagerFactory as aT,
-  MapOperationTool as aU,
-  htmlToPDF as aV,
-  MapManager as aW,
-  FilterType as aX,
-  FilterOperator as aY,
-  SpatialFilterType as aZ,
-  _sfc_main as aa,
-  _sfc_main$1 as ab,
-  install as ac,
-  index as ad,
-  version as ae,
-  VectorTileLayerHandler as af,
-  getAssetUrl as ag,
-  LayerManager as ah,
-  MeasurementTool as ai,
-  MapStorage as aj,
-  BasemapManager as ak,
-  createBasemapManager as al,
-  getUnitOptions as am,
-  DrawingFactoryRegistry as an,
-  createDrawing as ao,
-  getSupportedDrawingTypes as ap,
-  isValidDrawingType as aq,
-  createDrawingFromJSON as ar,
-  DrawingPresets as as,
-  getDrawingPreset as at,
-  applyDrawingPreset as au,
-  DrawingUtils as av,
-  BaseDrawing as aw,
-  PointDrawing as ax,
-  PointDrawingFactory as ay,
-  TextDrawing as az,
+  DrawingManager as a0,
+  close_default as a1,
+  _sfc_main$9 as a2,
+  OlMap as a3,
+  _sfc_main$e as a4,
+  OlDrawToolbar as a5,
+  OlControlPanel as a6,
+  _sfc_main$c as a7,
+  _sfc_main$3 as a8,
+  OlLegendPanel as a9,
+  TextDrawing as aA,
+  TextDrawingFactory as aB,
+  PointWithTextDrawing as aC,
+  PointWithTextDrawingFactory as aD,
+  IconDrawing as aE,
+  IconDrawingFactory as aF,
+  LineDrawing as aG,
+  LineDrawingFactory as aH,
+  PolygonDrawing as aI,
+  PolygonDrawingFactory as aJ,
+  MultiPolygonDrawing as aK,
+  MultiPolygonDrawingFactory as aL,
+  MultiPointDrawing as aM,
+  MultiPointDrawingFactory as aN,
+  MultiLineStringDrawing as aO,
+  MultiLineStringDrawingFactory as aP,
+  ImageDrawing as aQ,
+  ImageDrawingFactory as aR,
+  MilitaryDrawing as aS,
+  MilitaryDrawingFactory as aT,
+  DrawingManagerFactory as aU,
+  MapOperationTool as aV,
+  htmlToPDF as aW,
+  MapManager as aX,
+  FilterType as aY,
+  FilterOperator as aZ,
+  SpatialFilterType as a_,
+  OlBaseLayerSwitcher as aa,
+  _sfc_main as ab,
+  _sfc_main$1 as ac,
+  install as ad,
+  index as ae,
+  version as af,
+  VectorTileLayerHandler as ag,
+  getAssetUrl as ah,
+  LayerManager as ai,
+  MeasurementTool as aj,
+  MapStorage as ak,
+  BasemapManager as al,
+  createBasemapManager as am,
+  getUnitOptions as an,
+  DrawingFactoryRegistry as ao,
+  createDrawing as ap,
+  getSupportedDrawingTypes as aq,
+  isValidDrawingType as ar,
+  createDrawingFromJSON as as,
+  DrawingPresets as at,
+  getDrawingPreset as au,
+  applyDrawingPreset as av,
+  DrawingUtils as aw,
+  BaseDrawing as ax,
+  PointDrawing as ay,
+  PointDrawingFactory as az,
   _defineProperty as b,
   commonjsGlobal as c,
   _export_sfc as d,