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.
155 lines
3.7 KiB
155 lines
3.7 KiB
3 years ago
|
<template>
|
||
|
|
<div class="my_exam">
|
||
|
|
<div class="exam_box">
|
||
|
|
<div class="time_box">2023-01-08</div>
|
||
|
|
<div class="pro_box">
|
||
|
|
<div class="pro_top">
|
||
|
|
<div class="img_box">
|
||
|
|
<img src="~@/assets/image/time.png" alt="" />
|
||
|
|
</div>
|
||
|
|
<div class="time_box">
|
||
|
|
<div class="time_text">2023-01-08</div>
|
||
|
|
<div class="date_txt">上午 9:00-9:30</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="pro_bottom">
|
||
|
|
<div class="pro_left">
|
||
|
|
<div class="img_box">
|
||
|
|
<img src="~@/assets/image/pro.png" alt="" />
|
||
|
|
</div>
|
||
|
|
<div class="pro_name">单眼视力</div>
|
||
|
|
<div class="pro_pos">门诊楼3楼眼科门诊</div>
|
||
|
|
</div>
|
||
|
|
<div class="pro_right">
|
||
|
|
<div class="cancel">取消预约</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.my_exam {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background: #f9f9f9;
|
||
|
|
.exam_box {
|
||
|
|
background: #fff;
|
||
|
|
padding: 0.5rem 0.24rem 0 0.24rem;
|
||
|
|
|
||
|
|
.time_box {
|
||
|
|
font-size: 0.3rem;
|
||
|
|
font-family: PingFang SC-Bold, PingFang SC;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #333333;
|
||
|
|
line-height: 0.46rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
.pro_box {
|
||
|
|
width: 98%;
|
||
|
|
margin-top: 0.2rem;
|
||
|
|
background: #fff;
|
||
|
|
margin: 0.4rem auto;
|
||
|
|
margin-bottom: 0.7rem;
|
||
|
|
|
||
|
|
|
||
|
|
.pro_top{
|
||
|
|
display: flex;
|
||
|
|
padding-bottom: 0.26rem;
|
||
|
|
border-bottom: 1px solid #EEEEEE;
|
||
|
|
.img_box{
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
margin-right: 0.24rem;
|
||
|
|
img{
|
||
|
|
width: 0.5rem;
|
||
|
|
height: 0.5rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.time_box{
|
||
|
|
.time_text{
|
||
|
|
width: 1.46rem;
|
||
|
|
height: 0.32rem;
|
||
|
|
text-align: center;
|
||
|
|
background: #F6F6F6;
|
||
|
|
border-radius: 0.08rem;
|
||
|
|
line-height: 0.32rem;
|
||
|
|
font-size: 0.24rem;
|
||
|
|
color: #999999;
|
||
|
|
}
|
||
|
|
.date_txt{
|
||
|
|
font-size: 0.3rem;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #333;
|
||
|
|
line-height: 0.46rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.pro_bottom{
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
height: 0.6rem;
|
||
|
|
margin-top: 0.24rem;
|
||
|
|
|
||
|
|
.pro_left{
|
||
|
|
display: flex;
|
||
|
|
|
||
|
|
|
||
|
|
.img_box{
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
img{
|
||
|
|
width: 0.5rem;
|
||
|
|
height: 0.5rem;
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.pro_name{
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
font-size: 0.3rem;
|
||
|
|
color: #333;
|
||
|
|
font-weight: bold;
|
||
|
|
margin-left: 0.24rem;
|
||
|
|
}
|
||
|
|
.pro_pos{
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
font-size: 0.24rem;
|
||
|
|
color: #999;
|
||
|
|
margin-left: 0.24rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.pro_right{
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
|
||
|
|
.cancel{
|
||
|
|
width: 1.5rem;
|
||
|
|
height: 0.5rem;
|
||
|
|
background: rgba(22, 119, 255,.1);
|
||
|
|
border-radius: 0.26rem;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
font-size: 0.24rem;
|
||
|
|
color: #1677FF;
|
||
|
|
margin-right: 0.24rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|