初始化万家商超用户端仓库
This commit is contained in:
wangxiaowei
882
pages/my/addAddress/addAddress.vue
Normal file
882
pages/my/addAddress/addAddress.vue
Normal file
@ -0,0 +1,882 @@
|
||||
<template>
|
||||
<view class="page add-address">
|
||||
<fu-custom class="bg-white" style="position: relative; z-index: 100;" :isBack="true" :isBottom="true">
|
||||
<block slot="content" style="font-weight: bold;">{{edit_id?'编辑地址':'添加地址'}}</block>
|
||||
<!-- #ifndef MP-WEIXIN -->
|
||||
<block slot="right"><text v-if="edit_id" @click="delAddr" class="text-lg text-333">删除</text></block>
|
||||
<!-- #endif -->
|
||||
|
||||
</fu-custom>
|
||||
<!-- 表单信息 start -->
|
||||
<view class="addAddr">
|
||||
<view class="cell" v-if="serveList.length > 0">
|
||||
<text class="title">标签</text>
|
||||
<view class="flex align-center">
|
||||
<view v-for='(item,index) in serveList' :key='index' class='cu-tag radius' :class='item.name == default_serve.name? index < 3? "bg-orange2":"bg-green radius-left" :"line-black"'
|
||||
@click='changeServe(item)' v-show="item.name">
|
||||
{{item.name}}
|
||||
</view>
|
||||
<view v-if="serveList.length== 4" class='cu-tag radius bg-green left-0 radius-right' @click='addServe(serveList[3].name)'>
|
||||
编辑
|
||||
</view>
|
||||
<view class='cu-tag line-black radius' @click='addServe()' v-if="serveList.length<= 3">+</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cell">
|
||||
<text class="title">收货人</text>
|
||||
<input type="text" maxlength="8" v-model="name" placeholder="收货人" />
|
||||
<view class="flex">
|
||||
<view class="text-999 flex align-center" @click="chooseSex('1')">
|
||||
<text :class="[sex == 1 ? 'cuIcon-roundcheckfill active' : 'cuIcon-round']" class="text-xl"></text>
|
||||
<text :class="{'text-666': sex == 1}" class="margin-left-xs">先生</text>
|
||||
</view>
|
||||
<view class="text-999 margin-left flex align-center" @click="chooseSex('2')">
|
||||
<text :class="[sex == 2 ? 'cuIcon-roundcheckfill active' : 'cuIcon-round']" class="text-xl"></text>
|
||||
<text :class="{'text-666': sex == 2}" class="margin-left-xs">女士</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cell">
|
||||
<text class="title"> 联系电话</text>
|
||||
<input type="number" maxlength="11" v-model="phone" placeholder="联系电话" />
|
||||
<!-- <text v-if="phone.length > 0" class=" cuIcon-close" @click="clear"
|
||||
style="font-size: 36rpx;color:#999;"></text> -->
|
||||
</view>
|
||||
<view class="cell" v-if="isPublish">
|
||||
<text class="title"> 所在地区</text>
|
||||
<view class="flex flex-sub">
|
||||
<input class="flex-sub" type="text" disabled v-model="address" placeholder="请选择省市区县、乡镇" />
|
||||
<text class="cuIcon-locationfill" style="font-size: 40rpx; color: rgba(255, 147, 0, 1);" @click="chooseLocation"></text>
|
||||
<!-- <text class=" cuIcon-right text-gray" style="font-size: 36rpx; "
|
||||
@click="showMulLinkageThreePicker"></text> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="cell" v-if="!isPublish">
|
||||
<text class="title"> 所在地区</text>
|
||||
<view class="flex flex-sub">
|
||||
<input class="flex-sub" type="text" disabled v-model="address" placeholder="请选择省市区县、乡镇" />
|
||||
<text class="cuIcon-locationfill" style="font-size: 40rpx; color: rgba(255, 147, 0, 1);" @click="_chooseLocation"></text>
|
||||
<!-- <text class=" cuIcon-right text-gray" style="font-size: 36rpx; "
|
||||
@click="showMulLinkageThreePicker"></text> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="cell">
|
||||
<textarea class="text-area" type="text" v-model="addressDesc" maxlength="50" placeholder-class="placeholder"
|
||||
placeholder="请输入详细地址：如道路、门牌号、小区、楼栋号等" />
|
||||
</view>
|
||||
|
||||
<!-- <view class="cell justify-between" style="border: none; padding-bottom: 12rpx;">
|
||||
<text class="title"> {{i18n["智能填写"]}}</text>
|
||||
<view class="flex">
|
||||
<text class="cuIcon-right text-333" style="font-size: 32rpx;"> </text>
|
||||
</view>
|
||||
</view>
|
||||
<textarea class="text-ai" type="text" v-model="baiduAddress" maxlength="200" placeholder-class="placeholder"
|
||||
:placeholder="i18n['请输入详细地址：如道路、门牌号、小区、楼栋号等']" />
|
||||
<view class="flex justify-between">
|
||||
<text></text>
|
||||
<view class="btn" @tap="handleAddressRecognition">{{i18n["填写"]}}</view>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="flex justify-between bg-white" style="padding: 32rpx 32rpx; border-top: 1px solid #f5f6f7;">
|
||||
<view class="flex align-center">设置默认地址</view>
|
||||
<switch class="switch" :class="is_default ? 'checked-green' : ''" @change="handleSwitch"
|
||||
:checked="is_default ? true : false"></switch>
|
||||
<!-- <switch class='theme' @change="handleSwitch" :class="is_default?'checked':''" :checked="is_default?true:false"></switch> -->
|
||||
</view>
|
||||
<!-- 表单信息 end -->
|
||||
<!-- 服务标签弹框 start -->
|
||||
<fu-popup v-model="serve_show" mode="bottom" :safe-area-inset-bottom="true">
|
||||
<view class="serve-pop flex align-center justify-center" :style="{bottom:keyboardheight+'px'}">
|
||||
<input type="text" placeholder="请填写标签名称（最多5个字）" v-model='serveKeyword' maxlength="5" focus
|
||||
:adjust-position='false' placeholder-class="placeholderServe">
|
||||
<button @click='addServeInfo()'>添加</button>
|
||||
</view>
|
||||
</fu-popup>
|
||||
<!-- 服务标签弹框 end -->
|
||||
<!-- 底部占位 start -->
|
||||
<!-- <view class="bottom-status"></view> -->
|
||||
<!-- 底部占位 end -->
|
||||
<!-- 提交按钮 start -->
|
||||
<view class="bottom-action">
|
||||
<view class="btn2" @click="beforeConfirm">保存</view>
|
||||
</view>
|
||||
<!-- 提交按钮 end -->
|
||||
<!-- 地址选择插件 start -->
|
||||
<w-picker
|
||||
mode="region"
|
||||
:value="defVal"
|
||||
default-type="label"
|
||||
themeColor="#FF6464"
|
||||
@confirm="onConfirm($event)"
|
||||
ref="region"
|
||||
>选择所在地区</w-picker>
|
||||
<!-- 地址选择插件 end -->
|
||||
<!-- 断网监测 start -->
|
||||
<fu-notwork></fu-notwork>
|
||||
<!-- 断网监测 end -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wPicker from '@/pages/my/components/w-picker/w-picker.vue'
|
||||
// 高德地图sdk
|
||||
import amapFile from '@/common/amap-wx.js';
|
||||
export default {
|
||||
computed: {
|
||||
// 合并省市区信息字段
|
||||
address() {
|
||||
return this.province + this.city + this.district;
|
||||
},
|
||||
},
|
||||
components:{
|
||||
wPicker
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
keyboardheight: 0, // 键盘高度
|
||||
serveKeyword: '', // 服务标签关键字
|
||||
serve_show: false, // 服务标签弹框
|
||||
serveList: [], // 服务标签
|
||||
default_serve: '', // 默认服务标签
|
||||
phone: '', // 联系电话
|
||||
name: '', // 收货人姓名
|
||||
sex: 1, // 性别 1:男 2:女
|
||||
is_default: true, // 是否设为默认地址
|
||||
edit_id: null, // 是否是修改收货地址
|
||||
myAmapFun: null, // 高德地图实例
|
||||
province: '', // 省
|
||||
city: '', //市
|
||||
district: '', //区
|
||||
provinceCode: '', // 省 code码
|
||||
cityCode: '', //市 code码
|
||||
districtCode: '', //区 code码
|
||||
addressDesc: '', // 详细地址
|
||||
baiduAddress: '',
|
||||
lng: '',
|
||||
lat: '',
|
||||
customStyle: {
|
||||
'backgroundColor': '#cccccc',
|
||||
'color': '#ffffff',
|
||||
},// 自定义按钮样式
|
||||
defVal: [],
|
||||
};
|
||||
},
|
||||
/**
|
||||
* @description 页面入参
|
||||
* @param {object} options = [id]
|
||||
* @param {string} id = 修改的地址ID
|
||||
*/
|
||||
onLoad(options) {
|
||||
this.setNavigationBarTitle('添加地址')
|
||||
// 监听键盘高度
|
||||
uni.onKeyboardHeightChange((res) => {
|
||||
console.log("键盘监听", res);
|
||||
this.keyboardheight = res.height;
|
||||
});
|
||||
// 初始化高德地图SDK,记得换成自己的key
|
||||
this.myAmapFun = new amapFile.AMapWX({ key: '886bfe2d6c32bd8eac97c2e6d821ed0b' });
|
||||
//如果是修改地址
|
||||
if (options.id) {
|
||||
this.edit_id = options.id;
|
||||
// 换标题文字
|
||||
uni.setNavigationBarTitle({
|
||||
title: '编辑地址'
|
||||
});
|
||||
// 获取要修改的地址信息
|
||||
this.get_editAddress();
|
||||
} else {
|
||||
// 自动定位当前地址
|
||||
// this.autoGetLocation();
|
||||
// 获取默认标签
|
||||
this.getLabelData()
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.getPublishStatus()
|
||||
},
|
||||
methods: {
|
||||
handleAddressRecognition() {
|
||||
let baiduAddress = this.baiduAddress
|
||||
if (!baiduAddress) {
|
||||
this.$message.info('请先粘贴地址~');
|
||||
return;
|
||||
}
|
||||
this.$api.post(global.apiUrls.postAddressRecognition, {address: baiduAddress}).then(res => {
|
||||
let data = res.data;
|
||||
console.log(data);
|
||||
if (data.code == 1) {
|
||||
this.name = data.data.name ? data.data.name.trim() : ''
|
||||
this.phone = data.data.mobile || ''
|
||||
this.addressDesc = data.data.address || ''
|
||||
this.province = data.data.province;
|
||||
this.city = data.data.city;
|
||||
this.district = data.data.area;
|
||||
} else {
|
||||
this.$message.info(data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* @description 删除地址
|
||||
* */
|
||||
delAddr() {
|
||||
this.$util.showModal({
|
||||
title: '提示',
|
||||
content: '确定删除该地址?',
|
||||
confirmColor: this.$store.state.themeColor,
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
this.$api.post(global.apiUrls.post5cadd0d3a0c93, { address_id: this.edit_id })
|
||||
.then(res => {
|
||||
console.log(res);
|
||||
this.$message.info(res.data.msg);
|
||||
if (res.data.code == 1) {
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
}, 800)
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
/**
|
||||
* @func 获取服务标签列表
|
||||
*/
|
||||
getLabelData(val) {
|
||||
this.$api.post(global.apiUrls.getAddressLabelList, {}).then(res => {
|
||||
if (res.data.code == 1) {
|
||||
console.log('服务标签列表', res.data.data)
|
||||
this.serveList = res.data.data
|
||||
let serve = uni.getStorageSync('DEFAULT_SERVE');
|
||||
// 判断是否为编辑
|
||||
if (this.edit_id) {
|
||||
this.default_serve = {
|
||||
id: 0,
|
||||
name: val
|
||||
}
|
||||
var flag = this.serveList.filter((item) => {
|
||||
return item.name == val
|
||||
})
|
||||
if (flag.length == 0) {
|
||||
if(this.default_serve.name) this.serveList.push(this.default_serve);
|
||||
}
|
||||
} else {
|
||||
if (serve && this.serveList !=0) {
|
||||
this.default_serve = this.serveList[0]
|
||||
this.serveList.push(JSON.parse(serve))
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.$message.info(res.data.msg);
|
||||
}
|
||||
}).catch(err => {
|
||||
this.$message.info(err.msg);
|
||||
})
|
||||
},
|
||||
/**
|
||||
* @description 自定义服务标签弹窗显示
|
||||
* @param {String} name 回显自定义标签关键词
|
||||
*/
|
||||
addServe(name) {
|
||||
if (name) {
|
||||
this.serveKeyword = name
|
||||
}
|
||||
this.serve_show = true //弹窗显示
|
||||
},
|
||||
/**
|
||||
* @func 新增服务标签
|
||||
*/
|
||||
addServeInfo() {
|
||||
let val = this.serveKeyword.trim()
|
||||
if (val) {
|
||||
console.log(this.serveList)
|
||||
var flag = this.serveList.filter((item) => {
|
||||
return item.name == val
|
||||
})
|
||||
console.log(flag)
|
||||
if (flag.length == 0) {
|
||||
this.serve_show = false // 弹窗隐藏
|
||||
let serve = { id: 0, name: val }
|
||||
// 存在自定义标签
|
||||
if (this.serveList.length > 3) {
|
||||
this.serveList[3] = serve
|
||||
} else {
|
||||
this.serveList.push(serve)
|
||||
}
|
||||
this.default_serve = serve
|
||||
if (!this.edit_id) {
|
||||
uni.setStorageSync('DEFAULT_SERVE', JSON.stringify(serve));
|
||||
}
|
||||
} else {
|
||||
this.$message.info('标签已存在');
|
||||
}
|
||||
} else {
|
||||
this.$message.info('请输入内容');
|
||||
}
|
||||
},
|
||||
/**
|
||||
* @description 切换服务标签
|
||||
* @param {String} item = 服务标签关键字
|
||||
*/
|
||||
changeServe(item) {
|
||||
this.default_serve = item;
|
||||
},
|
||||
/**
|
||||
* @description 选择性别
|
||||
* @param {String} type = 性别
|
||||
*/
|
||||
chooseSex(type) {
|
||||
this.sex = type;
|
||||
},
|
||||
/**
|
||||
* @func 获取修改地址信息
|
||||
*/
|
||||
get_editAddress() {
|
||||
this.$api.post(global.apiUrls.post636fd7826b3ee, {
|
||||
address_id: this.edit_id
|
||||
}).then(res => {
|
||||
console.log(res, '修改的信息');
|
||||
if (res.data.code == 1) {
|
||||
let data = res.data.data;
|
||||
this.name = data.real_name; // 收货人姓名
|
||||
this.phone = data.mobile; // 收货人电话
|
||||
this.province = data.province; // 省
|
||||
this.city = data.city; // 市
|
||||
this.district = data.district; // 区
|
||||
this.addressDesc = data.detail; // 详细地址
|
||||
this.sex = data.sex; // 性别
|
||||
this.is_default = data.is_default == '1' ? true : false; // 是否默认
|
||||
this.defVal = [data.province,data.city,data.district];
|
||||
// 服务标签
|
||||
this.getLabelData(data.label_name)
|
||||
|
||||
} else {
|
||||
this.$message.info(res.data.msg);
|
||||
}
|
||||
}).catch(err => {
|
||||
this.$message.info(err.msg);
|
||||
})
|
||||
},
|
||||
/**
|
||||
* @func 显示地址选择弹窗
|
||||
*/
|
||||
showMulLinkageThreePicker() {
|
||||
uni.hideKeyboard();
|
||||
this.$refs.region.show();
|
||||
},
|
||||
/**
|
||||
* @description 地址选择回调
|
||||
* @param {Object} val = 地址信息对象
|
||||
*/
|
||||
onConfirm(val) {
|
||||
this.province = val.obj.province.label;
|
||||
this.city = val.obj.city.label;
|
||||
this.district = val.obj.area.label;
|
||||
this.provinceCode = val.value[0];
|
||||
this.cityCode = val.value[1];
|
||||
this.districtCode = val.value[2];
|
||||
},
|
||||
/**
|
||||
* @func 切换是否为默认地址
|
||||
*/
|
||||
handleSwitch(e) {
|
||||
this.is_default = e.detail.value;
|
||||
},
|
||||
/**
|
||||
* @func 定位地址
|
||||
*/
|
||||
location() {
|
||||
let _this = this;
|
||||
//#ifdef MP-WEIXIN
|
||||
uni.getSetting({
|
||||
success(res) {
|
||||
// 获取设置成功
|
||||
console.log(res.authSetting);
|
||||
if (!res.authSetting['scope.userLocation']) {
|
||||
// 如果没开启权限提示打开
|
||||
uni.openSetting({
|
||||
success(res) {
|
||||
// 打开成功，提示获取权限
|
||||
console.log(res.authSetting);
|
||||
uni.authorize({
|
||||
scope: 'scope.userLocation',
|
||||
success(res) {
|
||||
_this.chooseLocation();
|
||||
},
|
||||
fail(res) {
|
||||
console.log(res);
|
||||
this.$message.info('打开权限失败');
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
_this.chooseLocation();
|
||||
}
|
||||
}
|
||||
});
|
||||
//#endif
|
||||
this.chooseLocation();
|
||||
},
|
||||
/**
|
||||
* @func 地图选点
|
||||
*/
|
||||
chooseLocation() {
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
success: adr => {
|
||||
uni.chooseLocation({
|
||||
latitude: adr.latitude,
|
||||
longitude: adr.longitude,
|
||||
success: (res) => {
|
||||
console.log(res, '地图');
|
||||
|
||||
this.myAmapFun.getRegeo({
|
||||
location: res.longitude + ',' + res.latitude,
|
||||
success: (data) => {
|
||||
//成功回调
|
||||
console.log('sdk回调', data);
|
||||
let regeoData = data[0].regeocodeData.addressComponent;
|
||||
this.lng = res.longitude;
|
||||
this.lat = res.latitude;
|
||||
this.province = regeoData.province;
|
||||
this.city = Array.isArray(regeoData.city) && (regeoData.city.length == 0) ? regeoData.province: regeoData.city;
|
||||
|
||||
this.district = regeoData.district;
|
||||
this.addressDesc = (res.address || '') + (res.name || '');
|
||||
this.provinceCode = regeoData.adcode.substr(0,2)+'0000';
|
||||
this.cityCode = regeoData.adcode.substr(0,4)+'00';
|
||||
this.districtCode = regeoData.adcode+'';
|
||||
|
||||
|
||||
|
||||
},
|
||||
fail: (info) => {
|
||||
//失败回调
|
||||
console.log(info)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* @func 地图选点
|
||||
*/
|
||||
_chooseLocation() {
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
success: adr => {
|
||||
this.myAmapFun.getRegeo({
|
||||
location: adr.longitude + ',' + adr.latitude,
|
||||
success: (data) => {
|
||||
//成功回调
|
||||
console.log('sdk回调', data);
|
||||
let regeoData = data[0].regeocodeData.addressComponent;
|
||||
this.lng = adr.longitude;
|
||||
this.lat = adr.latitude;
|
||||
this.province = regeoData.province;
|
||||
this.city = Array.isArray(regeoData.city) && (regeoData.city.length == 0) ? regeoData.province: regeoData.city;
|
||||
|
||||
this.district = regeoData.district || this.city;
|
||||
this.addressDesc = ( data[0].name || '') + ( data[0].desc || '');
|
||||
this.provinceCode = regeoData.adcode.substr(0,2)+'0000';
|
||||
this.cityCode = regeoData.adcode.substr(0,4)+'00';
|
||||
this.districtCode = regeoData.adcode+'';
|
||||
|
||||
|
||||
|
||||
},
|
||||
fail: (info) => {
|
||||
//失败回调
|
||||
console.log(info)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* @func 自动定位
|
||||
*/
|
||||
autoGetLocation() {
|
||||
console.log("自动定位");
|
||||
let that = this
|
||||
uni.getLocation({
|
||||
geocode: true,
|
||||
success: (adr) => {
|
||||
that.myAmapFun.getRegeo({
|
||||
location: adr.longitude + ',' + adr.latitude,
|
||||
success: (data) => {
|
||||
//成功回调
|
||||
console.log('自动定位 SDK回调', data);
|
||||
let regeoData = data[0].regeocodeData.addressComponent;
|
||||
this.lng = adr.longitude;
|
||||
this.lat = adr.latitude;
|
||||
that.province = regeoData.province;
|
||||
that.city = Array.isArray(regeoData.city) && (regeoData.city.length == 0) ? regeoData.province: regeoData.city;
|
||||
that.district = regeoData.district;
|
||||
that.addressDesc = that.province + that.city + that.district + data[0].desc;
|
||||
that.provinceCode = regeoData.adcode.substr(0,2)+'0000';
|
||||
that.cityCode = regeoData.adcode.substr(0,4)+'00';
|
||||
that.districtCode = regeoData.adcode+'';
|
||||
},
|
||||
fail: (info) => {
|
||||
//失败回调
|
||||
console.log(info)
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
//
|
||||
beforeConfirm(){
|
||||
this.$util.debounce(this.sub_sure,1500,true);
|
||||
},
|
||||
/**
|
||||
* @func 提交表单
|
||||
*/
|
||||
sub_sure() {
|
||||
// 表单验证
|
||||
|
||||
if (this.name.trim() == '') {
|
||||
this.$message.info('请输入收货人姓名');
|
||||
this.name = '';
|
||||
return false;
|
||||
};
|
||||
if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.phone)) {
|
||||
let text = !this.phone ? '请输入手机号' : '手机号格式不正确';
|
||||
this.$message.info(text);
|
||||
return false;
|
||||
}
|
||||
if (this.address.trim() == '') {
|
||||
this.$message.info('地区不能为空');
|
||||
return false;
|
||||
}
|
||||
//判断是否含有特殊字符
|
||||
let iconRule1 = /[`~!@#$%^&*_\+=<>?:"{}|,.\/;'\\[\]·~！@#￥%……&* ——\+={}|《》？：“”【】；‘’，。]/im;
|
||||
|
||||
// 判断是否含有emoji表情
|
||||
let iconRule2 = /[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\uA9|\uAE|\u3030/ig;
|
||||
if (this.addressDesc.trim() == '') {
|
||||
this.$message.info('详细地址不能为空');
|
||||
this.addressDesc = '';
|
||||
return false;
|
||||
}
|
||||
// if (iconRule1.test(this.addressDesc)) {
|
||||
// this.$message.info('详细地址不能含有特殊字符');
|
||||
// // this.addressDesc = '';
|
||||
// return false;
|
||||
// }
|
||||
// if (iconRule2.test(this.addressDesc)) {
|
||||
// this.$message.info('详细地址不能含有表情');
|
||||
// // this.addressDesc = '';
|
||||
// return false;
|
||||
// }
|
||||
|
||||
let data = {
|
||||
real_name: this.name, // 收货人姓名
|
||||
mobile: this.phone, // 收货人手机
|
||||
is_default: this.is_default ? '1' : '0', // 是否默认地址
|
||||
detail: this.addressDesc, // 详细地址
|
||||
province: this.province, // 省
|
||||
city: this.city, // 市
|
||||
district: this.district, // 区
|
||||
provinceCode: this.provinceCode, // 省 code码
|
||||
cityCode: this.cityCode, //市 code码
|
||||
districtCode: this.districtCode, //区 code码
|
||||
sex:this.sex,
|
||||
lng:this.lng,
|
||||
lat:this.lat,
|
||||
label_name: this.default_serve ? this.default_serve.name : '' // 标签name
|
||||
}
|
||||
if (!data.label_name) {
|
||||
this.$message.info('请选择地址标签');
|
||||
this.name = '';
|
||||
return false;
|
||||
};
|
||||
console.log(data)
|
||||
// 判断提交的接口
|
||||
let url = global.apiUrls.post637defdbd53ef;
|
||||
if (this.edit_id) {
|
||||
data.address_id = this.edit_id
|
||||
url = global.apiUrls.post637df1ea39d16;
|
||||
}
|
||||
console.log('提交的地址参数',data);
|
||||
console.log('提交的地址',url);
|
||||
// 提交请求
|
||||
this.$api.post(url, data)
|
||||
.then(res => {
|
||||
console.log(res, '添加/编辑成功');
|
||||
if (res.data.code == 1) {
|
||||
// this.$message.info(res.data.msg);
|
||||
// 通知商品详情页更新地址数据
|
||||
uni.$emit('refreshAddress',res.data.data.address_id);
|
||||
setTimeout(() => {
|
||||
uni.navigateBack()
|
||||
}, 800);
|
||||
} else {
|
||||
this.$message.info(res.data.msg)
|
||||
}
|
||||
|
||||
})
|
||||
.catch(err => {
|
||||
console.log("err: ", err);
|
||||
})
|
||||
},
|
||||
/**
|
||||
* @func 清除手机号
|
||||
*/
|
||||
clear() {
|
||||
this.phone = '';
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #F6F7F9;
|
||||
overflow: hidden;
|
||||
}
|
||||
.tag{
|
||||
padding: 0 16rpx;
|
||||
margin-right: 10rpx;
|
||||
line-height: 52rpx;
|
||||
border: 1rpx solid #333;
|
||||
}
|
||||
.bottom-status {
|
||||
height: 156rpx;
|
||||
height: calc(156rpx + constant(safe-area-inset-bottom));
|
||||
height: calc(156rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
.cuIcon-right {
|
||||
transform:rotate(-90deg);
|
||||
-ms-transform:rotate(-90deg); /* IE 9 */
|
||||
-moz-transform:rotate(-90deg); /* Firefox */
|
||||
-webkit-transform:rotate(-90deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(-90deg); /* Opera */
|
||||
}
|
||||
.text-area {
|
||||
height: 140rpx !important;
|
||||
background-color: #F6F6F6;
|
||||
padding: 20rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
.text-ai {
|
||||
width: 100%;
|
||||
height: 180rpx !important;
|
||||
background-color: #fff;
|
||||
padding: 24rpx 0;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
.btn {
|
||||
margin-bottom: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 124rpx;
|
||||
height: 56rpx;
|
||||
border: 1px solid #006AB9;
|
||||
opacity: 1;
|
||||
color: #006AB9;
|
||||
font-size: 24rpx;
|
||||
border-radius: 28rpx;
|
||||
}
|
||||
/deep/ .uni-textarea-textarea{
|
||||
line-height: 1.5;
|
||||
}
|
||||
.addAddr {
|
||||
padding: 0 32upx;
|
||||
background: #fff;
|
||||
|
||||
.uni-list-cell {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin: 20upx 0;
|
||||
box-sizing: border-box;
|
||||
height: 100upx;
|
||||
font-size: 30upx;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.addr {
|
||||
font-size: 32upx;
|
||||
padding: 30upx 0;
|
||||
border-bottom: 1px solid #f5f5f7;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.addr_title {
|
||||
display: inline-block;
|
||||
width: 180rpx;
|
||||
}
|
||||
|
||||
.chose_addr {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
.cell {
|
||||
font-size: 32upx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: 32rpx 0;
|
||||
border-bottom: 1px solid #f5f5f7;
|
||||
|
||||
.title {
|
||||
display: inline-block;
|
||||
width: 180rpx;
|
||||
}
|
||||
|
||||
input {
|
||||
flex: 1;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.text-area {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.address {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 32upx;
|
||||
|
||||
.title {
|
||||
line-height: 110upx;
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
padding: 20upx 0;
|
||||
font-size: 26upx;
|
||||
}
|
||||
}
|
||||
|
||||
.placeholderClass {
|
||||
font-size: 32rpx;
|
||||
color: #BFBFBF;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #0CBC56;
|
||||
}
|
||||
|
||||
switch::before,
|
||||
switch::after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
.bottom-action {
|
||||
position: fixed;
|
||||
bottom: 56rpx;
|
||||
left: 32rpx;
|
||||
width: 686rpx;
|
||||
display: flex;
|
||||
|
||||
view {
|
||||
height: 88rpx;
|
||||
flex: 1;
|
||||
line-height: 88rpx;
|
||||
text-align: center;
|
||||
border-radius: 88rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.btn2 {
|
||||
background: rgba(255, 147, 0, 1);
|
||||
}
|
||||
}
|
||||
|
||||
/deep/ uni-switch.checked-green .uni-switch-input {
|
||||
background-color: #39b54a !important;
|
||||
border-color: #39b54a !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
/deep/ .switch {
|
||||
transform: scale(0.7);
|
||||
}
|
||||
.serve-pop {
|
||||
height: 100rpx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background-color: #FFFFFF;
|
||||
|
||||
input {
|
||||
margin-left: 32rpx;
|
||||
width: 528rpx;
|
||||
height: 66rpx;
|
||||
background: #F6F7F9;
|
||||
opacity: 1;
|
||||
border-radius: 35rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #99999A;
|
||||
text-indent: 1em;
|
||||
}
|
||||
|
||||
button {
|
||||
width: 140rpx;
|
||||
height: 66rpx;
|
||||
background: #FF9300;
|
||||
border-radius: 33rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.left-0 {
|
||||
margin-left: 2rpx;
|
||||
}
|
||||
|
||||
.radius-left {
|
||||
border-top-left-radius: 20rpx;
|
||||
border-bottom-left-radius: 20rpx;
|
||||
}
|
||||
|
||||
.radius-right {
|
||||
border-top-right-radius: 20rpx;
|
||||
border-bottom-right-radius: 20rpx;
|
||||
}
|
||||
.bg-orange2{
|
||||
// border: 1px solid #FF9300;
|
||||
background: #59A6F4;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bg-green{
|
||||
border: 1px solid #FF9300;
|
||||
background: #FF9300;
|
||||
color: #fff;
|
||||
}
|
||||
.placeholder{
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #BFBFBF;
|
||||
}
|
||||
.placeholderServe{
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #99999A;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user