ele-admin-plus 1.2.0-beta.1 → 1.2.0-beta.2

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

@@ -1,4 +1,4 @@
-import { PoiItem, CenterPoint } from '../types';
+import { PoiItem } from '../types';
 import { ElAutocompleteInstance } from '../../ele-app/el';
 
 declare const _default: import('vue').DefineComponent<{
@@ -43,7 +43,6 @@ declare const _default: import('vue').DefineComponent<{
     };
     searchPlaceholder: StringConstructor;
     markerSrc: {
-        /** 地图节点 */
         type: StringConstructor;
         default: string;
     };
@@ -51,81 +50,92 @@ declare const _default: import('vue').DefineComponent<{
     mapVersion: {
         type: StringConstructor;
         default: string;
-    }; /** 列表请求状态 */
-    mapStyle: StringConstructor;
-    darkMode: BooleanConstructor; /** 确定按钮请求状态 */
+    };
+    mapStyle: StringConstructor; /** 地图渲染状态 */
+    darkMode: BooleanConstructor;
     okText: StringConstructor;
-    emptyProps: import('vue').PropType<import('../../ele-app/el').ElEmptyProps>;
+    emptyProps: import('vue').PropType<import('../../ele-app/el').ElEmptyProps>; /** 确定按钮请求状态 */
     searchStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    /** POI数据 */
     mode: {
         type: import('vue').PropType<import('../types').SelectMode>;
         default: string;
     };
     filterable: {
         type: BooleanConstructor;
-        default: boolean; /** 选中数据 */
-    }; /** 选中数据 */
+        default: boolean;
+    };
     clickMessage: StringConstructor;
+    selected: import('vue').PropType<PoiItem>;
+    sideStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
 }, {
     SearchOutlined: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{}>>, {}, {}>;
     mapRef: import('vue').Ref<HTMLDivElement | null>;
     autocompleteRef: import('vue').Ref<ElAutocompleteInstance>;
+    listRef: import('vue').Ref<HTMLDivElement | null>;
     loading: import('vue').Ref<boolean>;
     poiLoading: import('vue').Ref<boolean>;
     confirmLoading: import('vue').Ref<boolean>;
     data: import('vue').Ref<{
+        [x: string]: any;
+        key?: string | undefined;
         name?: string | undefined;
         address?: string | undefined;
-        location: {
-            lat: number;
-            lng: number;
-        };
-        id?: string | undefined;
-        key?: string | undefined;
+        lat?: number | undefined;
+        lng?: number | undefined;
         district?: string | undefined;
-        label?: string | undefined;
-        value?: string | undefined;
+        city?: {
+            province: string;
+            city: string;
+            district: string;
+            citycode: number;
+        } | undefined;
     }[]>;
     suggestionData: import('vue').Ref<{
+        [x: string]: any;
+        key?: string | undefined;
         name?: string | undefined;
         address?: string | undefined;
-        location: {
-            lat: number;
-            lng: number;
-        };
-        id?: string | undefined;
-        key?: string | undefined;
+        lat?: number | undefined;
+        lng?: number | undefined;
         district?: string | undefined;
-        label?: string | undefined;
-        value?: string | undefined;
+        city?: {
+            province: string;
+            city: string;
+            district: string;
+            citycode: number;
+        } | undefined;
     }[]>;
     centerIconClass: import('vue').Ref<string[]>;
     keywords: import('vue').Ref<string>;
-    selected: import('vue').Ref<{
+    current: import('vue').Ref<{
+        [x: string]: any;
+        key?: string | undefined;
         name?: string | undefined;
         address?: string | undefined;
-        location: {
-            lat: number;
-            lng: number;
-        };
-        id?: string | undefined;
-        key?: string | undefined;
+        lat?: number | undefined;
+        lng?: number | undefined;
         district?: string | undefined;
-        label?: string | undefined;
-        value?: string | undefined;
-    } | null>;
+        city?: {
+            province: string;
+            city: string;
+            district: string;
+            citycode: number;
+        } | undefined;
+    } | null | undefined>;
     confirmDisabled: import('vue').ComputedRef<boolean>;
     keywordMode: import('vue').ComputedRef<boolean>;
     poiMode: import('vue').ComputedRef<boolean>;
-    onSearch: (value: string, callback?: any) => void;
-    onSearchSelect: (item: any) => void;
-    onItemClick: (item: PoiItem) => void;
-    onConfirm: () => void;
     getMapIns: () => any;
+    showInitSelected: () => void;
+    handleSearch: (keyword: string, callback?: any) => void;
+    handleSearchSelect: (item: PoiItem) => void;
+    handleItemClick: (item: PoiItem) => void;
+    handleConfirm: () => void;
 }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     mapDone: (_ins: any) => true;
     select: (_selected: PoiItem | null) => true;
