洛阳学员端
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.
 
 
 
 
 
 

103 lines
2.2 KiB

<template>
<view class="card">
<view class="avatar">
<image :src="item.photoPath" mode="" v-if="isImagePath(item.photoPath)"></image>
<image src="@/static/images/index/avatar.png" mode="" v-else></image>
</view>
<view class="info">
<view class="name">{{ item.name}}</view>
<view class="star_row">
<u-rate active-color="#FCAC00" inactive-color="#FCAC00" gutter="1" :size="16" :value="item.stars" :count="5" :readonly="true" allowHalf></u-rate>
<view class="num">{{ item.stars }}</view>
</view>
<view class="flex-b">
<view class="carType">准教车型{{ item.teachCarType }}</view>
<view class="btn" @click="goSign">报名</view>
</view>
<view class="schoolName">{{ item.schoolName }}</view>
</view>
</view>
</template>
<script>
export default {
props: ['item'],
methods: {
isImagePath(path) {
// 定义常见的图片文件扩展名
const imageExtensions = /\.(jpg|jpeg|png|gif|bmp|svg)$/i;
// 使用正则表达式进行匹配
return imageExtensions.test(path);
},
async goSign(item) {
this.$store.commit('upDateSchoolCoach', {})
this.$store.commit('upDateSchoolClass', item)
this.$u.utils.clickSignUp()
}
},
}
</script>
<style lang="scss" scoped>
.card {
padding: 20rpx;
display: flex;
.avatar {
width: 134rpx;
height: 134rpx;
border-radius: 50%;
}
.info {
flex: 1;
padding: 0 20rpx;
.name {
font-size: 28rpx;
color: #333;
font-weight: 700;
}
.star_row {
display: flex;
align-items: center;
margin: 10rpx 0;
.num {
font-size: 24rpx;
font-weight: 700;
}
}
.carType {
padding: 0 20rpx;
height: 46rpx;
background: rgba(80,165,255,0.1);
border: 1px solid #50A5FF;
border-radius: 10rpx;
line-height: 46rpx;
color: $themC;
font-size: 24rpx;
display: inline-block;
}
.schoolName {
font-size: 24rpx;
color: #999;
margin-top: 20rpx;
}
}
.btn {
width: 112rpx;
height: 55rpx;
background: $themC;
border-radius: 28rpx;
line-height: 55rpx;
text-align: center;
color: #fff;
font-size: 24rpx;
margin-top: -20rpx;
}
}
</style>