ele-admin-plus 1.5.1-beta.4 → 1.6.0-beta.2

package/lib/ele-map-picker/components/map-view.d.ts

@@ -6,7 +6,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: StringConstructor;
         default: string;
     };
-    center: import('vue').PropType<number[]>;
+    center: import('vue').PropType<[number, number]>;
     zoom: {
         type: NumberConstructor;
         default: number;
@@ -19,14 +19,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: NumberConstructor;
         default: number;
     };
-    poiType: {
-        type: StringConstructor;
-        default: string;
-    };
-    poiKeywords: {
-        type: StringConstructor;
-        default: string;
-    };
+    poiType: StringConstructor;
+    poiKeywords: StringConstructor;
     poiRadius: {
         type: NumberConstructor;
         default: number;
@@ -37,21 +31,15 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         default: boolean;
     };
     message: StringConstructor;
-    suggestionCity: {
-        type: StringConstructor;
-        default: string;
-    };
+    suggestionCity: StringConstructor;
     searchPlaceholder: StringConstructor;
-    markerSrc: {
-        type: StringConstructor;
-        default: string;
-    };
+    markerSrc: StringConstructor;
     mapKey: StringConstructor;
     mapVersion: {
         type: StringConstructor;
         default: string;
     };
-    mapStyle: StringConstructor;
+    mapStyle: import('vue').PropType<string | Record<string, any>>;
     darkMode: BooleanConstructor;
     okText: StringConstructor;
     emptyProps: import('vue').PropType<import('../../ele-app/el').ElEmptyProps>;
@@ -67,10 +55,12 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     clickMessage: StringConstructor;
     selected: import('vue').PropType<PoiItem>;
     sideStyle: import('vue').PropType<import('../../ele-app/types').StyleValue>;
+    mapPlugin: import('vue').PropType<import('../types').MapPluginConstructor>;
 }>, {
     autocompleteRef: import('vue').Ref<ElAutocompleteInstance, ElAutocompleteInstance>;
     getMapIns: () => any;
     showInitSelected: () => void;
+    checkResize: () => void;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     done: (_result: PoiItem) => void;
     select: (_selected: PoiItem | null) => void;
@@ -80,7 +70,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: StringConstructor;
         default: string;
     };
-    center: import('vue').PropType<number[]>;
+    center: import('vue').PropType<[number, number]>;
     zoom: {
         type: NumberConstructor;
         default: number;
@@ -93,14 +83,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: NumberConstructor;
         default: number;
     };
-    poiType: {
-        type: StringConstructor;
-        default: string;
-    };
-    poiKeywords: {
-        type: StringConstructor;
-        default: string;
-    };
+    poiType: StringConstructor;
+    poiKeywords: StringConstructor;
     poiRadius: {
         type: NumberConstructor;
         default: number;
@@ -111,21 +95,15 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         default: boolean;
     };
     message: StringConstructor;
-    suggestionCity: {
-        type: StringConstructor;
-        default: string;
-    };
+    suggestionCity: StringConstructor;
     searchPlaceholder: StringConstructor;
-    markerSrc: {
-        type: StringConstructor;
-        default: string;
-    };
+    markerSrc: StringConstructor;
     mapKey: StringConstructor;
     mapVersion: {
         type: StringConstructor;
         default: string;
     };
-    mapStyle: StringConstructor;
+    mapStyle: import('vue').PropType<string | Record<string, any>>;
     darkMode: BooleanConstructor;
     okText: StringConstructor;
     emptyProps: import('vue').PropType<import('../../ele-app/el').ElEmptyProps>;
@@ -141,24 +119,21 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     clickMessage: StringConstructor;
     selected: import('vue').PropType<PoiItem>;
     sideStyle: import('vue').PropType<import('../../ele-app/types').StyleValue>;
