商城类、订单类uniapp模板,多角色
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

213 lines
3.9 KiB

<template>
<view class="address">
<navbar title="地址管理" leftClick @leftClick="leftClick" />
<view class="address-list">
<addressList
controls
ref="addressList"
@deleteAddress="deleteAddress"
@editAddress="editAddress"
@editDefault="editDefault"/>
</view>
<redactAddress
ref="addressPopup"
:addressDetail="addressDetail"
@saveOrUpdate="saveOrUpdate"
:title="title"></redactAddress>
<view class="add-btn">
<view @click="addBtn" class="btn">
新增地址
</view>
</view>
</view>
</template>
<script>
import redactAddress from '../components/address/redactAddress.vue'
import addressList from '../components/address/addressList.vue'
export default {
components: {
redactAddress,
addressList
},
data() {
return {
title: '新增地址',
type : '',
}
},
onLoad(args) {
this.type = args.type
if(this.type == 'back'){
this.addBtn()
}
},
onShow() {
this.getAddressList()
},
methods: {
//获取地址列表
getAddressList() {
this.$refs.addressList.getAddressList()
},
//获取地址详情
editAddress(address) {
this.$refs.addressPopup.open({...address})
},
//返回个人中心
leftClick() {
uni.navigateBack(-1)
},
//添加和修改地址
saveOrUpdate(addressDetail) {
let data = {
name: addressDetail.name,
phone: addressDetail.phone,
address: addressDetail.address,
addressDetail: addressDetail.addressDetail,
defaultId: addressDetail.defaultId || '0',
latitude: addressDetail.latitude,
longitude: addressDetail.longitude
}
if (addressDetail.id) {
data.id = addressDetail.id
}
this.$api(data.id ? 'addressEdit' : 'addressAdd', data, res => {
if (res.code == 200) {
this.$refs.addressPopup.close()
this.getAddressList()
if(this.type == 'back'){
uni.navigateBack(-1)
}
uni.showToast({
title: '操作成功',
icon: 'none'
})
}
})
},
//修改默认地址
editDefault(id) {
this.$api('addressDefault', {
id: id,
}, res => {
if (res.code == 200) {
this.$refs.addressPopup.close()
uni.showToast({
title: '操作成功',
icon: 'none'
})
this.getAddressList()
}
})
},
//删除地址
deleteAddress(id) {
let self = this
uni.showModal({
title: '删除地址',
content: '确认删除此地址?删除后数据不可恢复',
success(e) {
if(e.confirm){
self.$api('addressDelete', {
id
}, res => {
if (res.code == 200) {
uni.showToast({
title: '删除成功',
icon: 'none'
})
self.getAddressList()
}
})
}
}
})
},
//点击新增按钮
addBtn() {
this.title = '新增地址'
this.$refs.addressPopup.open({ //初始化数据
name: '',
phone: '',
address: '',
addressDetail: '',
defaultId: '',
latitude: '',
longitude: ''
})
},
}
}
</script>
<style lang="scss" scoped>
.address {
width: 750rpx;
margin: 0rpx auto;
background: #F5F5F5;
box-sizing: border-box;
min-height: 100vh;
.address-list {
padding: 40rpx 20rpx 120rpx 20rpx;
}
.add-btn {
position: fixed;
display: flex;
justify-content: center;
align-items: center;
left: 0;
bottom: 0;
width: 750rpx;
height: 100rpx;
background: white;
.btn {
display: flex;
align-items: center;
justify-content: center;
width: 85%;
height: 80rpx;
border-radius: 40rpx;
color: white;
text-align: center;
font-size: 28rpx;
background: $uni-color;
}
}
}
@media all and (min-width: 961px) {
.add-btn {
left: 50% !important;
transform: translateX(-50%);
}
}
//选择位置地图样式
:deep(.uni-system-choose-location) {
z-index: 99999 !important;
}
</style>