-    done: (_result: CenterPoint) => true;
+    done: (_result: PoiItem) => true;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     height: {
         type: StringConstructor;
@@ -168,7 +178,6 @@ declare const _default: import('vue').DefineComponent<{
     };
     searchPlaceholder: StringConstructor;
     markerSrc: {
-        /** 地图节点 */
         type: StringConstructor;
         default: string;
     };
@@ -176,31 +185,34 @@ declare const _default: import('vue').DefineComponent<{
     mapVersion: {
         type: StringConstructor;
         default: string;
-    }; /** 列表请求状态 */
-    mapStyle: StringConstructor;
-    darkMode: BooleanConstructor; /** 确定按钮请求状态 */
+    };
+    mapStyle: StringConstructor; /** 地图渲染状态 */
+    darkMode: BooleanConstructor;
     okText: StringConstructor;
-    emptyProps: import('vue').PropType<import('../../ele-app/el').ElEmptyProps>;
+    emptyProps: import('vue').PropType<import('../../ele-app/el').ElEmptyProps>; /** 确定按钮请求状态 */
     searchStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    /** POI数据 */
     mode: {
         type: import('vue').PropType<import('../types').SelectMode>;
         default: string;
     };
     filterable: {
         type: BooleanConstructor;
-        default: boolean; /** 选中数据 */
-    }; /** 选中数据 */
+        default: boolean;
+    };
     clickMessage: StringConstructor;
