NurseStationApp/pages/appointment/appointment.vue
2022-10-17 18:35:58 +08:00

91 lines
1.5 KiB
Vue

<template>
<!-- <view> -->
<view class="background">
<text class="appointment">选择想要预约的时间</text>
<view class="nowtime">
<view class="time" @tap='appointment()' hover-class="click-hover">
9月10号
</view>
<view class="time" @tap='appointment()' hover-class="click-hover">
9月11号
</view>
<view class="time" @tap='appointment()' hover-class="click-hover">
9月12号
</view>
<view class="time" @tap='appointment()' hover-class="click-hover">
9月13号
</view>
</view>
</view>
<!-- </view> -->
</template>
<script>
export default {
data() {
return {
}
},
methods: {
appointment() {
uni.navigateTo({
url: `/pages/appointmenttime/appointmenttime`
})
},
}
}
</script>
<style>
.click-hover{
background-color:red;
}
.nowtime {
display: flex;
/* flex-direction: row; */
flex-wrap: wrap;
justify-content: space-around;
}
.background {
width: 702rpx;
height: 773rpx;
font-size: ;
background: #FFFFFF;
box-shadow: 0px 9px 31px 9px rgba(0, 0, 0, 0.03);
border-radius: 20px;
margin: 0 auto;
margin-top: 5%;
}
.appointment {
text-align: center;
width: 320rpx;
height: 34rpx;
font-size: 36rpx;
/* font-family: Adobe Heiti Std; */
font-weight: normal;
color: #000000;
line-height: 50px;
margin-left: 30%;
}
.time {
margin-top: 20rpx;
width: 290rpx;
height: 290rpx;
line-height: 290rpx;
text-align: center;
background: #4C7BC9;
border-radius: 25rpx;
margin-left: 5%;
color: white;
font-size: 50rpx;
}
</style>