vue-openlayers-plugin 1.0.87 → 1.0.89

package/lib/index.umd.js

@@ -377,21 +377,6 @@ var __publicField = (obj, key, value) => {
       ]));
     }
   }), flag_default = _sfc_main106;
-  var _sfc_main107 = /* @__PURE__ */ vue.defineComponent({
-    name: "Fold",
-    __name: "fold",
-    setup(__props) {
-      return (_ctx, _cache) => (vue.openBlock(), vue.createElementBlock("svg", {
-        xmlns: "http://www.w3.org/2000/svg",
-        viewBox: "0 0 1024 1024"
-      }, [
-        vue.createElementVNode("path", {
-          fill: "currentColor",
-          d: "M896 192H128v128h768zm0 256H384v128h512zm0 256H128v128h768zM320 384 128 512l192 128z"
-        })
-      ]));
-    }
-  }), fold_default = _sfc_main107;
   var _sfc_main111 = /* @__PURE__ */ vue.defineComponent({
     name: "FolderOpened",
     __name: "folder-opened",
@@ -81323,21 +81308,6 @@ For more detail, please visit: ${ref}
         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();
-    }
     /**
      * 设置图层可见性
      */
@@ -112128,7 +112098,7 @@ For more detail, please visit: ${ref}
   function r$2(A5) {
     return y$7(A5)[3];
   }
-  var Y$3 = { extname: r$2, basename: N$3, dirname: e$4, sep: "/", delimiter: ":", relative: h$3, join: K$2, isAbsolute: t$2, normalize: n$3, resolve: M$3 };
+  var Y$2 = { extname: r$2, basename: N$3, dirname: e$4, sep: "/", delimiter: ":", relative: h$3, join: K$2, isAbsolute: t$2, normalize: n$3, resolve: M$3 };
   function H$2(A5, g2) {
     if (A5.filter)
       return A5.filter(g2);
@@ -112140,7 +112110,7 @@ For more detail, please visit: ${ref}
     return A5.substr(g2, I2);
   } : function(A5, g2, I2) {
     return g2 < 0 && (g2 = A5.length + g2), A5.substr(g2, I2);
-  }, w$2 = E$4(Object.freeze({ __proto__: null, resolve: M$3, normalize: n$3, isAbsolute: t$2, join: K$2, relative: h$3, sep: "/", delimiter: ":", dirname: e$4, basename: N$3, extname: r$2, default: Y$3 }));
+  }, w$2 = E$4(Object.freeze({ __proto__: null, resolve: M$3, normalize: n$3, isAbsolute: t$2, join: K$2, relative: h$3, sep: "/", delimiter: ":", dirname: e$4, basename: N$3, extname: r$2, default: Y$2 }));
   !function(A5, g2) {
     var I2 = function(g3) {
       g3 = void 0 !== g3 ? g3 : {};
@@ -298688,7 +298658,7 @@ ${publicKeyStr}
       }
     }
     return "";
-  }, W$1 = /^\[object .+?Constructor\]$/, q$1 = Function.prototype, Y$2 = Object.prototype, J$1 = q$1.toString, X$1 = Y$2.hasOwnProperty, K$1 = RegExp("^" + J$1.call(X$1).replace(/[\\^$.*+?()[\]{}|]/g, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$");
+  }, W$1 = /^\[object .+?Constructor\]$/, q$1 = Function.prototype, Y$1 = Object.prototype, J$1 = q$1.toString, X$2 = Y$1.hasOwnProperty, K$1 = RegExp("^" + J$1.call(X$2).replace(/[\\^$.*+?()[\]{}|]/g, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$");
   var Q$1 = function(e3) {
     return !(!D$2(e3) || V$2(e3)) && (z$2(e3) ? K$1 : W$1).test(H$1(e3));
   };
@@ -298699,7 +298669,7 @@ ${publicKeyStr}
     var t2 = Z$2(e3, n2);
     return Q$1(t2) ? t2 : void 0;
   }, ne$1 = ee$1(k$1, "Map"), te$1 = ee$1(Object, "create");
-  var re$1 = function() {
+  var re$2 = function() {
     this.__data__ = te$1 ? te$1(null) : {}, this.size = 0;
   };
   var oe$1 = function(e3) {
@@ -298729,7 +298699,7 @@ ${publicKeyStr}
       this.set(r2[0], r2[1]);
     }
   }
-  de$2.prototype.clear = re$1, de$2.prototype.delete = oe$1, de$2.prototype.get = ae$1, de$2.prototype.has = ce$2, de$2.prototype.set = se$1;
+  de$2.prototype.clear = re$2, de$2.prototype.delete = oe$1, de$2.prototype.get = ae$1, de$2.prototype.has = ce$2, de$2.prototype.set = se$1;
   var fe$2 = de$2;
   var he$2 = function() {
     this.size = 0, this.__data__ = { hash: new fe$2(), map: new (ne$1 || w$1)(), string: new fe$2() };
@@ -298738,22 +298708,22 @@ ${publicKeyStr}
     var n2 = typeof e3;
     return "string" == n2 || "number" == n2 || "symbol" == n2 || "boolean" == n2 ? "__proto__" !== e3 : null === e3;
   };
-  var ve$2 = function(e3, n2) {
+  var ve$1 = function(e3, n2) {
     var t2 = e3.__data__;
     return le$1(n2) ? t2["string" == typeof n2 ? "string" : "hash"] : t2.map;
   };
   var pe$2 = function(e3) {
-    var n2 = ve$2(this, e3).delete(e3);
+    var n2 = ve$1(this, e3).delete(e3);
     return this.size -= n2 ? 1 : 0, n2;
   };
   var ge$2 = function(e3) {
-    return ve$2(this, e3).get(e3);
+    return ve$1(this, e3).get(e3);
   };
   var ye$1 = function(e3) {
-    return ve$2(this, e3).has(e3);
+    return ve$1(this, e3).has(e3);
   };
   var be$1 = function(e3, n2) {
-    var t2 = ve$2(this, e3), r2 = t2.size;
+    var t2 = ve$1(this, e3), r2 = t2.size;
     return t2.set(e3, n2), this.size += t2.size == r2 ? 0 : 1, this;
   };
   function me$2(e3) {
@@ -467889,7 +467859,7 @@ ${this.attributes_.map(
   };
   const _hoisted_4$l = { class: "image-popup-main" };
   const _hoisted_5$l = { class: "image-container" };
-  const _hoisted_6$h = ["src", "alt"];
+  const _hoisted_6$g = ["src", "alt"];
   const _hoisted_7$f = {
     key: 0,
     class: "image-loading"
@@ -467912,12 +467882,12 @@ ${this.attributes_.map(
   };
   const _hoisted_12$9 = ["onClick"];
   const _hoisted_13$9 = ["src", "alt"];
-  const _hoisted_14$8 = {
+  const _hoisted_14$7 = {
     key: 3,
     class: "slideshow-controls"
   };
-  const _hoisted_15$7 = { class: "fullscreen-container" };
-  const _hoisted_16$7 = ["src", "alt"];
+  const _hoisted_15$6 = { class: "fullscreen-container" };
+  const _hoisted_16$6 = ["src", "alt"];
   const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
     __name: "ImagePopup",
     props: {
@@ -468074,7 +468044,7 @@ ${this.attributes_.map(
                     onLoad: handleImageLoad,
                     onError: handleImageError,
                     onClick: handleImageClick
-                  }, null, 40, _hoisted_6$h),
+                  }, null, 40, _hoisted_6$g),
                   imageLoading.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$f, [..._cache[4] || (_cache[4] = [
                     vue.createElementVNode("div", { class: "loading-spinner" }, null, -1),
                     vue.createElementVNode("span", null, "加载中...", -1)
@@ -468125,7 +468095,7 @@ ${this.attributes_.map(
                   ], 10, _hoisted_12$9);
                 }), 128))
               ])) : vue.createCommentVNode("", true),
-              _ctx.config.slideshow && imageList.value.length > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14$8, [
+              _ctx.config.slideshow && imageList.value.length > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14$7, [
                 vue.createVNode(vue.unref(ElButton), {
                   class: vue.normalizeClass(["slideshow-btn", { active: isSlideshow.value }]),
                   onClick: toggleSlideshow,
@@ -468144,14 +468114,14 @@ ${this.attributes_.map(
               class: "image-fullscreen",
               onClick: closeFullscreen
             }, [
-              vue.createElementVNode("div", _hoisted_15$7, [
+              vue.createElementVNode("div", _hoisted_15$6, [
                 vue.createElementVNode("img", {
                   src: currentImage.value,
                   alt: `全屏图片 ${currentIndex.value + 1}`,
                   class: "fullscreen-image",
                   onClick: _cache[0] || (_cache[0] = vue.withModifiers(() => {
                   }, ["stop"]))
-                }, null, 8, _hoisted_16$7),
+                }, null, 8, _hoisted_16$6),
                 vue.createVNode(vue.unref(ElButton), {
                   class: "fullscreen-close",
                   onClick: closeFullscreen,
@@ -468190,7 +468160,7 @@ ${this.attributes_.map(
     key: 3,
     class: "search-container"
   };
-  const _hoisted_6$g = {
+  const _hoisted_6$f = {
     key: 4,
     class: "data-stats"
   };
@@ -468207,19 +468177,19 @@ ${this.attributes_.map(
     class: "sort-indicator"
   };
   const _hoisted_13$8 = ["onClick"];
-  const _hoisted_14$7 = { key: 0 };
-  const _hoisted_15$6 = ["src", "alt"];
-  const _hoisted_16$6 = { key: 1 };
-  const _hoisted_17$6 = ["href"];
-  const _hoisted_18$6 = { key: 2 };
-  const _hoisted_19$5 = { key: 3 };
-  const _hoisted_20$5 = { key: 4 };
-  const _hoisted_21$3 = {
+  const _hoisted_14$6 = { key: 0 };
+  const _hoisted_15$5 = ["src", "alt"];
+  const _hoisted_16$5 = { key: 1 };
+  const _hoisted_17$5 = ["href"];
+  const _hoisted_18$5 = { key: 2 };
+  const _hoisted_19$4 = { key: 3 };
+  const _hoisted_20$4 = { 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"];
@@ -468454,7 +468424,7 @@ ${this.attributes_.map(
                   clearable: ""
                 }, null, 8, ["modelValue"])
               ])) : vue.createCommentVNode("", true),
-              _ctx.config.showStats ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$g, [
+              _ctx.config.showStats ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$f, [
                 vue.createElementVNode("span", null, "共 " + vue.toDisplayString(filteredData.value.length) + " 条记录", 1),
                 searchQuery.value ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_7$e, "（已过滤 " + vue.toDisplayString(arrayData.value.length - filteredData.value.length) + " 条）", 1)) : vue.createCommentVNode("", true)
               ])) : vue.createCommentVNode("", true),
@@ -468485,19 +468455,19 @@ ${this.attributes_.map(
                             return vue.openBlock(), vue.createElementBlock("td", {
                               key: field.key
                             }, [
-                              field.type === "image" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_14$7, [
+                              field.type === "image" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_14$6, [
                                 vue.createElementVNode("img", {
                                   src: getFieldValue(item, field.key || field.name),
                                   alt: field.label,
                                   class: "table-image"
-                                }, null, 8, _hoisted_15$6)
-                              ])) : field.type === "link" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_16$6, [
+                                }, null, 8, _hoisted_15$5)
+                              ])) : field.type === "link" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_16$5, [
                                 vue.createElementVNode("a", {
                                   href: getFieldValue(item, field.key || field.name),
                                   target: "_blank",
                                   class: "table-link"
-                                }, vue.toDisplayString(getFieldValue(item, field.key || field.name)), 9, _hoisted_17$6)
-                              ])) : field.type === "date" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_18$6, vue.toDisplayString(formatDate(getFieldValue(item, field.key || field.name))), 1)) : field.type === "number" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_19$5, vue.toDisplayString(formatNumber2(getFieldValue(item, field.key || field.name))), 1)) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_20$5, vue.toDisplayString(getFieldValue(item, field.key || field.name)), 1))
+                                }, vue.toDisplayString(getFieldValue(item, field.key || field.name)), 9, _hoisted_17$5)
+                              ])) : field.type === "date" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_18$5, vue.toDisplayString(formatDate(getFieldValue(item, field.key || field.name))), 1)) : field.type === "number" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_19$4, vue.toDisplayString(formatNumber2(getFieldValue(item, field.key || field.name))), 1)) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_20$4, vue.toDisplayString(getFieldValue(item, field.key || field.name)), 1))
                             ]);
                           }), 128))
                         ], 8, _hoisted_13$8);
