You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

117 lines
2.3 KiB

<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>