mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-uniapp.git
synced 2025-12-18 08:25:55 +08:00
commit message
This commit is contained in:
Chopper
329
pages/mine/address/addressManage.vue
Normal file
329
pages/mine/address/addressManage.vue
Normal file
@@ -0,0 +1,329 @@
|
||||
<template>
|
||||
<view class="address">
|
||||
<view class="bar"></view>
|
||||
<empty v-if="empty"></empty>
|
||||
<view class="list" v-else>
|
||||
<view class="item c-content" v-for="(item, index) in addressList" :key="index">
|
||||
|
||||
<view class="basic">
|
||||
<text>{{ item.name }}</text>
|
||||
<text>{{ item.mobile }}</text>
|
||||
<text class="default" v-show="item.isDefault">默认</text>
|
||||
<view>
|
||||
<div class="region">
|
||||
<span v-if="item.consigneeAddressPath[0]">{{
|
||||
item.consigneeAddressPath[0]
|
||||
}}</span>
|
||||
<span v-if="item.consigneeAddressPath[1]">{{
|
||||
item.consigneeAddressPath[1]
|
||||
}}</span>
|
||||
<span v-if="item.consigneeAddressPath[2]">{{
|
||||
item.consigneeAddressPath[2]
|
||||
}}</span>
|
||||
|
||||
<span v-if="item.consigneeAddressPath[3]">{{
|
||||
item.consigneeAddressPath[3]
|
||||
}}</span>
|
||||
<span>
|
||||
{{ item.detail }}
|
||||
</span>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<view class="edit">
|
||||
<view class="relative" @click="setDefault(item)">
|
||||
<view v-if="item.isDefault" class="alifont icon-xuanzhong"></view>
|
||||
<text v-else class="unchecked"></text>
|
||||
<text>{{ item.isDefault ? "默认地址" : "设为默认" }}</text>
|
||||
</view>
|
||||
<view class="relative">
|
||||
<view class="alifont icon-bianji-copy"></view>
|
||||
<text class="mr-40" @click="addAddress(item.id)">编辑</text>
|
||||
<view class="alifont icon-lajitong"></view>
|
||||
<text @click="delAddress(item.id)">删除</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="height: 100px"></view>
|
||||
</view>
|
||||
|
||||
<button type="default" class="btn" @click="addAddress('')">
|
||||
<u-icon name="plus-circle"></u-icon>
|
||||
添加新收货人
|
||||
</button>
|
||||
|
||||
<u-action-sheet :list="delList" :tips="tips" v-model="showAction" @click="deleteAddressMessage"></u-action-sheet>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as API_Trade from "@/api/trade";
|
||||
import * as API_Address from "@/api/address.js";
|
||||
import storage from "@/utils/storage.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
activeClass: "activeClass",
|
||||
addressList: [],
|
||||
showAction: false,
|
||||
empty: false,
|
||||
delList: [
|
||||
{
|
||||
text: "确定",
|
||||
},
|
||||
],
|
||||
tips: {
|
||||
text: "确定要删除该收货人信息吗？",
|
||||
},
|
||||
delId: "",
|
||||
addid: "",
|
||||
routerVal: "",
|
||||
params: {
|
||||
pageNumber: 1,
|
||||
pageSize: 1000,
|
||||
},
|
||||
};
|
||||
},
|
||||
// 返回上一级
|
||||
onBackPress(e) {
|
||||
uni.switchTab({
|
||||
url: "/pages/tabbar/user/my",
|
||||
});
|
||||
return true;
|
||||
},
|
||||
onLoad: function (val) {
|
||||
this.routerVal = val;
|
||||
},
|
||||
onShow() {
|
||||
let userInfo = storage.getUserInfo();
|
||||
|
||||
if (userInfo && userInfo.id) {
|
||||
this.getAddressList();
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
this.getAddressList();
|
||||
uni.stopPullDownRefresh();
|
||||
},
|
||||
methods: {
|
||||
//获取地址列表
|
||||
getAddressList() {
|
||||
uni.showLoading();
|
||||
|
||||
API_Address.getAddressList(
|
||||
this.params.pageNumber,
|
||||
this.params.pageSize
|
||||
).then((res) => {
|
||||
if (res.data.result.records.length == 0) {
|
||||
this.empty = true;
|
||||
} else {
|
||||
res.data.result.records.forEach((item) => {
|
||||
item.consigneeAddressPath = item.consigneeAddressPath.split(",");
|
||||
});
|
||||
|
||||
this.addressList = res.data.result.records;
|
||||
}
|
||||
uni.hideLoading();
|
||||
});
|
||||
},
|
||||
//删除地址
|
||||
delAddress(id) {
|
||||
this.delId = id;
|
||||
this.showAction = true;
|
||||
},
|
||||
deleteAddressMessage() {
|
||||
API_Address.deleteAddress(this.delId).then((res) => {
|
||||
if (res.statusCode == 200) {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "删除成功",
|
||||
});
|
||||
this.getAddressList();
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: res.data.message,
|
||||
duration: 2000,
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
//新建。编辑地址
|
||||
addAddress(id) {
|
||||
if (id) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/mine/address/add?id=" + id,
|
||||
});
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/mine/address/add",
|
||||
});
|
||||
}
|
||||
},
|
||||
//设为默认地址
|
||||
setDefault(item) {
|
||||
delete item.updateBy;
|
||||
delete item.updateTime;
|
||||
delete item.deleteFlag;
|
||||
|
||||
item.isDefault ? "" : (item.isDefault = !item.isDefault);
|
||||
|
||||
API_Address.editAddress(item).then((res) => {
|
||||
uni.showToast({
|
||||
title: "设置默认地址成功",
|
||||
icon: "none",
|
||||
});
|
||||
this.getAddressList();
|
||||
});
|
||||
},
|
||||
|
||||
// 地址id
|
||||
addId(params) {
|
||||
API_Trade.setAddressId(params.address_id).then((res) => {});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.active {
|
||||
background: #f19736;
|
||||
}
|
||||
|
||||
.alifont {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.region {
|
||||
span {
|
||||
margin: 0 4rpx !important;
|
||||
}
|
||||
}
|
||||
.address {
|
||||
.bar {
|
||||
height: 20rpx;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
background: url("/pages/floor/imgs/line.png") no-repeat;
|
||||
background-size: 100%;
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 0;
|
||||
transform: scale(1, 0.8);
|
||||
}
|
||||
.default {
|
||||
border: 1px solid #ff6262;
|
||||
color: #ff6262;
|
||||
font-size: 22rpx;
|
||||
border-radius: 6rpx;
|
||||
align-self: center;
|
||||
padding: 2rpx 20rpx;
|
||||
}
|
||||
.list {
|
||||
.item {
|
||||
margin-top: 20rpx;
|
||||
font-size: $font-base;
|
||||
color: #666;
|
||||
|
||||
.basic {
|
||||
padding: 30rpx;
|
||||
line-height: 1.5em;
|
||||
border-bottom: 1px solid $border-color-light;
|
||||
|
||||
:nth-child(2) {
|
||||
margin: 0 20rpx;
|
||||
}
|
||||
|
||||
:nth-child(4) {
|
||||
color: $font-color-light;
|
||||
font-size: $font-sm;
|
||||
|
||||
margin-top: 10rpx;
|
||||
|
||||
text:nth-child(2) {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
view {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.edit {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
vertical-align: middle;
|
||||
height: 80rpx;
|
||||
font-size: $font-sm;
|
||||
color: $font-color-light;
|
||||
padding: 0 30rpx;
|
||||
|
||||
.unchecked {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
border-radius: 50%;
|
||||
border: 1px solid #e0e0e0;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: 8rpx;
|
||||
position: relative;
|
||||
top: -2rpx;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
view:nth-child(1) {
|
||||
view:nth-child(1) {
|
||||
font-size: $font-base;
|
||||
color: $main-color;
|
||||
margin-right: 8rpx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
view:nth-child(2) {
|
||||
text {
|
||||
margin-left: 5rpx;
|
||||
}
|
||||
|
||||
.alifont {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.icon-bianji-copy {
|
||||
font-size: 28rpx;
|
||||
position: relative;
|
||||
top: 2rpx;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.icon-lajitong {
|
||||
position: relative;
|
||||
top: 4rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.mr-40 {
|
||||
margin-right: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
background: $light-color;
|
||||
position: fixed;
|
||||
width: 690rpx;
|
||||
bottom: 60rpx;
|
||||
height: 80rpx;
|
||||
left: 30rpx;
|
||||
font-size: 30rpx;
|
||||
line-height: 80rpx;
|
||||
|
||||
.u-icon {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user