工行这里学车报名流程h5
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.
 
 
 
 

111 lines
2.1 KiB

<template>
<view class="ul" v-if="listData.length">
<view class="li" v-for="(item,index) in listData" :key="index" @click="goDetail(item)">
<view class="cover">
<image :src="item.iconUrl" mode=""></image>
</view>
<view class="borderLine">
<view class="centerInfo">
<view class="name">{{item.schoolName}}</view>
<view class="star">
<u-rate :count="5" v-model="item.starLevel" active-color="#F5682D" disabled></u-rate>
<view class="starText">
{{item.starLevel}}分
</view>
</view>
<view class="district">上城区</view>
</view>
<view class="rightCon">
<view class="btn">查看班型</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props: ['listData'],
data() {
return {}
},
methods: {
goDetail(item) {
this.$store.commit('upDateTrainingSchoolId', item)
this.$goPage('/pages/schoolDetails/details')
}
}
}
</script>
<style lang="scss" scoped>
.ul {
width: 100%;
.li {
width: 100%;
display: flex;
padding: 20rpx 0 0 0;
.cover {
width: 204rpx;
height: 140rpx;
border-radius: 14rpx;
overflow: hidden;
flex-shrink: 0;
image {
display: block;
width: 100%;
height: 100%;
}
}
.borderLine {
flex: 1;
width: 0;
padding-bottom: 44rpx;
border-bottom: 1rpx solid #E8E9EC;
display: flex;
}
.centerInfo {
width: 0;
flex: 1;
padding: 0 0 0 20rpx;
.name {
font-size: 32rpx;
color: #333;
font-weight: 600;
}
.star {
display: flex;
align-items: center;
margin: 10rpx 0 14rpx 0;
.starText {
font-size: 24rpx;
color: #F88F36;
}
}
.district {
font-size: 24rpx;
color: #333;
}
}
.rightCon {
padding-top: 36rpx;
.btn {
width: 144rpx;
height: 56rpx;
background: linear-gradient(180deg, #3593FB 0%, #53D3E5 100%);
border-radius: 36rpx;
font-size: 28rpx;
color: #fff;
line-height: 56rpx;
text-align: center;
}
}
}
}
</style>