+    mapPlugin: import('vue').PropType<import('../types').MapPluginConstructor>;
 }>> & Readonly<{
     onDone?: ((_result: PoiItem) => any) | undefined;
     onSelect?: ((_selected: PoiItem | null) => any) | undefined;
     onMapDone?: ((_ins: any) => any) | undefined;
 }>, {
-    required: boolean;
+    height: string;
     filterable: boolean;
+    required: boolean;
     mode: import('../types').SelectMode;
-    height: string;
     zoom: number;
     selectedZoom: number;
     poiLimit: number;
-    poiType: string;
-    poiKeywords: string;
     poiRadius: number;
     returnRegions: boolean;
-    suggestionCity: string;
-    markerSrc: string;
     mapVersion: string;
     darkMode: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/lib/ele-map-picker/index.cjs

@@ -5,6 +5,7 @@ const receiver = require("../ele-config-provider/receiver");
 const util = require("../ele-pro-layout/util");
 const EleModal = require("../ele-modal/index");
 const MapView = require("./components/map-view");
+const amapPlugin = require("./amap-plugin");
 const props = require("./props");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   ...{ name: "EleMapPicker" },
@@ -16,10 +17,13 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const emit = __emit;
     const { lang, globalConfig } = receiver.useLocale("map", props$1);
     const isResponsive = util.useResponsive(props$1);
+    const isOpened = vue.ref(false);
     const mapRef = vue.ref(null);
-    const aMapKey = vue.computed(() => props$1.mapKey || globalConfig.mapKey);
-    const mapProps = vue.computed(() => {
-      return common.pick(props$1, props.mapPropKeys);
+    const mapPluginImpl = vue.computed(() => {
+      return props$1.mapPlugin || globalConfig.mapPlugin || amapPlugin.AMapPlugin;
+    });
+    const aMapKey = vue.computed(() => {
+      return props$1.mapKey || globalConfig.mapKey;
     });
     const updateModelValue = (visible) => {
       emit("update:modelValue", visible);
@@ -30,14 +34,28 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const handleDone = (result) => {
       emit("done", result);
     };
-    vue.watch(
-      () => props$1.modelValue,
-      (visible) => {
-        if (visible) {
-          mapRef.value && mapRef.value.showInitSelected();
-        }
+    const handleOpened = () => {
+      isOpened.value = true;
+      if (mapRef.value) {
+        mapRef.value.checkResize();
+        mapRef.value.showInitSelected();
+      }
+    };
+    const handleClosed = () => {
+      if (props$1.modalProps?.destroyOnClose) {
+        isOpened.value = false;
       }
-    );
+    };
+    const handleResized = common.debounce(() => {
+      vue.nextTick(() => {
+        mapRef.value && mapRef.value.checkResize();
+      });
+    }, 350);
+    const handleFullscreenChange = () => {
+      vue.nextTick(() => {
+        mapRef.value && mapRef.value.checkResize();
+      });
+    };
     __expose({
       mapRef
     });
@@ -48,10 +66,14 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       }, _ctx.modalProps || {}, {
         modelValue: _ctx.modelValue,
         class: ["ele-map-picker", { "is-responsive": vue.unref(isResponsive) }],
-        "onUpdate:modelValue": updateModelValue
+        "onUpdate:modelValue": updateModelValue,
+        onOpened: handleOpened,
+        onClosed: handleClosed,
+        onResized: vue.unref(handleResized),
+        "onUpdate:fullscreen": handleFullscreenChange
       }), vue.createSlots({
         default: vue.withCtx(() => [
-          vue.createVNode(MapView, vue.mergeProps(mapProps.value, {
+          isOpened.value ? (vue.openBlock(), vue.createBlock(MapView, vue.mergeProps({ key: 0 }, vue.unref(common.pick)(_ctx.$props, vue.unref(props.mapPropKeys)), {
             ref_key: "mapRef",
             ref: mapRef,
             message: vue.unref(lang).message,
@@ -60,9 +82,10 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             okText: vue.unref(lang).ok,
             mapKey: aMapKey.value,
             mode: _ctx.keywordMode ? "keyword" : _ctx.mode,
+            mapPlugin: mapPluginImpl.value,
             onMapDone: handleMapDone,
             onDone: handleDone
-          }), null, 16, ["message", "clickMessage", "searchPlaceholder", "okText", "mapKey", "mode"])
+          }), null, 16, ["message", "clickMessage", "searchPlaceholder", "okText", "mapKey", "mode", "mapPlugin"])) : vue.createCommentVNode("", true)
         ]),
         _: 2
       }, [
@@ -74,7 +97,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             ])
           };
         })
-      ]), 1040, ["title", "modelValue", "class"]);
+      ]), 1040, ["title", "modelValue", "class", "onResized"]);
     };
   }
 });

package/lib/ele-map-picker/index.d.ts

@@ -1,5 +1,5 @@
 import { EleMapPickerViewInstance } from '../ele-app/plusx';
-import { PoiItem } from './types';
+import { PoiItem, MapPluginConstructor } from './types';
 
 declare function __VLS_template(): Partial<Record<string, (_: any) => any>>;
 declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
@@ -16,7 +16,7 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
         type: StringConstructor;
         default: string;
     };
