line-height替换为display:flex;justify-content: center;align-items: center;兼容微信居中

master
chen 2022-03-18 10:53:34 +08:00
parent 6f17bcb780
commit 66030571ba
2 changed files with 21 additions and 22 deletions

View File

@ -25,10 +25,9 @@
color: #03affb; color: #03affb;
width: 170rpx; width: 170rpx;
height: 45rpx; height: 45rpx;
line-height: 45rpx; display: flex;justify-content: center;align-items: center;
border-radius: 24rpx; border-radius: 24rpx;
padding: 4rpx 0rpx; padding: 4rpx 0rpx;
text-align: center;
margin-left: 20rpx; margin-left: 20rpx;
} }
.obtainIng { .obtainIng {
@ -39,7 +38,7 @@
.register-radio {transform: scale(0.5);margin-left: -10rpx;margin-right: -10rpx;} .register-radio {transform: scale(0.5);margin-left: -10rpx;margin-right: -10rpx;}
uni-radio .uni-radio-input {border: 1rpx solid #444444;} uni-radio .uni-radio-input {border: 1rpx solid #444444;}
.register-agree-policy {color: #03affb;} .register-agree-policy {color: #03affb;}
.register-btn {width: 422rpx;height: 76rpx;line-height: 76rpx;text-align: center;margin: 0 auto;border-radius: 76rpx;margin-top: 60rpx; background-color: #03affb;color: #FFFFFF;} .register-btn {width: 422rpx;height: 76rpx;display: flex;justify-content: center;align-items: center; margin: 0 auto;border-radius: 76rpx;margin-top: 60rpx; background-color: #03affb;color: #FFFFFF;}
.clear-box { .clear-box {
position: absolute;right: 0; position: absolute;right: 0;
top: 50%; top: 50%;
@ -75,9 +74,8 @@ uni-radio .uni-radio-input {border: 1rpx solid #444444;}
border-radius: 50rpx; border-radius: 50rpx;
height: 90rpx; height: 90rpx;
background-color: #02A2ea; background-color: #02A2ea;
line-height: 90rpx; display: flex;justify-content: center;align-items: center;
color: #FFFFFF; color: #FFFFFF;
text-align: center;
font-size: 30rpx; font-size: 30rpx;
} }
/* 登录 */ /* 登录 */
@ -117,8 +115,7 @@ uni-radio .uni-radio-input {border: 1rpx solid #444444;}
} }
.login-btn { .login-btn {
height: 80rpx; height: 80rpx;
line-height: 80rpx; display: flex;justify-content: center;align-items: center;
text-align: center;
background-color: #03affb; background-color: #03affb;
border-radius: 10rpx; border-radius: 10rpx;
color: #FFFFFF; color: #FFFFFF;
@ -142,8 +139,7 @@ uni-radio .uni-radio-input {border: 1rpx solid #444444;}
.forget-btn { .forget-btn {
width: 422rpx; width: 422rpx;
height: 75rpx; height: 75rpx;
line-height: 75rpx; display: flex;justify-content: center;align-items: center;
text-align: center;
background-color: #03affb; background-color: #03affb;
color: #FFFFFF; color: #FFFFFF;
border-radius: 75rpx; border-radius: 75rpx;
@ -163,8 +159,7 @@ uni-radio .uni-radio-input {border: 1rpx solid #444444;}
top: -16rpx; top: -16rpx;
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
line-height: 40rpx; display: flex;justify-content: center;align-items: center;
text-align: center;
border-radius: 100%; border-radius: 100%;
font-size: 22rpx; font-size: 22rpx;
background-color: #e93030; background-color: #e93030;
@ -215,8 +210,7 @@ uni-radio .uni-radio-input {border: 1rpx solid #444444;}
background-color: #f03232; background-color: #f03232;
width: 36rpx; width: 36rpx;
height: 36rpx; height: 36rpx;
line-height: 36rpx; display: flex;justify-content: center;align-items: center;
text-align: center;
border-radius: 100%; border-radius: 100%;
color: #FFFFFF; color: #FFFFFF;
transform: scale(.8); transform: scale(.8);
@ -225,8 +219,7 @@ uni-radio .uni-radio-input {border: 1rpx solid #444444;}
/* 我的页面 */ /* 我的页面 */
.my-exit-btn{ .my-exit-btn{
height: 88rpx; height: 88rpx;
line-height: 88rpx; display: flex;justify-content: center;align-items: center;
text-align: center;
border-radius: 88rpx; border-radius: 88rpx;
background-color: #03affb; background-color: #03affb;
color: #FFFFFF; color: #FFFFFF;
@ -263,8 +256,7 @@ uni-radio .uni-radio-input {border: 1rpx solid #444444;}
.person-btn { .person-btn {
margin: 0 40rpx; margin: 0 40rpx;
height: 88rpx; height: 88rpx;
line-height: 88rpx; display: flex;justify-content: center;align-items: center;
text-align: center;
border-radius: 88rpx; border-radius: 88rpx;
background-color: #03affb; background-color: #03affb;
color: #FFFFFF; color: #FFFFFF;

View File

@ -4,26 +4,26 @@
<container-subgroup> <container-subgroup>
<view slot="content" style="margin: 0rpx -30rpx 0rpx -30rpx;padding-bottom: 120rpx;" class="fon28 bacf"> <view slot="content" style="margin: 0rpx -30rpx 0rpx -30rpx;padding-bottom: 120rpx;" class="fon28 bacf">
<view class="bbot disac pad-sx30 pad-zy30"> <view class="bbot disac pad-sx30 pad-zy30">
<view class="mar-y30">人员状态 <text style="color: red;">*</text></view> <view class="mar-y30 flexs">人员状态 <text style="color: red;">*</text></view>
<view class="disac"> <view class="disac">
<view @tap="chooseStatus(index,0)" v-for="(item,index) in personnelStatus" :key="index" class="service-range-status mar-y10" :class="statusNum==index ? 'service-range-activeStatus' : ''">{{item}}</view> <view @tap="chooseStatus(index,0)" v-for="(item,index) in personnelStatus" :key="index" class="service-range-status mar-y10" :class="statusNum==index ? 'service-range-activeStatus' : ''">{{item}}</view>
</view> </view>
</view> </view>
<view class="bbot disac pad-sx30 pad-zy30"> <view class="bbot disac pad-sx30 pad-zy30">
<view class="mar-y30">工作时段 <text style="color: red;">*</text></view> <view id="timeBox" class="mar-y30 flexs">工作时段 <text style="color: red;">*</text></view>
<view class="disac"> <view class="disac">
<view @tap="chooseStatus(index,1)" v-for="(item,index) in workingHours" :key="index" class="service-range-status mar-y10" :class="hoursNum==index ? 'service-range-activeStatus' : ''">{{item}}</view> <view @tap="chooseStatus(index,1)" v-for="(item,index) in workingHours" :key="index" class="service-range-status mar-y10" :class="hoursNum==index ? 'service-range-activeStatus' : ''">{{item}}</view>
</view> </view>
</view> </view>
<view class="bbot disac pad-sx30 pad-zy30"> <view class="bbot disac pad-sx30 pad-zy30">
<view class="mar-y30"> <text style="margin-left: 58rpx;"></text> <text style="color: red;">*</text></view> <view class="mar-y30 flexs disjbac" :style="{width: eareWidth + 'px'}"> <view><text style="color: red;">*</text></view></view>
<view class="disjbac width100"> <view class="disjbac width100">
<view>湖南省株洲市芦淞区</view> <view>湖南省株洲市芦淞区</view>
<i class="icon icon-next col9" style="font-size: 30rpx;"></i> <i class="icon icon-next col9" style="font-size: 30rpx;"></i>
</view> </view>
</view> </view>
<view class="bbot disac pad-sx30 pad-zy30"> <view class="bbot disac pad-sx30 pad-zy30">
<view class="mar-y30">详细地址 <text style="color: red;">*</text></view> <view class="mar-y30 flexs">详细地址 <text style="color: red;">*</text></view>
<view class="disac"> <view class="disac">
<input class="fon28" type="text" placeholder="请输入详细地址" placeholder-style="font-size:28rpx;"/> <input class="fon28" type="text" placeholder="请输入详细地址" placeholder-style="font-size:28rpx;"/>
</view> </view>
@ -57,9 +57,16 @@
hoursNum:0, hoursNum:0,
serviceRange:['30KM','80KM','1500KM','其他','其他','其他','其他'], serviceRange:['30KM','80KM','1500KM','其他','其他','其他','其他'],
rangeNum:0, rangeNum:0,
remarkText:'' remarkText:'',
eareWidth:''
} }
}, },
onReady() {
const query = wx.createSelectorQuery()
query.select('#timeBox').boundingClientRect((rect) => {
this.eareWidth = rect.width;
}).exec()
},
methods: { methods: {
// //
chooseStatus(index,num){ chooseStatus(index,num){