+    selected: import('vue').PropType<PoiItem>;
+    sideStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
 }>> & {
     onSelect?: ((_selected: PoiItem | null) => any) | undefined;
-    onDone?: ((_result: CenterPoint) => any) | undefined;
+    onDone?: ((_result: PoiItem) => any) | undefined;
     onMapDone?: ((_ins: any) => any) | undefined;
 }, {
     height: string;
     zoom: number;
     required: boolean;
-    mode: import('../types').SelectMode;
     filterable: boolean;
+    mode: import('../types').SelectMode;
     selectedZoom: number;
     poiLimit: number;
     poiType: string;

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

@@ -2,6 +2,7 @@
 const vue = require("vue");
 const core = require("../utils/core");
 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 props = require("./props");
@@ -12,21 +13,29 @@ const _sfc_main = vue.defineComponent({
   emits: props.mapPickerEmits,
   setup(props$1, { emit }) {
     const { lang, globalConfig } = receiver.useLocale("map", props$1);
-    const isResponsive = receiver.useResponsive(props$1);
+    const isResponsive = util.useResponsive(props$1);
     const mapRef = vue.ref(null);
     const aMapKey = vue.computed(() => props$1.mapKey || globalConfig.mapKey);
     const mapProps = vue.computed(() => {
       return core.pick(props$1, props.mapPropKeys);
     });
-    const updateModelValue = (value) => {
-      emit("update:modelValue", value);
+    const updateModelValue = (visible) => {
+      emit("update:modelValue", visible);
     };
-    const onMapDone = (ins) => {
+    const handleMapDone = (ins) => {
       emit("mapDone", ins);
     };
-    const onDone = (result) => {
+    const handleDone = (result) => {
       emit("done", result);
     };
+    vue.watch(
+      () => props$1.modelValue,
+      (visible) => {
+        if (visible) {
+          mapRef.value && mapRef.value.showInitSelected();
+        }
+      }
+    );
     return {
       lang,
       isResponsive,
@@ -34,8 +43,8 @@ const _sfc_main = vue.defineComponent({
       aMapKey,
       mapProps,
       updateModelValue,
-      onMapDone,
-      onDone
+      handleMapDone,
+      handleDone
     };
   }
 });
@@ -66,8 +75,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         okText: _ctx.lang.ok,
         mapKey: _ctx.aMapKey,
         mode: _ctx.keywordMode ? "keyword" : _ctx.mode,
-        onMapDone: _ctx.onMapDone,
-        onDone: _ctx.onDone
+        onMapDone: _ctx.handleMapDone,
+        onDone: _ctx.handleDone
       }), null, 16, ["message", "clickMessage", "searchPlaceholder", "okText", "mapKey", "mode", "onMapDone", "onDone"])
     ]),
     _: 2

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

@@ -1,6 +1,6 @@
 import { default as MapViewType } from "./components/map-view";
 import { MapProps } from './props';
-import { CenterPoint, MapLocale } from './types';
+import { PoiItem, MapLocale } from './types';
 import { Ref } from 'vue';
 
 export type MapViewInstance = InstanceType<typeof MapViewType> | null;
@@ -45,15 +45,15 @@ declare const _default: import('vue').DefineComponent<{
     };
     returnRegions: BooleanConstructor;
     required: {
-        type: BooleanConstructor; /** 地图组件 */
+        type: BooleanConstructor;
         default: boolean;
     };
     message: StringConstructor;
     suggestionCity: {
         type: StringConstructor;
-        default: string;
-    };
-    searchPlaceholder: StringConstructor; /** 地图属性 */
+        default: string; /** 地图密钥 */
+    }; /** 地图密钥 */
+    searchPlaceholder: StringConstructor;
     markerSrc: {
         type: StringConstructor;
         default: string;
@@ -61,8 +61,8 @@ declare const _default: import('vue').DefineComponent<{
     mapKey: StringConstructor;
     mapVersion: {
         type: StringConstructor;
-        default: string; /** 地图渲染完成事件 */
-    }; /** 地图渲染完成事件 */
+        default: string;
+    };
     mapStyle: StringConstructor;
     darkMode: BooleanConstructor;
     okText: StringConstructor;
@@ -77,17 +77,19 @@ declare const _default: import('vue').DefineComponent<{
         default: boolean;
     };
     clickMessage: StringConstructor;
+    selected: import('vue').PropType<PoiItem>;
+    sideStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
 }, {
     lang: import('vue').ComputedRef<MapLocale>;
     isResponsive: import('vue').ComputedRef<boolean>;
     mapRef: Ref<MapViewInstance>;
     aMapKey: import('vue').ComputedRef<string | undefined>;
     mapProps: import('vue').ComputedRef<Partial<MapProps>>;
-    updateModelValue: (value: boolean) => void;
-    onMapDone: (ins: any) => void;
-    onDone: (result: CenterPoint) => void;
+    updateModelValue: (visible: boolean) => void;
+    handleMapDone: (ins: any) => void;
+    handleDone: (result: PoiItem) => void;
 }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    done: (_result: CenterPoint) => boolean;
+    done: (_result: PoiItem) => boolean;
     mapDone: (_ins: any) => boolean;
     open: () => boolean;
     closed: () => boolean;
