162 lines
5.0 KiB
Vue
162 lines
5.0 KiB
Vue
<template>
|
||
<view class="main">
|
||
<view class="order_nav">
|
||
<view class="order_nav_item" v-for="(item,index) in tab" :key="index" :class="active == index?'order_nav_active':''" @click="clickOrder(index)">
|
||
<view class="order_nav_name">{{item}}</view>
|
||
<view class="order_nav_m"></view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="cont">
|
||
<view v-for="(item,index) in list" :key="index" class="order_list" @click="assDetail(item)">
|
||
<view class="order_type" v-if="active == 1">{{item.returntext}}</view>
|
||
<view class="order_time">下单时间:{{item.createTime}}</view>
|
||
<view class="order_scroll">
|
||
<scroll-view class="order_scroll_ul" :scroll-with-animation="true" :enhanced="true" :show-scrollbar="false" scroll-x="true">
|
||
<block v-if="active == 0">
|
||
<view class="order_scroll_li" v-for="(i,idx) in item.orderInfoList" :key="index">
|
||
<view class="order_scroll_img">
|
||
<image class="order_scroll_img_url" :src="i.image" mode="widthFix"></image>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
<block v-if="active == 1">
|
||
<view class="order_scroll_li" v-for="(i,idx) in item.returnInfoList" :key="index">
|
||
<view class="order_scroll_img">
|
||
<image class="order_scroll_img_url" :src="i.image" mode="widthFix"></image>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
</scroll-view>
|
||
</view>
|
||
<view class="order_x">
|
||
<block v-if="active == 1">共售后{{item.returnNum}}件、</block>
|
||
<block v-if="active == 0">共{{item.totalNum}}件、</block>
|
||
{{active == 1 ?'退款金额':'实付'}}:
|
||
<text class="order_price">{{active == 1?item.returnAmount:item.payPrice}}</text>
|
||
</view>
|
||
<view class="order_bottom" v-if="active == 0">
|
||
<view class="order_l"></view>
|
||
<view class="order_r">
|
||
<view class="order_btn" @click.stop="assDetail(item)">申请售后</view>
|
||
</view>
|
||
</view>
|
||
</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>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import NP from 'number-precision';
|
||
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 { returncanApplyOrderList,returnapplyRecordsList } from "@/server/api.js"
|
||
const counterStore = useCounterStore(); // 使用 Store
|
||
const { proxy } = getCurrentInstance();
|
||
//使用pinia：storeToRefs方法包裹(保持响应式更新，不使用视图无法更新)
|
||
const {statusHeight,headerHeight,statusBartop } = storeToRefs(counterStore);
|
||
const tab = ref(['售后申请','售后记录']);
|
||
const active = ref(0);
|
||
const list =ref([]);
|
||
const decs = ref('');
|
||
const pages = ref(0);
|
||
const type = ref("");
|
||
const img_err = ref("");
|
||
const clickOrder=(index)=>{
|
||
if(index == active.value) return false;
|
||
active.value = index;
|
||
list.value = [];
|
||
decs.value = '';
|
||
pages.value = 0;
|
||
api_orderlist();
|
||
};
|
||
const api_orderlist=()=>{
|
||
pages.value = pages.value + 1;
|
||
img_err.value = "";
|
||
decs.value = "—— 加载中... ——";
|
||
const params = {
|
||
page:pages.value,
|
||
limit:'10'
|
||
}
|
||
let url = "";
|
||
if(active.value == 1){
|
||
url = returnapplyRecordsList
|
||
}else{
|
||
url = returncanApplyOrderList
|
||
}
|
||
return url(params).then(({data}) => {
|
||
decs.value = '—— 上拉加载更多 ——';
|
||
|
||
data.list.forEach(item => {
|
||
if(active.value == 1){
|
||
if(item.returnState == 1){
|
||
item.returntext = "退款审核中"
|
||
}else if(item.returnState == 2){
|
||
item.returntext = "审核通过"
|
||
}else if(item.returnState == 3){
|
||
item.returntext = "审核拒绝"
|
||
}else{
|
||
item.returntext = "退款失败"
|
||
}
|
||
}
|
||
if(active.value == 0){
|
||
item.totalNum = item.orderInfoList.reduce((sum, i) => sum + i.cartNum, 0);
|
||
}
|
||
})
|
||
list.value = list.value.concat(data.list);
|
||
if(pages.value == 1 && !data.list.length){
|
||
img_err.value = "../../static/Empty/order_lisr_img.png"
|
||
decs.value = "—— 暂无售后记录 ——"
|
||
}else if(data.list.length < 10){
|
||
decs.value = '—— 嗷呜，已经到底啦 ——';
|
||
}
|
||
}).catch(({message}) => {
|
||
img_err.value = "../../static/Empty/err.png"
|
||
decs.value = `—— ${message||'网络异常'} ——`;
|
||
})
|
||
}
|
||
|
||
const assDetail=(item)=>{
|
||
if(active.value == 0){
|
||
uni.navigateTo({
|
||
url:`/order/assedit/assedit?orderId=${item.orderId}`
|
||
})
|
||
}else{
|
||
uni.navigateTo({
|
||
url:`/order/assDetail/assDetail?id=${item.id}`
|
||
})
|
||
}
|
||
|
||
};
|
||
onLoad((options) => {
|
||
if(options.type == 0 || options.type == 1){
|
||
active.value = options.type;
|
||
}
|
||
api_orderlist();
|
||
});
|
||
onShow(() => {});
|
||
onReady(()=>{})
|
||
onPullDownRefresh(()=>{
|
||
list.value = [];
|
||
decs.value = '';
|
||
pages.value = 0;
|
||
api_orderlist();
|
||
uni.stopPullDownRefresh();
|
||
})
|
||
onReachBottom(()=>{
|
||
api_orderlist();
|
||
})
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
@import './style.scss';
|
||
</style> |