comp-poi-picker.component.mjs 10.0 KB

12345678910
  1. /**
  2. * @copyright © 未来飞马 © 未来全栈 www.fmode.cn
  3. * 版权所有 © 未来飞马 © 江西脑控科技有限公司 Copyright © Fmode Technology Co., Ltd.
  4. * 保留所有权利 All Rights Reserved.
  5. * /home/ryan/workspace/nova/nova-admin/dist/fmode-ng/esm2022/lib/map/comp-poi-picker/comp-poi-picker.component.mjs
  6. */
  7. import{Component,Input,Output,EventEmitter,ViewChild,ElementRef}from"@angular/core";import Parse from"parse";import{IonModal}from"@ionic/angular";import*as AMapLoader from"@amap/amap-jsapi-loader";import*as i0 from"@angular/core";import*as i1 from"@angular/common";import*as i2 from"@angular/forms";import*as i3 from"@ionic/angular";window._AMapSecurityConfig={securityJsCode:"32aa3f4ab0fa0061de03edd4eafdd50a"};export class CompPoiPickerComponent{get name(){return this._name}set name(e){this._name=e,this.nameChange.emit(e)}get address(){return this._address}set address(e){this._address=e,this.addressChange.emit(e)}get location(){return this._location}set location(e){this._location=e,this.locationChange.emit(e)}constructor(){this.nameChange=new EventEmitter,this.addressChange=new EventEmitter,this.locationChange=new EventEmitter,this.isModalOpen=!1}cancel(){this.isModalOpen=!1,this.modal.dismiss(null,"cancel")}confirm(){this.isModalOpen=!1,this.modal.dismiss(this.address,"confirm")}onWillDismiss(e){"confirm"===e.detail.role&&console.log("确认")}openModal(){this.isModalOpen=!0,setTimeout((()=>{this.initMap()}),800)}ngAfterViewInit(){}initMap(){this.createMap()}async createMap(){this.AMap=await AMapLoader.load({key:"473b52010df7d3a32db0a2f5db245c8e",version:"2.0"});let e=this.container.nativeElement;this.map=new this.AMap.Map(e),this.goCurrentCenter()}goCurrentCenter(){this.AMap.plugin(["AMap.Geolocation"],(()=>{let e=new this.AMap.Geolocation({enableHighAccuracy:!0,timeout:1e4,maximumAge:0,convert:!0,showButton:!0,buttonPosition:"RB",buttonOffset:new this.AMap.Pixel(10,10),showMarker:!1,showCircle:!1,panToLocation:!0,zoomToAccuracy:!1});this.map.addControl(e),e.getCurrentPosition((function(e,n){"complete"===e?(console.log("当前位置经度:"+n.position.getLng()),console.log("当前位置纬度:"+n.position.getLat())):console.log("定位失败:"+n.message)}))}))}searchByAddress(){let e=this.panel.nativeElement;this.AMap.plugin(["AMap.PlaceSearch"],(()=>{let n=new this.AMap.PlaceSearch({pageSize:3,pageIndex:1,map:this.map,panel:e,autoFitView:!0});n.on("selectChanged",(e=>{this.name=e.selected.data.name,this.address=e.selected.data.address,this.location=new Parse.GeoPoint({latitude:e.selected.data.location.lat,longitude:e.selected.data.location.lng}),this.createCenterMarker()})),n.search(this.address)}))}createCenterMarker(){this.centerMarker||(this.centerMarker=new this.AMap.Marker({position:this.map.getCenter(),offset:new this.AMap.Pixel(-15,-15)}),this.map.add(this.centerMarker),this.map.on("dragging",(()=>{this.centerMarker.setPosition(this.map.getCenter())})),this.map.on("dragend",(()=>{let e=this.centerMarker.getPosition();this.location=new Parse.GeoPoint({latitude:e.lat,longitude:e.lng})})))}static{this.ɵfac=i0.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"17.3.12",ngImport:i0,type:CompPoiPickerComponent,deps:[],target:i0.ɵɵFactoryTarget.Component})}static{this.ɵcmp=i0.ɵɵngDeclareComponent({minVersion:"14.0.0",version:"17.3.12",type:CompPoiPickerComponent,selector:"fm-map-poi-picker",inputs:{_name:["name","_name"],_address:["address","_address"],_location:["location","_location"]},outputs:{nameChange:"nameChange",addressChange:"addressChange",locationChange:"locationChange"},viewQueries:[{propertyName:"container",first:!0,predicate:["container"],descendants:!0},{propertyName:"panel",first:!0,predicate:["panel"],descendants:!0},{propertyName:"modal",first:!0,predicate:IonModal,descendants:!0}],ngImport:i0,template:'\x3c!-- 未选点 --\x3e\n<ion-button (click)="openModal()" expand="block">开始选点</ion-button>\n\n\x3c!-- 已选点 --\x3e\n\n<ion-modal [isOpen]="isModalOpen" (willDismiss)="onWillDismiss($event)">\n<ng-template>\n <ion-header>\n <ion-toolbar>\n <ion-buttons slot="start">\n <ion-button (click)="cancel()">Cancel</ion-button>\n </ion-buttons>\n <ion-title>地图选点<ng-container *ngIf="location">({{location.latitude}},{{location.longitude}})</ng-container></ion-title>\n <ion-buttons slot="end">\n <ion-button (click)="confirm()" [strong]="true">Confirm</ion-button>\n </ion-buttons>\n </ion-toolbar>\n </ion-header>\n <ion-content class="ion-padding" style="height:100%">\n \x3c!-- 详细地址 --\x3e\n <ion-item>\n <ion-input\n label="请输入详细地址"\n labelPlacement="stacked"\n type="text"\n placeholder="精确到门牌号"\n [(ngModel)]="address"\n ></ion-input>\n <ion-button slot="end" (click)="searchByAddress()">搜索</ion-button>\n </ion-item>\n \n \x3c!-- 地图选点 --\x3e\n <div #container class="container"></div>\n <div #panel class="panel"></div>\n\n </ion-content>\n</ng-template>\n</ion-modal>\n\n',styles:[".container{width:100%;height:100%}.panel{position:absolute;background-color:#fff;max-height:50%;overflow-y:auto;top:12%;right:10px;width:45%}\n"],dependencies:[{kind:"directive",type:i1.NgIf,selector:"[ngIf]",inputs:["ngIf","ngIfThen","ngIfElse"]},{kind:"directive",type:i2.NgControlStatus,selector:"[formControlName],[ngModel],[formControl]"},{kind:"directive",type:i2.NgModel,selector:"[ngModel]:not([formControlName]):not([formControl])",inputs:["name","disabled","ngModel","ngModelOptions"],outputs:["ngModelChange"],exportAs:["ngModel"]},{kind:"component",type:i3.IonButton,selector:"ion-button",inputs:["buttonType","color","disabled","download","expand","fill","form","href","mode","rel","routerAnimation","routerDirection","shape","size","strong","target","type"]},{kind:"component",type:i3.IonButtons,selector:"ion-buttons",inputs:["collapse"]},{kind:"component",type:i3.IonContent,selector:"ion-content",inputs:["color","fixedSlotPlacement","forceOverscroll","fullscreen","scrollEvents","scrollX","scrollY"]},{kind:"component",type:i3.IonHeader,selector:"ion-header",inputs:["collapse","mode","translucent"]},{kind:"component",type:i3.IonInput,selector:"ion-input",inputs:["autocapitalize","autocomplete","autocorrect","autofocus","clearInput","clearInputIcon","clearOnEdit","color","counter","counterFormatter","debounce","disabled","enterkeyhint","errorText","fill","helperText","inputmode","label","labelPlacement","max","maxlength","min","minlength","mode","multiple","name","pattern","placeholder","readonly","required","shape","spellcheck","step","type","value"]},{kind:"component",type:i3.IonItem,selector:"ion-item",inputs:["button","color","detail","detailIcon","disabled","download","href","lines","mode","rel","routerAnimation","routerDirection","target","type"]},{kind:"component",type:i3.IonTitle,selector:"ion-title",inputs:["color","size"]},{kind:"component",type:i3.IonToolbar,selector:"ion-toolbar",inputs:["color","mode"]},{kind:"component",type:i3.IonModal,selector:"ion-modal"},{kind:"directive",type:i3.TextValueAccessor,selector:"ion-input:not([type=number]),ion-textarea,ion-searchbar"}]})}}i0.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"17.3.12",ngImport:i0,type:CompPoiPickerComponent,decorators:[{type:Component,args:[{selector:"fm-map-poi-picker",template:'\x3c!-- 未选点 --\x3e\n<ion-button (click)="openModal()" expand="block">开始选点</ion-button>\n\n\x3c!-- 已选点 --\x3e\n\n<ion-modal [isOpen]="isModalOpen" (willDismiss)="onWillDismiss($event)">\n<ng-template>\n <ion-header>\n <ion-toolbar>\n <ion-buttons slot="start">\n <ion-button (click)="cancel()">Cancel</ion-button>\n </ion-buttons>\n <ion-title>地图选点<ng-container *ngIf="location">({{location.latitude}},{{location.longitude}})</ng-container></ion-title>\n <ion-buttons slot="end">\n <ion-button (click)="confirm()" [strong]="true">Confirm</ion-button>\n </ion-buttons>\n </ion-toolbar>\n </ion-header>\n <ion-content class="ion-padding" style="height:100%">\n \x3c!-- 详细地址 --\x3e\n <ion-item>\n <ion-input\n label="请输入详细地址"\n labelPlacement="stacked"\n type="text"\n placeholder="精确到门牌号"\n [(ngModel)]="address"\n ></ion-input>\n <ion-button slot="end" (click)="searchByAddress()">搜索</ion-button>\n </ion-item>\n \n \x3c!-- 地图选点 --\x3e\n <div #container class="container"></div>\n <div #panel class="panel"></div>\n\n </ion-content>\n</ng-template>\n</ion-modal>\n\n',styles:[".container{width:100%;height:100%}.panel{position:absolute;background-color:#fff;max-height:50%;overflow-y:auto;top:12%;right:10px;width:45%}\n"]}]}],ctorParameters:()=>[],propDecorators:{container:[{type:ViewChild,args:["container"]}],panel:[{type:ViewChild,args:["panel"]}],_name:[{type:Input,args:["name"]}],nameChange:[{type:Output}],_address:[{type:Input,args:["address"]}],addressChange:[{type:Output}],_location:[{type:Input,args:["location"]}],locationChange:[{type:Output}],modal:[{type:ViewChild,args:[IonModal]}]}});
  8. var MODULE_PATH_NEED = `6K+l5paH5Lu25piv5pys6aG555uu55qE5LiA6YOo5YiGIFRoaXMgZmlsZSBpcyBwYXJ0IG9mIHRoZSBDb21wb25lbnRzIGluIEZtb2RlIEluYy4KICAgIOeJiOadg+aJgOaciSDCqSDmnKrmnaXpo57pqawgwqkg5rGf6KW/6ISR5o6n56eR5oqA5pyJ6ZmQ5YWs5Y+4IENvcHlyaWdodCDCqSBGbW9kZSBUZWNobm9sb2d5IENvLiwgTHRkLgogICAg5L+d55WZ5omA5pyJ5p2D5YipIEFsbCBSaWdodHMgUmVzZXJ2ZWQuCiAgICDkuKXnpoHlnKjmnKrnu4/mjojmnYPnmoTmg4XlhrXkuIvvvIzpgJrov4fku7vkvZXlqpLku4vlpI3liLbmraTmlofku7YgVW5hdXRob3JpemVkIGNvcHlpbmcgb2YgdGhpcyBmaWxlLCB2aWEgYW55IG1lZGl1bSBpcyBzdHJpY3RseSBwcm9oaWJpdGVkCiAgICDor6Xmlofku7bmmK/kuJPmnInnmoTmnLrlr4bmlofku7YgUHJvcHJpZXRhcnkgYW5kIGNvbmZpZGVudGlhbAogICAKICAgIENvcHlyaWdodCAyMDIxLW5vdyBGbW9kZSBJbmMuIHN1cHBvcnRAZm1vZGUuY24uIDE4NjA3MDA3MDczLgogICAg5L+d55WZ5omA5pyJ5p2D5YipIEFsbCByaWdodHMgcmVzZXJ2ZWQuCgogICAgUEFUSDovaG9tZS9yeWFuL3dvcmtzcGFjZS9ub3ZhL25vdmEtYWRtaW4vZGlzdC9mbW9kZS1uZy9lc20yMDIyL2xpYi9tYXAvY29tcC1wb2ktcGlja2VyL2NvbXAtcG9pLXBpY2tlci5jb21wb25lbnQubWpz`