@@ -468506,7 +468476,7 @@ ${this.attributes_.map(
                   ])
                 ])
               ])) : vue.createCommentVNode("", true),
-              currentView.value === "list" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_21$3, [
+              currentView.value === "list" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_21$2, [
                 (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(paginatedData.value, (item, index2) => {
                   return vue.openBlock(), vue.createElementBlock("div", {
                     key: index2,
@@ -468518,7 +468488,7 @@ ${this.attributes_.map(
                         key: field.key,
                         class: "list-field"
                       }, [
-                        vue.createElementVNode("span", _hoisted_23$2, vue.toDisplayString(field.label) + ":", 1),
+                        vue.createElementVNode("span", _hoisted_23$1, vue.toDisplayString(field.label) + ":", 1),
                         vue.createElementVNode("span", _hoisted_24$1, [
                           field.type === "image" ? (vue.openBlock(), vue.createElementBlock("img", {
                             key: 0,
@@ -468534,7 +468504,7 @@ ${this.attributes_.map(
                         ])
                       ]);
                     }), 128))
-                  ], 8, _hoisted_22$2);
+                  ], 8, _hoisted_22$1);
                 }), 128))
               ])) : vue.createCommentVNode("", true),
               currentView.value === "card" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_30$1, [
@@ -470279,7 +470249,7 @@ ${this.attributes_.map(
   const OlMapContainer_vue_vue_type_style_index_0_lang = "";
   const defaultComponents = {
     "measurement": () => Promise.resolve().then(() => MeasurementDialog$1),
-    "basemap": () => Promise.resolve().then(() => BasemapPanel),
+    "basemap": () => Promise.resolve().then(() => BasemapPanel$1),
     "print": () => Promise.resolve().then(() => MapPrintDialog),
     "layer-panel": () => Promise.resolve().then(() => LayerPanel),
     "coordinate": () => Promise.resolve().then(() => CoordinateLocationDialog),
@@ -470659,7 +470629,7 @@ ${this.attributes_.map(
       };
     }
   });
-  const OlDrawToolbar_vue_vue_type_style_index_0_scoped_65f64ab9_lang = "";
+  const OlDrawToolbar_vue_vue_type_style_index_0_scoped_b8c938a3_lang = "";
   const _export_sfc = (sfc, props) => {
     const target = sfc.__vccOpts || sfc;
     for (const [key2, val] of props) {
@@ -470667,7 +470637,7 @@ ${this.attributes_.map(
     }
     return target;
   };
-  const OlDrawToolbar = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["__scopeId", "data-v-65f64ab9"]]);
+  const OlDrawToolbar = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["__scopeId", "data-v-b8c938a3"]]);
   const TIANDITU_CONFIG = {
     baseUrl: "https://api.tianditu.gov.cn/v2/search",
     key: "9a7244dd5d1a1299a52946a3d0f8ff68"
@@ -471398,7 +471368,7 @@ ${this.attributes_.map(
   };
   const _hoisted_4$j = { class: "section-title" };
   const _hoisted_5$j = ["onClick"];
-  const _hoisted_6$f = { class: "item-content" };
+  const _hoisted_6$e = { class: "item-content" };
   const _hoisted_7$d = { class: "item-name" };
   const _hoisted_8$a = { class: "item-address" };
   const _hoisted_9$8 = {
@@ -471412,17 +471382,17 @@ ${this.attributes_.map(
   const _hoisted_11$7 = { class: "result-count" };
   const _hoisted_12$7 = ["onClick"];
   const _hoisted_13$7 = { class: "item-content" };
-  const _hoisted_14$6 = ["innerHTML"];
-  const _hoisted_15$5 = ["innerHTML"];
-  const _hoisted_16$5 = {
+  const _hoisted_14$5 = ["innerHTML"];
+  const _hoisted_15$4 = ["innerHTML"];
+  const _hoisted_16$4 = {
     key: 0,
     class: "item-type"
   };
-  const _hoisted_17$5 = {
+  const _hoisted_17$4 = {
     key: 0,
     class: "item-confidence"
   };
-  const _hoisted_18$5 = {
+  const _hoisted_18$4 = {
     key: 0,
     class: "no-results"
   };
@@ -471773,7 +471743,7 @@ ${this.attributes_.map(
                         ]),
                         _: 1
                       }),
-                      vue.createElementVNode("div", _hoisted_6$f, [
+                      vue.createElementVNode("div", _hoisted_6$e, [
                         vue.createElementVNode("div", _hoisted_7$d, vue.toDisplayString(item.name), 1),
                         vue.createElementVNode("div", _hoisted_8$a, vue.toDisplayString(item.address), 1)
                       ])
@@ -471815,14 +471785,14 @@ ${this.attributes_.map(
                         vue.createElementVNode("div", {
                           class: "item-name",
                           innerHTML: highlightText(result.name, searchQuery.value)
-                        }, null, 8, _hoisted_14$6),
+                        }, null, 8, _hoisted_14$5),
                         vue.createElementVNode("div", {
                           class: "item-address",
                           innerHTML: highlightText(result.address, searchQuery.value)
-                        }, null, 8, _hoisted_15$5),
-                        result.type ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_16$5, vue.toDisplayString(result.type), 1)) : vue.createCommentVNode("", true)
+                        }, null, 8, _hoisted_15$4),
+                        result.type ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_16$4, vue.toDisplayString(result.type), 1)) : vue.createCommentVNode("", true)
                       ]),
-                      result.confidence ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_17$5, vue.toDisplayString(Math.round(result.confidence * 100)) + "%", 1)) : vue.createCommentVNode("", true)
+                      result.confidence ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_17$4, vue.toDisplayString(Math.round(result.confidence * 100)) + "%", 1)) : vue.createCommentVNode("", true)
                     ], 10, _hoisted_12$7)
                   ]);
                 }), 128))
