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.
 
 
 

105 lines
1.8 KiB

<template>
<view class="subject1">
<view class="" v-for="(item,index) in list" :key="index">
<view class="name">{{ item.studentName }} <text>{{ phoneShow(item.studentMobile)}}</text></view>
<view class="row">
<view class="timeItem">
<view class="flex ">
<view class="time">{{ item.totalTime }}</view>
<view class="uni">分钟</view>
</view>
<view class="lab">已完成学时</view>
</view>
<view class="timeItem">
<view class="flex ">
<view class="time ">{{item.validTime}}</view>
<view class="uni">分钟</view>
</view>
<view class="lab">应完成学时</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props: {
list: {
type: Array,
default: []
}
},
methods: {
phoneShow(phoneNumber) {
if (phoneNumber.length === 11) {
return phoneNumber.replace(phoneNumber.substr(3, 4), "****");
} else {
return phoneNumber;
}
}
}
}
</script>
<style lang="scss" scoped>
.subject1 {
border-top: 1rpx solid #EDEDED;
background-color: #fff;
border-radius: 20rpx;
padding: 30rpx;
}
.name {
font-size: 30rpx;
font-weight: 600;
color: #333;
margin-bottom: 24rpx;
text {
margin-left: 20rpx;
}
}
.row {
display: flex;
&:first-child {
border: none;
}
.timeItem {
border-left: 1px solid #EDEDED;
flex: 1;
align-items: center;
justify-content: center;
color: #999;
font-size: 24rpx;
padding: 20rpx 0;
&:first-child {
border: none;
}
.flex {
justify-content: center;
.time {
font-size: 36rpx;
color: #333;
font-weight: 700;
}
.uni {
margin-top: -6rpx;
margin-left: 4rpx;
}
}
.lab {
text-align: center;
}
}
}
</style>