agent-app/agentApp/pages/queuing-information/queuing-information.vue

<template>
	<view class="app-container">
		
		<u-tabs :list="list" lineColor="#F52F3E" @click="change" lineWidth="160rpx" @change="change"
		itemStyle="padding-left: 0; padding-right: 0;width: 50%; height: 90rpx;font-size: 14px"
		lineHeight="2"
		:activeStyle="{
		        color: '#F52F3E'
		    }"
		></u-tabs>
		<u-gap height="10rpx" bgColor="#F7F7F7"></u-gap>
		<view class="his-content">
			<view class="his-item u-border-bottom">
				<view class="hit-left">
					<view class="his-name">
						李姐烧烤（普罗旺斯店）
					</view>

				</view>
				<view class="hit-right">
					购买时排队<span class="text-style">10</span> ，当前 2 
				</view>
			</view>
			<view class="his-item u-border-bottom">
				<view class="hit-left">
					<view class="his-name">
						李姐烧烤（普罗旺斯店）
					</view>
			
				</view>
				<view class="hit-right">
					购买时排队<span class="text-style">10</span> ，当前 2 
				</view>
			</view>
			<view class="his-item u-border-bottom">
				<view class="hit-left">
					<view class="his-name">
						李姐烧烤（普罗旺斯店）
					</view>
			
				</view>
				<view class="hit-right">
					购买时排队<span class="text-style">10</span> ，当前 2 
				</view>
			</view>
			<view class="his-item u-border-bottom">
				<view class="hit-left">
					<view class="his-name">
						李姐烧烤（普罗旺斯店）
					</view>
			
				</view>
				<view class="hit-right">
					购买时排队<span class="text-style">10</span> ，当前 2 
				</view>
			</view>
			
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: [{
				name: '按时间排序'
			}, {
				name: '待最快排序'
			}],
			current: 0
		};
	},
	methods: {
		change(index) {
			this.current = Number(index);
		}
	}
}
</script>

<style lang="scss">
.his-content {
	padding: 0 30rpx;

	.his-item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1rpx solid #eee;

		.hit-left {
		font-size: 24rpx;
		color: #454545;
		font-weight: bold;
		}

		.hit-right {
			height: 130rpx;
			line-height: 130rpx;
			font-size: 24rpx;
			color: #666;
		}
		span.text-style{
			font-size: 24rpx;
			color: #F52F3E;
			padding: 0 15rpx;
			font-weight: bold;
		}
	}

	.u-border-bottom,
	.u-border-top {
		border-color: #eee !important;
	}
}
</style>