@@ -471832,7 +471802,7 @@ ${this.attributes_.map(
                 searchResults: searchResults.value,
                 isLoading: isLoading.value
               }, () => [
-                searchQuery.value && searchResults.value.length === 0 && !isLoading.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_18$5, [
+                searchQuery.value && searchResults.value.length === 0 && !isLoading.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_18$4, [
                   vue.createVNode(vue.unref(ElIcon), null, {
                     default: vue.withCtx(() => [
                       vue.createVNode(vue.unref(info_filled_default))
@@ -472529,367 +472499,290 @@ ${this.attributes_.map(
       };
     }
   });
-  const OlControlPanel_vue_vue_type_style_index_0_scoped_e2bbe659_lang = "";
-  const OlControlPanel = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-e2bbe659"]]);
-  const _hoisted_1$j = { class: "flex items-center justify-between px-4 py-3 border-b border-gray-200 bg-gray-50 rounded-t-lg" };
-  const _hoisted_2$i = { class: "panel-actions" };
-  const _hoisted_3$i = { class: "panel-content max-h-125 overflow-y-auto" };
-  const _hoisted_4$i = { class: "p-2" };
-  const _hoisted_5$i = { class: "legend-content p-2" };
-  const _hoisted_6$e = { key: 0 };
-  const _hoisted_7$c = { class: "text-xs text-gray-600" };
-  const _hoisted_8$9 = { key: 1 };
-  const _hoisted_9$7 = { class: "text-xs text-gray-600" };
-  const _hoisted_10$7 = { key: 2 };
-  const _hoisted_11$6 = { class: "relative mb-2" };
-  const _hoisted_12$6 = { class: "flex justify-between mt-1 text-xs text-gray-500" };
-  const _hoisted_13$6 = { class: "text-center text-xs text-gray-500" };
-  const _hoisted_14$5 = { key: 3 };
-  const _hoisted_15$4 = { class: "flex-1 text-xs text-gray-600" };
-  const _hoisted_16$4 = { key: 4 };
-  const _hoisted_17$4 = ["src", "alt"];
-  const _hoisted_18$4 = {
-    key: 1,
-    class: "w-4 h-4 mr-2 border border-gray-300 rounded-sm bg-gray-100"
+  const OlControlPanel_vue_vue_type_style_index_0_scoped_2fc6cae7_lang = "";
+  const OlControlPanel = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-2fc6cae7"]]);
+  const _hoisted_1$j = { class: "ol-legend-header" };
+  const _hoisted_2$i = { class: "header-actions" };
+  const _hoisted_3$i = { class: "ol-legend-body custom-scrollbar" };
+  const _hoisted_4$i = ["title"];
+  const _hoisted_5$i = { class: "legend-content" };
+  const _hoisted_6$d = {
+    key: 0,
+    class: "legend-gradient-box"
   };
-  const _hoisted_19$4 = { class: "text-xs text-gray-600" };
-  const _hoisted_20$4 = {
-    key: 5,
-    class: "text-xs text-gray-600 leading-relaxed"
+  const _hoisted_7$c = { class: "gradient-labels" };
+  const _hoisted_8$9 = {
+    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$7 = ["innerHTML"];
+  const _hoisted_10$7 = ["src"];
+  const _hoisted_11$6 = ["title"];
+  const _hoisted_12$6 = {
+    key: 3,
+    class: "legend-desc"
   };
-  const _hoisted_23$1 = {
+  const _hoisted_13$6 = {
     key: 1,
-    class: "py-10 px-5 text-center"
+    class: "empty-state"
   };
   const _sfc_main$j = /* @__PURE__ */ vue.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 = vue.ref([]);
       const isCollapsed = vue.ref(props.defaultCollapsed);
-      const visibleLayerIds = vue.ref([]);
+      const activeNames = vue.ref([]);
       const legends = vue.ref([]);
-      const handleLayersInitialized = (layers) => {
-        console.log("Layers initialized, updating legends", layers);
-        initializeLegendsFromConfig(layers);
-      };
-      layerEventBus.on("layers-initialized", handleLayersInitialized);
+      const visibleLayerIds = vue.ref([]);
       const panelStyle = vue.computed(() => {
-        const styles = {
-          width: `${props.width}px`
+        const style2 = {
+          width: `${props.width}px`,
+          backgroundColor: "var(--el-bg-color-overlay)",
+          backdropFilter: "blur(10px)"
+        };
+        const setOffset = (key2, value) => {
+          if (value !== void 0)
+            style2[key2] = 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
+          style2[props.position] = "20px";
+        if (!style2.top && !style2.bottom)
+          style2.bottom = "100px";
+        return style2;
+      });
+      const visibleLegends = vue.computed(() => {
+        const list2 = props.showOnlyVisible ? legends.value.filter((l2) => visibleLayerIds.value.includes(l2.layerId)) : legends.value;
+        return list2;
+      });
+      const shouldShowLegend = vue.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 style2 = {
+          width: "100%",
+          height: "100%",
+          backgroundColor: item.color || "#ccc"
+        };
+        if (type === "symbol" && item.shape) {
+          if (item.shape === "circle")
+            style2.borderRadius = "50%";
+          else if (item.shape === "triangle")
+            style2.clipPath = "polygon(50% 0%, 0% 100%, 100% 100%)";
+          else
+            style2.borderRadius = "2px";
         } else {
-          styles[props.position] = "0";
-        }
-        if (props.topOffset !== void 0) {
-          styles.top = typeof props.topOffset === "number" ? `${props.topOffset}px` : props.topOffset;
+          style2.borderRadius = "2px";
         }
-        if (props.bottomOffset !== void 0) {
-          styles.bottom = typeof props.bottomOffset === "number" ? `${props.bottomOffset}px` : props.bottomOffset;
+        if (item.borderColor) {
+          style2.border = `1px solid ${item.borderColor}`;
+          style2.boxSizing = "border-box";
         }
-        return styles;
-      });
-      const visibleLegends = vue.computed(() => {
-        if (!props.showOnlyVisible) {
-          return legends.value;
+        if (item.pattern) {
+          style2.backgroundImage = `url(${item.pattern})`;
+          style2.backgroundSize = "cover";
         }
-        return legends.value.filter(
-          (legend) => visibleLayerIds.value.includes(legend.layerId)
-        );
-      });
-      const shouldShowLegend = vue.computed(() => {
-        return visibleLegends.value.length > 0;
-      });
-      const toggleCollapse = () => {
-        isCollapsed.value = !isCollapsed.value;
+        return style2;
       };
-      const initializeLegendsFromConfig = (layers) => {
+      const toggleCollapse = () => isCollapsed.value = !isCollapsed.value;
+      const handleImageError = (e3) => e3.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((id2) => id2 !== 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((id2) => id2 !== layerId);
       };
       vue.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);
       });
       vue.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 style2 = {};
-        if (item.shape === "circle") {
-          style2.borderRadius = "50%";
-        } else if (item.shape === "square") {
-          style2.borderRadius = "2px";
-        } else if (item.shape === "triangle") {
-          style2.clipPath = "polygon(50% 0%, 0% 100%, 100% 100%)";
-        }
-        if (item.color) {
-          style2.backgroundColor = item.color;
-        }
-        if (item.borderColor) {
-          style2.border = `2px solid ${item.borderColor}`;
-        }
-        if (item.size) {
-          style2.width = `${item.size}px`;
-          style2.height = `${item.size}px`;
-        }
-        return style2;
-      };
-      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 style2 = {
-          width: "16px",
-          height: "16px",
-          borderRadius: "2px"
-        };
-        if (item.color) {
-          style2.backgroundColor = item.color;
-        }
-        if (item.pattern) {
-          style2.backgroundImage = `url(${item.pattern})`;
-          style2.backgroundSize = "cover";
-        }
-        return style2;
-      };
-      const getIconStyle = (item) => {
-        const style2 = {
-          width: item.size ? `${item.size}px` : "16px",
-          height: item.size ? `${item.size}px` : "16px",
-          maxWidth: "24px",
-          maxHeight: "24px"
-        };
-        return style2;
-      };
-      const handleImageError = (event) => {
-        const img = event.target;
-        img.style.display = "none";
-        console.warn("图例图标加载失败:", img.src);
-      };
       return (_ctx, _cache) => {
-        const _component_el_button = vue.resolveComponent("el-button");
+        const _component_el_icon = vue.resolveComponent("el-icon");
         const _component_el_collapse_item = vue.resolveComponent("el-collapse-item");
         const _component_el_collapse = vue.resolveComponent("el-collapse");
         const _component_el_empty = vue.resolveComponent("el-empty");
         return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.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: vue.normalizeClass(["ol-legend-panel", { "is-collapsed": isCollapsed.value }]),
           style: vue.normalizeStyle(panelStyle.value)
         }, [
           vue.createElementVNode("div", _hoisted_1$j, [
-            _cache[1] || (_cache[1] = vue.createElementVNode("h3", { class: "m-0 text-sm font-semibold text-gray-800" }, "图例", -1)),
+            _cache[1] || (_cache[1] = vue.createElementVNode("span", { class: "header-title" }, "图例", -1)),
             vue.createElementVNode("div", _hoisted_2$i, [
-              vue.createVNode(_component_el_button, {
-                link: "",
-                size: "small",
+              vue.createVNode(_component_el_icon, {
+                class: "action-icon",
                 onClick: toggleCollapse,
-                icon: isCollapsed.value ? vue.unref(expand_default) : vue.unref(fold_default)
-              }, null, 8, ["icon"])
-            ])
-          ]),
-          vue.createElementVNode("div", _hoisted_3$i, [
-            vue.createElementVNode("div", _hoisted_4$i, [
-              visibleLegends.value.length > 0 ? (vue.openBlock(), vue.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: vue.withCtx(() => [
-                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(visibleLegends.value, (legend) => {
-                    return vue.openBlock(), vue.createBlock(_component_el_collapse_item, {
-                      key: legend.layerId,
-                      title: legend.title || "未命名图例",
-                      name: legend.id,
-                      class: "legend-item"
-                    }, {
-                      default: vue.withCtx(() => [
-                        vue.createElementVNode("div", _hoisted_5$i, [
-                          legend.type === "symbol" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$e, [
-                            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(legend.items, (item) => {
-                              return vue.openBlock(), vue.createElementBlock("div", {
-                                key: item.value,
-                                class: "flex items-center mb-2"
-                              }, [
-                                vue.createElementVNode("div", {
-                                  class: "w-4 h-4 mr-2 border border-gray-300",
-                                  style: vue.normalizeStyle(getSymbolStyle(item))
-                                }, null, 4),
-                                vue.createElementVNode("span", _hoisted_7$c, vue.toDisplayString(item.label), 1)
-                              ]);
-                            }), 128))
-                          ])) : legend.type === "color" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8$9, [
-                            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(legend.items, (item) => {
-                              return vue.openBlock(), vue.createElementBlock("div", {
-                                key: item.value,
-                                class: "flex items-center mb-1.5"
-                              }, [
-                                vue.createElementVNode("div", {
-                                  class: "w-4 h-4 mr-2 border border-gray-300 rounded-sm",
-                                  style: vue.normalizeStyle({ backgroundColor: item.color })
-                                }, null, 4),
-                                vue.createElementVNode("span", _hoisted_9$7, vue.toDisplayString(item.label), 1)
-                              ]);
-                            }), 128))
-                          ])) : legend.type === "gradient" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_10$7, [
-                            vue.createElementVNode("div", _hoisted_11$6, [
-                              vue.createElementVNode("div", {
-                                class: "w-full h-5 border border-gray-300 rounded-sm",
-                                style: vue.normalizeStyle(getGradientStyle(legend))
-                              }, null, 4),
-                              vue.createElementVNode("div", _hoisted_12$6, [
-                                vue.createElementVNode("span", null, vue.toDisplayString(legend.min), 1),
-                                vue.createElementVNode("span", null, vue.toDisplayString(legend.max), 1)
-                              ])
-                            ]),
-                            vue.createElementVNode("div", _hoisted_13$6, vue.toDisplayString(legend.unit || ""), 1)
-                          ])) : legend.type === "category" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14$5, [
-                            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(legend.items, (item) => {
-                              return vue.openBlock(), vue.createElementBlock("div", {
-                                key: item.value,
-                                class: "flex items-center mb-1.5"
-                              }, [
-                                vue.createElementVNode("div", {
-                                  class: "mr-2 border border-gray-300",
-                                  style: vue.normalizeStyle(getCategoryStyle(item))
-                                }, null, 4),
-                                vue.createElementVNode("span", _hoisted_15$4, vue.toDisplayString(item.label), 1)
-                              ]);
-                            }), 128))
-                          ])) : legend.type === "icon" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_16$4, [
-                            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(legend.items, (item) => {
-                              return vue.openBlock(), vue.createElementBlock("div", {
-                                key: item.value,
-                                class: "flex items-center mb-1.5"
-                              }, [
-                                item.image ? (vue.openBlock(), vue.createElementBlock("img", {
-                                  key: 0,
-                                  src: item.image,
-                                  alt: item.label,
-                                  class: "mr-2 object-contain border border-gray-200 rounded-sm",
-                                  style: vue.normalizeStyle(getIconStyle(item)),
-                                  onError: handleImageError
-                                }, null, 44, _hoisted_17$4)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_18$4)),
-                                vue.createElementVNode("span", _hoisted_19$4, vue.toDisplayString(item.label), 1)
-                              ]);
-                            }), 128))
-                          ])) : legend.type === "custom" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_20$4, [
-                            vue.createElementVNode("div", {
-                              innerHTML: legend.content
-                            }, null, 8, _hoisted_21$2)
-                          ])) : vue.createCommentVNode("", true),
-                          legend.description ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_22$1, vue.toDisplayString(legend.description), 1)) : vue.createCommentVNode("", true)
-                        ])
-                      ]),
-                      _: 2
-                    }, 1032, ["title", "name"]);
-                  }), 128))
+                  (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(isCollapsed.value ? "Expand" : "Fold")))
                 ]),
                 _: 1
