Commit a9691522 authored by 高铭波's avatar 高铭波

feat(parts):配件申请页面对接地址修改模块

parent 9117c30c
<template>
<view class="item" @click="$u.throttle(editSite, 500)">
<view class="userinfo u-flex">
<view class="name">{{ formatName }}</view>
<view class="mobile">{{ formatMobile }}</view>
</view>
<view class="siteinfo u-flex u-row-between u-col-top">
<view class="txt">{{ formatAddress }}</view>
<u-icon custom-prefix="wxh" name="pen" size="32"></u-icon>
</view>
<view class="default" v-show="isDefault">
<u-icon name="checkmark-circle" color="#2272FF" size="32"></u-icon>
<text class="txt">默认地址</text>
</view>
</view>
</template>
<script>
/**
* navbar 自定义地址单元格
* @description 此组件一般用于地址显示列。
* @property {Object} info 地址信息(默认{name: '', mobile: '', address: ''})
* @property {Boolean} is-default 是否为默认地址(默认 false)
* @event {Function()} edit-site 编辑地址
* @example <w-address :info="addressInfo" :isDefault="true" />
*/
export default {
name: 'w-address',
props: {
info: {
type: Object,
default() {
return {name: '', mobile: '', address: ''};
}
},
isDefault: {
type: Boolean,
default: false
},
siteType: {
type: String,
default: 'edit'
}
},
data() {
return {};
},
computed: {
formatName() {
let name = this.info && this.info.name;
if (this.$u.test.isEmpty(name)) {
return '--';
} else {
return name;
}
},
formatMobile() {
let mobile = this.info && this.info.mobile;
if (this.$u.test.isEmpty(mobile)) {
return '--';
}
if (mobile.length == 11) {
let tmps = [];
tmps[0] = mobile.slice(0, 3);
tmps[1] = mobile.slice(3, 7);
tmps[2] = mobile.slice(7);
return tmps.join(' ');
} else {
return mobile;
}
},
formatAddress() {
let address = this.info && this.info.address;
if (this.$u.test.isEmpty(address)) {
return '--';
} else {
return address;
}
}
},
methods: {
editSite() {
this.$emit('edit-site', this.info)
},
}
};
</script>
<style lang="scss" scoped>
.item {
.userinfo {
.name {
height: 92rpx;
font-size: 32rpx;
font-weight: bold;
color: #333333;
line-height: 92rpx;
}
.mobile {
margin-left: 20rpx;
height: 92rpx;
font-size: 28rpx;
font-weight: 400;
color: #666666;
line-height: 92rpx;
}
}
.siteinfo {
.txt {
width: 500rpx;
font-size: 28rpx;
font-weight: 400;
color: #333333;
line-height: 34rpx;
word-wrap: break-word;
}
}
.default {
border-top: 2rpx solid #F4F5F7;
margin-top: 22rpx;
padding-top: 30rpx;
.txt {
margin-left: 12rpx;
font-size: 28rpx;
font-weight: 400;
color: #333333;
line-height: 28rpx;
}
}
}
</style>
......@@ -59,10 +59,10 @@
* @property {String} type 编辑类型(默认为修改,add--新增、edit--修改、select--选择)
* @property {String} info 地址信息(json字符串:包含地址信息)
*/
import Utils from '@/utils/callUtils.js'
let r = require('libs/bmap-wx.min.js');
let h = new r.BMapWX({
// ak: process.uniEnv.bmapAK,
ak: 'G1wPip2Oj62NnoUctXhiE1faZVHbeo2A'
ak: process.uniEnv.bmapAK,
});
export default {
data() {
......@@ -97,11 +97,12 @@ export default {
};
}
},
async onLoad(e) {
onLoad(e) {
getApp().trackPage('我的收获地址修改页');
if (!this.vuex_token) {
this.$u.route({ url: 'pages/login/index' });
}
debugger
if (e) {
if (e.type === 'add') {
this.title = '新增地址';
......@@ -109,13 +110,24 @@ export default {
} else if (e.type === 'select') {
this.title = '选择地址';
this.siteType = 'select';
} else if (e.info && this.$u.test.jsonString(e.info)) {
// 默认修改我的地址
this.siteInfo = JSON.parse(decodeURIComponent(e.info));
} else if (e.type == 'edit') {
this.title = '修改地址';
this.siteType = 'edit';
}
if(e.name) {
this.name = decodeURIComponent(e.name);
}
if(e.mobile) {
this.mobile = decodeURIComponent(e.mobile);
}
if(e.address) {
this.address = decodeURIComponent(e.address);
}
if(e.region) {
let regionStr = decodeURIComponent(e.region);
this.region = regionStr.split('-')
}
}
},
onShow() {
......@@ -226,6 +238,7 @@ export default {
async submitForm() {
if (this.siteType === 'add') {
} else if (this.siteType === 'select') {
this.commitSite()
} else if (this.siteType === 'edit') {
if (this.$u.test.isEmpty(this.siteInfo)) {
let params = {
......@@ -244,6 +257,21 @@ export default {
}
}
},
commitSite() {
// 获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。
var pages = getCurrentPages();
var prevPage = pages[pages.length - 2]; //上一个页面
//prevPage.route获取上一页面的页面路径
let address = this.region.join("") + this.address
let site = {
name: this.name,
mobile: this.mobile,
address: address,
region: this.region
}
Utils.$emit("update-site", site)
this.$u.route({ type: 'back' });
}
}
};
......
<template>
<view class="address-wrap">
<w-navbar title="收货地址"></w-navbar>
<view class="item" v-if="hasAdderss" @tap="toAddSite('修改地址')">
<view class="top">
<view class="name">{{ settled.id_card_name || settled.nickname || settled.name || '--' }}</view>
<view class="phone">{{ settled.mobile }}</view>
</view>
<view class="bottom">
<view class="address">{{ settled.address }}</view>
<u-icon :name="editPen" :size="32" color="#999999"></u-icon>
</view>
<view class="default" v-show="true">
<u-icon name="checkmark-circle" color="#2272FF" size="32"></u-icon>
<text class="txt">默认地址</text>
</view>
<view class="body" v-if="hasAdderss">
<w-address @editSite="toAddSite" :info="address" :is-default="true" />
</view>
</view>
</template>
......@@ -39,6 +28,13 @@ export default {
hasAdderss() {
return this.settled && this.settled.address && this.settled.id_card_name
},
address() {
return {
name: this.settled.id_card_name || this.settled.nickname || this.settled.name,
mobile: this.settled.mobile,
address: this.settled.address
}
}
},
onLoad() {
getApp().trackPage('我的收获地址页')
......@@ -71,48 +67,10 @@ export default {
.address-wrap {
background-color: #F4F5F7;
}
.item {
.body {
padding: 30rpx;
margin: 30rpx;
padding: 50rpx 30rpx 48rpx 30rpx;
border-radius: 12rpx;
background-color: #FFFFFF;
border-radius: 12px;
.top {
display: flex;
font-size: 32rpx;
font-weight: bold;
color: #333333;
line-height: 32rpx;
.phone {
margin-left: 20rpx;
font-size: 28rpx;
font-weight: 400;
color: #666666;
}
}
.bottom {
display: flex;
margin-top: 24rpx;
justify-content: space-between;
align-items: flex-start;
font-size: 28rpx;
font-weight: 400;
color: #333333;
.address{
max-width: 500rpx;
line-height: 40rpx;
}
}
.default {
border-top: 2rpx solid #F4F5F7;
margin-top: 22rpx;
padding-top: 30rpx;
.txt {
margin-left: 12rpx;
font-size: 28rpx;
font-weight: 400;
color: #333333;
line-height: 28rpx;
}
}
}
</style>
......@@ -40,16 +40,7 @@
></u-subsection>
</view>
<view class="body">
<view class="item" @click="$u.throttle(editSite, 500)">
<view class="userinfo u-flex">
<view class="name">{{formatName}}</view>
<view class="mobile">{{formatMobile}}</view>
</view>
<view class="rangeinfo u-flex u-row-between u-col-top">
<view class="txt">{{formatAddress}}</view>
<u-icon custom-prefix="wxh" name="pen" size="32"></u-icon>
</view>
</view>
<w-address :info="addressInfo" @editSite="editSite" />
</view>
</view>
</view>
......@@ -60,6 +51,7 @@
</template>
<script>
import Utils from '@/utils/callUtils.js'
import SelectParts from '@/components/select-parts/adjust.vue'
export default {
components: {
......@@ -74,8 +66,12 @@ export default {
remark: '',
siteTypes: [{name: '我的地址'}, {name: '客户地址'}],
curType: 0,
mine: {},
customer: {},
mine: {
name: '', mobile: '', address: '', region: []
},
customer: {
name: '', mobile: '', address: '', region: []
},
};
},
computed: {
......@@ -92,78 +88,35 @@ export default {
fontWeight: 600,
}
},
formatName() {
let name = ''
if(this.curType) {
name = this.customer && this.customer.name
} else {
name = this.mine && this.mine.name
}
if(this.$u.test.isEmpty(name)) {
return '--'
}
return name
},
formatMobile() {
let mobile = ''
if(this.curType) {
mobile = this.customer && this.customer.mobile
} else {
mobile = this.mine && this.mine.mobile
}
if(this.$u.test.isEmpty(mobile)) {
return '--'
}
if(mobile.length == 11) {
let tmps = []
tmps[0] = mobile.slice(0, 3)
tmps[1] = mobile.slice(3, 7)
tmps[2] = mobile.slice(7)
return tmps.join(" ")
} else {
return mobile
}
},
formatAddress() {
let address = ''
if(this.curType) {
address = this.customer && this.customer.address
} else {
address = this.mine && this.mine.address
}
if(this.$u.test.isEmpty(address)) {
return '--'
}
return address
addressInfo() {
return this.curType ? this.customer : this.mine
},
},
onLoad(e) {
this.orderId = e && Number(e.orderId) || 0
this.initData()
},
mounted() {
Utils.$on('update-site',(site)=>{
this.updateSite(site);
})
},
methods: {
initData() {
this.loadMineAddress()
this.loadOrderInfo()
},
loadMineAddress() {
this.mine = {
name: '王先生',
mobile: '13045861456',
address: '宝城67区留芳路6号庭威产业园3栋10C',
range: ['广东省', '深圳市', '宝安区'],
code: ['44','4403','440306'],
}
this.mine.address = "广东省深圳市宝安区宝城67区留芳路6号庭威产业园3栋10C"
this.mine.region = ['广东省', '深圳市', '宝安区']
this.$u.api.getSiteAddress().then((res) => {
if(res.code == 200 && res.data) {
let name = this.vuex_settled && this.vuex_settled.record && (this.vuex_settled.record.id_card_name || this.vuex_settled.record.nickname)
let mobile = this.vuex_settled && this.vuex_settled.record && this.vuex_settled.record.mobile
this.mine = {
name: name,
mobile: mobile,
address: res.data.address,
range: [res.data.provinceName, res.data.cityName, res.data.districtName, res.data.streetName],
}
this.mine.address = res.data.address
this.mine.region = [
res.data.provinceName,
res.data.cityName,
res.data.districtName
]
}
})
},
......@@ -181,23 +134,25 @@ export default {
if(this.$u.test.isEmpty(this.order)) {
this.customer = {}
} else {
console.log("order", this.order)
const range = [
// this.mine.name = this.order.maintainWorkerName
// this.mine.mobile = this.order.maintainWorkerPhone
this.mine.name = '王先生'
this.mine.mobile = '13045861456'
const region = [
this.order.contactProvinceText,
this.order.contactCityText,
this.order.contactCommunityText,
this.order.contactStreetText,
]
this.customer = {
name: this.order.contactName,
mobile: this.order.contactPhone,
address: range.join("") + this.order.contactAddress,
range: range,
address: region.join("") + this.order.contactStreetText + this.order.contactAddress,
region: region,
code: [
this.order.contactProvince,
this.order.contactCity,
this.order.contactCommunity,
this.order.contactStreet,
]
}
}
......@@ -217,10 +172,28 @@ export default {
this.curType = index
},
editSite() {
let region = this.addressInfo.region.join('')
let address = this.addressInfo.address
if(this.$u.test.contains(address, region)) {
address = address.replace(region, '')
}
let params = {
type: 'select',
name: this.addressInfo.name,
mobile: this.addressInfo.mobile,
address: address,
region: this.addressInfo.region.join('-'),
code: this.addressInfo.code && this.addressInfo.code.join('-'),
};
console.log("editSite", params)
this.$u.route({
url: "pages/mine/address/addSite"
url: "pages/mine/address/addSite",
params: params
})
},
updateSite(site) {
console.log("updateSite", site)
},
addParts() {
this.$u.route({
url: "pages/parts/addParts"
......@@ -290,44 +263,17 @@ export default {
padding-top: -6rpx;
padding-bottom: 34rpx;
border-bottom: 2rpx solid #F4F5F7;
/deep/ .u-subsection {
width: 372rpx;
.u-item-bg {
border-radius: 32rpx !important;
}
}
// /deep/ .u-subsection {
// width: 372rpx;
// .u-item-bg {
// border-radius: 32rpx !important;
// }
// }
}
.body {
.item {
padding: 10rpx 0 52rpx 0;
.userinfo{
.name{
height: 92rpx;
font-size: 32rpx;
font-weight: bold;
color: #333333;
line-height: 92rpx;
}
.mobile {
margin-left: 20rpx;
height: 92rpx;
font-size: 28rpx;
font-weight: 400;
color: #666666;
line-height: 92rpx;
}
}
.rangeinfo {
.txt {
width: 500rpx;
font-size: 28rpx;
font-weight: 400;
color: #333333;
line-height: 34rpx;
word-wrap: break-word;
}
}
}
padding-top: 10rpx;
padding-bottom: 52rpx;
}
}
}
......
import Vue from 'vue'
export default new Vue
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment