From d39644872fa6f9499fc2c1651bced631a9e96b19 Mon Sep 17 00:00:00 2001 From: 陶杰 <1378534974@qq.com> Date: 星期一, 23 十二月 2024 09:48:53 +0800 Subject: [PATCH] 1.高德地图未开发完成版本(可能废弃) --- pages/user/address/address.vue | 1217 +++++++++++++++++++++++++++++---------------------------- 1 files changed, 610 insertions(+), 607 deletions(-) diff --git a/pages/user/address/address.vue b/pages/user/address/address.vue index cee367b..956fb97 100644 --- a/pages/user/address/address.vue +++ b/pages/user/address/address.vue @@ -2,7 +2,8 @@ <!-- 收货地址列表 --> <view class="p15 container-address"> <view class="search-container m-t-12 flex"> - <view class="flex1 input" @click="selectWxAddress('input')"> + <!-- <view class="flex1 input" @click="selectWxAddress('input')"> --> + <view class="flex1 input" @click="selectGaodeAddress('input')"> <u-input placeholder="小区名/店铺名/写字楼/街道名等" disabled v-model="search_flow"> <template slot="suffix"> <uni-icons color="#20613D" type="search" size="24"></uni-icons> @@ -14,7 +15,7 @@ <view class="desc-gray">当前位置</view> <view class="flex current-address"> <view class="flex1"> - {{ addressDesc || (address&&address.id?address.address: '选择地址') }} + {{ addressDesc || (address && address.id ? address.address : '选择地址') }} </view> <view class="flex" @click="changeCurrentAddress"> @@ -31,10 +32,10 @@ <view class="desc-gray">我的收货地址</view> </view> - <no-data v-if="!list||list.length==0" style="width: 100%;"></no-data> + <no-data v-if="!list || list.length == 0" style="width: 100%;"></no-data> <!-- 循环 --> - <view v-for="(item,index) of list" :key="index" class="location-each m-t-12"> + <view v-for="(item, index) of list" :key="index" class="location-each m-t-12"> <view class="flex"> <view class="container-info"> <view class="flex"> @@ -43,7 +44,7 @@ </view> <view class="address"> {{ item['province'] || '' }}{{ item['city'] && ('/' + item['city']) || '' }}{{ - item['region'] && ('/' + item['region']) || '' + item['region'] && ('/' + item['region']) || '' }} </view> <view class="address"> @@ -51,7 +52,7 @@ </view> </view> <!-- <view class="h-line"></view> --> - <view class="edit" @click="()=>{ + <view class="edit" @click="() => { this.submitForm = { ...item } @@ -64,8 +65,8 @@ <view class="flex"> <!-- --> <view class="flex"> - <view class="radio m-t-2 m-r-10" :class="[item.isDefault?'select':'']" - @click="changeDefaultAddress(item,index)"> + <view class="radio m-t-2 m-r-10" :class="[item.isDefault ? 'select' : '']" + @click="changeDefaultAddress(item, index)"> </view> <span class="desc" style="word-break: break-all;">{{ item.isDefault ? '默认地址:' : '当前地址:' }}</span> @@ -74,10 +75,10 @@ <view class="desc del t-red" @click="deleteAddress(item)"> 删除 </view> - <view class="desc del t-green m-l-10" v-if="source==='select'" @click="selectAddress(item)"> + <view class="desc del t-green m-l-10" v-if="source === 'select'" @click="selectAddress(item)"> 选择此地址 </view> - <view class="desc del t-green m-l-10" v-if="source==='home'" @click="selectAddress(item)"> + <view class="desc del t-green m-l-10" v-if="source === 'home'" @click="selectAddress(item)"> 按此地址定位 </view> </view> @@ -119,12 +120,14 @@ <view class="form-item-label require"> 收货地址 </view> - <view class="m-l-a m-r-0 flex " :class="[!dto['province']?'desc-gray':'']"> - <uni-data-picker :area="true" @change="(e)=>{PickArea(submitForm,e)}" placeholder="" + <view class="m-l-a m-r-0 flex " :class="[!dto['province'] ? 'desc-gray' : '']"> + <uni-data-picker :area="true" @change="(e) => { PickArea(submitForm, e) }" placeholder="" :localdata="regionDataPlus"> - {{ submitForm['province'] || '请选择' }}{{ submitForm['city'] && ('/' + submitForm['city']) || '' }}{{ - submitForm['region'] && ('/' + submitForm['region']) || '' - }} + {{ submitForm['province'] || '请选择' }}{{ submitForm['city'] && ('/' + submitForm['city']) + || '' + }}{{ + submitForm['region'] && ('/' + submitForm['region']) || '' + }} </uni-data-picker> <u-icon class="m-l-a" name="arrow-right"></u-icon> </view> @@ -154,7 +157,7 @@ </view> <view class="form-item-value"> <radio value="r1" :checked="submitForm.isDefault" - @click="submitForm.isDefault=!submitForm.isDefault" + @click="submitForm.isDefault = !submitForm.isDefault" style="transform:scale(0.6);margin-top: -8rpx;" /> </view> </view> @@ -168,80 +171,443 @@ </template> <script> - // #ifdef PUB_CUSTOMER - // import qqmapwx from '@/plugins/qqmap-wx-jssdk.min.js'; - // const lockey = 'GSBBZ-CJA3U-NNDVH-GE65N-6FIF6-ZGBCU'; //使用在腾讯位置服务申请的key - // const chooseLocation = requirePlugin('chooseLocation'); - // #endif +// #ifdef PUB_CUSTOMER +// import qqmapwx from '@/plugins/qqmap-wx-jssdk.min.js'; +// const lockey = 'GSBBZ-CJA3U-NNDVH-GE65N-6FIF6-ZGBCU'; //使用在腾讯位置服务申请的key +// const chooseLocation = requirePlugin('chooseLocation'); +// #endif - import { - mapState - } from 'vuex' - export default { - async onPullDownRefresh() { - this.page.current = 0 +import amapFile from '@/map/amap-wx.130.js'; + +import { + mapState +} from 'vuex' +export default { + async onPullDownRefresh() { + this.page.current = 0 + await this.getList() + uni.stopPullDownRefresh() + }, + async onLoad(options) { + // debugger; + // 引入高德地图的组件 + const myAmapFun = new amapFile.AMapWX({ key: '75d7da3feb329cd5ae997975b953abb6' }); + myAmapFun.getRegeo({ + success: (data) => { + console.log('当前位置:', data[0]); + console.log(data) + // this.setData({ + // longitude: data[0].longitude, + // latitude: data[0].latitude, + // locationName: data[0].name, + // }); + }, + fail(err) { + console.error(err); + }, + }); + + // this.list = [{}, {}] + this.source = options.source || '' + this.listApi = '/api/address/list' + if (!this.currentInfo.id) { + + } else { await this.getList() - uni.stopPullDownRefresh() + + } + + }, + onShow() { + + }, + computed: { + ...mapState({ + address: state => { + return state.defaultaddress || {} + }, + addressDesc: state => { + return state.addressDesc || '' + }, + // search_flow() { + // return this.addressDesc || '' + // } + }), + + }, + data() { + return { + source: '', + submitForm: { + name: '', + tel: '', + address: '', + isDefault: false, + province: '', + city: '', + region: '', + latitude: 0, + longitude: 0, + }, + regionDataPlus: [], + list: [], + search_flow: '', + }; + }, + methods: { + selectGaodeAddress(){ + uni.navigateTo({ + url: '/pages/user/address/gaode-address' + }) }, - async onLoad(options) { - // this.list = [{}, {}] - this.source = options.source || '' - this.listApi = '/api/address/list' - if (!this.currentInfo.id) { + selectWxAddress(source) { + let that = this - } else { - await this.getList() + { + //表单选择了地址 + wx.chooseLocation({ + success: location => { + console.log('success loc', location, source) + console.log(location) + // address: "江苏省苏州市吴中区太湖东路288号" + // errMsg: "chooseLocation:ok" + // latitude: 31.26249 + // longitude: 120.63212 + // name: "苏州市吴中区人民政府" + if (source === 'form') { + // (location.address || '') + + that.submitForm.address = (location.name || location.address || '') + that.submitForm.latitude = location.latitude || 0 + that.submitForm.longitude = location.longitude || 0 + } else if (source === 'input') { + // (location.address || '') + + // that.search_flow = (location.name || '') + that.$store.commit('setAddressDesc', (location.name || location.address || '')) + that.$forceUpdate() + that.backpage() + } + // if (!that.submitForm.province && location.provinceName) { + // that.submitForm.province = location.provinceName + // if (!that.submitForm.city && location.cityName) { + // that.submitForm.city = location.cityName + // } + // if (!that.submitForm.region && location.countyName) { + // that.submitForm.region = location.countyName + // } + // if (!that.submitForm.region && location.cityName) { + // that.submitForm.region = location.cityName + // } + // } + // success loc + // {errMsg: "chooseAddress:ok", userName: "张三", nationalCode: "510000", telNumber: "020-81167888", postalCode: "510000", …} + // cityName: "广州市" + // countyName: "海珠区" + // detailInfo: "新港中路397号" + // errMsg: "chooseAddress:ok" + // nationalCode: "510000" + // postalCode: "510000" + // provinceName: "广东省" + // telNumber: "020-81167888" + // userName: "张三" + }, + fail: e => { + console.log('fail loc', e) + // that.$message.showToast('定位失败') + } + }) + // uni.getLocation({ + // type: 'wgs84', + // success(res) { + // //得到经纬度 + // console.log(res); + // const referer = '花满芫'; //调用插件的app的名称 + // const location = JSON.stringify({ + // latitude: res.latitude, + // longitude: res.longitude + // }); + // const category = '生活服务,娱乐休闲'; + // // &category=${category} + + // wx.navigateTo({ + // url: `plugin://chooseLocation/index?key=${lockey}&referer=${referer}&location=${location}` + // }); + + // } + // }) + } + }, + validatePhoneNumber() { + + // 手机号码正则表达式,可以根据需要调整 + const phoneRegex = /^[1][3-9][0-9]{9}$/; + if (!phoneRegex.test(this.submitForm['tel'])) { + this.$message.showToast('请填写正确手机号码') } }, - onShow() { - // const location = chooseLocation.getLocation(); // 如果点击确认选点按钮,则返回选点结果对象,否则返回null - // // console.log('onshow location', location, this.tmp_picker_lock_index, this.formcodes["LOC_ONE"]) - // // address: "江苏省苏州市吴中区太湖东路280号" - // // city: "苏州市" - // // district: "吴中区" - // // latitude: 31.262438 - // // longitude: 120.633985 - // // name: "太湖东路280号小区" - // // province: "江苏省" - // if (location && location.address) { - // this.submitForm.address = location.address - // this.submitForm.latitude = location.latitude - // this.submitForm.longitude = location.longitude - // if (!this.submitForm.province && location.province) { - // this.submitForm.province = location.province - // if (!this.submitForm.city && location.city) { - // this.submitForm.city = location.city - // } - // if (!this.submitForm.region && location.district) { - // this.submitForm.region = location.district - // } - // if (!this.submitForm.region && location.city) { - // this.submitForm.region = location.city - // } - // } - // this.$forceUpdate() - // } + + addAddress() { + delete this.submitForm.id + this.submitForm['name'] = '' + this.submitForm['tel'] = '' + this.submitForm['address'] = '' + this.submitForm['province'] = '' + this.submitForm['city'] = '' + this.submitForm['region'] = '' + this.submitForm['isDefault'] = false + this.openAddressForm() }, - computed: { - ...mapState({ - address: state => { - return state.defaultaddress || {} + changeCurrentAddress() { + // if(!this.addressDesc){ + + // } + let that = this + this.$message.showLoading() + uni.getLocation({ + type: 'gcj02', + geocode: true, + success: async (res) => { + // this.location = { + // latitude: res.latitude, + // longitude: res.longitude, + // speed: res.speed, + // accuracy: res.accuracy, + // address: res.address, + // }; + const { + code, data + } = await that.$http.request('get', '/api/pub/customer/home/address/parse', { + data: {}, + params: { + // https://apis.map.qq.com/ws/geocoder/v1/?location=39.984154,116.307490&key=[你的key]&get_poi=1 + location: `${res.latitude},${res.longitude}` + } + }) + console.log('定位成功:', data); + if (data) { + var address = data.result && data.result.address || '' + + that.$store.commit('setAddressDesc', (address || '')) + that.$forceUpdate() + + that.backpage() + + } + + }, - addressDesc: state => { - return state.addressDesc || '' + fail: (err) => { + that.error = err; + console.error('定位失败:', err); }, - // search_flow() { - // return this.addressDesc || '' - // } - }), + complete() { + that.$message.hideLoading() + } + }); + }, + PickArea(item, e) { + console.log('PickArea', item, e) + if (e.detail.value) { + this.submitForm.province = '' + this.submitForm.city = '' + this.submitForm.region = '' + if (e.detail.value.length == 2) { + if (!!e.detail.value[0]) + this.submitForm.province = e.detail.value[0].value + if (!!e.detail.value[0]) + this.submitForm.city = e.detail.value[0].value + if (!!e.detail.value[1]) + this.submitForm.region = e.detail.value[1].value + } else if (e.detail.value.length <= 3) { + if (!!e.detail.value[0]) + this.submitForm.province = e.detail.value[0].value + if (!!e.detail.value[1]) + this.submitForm.city = e.detail.value[1].value + if (!!e.detail.value[2]) + this.submitForm.region = e.detail.value[2].value + } else { + //说明有重复的 + var plusnum = e.detail.value.length - 3 + if (!!e.detail.value[plusnum + 0]) + this.submitForm.province = e.detail.value[plusnum + 0].value + if (!!e.detail.value[plusnum + 1]) + this.submitForm.city = e.detail.value[plusnum + 1].value + if (!!e.detail.value[plusnum + 2]) + this.submitForm.region = e.detail.value[plusnum + 2].value + } + + this.$forceUpdate() + console.log('submit forn', this.submitForm) + } + }, + async init_area() { + // debugger; + // if (this.regionDataPlus && this.regionDataPlus.length > 0) { + + // } else { + // var a = this.$storage.getItem('cache_area') + var a = false + if (a) { + this.regionDataPlus = JSON.parse(a) || [] + } else { + await this.$http.request('get', '/api/pub/china/area/json/refresh') + const res = await this.$http.request('get', '/api/pub/china/area/json') + // console.log('area', JSON.parse(res.data)) + this.regionDataPlus = res.data && JSON.parse(res.data.replaceAll('code', 'value').replaceAll( + 'name', + 'text')) || [] + this.$storage.setItem('cache_area', JSON.stringify(this.regionDataPlus)) + } + // } }, - data() { - return { - source: '', - submitForm: { + chooseLocation() { + //前往接口挑选位置 + const qqmapsdk = new qqmapwx({ + // 使用你在腾讯地图应用生成的key + key: lockey + }); + + uni.getLocation({ + type: 'wgs84', + success(res) { + //得到经纬度 + console.log(res); + qqmapsdk.reverseGeocoder({ + location: { + latitude: res.latitude, + longitude: res.longitude + }, + //成功后的回调 + success: (r) => { + // console.log('地址信息', r.result.address_component); + // result: {location: {lat: 31.26249, lng: 120.63212}, address: "江苏省苏州市吴中区太湖东路288号",…} + // ad_info: {nation_code: "156", adcode: "320506", phone_area_code: "0512", city_code: "156320500",…} + // address: "江苏省苏州市吴中区太湖东路288号" + // address_component: {nation: "中国", province: "江苏省", city: "苏州市", district: "吴中区", street: "太湖东路",…} + // address_reference: {,…} + // formatted_addresses: {recommend: "长桥苏州市吴中区人民政府(太湖东路北)", rough: "长桥苏州市吴中区人民政府(太湖东路北)"} + // location: {lat: 31.26249, lng: 120.63212} + // status: 0 + tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].longitude = r + .result.location.lng + tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].latitude = r + .result.location.lat + tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].loc_desc = r + .result.address + tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index]._show = false + tmp.$forceUpdate() + tmp.tmp_picker_lock_index = -1 + + }, + fail: function (res) { + console.log(res); + tmp.tmp_picker_lock_index = -1 + }, + }); + } + }); + }, + async changeDefaultAddress(item, index) { + if (item.isDefault) { + return + } + this.$nextTick(() => { + + this.$message.confirm('确定设置此地址为默认地址吗').then(async res => { + this.$message.showLoading() + var { + code + } = await this.$http.request('post', '/api/address/set/default/' + item + .id, { + data: { + id: item.id + }, + params: { + id: item.id + } + }) + this.$message.hideLoading() + if (code === 0) { + for (var dto of this.list) { + dto.isDefault = false + } + this.$message.showToast('设置成功') + item.isDefault = true + this.$store.commit('setDefaultAddress', { + ...item + }) + + + } + }, err => { + this.$nextTick(() => { + this.list[index].isDefault = false + this.$forceUpdate() + console.log('err', err, this.list[index]) + }) + + + }) + }) + }, + async selectAddress(item) { + //携带,然后返回 + + if (this.source === 'home') { + this.$store.commit('setAddressDesc', '') + this.$store.commit('setDefaultAddress', { + ...item + }) + } else { + await this.$message.confirm('确定选择此地址作为收货地址吗') + this.$store.commit('setDefaultAddress', { + ...item + }) + + } + this.backpage() + }, + async deleteAddress(item) { + await this.$message.confirm('确定删除此地址吗') + this.$message.showLoading() + var { + code + } = await this.$http.request('get', '/api/address/delete?id=' + item.id, {}) + this.$message.hideLoading() + if (code === 0) { + this.$message.showToast('删除成功') + if (this.address.id === item.id) { + //要清空地址了 + this.$store.commit('setDefaultAddress', {}) + } + setTimeout(() => { + this.page.current = 1 + this.getList() + }, 500) + } + }, + async openAddressForm() { + this.init_area() + if (this.submitForm.id) { + this.$message.showLoading() + var { + data + } = await this.$http.request('get', '/api/address/list/detail?id=' + this.submitForm.id, {}) + + + if (data) { + this.submitForm = { + ...this.submitForm, + ...data + } + } + this.$message.hideLoading() + } else { + this.submitForm = { + // name: this.currentInfo && this.currentInfo.nickName || '', + // tel: this.currentInfo && this.currentInfo.tel || '', name: '', tel: '', address: '', @@ -249,554 +615,191 @@ province: '', city: '', region: '', - latitude: 0, - longitude: 0, - }, - regionDataPlus: [], - list: [], - search_flow: '', - }; + } + } + + this.$refs.popup_form.open() + }, - methods: { - selectWxAddress(source) { - let that = this + closeAddressForm() { + this.$refs.popup_form.close() - { - //表单选择了地址 - wx.chooseLocation({ - success: location => { - console.log('success loc', location,source) - // address: "江苏省苏州市吴中区太湖东路288号" - // errMsg: "chooseLocation:ok" - // latitude: 31.26249 - // longitude: 120.63212 - // name: "苏州市吴中区人民政府" - if (source === 'form') { - // (location.address || '') + - that.submitForm.address = (location.name || location.address || '') - that.submitForm.latitude = location.latitude || 0 - that.submitForm.longitude = location.longitude || 0 - } else if (source === 'input') { - // (location.address || '') + - // that.search_flow = (location.name || '') - that.$store.commit('setAddressDesc', (location.name || location.address || '')) - that.$forceUpdate() - that.backpage() - } + }, + async saveOrUpdateAddress() { + if (!this.checkFormValues(this.submitForm, ['tel', 'name', 'address'])) { + this.$message.showToast('字段未填写完整') + return + } + if (!this.submitForm['province'] || !this.submitForm['province'] || !this.submitForm['province']) { + this.$message.showToast('省市区未选择完整') + return + } - // if (!that.submitForm.province && location.provinceName) { - // that.submitForm.province = location.provinceName - // if (!that.submitForm.city && location.cityName) { - // that.submitForm.city = location.cityName - // } - // if (!that.submitForm.region && location.countyName) { - // that.submitForm.region = location.countyName - // } - // if (!that.submitForm.region && location.cityName) { - // that.submitForm.region = location.cityName - // } - // } - // success loc - // {errMsg: "chooseAddress:ok", userName: "张三", nationalCode: "510000", telNumber: "020-81167888", postalCode: "510000", …} - // cityName: "广州市" - // countyName: "海珠区" - // detailInfo: "新港中路397号" - // errMsg: "chooseAddress:ok" - // nationalCode: "510000" - // postalCode: "510000" - // provinceName: "广东省" - // telNumber: "020-81167888" - // userName: "张三" - }, - fail: e => { - console.log('fail loc', e) - // that.$message.showToast('定位失败') - } - }) - // uni.getLocation({ - // type: 'wgs84', - // success(res) { - // //得到经纬度 - // console.log(res); - // const referer = '花满芫'; //调用插件的app的名称 - // const location = JSON.stringify({ - // latitude: res.latitude, - // longitude: res.longitude - // }); - // const category = '生活服务,娱乐休闲'; - // // &category=${category} - - // wx.navigateTo({ - // url: `plugin://chooseLocation/index?key=${lockey}&referer=${referer}&location=${location}` - // }); - - // } - // }) - } - }, - validatePhoneNumber() { - - // 手机号码正则表达式,可以根据需要调整 - const phoneRegex = /^[1][3-9][0-9]{9}$/; - if (!phoneRegex.test(this.submitForm['tel'])) { - this.$message.showToast('请填写正确手机号码') - } - - }, - - addAddress() { - delete this.submitForm.id - this.submitForm['name'] = '' - this.submitForm['tel'] = '' - this.submitForm['address'] = '' - this.submitForm['province'] = '' - this.submitForm['city'] = '' - this.submitForm['region'] = '' - this.submitForm['isDefault'] = false - this.openAddressForm() - }, - changeCurrentAddress() { - // if(!this.addressDesc){ - - // } - let that = this - this.$message.showLoading() - uni.getLocation({ - type: 'gcj02', - geocode: true, - success: async (res) => { - // this.location = { - // latitude: res.latitude, - // longitude: res.longitude, - // speed: res.speed, - // accuracy: res.accuracy, - // address: res.address, - // }; - const { - code,data - } = await that.$http.request('get', '/api/pub/customer/home/address/parse', { - data: {}, - params: { - // https://apis.map.qq.com/ws/geocoder/v1/?location=39.984154,116.307490&key=[你的key]&get_poi=1 - location:`${res.latitude},${res.longitude}` - } - }) - console.log('定位成功:', data); - if(data){ - var address = data.result&&data.result.address || '' - - that.$store.commit('setAddressDesc', (address || '')) - that.$forceUpdate() - - that.backpage() - - } - - - }, - fail: (err) => { - that.error = err; - console.error('定位失败:', err); - }, - complete() { - that.$message.hideLoading() - } - }); - }, - PickArea(item, e) { - console.log('PickArea', item, e) - if (e.detail.value) { - this.submitForm.province = '' - this.submitForm.city = '' - this.submitForm.region = '' - if (e.detail.value.length == 2) { - if (!!e.detail.value[0]) - this.submitForm.province = e.detail.value[0].value - if (!!e.detail.value[0]) - this.submitForm.city = e.detail.value[0].value - if (!!e.detail.value[1]) - this.submitForm.region = e.detail.value[1].value - } else if (e.detail.value.length <= 3) { - if (!!e.detail.value[0]) - this.submitForm.province = e.detail.value[0].value - if (!!e.detail.value[1]) - this.submitForm.city = e.detail.value[1].value - if (!!e.detail.value[2]) - this.submitForm.region = e.detail.value[2].value - } else { - //说明有重复的 - var plusnum = e.detail.value.length - 3 - if (!!e.detail.value[plusnum + 0]) - this.submitForm.province = e.detail.value[plusnum + 0].value - if (!!e.detail.value[plusnum + 1]) - this.submitForm.city = e.detail.value[plusnum + 1].value - if (!!e.detail.value[plusnum + 2]) - this.submitForm.region = e.detail.value[plusnum + 2].value - } - - this.$forceUpdate() - console.log('submit forn', this.submitForm) - } - }, - async init_area() { - // debugger; - // if (this.regionDataPlus && this.regionDataPlus.length > 0) { - - // } else { - // var a = this.$storage.getItem('cache_area') - var a =false - if (a) { - this.regionDataPlus = JSON.parse(a) || [] - } else { - await this.$http.request('get', '/api/pub/china/area/json/refresh') - const res = await this.$http.request('get', '/api/pub/china/area/json') - // console.log('area', JSON.parse(res.data)) - this.regionDataPlus = res.data && JSON.parse(res.data.replaceAll('code', 'value').replaceAll( - 'name', - 'text')) || [] - this.$storage.setItem('cache_area', JSON.stringify(this.regionDataPlus)) - } - // } - - }, - chooseLocation() { - //前往接口挑选位置 - const qqmapsdk = new qqmapwx({ - // 使用你在腾讯地图应用生成的key - key: lockey - }); - - uni.getLocation({ - type: 'wgs84', - success(res) { - //得到经纬度 - console.log(res); - qqmapsdk.reverseGeocoder({ - location: { - latitude: res.latitude, - longitude: res.longitude - }, - //成功后的回调 - success: (r) => { - // console.log('地址信息', r.result.address_component); - // result: {location: {lat: 31.26249, lng: 120.63212}, address: "江苏省苏州市吴中区太湖东路288号",…} - // ad_info: {nation_code: "156", adcode: "320506", phone_area_code: "0512", city_code: "156320500",…} - // address: "江苏省苏州市吴中区太湖东路288号" - // address_component: {nation: "中国", province: "江苏省", city: "苏州市", district: "吴中区", street: "太湖东路",…} - // address_reference: {,…} - // formatted_addresses: {recommend: "长桥苏州市吴中区人民政府(太湖东路北)", rough: "长桥苏州市吴中区人民政府(太湖东路北)"} - // location: {lat: 31.26249, lng: 120.63212} - // status: 0 - tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].longitude = r - .result.location.lng - tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].latitude = r - .result.location.lat - tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].loc_desc = r - .result.address - tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index]._show = false - tmp.$forceUpdate() - tmp.tmp_picker_lock_index = -1 - - }, - fail: function(res) { - console.log(res); - tmp.tmp_picker_lock_index = -1 - }, - }); - } - }); - }, - async changeDefaultAddress(item, index) { - if (item.isDefault) { - return - } - this.$nextTick(() => { - - this.$message.confirm('确定设置此地址为默认地址吗').then(async res => { - this.$message.showLoading() - var { - code - } = await this.$http.request('post', '/api/address/set/default/' + item - .id, { - data: { - id: item.id - }, - params: { - id: item.id - } - }) - this.$message.hideLoading() - if (code === 0) { - for (var dto of this.list) { - dto.isDefault = false - } - this.$message.showToast('设置成功') - item.isDefault = true - this.$store.commit('setDefaultAddress', { - ...item - }) - - - } - }, err => { - this.$nextTick(() => { - this.list[index].isDefault = false - this.$forceUpdate() - console.log('err', err, this.list[index]) - }) + // 手机号码正则表达式,可以根据需要调整 + const phoneRegex = /^[1][3-9][0-9]{9}$/; + if (!phoneRegex.test(this.submitForm['tel'])) { + this.$message.showToast('请填写正确手机号码') + return + } - }) - }) - }, - async selectAddress(item) { - //携带,然后返回 - - if(this.source==='home'){ - this.$store.commit('setAddressDesc', '') - this.$store.commit('setDefaultAddress', { - ...item - }) - }else{ - await this.$message.confirm('确定选择此地址作为收货地址吗') - this.$store.commit('setDefaultAddress', { - ...item - }) - - } - this.backpage() - }, - async deleteAddress(item) { - await this.$message.confirm('确定删除此地址吗') - this.$message.showLoading() - var { - code - } = await this.$http.request('get', '/api/address/delete?id=' + item.id, {}) - this.$message.hideLoading() - if (code === 0) { - this.$message.showToast('删除成功') - if (this.address.id === item.id) { - //要清空地址了 - this.$store.commit('setDefaultAddress', {}) - } - setTimeout(() => { - this.page.current = 1 - this.getList() - }, 500) - } - }, - async openAddressForm() { - this.init_area() - if (this.submitForm.id) { - this.$message.showLoading() - var { - data - } = await this.$http.request('get', '/api/address/list/detail?id=' + this.submitForm.id, {}) - - if (data) { - this.submitForm = { - ...this.submitForm, - ...data - } - } - this.$message.hideLoading() - } else { - this.submitForm = { - // name: this.currentInfo && this.currentInfo.nickName || '', - // tel: this.currentInfo && this.currentInfo.tel || '', - name: '', - tel: '', - address: '', - isDefault: false, - province: '', - city: '', - region: '', - } - } - - this.$refs.popup_form.open() - - }, - closeAddressForm() { + this.$message.showLoading() + const { + code + } = await this.$http.request('post', '/api/address/' + (this.submitForm.id ? 'update' : + 'add'), { + data: this.submitForm + }) + this.$message.hideLoading() + if (code === 0) { this.$refs.popup_form.close() + this.$message.showToast(this.submitForm.id ? '修改成功' : '新增成功') - }, - async saveOrUpdateAddress() { - if (!this.checkFormValues(this.submitForm, ['tel', 'name', 'address'])) { - this.$message.showToast('字段未填写完整') - return + let tmp = this + setTimeout(() => { + tmp.page.current = 1 + tmp.refreshList() + }, 300) + //如果当前选择的地址是这个,需要更新一下数据 + if (this.address.id && this.submitForm.id === this.address.id) { + this.$store.commit('setDefaultAddress', { + ...this.submitForm + }) } - if (!this.submitForm['province'] || !this.submitForm['province'] || !this.submitForm['province']) { - this.$message.showToast('省市区未选择完整') - return - } + } + }, - // 手机号码正则表达式,可以根据需要调整 - const phoneRegex = /^[1][3-9][0-9]{9}$/; - if (!phoneRegex.test(this.submitForm['tel'])) { - this.$message.showToast('请填写正确手机号码') - return - } - - - - this.$message.showLoading() - const { - code - } = await this.$http.request('post', '/api/address/' + (this.submitForm.id ? 'update' : - 'add'), { - data: this.submitForm - }) - this.$message.hideLoading() - if (code === 0) { - this.$refs.popup_form.close() - this.$message.showToast(this.submitForm.id ? '修改成功' : '新增成功') - - let tmp = this - setTimeout(() => { - tmp.page.current = 1 - tmp.refreshList() - }, 300) - //如果当前选择的地址是这个,需要更新一下数据 - if (this.address.id && this.submitForm.id === this.address.id) { - this.$store.commit('setDefaultAddress', { - ...this.submitForm - }) - } - } - }, - - } } +} </script> <style lang="scss" scoped> - .container-address { - .current-address { - padding: 20rpx; - background-color: #FFFFFF; - border-radius: 16rpx; - margin-top: 16rpx; - margin-bottom: 20rpx; - } +.container-address { + .current-address { + padding: 20rpx; + background-color: #FFFFFF; + border-radius: 16rpx; + margin-top: 16rpx; + margin-bottom: 20rpx; + } - .popup-address-form { - background: #FFFFFF; - border-radius: 16rpx; - // width: 690rpx; - height: 882rpx; - margin-top: 120rpx; - margin-left: 30rpx; - margin-right: 30rpx; - padding: 24rpx 36rpx; + .popup-address-form { + background: #FFFFFF; + border-radius: 16rpx; + // width: 690rpx; + height: 882rpx; + margin-top: 120rpx; + margin-left: 30rpx; + margin-right: 30rpx; + padding: 24rpx 36rpx; - .submit { - margin-top: 30rpx; + .submit { + margin-top: 30rpx; - .form-input { - height: 36rpx; - line-height: 36rpx; - } - } - } - - .location-each { - background: #FFFFFF; - border-radius: 16rpx; - margin-bottom: 24rpx; - padding: 36rpx; - - .name { - font-size: 32rpx; - color: #000000; - line-height: 44rpx; - text-align: left; - font-style: normal; - } - - .tel { - font-size: 28rpx; - color: #666666; - line-height: 40rpx; - text-align: left; - font-style: normal; - padding-top: 4rpx; - margin-left: 20rpx; - } - - .address { - font-size: 24rpx; - color: #000000; - line-height: 34rpx; - text-align: left; - font-style: normal; - } - - .desc { - font-size: 24rpx; - color: #666666; - line-height: 34rpx; - text-align: left; - font-style: normal; - } - - .del { - // vertical-align: baseline; - margin-left: auto; - margin-right: 6rpx; - margin-top: 4rpx; - } - - .container-info { - max-width: 540rpx; - } - - .h-line { - width: 2rpx; - height: 46rpx; - background-color: #EEEEEE; - margin-left: 28rpx; - margin-right: 24rpx; - } - - .v-line { - width: 638rpx; - height: 2rpx; - // border: 2rpx solid #EEEEEE; - background-color: #EEEEEE; - margin-top: 24rpx; - margin-bottom: 24rpx; - } - - .edit { - // min-width: 80rpx; - width: fit-content; - margin-left: auto; - margin-right: 0rpx; - display: flex; - position: relative; - - .icon { - // margin: 0 auto; - // mar - margin-left: auto; - margin-right: auto; - margin-top: 20rpx; - display: block; - - } - } - - .edit::before { - content: " "; - width: 2rpx; - height: 46rpx; - background-color: #EEEEEE; - position: absolute; - left: -24rpx; - top: 20rpx; + .form-input { + height: 36rpx; + line-height: 36rpx; } } } + + .location-each { + background: #FFFFFF; + border-radius: 16rpx; + margin-bottom: 24rpx; + padding: 36rpx; + + .name { + font-size: 32rpx; + color: #000000; + line-height: 44rpx; + text-align: left; + font-style: normal; + } + + .tel { + font-size: 28rpx; + color: #666666; + line-height: 40rpx; + text-align: left; + font-style: normal; + padding-top: 4rpx; + margin-left: 20rpx; + } + + .address { + font-size: 24rpx; + color: #000000; + line-height: 34rpx; + text-align: left; + font-style: normal; + } + + .desc { + font-size: 24rpx; + color: #666666; + line-height: 34rpx; + text-align: left; + font-style: normal; + } + + .del { + // vertical-align: baseline; + margin-left: auto; + margin-right: 6rpx; + margin-top: 4rpx; + } + + .container-info { + max-width: 540rpx; + } + + .h-line { + width: 2rpx; + height: 46rpx; + background-color: #EEEEEE; + margin-left: 28rpx; + margin-right: 24rpx; + } + + .v-line { + width: 638rpx; + height: 2rpx; + // border: 2rpx solid #EEEEEE; + background-color: #EEEEEE; + margin-top: 24rpx; + margin-bottom: 24rpx; + } + + .edit { + // min-width: 80rpx; + width: fit-content; + margin-left: auto; + margin-right: 0rpx; + display: flex; + position: relative; + + .icon { + // margin: 0 auto; + // mar + margin-left: auto; + margin-right: auto; + margin-top: 20rpx; + display: block; + + } + } + + .edit::before { + content: " "; + width: 2rpx; + height: 46rpx; + background-color: #EEEEEE; + position: absolute; + left: -24rpx; + top: 20rpx; + } + } +} </style> \ No newline at end of file -- Gitblit v1.9.3