-              }, 8, ["modelValue"])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_23$1, [
-                vue.createVNode(_component_el_empty, { description: "暂无图例" })
-              ]))
+              }, 8, ["title"])
             ])
+          ]),
+          vue.createElementVNode("div", _hoisted_3$i, [
+            visibleLegends.value.length > 0 ? (vue.openBlock(), vue.createBlock(_component_el_collapse, {
+              key: 0,
+              modelValue: activeNames.value,
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => activeNames.value = $event),
+              class: "legend-collapse"
+            }, {
+              default: vue.withCtx(() => [
+                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(visibleLegends.value, (legend) => {
+                  return vue.openBlock(), vue.createBlock(_component_el_collapse_item, {
+                    key: legend.layerId,
+                    name: legend.layerId
+                  }, {
+                    title: vue.withCtx(() => [
+                      vue.createElementVNode("span", {
+                        class: "layer-title",
+                        title: legend.title
+                      }, vue.toDisplayString(legend.title || "未命名图例"), 9, _hoisted_4$i)
+                    ]),
+                    default: vue.withCtx(() => [
+                      vue.createElementVNode("div", _hoisted_5$i, [
+                        legend.type === "gradient" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$d, [
+                          vue.createElementVNode("div", {
+                            class: "gradient-bar",
+                            style: vue.normalizeStyle(getGradientStyle(legend))
+                          }, null, 4),
+                          vue.createElementVNode("div", _hoisted_7$c, [
+                            vue.createElementVNode("span", null, vue.toDisplayString(legend.min), 1),
+                            vue.createElementVNode("span", null, vue.toDisplayString(legend.max), 1)
+                          ]),
+                          legend.unit ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8$9, vue.toDisplayString(legend.unit), 1)) : vue.createCommentVNode("", true)
+                        ])) : legend.type === "custom" ? (vue.openBlock(), vue.createElementBlock("div", {
+                          key: 1,
+                          class: "legend-custom",
+                          innerHTML: legend.content
+                        }, null, 8, _hoisted_9$7)) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 2 }, vue.renderList(legend.items, (item, idx) => {
+                          return vue.openBlock(), vue.createElementBlock("div", {
+                            key: idx,
+                            class: "legend-row"
+                          }, [
+                            vue.createElementVNode("div", {
+                              class: "legend-icon",
+                              style: vue.normalizeStyle(getIconWrapperStyle(legend.type, item))
+                            }, [
+                              legend.type === "icon" && item.image ? (vue.openBlock(), vue.createElementBlock("img", {
+                                key: 0,
+                                src: item.image,
+                                class: "icon-img",
+                                onError: handleImageError
+                              }, null, 40, _hoisted_10$7)) : (vue.openBlock(), vue.createElementBlock("div", {
+                                key: 1,
+                                class: "symbol-shape",
+                                style: vue.normalizeStyle(getSymbolInnerStyle(legend.type, item))
+                              }, null, 4))
+                            ], 4),
+                            vue.createElementVNode("span", {
+                              class: "legend-label",
+                              title: item.label
+                            }, vue.toDisplayString(item.label), 9, _hoisted_11$6)
+                          ]);
+                        }), 128)),
+                        legend.description ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12$6, vue.toDisplayString(legend.description), 1)) : vue.createCommentVNode("", true)
+                      ])
+                    ]),
+                    _: 2
+                  }, 1032, ["name"]);
+                }), 128))
+              ]),
+              _: 1
+            }, 8, ["modelValue"])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_13$6, [
+              vue.createVNode(_component_el_empty, {
+                description: "暂无图例",
+                "image-size": 60
+              })
+            ]))
           ])
         ], 6)), [
           [vue.vShow, shouldShowLegend.value]
@@ -472897,7 +472790,8 @@ ${this.attributes_.map(
       };
     }
   });
