jzlife_wx_servant/pages/upgrade/ticketDetail/ticketDetail.wxss

page {
  background: #F3F3F3;
  color: #333;
}
view,text{
  box-sizing: border-box;
  color:#333;
  font-size: 34rpx;
}
.van-tab--active view.van-ellipsis{
  color:#09afff;
}
.ticket-list{
  margin:22rpx 24rpx 0;
  width:702rpx;
}
.ticket-item{
  background: #FFFFFF;
border-radius: 18rpx;
min-height:200rpx;
margin-bottom:24rpx;
padding:30rpx 24rpx 28rpx;
}
.ticket-top{
  margin-bottom:18rpx;
  height: 48rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.top-left,.top-right{
  height: 48rpx;
  display: flex;
  align-items: center;
  line-height: 48rpx;
}
.top-left image{
  width:34rpx;
  height: 34rpx;
  margin-right:10rpx;
}
.top-left view{
  font-size: 32rpx;
}
.top-right view{
  color: #09AFFF;
  font-size: 22rpx;
}
.top-right image{
  width:24rpx;
  height: 24rpx;
  margin-right:10rpx;
}
.ticket-content view{
  line-height: 48rpx;
}
.prorgress{
  height: 48rpx;
  display: flex;
  align-items: center;
}
.progress-dot{
  width: 10rpx;
height: 10rpx;
background: #09AFFF;
border-radius: 10rpx;
margin-right:8rpx;
}
.progress-tip{
  font-size: 16rpx;
  color:#999;
  line-height: 24rpx;
  padding-left:18rpx;
}
.ticket-bottom{
  display: flex;
    align-items: center;
    margin-top: 22rpx;
    height: 40rpx;
    line-height: 40rpx;
    justify-content: flex-end;

}
.ticket-bottom view{
  color: #0EAEFC;
  line-height: 40rpx;
}
.ticket-bottom image{
  width:24rpx;
  height: 24rpx;
  margin-right:8rpx;
}
/* 服务单 */
.service-order{
  margin:14rpx 24rpx 16rpx;
  width:702rpx;
  background: #fff;
border-radius: 18rpx;
min-height: 300rpx;
padding:0 20rpx 32rpx;
}
.service-title{
  height:96rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
  line-height: 96rpx;
}
.ser-title-left image{
  width:36rpx;
  height:36rpx;
  margin-right:6rpx;
}
.ser-title-left view{
  font-size: 32rpx;
}
.ser-title-right view{
  font-size: 22rpx;
  color: #09AFFF;
}
.ser-title-right image{
  width:24rpx;
  height:24rpx;
  margin-right:6rpx;
}
.ser-title-left,.ser-title-right{
  display: flex;
  align-items: center;
  height: 96rpx;
}
.related-info{
  background: #F6FFED;
border-radius: 18rpx;
padding:24rpx 32rpx 32rpx;
}
.related-info .column{
  height: 60rpx;
  line-height: 60rpx;
  display: flex;
  justify-content: space-between;
}
.column .title{
  font-weight: bold;
}
.related-info .row{
  line-height: 60rpx;
}
.notice{
padding:10rpx 12rpx;
background: #E6F7FF;
border-radius: 14rpx;
display: flex;
line-height: 36rpx;
align-items: center;
}
.notice image{
  width:30rpx;
  height:30rpx;
  margin-right:20rpx;
}
.notice view{
  color: #09AFFF;
  font-size: 28rpx;
}
.service-info{
  padding-left:12rpx;
}
.service-info .row{
  line-height: 60rpx;
}
.service-info .order-num{
  height: 60rpx;
  display: flex;
  align-items: center;
}
.copy-img{
 width:36rpx;
 height:36rpx;
 margin-left:4rpx;
}
.service-info .column{
  height: 60rpx;
  line-height: 60rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.callup-img{
  width:34rpx;
  height: 34rpx;
}
.service-info .address{
  display: flex;
  margin:6rpx 0;
  line-height: 48rpx;
}
.service-info .address .detail{
  flex:1;
}
.service-info .address image{
  margin:12rpx 0 0 30rpx;
  width:34rpx;
  height: 34rpx;
}
.operate-block{
  display: flex;
  align-items: center;
  margin-top:22rpx;
  height: 40rpx;
  line-height: 40rpx;
  justify-content: flex-end;
}
.operate-item{
  display: flex;
  height: 40rpx;
  align-items: center;
  margin-left:12rpx;
}
.operate-item image{
  width:30rpx;
  height:30rpx;
  margin-right:6rpx;
}
.operate-item view{
  font-size: 30rpx;
color: #0EAEFC;
}
.operate-item.disable view{
  color: rgba(0,0,0,0.25);
}
.service-status{
  height:60rpx;
  align-items: center;
  display: flex;
}
.service-status image{
  width:24rpx;
  height:24rpx;
  margin-right:8rpx;
}
.invite-comment{
  background: #E6F7FF;
  border-radius: 7rpx;
  border: 2px solid #91D5FF;
  color: #096DD9;
  font-size: 22rpx;
  width: 92rpx;
height: 32rpx;
text-align:center;
margin:0 10rpx;
line-height: 24rpx;
}
.hp-wrapper{
  display:flex;
  align-items: center;
  margin-right:10rpx;
  width: 96rpx;
height: 32rpx;
background: #F6FFED;
border-radius: 7rpx;
border: 2rpx solid #A0D911;
justify-content: center;

}
.hp-wrapper text{
  color: #73D13D;
  line-height: 24rpx;
  font-size: 22rpx;
}
.cp-wrapper{
  display:flex;
  align-items: center;
  width: 96rpx;
height: 32rpx;
background: #FFF2E8;
border-radius: 7rpx;
border: 2rpx solid #FA541C;
justify-content: center;

}
.cp-wrapper text{
  color: #FA541C;
  line-height: 24rpx;
  font-size: 22rpx;
}

.book{ 
  margin: 20rpx 20rpx;
  /* margin-bottom: 20rpx; */
  /* height: 320rpx; */
  /* width: 710rpx; */
  border: 1rpx solid #999;
  border-radius: 10rpx;
  display: flex;
  flex-flow: column;
  padding-bottom: 20rpx;
  
}
 
.bookname { 
display: block;
color: #333;
line-height: 42rpx;
font-size: 42rpx;
margin: 20rpx 20rpx;
font-weight: 500;
} 
.serviceTime{
  display: block;
color: #333;
line-height: 32rpx;
font-size: 32rpx;
margin: 20rpx 20rpx;
font-weight: 300;
}
.goodsname{
  color: #333;
line-height: 32rpx;
font-size: 32rpx;
margin: 20rpx 20rpx;
font-weight: 300;
}
.status{
  line-height: 40rpx;
  /* height: 40rpx; */
  float: right;
  margin: 10rpx;
  background-color: #09AFFF;
  padding: 10rpx;
  border-radius: 10rpx;
  color: #fff;
  font-size: 20rpx;
}

.address { 
display: block;
color: darkred;
line-height: 46rpx;
font-size: 36rpx; 
margin: 20rpx 20rpx;
}

.service{
display: block; 
line-height: 40rpx;
font-size: 33rpx;
margin-left: 20rpx;
}


.tool{
margin-right : 20rpx;  
margin-top: 10rpx;
}

.btn { 
  height: 76rpx;
  line-height: 76rpx; 
  float: right;
  color: #333;
  font-size: 30rpx;  
  /* background-color: #09AFFF;     */
  margin-left: 10rpx;
  border-radius: 10rpx;  
}
 


/* 预检项目样式  */

/* .row{
  margin-top: 20rpx;
  padding: 20rpx;
  border: 1rpx solid #999;
  border-radius: 10rpx;
} */
.title{
  display: block;    
  height: 50rpx;
}
.left{
  float: left; 
  color:#333;
}

.right{
  float:right; 
  color:#333;
}

.category{
  font-size: 36rpx;
  color: #333;
  font-weight: 500;
}
.content{
  margin-top: 20rpx;
}
.device{ 
  font-size: 36rpx; 
  font-weight: 200;
}
.problem{
  display: flex;
  flex-wrap: wrap;
}

.item{
  margin: 6rpx;
}

.img{ 
  margin: 10rpx;
  width: 80rpx;
  height: 80rpx;
}
.myqr {
  width: 560rpx; 
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  background: #efe2e2;
  z-index: 999;
  border-radius: 20rpx;
  /* border: 1rpx solid #999; */
  padding: 20rpx;
}

.myqr .cancel {
  position: absolute;
  width: 60rpx;
  height: 60rpx;
  margin-left: 280rpx;
}

.myqr .img {
  width: 480rpx;
}
.star{
  display: flex;
  margin: 20rpx 0;
}
.star image{
  width: 60rpx;
  height: 60rpx;
}
.comment-txt{
  width:auto;
  border:3rpx solid #999;
  border-radius:10rpx;
  text-align: left;
  padding:10rpx;color:#333; 
}
.btn {
  height: 56rpx;
  line-height: 56rpx;
  width: 300rpx;
  color: #fff;
  font-size: 30rpx;
  background-color: #09AFFF;
  border-radius: 28rpx;
  letter-spacing: 3rpx;
  text-align: center;
  /* margin: 20rpx auto 0; */
} 
.box-wrapper{
  height: 64rpx;
  background: #E6F7FF;
  border-radius: 14rpx;
  margin:14rpx 24rpx 0;
  display: flex;
  align-items: center;
  padding-left:30rpx;
  width:702rpx;
}
.msg-box{
  height: 64rpx;
overflow: hidden;
width:600rpx;
}
.msg-item{
  display: flex;
  align-items: center;
  height: 64rpx;
}
.box-wrapper image{
  width:32rpx;
  height: 32rpx;
  margin-right:8rpx;
}
.content-wrapper{
  flex:1;
  display: flex;
  align-items: center;
  height: 64rpx;
}
.content-wrapper view{
  line-height: 64rpx;
  color:#09afff;
  font-size: 26rpx;
}
.anim{
  margin-top:-60rpx;
  transition: all 0.5s;
}
.msg-content{
  width:600rpx;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}