-    center: import('vue').PropType<number[]>;
+    center: import('vue').PropType<[number, number]>;
     zoom: {
         type: NumberConstructor;
         default: number;
@@ -29,14 +29,8 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
         type: NumberConstructor;
         default: number;
     };
-    poiType: {
-        type: StringConstructor;
-        default: string;
-    };
-    poiKeywords: {
-        type: StringConstructor;
-        default: string;
-    };
+    poiType: StringConstructor;
+    poiKeywords: StringConstructor;
     poiRadius: {
         type: NumberConstructor;
         default: number;
@@ -47,21 +41,15 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
         default: boolean;
     };
     message: StringConstructor;
-    suggestionCity: {
-        type: StringConstructor;
-        default: string;
-    };
+    suggestionCity: StringConstructor;
     searchPlaceholder: StringConstructor;
-    markerSrc: {
-        type: StringConstructor;
-        default: string;
-    };
+    markerSrc: StringConstructor;
     mapKey: StringConstructor;
     mapVersion: {
         type: StringConstructor;
         default: string;
     };
-    mapStyle: StringConstructor;
+    mapStyle: import('vue').PropType<string | Record<string, any>>;
     darkMode: BooleanConstructor;
     okText: StringConstructor;
     emptyProps: import('vue').PropType<import('../ele-app/el').ElEmptyProps>;
@@ -77,6 +65,7 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     clickMessage: StringConstructor;
     selected: import('vue').PropType<PoiItem>;
     sideStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    mapPlugin: import('vue').PropType<MapPluginConstructor>;
 }>, {
     mapRef: import('vue').Ref<EleMapPickerViewInstance, EleMapPickerViewInstance>;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
@@ -99,7 +88,7 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
         type: StringConstructor;
         default: string;
     };
-    center: import('vue').PropType<number[]>;
+    center: import('vue').PropType<[number, number]>;
     zoom: {
         type: NumberConstructor;
         default: number;
@@ -112,14 +101,8 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
         type: NumberConstructor;
         default: number;
     };
-    poiType: {
-        type: StringConstructor;
-        default: string;
-    };
-    poiKeywords: {
-        type: StringConstructor;
-        default: string;
-    };
+    poiType: StringConstructor;
+    poiKeywords: StringConstructor;
     poiRadius: {
         type: NumberConstructor;
         default: number;
@@ -130,21 +113,15 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
         default: boolean;
     };
     message: StringConstructor;
-    suggestionCity: {
-        type: StringConstructor;
-        default: string;
-    };
+    suggestionCity: StringConstructor;
     searchPlaceholder: StringConstructor;
-    markerSrc: {
-        type: StringConstructor;
-        default: string;
-    };
+    markerSrc: StringConstructor;
     mapKey: StringConstructor;
     mapVersion: {
         type: StringConstructor;
         default: string;
     };
-    mapStyle: StringConstructor;
+    mapStyle: import('vue').PropType<string | Record<string, any>>;
     darkMode: BooleanConstructor;
     okText: StringConstructor;
     emptyProps: import('vue').PropType<import('../ele-app/el').ElEmptyProps>;