-  const OlLegendPanel_vue_vue_type_style_index_0_lang = "";
+  const OlLegendPanel_vue_vue_type_style_index_0_scoped_b1b6d5ed_lang = "";
+  const OlLegendPanel = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-b1b6d5ed"]]);
   class ConfigLoader {
     /**
      * 从URL加载配置文件
@@ -474025,7 +473919,7 @@ ${this.attributes_.map(
   const _hoisted_3$h = { class: "config-item" };
   const _hoisted_4$h = { class: "value-text" };
   const _hoisted_5$h = { class: "config-item" };
-  const _hoisted_6$d = { class: "value-text" };
+  const _hoisted_6$c = { class: "value-text" };
   const _hoisted_7$b = { class: "config-item" };
   const _hoisted_8$8 = { class: "value-text" };
   const _hoisted_9$6 = { class: "config-item" };
@@ -474086,7 +473980,7 @@ ${this.attributes_.map(
                 step: 1,
                 onInput: handleFilterChange
               }, null, 8, ["modelValue"]),
-              vue.createElementVNode("span", _hoisted_6$d, vue.toDisplayString(_ctx.filters.saturate) + "%", 1)
+              vue.createElementVNode("span", _hoisted_6$c, vue.toDisplayString(_ctx.filters.saturate) + "%", 1)
             ]),
             vue.createElementVNode("div", _hoisted_7$b, [
               _cache[13] || (_cache[13] = vue.createElementVNode("label", null, "亮度:", -1)),
@@ -474224,7 +474118,7 @@ ${this.attributes_.map(
   };
   const _hoisted_4$g = { class: "config-item" };
   const _hoisted_5$g = { class: "value-text" };
-  const _hoisted_6$c = { class: "config-item" };
+  const _hoisted_6$b = { class: "config-item" };
   const _hoisted_7$a = { class: "value-text" };
   const _hoisted_8$7 = {
     key: 1,
@@ -474282,7 +474176,7 @@ ${this.attributes_.map(
               }, null, 8, ["modelValue"]),
               vue.createElementVNode("span", _hoisted_5$g, vue.toDisplayString(_ctx.layerData.clusterDistance) + "px", 1)
             ]),
-            vue.createElementVNode("div", _hoisted_6$c, [
+            vue.createElementVNode("div", _hoisted_6$b, [
               _cache[7] || (_cache[7] = vue.createElementVNode("label", null, "最小距离:", -1)),
               vue.createVNode(_component_el_slider, {
                 modelValue: _ctx.layerData.minDistance,
@@ -474507,7 +474401,7 @@ ${this.attributes_.map(
   });
   const LayerTreeNode_vue_vue_type_style_index_0_lang = "";
   /*! Element Plus Icons Vue v2.3.2 */
-  var ce$1 = /* @__PURE__ */ vue.defineComponent({
+  var re$1 = /* @__PURE__ */ vue.defineComponent({
     name: "Close",
     __name: "close",
     setup(r2) {
@@ -474521,7 +474415,7 @@ ${this.attributes_.map(
         })
       ]));
     }
-  }), de$1 = ce$1, ue$1 = /* @__PURE__ */ vue.defineComponent({
+  }), ce$1 = re$1, de$1 = /* @__PURE__ */ vue.defineComponent({
     name: "FullScreen",
     __name: "full-screen",
     setup(r2) {
@@ -474535,8 +474429,8 @@ ${this.attributes_.map(
         })
       ]));
     }
