149 lines
3.4 KiB
Vue
149 lines
3.4 KiB
Vue
<template>
|
|
<uv-sticky
|
|
bgColor="#fff"
|
|
customNavHeight="0"
|
|
>
|
|
<uv-navbar
|
|
:fixed="false"
|
|
:title="title"
|
|
@leftClick="goBack"
|
|
/>
|
|
<uv-tabs
|
|
:list="navList"
|
|
@click="click"
|
|
lineColor="#f56c6c"
|
|
:current="actionType"
|
|
>
|
|
</uv-tabs>
|
|
</uv-sticky>
|
|
|
|
<view class="orderList">
|
|
<template v-if="!listEmpty">
|
|
<order
|
|
:data="item"
|
|
v-for="(item, index) in dataList"
|
|
:key="actionType + '_' + index"
|
|
@refresh="handleRefresh"
|
|
@pay="openPay"
|
|
/>
|
|
</template>
|
|
<Empty
|
|
:iconSrc="emptyOrderIcon"
|
|
v-else
|
|
>
|
|
您还没有相关订单~
|
|
</Empty>
|
|
<!-- 加载中 -->
|
|
<ListLoadLoading v-if="loading" />
|
|
<!-- 加载完毕-->
|
|
<ListLoadOver v-if="loadend" />
|
|
</view>
|
|
<!-- 支付弹窗 -->
|
|
<PayPopup
|
|
ref="payPopupRef"
|
|
@confirm="paySuccess"
|
|
/>
|
|
<ReturnTop :scroll-top="scrollTop" />
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, ref, unref } from 'vue'
|
|
import { onLoad, onPageScroll } from '@dcloudio/uni-app'
|
|
import { orderList } from '@/api/order'
|
|
import { useRouter } from "@/hooks/useRouter";
|
|
import ListLoadOver from "@/components/ListLoadOver/index.vue"
|
|
import ListLoadLoading from "@/components/ListLoadLoading/index.vue"
|
|
import Empty from '@/components/Empty/index.vue'
|
|
import { emptyOrderIcon } from "@/utils/images";
|
|
import PayPopup from '@/components/PayPopup/index.vue'
|
|
import { usePage } from "@/hooks";
|
|
import Header from "@/components/Header/index.vue"
|
|
import { getProductList } from "@/api/product";
|
|
import ReturnTop from "@/components/ReturnTop/index.vue";
|
|
import { useScroll } from "@/hooks/useScroll";
|
|
|
|
const {scrollTop} = useScroll()
|
|
const {type, refresh, dataList, loadend, loading, listEmpty} = usePage(orderList)
|
|
|
|
const {getParams, goBack, push} = useRouter()
|
|
|
|
const actionType = ref(0)
|
|
|
|
|
|
const navList = ref([
|
|
{name: "全部", value: -1,},
|
|
{name: "未支付", value: 0,},
|
|
{name: "待发货", value: 1,},
|
|
{name: "待收货", value: 2,},
|
|
{name: "待评价", value: 3,},
|
|
{name: "已完成", value: 4,},
|
|
// { name: "退款中", value: 5, },
|
|
// { name: "已退款", value: 6, },
|
|
// { name: "退款", value: 7, },
|
|
])
|
|
|
|
const title = computed(() => {
|
|
const find = navList.value.find(item => item.value === type.value);
|
|
return find ? `${ find.name }订单` : '订单'
|
|
})
|
|
|
|
|
|
// const handleOrderList = async (option) => {
|
|
// orderListData.value = []
|
|
// orderListData.value = await orderList(option)
|
|
// orderListData.value.forEach(item => {
|
|
// item.status = item.paid === 1 && item.status === 0 ? 99 : item.status
|
|
// })
|
|
// }
|
|
|
|
const handleRefresh = () => {
|
|
// 确认收货
|
|
if (actionType.value === 2) {
|
|
actionType.value++
|
|
type.value++
|
|
}
|
|
refresh()
|
|
}
|
|
|
|
|
|
const click = (data) => {
|
|
type.value = data.value
|
|
refresh()
|
|
}
|
|
|
|
// ============================== 支付相关 ===============================
|
|
const payPopupRef = ref()
|
|
|
|
function openPay(orderId) {
|
|
unref(payPopupRef).show(orderId)
|
|
}
|
|
|
|
function paySuccess() {
|
|
push({url: '/pages/payStatus/index'}, {})
|
|
}
|
|
|
|
|
|
onLoad((options) => {
|
|
const params = getParams(options)
|
|
type.value = params.type
|
|
refresh()
|
|
if (Number(type.value < 0)) {
|
|
actionType.value = 0
|
|
return
|
|
}
|
|
actionType.value = type.value + 1
|
|
})
|
|
|
|
|
|
onPageScroll((e)=>{
|
|
})
|
|
|
|
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.orderList {
|
|
padding: 20rpx 0;
|
|
}
|
|
</style>
|