@@ -133,15 +135,15 @@ declare const _default: import('vue').DefineComponent<{
     };
     returnRegions: BooleanConstructor;
     required: {
-        type: BooleanConstructor; /** 地图组件 */
+        type: BooleanConstructor;
         default: boolean;
     };
     message: StringConstructor;
     suggestionCity: {
         type: StringConstructor;
-        default: string;
-    };
-    searchPlaceholder: StringConstructor; /** 地图属性 */
+        default: string; /** 地图密钥 */
+    }; /** 地图密钥 */
+    searchPlaceholder: StringConstructor;
     markerSrc: {
         type: StringConstructor;
         default: string;
@@ -149,8 +151,8 @@ declare const _default: import('vue').DefineComponent<{
     mapKey: StringConstructor;
     mapVersion: {
         type: StringConstructor;
-        default: string; /** 地图渲染完成事件 */
-    }; /** 地图渲染完成事件 */
+        default: string;
+    };
     mapStyle: StringConstructor;
     darkMode: BooleanConstructor;
     okText: StringConstructor;
@@ -165,18 +167,20 @@ declare const _default: import('vue').DefineComponent<{
         default: boolean;
     };
     clickMessage: StringConstructor;
+    selected: import('vue').PropType<PoiItem>;
+    sideStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
 }>> & {
     "onUpdate:modelValue"?: ((_value: boolean) => any) | undefined;
     onOpen?: (() => any) | undefined;
     onClosed?: (() => any) | undefined;
-    onDone?: ((_result: CenterPoint) => any) | undefined;
+    onDone?: ((_result: PoiItem) => any) | undefined;
     onMapDone?: ((_ins: any) => any) | undefined;
 }, {
     height: string;
     required: boolean;
-    mode: import('./types').SelectMode;
     modelValue: boolean;
     filterable: boolean;
+    mode: import('./types').SelectMode;
     zoom: number;
     responsive: boolean;
     keywordMode: boolean;

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

@@ -87,7 +87,11 @@ const mapProps = {
     default: true
   },
   /** 强制选择点击地图提示文本 */
-  clickMessage: String
+  clickMessage: String,
+  /** 回显选中的位置 */
+  selected: Object,
+  /** 侧栏容器样式 */
+  sideStyle: Object
 };
 const mapPickerProps = {
   ...mapProps,

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

@@ -1,4 +1,4 @@
-import { MapLocale, CenterPoint, SelectMode } from './types';
+import { SelectMode, PoiItem, MapLocale } from './types';
 import { EleModalProps } from '../ele-app/plus';
 import { ElEmptyProps } from '../ele-app/el';
 import { PropType, ExtractPropTypes } from 'vue';
@@ -94,6 +94,10 @@ export declare const mapProps: {
     };
     /** 强制选择点击地图提示文本 */
     clickMessage: StringConstructor;
+    /** 回显选中的位置 */
+    selected: PropType<PoiItem>;
+    /** 侧栏容器样式 */
+    sideStyle: PropType<Partial<import('vue').CSSProperties>>;
 };
 export declare const mapPickerProps: {
     /** 弹窗是否显示 */
@@ -198,6 +202,10 @@ export declare const mapPickerProps: {
     };
     /** 强制选择点击地图提示文本 */
     clickMessage: StringConstructor;
+    /** 回显选中的位置 */
+    selected: PropType<PoiItem>;
+    /** 侧栏容器样式 */
+    sideStyle: PropType<Partial<import('vue').CSSProperties>>;
 };
 export type MapPickerProps = ExtractPropTypes<typeof mapPickerProps>;
 export type MapProps = ExtractPropTypes<typeof mapProps>;
@@ -206,7 +214,7 @@ export type MapProps = ExtractPropTypes<typeof mapProps>;
  */
 export declare const mapPickerEmits: {
     /** 选择完成事件 */
-    done: (_result: CenterPoint) => boolean;
+    done: (_result: PoiItem) => boolean;
     /** 地图渲染完成事件 */
     mapDone: (_ins: any) => boolean;
     /** 弹窗打开事件 */

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

@@ -1,9 +1,9 @@
 "use strict";
-require("element-plus/lib/components/autocomplete/style/index");
-require("element-plus/lib/components/input/style/index");
-require("element-plus/lib/components/button/style/index");
-require("element-plus/lib/components/icon/style/index");
-require("element-plus/lib/components/empty/style/index");
+require("element-plus/es/components/autocomplete/style/index");
+require("element-plus/es/components/input/style/index");
+require("element-plus/es/components/button/style/index");
+require("element-plus/es/components/icon/style/index");
+require("element-plus/es/components/empty/style/index");
 require("../../ele-loading/style/index");
 require("../../ele-modal/style/index");
 require("./index.scss");

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

@@ -0,0 +1 @@
+

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

@@ -15,6 +15,14 @@
 /* 主体区域 */
 .ele-map-view {
   display: flex;
+
+  &.is-poi-mode > .ele-loading-spinner {
+    background: none;
+
+    & > .ele-loading-dot {
+      display: none;
+    }
+  }
 }
 
 /* 地图容器 */
@@ -33,6 +41,7 @@
   left: 50%;
   bottom: 50%;
   margin-left: -13px;
+  pointer-events: none;
 }
 
 .ele-map-view-icon-plus {
@@ -109,7 +118,7 @@
   display: flex;
   align-items: center;
   padding: 8px 14px;
-  transition: background-color $ele-transition;
+  transition: background-color $transition-base;
   box-sizing: border-box;
   position: relative;
   cursor: pointer;
@@ -157,11 +166,10 @@
   font-size: 14px;
   color: elVar('color-primary');
   margin: 0 -4px 0 0;
-  visibility: hidden;
 }
 
