pet-front/pages/orderTakingManage/index.vue

<template>
	<view>
		<up-sticky bgColor="#fff">
			<view class="container-tabs">
				<up-tabs :list="list" lineWidth="68rpx" :activeStyle="{
            color: '#FFFFFF',
            fontWeight: 'bold',
            transform: 'scale(1.05)'
        }" :inactiveStyle="{
            color: '#FFFFFF',
            transform: 'scale(1)'
        }" :itemStyle="{height:'88rpx',padding:'0 52rpx'}" lineColor="#FFFFFF" @click="clickEvent"></up-tabs>
			</view>
		</up-sticky>

		<view class="container">
			<List :orderList="orderlist" :current="current" @update="updateList"></List>
		</view>
	</view>
</template>

<script setup>
	import {
		computed,
		reactive,
		ref
	} from "vue";
	import List from "./components/list.vue";
	import {
		onShow
	} from "@dcloudio/uni-app"
	import { getLoginStatus } from "@/utils/useMixin.js"
	import {
		orderList
	} from "@/api/receivingHall/index.js"
	import submitBut from "@/components/submitBut/index.vue"
	import {
		useStore
	} from "vuex"

	const current = ref(0)
	const list = reactive([{
			name: '系统派单',
			badge: {
				value: 5,
			}
		},
		{
			name: '个人订单',
			badge: {
				value: 5,
			}
		},
		{
			name: '流失订单',
			badge: {
				value: 5,
			}
		},
	])
	const store = useStore();
	const userInfo = computed(() => {
		return store.getters.userInfo
	})
	const orderlist = ref([]);

	onShow(() => {
		if (!getLoginStatus()) return;
		getOrderList();
	})

	// 获取接单大厅列表
	const getOrderList = async () => {
		let response = await orderList({
			status: current.value,
			userId: userInfo.value.userId
		});
		if (response.code == 200 && response.data) {
			orderlist.value = response.data;
		}
	}

	const clickEvent = (item) => {
		current.value = item.index;
		getOrderList();
	}
	
	const updateList = () => {
		getOrderList();
	}
</script>

<style scoped lang="scss">
	@import "index.scss";
</style>