|
|
@ -1,4 +1,4 @@ |
|
|
|
import { Component, OnInit } from '@angular/core'; |
|
|
|
import {Component, OnInit} from '@angular/core'; |
|
|
|
import {FormBuilder, FormGroup, Validators} from '@angular/forms'; |
|
|
|
import {FormBuilder, FormGroup, Validators} from '@angular/forms'; |
|
|
|
import {environment} from '../../../../environments/environment'; |
|
|
|
import {environment} from '../../../../environments/environment'; |
|
|
|
import {MerchantService} from '../../../services/merchant.service'; |
|
|
|
import {MerchantService} from '../../../services/merchant.service'; |
|
|
@ -7,174 +7,179 @@ import {ActivatedRoute} from '@angular/router'; |
|
|
|
import {ValidatorsService} from '../../../services/validators.service'; |
|
|
|
import {ValidatorsService} from '../../../services/validators.service'; |
|
|
|
import {MerchantStoreService} from '../../../services/merchant-store.service'; |
|
|
|
import {MerchantStoreService} from '../../../services/merchant-store.service'; |
|
|
|
|
|
|
|
|
|
|
|
declare var AMap: any; // 一定要声明AMap,要不然报错找不到AMap
|
|
|
|
declare var AMap: any; // 一定要声明AMap,要不然报错找不到AMap
|
|
|
|
declare var AMapUI: any; |
|
|
|
declare var AMapUI: any; |
|
|
|
|
|
|
|
|
|
|
|
@Component({ |
|
|
|
@Component({ |
|
|
|
selector: 'app-store-edit', |
|
|
|
selector: 'app-store-edit', |
|
|
|
templateUrl: './store-edit.component.html', |
|
|
|
templateUrl: './store-edit.component.html', |
|
|
|
styleUrls: ['./store-edit.component.scss'] |
|
|
|
styleUrls: ['./store-edit.component.scss'] |
|
|
|
}) |
|
|
|
}) |
|
|
|
export class StoreEditComponent implements OnInit { |
|
|
|
export class StoreEditComponent implements OnInit { |
|
|
|
|
|
|
|
|
|
|
|
validateForm!: FormGroup; |
|
|
|
validateForm!: FormGroup; |
|
|
|
data: any; |
|
|
|
data: any; |
|
|
|
editFlag = false; |
|
|
|
editFlag = false; |
|
|
|
id: number; |
|
|
|
id: number; |
|
|
|
passwordVisible = false; |
|
|
|
passwordVisible = false; |
|
|
|
logoFile = []; |
|
|
|
logoFile = []; |
|
|
|
WEB_SERVE_URL = environment.baseUrl; |
|
|
|
WEB_SERVE_URL = environment.baseUrl; |
|
|
|
previewVisible = false; |
|
|
|
previewVisible = false; |
|
|
|
constructor( |
|
|
|
|
|
|
|
private fb: FormBuilder, |
|
|
|
|
|
|
|
private merchantStore: MerchantStoreService, |
|
|
|
|
|
|
|
private message: NzMessageService, // 信息提示
|
|
|
|
|
|
|
|
private activatedRoute: ActivatedRoute, |
|
|
|
|
|
|
|
) { |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ngOnInit(): void { |
|
|
|
constructor( |
|
|
|
this.activatedRoute.queryParams.subscribe(queryParams => { |
|
|
|
private fb: FormBuilder, |
|
|
|
if (queryParams.storeId != null) { |
|
|
|
private merchantStore: MerchantStoreService, |
|
|
|
this.editFlag = true; |
|
|
|
private message: NzMessageService, // 信息提示
|
|
|
|
this.id = queryParams.storeId; |
|
|
|
private activatedRoute: ActivatedRoute, |
|
|
|
this.getDetails(queryParams.storeId); |
|
|
|
) { |
|
|
|
} else { |
|
|
|
} |
|
|
|
this.getMap (); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
this.validateForm = this.fb.group({ |
|
|
|
|
|
|
|
telephone: [null, [Validators.required, ValidatorsService.mobile]], |
|
|
|
|
|
|
|
password: [null, [Validators.required, ValidatorsService.minLength(6)]], |
|
|
|
|
|
|
|
storeKey: [null, [Validators.required, ValidatorsService.maxLength(10)]], |
|
|
|
|
|
|
|
storeName: [null, [Validators.required]], |
|
|
|
|
|
|
|
address: [null, [Validators.required]], |
|
|
|
|
|
|
|
latitude: [29.553134, [Validators.required]], |
|
|
|
|
|
|
|
longitude: [106.565428, [Validators.required]], |
|
|
|
|
|
|
|
status: [null], |
|
|
|
|
|
|
|
companyId: [null], |
|
|
|
|
|
|
|
merchantId: [null], |
|
|
|
|
|
|
|
createTime: [null], |
|
|
|
|
|
|
|
secUser: {}, |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 返回
|
|
|
|
ngOnInit(): void { |
|
|
|
getBack() { |
|
|
|
this.activatedRoute.queryParams.subscribe(queryParams => { |
|
|
|
history.back(); |
|
|
|
if (queryParams.storeId != null) { |
|
|
|
} |
|
|
|
this.editFlag = true; |
|
|
|
|
|
|
|
this.id = queryParams.storeId; |
|
|
|
|
|
|
|
this.getDetails(queryParams.storeId); |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
this.getMap(); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
this.validateForm = this.fb.group({ |
|
|
|
|
|
|
|
telephone: [null, [Validators.required, ValidatorsService.mobile]], |
|
|
|
|
|
|
|
password: [null, [Validators.required, ValidatorsService.minLength(6)]], |
|
|
|
|
|
|
|
storeKey: [null, [Validators.required, ValidatorsService.maxLength(10)]], |
|
|
|
|
|
|
|
storeName: [null, [Validators.required]], |
|
|
|
|
|
|
|
address: [null, [Validators.required]], |
|
|
|
|
|
|
|
latitude: [29.553134, [Validators.required]], |
|
|
|
|
|
|
|
longitude: [106.565428, [Validators.required]], |
|
|
|
|
|
|
|
status: [null], |
|
|
|
|
|
|
|
companyId: [null], |
|
|
|
|
|
|
|
regionId: [null], |
|
|
|
|
|
|
|
merchantId: [null], |
|
|
|
|
|
|
|
createTime: [null], |
|
|
|
|
|
|
|
secUser: {}, |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
// 重置
|
|
|
|
} |
|
|
|
public resetForm(): void { |
|
|
|
|
|
|
|
this.validateForm.reset(); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 课程保存
|
|
|
|
// 返回
|
|
|
|
public getSave(): void { |
|
|
|
getBack() { |
|
|
|
// tslint:disable-next-line:forin
|
|
|
|
history.back(); |
|
|
|
for (const i in this.validateForm.controls) { |
|
|
|
|
|
|
|
this.validateForm.controls[i].markAsDirty(); |
|
|
|
|
|
|
|
this.validateForm.controls[i].updateValueAndValidity(); |
|
|
|
|
|
|
|
if (this.validateForm.controls[i].errors != null) { |
|
|
|
|
|
|
|
this.message.error('必填项不能为空'); |
|
|
|
|
|
|
|
return; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
console.log(this.validateForm.value); |
|
|
|
|
|
|
|
this.validateForm.value['secUser']['telephone'] = this.validateForm.value.telephone; |
|
|
|
// 重置
|
|
|
|
this.validateForm.value['secUser']['password'] = this.validateForm.value.password; |
|
|
|
public resetForm(): void { |
|
|
|
if (this.logoFile.length !== 0) { |
|
|
|
this.validateForm.reset(); |
|
|
|
if (this.logoFile[0]['response'] != null) { |
|
|
|
|
|
|
|
this.validateForm.value.merchantLogo = this.logoFile[0]['response']['return_data'][0]; |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
this.validateForm.value.merchantLogo = this.logoFile[0].name; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
if (this.editFlag) { |
|
|
|
|
|
|
|
this.validateForm.value.id = this.id; |
|
|
|
|
|
|
|
this.merchantStore.updateMerchantStore(this.validateForm.value, data => { |
|
|
|
|
|
|
|
if (data['return_code'] === '000000') { |
|
|
|
|
|
|
|
this.getBack(); |
|
|
|
|
|
|
|
this.message.success('修改成功'); |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
this.message.create('error', '修改失败'); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.merchantStore.insertMerchantStore(this.validateForm.value, data => { |
|
|
|
// 课程保存
|
|
|
|
if (data['return_code'] === '000000') { |
|
|
|
public getSave(): void { |
|
|
|
this.getBack(); |
|
|
|
// tslint:disable-next-line:forin
|
|
|
|
this.message.success('添加成功'); |
|
|
|
for (const i in this.validateForm.controls) { |
|
|
|
|
|
|
|
this.validateForm.controls[i].markAsDirty(); |
|
|
|
|
|
|
|
this.validateForm.controls[i].updateValueAndValidity(); |
|
|
|
|
|
|
|
if (this.validateForm.controls[i].errors != null) { |
|
|
|
|
|
|
|
this.message.error('必填项不能为空'); |
|
|
|
|
|
|
|
return; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
console.log(this.validateForm.value); |
|
|
|
|
|
|
|
this.validateForm.value['secUser']['telephone'] = this.validateForm.value.telephone; |
|
|
|
|
|
|
|
this.validateForm.value['secUser']['password'] = this.validateForm.value.password; |
|
|
|
|
|
|
|
if (this.logoFile.length !== 0) { |
|
|
|
|
|
|
|
if (this.logoFile[0]['response'] != null) { |
|
|
|
|
|
|
|
this.validateForm.value.merchantLogo = this.logoFile[0]['response']['return_data'][0]; |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
this.validateForm.value.merchantLogo = this.logoFile[0].name; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
if (this.editFlag) { |
|
|
|
|
|
|
|
this.validateForm.value.id = this.id; |
|
|
|
|
|
|
|
this.merchantStore.updateMerchantStore(this.validateForm.value, data => { |
|
|
|
|
|
|
|
if (data['return_code'] === '000000') { |
|
|
|
|
|
|
|
this.getBack(); |
|
|
|
|
|
|
|
this.message.success('修改成功'); |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
this.message.create('error', '修改失败'); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
} else { |
|
|
|
} else { |
|
|
|
this.message.create('error', '保存失败'); |
|
|
|
|
|
|
|
|
|
|
|
this.merchantStore.insertMerchantStore(this.validateForm.value, data => { |
|
|
|
|
|
|
|
if (data['return_code'] === '000000') { |
|
|
|
|
|
|
|
this.getBack(); |
|
|
|
|
|
|
|
this.message.success('添加成功'); |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
this.message.create('error', '保存失败'); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
public getDetails(id) { |
|
|
|
public getDetails(id) { |
|
|
|
this.merchantStore.getMerchantStoreById(id, data => { |
|
|
|
this.merchantStore.getMerchantStoreById(id, data => { |
|
|
|
if (data['return_code'] === '000000') { |
|
|
|
if (data['return_code'] === '000000') { |
|
|
|
data['return_data'].telephone = data['return_data'].secUser.loginName; |
|
|
|
data['return_data'].telephone = data['return_data'].secUser.loginName; |
|
|
|
data['return_data'].password = data['return_data'].secUser.password; |
|
|
|
data['return_data'].password = data['return_data'].secUser.password; |
|
|
|
this.validateForm.patchValue(data['return_data']); |
|
|
|
this.validateForm.patchValue(data['return_data']); |
|
|
|
this.getMap (); |
|
|
|
this.getMap(); |
|
|
|
} else { |
|
|
|
} else { |
|
|
|
this.message.create('error', data['return_msg']); |
|
|
|
this.message.create('error', data['return_msg']); |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 地图要放到函数里。
|
|
|
|
|
|
|
|
getMap() { |
|
|
|
|
|
|
|
// tslint:disable-next-line:variable-name
|
|
|
|
|
|
|
|
AMapUI.loadUI(['misc/PositionPicker'], PositionPicker => { |
|
|
|
|
|
|
|
console.log(this.validateForm.value); |
|
|
|
|
|
|
|
const map = new AMap.Map('container', { |
|
|
|
|
|
|
|
resizeEnable: true, |
|
|
|
|
|
|
|
scrollWheel: false, |
|
|
|
|
|
|
|
center: [this.validateForm.value.longitude, this.validateForm.value.latitude], // 初始化中心点坐标
|
|
|
|
|
|
|
|
zoom: 13, |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
AMap.plugin(['AMap.ToolBar', 'AMap.Autocomplete'], () => { |
|
|
|
|
|
|
|
const toolbar = new AMap.ToolBar(); |
|
|
|
|
|
|
|
map.addControl(toolbar); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
const autoOptions = { |
|
|
|
|
|
|
|
// input 为绑定输入提示功能的input的DOM ID
|
|
|
|
|
|
|
|
input: 'input' |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
const autoComplete = new AMap.Autocomplete(autoOptions); |
|
|
|
|
|
|
|
const placeSearch = new AMap.PlaceSearch({ |
|
|
|
|
|
|
|
map: map |
|
|
|
|
|
|
|
}); // 构造地点查询类
|
|
|
|
|
|
|
|
AMap.event.addListener(autoComplete, 'select', select); // 注册监听,当选中某条记录时会触发
|
|
|
|
|
|
|
|
function select(e) { |
|
|
|
|
|
|
|
placeSearch.setCity(e.poi.adcode); |
|
|
|
|
|
|
|
placeSearch.search(e.poi.name); // 关键字查询查询
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// 地图要放到函数里。
|
|
|
|
const positionPicker = new PositionPicker({ |
|
|
|
getMap() { |
|
|
|
mode: 'dragMap', |
|
|
|
// tslint:disable-next-line:variable-name
|
|
|
|
map: map |
|
|
|
AMapUI.loadUI(['misc/PositionPicker'], PositionPicker => { |
|
|
|
}); |
|
|
|
console.log(this.validateForm.value); |
|
|
|
positionPicker.on('success', positionResult => { |
|
|
|
const map = new AMap.Map('container', { |
|
|
|
console.log(positionResult); |
|
|
|
resizeEnable: true, |
|
|
|
positionResult['latitude'] = positionResult.position.lat; |
|
|
|
scrollWheel: false, |
|
|
|
positionResult['longitude'] = positionResult.position.lng; |
|
|
|
center: [this.validateForm.value.longitude, this.validateForm.value.latitude], // 初始化中心点坐标
|
|
|
|
positionResult['regionId'] = positionResult.regeocode.addressComponent.adcode; |
|
|
|
zoom: 13, |
|
|
|
this.validateForm.patchValue(positionResult); |
|
|
|
}); |
|
|
|
}); |
|
|
|
AMap.plugin(['AMap.ToolBar', 'AMap.Autocomplete'], () => { |
|
|
|
positionPicker.on('fail', positionResult => { |
|
|
|
const toolbar = new AMap.ToolBar(); |
|
|
|
console.log(positionResult); |
|
|
|
map.addControl(toolbar); |
|
|
|
}); |
|
|
|
}); |
|
|
|
positionPicker.setMode('dragMap'); |
|
|
|
const autoOptions = { |
|
|
|
positionPicker.start(); |
|
|
|
// input 为绑定输入提示功能的input的DOM ID
|
|
|
|
map.panBy(0, 1); |
|
|
|
input: 'input' |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
const autoComplete = new AMap.Autocomplete(autoOptions); |
|
|
|
|
|
|
|
const placeSearch = new AMap.PlaceSearch({ |
|
|
|
|
|
|
|
map: map |
|
|
|
|
|
|
|
}); // 构造地点查询类
|
|
|
|
|
|
|
|
AMap.event.addListener(autoComplete, 'select', select); // 注册监听,当选中某条记录时会触发
|
|
|
|
|
|
|
|
function select(e) { |
|
|
|
|
|
|
|
placeSearch.setCity(e.poi.adcode); |
|
|
|
|
|
|
|
placeSearch.search(e.poi.name); // 关键字查询查询
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
const positionPicker = new PositionPicker({ |
|
|
|
|
|
|
|
mode: 'dragMap', |
|
|
|
|
|
|
|
map: map |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
positionPicker.on('success', positionResult => { |
|
|
|
|
|
|
|
positionResult['latitude'] = positionResult.position.lat; |
|
|
|
|
|
|
|
positionResult['longitude'] = positionResult.position.lng; |
|
|
|
|
|
|
|
this.validateForm.patchValue(positionResult); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
positionPicker.on('fail', positionResult => { |
|
|
|
|
|
|
|
console.log(positionResult); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
positionPicker.setMode('dragMap'); |
|
|
|
|
|
|
|
positionPicker.start(); |
|
|
|
|
|
|
|
map.panBy(0, 1); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
map.addControl(new AMap.ToolBar({ |
|
|
|
map.addControl(new AMap.ToolBar({ |
|
|
|
liteStyle: true |
|
|
|
liteStyle: true |
|
|
|
})); |
|
|
|
})); |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|