From cab1e5586552146b326aeaa34668ee2837a24891 Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期三, 09 十月 2024 15:43:21 +0800 Subject: [PATCH] update 公告转发、地址定位选择、支付测试 --- pages/user/address/address.vue | 176 ++++++++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 152 insertions(+), 24 deletions(-) diff --git a/pages/user/address/address.vue b/pages/user/address/address.vue index c0fd7b2..4b4eec1 100644 --- a/pages/user/address/address.vue +++ b/pages/user/address/address.vue @@ -1,6 +1,26 @@ <template> <!-- 收货地址列表 --> <view class="p15 container-address"> + <!-- <view class="search-container m-t-12 flex"> + <view class="flex1 input"> + <u-input placeholder="小区名/店铺名/写字楼/街道名等" disabled v-model="search_flow"> + <template slot="suffix"> + <uni-icons color="#20613D" type="search" size="24"></uni-icons> + </template> + </u-input> + </view> + </view> + <view class="m-t-12 "> + <view class="desc-gray">当前位置</view> + <view class="flex"> + <view class="flex1"></view> + <view @click="selectWxAddress('input')"> + <image src="@/static/images/customer/address/icon-address.jpg"></image> + 重新定位 + </view> + </view> + </view> + --> <no-data v-if="!list||list.length==0" style="width: 100%;"></no-data> <!-- 循环 --> @@ -38,7 +58,7 @@ @click="changeDefaultAddress(item,index)"> </view> - <span class="desc">{{ item.isDefault ? '默认地址:' : '当前地址:' }}{{ item.address || '' }}</span> + <span class="desc" style="word-break: break-all;">{{ item.isDefault ? '默认地址:' : '当前地址:' }}</span> <!-- 当前地址/默认地址勾选 --> </view> <view class="desc del t-red" @click="deleteAddress(item)"> @@ -78,7 +98,8 @@ 手机号 </view> <view class="form-item-value"> - <input v-model="submitForm.tel" placeholder="请输入收货人手机号" class="form-input" @blur="validatePhoneNumber()" ></input> + <input v-model="submitForm.tel" placeholder="请输入收货人手机号" class="form-input" + @blur="validatePhoneNumber()"></input> </view> </view> <view class="form-item"> @@ -97,13 +118,21 @@ </view> - <view class="form-item"> + <view class="form-item" style="height: unset;min-height: 36rpx;"> <view class="form-item-label require"> 详细地址 </view> - <view class="form-item-value"> - <input v-model="submitForm.address" placeholder="请输入详细地址" class="form-input"></input> + <view class="form-item-value flex flex1"> + <!-- <input v-model="submitForm.address" placeholder="请输入详细地址" class="form-input flex1"></input> --> + <u-textarea v-model="submitForm.address" autoHeight placeholder="请输入详细地址" class="form-input flex1" > + + </u-textarea> + <view class="m-l-15 m-r-0 flex m-t-8" style="min-width: 120rpx;color: #7CC662;text-align: right;" + @click="selectWxAddress('form')"> + <uni-icons color="#7CC662" type="location" size="18"></uni-icons> + 定位 + </view> </view> </view> <view class="form-item"> @@ -126,9 +155,12 @@ </template> <script> + // #ifdef PUB_CUSTOMER // import qqmapwx from '@/plugins/qqmap-wx-jssdk.min.js'; - // const lockey = 'VUHBZ-2AMLP-B7AD7-VUQZ7-D4TW5-MFFVN'; //使用在腾讯位置服务申请的key - // const chooseLocation = requirePlugin('chooseLocation'); + // const lockey = 'GSBBZ-CJA3U-NNDVH-GE65N-6FIF6-ZGBCU'; //使用在腾讯位置服务申请的key + // const chooseLocation = requirePlugin('chooseLocation'); + // #endif + import { mapState } from 'vuex' @@ -144,6 +176,35 @@ this.listApi = '/api/address/list' await this.getList() + }, + 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() + // } }, computed: { ...mapState({ @@ -164,23 +225,90 @@ province: '', city: '', region: '', - + latitude: 0, + longitude: 0, }, regionDataPlus: [], list: [], }; }, methods: { - validatePhoneNumber() { - - // 手机号码正则表达式,可以根据需要调整 - const phoneRegex = /^[1][3-9][0-9]{9}$/; - if (!phoneRegex.test(this.submitForm['tel'])) { - this.$message.showToast('请填写正确手机号码') - } - + selectWxAddress(source) { + let that = this + + if (source === 'form') { + //表单选择了地址 + wx.chooseLocation({ + success: location => { + console.log('success loc', location) + // address: "江苏省苏州市吴中区太湖东路288号" + // errMsg: "chooseLocation:ok" + // latitude: 31.26249 + // longitude: 120.63212 + // name: "苏州市吴中区人民政府" + that.submitForm.address = (location.address || '') + (location.name || '') + that.submitForm.latitude = location.latitude || 0 + that.submitForm.longitude = location.longitude || 0 + // 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'] = '' @@ -403,20 +531,20 @@ this.$message.showToast('字段未填写完整') return } - if(!this.submitForm['province']||!this.submitForm['province']||!this.submitForm['province']){ + if (!this.submitForm['province'] || !this.submitForm['province'] || !this.submitForm['province']) { this.$message.showToast('省市区未选择完整') return } - + // 手机号码正则表达式,可以根据需要调整 - const phoneRegex = /^[1][3-9][0-9]{9}$/; + const phoneRegex = /^[1][3-9][0-9]{9}$/; if (!phoneRegex.test(this.submitForm['tel'])) { this.$message.showToast('请填写正确手机号码') return } - - - + + + this.$message.showLoading() const { code @@ -428,7 +556,7 @@ if (code === 0) { this.$refs.popup_form.close() this.$message.showToast(this.submitForm.id ? '修改成功' : '新增成功') - + let tmp = this setTimeout(() => { tmp.page.current = 1 -- Gitblit v1.9.3