-  }), fe$1 = ue$1;
-  const he$1 = { class: "custom-dialog-header" }, me$1 = ["id"], pe$1 = { class: "custom-dialog-actions" }, ge$1 = {
+  }), ue$1 = de$1;
+  const fe$1 = { class: "custom-dialog-header" }, he$1 = ["id"], me$1 = { class: "custom-dialog-actions" }, pe$1 = {
     key: 1,
     class: "icon",
     viewBox: "0 0 1025 1024",
@@ -474544,7 +474438,7 @@ ${this.attributes_.map(
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em"
-  }, ve$1 = ["onClick"], Y$1 = /* @__PURE__ */ vue.defineComponent({
+  }, ge$1 = ["onClick"], X$1 = /* @__PURE__ */ vue.defineComponent({
     __name: "EPlusResizeDialog",
     props: {
       resizable: { type: Boolean, default: true },
@@ -474556,8 +474450,8 @@ ${this.attributes_.map(
       closeOnClickModal: { type: Boolean, default: false }
     },
     setup(r2, { expose: S2 }) {
-      const c2 = r2, j2 = vue.computed(() => c2.showFullscreen !== false), i2 = vue.ref(), V2 = vue.useAttrs(), U2 = vue.useSlots(), d2 = vue.ref(false), g2 = vue.computed(() => {
-        const l2 = V2.modal;
+      const c2 = r2, Y2 = vue.computed(() => c2.showFullscreen !== false), i2 = vue.ref(), $2 = vue.useAttrs(), j2 = vue.useSlots(), d2 = vue.ref(false), x2 = vue.computed(() => {
+        const l2 = $2.modal;
         return l2 !== void 0 ? l2 === "" ? true : l2 === "false" ? false : l2 === "true" ? true : !!l2 : !c2.modalPenetrable;
       }), a3 = {
         width: "",
@@ -474567,7 +474461,7 @@ ${this.attributes_.map(
         transform: "",
         marginTop: "",
         marginBottom: ""
-      }, $2 = () => {
+      }, V2 = () => {
         d2.value ? (d2.value = false, vue.nextTick(() => {
           e3 && (e3.style.width = a3.width, e3.style.height = a3.height, e3.style.left = a3.left, e3.style.top = a3.top, e3.style.transform = a3.transform, e3.style.marginTop = a3.marginTop, e3.style.marginBottom = a3.marginBottom);
         })) : (e3 && (a3.width = e3.style.width, a3.height = e3.style.height, a3.left = e3.style.left, a3.top = e3.style.top, a3.transform = e3.style.transform, a3.marginTop = e3.style.marginTop, a3.marginBottom = e3.style.marginBottom, e3.style.width = "", e3.style.height = "", e3.style.transform = "", e3.style.left = "", e3.style.top = "", e3.style.marginTop = "", e3.style.marginBottom = ""), d2.value = true), vue.nextTick(() => {
@@ -474576,11 +474470,11 @@ ${this.attributes_.map(
       };
       S2({
         dialogRef: i2,
-        toggleFullscreen: $2,
+        toggleFullscreen: V2,
         isFullscreen: d2
       });
-      let R2 = 0, H4 = 0, B3 = 0, C3 = 0, v5 = 0, y2 = 0, u2 = "", e3 = null;
-      const G2 = ["n", "e", "s", "w", "ne", "nw", "se", "sw"], M5 = () => {
+      let R2 = 0, H4 = 0, B3 = 0, C3 = 0, g2 = 0, v5 = 0, u2 = "", e3 = null;
+      const U2 = ["n", "e", "s", "w", "ne", "nw", "se", "sw"], M5 = () => {
         var s2;
         if (c2.resizable === false || d2.value) {
           e3 && e3.querySelectorAll(".resize-handle").forEach((n2) => n2.style.display = "none");
@@ -474589,11 +474483,11 @@ ${this.attributes_.map(
         if (e3 && e3.querySelectorAll(".resize-handle").forEach((n2) => n2.style.display = "block"), !i2.value)
           return;
         const l2 = ((s2 = i2.value.dialogContentRef) == null ? void 0 : s2.$el) || i2.value.$el;
-        !l2 || (e3 = l2.querySelector(".el-dialog") || l2, (!e3 || !e3.classList.contains("el-dialog")) && (l2.classList.contains("el-dialog") ? e3 = l2 : e3 = document.querySelector(".el-dialog")), !e3) || (getComputedStyle(e3).position === "static" && (e3.style.position = "relative"), e3.querySelector(".resize-handle")) || G2.forEach((t2) => {
+        !l2 || (e3 = l2.querySelector(".el-dialog") || l2, (!e3 || !e3.classList.contains("el-dialog")) && (l2.classList.contains("el-dialog") ? e3 = l2 : e3 = document.querySelector(".el-dialog")), !e3) || (getComputedStyle(e3).position === "static" && (e3.style.position = "relative"), e3.querySelector(".resize-handle")) || U2.forEach((t2) => {
           const n2 = document.createElement("div");
-          n2.className = `resize-handle resize-handle-${t2}`, n2.dataset.dir = t2, Object.assign(n2.style, J2(t2)), n2.addEventListener("mousedown", (f2) => K2(f2, t2)), e3.appendChild(n2);
+          n2.className = `resize-handle resize-handle-${t2}`, n2.dataset.dir = t2, Object.assign(n2.style, G2(t2)), n2.addEventListener("mousedown", (f2) => J2(f2, t2)), e3.appendChild(n2);
         });
-      }, J2 = (l2) => {
+      }, G2 = (l2) => {
         const o2 = "10px", s2 = "-5px", t2 = {
           position: "absolute",
           zIndex: "100",
@@ -474602,42 +474496,42 @@ ${this.attributes_.map(
           cursor: `${l2}-resize`
         };
         return l2.includes("n") && (t2.top = s2), l2.includes("s") && (t2.bottom = s2), l2.includes("w") && (t2.left = s2), l2.includes("e") && (t2.right = s2), l2 === "ne" && (t2.top = s2, t2.right = s2, t2.width = o2, t2.height = o2, t2.cursor = "ne-resize"), l2 === "nw" && (t2.top = s2, t2.left = s2, t2.width = o2, t2.height = o2, t2.cursor = "nw-resize"), l2 === "se" && (t2.bottom = s2, t2.right = s2, t2.width = o2, t2.height = o2, t2.cursor = "se-resize"), l2 === "sw" && (t2.bottom = s2, t2.left = s2, t2.width = o2, t2.height = o2, t2.cursor = "sw-resize"), t2;
-      }, K2 = (l2, o2) => {
+      }, J2 = (l2, o2) => {
         if (l2.preventDefault(), l2.stopPropagation(), !e3)
           return;
         u2 = o2, R2 = l2.clientX, H4 = l2.clientY;
         const s2 = window.getComputedStyle(e3);
-        B3 = parseInt(s2.width), C3 = parseInt(s2.height), v5 = parseInt(s2.left) || 0, y2 = parseInt(s2.top) || 0;
+        B3 = parseInt(s2.width), C3 = parseInt(s2.height), g2 = parseInt(s2.left) || 0, v5 = parseInt(s2.top) || 0;
         const t2 = e3.getBoundingClientRect();
         if (s2.position !== "absolute" && s2.position !== "fixed") {
-          const n2 = e3.offsetParent, f2 = n2 ? n2.getBoundingClientRect() : { left: 0, top: 0 }, w2 = t2.left - f2.left, _2 = t2.top - f2.top;
-          e3.style.position = "absolute", e3.style.margin = "0", e3.style.left = `${w2}px`, e3.style.top = `${_2}px`, v5 = w2, y2 = _2;
+          const n2 = e3.offsetParent, f2 = n2 ? n2.getBoundingClientRect() : { left: 0, top: 0 }, y2 = t2.left - f2.left, w2 = t2.top - f2.top;
+          e3.style.position = "absolute", e3.style.margin = "0", e3.style.left = `${y2}px`, e3.style.top = `${w2}px`, g2 = y2, v5 = w2;
         } else
-          v5 = parseInt(s2.left), y2 = parseInt(s2.top);
+          g2 = parseInt(s2.left), v5 = parseInt(s2.top);
         document.addEventListener("mousemove", P6), document.addEventListener("mouseup", T2);
       }, P6 = (l2) => {
         if (!e3)
           return;
         const o2 = l2.clientX - R2, s2 = l2.clientY - H4;
-        let t2 = B3, n2 = C3, f2 = v5, w2 = y2;
-        const _2 = c2.minWidth || 200, I2 = c2.minHeight || 150;
-        if (u2.includes("e") && (t2 = Math.max(_2, B3 + o2)), u2.includes("s") && (n2 = Math.max(I2, C3 + s2)), u2.includes("w")) {
-          const z2 = B3 - o2;
-          z2 >= _2 && (t2 = z2, f2 = v5 + o2);
+        let t2 = B3, n2 = C3, f2 = g2, y2 = v5;
+        const w2 = c2.minWidth || 200, I2 = c2.minHeight || 150;
+        if (u2.includes("e") && (t2 = Math.max(w2, B3 + o2)), u2.includes("s") && (n2 = Math.max(I2, C3 + s2)), u2.includes("w")) {
+          const _2 = B3 - o2;
+          _2 >= w2 && (t2 = _2, f2 = g2 + o2);
         }
         if (u2.includes("n")) {
-          const z2 = C3 - s2;
-          z2 >= I2 && (n2 = z2, w2 = y2 + s2);
+          const _2 = C3 - s2;
+          _2 >= I2 && (n2 = _2, y2 = v5 + s2);
         }
-        e3.style.width = `${t2}px`, e3.style.height = `${n2}px`, (u2.includes("w") || u2.includes("n")) && (e3.style.left = `${f2}px`, e3.style.top = `${w2}px`);
+        e3.style.width = `${t2}px`, e3.style.height = `${n2}px`, (u2.includes("w") || u2.includes("n")) && (e3.style.left = `${f2}px`, e3.style.top = `${y2}px`);
       }, T2 = () => {
         document.removeEventListener("mousemove", P6), document.removeEventListener("mouseup", T2);
       };
-      vue.watch(() => V2.modelValue, (l2) => {
+      vue.watch(() => $2.modelValue, (l2) => {
         l2 && vue.nextTick(() => {
           M5(), D2();
         });
-      }), vue.watch(() => g2.value, () => {
+      }), vue.watch(() => x2.value, () => {
         vue.nextTick(() => {
           D2();
         });
@@ -474650,40 +474544,39 @@ ${this.attributes_.map(
         if (!l2)
           return;
         let o2 = l2.closest(".el-overlay");
-        o2 || (o2 = l2.closest(".el-overlay-dialog")), o2 && (g2.value ? o2.classList.remove("e-plus-modal-hidden-overlay") : o2.classList.add("e-plus-modal-hidden-overlay"));
+        o2 || (o2 = l2.closest(".el-overlay-dialog")), o2 && (x2.value ? o2.classList.remove("e-plus-modal-hidden-overlay") : o2.classList.add("e-plus-modal-hidden-overlay"));
       };
       return (l2, o2) => (vue.openBlock(), vue.createBlock(vue.unref(ElDialog), vue.mergeProps({
         ref_key: "dialogRef",
         ref: i2,
-        class: ["e-plus-resize-dialog", { "is-modal-hidden": !g2.value }]
+        class: ["e-plus-resize-dialog", { "is-modal-hidden": !x2.value }]
       }, l2.$attrs, {
-        modal: g2.value,
+        modal: x2.value,
         "close-on-click-modal": r2.closeOnClickModal,
         draggable: r2.draggable,
         fullscreen: d2.value,
         "show-close": false
       }), vue.createSlots({
         header: vue.withCtx(({ close: s2, titleId: t2, titleClass: n2 }) => [
-          vue.createElementVNode("div", he$1, [
-            vue.createTextVNode(vue.toDisplayString(g2.value) + " ", 1),
+          vue.createElementVNode("div", fe$1, [
             vue.createElementVNode("span", {
               id: t2,
               class: vue.normalizeClass(n2)
-            }, vue.toDisplayString(l2.$attrs.title), 11, me$1),
-            vue.createElementVNode("div", pe$1, [
-              j2.value ? (vue.openBlock(), vue.createElementBlock("div", {
+            }, vue.toDisplayString(l2.$attrs.title), 11, he$1),
+            vue.createElementVNode("div", me$1, [
+              Y2.value ? (vue.openBlock(), vue.createElementBlock("div", {
                 key: 0,
                 class: "custom-header-btn",
-                onClick: $2
+                onClick: V2
               }, [
                 vue.createVNode(vue.unref(ElIcon), { size: "18" }, {
                   default: vue.withCtx(() => [
-                    d2.value ? (vue.openBlock(), vue.createElementBlock("svg", ge$1, [...o2[0] || (o2[0] = [
+                    d2.value ? (vue.openBlock(), vue.createElementBlock("svg", pe$1, [...o2[0] || (o2[0] = [
                       vue.createElementVNode("path", {
                         d: "M222.392033 1024V801.607967H0v-60.262562h282.654595v282.654595z m521.502942 0V741.345405H1025.622454v60.262562H804.041648v222.392033z m-743.431417-741.693074v-60.262562h222.392033V0.463558h60.262562v281.843368z m743.431417 0V0.463558h60.262562v221.580806H1025.622454v60.262562z",
                         fill: "currentColor"
                       }, null, -1)
-                    ])])) : (vue.openBlock(), vue.createBlock(vue.unref(fe$1), { key: 0 }))
+                    ])])) : (vue.openBlock(), vue.createBlock(vue.unref(ue$1), { key: 0 }))
                   ]),
                   _: 1
                 })
@@ -474695,17 +474588,17 @@ ${this.attributes_.map(
               }, [
                 vue.createVNode(vue.unref(ElIcon), { size: "20" }, {
                   default: vue.withCtx(() => [
-                    vue.createVNode(vue.unref(de$1))
+                    vue.createVNode(vue.unref(ce$1))
                   ]),
                   _: 1
                 })
-              ], 8, ve$1)) : vue.createCommentVNode("", true)
+              ], 8, ge$1)) : vue.createCommentVNode("", true)
             ])
           ])
         ]),
         _: 2
       }, [
-        vue.renderList(vue.unref(U2), (s2, t2) => ({
+        vue.renderList(vue.unref(j2), (s2, t2) => ({
           name: t2,
           fn: vue.withCtx((n2) => [
             vue.renderSlot(l2.$slots, t2, vue.normalizeProps(vue.guardReactiveProps(n2 || {})))
@@ -474714,8 +474607,8 @@ ${this.attributes_.map(
       ]), 1040, ["class", "modal", "close-on-click-modal", "draggable", "fullscreen"]));
     }
   });
-  Y$1.install = (r2) => {
-    r2.component("EPlusResizeDialog", Y$1);
+  X$1.install = (r2) => {
+    r2.component("EPlusResizeDialog", X$1);
   };
   const style = "";
   const _hoisted_1$f = { class: "flex-1 overflow-y-auto p-4" };
@@ -474723,7 +474616,7 @@ ${this.attributes_.map(
   const _hoisted_3$e = { class: "text-xs font-semibold text-gray-700 px-1 py-1 border-b border-gray-200 mb-2" };
   const _hoisted_4$e = { class: "global-style-panel" };
   const _hoisted_5$e = { class: "config-section" };
-  const _hoisted_6$b = { class: "config-item" };
+  const _hoisted_6$a = { class: "config-item" };
   const _hoisted_7$9 = { class: "current-style-display" };
   const _hoisted_8$6 = { class: "style-preview" };
   const dialogType = "layer-panel";
@@ -475493,10 +475386,13 @@ ${this.attributes_.map(
         const _component_el_tree = vue.resolveComponent("el-tree");
         const _component_el_tab_pane = vue.resolveComponent("el-tab-pane");
         const _component_el_tabs = vue.resolveComponent("el-tabs");
-        return vue.openBlock(), vue.createBlock(vue.unref(Y$1), vue.mergeProps({
+        return vue.openBlock(), vue.createBlock(vue.unref(X$1), vue.mergeProps({
           modelValue: visible.value,
           "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => visible.value = $event)
-        }, dialogProps2.value, { onClose: handleClose }), vue.createSlots({
+        }, dialogProps2.value, {
+          "append-to-body": "",
+          onClose: handleClose
+        }), vue.createSlots({
           default: vue.withCtx(() => [
             _ctx.$slots.default ? vue.renderSlot(_ctx.$slots, "default", {
               key: 0,
@@ -475666,7 +475562,7 @@ ${this.attributes_.map(
                           }, {
                             default: vue.withCtx(() => [
                               vue.createElementVNode("div", _hoisted_5$e, [
-                                vue.createElementVNode("div", _hoisted_6$b, [
+                                vue.createElementVNode("div", _hoisted_6$a, [
                                   vue.createVNode(vue.unref(ElInput), {
                                     modelValue: vue.unref(globalCustomCss),
                                     "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => vue.isRef(globalCustomCss) ? globalCustomCss.value = $event : null),
@@ -475891,7 +475787,7 @@ ${this.attributes_.map(
   const _hoisted_3$c = { class: "flex items-center justify-between" };
   const _hoisted_4$c = { class: "mb-5" };
   const _hoisted_5$c = { class: "mb-3" };
-  const _hoisted_6$a = {
+  const _hoisted_6$9 = {
     key: 0,
     class: "mb-3"
   };
@@ -476467,7 +476363,7 @@ ${this.attributes_.map(
                                   _: 1
                                 }, 8, ["modelValue"])
                               ]),
-                              printSettings.paperSize === "Custom" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$a, [
+                              printSettings.paperSize === "Custom" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$9, [
                                 vue.createElementVNode("div", _hoisted_7$8, [
                                   vue.createVNode(_component_el_input, {
                                     modelValue: printSettings.customWidth,
@@ -476975,7 +476871,7 @@ ${this.attributes_.map(
   const _hoisted_3$b = { key: 1 };
   const _hoisted_4$b = { class: "layer-title" };
   const _hoisted_5$b = ["onClick"];
-  const _hoisted_6$9 = { class: "property-key" };
+  const _hoisted_6$8 = { class: "property-key" };
   const _hoisted_7$7 = { class: "property-value" };
   const _hoisted_8$4 = ["innerHTML"];
   const _hoisted_9$3 = { key: 3 };
@@ -477169,7 +477065,7 @@ ${this.attributes_.map(
                           key: key2,
                           class: "property-item"
                         }, [
-                          vue.createElementVNode("span", _hoisted_6$9, vue.toDisplayString(key2) + ":", 1),
+                          vue.createElementVNode("span", _hoisted_6$8, vue.toDisplayString(key2) + ":", 1),
                           vue.createElementVNode("span", _hoisted_7$7, vue.toDisplayString(formatValue(value)), 1)
                         ]);
                       }), 128))
@@ -477216,15 +477112,17 @@ ${this.attributes_.map(
       };
     }
   });
-  const _hoisted_1$b = {
-    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$a = { class: "flex items-center justify-between px-4 py-3 border-b border-gray-200 bg-gray-50" };
-  const _hoisted_3$a = { class: "max-h-50 overflow-y-auto p-2" };
-  const _hoisted_4$a = { class: "flex-1 flex flex-col gap-0.5" };
-  const _hoisted_5$a = { class: "text-xs text-gray-500" };
-  const _hoisted_6$8 = { class: "text-sm font-semibold text-gray-800 font-mono" };
+  const _hoisted_1$b = { class: "flex items-center justify-between" };
+  const _hoisted_2$a = { class: "max-h-50 overflow-y-auto p-2" };
+  const _hoisted_3$a = { class: "flex-1 flex flex-col gap-0.5" };
+  const _hoisted_4$a = {
+    class: "text-xs",
+    style: { "color": "var(--el-text-color-secondary)" }
+  };
+  const _hoisted_5$a = {
+    class: "text-sm font-semibold font-mono",
+    style: { "color": "var(--el-text-color-regular)" }
+  };
   const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
     __name: "OlMap",
     props: {
@@ -478396,6 +478294,7 @@ ${this.attributes_.map(
         var _a3;
         const _component_el_icon = vue.resolveComponent("el-icon");
         const _component_el_button = vue.resolveComponent("el-button");
+        const _component_el_card = vue.resolveComponent("el-card");
         return vue.openBlock(), vue.createElementBlock("div", {
           class: vue.normalizeClass(["relative w-full h-full overflow-hidden", { "fixed top-0 left-0 w-screen h-screen z-9999": isFullscreen.value }])
         }, [
@@ -478429,7 +478328,7 @@ ${this.attributes_.map(
                 formattedData,
                 coordinate,
                 pixel
-              })
+              }, void 0, true)
             ]),
             _: 3
           }, 8, ["config", "width", "height", "loading"]),
@@ -478518,20 +478417,19 @@ ${this.attributes_.map(
             "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: vue.withCtx(({ controls }) => [
               vue.renderSlot(_ctx.$slots, "controls", {
                 controls,
                 map: map2.value
-              })
+              }, void 0, true)
             ]),
             _: 3
           }, 8, ["config", "position", "direction", "left-offset", "right-offset", "top-offset", "bottom-offset"])) : vue.createCommentVNode("", true),
-          hasToolbarSlot.value ? vue.renderSlot(_ctx.$slots, "toolbar", { key: 5 }) : vue.createCommentVNode("", true),
-          hasMapInfoSlot.value ? vue.renderSlot(_ctx.$slots, "mapInfo", { key: 6 }) : vue.createCommentVNode("", true),
-          hasMapInfoSlot.value ? vue.renderSlot(_ctx.$slots, "map-info", { key: 7 }) : vue.createCommentVNode("", true),
+          hasToolbarSlot.value ? vue.renderSlot(_ctx.$slots, "toolbar", { key: 5 }, void 0, true) : vue.createCommentVNode("", true),
+          hasMapInfoSlot.value ? vue.renderSlot(_ctx.$slots, "mapInfo", { key: 6 }, void 0, true) : vue.createCommentVNode("", true),
+          hasMapInfoSlot.value ? vue.renderSlot(_ctx.$slots, "map-info", { key: 7 }, void 0, true) : vue.createCommentVNode("", true),
           finalEnableLayerPanel.value ? (vue.openBlock(), vue.createBlock(_sfc_main$f, {
             key: 8,
             modelValue: showLayerPanel.value,
@@ -478540,30 +478438,30 @@ ${this.attributes_.map(
             hasLayerPanelSlot.value ? {
               name: "default",
               fn: vue.withCtx((panel) => [
-                vue.renderSlot(_ctx.$slots, "layerPanel", vue.normalizeProps(vue.guardReactiveProps(panel))),
-                vue.renderSlot(_ctx.$slots, "layer-panel", vue.normalizeProps(vue.guardReactiveProps(panel)))
+                vue.renderSlot(_ctx.$slots, "layerPanel", vue.normalizeProps(vue.guardReactiveProps(panel)), void 0, true),
+                vue.renderSlot(_ctx.$slots, "layer-panel", vue.normalizeProps(vue.guardReactiveProps(panel)), void 0, true)
               ]),
               key: "0"
             } : void 0,
             hasLayerPanelTitleSlot.value ? {
               name: "title",
               fn: vue.withCtx(() => [
-                vue.renderSlot(_ctx.$slots, "layerPanelTitle"),
-                vue.renderSlot(_ctx.$slots, "layer-panel-title"),
-                vue.renderSlot(_ctx.$slots, "title")
+                vue.renderSlot(_ctx.$slots, "layerPanelTitle", {}, void 0, true),
+                vue.renderSlot(_ctx.$slots, "layer-panel-title", {}, void 0, true),
+                vue.renderSlot(_ctx.$slots, "title", {}, void 0, true)
               ]),
               key: "1"
             } : void 0,
             hasLayerPanelFooterSlot.value ? {
               name: "footer",
               fn: vue.withCtx((panel) => [
-                vue.renderSlot(_ctx.$slots, "layerPanelFooter", vue.normalizeProps(vue.guardReactiveProps(panel))),
-                vue.renderSlot(_ctx.$slots, "layer-panel-footer", vue.normalizeProps(vue.guardReactiveProps(panel)))
+                vue.renderSlot(_ctx.$slots, "layerPanelFooter", vue.normalizeProps(vue.guardReactiveProps(panel)), void 0, true),
+                vue.renderSlot(_ctx.$slots, "layer-panel-footer", vue.normalizeProps(vue.guardReactiveProps(panel)), void 0, true)
               ]),
               key: "2"
             } : void 0
           ]), 1032, ["modelValue"])) : vue.createCommentVNode("", true),
-          showLegend.value ? (vue.openBlock(), vue.createBlock(_sfc_main$j, {
+          showLegend.value ? (vue.openBlock(), vue.createBlock(OlLegendPanel, {
             key: 9,
             position: finalLegendPosition.value,
             width: finalLegendWidth.value,
@@ -478575,42 +478473,55 @@ ${this.attributes_.map(
             "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"])) : vue.createCommentVNode("", true),
-          hasLegendSlot.value ? vue.renderSlot(_ctx.$slots, "legend", { key: 10 }) : vue.createCommentVNode("", true),
-          measurementResults.value.length > 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [
-            vue.createElementVNode("div", _hoisted_2$a, [
-              _cache[6] || (_cache[6] = vue.createElementVNode("h4", { class: "m-0 text-sm font-semibold text-gray-800" }, "测量结果", -1)),
-              vue.createVNode(_component_el_button, {
-                link: "",
-                size: "small",
-                onClick: clearAllMeasurements,
-                icon: vue.unref(delete_default)
-              }, {
-                default: vue.withCtx(() => [..._cache[5] || (_cache[5] = [
-                  vue.createTextVNode(" 清除 ", -1)
-                ])]),
-                _: 1
-              }, 8, ["icon"])
+          hasLegendSlot.value ? vue.renderSlot(_ctx.$slots, "legend", { key: 10 }, void 0, true) : vue.createCommentVNode("", true),
+          measurementResults.value.length > 0 ? (vue.openBlock(), vue.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: vue.withCtx(() => [
+              vue.createElementVNode("div", _hoisted_1$b, [
+                _cache[6] || (_cache[6] = vue.createElementVNode("span", {
+                  class: "text-sm font-bold",
+                  style: { "color": "var(--el-text-color-primary)" }
+                }, "测量结果", -1)),
+                vue.createVNode(_component_el_button, {
+                  link: "",
+                  size: "small",
+                  onClick: clearAllMeasurements,
+                  icon: vue.unref(delete_default)
+                }, {
+                  default: vue.withCtx(() => [..._cache[5] || (_cache[5] = [
+                    vue.createTextVNode(" 清除 ", -1)
+                  ])]),
+                  _: 1
+                }, 8, ["icon"])
+              ])
             ]),
-            vue.createElementVNode("div", _hoisted_3$a, [
-              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(measurementResults.value, (result, index2) => {
-                return vue.openBlock(), vue.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"
-                }, [
-                  vue.createElementVNode("div", _hoisted_4$a, [
-                    vue.createElementVNode("span", _hoisted_5$a, vue.toDisplayString(result.type === "length" ? "长度" : "面积"), 1),
-                    vue.createElementVNode("span", _hoisted_6$8, vue.toDisplayString(formatMeasurementValue(result)), 1)
-                  ]),
-                  vue.createVNode(_component_el_button, {
-                    link: "",
-                    size: "small",
-                    onClick: ($event) => removeMeasurement(result.id),
-                    icon: vue.unref(close_default)
-                  }, null, 8, ["onClick", "icon"])
-                ]);
-              }), 128))
-            ])
-          ])) : vue.createCommentVNode("", true),
+            default: vue.withCtx(() => [
+              vue.createElementVNode("div", _hoisted_2$a, [
+                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(measurementResults.value, (result, index2) => {
+                  return vue.openBlock(), vue.createElementBlock("div", {
+                    key: result.id,
+                    class: "measurement-item flex items-center justify-between px-3 py-2 mb-1 rounded transition-colors duration-200"
+                  }, [
+                    vue.createElementVNode("div", _hoisted_3$a, [
+                      vue.createElementVNode("span", _hoisted_4$a, vue.toDisplayString(result.type === "length" ? "长度" : "面积"), 1),
+                      vue.createElementVNode("span", _hoisted_5$a, vue.toDisplayString(formatMeasurementValue(result)), 1)
+                    ]),
+                    vue.createVNode(_component_el_button, {
+                      link: "",
+                      size: "small",
+                      onClick: ($event) => removeMeasurement(result.id),
+                      icon: vue.unref(close_default)
+                    }, null, 8, ["onClick", "icon"])
+                  ]);
+                }), 128))
+              ])
+            ]),
+            _: 1
+          })) : vue.createCommentVNode("", true),
           map2.value && ((_a3 = finalMapConfig.value.baseLayers) == null ? void 0 : _a3.length) ? (vue.openBlock(), vue.createBlock(OlBaseLayerSwitcher, {
             key: 12,
             map: map2.value,
@@ -478627,7 +478538,8 @@ ${this.attributes_.map(
       };
     }
   });
-  const OlMap_vue_vue_type_style_index_0_lang = "";
+  const OlMap_vue_vue_type_style_index_0_scoped_736d12b7_lang = "";
+  const OlMap = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-736d12b7"]]);
   const _hoisted_1$a = ["href"];
   const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
     __name: "index",
@@ -499150,25 +499062,25 @@ ${this.attributes_.map(
     }
   };
   const install = (app) => {
-    app.component("OlMap", _sfc_main$b);
+    app.component("OlMap", OlMap);
     app.component("OlMapContainer", _sfc_main$n);
     app.component("OlDrawToolbar", OlDrawToolbar);
     app.component("OlControlPanel", OlControlPanel);
     app.component("OlMapSearch", _sfc_main$l);
     app.component("OlMapTooltip", _sfc_main$c);
-    app.component("OlLegendPanel", _sfc_main$j);
+    app.component("OlLegendPanel", OlLegendPanel);
     app.component("OlBaseLayerSwitcher", OlBaseLayerSwitcher);
-    app.component("CustomOpenlayer", _sfc_main$b);
+    app.component("CustomOpenlayer", OlMap);
     app.component("CustomDialog", _sfc_main$9);
-    app.component("EPlusDialog", Y$1);
+    app.component("EPlusDialog", X$1);
     app.component("SvgIcon", _sfc_main$a);
   };
   const index$3 = {
     install,
-    OlMap: _sfc_main$b,
-    CustomOpenlayer: _sfc_main$b,
+    OlMap,
+    CustomOpenlayer: OlMap,
     CustomDialog: _sfc_main$9,
-    EPlusDialog: Y$1,
+    EPlusDialog: X$1,
     SvgIcon: _sfc_main$a
   };
   const version$1 = "1.0.0";
@@ -500220,15 +500132,15 @@ ${this.attributes_.map(
         const _component_el_option_group = vue.resolveComponent("el-option-group");
         const _component_el_select = vue.resolveComponent("el-select");
         const _component_el_button = vue.resolveComponent("el-button");
-        const _component_EPlusDialog = vue.resolveComponent("EPlusDialog");
-        return vue.openBlock(), vue.createBlock(_component_EPlusDialog, {
+        return vue.openBlock(), vue.createBlock(vue.unref(X$1), {
           modelValue: dialogVisible.value,
           "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => dialogVisible.value = $event),
           title: "图上量算",
           width: "400px",
           "before-close": handleClose,
           "show-modal": false,
-          cacheId: "measurement-dialog"
+          cacheId: "measurement-dialog",
+          "append-to-body": ""
         }, {
           default: vue.withCtx(() => [
             vue.createElementVNode("div", _hoisted_1$8, [
@@ -500292,7 +500204,7 @@ ${this.attributes_.map(
                   type: "text",
                   size: "small",
                   onClick: clearMeasurement,
-                  style: { "color": "#ff4757" }
+                  style: { "color": "var(--el-color-danger)" }
                 }, {
                   default: vue.withCtx(() => [..._cache[2] || (_cache[2] = [
                     vue.createTextVNode(" 清除 ", -1)
@@ -500326,8 +500238,8 @@ ${this.attributes_.map(
       };
     }
   });
-  const MeasurementDialog_vue_vue_type_style_index_0_scoped_ac238457_lang = "";
-  const MeasurementDialog = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-ac238457"]]);
+  const MeasurementDialog_vue_vue_type_style_index_0_scoped_60e80f64_lang = "";
+  const MeasurementDialog = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-60e80f64"]]);
   const MeasurementDialog$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
     __proto__: null,
     default: MeasurementDialog
@@ -500563,8 +500475,7 @@ ${this.attributes_.map(
         }
       };
       return (_ctx, _cache) => {
-        const _component_EPlusDialog = vue.resolveComponent("EPlusDialog");
-        return vue.openBlock(), vue.createBlock(_component_EPlusDialog, {
+        return vue.openBlock(), vue.createBlock(vue.unref(X$1), {
           modelValue: visible.value,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => visible.value = $event),
           title: "底图选择",
@@ -500573,10 +500484,10 @@ ${this.attributes_.map(
           "show-modal": false,
           draggable: true,
           resizable: true,
-          "show-close": true,
           cacheId: "basemap-dialog",
           position: "right",
           class: "basemap-dialog",
+          "append-to-body": "",
           onClose: handleClose
         }, {
           default: vue.withCtx(() => [
@@ -500606,10 +500517,11 @@ ${this.attributes_.map(
       };
     }
   });
-  const BasemapPanel_vue_vue_type_style_index_0_lang = "";
-  const BasemapPanel = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  const BasemapPanel_vue_vue_type_style_index_0_scoped_75f232fd_lang = "";
+  const BasemapPanel = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-75f232fd"]]);
+  const BasemapPanel$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
     __proto__: null,
-    default: _sfc_main$7
+    default: BasemapPanel
   }, Symbol.toStringTag, { value: "Module" }));
   const _hoisted_1$6 = { class: "coordinate-content" };
   const _hoisted_2$6 = { class: "format-selection" };
@@ -513736,7 +513648,7 @@ ${this.attributes_.map(
   exports2.BaseDrawing = BaseDrawing;
   exports2.BasemapManager = BasemapManager;
   exports2.CustomDialog = _sfc_main$9;
-  exports2.CustomOpenlayer = _sfc_main$b;
+  exports2.CustomOpenlayer = OlMap;
   exports2.DrawingFactoryRegistry = DrawingFactoryRegistry;
   exports2.DrawingManager = DrawingManager;
   exports2.DrawingManagerFactory = DrawingManagerFactory;
@@ -513766,8 +513678,8 @@ ${this.attributes_.map(
   exports2.OlBaseLayerSwitcher = OlBaseLayerSwitcher;
   exports2.OlControlPanel = OlControlPanel;
   exports2.OlDrawToolbar = OlDrawToolbar;
-  exports2.OlLegendPanel = _sfc_main$j;
-  exports2.OlMap = _sfc_main$b;
+  exports2.OlLegendPanel = OlLegendPanel;
+  exports2.OlMap = OlMap;
   exports2.OlMapContainer = _sfc_main$n;
   exports2.OlMapSearch = _sfc_main$l;
   exports2.OlMapTooltip = _sfc_main$c;