景徳镇旅游微信小程序
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.
 
 
 

131 lines
2.3 KiB

<template>
<view class="page">
<!-- 我的预约 -->
<navbar title="我的预约" leftClick @leftClick="$utils.navigateBack" />
<view style="background-color: #fff;">
<uv-tabs :list="tabs"
lineColor="#B12026"
lineHeight="8rpx"
lineWidth="50rpx"
:scrollable="false"
@click="clickTabs"></uv-tabs>
</view>
<view class="subscribe-list">
<view class="item">
<!-- 主题 -->
<uv-cell title="景德镇一日游"
:border="false">
<template #icon>
<text class="text">主题</text>
</template>
<template #value>
<text class="price">199.0</text>
</template>
</uv-cell>
<!-- 时间 -->
<uv-cell
:border="false">
<template #icon>
<text class="text">时间</text>
</template>
<template #title>
<text class="time">2024-04-21</text>
</template>
</uv-cell>
<!-- 电话 -->
<uv-cell
:border="false">
<template #icon>
<text class="text">电话</text>
</template>
<template #title>
<text class="phone">15423451221</text>
</template>
</uv-cell>
<view class="btns">
<view class="btn">
再次预约
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
tabs: [{
name: '遗产路径'
},
{
name: '我要研学'
},
{
name: '文创好物'
},
],
}
},
methods: {
//点击tab栏
clickTabs(index) {
if (index == 0) {
this.state = -1;
} else {
this.state = index - 1;
}
this.getOrderList()
},
}
}
</script>
<style scoped lang="scss">
.page {
.subscribe-list{
.item{
background-color: #fff;
border-radius: 20rpx;
margin: 20rpx;
padding: 20rpx;
box-shadow: 0 0 16rpx 6rpx #00000011;
/deep/ text{
font-size: 26rpx;
color: #333333;
font-weight: 900;
}
/deep/ .text{
color: #B7BBC7;
margin-right: 20rpx;
font-size: 26rpx;
}
/deep/ .price{
color: #f40;
}
/deep/ .time{
color: $uni-color;
}
.btns{
display: flex;
justify-content: flex-end;
.btn{
padding: 10px 30rpx;
font-size: 24rpx;
background-color: $uni-color;
color: #fff;
border-radius: 35rpx;
}
}
}
}
}
</style>