78 lines
1.8 KiB
Vue
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>
|