-.ele-map-view-item.is-active .ele-map-view-item-radio {
-  visibility: visible;
+.ele-map-view-item:not(.is-active) .ele-map-view-item-radio {
+  visibility: hidden;
 }
 
 /* 地图底部提示信息 */
@@ -170,8 +178,8 @@
     position: absolute;
     top: 8px;
     left: 8px;
-    padding: 8px;
-    width: 228px;
+    padding: 0;
+    width: 200px;
     max-width: calc(100% - 16px);
     background: elVar('bg-color');
     box-shadow: elVar('box-shadow', 'lighter');
@@ -249,6 +257,11 @@
 
     & > .el-dialog__header {
       flex-shrink: 0;
+
+      .ele-modal-tool-max,
+      .ele-modal-resize-icon {
+        display: none;
+      }
     }
 
     & > .el-dialog__body {
@@ -271,8 +284,9 @@
     }
 
     .ele-map-view-side {
-      width: 100%;
       height: 68%;
+      width: 100%;
+      min-width: 100%;
 
       & > .ele-map-view-search {
         padding-top: 6px;

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

@@ -1,18 +1,7 @@
 /**
- * 返回数据
+ * 位置选择模式
  */
-export interface CenterPoint {
-  /** 名称 */
-  name?: string;
-  /** 位置 */
-  address?: string;
-  /** 纬度 */
-  lat?: number;
-  /** 经度 */
-  lng?: number;
-  /** 城市 */
-  city?: City;
-}
+export type SelectMode = 'lnglat' | 'poi' | 'keyword';
 
 /**
  * 行政区数据
@@ -28,61 +17,44 @@ export interface City {
   citycode: number;
 }
 
-/**
- * 坐标
- */
-export interface PoiLocation {
-  /** 纬度 */
-  lat: number;
-  /** 经度 */
-  lng: number;
-}
-
 /**
  * 检索结果
  */
-export interface PoiItem {
+export interface PoiItem extends Record<string, any> {
+  /** 唯一标识 */
+  key?: string;
   /** 地点名称 */
   name?: string;
   /** 详细地址 */
   address?: string;
-  /** 经纬度坐标 */
-  location: PoiLocation;
-  /** 数据唯一标识 */
-  id?: string;
-  /** 输入建议唯一标识 */
-  key?: string;
+  /** 纬度 */
+  lat?: number;
+  /** 经度 */
+  lng?: number;
   /** 输入建议的街道 */
   district?: string;
-  /** 输入建议显示的名称 */
-  label?: string;
-  /** 输入建议显示的值 */
-  value?: string;
+  /** 行政区 */
+  city?: City;
 }
 
-/**
- * 位置选择模式
- */
-export type SelectMode = 'lnglat' | 'poi' | 'keyword';
-
 /**
  * 实例
  */
 export interface MapState {
   /** 上次搜索建议 */
-  lastSuggestion: string;
+  lastSuggestion?: string;
   /** 选中的搜索建议 */
-  selectedSuggestion: PoiItem | null;
+  selectedSuggestion?: PoiItem | null;
   /** 是否是选中条目移动地图 */
-  isItemClickMove: boolean;
+  isItemClickMove?: boolean;
   /** 地图实例 */
-  mapIns: any;
+  mapIns?: any;
   /** 检索实例 */
-  placeSearchIns: any;
+  placeSearchIns?: any;
   /** 搜索建议实例 */
-  autoCompleteIns: any;
+  autoCompleteIns?: any;
   /** 地图标记点 */
-  centerMarker: any;
+  centerMarker?: any;
 }
 
 /**
@@ -95,3 +67,5 @@ export interface MapLocale {
   ok: string;
   clickMessage: string;
 }
+
+export type CenterPoint = PoiItem;