@@ -160,6 +137,7 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     clickMessage: StringConstructor;
     selected: import('vue').PropType<PoiItem>;
     sideStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    mapPlugin: import('vue').PropType<MapPluginConstructor>;
 }>> & Readonly<{
     onDone?: ((_result: PoiItem) => any) | undefined;
     onOpen?: (() => any) | undefined;
@@ -169,20 +147,16 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
 }>, {
     height: string;
     zoom: number;
-    required: boolean;
     modelValue: boolean;
     filterable: boolean;
+    required: boolean;
     mode: import('./types').SelectMode;
     responsive: boolean;
     keywordMode: boolean;
     selectedZoom: number;
     poiLimit: number;
-    poiType: string;
-    poiKeywords: string;
     poiRadius: number;
     returnRegions: boolean;
-    suggestionCity: string;
-    markerSrc: string;
     mapVersion: string;
     darkMode: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/lib/ele-map-picker/props.cjs

@@ -24,15 +24,9 @@ const mapProps = {
     default: 30
   },
   /** POI检索兴趣点类别 */
-  poiType: {
-    type: String,
-    default: ""
-  },
+  poiType: String,
   /** POI检索关键字 */
-  poiKeywords: {
-    type: String,
-    default: ""
-  },
+  poiKeywords: String,
   /** POI检索半径 */
   poiRadius: {
     type: Number,
@@ -48,17 +42,11 @@ const mapProps = {
   /** 强制选择提示文本 */
   message: String,
   /** 输入建议的城市范围 */
-  suggestionCity: {
-    type: String,
-    default: "全国"
-  },
+  suggestionCity: String,
   /** 搜索框提示文本 */
   searchPlaceholder: String,
   /** 地图中心图标地址 */
-  markerSrc: {
-    type: String,
-    default: "https://3gimg.qq.com/lightmap/components/locationPicker2/image/marker.png"
-  },
+  markerSrc: String,
   /** 高德地图密钥 */
   mapKey: String,
   /** 高德地图版本号 */
@@ -67,7 +55,7 @@ const mapProps = {
     default: "2.0"
   },
   /** 地图风格 */
-  mapStyle: String,
+  mapStyle: [String, Object],
   /** 是否暗黑主题 */
   darkMode: Boolean,
   /** 完成按钮文字 */
@@ -91,7 +79,9 @@ const mapProps = {
   /** 回显选中的位置 */
   selected: Object,
   /** 侧栏容器样式 */
-  sideStyle: Object
+  sideStyle: Object,
+  /** 地图插件 */
+  mapPlugin: [Function, Object]
 };
 const mapPickerProps = {
   ...mapProps,

package/lib/ele-map-picker/props.d.ts

@@ -2,7 +2,7 @@ import { PropType, ExtractPropTypes } from 'vue';
 import { StyleValue } from '../ele-app/types';
 import { ElEmptyProps } from '../ele-app/el';
 import { EleModalProps } from '../ele-app/plus';
-import { SelectMode, PoiItem, MapLocale } from './types';
+import { SelectMode, PoiItem, MapPluginConstructor, MapLocale } from './types';
 
 /**
  * 属性
@@ -14,7 +14,7 @@ export declare const mapProps: {
         default: string;
     };
     /** 地图默认中心点 */
-    center: PropType<number[]>;
+    center: PropType<[number, number]>;
     /** 地图初始缩放级别 */
     zoom: {
         type: NumberConstructor;
@@ -31,15 +31,9 @@ export declare const mapProps: {
         default: number;
     };
     /** POI检索兴趣点类别 */
-    poiType: {
-        type: StringConstructor;
-        default: string;
-    };
+    poiType: StringConstructor;
     /** POI检索关键字 */
-    poiKeywords: {
-        type: StringConstructor;
-        default: string;
-    };
+    poiKeywords: StringConstructor;
     /** POI检索半径 */
     poiRadius: {
         type: NumberConstructor;
@@ -55,17 +49,11 @@ export declare const mapProps: {
     /** 强制选择提示文本 */
     message: StringConstructor;
     /** 输入建议的城市范围 */
-    suggestionCity: {
-        type: StringConstructor;
-        default: string;
-    };
+    suggestionCity: StringConstructor;
     /** 搜索框提示文本 */
     searchPlaceholder: StringConstructor;
     /** 地图中心图标地址 */
-    markerSrc: {
-        type: StringConstructor;
-        default: string;
-    };
+    markerSrc: StringConstructor;
     /** 高德地图密钥 */
     mapKey: StringConstructor;
     /** 高德地图版本号 */
@@ -74,7 +62,7 @@ export declare const mapProps: {
         default: string;
     };
     /** 地图风格 */
-    mapStyle: StringConstructor;
+    mapStyle: PropType<string | Record<string, any>>;
     /** 是否暗黑主题 */
     darkMode: BooleanConstructor;
     /** 完成按钮文字 */
@@ -99,6 +87,8 @@ export declare const mapProps: {
     selected: PropType<PoiItem>;
     /** 侧栏容器样式 */
     sideStyle: PropType<StyleValue>;
+    /** 地图插件 */
+    mapPlugin: PropType<MapPluginConstructor>;
 };
 export declare const mapPickerProps: {
     /** 弹窗是否显示 */
@@ -122,7 +112,7 @@ export declare const mapPickerProps: {
         default: string;
     };
     /** 地图默认中心点 */
-    center: PropType<number[]>;
+    center: PropType<[number, number]>;
     /** 地图初始缩放级别 */
     zoom: {
         type: NumberConstructor;
@@ -139,15 +129,9 @@ export declare const mapPickerProps: {
         default: number;
     };
     /** POI检索兴趣点类别 */
-    poiType: {
-        type: StringConstructor;
-        default: string;
-    };
+    poiType: StringConstructor;
     /** POI检索关键字 */
-    poiKeywords: {
-        type: StringConstructor;
-        default: string;
-    };
+    poiKeywords: StringConstructor;
     /** POI检索半径 */
     poiRadius: {
         type: NumberConstructor;
@@ -163,17 +147,11 @@ export declare const mapPickerProps: {
     /** 强制选择提示文本 */
     message: StringConstructor;
     /** 输入建议的城市范围 */
-    suggestionCity: {
-        type: StringConstructor;
-        default: string;
-    };
+    suggestionCity: StringConstructor;
     /** 搜索框提示文本 */
     searchPlaceholder: StringConstructor;
     /** 地图中心图标地址 */
-    markerSrc: {
-        type: StringConstructor;
-        default: string;
-    };
+    markerSrc: StringConstructor;
     /** 高德地图密钥 */
     mapKey: StringConstructor;
     /** 高德地图版本号 */
@@ -182,7 +160,7 @@ export declare const mapPickerProps: {
         default: string;
     };
     /** 地图风格 */
-    mapStyle: StringConstructor;
+    mapStyle: PropType<string | Record<string, any>>;
     /** 是否暗黑主题 */
     darkMode: BooleanConstructor;
     /** 完成按钮文字 */
@@ -207,6 +185,8 @@ export declare const mapPickerProps: {
     selected: PropType<PoiItem>;
     /** 侧栏容器样式 */
     sideStyle: PropType<StyleValue>;
+    /** 地图插件 */
+    mapPlugin: PropType<MapPluginConstructor>;
 };
 export type MapPickerProps = ExtractPropTypes<typeof mapPickerProps>;
 export type MapProps = ExtractPropTypes<typeof mapProps>;

package/lib/ele-map-picker/style/css-var.scss

@@ -2,7 +2,7 @@
 
 /* 地图位置选择器主题变量 */
 @mixin set-map-var($var) {
-  .ele-map-picker {
+  .ele-map-view {
     @include set-ele-var('map', $var);
   }
 }

package/lib/ele-map-picker/style/index.scss

@@ -43,15 +43,18 @@
   bottom: 50%;
   margin-left: -13px;
   pointer-events: none;
+  z-index: eleVar('map', 'btn-index');
 }
 
-.ele-map-view-icon-plus {
+.ele-map-view-icon-plus.el-icon {
   color: #2f54eb;
   font-size: 14px;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
+  pointer-events: none;
+  z-index: eleVar('map', 'btn-index');
 }
 
 /* 列表区域 */
@@ -158,13 +161,13 @@
   margin-top: 2px;
 }
 
-.ele-map-view-item-icon {
+.ele-map-view-item-icon.el-icon {
   flex-shrink: 0;
   font-size: 18px;
   color: elVar('text-color', 'secondary');
 }
 
-.ele-map-view-item-radio {
+.ele-map-view-item-radio.el-icon {
   font-size: 14px;
   color: elVar('color-primary');
   margin: 0 -4px 0 0;
@@ -186,6 +189,7 @@
     background: elVar('bg-color', 'overlay');
     box-shadow: elVar('box-shadow', 'lighter');
     border-radius: elVar('border-radius', 'base');
+    z-index: eleVar('map', 'btn-index');
   }
 
   & > .ele-map-view-message,
@@ -198,6 +202,7 @@
     width: max-content;
     max-width: calc(100% - 32px);
     box-shadow: elVar('box-shadow', 'light');
+    z-index: eleVar('map', 'btn-index');
   }
 
   & > .ele-map-view-btn-ok {
@@ -217,33 +222,21 @@
   padding: 6px 0;
 }
 
-.ele-map-suggest-title {
+.ele-map-suggest-title,
+.ele-map-suggest-text {
+  max-width: 260px;
+  white-space: nowrap;
   word-break: break-all;
+  text-overflow: ellipsis;
+  overflow: hidden;
 }
 
 .ele-map-suggest-text {
   color: elVar('text-color', 'secondary');
   font-size: elVar('font-size', 'small');
-  word-break: break-all;
   margin-top: 2px;
 }
 
-/* 地图图标跳动动画 */
-.ele-map-view-anim-bounce {
-  animation: mapAnimBounce 0.6s;
-}
-
-@keyframes mapAnimBounce {
-  from,
-  to {
-    transform: translateY(0);
-  }
-
-  50% {
-    transform: translateY(-20px);
-  }
-}
-
 /* 小屏幕适应 */
 @media screen and (max-width: #{$mobile-max-width}) {
   .ele-map-picker.is-responsive {
@@ -253,6 +246,7 @@
     width: 100% !important;
     max-width: 100% !important;
     height: 100% !important;
+    max-height: 100% !important;
     border-radius: 0 !important;
     display: flex !important;
     flex-direction: column !important;