add:管理端
This commit is contained in:
@@ -0,0 +1,359 @@
|
||||
<template>
|
||||
<div class="order_list_container">
|
||||
<view class="nav_bar_box">
|
||||
<nut-navbar :safe-area-inset-top="true" :custom-color="'#312D22'" :fixed="true" class="test"
|
||||
@click-back="goLogin">
|
||||
<template #left class="hometitle">
|
||||
<!-- <div @click="goLogin"> -->
|
||||
管理后台
|
||||
<!-- </div> -->
|
||||
</template>
|
||||
</nut-navbar>
|
||||
</view>
|
||||
<nut-tabs v-model="state.tab11value" type="smile" @change="changeTable">
|
||||
<nut-tab-pane v-for="item in list" :key="item.id" :title="`${item.value}`" :pane-key="item.id">
|
||||
<template #default>
|
||||
<scroll-view :scroll-top="scrollTop" class="scroll-Y" :style="{ height: scroll_list_height + 'px' }"
|
||||
:refresher-enable="true" :refresher-enabled="isOpenRefresh" :scroll-y="true"
|
||||
:refresher-triggered="triggered" :refresher-threshold="100" @scrolltolower="lower"
|
||||
@refresherrefresh="onRefresh" @refresherpulling="onPulling" :key="refreshKey">
|
||||
|
||||
<div v-for="(order, index) in showOrderList" :key="index"
|
||||
v-if="showOrderList && showOrderList.length > 0">
|
||||
<order-item @tap="handlegotoinfo(order)" :orderId="order?.id || 0"
|
||||
:title="order?.name || ''" :serverTime="order?.serviceTime || ''"
|
||||
:ordertime="order?.createTime || ''" :uid="order?.uid || ''"
|
||||
:cardtype="order?.dispatchStatus || 0" :imgUrl="order?.headImgUrl || ''"
|
||||
@petList="handPetlist(order)"></order-item>
|
||||
<div style="height: 20rpx;"></div>
|
||||
</div>
|
||||
<div v-else class="no-data">
|
||||
<div class="content">
|
||||
<img src="../../static/images/petdefault.png" alt="" class="no-img">
|
||||
<div class="msg">暂无订单</div>
|
||||
</div>
|
||||
</div>
|
||||
</scroll-view>
|
||||
</template>
|
||||
</nut-tab-pane>
|
||||
</nut-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import orderItem from '../../components/orderItem'
|
||||
import {
|
||||
reactive,
|
||||
ref,
|
||||
getCurrentInstance,
|
||||
watch, nextTick
|
||||
} from 'vue'
|
||||
|
||||
import {
|
||||
onReady,
|
||||
onShow,
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app'
|
||||
import {
|
||||
useSystemInfo,
|
||||
useUserInfo
|
||||
} from '@/store'
|
||||
import {
|
||||
orderList,
|
||||
} from '../../api/orders'
|
||||
import {
|
||||
systemConfigInfo
|
||||
} from '../../api/system'
|
||||
|
||||
|
||||
const userInfo = useUserInfo()
|
||||
const systemInfo = useSystemInfo()
|
||||
const scroll_list_height = systemInfo.getscreenheight - systemInfo.getnavbarheight - 46
|
||||
const orderDetails = ref([])
|
||||
const orderCancel = ref([]) //已取消
|
||||
const orderStayService = ref([]) //待服务
|
||||
const orderService = ref([]) //服务中
|
||||
const orderOver = ref([]) //已完成
|
||||
const phoneNumber = ref(0)
|
||||
const isLogin = ref(false)
|
||||
const _freshing = ref(false)
|
||||
const triggered = ref(false)
|
||||
const timeconfig = ref(null)
|
||||
const isOpenRefresh = ref(true)
|
||||
|
||||
const list = [{
|
||||
"id": '0',
|
||||
"value": '全部'
|
||||
},
|
||||
{
|
||||
"id": '1',
|
||||
"value": '待服务'
|
||||
},
|
||||
{
|
||||
"id": '2',
|
||||
"value": '服务中'
|
||||
},
|
||||
{
|
||||
"id": '3',
|
||||
"value": '已完成'
|
||||
},
|
||||
{
|
||||
"id": '4',
|
||||
"value": '已取消'
|
||||
},
|
||||
]
|
||||
|
||||
// 上下文
|
||||
const {
|
||||
ctx
|
||||
} = getCurrentInstance()
|
||||
|
||||
const state = reactive({
|
||||
tab11value: '0',
|
||||
});
|
||||
|
||||
const showOrderList = ref([])
|
||||
const refreshKey = ref(0)
|
||||
|
||||
// 监听数据变化
|
||||
watch(showOrderList, (newVal) => {
|
||||
console.log('订单列表更新，数量:', newVal.length)
|
||||
// 数据变化后强制刷新scroll-view
|
||||
refreshKey.value++
|
||||
}, { deep: true })
|
||||
|
||||
|
||||
const params = reactive({
|
||||
orderStatus: 0,
|
||||
pageNum: 0,
|
||||
pageSize: 10,
|
||||
uid: userInfo.uid
|
||||
})
|
||||
function changeTable() {
|
||||
// 1待服务orderStayService 2服务中orderService 3已完成orderOver 4已取消orderCancel
|
||||
showOrderList.value = []
|
||||
if (state.tab11value == 0) {
|
||||
showOrderList.value = orderDetails.value;
|
||||
} else if (state.tab11value == 1) {
|
||||
showOrderList.value = orderStayService.value
|
||||
} else if (state.tab11value == 2) {
|
||||
showOrderList.value = orderService.value
|
||||
} else if (state.tab11value == 3) {
|
||||
showOrderList.value = orderOver.value
|
||||
} else if (state.tab11value == 4) {
|
||||
showOrderList.value = orderCancel.value
|
||||
}
|
||||
}
|
||||
|
||||
function init(isadd) {
|
||||
const paramsData = {
|
||||
orderStatus: params.orderStatus,
|
||||
pageNum: params.pageNum,
|
||||
pageSize: params.pageSize,
|
||||
uid: userInfo.getUid
|
||||
}
|
||||
console.log(paramsData, '--------------2')
|
||||
try {
|
||||
orderList(paramsData).then(res => {
|
||||
if (res.content) {
|
||||
var data = res.content || []
|
||||
if (data.length > 0) {
|
||||
for (let i in data) {
|
||||
data[i].createTime = data[i].createTime.split(' ')[0] + ' ' + data[i].createTime.split(
|
||||
' ')[1]
|
||||
}
|
||||
}
|
||||
orderDetails.value = [...data]
|
||||
// 1待服务 2服务中 3已完成 4已取消
|
||||
orderStayService.value = orderStayService.value.concat(data.filter(x => x.orderStatus === 1))
|
||||
orderService.value = orderService.value.concat(data.filter(x => x.orderStatus === 2))
|
||||
orderOver.value = orderOver.value.concat(data.filter(x => x.orderStatus === 3))
|
||||
orderCancel.value = orderCancel.value.concat(data.filter(x => x.orderStatus === 4))
|
||||
|
||||
if (isadd) {
|
||||
showOrderList.value = [...showOrderList.value, ...orderDetails.value]
|
||||
} else {
|
||||
showOrderList.value = Array.isArray(orderDetails.value) ? [...orderDetails.value] : []
|
||||
changeTable()
|
||||
}
|
||||
// 创建新数组引用
|
||||
// showOrderList.value = Array.isArray(orderDetails.value) ? [...orderDetails.value] : []
|
||||
// 强制刷新scroll-view
|
||||
nextTick()
|
||||
refreshKey.value++
|
||||
}
|
||||
})
|
||||
systemConfigInfo({}).then(res => {
|
||||
if (res.code === 200) {
|
||||
phoneNumber.value = res.data.systemInfos.find(x => x.name === '客服电话')
|
||||
}
|
||||
})
|
||||
} catch (error) {
|
||||
console.error('加载订单失败:', error)
|
||||
showOrderList.value = []
|
||||
}
|
||||
}
|
||||
|
||||
onShow(() => {
|
||||
console.log(userInfo, '>>>>>>>userInfo')
|
||||
isLogin.value = userInfo.getToken === 0 ? false : true
|
||||
if (!isLogin.value) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/index'
|
||||
})
|
||||
} else {
|
||||
init(false);
|
||||
}
|
||||
if (typeof ctx.$scope.getTabBar === 'function' && ctx.$scope.getTabBar()) {
|
||||
ctx.$scope.getTabBar().setData({
|
||||
// 当前页面对应的tab index
|
||||
selected: 0,
|
||||
})
|
||||
}
|
||||
})
|
||||
onLoad((e) => {
|
||||
state.tab11value = e?.index !== undefined ? e?.index : '0'
|
||||
|
||||
// init()
|
||||
// console.log(userInfo,'>>>>>>>>index>>>>>>',userInfo.getToken)
|
||||
// isLogin.value = userInfo.getToken === 0 ? false : true
|
||||
// if (!isLogin.value) {
|
||||
// uni.navigateTo({
|
||||
// url: '/pages/login/index'
|
||||
// })
|
||||
// } else {
|
||||
// init();
|
||||
// state.tab11value = 0
|
||||
// changeTable()
|
||||
// }
|
||||
})
|
||||
|
||||
onReady((e) => { })
|
||||
|
||||
const scrollTop = ref(0)
|
||||
|
||||
function upper(e) {
|
||||
// console.log(e)
|
||||
}
|
||||
|
||||
function lower(e) {
|
||||
params.pageNum += 1
|
||||
console.log(showOrderList.value.length, '--------------a3')
|
||||
init(true)
|
||||
console.log(e)
|
||||
}
|
||||
|
||||
function scroll(e) {
|
||||
|
||||
}
|
||||
|
||||
function onPulling(e) {
|
||||
console.log("onpulling", e);
|
||||
if (e.detail.deltaY < 0) return // 防止上滑页面也触发下拉
|
||||
// console.log('触发下拉刷新')
|
||||
triggered.value = true;
|
||||
}
|
||||
|
||||
function onRefresh() {
|
||||
console.log("onRefresh");
|
||||
if (_freshing.value) return;
|
||||
_freshing.value = true;
|
||||
|
||||
if (timeconfig.value) {
|
||||
clearTimeout(timeconfig.value)
|
||||
timeconfig.value = null
|
||||
}
|
||||
timeconfig.value = setTimeout(() => {
|
||||
triggered.value = false;
|
||||
_freshing.value = false;
|
||||
console.log('开始请求')
|
||||
// this.getData();
|
||||
params.pageSize = 10
|
||||
params.pageNum = 0
|
||||
params.orderStatus = 0
|
||||
orderDetails.value = []
|
||||
orderStayService.value = []
|
||||
orderService.value = []
|
||||
orderOver.value = []
|
||||
orderCancel.value = []
|
||||
console.log(showOrderList.value.length, '--------------a4')
|
||||
init(false)
|
||||
}, 500);
|
||||
}
|
||||
|
||||
//跳转订单详情
|
||||
function handlegotoinfo(order) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/orderInfom/index?orderInfo=${JSON.stringify(order)}`
|
||||
})
|
||||
}
|
||||
|
||||
//跳转宠物列表
|
||||
function handPetlist(list) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/orderPetList/index?list=${JSON.stringify(list)}`
|
||||
})
|
||||
}
|
||||
|
||||
//切换登录
|
||||
function goLogin() {
|
||||
userInfo.resetUidAndToken()
|
||||
uni.navigateTo({
|
||||
url: `/pages/login/index`
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.hometitle {
|
||||
color: $uni-text-color;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.nut-tab-pane {
|
||||
background: #F3F3F3 !important;
|
||||
box-sizing: border-box !important;
|
||||
padding: 0rpx !important;
|
||||
position: relative !important;
|
||||
}
|
||||
|
||||
.scroll-Y {
|
||||
height: 100vh;
|
||||
background: #F3F3F3;
|
||||
// padding: 24rpx;
|
||||
padding-left: 24rpx;
|
||||
padding-right: 24rpx;
|
||||
padding-top: 24rpx;
|
||||
padding-bottom: 44rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.order_list_container {
|
||||
--nut-navbar-background: #F3F3F3;
|
||||
--nut-navbar-color: #312D22;
|
||||
background-color: #F3F3F3;
|
||||
}
|
||||
|
||||
.no-data {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100vh;
|
||||
padding-top: 50%;
|
||||
|
||||
.content {
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
|
||||
.msg {
|
||||
margin: 40rpx;
|
||||
}
|
||||
|
||||
.no-img {
|
||||
width: 262rpx;
|
||||
height: 262rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user