168 lines
4.6 KiB
Vue
168 lines
4.6 KiB
Vue
<template>
|
||
<view class="main">
|
||
<view class="location_cont location_padding" v-if="list.length">
|
||
<uni-swipe-action>
|
||
<uni-swipe-action-item v-for="(item,index) in list" :key="index" :right-options="options" @click="removeCart(item)">
|
||
<view class="location_list flex" :class="index != list.length - 1?'location_border':''" @click.stop="select_address(item)">
|
||
<view class="location_l">
|
||
<view class="location_address">
|
||
<text class="location_default" v-if="item.isDefault">默认</text>
|
||
<text class="location_address_text">{{item.province+item.city+item.district+item.detail}}</text>
|
||
</view>
|
||
<view class="location_user"><text class="location_user_name">{{item.realName}}</text><text class="location_user_tel">{{item.phone}}</text></view>
|
||
</view>
|
||
<view class="location_r" @click.stop="revamp(item)">
|
||
<image class="location_img" src="../../static/userserve/edit.png"></image>
|
||
</view>
|
||
</view>
|
||
</uni-swipe-action-item>
|
||
</uni-swipe-action>
|
||
</view>
|
||
<view class="empty" v-if="img_err && decs">
|
||
<view class="empty_cont">
|
||
<image class="empty_cont_img" :src="img_err" mode="widthFix"></image>
|
||
<view class="empty_cont_title">{{decs}}</view>
|
||
</view>
|
||
</view>
|
||
<view v-else class="load_desc">{{decs}}</view>
|
||
<view style="height: 200rpx;"></view>
|
||
<view class="footer">
|
||
<view class="footer_btn" @click="addressEdit">新增地址</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { computed,ref,onMounted,onUnmounted,getCurrentInstance,nextTick } from 'vue';
|
||
import { useCounterStore } from '@/store/counter'; // 引入 Pinia Store
|
||
import { storeToRefs } from 'pinia';//实现解构付值
|
||
import { onLoad,onShow,onPullDownRefresh,onPageScroll,onReachBottom,onReady } from "@dcloudio/uni-app"
|
||
import { addresslist,addressdel,defaultset } from "@/server/api.js"
|
||
const counterStore = useCounterStore(); // 使用 Store
|
||
const { proxy } = getCurrentInstance();
|
||
//使用pinia：storeToRefs方法包裹(保持响应式更新，不使用视图无法更新)
|
||
const {statusHeight,headerHeight,statusBartop } = storeToRefs(counterStore);
|
||
const pages = ref(0);
|
||
const limits = ref(10);
|
||
const decs = ref('');
|
||
const list = ref([]);
|
||
const address_isDefault = ref(false);
|
||
const img_err = ref("");
|
||
const options = ref([
|
||
{
|
||
text: '删除',
|
||
style: {
|
||
backgroundColor: '#FD4955'
|
||
}
|
||
}
|
||
]);
|
||
const api_addresslist=()=>{
|
||
pages.value = pages.value + 1;
|
||
img_err.value = "";
|
||
decs.value = "—— 加载中... ——";
|
||
const params = {
|
||
page:pages.value,
|
||
limit:limits.value
|
||
}
|
||
return addresslist(params).then(({data}) => {
|
||
decs.value = '—— 上拉加载更多 ——'
|
||
list.value = list.value.concat(data.list);
|
||
if(pages.value == 1 && !data.list.length){
|
||
img_err.value = "../../static/Empty/addressImg.png"
|
||
decs.value = "—— 暂无地址 ——"
|
||
}else if(data.list.length < 10){
|
||
decs.value = '—— 嗷呜，已经到底啦 ——';
|
||
}
|
||
}).catch(({message}) => {
|
||
img_err.value = "../../static/Empty/err.png"
|
||
decs.value = `—— ${message||'网络异常'} ——`;
|
||
})
|
||
}
|
||
const select_address=(item)=>{
|
||
if(!address_isDefault.value) return false;
|
||
const params = {
|
||
id:item.id
|
||
}
|
||
return defaultset(params).then(({message}) => {
|
||
uni.showToast({
|
||
title:message,
|
||
icon:'success',
|
||
success: () => {
|
||
setTimeout(()=>{
|
||
uni.navigateBack({
|
||
delta:1
|
||
})
|
||
},1400)
|
||
}
|
||
})
|
||
}).catch(({message}) => {
|
||
uni.showModal({
|
||
content:message,
|
||
showCancel: false
|
||
})
|
||
})
|
||
}
|
||
const addressEdit=()=>{
|
||
uni.navigateTo({
|
||
url:`/userserve/addressEdit/addressEdit`
|
||
})
|
||
};
|
||
const revamp=(item)=>{
|
||
const { id } = item;
|
||
uni.navigateTo({
|
||
url:`/userserve/addressEdit/addressEdit?ids=${id}&edits=true`
|
||
})
|
||
}
|
||
const removeCart=(e)=>{
|
||
const params = {
|
||
id:e.id
|
||
}
|
||
return addressdel(params).then(({message}) => {
|
||
uni.showToast({
|
||
title:message,
|
||
icon:'success',
|
||
success: () => {
|
||
setTimeout(()=>{
|
||
list.value = list.value.filter(item => item.id !== e.id);
|
||
},1400)
|
||
}
|
||
})
|
||
}).catch(({message}) => {
|
||
uni.showModal({
|
||
content:message,
|
||
showCancel: false
|
||
})
|
||
})
|
||
}
|
||
onLoad((options) => {
|
||
const { address_isDefaults } = options;
|
||
if(address_isDefaults){
|
||
address_isDefault.value = address_isDefaults;
|
||
}
|
||
|
||
});
|
||
onShow(() => {
|
||
list.value = [];
|
||
decs.value = '';
|
||
pages.value = 0;
|
||
api_addresslist();
|
||
});
|
||
onReady(()=>{})
|
||
onPullDownRefresh(()=>{
|
||
list.value = [];
|
||
decs.value = '';
|
||
pages.value = 0;
|
||
api_addresslist();
|
||
uni.stopPullDownRefresh();
|
||
})
|
||
onReachBottom(()=>{
|
||
api_addresslist();
|
||
})
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
@import './style.scss';
|
||
.uni-swipe_box{
|
||
padding: 0rpx 30rpx 0rpx 30rpx !important;
|
||
}
|
||
</style> |