lanan-repair/pages/myReservation/myReservation.vue
2024-09-22 15:07:01 +08:00

78 lines
1.8 KiB
Vue

<template>
<view class="container">
<VNavigationBar titleColor="rgba(0,0,0,0.9)" backgroundColor="transparent" title="我的预约">
</VNavigationBar>
<view class="body">
<scroll-view style="height: 100%;" scroll-y="true">
<view class="orderList">
<reservationOrderVue v-for="(item, index) in orderList" :key="index" :orderInfo="item">
</reservationOrderVue>
</view>
</scroll-view>
</view>
</view>
</template>
<script>
import VNavigationBar from '@/components/VNavigationBar.vue'
import tabBarVue from '@/components/tabBar/tabBar.vue'
import reservationOrderVue from '../../components/reservationOrder/reservationOrder.vue'
export default {
components: {
tabBarVue,
VNavigationBar,
reservationOrderVue
},
data() {
return {
orderList: [{
title: '顺捷汽车维修搭电救援补胎中心',
status: '1',
address: '济南市历下区福瑞达历下护理院东南门旁',
phone: '15726506879',
busiTypeStr: '汽车维修'
},
{
title: '顺捷汽车维修搭电救援补胎中心',
status: '1',
address: '济南市历下区福瑞达历下护理院东南门旁',
phone: '15726506879',
busiTypeStr: '汽车维修'
}
]
}
},
methods: {
}
}
</script>
<style scoped lang="less">
.container {
height: 100%;
background: #F3F5F7;
background: linear-gradient(180deg, #C1DEFF 0%, rgba(#F3F5F7, 0) 100%);
background-size: 100% 600rpx;
background-repeat: no-repeat;
display: flex;
flex-direction: column;
color: #333333;
.body {
flex: 1;
height: 0;
padding: 16rpx 0 30rpx;
overflow: auto;
}
.orderList {
width: 686rpx;
margin: 0 auto;
display: flex;
flex-direction: column;
row-gap: 20rpx;
}
}
</style>