parent
74a75e5c21
commit
ff8b5c137a
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,228 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, reactive } from 'vue'
|
||||||
|
const addressPopup2 = ref<UniHelper.UniPopupInstance>()
|
||||||
|
|
||||||
|
|
||||||
|
// 获取收货地址列表数据
|
||||||
|
const addressList = ref<AddressItem[]>([])
|
||||||
|
const getMemberAddressData = async () => {
|
||||||
|
|
||||||
|
const res = await new Promise((resolve, reject) => {
|
||||||
|
setTimeout(() => {
|
||||||
|
const dataList = [
|
||||||
|
{
|
||||||
|
'id': '1764537730823360514',
|
||||||
|
'receiver': '656',
|
||||||
|
'contact': '1',
|
||||||
|
'provinceCode': '120000',
|
||||||
|
'cityCode': '120100',
|
||||||
|
'countyCode': '120101',
|
||||||
|
'address': '22',
|
||||||
|
'isDefault': 1,
|
||||||
|
'fullLocation': '天津市 天津市 和平区',
|
||||||
|
'postalCode': null,
|
||||||
|
'addressTags': null
|
||||||
|
},
|
||||||
|
]
|
||||||
|
resolve(dataList)
|
||||||
|
}, 1000);
|
||||||
|
})
|
||||||
|
addressList.value = res
|
||||||
|
}
|
||||||
|
|
||||||
|
const show = ()=> {
|
||||||
|
addressPopup2.value?.open?.()
|
||||||
|
getMemberAddressData()
|
||||||
|
}
|
||||||
|
const hide = ()=> {
|
||||||
|
addressPopup2.value?.close?.()
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleDayChange = (e) => {
|
||||||
|
const idx = e.target.dataset.val
|
||||||
|
activeDayIndex.value = idx
|
||||||
|
}
|
||||||
|
const handleTimeChange = (e) => {
|
||||||
|
const idx = e.target.dataset.val
|
||||||
|
activeTimeIndex.value = idx
|
||||||
|
}
|
||||||
|
// 暴露方法给父组件
|
||||||
|
defineExpose({
|
||||||
|
show
|
||||||
|
})
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<uni-popup class="time-popup" :is-mask-click="false" ref="addressPopup2" type="bottom" background-color="#fff">
|
||||||
|
<view class="popup-root">
|
||||||
|
<view class="title">
|
||||||
|
<view class="text">取件地址</view>
|
||||||
|
<view class="close" @click="hide">X</view>
|
||||||
|
</view>
|
||||||
|
<!-- 地址列表 -->
|
||||||
|
<scroll-view enable-back-to-top class="scroll-view" scroll-y>
|
||||||
|
<view v-if="addressList.length" class="address">
|
||||||
|
<uni-swipe-action class="address-list">
|
||||||
|
<!-- 收货地址项 -->
|
||||||
|
<uni-swipe-action-item class="item" v-for="item in addressList" :key="item.id">
|
||||||
|
<view class="item-content" @tap="onChangeAddress(item)">
|
||||||
|
<view class="user">
|
||||||
|
{{ item.receiver }}
|
||||||
|
<text class="contact">{{ item.contact }}</text>
|
||||||
|
<text v-if="item.isDefault" class="badge">默认</text>
|
||||||
|
</view>
|
||||||
|
<view class="locate">{{ item.fullLocation }} {{ item.address }}</view>
|
||||||
|
<!-- H5 端需添加 .prevent 阻止链接的默认行为 -->
|
||||||
|
<navigator
|
||||||
|
class="edit"
|
||||||
|
hover-class="none"
|
||||||
|
:url="`/pagesMember/address-form/address-form?id=${item.id}`"
|
||||||
|
@tap.stop="() => {}"
|
||||||
|
@tap.prevent="() => {}"
|
||||||
|
>
|
||||||
|
修改
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
<!-- 右侧插槽 -->
|
||||||
|
<template #right>
|
||||||
|
<button @tap="onDeleteAddress(item.id)" class="delete-button">删除</button>
|
||||||
|
</template>
|
||||||
|
</uni-swipe-action-item>
|
||||||
|
</uni-swipe-action>
|
||||||
|
</view>
|
||||||
|
<view v-else class="blank">暂无收货地址</view>
|
||||||
|
</scroll-view>
|
||||||
|
<!-- 添加按钮 -->
|
||||||
|
<view class="add-btn">
|
||||||
|
<navigator hover-class="none" url="/pagesMember/address-form/address-form">
|
||||||
|
新建地址
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-popup>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.time-popup {
|
||||||
|
padding: 0 30rpx;
|
||||||
|
border-radius: 10rpx 10rpx 0 0;
|
||||||
|
position: relative;
|
||||||
|
background-color: #fff;
|
||||||
|
.title {
|
||||||
|
line-height: 1;
|
||||||
|
padding: 40rpx 20rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
border-bottom: 1rpx solid #ddd;
|
||||||
|
color: #444;
|
||||||
|
.close {
|
||||||
|
position: absolute;
|
||||||
|
right: 24rpx;
|
||||||
|
top: 40rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
page {
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 删除按钮 */
|
||||||
|
.delete-button {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 50px;
|
||||||
|
height: 100%;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 0;
|
||||||
|
padding: 0;
|
||||||
|
background-color: #cf4444;
|
||||||
|
}
|
||||||
|
|
||||||
|
.viewport {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100%;
|
||||||
|
background-color: #f4f4f4;
|
||||||
|
|
||||||
|
.scroll-view {
|
||||||
|
padding-top: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.address {
|
||||||
|
padding: 0 20rpx;
|
||||||
|
margin: 0 20rpx;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
|
||||||
|
.item-content {
|
||||||
|
line-height: 1;
|
||||||
|
padding: 40rpx 10rpx 38rpx;
|
||||||
|
border-bottom: 1rpx solid #ddd;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.edit {
|
||||||
|
position: absolute;
|
||||||
|
top: 36rpx;
|
||||||
|
right: 30rpx;
|
||||||
|
padding: 2rpx 0 2rpx 20rpx;
|
||||||
|
border-left: 1rpx solid #666;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #666;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:last-child .item-content {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user {
|
||||||
|
font-size: 28rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
color: #333;
|
||||||
|
|
||||||
|
.contact {
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
|
||||||
|
.badge {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 4rpx 10rpx 2rpx 14rpx;
|
||||||
|
margin: 2rpx 0 0 10rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #27ba9b;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
border: 1rpx solid #27ba9b;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.locate {
|
||||||
|
line-height: 1.6;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.blank {
|
||||||
|
margin-top: 300rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #888;
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-btn {
|
||||||
|
height: 80rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 80rpx;
|
||||||
|
margin: 30rpx 20rpx;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 80rpx;
|
||||||
|
font-size: 30rpx;
|
||||||
|
background-color: #27ba9b;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
@ -0,0 +1,13 @@
|
|||||||
|
import type { PageResult } from '@/types/global'
|
||||||
|
import { http } from '@/utils/http'
|
||||||
|
/**
|
||||||
|
* 获取订单列表
|
||||||
|
* @param data orderState 订单状态
|
||||||
|
*/
|
||||||
|
export const getListSiteAPI = (data: any) => {
|
||||||
|
return http<PageResult>({
|
||||||
|
method: 'POST',
|
||||||
|
url: `/recycle-station/page`,
|
||||||
|
data,
|
||||||
|
})
|
||||||
|
}
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 13 KiB |
Loading…
Reference in new issue