898 lines
27 KiB
Vue
898 lines
27 KiB
Vue
<template>
|
||
<view class="page" :style="themeColor">
|
||
<view class="flex benben-position-layout flex flex-wrap align-center addAddress_flex_0"
|
||
:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx'}">
|
||
<view class='flex flex-wrap align-center justify-between flex-sub addAddress_fd0_0'>
|
||
<view class='flex flex-wrap align-center addAddress_fd0_0_c0' @tap.stop="handleJumpDiy" data-type="back"
|
||
data-url="1">
|
||
<text class='fu-iconfont2 addAddress_fd0_0_c0_c0'></text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center'>
|
||
<text class='addAddress_fd0_0_c1_c0'>{{edit_id ? '编辑地址': '添加地址'}}</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center justify-end addAddress_fd0_0_c2'>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
|
||
<!---添加地址flex布局开始-->
|
||
<view class="flex flex-direction flex-wrap align-stretch benben-flex-layout addAddress_flex_1">
|
||
<view class='flex flex-wrap align-center addAddress_fd1_0'>
|
||
<text class='addAddress_fd1_0_c0'>标签</text>
|
||
<benben-select-diy ref="showSelectPopup1681962374899" class-name='flex align-center flex'
|
||
:items.sync="labelType" v-model="label_id" :label.sync="label_name" default-type="value" default-label="name"
|
||
:allow-cancel='true' type="radio" :disabled='false'>
|
||
<template v-for='(item,key0) in labelType'>
|
||
<view v-if="item.isSelected" class='flex align-center flex' :key="key0"
|
||
@tap="$refs.showSelectPopup1681962374899.tapHandle(key0)">
|
||
<text class='addAddress_fd1_0_c1_c0_c0'>{{item.name}}</text>
|
||
</view>
|
||
<view v-else class='flex align-center flex' :key="key0"
|
||
@tap="$refs.showSelectPopup1681962374899.tapHandle(key0)">
|
||
<text class='addAddress_fd1_0_c1_c1_c0'>{{item.name}}</text>
|
||
</view>
|
||
</template>
|
||
</benben-select-diy>
|
||
<text class='addAddress_fd1_0_c2'>+</text>
|
||
</view>
|
||
<view class='flex flex-wrap align-center addAddress_fd1_1'>
|
||
<text class='addAddress_fd1_1_c0'>收货人</text>
|
||
<input class='flex-sub addAddress_fd1_1_c1' type="text" placeholder="收货人" confirm-type="done" :maxlength="-1"
|
||
placeholder-style="color:#BFBFBF;font-size:32rpx" v-model="fd1_1_c1" />
|
||
<benben-select-diy ref="showSelectPopup1681962038152" class-name='flex flex' :items.sync="sex" v-model="sex_id"
|
||
:label.sync="sex_name" default-type="value" default-label="name" :allow-cancel='true' type="radio"
|
||
:disabled='false'>
|
||
<template v-for='(item,key0) in sex'>
|
||
<view v-if="item.isSelected" class='flex align-center flex addAddress_fd1_1_c2_c0' :key="key0"
|
||
@tap="$refs.showSelectPopup1681962038152.tapHandle(key0)">
|
||
<image class='addAddress_fd1_1_c2_c0_c0' mode="aspectFit" :src='STATIC_URL+"33.png"'></image>
|
||
<text class='addAddress_fd1_1_c2_c0_c1'>{{item.name}}</text>
|
||
</view>
|
||
<view v-else class='flex align-center flex addAddress_fd1_1_c2_c1' :key="key0"
|
||
@tap="$refs.showSelectPopup1681962038152.tapHandle(key0)">
|
||
<image class='addAddress_fd1_1_c2_c1_c0' mode="aspectFit" :src='STATIC_URL+"165.png"'></image>
|
||
<text class='addAddress_fd1_1_c2_c1_c1'>{{item.name}}</text>
|
||
</view>
|
||
</template>
|
||
</benben-select-diy>
|
||
</view>
|
||
<view class='flex flex-wrap align-center addAddress_fd1_2'>
|
||
<text class='addAddress_fd1_2_c0'>联系电话</text>
|
||
<input class='flex-sub addAddress_fd1_2_c1' type="number" placeholder="联系电话" confirm-type="done" :maxlength="11"
|
||
placeholder-style="color:#BFBFBF;font-size:32rpx" v-model="fd1_2_c1" />
|
||
</view>
|
||
<view class='flex flex-wrap align-center addAddress_fd1_3' @tap.stop="handleJumpDiy" data-type="navigateTo"
|
||
:data-url="`/pages/my/mapSite/mapSite`">
|
||
<text class='addAddress_fd1_3_c0'>所在地区</text>
|
||
<input class='flex-sub addAddress_fd1_3_c1' type="text" placeholder="请选择省市区县、乡镇" confirm-type="done"
|
||
:maxlength="-1" :disabled='true' placeholder-style="color:#BFBFBF;font-size:32rpx" v-model="fd1_3_c1" />
|
||
<image class='addAddress_fd1_3_c2' mode="aspectFit" :src='STATIC_URL+"37.png"'></image>
|
||
</view>
|
||
<view class='flex flex-wrap align-center addAddress_fd1_4'>
|
||
<view class='flex flex-wrap addAddress_fd1_4_c0'>
|
||
<textarea class='flex addAddress_input_fd1_4_c0' confirm-type="done" :placeholder="'请填写详细地址：如道路、门牌号、小区、楼栋号等'"
|
||
:maxlength="240" placeholder-style="color:#BFBFBF;font-size:28rpx" v-model="fd1_4_c0" />
|
||
|
||
</view>
|
||
</view>
|
||
<view class='flex flex-wrap align-center justify-between addAddress_fd1_5'>
|
||
<text class='addAddress_fd1_5_c0'>设为默认地址</text>
|
||
<switch color='rgba(79, 227, 49, 1)' style="transform: scale(0.8)" class="flex " :checked="isDefault" />
|
||
</view>
|
||
</view>
|
||
|
||
<!---添加地址flex布局结束-->
|
||
<!--选择器开始 -->
|
||
<benben-picker ref="benbenWritePickerCodepicker2" :visible.sync="pickerDiy1681962239781" mode='region'
|
||
:mask-show='true' :picker-height='88' :hide-area='false'>
|
||
<template #picker-header>
|
||
<view class='flex flex-wrap align-center justify-between addAddress_picker2_0'>
|
||
<text class='addAddress_picker2_0_c0' @tap="$refs.benbenWritePickerCodepicker2.cancel()">取消</text>
|
||
<text class='addAddress_picker2_0_c1'>选择所在地区</text>
|
||
<text class='addAddress_picker2_0_c2' @tap="$refs.benbenWritePickerCodepicker2.pickerConfirm()">确认</text>
|
||
</view>
|
||
</template>
|
||
</benben-picker>
|
||
<!--选择器结束 -->
|
||
<view class="flex flex-wrap align-start justify-center benben-position-layout flex addAddress_flex_3">
|
||
<button class='addAddress_fd3_0' @tap.stop="handleJumpDiy" data-type="navigateTo"
|
||
:data-url="`/pages/my/addressManagement/addressManagement`">保存</button>
|
||
|
||
</view>
|
||
<view :style="{height: '120rpx'}"></view>
|
||
|
||
|
||
</view>
|
||
</template>
|
||
<script>
|
||
export default {
|
||
components: {},
|
||
|
||
|
||
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: '',
|
||
customStyle: {
|
||
'backgroundColor': '#cccccc',
|
||
'color': '#ffffff',
|
||
}, // 自定义按钮样式
|
||
defVal: [],
|
||
"pickerDiy1681962239781": false,
|
||
"fd1_1_c1": "",
|
||
"fd1_2_c1": "",
|
||
"fd1_3_c1": "",
|
||
"fd1_4_c0": "",
|
||
"labelType": [{
|
||
"name": "公司",
|
||
"value": "1",
|
||
"image": ""
|
||
}, {
|
||
"name": "家",
|
||
"value": "2",
|
||
"image": ""
|
||
}, {
|
||
"name": "学校",
|
||
"value": "3",
|
||
"image": ""
|
||
}],
|
||
"label_id": "1",
|
||
"label_name": "",
|
||
"sex": [{
|
||
"name": "先生",
|
||
"value": "1",
|
||
"image": ""
|
||
}, {
|
||
"name": "女士",
|
||
"value": "2",
|
||
"image": ""
|
||
}],
|
||
"sex_id": "1",
|
||
"sex_name": "",
|
||
"isDefault": true
|
||
};
|
||
},
|
||
computed: {
|
||
themeColor() {
|
||
return this.$store.getters.themeColor
|
||
},
|
||
|
||
},
|
||
watch: {},
|
||
onUnload() {
|
||
|
||
},
|
||
onReady() {
|
||
|
||
},
|
||
onShow() {
|
||
|
||
},
|
||
onHide() {
|
||
|
||
},
|
||
onResize() {
|
||
|
||
},
|
||
onPullDownRefresh() {
|
||
|
||
},
|
||
onReachBottom(e) {
|
||
|
||
},
|
||
onPageScroll(e) {
|
||
|
||
},
|
||
/**
|
||
* @description 页面入参
|
||
* @param {object} options = [id]
|
||
* @param {string} id = 修改的地址ID
|
||
*/
|
||
onLoad(options) {
|
||
// 监听键盘高度
|
||
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.i18n['编辑']
|
||
});
|
||
// 获取要修改的地址信息
|
||
this.get_editAddress();
|
||
} else {
|
||
// 自动定位当前地址
|
||
this.autoGetLocation();
|
||
// 获取默认标签
|
||
this.getLabelData()
|
||
}
|
||
},
|
||
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: this.i18n['提示'],
|
||
content: this.i18n['确定删除该地址?'],
|
||
confirmColor: this.$store.state.themeColor,
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
this.$api.post(global.apiUrls.postUserAddressDelAddress, {
|
||
address_ids: this.edit_id
|
||
})
|
||
.then(res => {
|
||
console.log(res);
|
||
if (res.data.code == 1) {
|
||
uni.navigateBack();
|
||
} else {
|
||
this.$message.info(res.msg);
|
||
}
|
||
});
|
||
}
|
||
}
|
||
|
||
})
|
||
},
|
||
/**
|
||
* @func 获取服务标签列表
|
||
*/
|
||
getLabelData(val) {
|
||
this.$api.post(global.apiUrls.getLabel, {}).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(this.i18n['标签已存在']);
|
||
}
|
||
} else {
|
||
this.$message.info(this.i18n['请输入内容']);
|
||
}
|
||
},
|
||
/**
|
||
* @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.postUserAddressGetOneAddress, {
|
||
address_id: this.edit_id
|
||
}).then(res => {
|
||
console.log(res, '修改的信息');
|
||
if (res.data.code == 1) {
|
||
let data = res.data.data;
|
||
this.name = data.name; // 收货人姓名
|
||
this.phone = data.mobile; // 收货人电话
|
||
this.province = data.province; // 省
|
||
this.city = data.city; // 市
|
||
this.district = data.district; // 区
|
||
this.addressDesc = data.address; // 详细地址
|
||
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(this.i18n['打开权限失败']);
|
||
}
|
||
});
|
||
}
|
||
});
|
||
} 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.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 自动定位
|
||
*/
|
||
autoGetLocation() {
|
||
console.log("自动定位");
|
||
uni.getLocation({
|
||
geocode: true,
|
||
success: (adr) => {
|
||
this.myAmapFun.getRegeo({
|
||
location: adr.longitude + ',' + adr.latitude,
|
||
success: (data) => {
|
||
//成功回调
|
||
console.log('自动定位 SDK回调', data);
|
||
let regeoData = data[0].regeocodeData.addressComponent;
|
||
this.province = regeoData.province;
|
||
this.city = Array.isArray(regeoData.city) && (regeoData.city.length == 0) ? regeoData
|
||
.province : regeoData.city;
|
||
this.district = regeoData.district;
|
||
this.addressDesc = 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)
|
||
}
|
||
})
|
||
|
||
}
|
||
})
|
||
},
|
||
//
|
||
beforeConfirm() {
|
||
this.$util.debounce(this.sub_sure, 1500, true);
|
||
},
|
||
/**
|
||
* @func 提交表单
|
||
*/
|
||
sub_sure() {
|
||
// 表单验证
|
||
|
||
if (this.name.trim() == '') {
|
||
this.$message.info(this.i18n['请输入收货人姓名']);
|
||
this.name = '';
|
||
return false;
|
||
};
|
||
if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.phone)) {
|
||
let text = !this.phone ? this.i18n['请输入手机号'] : this.i18n['手机号格式不正确'];
|
||
this.$message.info(text);
|
||
return false;
|
||
}
|
||
if (this.address.trim() == '') {
|
||
this.$message.info(this.i18n['地区不能为空']);
|
||
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.i18n['详细地址不能为空']);
|
||
this.addressDesc = '';
|
||
return false;
|
||
}
|
||
if (iconRule1.test(this.addressDesc)) {
|
||
this.$message.info(this.i18n['详细地址不能含有特殊字符']);
|
||
// this.addressDesc = '';
|
||
return false;
|
||
}
|
||
if (iconRule2.test(this.addressDesc)) {
|
||
this.$message.info(this.i18n['详细地址不能含有表情']);
|
||
// this.addressDesc = '';
|
||
return false;
|
||
}
|
||
|
||
let data = {
|
||
name: this.name, // 收货人姓名
|
||
mobile: this.phone, // 收货人手机
|
||
is_default: this.is_default ? '1' : '0', // 是否默认地址
|
||
address: 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,
|
||
label_name: this.default_serve ? this.default_serve.name : '' // 标签name
|
||
}
|
||
if (!data.label_name) {
|
||
this.$message.info(this.i18n['请选择地址标签']);
|
||
this.name = '';
|
||
return false;
|
||
};
|
||
console.log(data)
|
||
// 判断提交的接口
|
||
let url = global.apiUrls.postUserAddressAddAddress;
|
||
if (this.edit_id) {
|
||
data.address_id = this.edit_id
|
||
url = global.apiUrls.postUserAddressEditAddress;
|
||
}
|
||
console.log('提交的地址参数', data);
|
||
console.log('提交的地址', url);
|
||
// 提交请求
|
||
this.$api.post(url, data)
|
||
.then(res => {
|
||
console.log(res, '添加/编辑成功');
|
||
if (res.statusCode == 200 && res.data.code == 1) {
|
||
this.$message.info(this.i18n['保存成功']);
|
||
// 通知商品详情页更新地址数据
|
||
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 {
|
||
width: 100vw;
|
||
overflow-x: hidden;
|
||
min-height: calc(100vh - var(--window-bottom));
|
||
background: #F8F8F8;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.addAddress_flex_0 {
|
||
background: #fff;
|
||
width: 750rpx;
|
||
height: 88rpx;
|
||
overflow: hidden;
|
||
z-index: 10;
|
||
top: 0rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.addAddress_fd0_0_c2 {
|
||
width: 150rpx;
|
||
}
|
||
|
||
.addAddress_fd0_0_c1_c0 {
|
||
font-size: 36rpx;
|
||
font-weight: 500;
|
||
color: #333;
|
||
line-height: 88rpx;
|
||
}
|
||
|
||
.addAddress_fd0_0_c0_c0 {
|
||
font-size: 36rpx;
|
||
font-weight: 500;
|
||
color: #333;
|
||
line-height: 36rpx;
|
||
}
|
||
|
||
.addAddress_fd0_0_c0 {
|
||
width: 150rpx;
|
||
}
|
||
|
||
.addAddress_fd0_0 {
|
||
margin: 0rpx 32rpx 0rpx 32rpx;
|
||
}
|
||
|
||
.addAddress_flex_1 {
|
||
background: #fff;
|
||
background-size: 100% auto !important;
|
||
padding: 0rpx 0rpx 0rpx 32rpx;
|
||
}
|
||
|
||
.addAddress_fd1_5_c0 {
|
||
font-size: 32rpx;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
}
|
||
|
||
.addAddress_fd1_5 {
|
||
padding: 32rpx 32rpx 32rpx 0rpx;
|
||
}
|
||
|
||
.addAddress_input_fd1_4_c0 {
|
||
font-size: 28rpx;
|
||
font-weight: 400;
|
||
color: #333;
|
||
}
|
||
|
||
.addAddress_fd1_4_c0 {
|
||
background: rgba(246, 246, 246, 1);
|
||
width: 680rpx;
|
||
padding: 24rpx 24rpx 24rpx 24rpx;
|
||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||
height: 160rpx;
|
||
}
|
||
|
||
.addAddress_fd1_4 {
|
||
border-bottom: 1px solid #eee;
|
||
padding: 32rpx 32rpx 32rpx 0rpx;
|
||
}
|
||
|
||
.addAddress_fd1_3_c2 {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
|
||
.addAddress_fd1_3_c1 {
|
||
padding: 0rpx 0rpx 0rpx 40rpx;
|
||
font-size: 32rpx;
|
||
font-weight: 500;
|
||
color: #333;
|
||
line-height: 45rpx;
|
||
}
|
||
|
||
.addAddress_fd1_3_c0 {
|
||
font-size: 32rpx;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
}
|
||
|
||
.addAddress_fd1_3 {
|
||
border-bottom: 1px solid #eee;
|
||
padding: 32rpx 32rpx 32rpx 0rpx;
|
||
}
|
||
|
||
.addAddress_fd1_2_c1 {
|
||
padding: 0rpx 0rpx 0rpx 40rpx;
|
||
font-size: 32rpx;
|
||
font-weight: 500;
|
||
color: #333;
|
||
line-height: 45rpx;
|
||
}
|
||
|
||
.addAddress_fd1_2_c0 {
|
||
font-size: 32rpx;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
}
|
||
|
||
.addAddress_fd1_2 {
|
||
border-bottom: 1px solid #eee;
|
||
padding: 32rpx 32rpx 32rpx 0rpx;
|
||
}
|
||
|
||
.addAddress_fd1_1_c2_c1_c1 {
|
||
font-size: 32rpx;
|
||
font-weight: 400;
|
||
color: #999999;
|
||
margin: 0rpx 0rpx 0rpx 12rpx;
|
||
}
|
||
|
||
.addAddress_fd1_1_c2_c1_c0 {
|
||
width: 36rpx;
|
||
height: 36rpx;
|
||
}
|
||
|
||
.addAddress_fd1_1_c2_c1 {
|
||
margin: 0rpx 32rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.addAddress_fd1_1_c2_c0_c1 {
|
||
font-size: 32rpx;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
margin: 0rpx 0rpx 0rpx 12rpx;
|
||
}
|
||
|
||
.addAddress_fd1_1_c2_c0_c0 {
|
||
width: 36rpx;
|
||
height: 36rpx;
|
||
}
|
||
|
||
.addAddress_fd1_1_c2_c0 {
|
||
margin: 0rpx 32rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.addAddress_fd1_1_c1 {
|
||
padding: 0rpx 0rpx 0rpx 72rpx;
|
||
font-size: 32rpx;
|
||
font-weight: 400;
|
||
color: #333;
|
||
line-height: 45rpx;
|
||
}
|
||
|
||
.addAddress_fd1_1_c0 {
|
||
font-size: 32rpx;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
}
|
||
|
||
.addAddress_fd1_1 {
|
||
border-bottom: 1px solid #eee;
|
||
padding: 32rpx 0rpx 32rpx 0rpx;
|
||
}
|
||
|
||
.addAddress_fd1_0_c2 {
|
||
border: 1px solid #eee;
|
||
background: #fff;
|
||
margin: 0rpx 16rpx 0rpx 0rpx;
|
||
border-radius: 5rpx 5rpx 5rpx 5rpx;
|
||
font-size: 24rpx;
|
||
font-weight: 400;
|
||
color: #333;
|
||
padding: 4rpx 21rpx 4rpx 21rpx;
|
||
}
|
||
|
||
.addAddress_fd1_0_c1_c1_c0 {
|
||
border: 1px solid #eee;
|
||
background: #fff;
|
||
margin: 0rpx 16rpx 0rpx 0rpx;
|
||
border-radius: 5rpx 5rpx 5rpx 5rpx;
|
||
font-size: 24rpx;
|
||
font-weight: 400;
|
||
color: #333;
|
||
padding: 4rpx 12rpx 4rpx 12rpx;
|
||
}
|
||
|
||
.addAddress_fd1_0_c1_c0_c0 {
|
||
background: rgba(89, 166, 244, 1);
|
||
margin: 0rpx 16rpx 0rpx 0rpx;
|
||
border-radius: 5rpx 5rpx 5rpx 5rpx;
|
||
font-size: 24rpx;
|
||
font-weight: 400;
|
||
color: #fff;
|
||
padding: 4rpx 12rpx 4rpx 12rpx;
|
||
}
|
||
|
||
.addAddress_fd1_0_c0 {
|
||
font-size: 32rpx;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
margin: 0rpx 101rpx 0rpx 0rpx;
|
||
}
|
||
|
||
.addAddress_fd1_0 {
|
||
border-bottom: 1px solid #eee;
|
||
padding: 32rpx 32rpx 32rpx 0rpx;
|
||
}
|
||
|
||
.addAddress_picker2_0_c2 {
|
||
color: rgba(255, 125, 0, 1);
|
||
font-size: 32rpx;
|
||
}
|
||
|
||
.addAddress_picker2_0_c1 {
|
||
font-size: 32rpx;
|
||
}
|
||
|
||
.addAddress_picker2_0_c0 {
|
||
font-size: 32rpx;
|
||
color: rgba(191, 191, 191, 1);
|
||
}
|
||
|
||
.addAddress_picker2_0 {
|
||
border-bottom: 1px solid #eee;
|
||
background: #fff;
|
||
padding: 32rpx 32rpx 32rpx 32rpx;
|
||
border-radius: 25rpx 25rpx 0rpx 0rpx;
|
||
background-size: 100% auto !important;
|
||
}
|
||
|
||
.addAddress_flex_3 {
|
||
width: 750rpx;
|
||
height: 120rpx;
|
||
overflow: hidden;
|
||
z-index: 10;
|
||
bottom: calc(0rpx + var(--window-bottom));
|
||
}
|
||
|
||
.addAddress_fd3_0 {
|
||
background: rgba(255, 147, 0, 1);
|
||
border-radius: 40rpx 40rpx 40rpx 40rpx;
|
||
font-size: 32rpx;
|
||
color: #fff;
|
||
width: 686rpx;
|
||
height: 88rpx;
|
||
line-height: 88rpx;
|
||
font-weight: 500;
|
||
}
|
||
</style>
|