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.
77 lines
1.5 KiB
77 lines
1.5 KiB
<template> |
|
<view class="expert-list"> |
|
<view class="expert-item" v-for="(item,index) in list" :key="index"> |
|
<view class="top-box acea-row"> |
|
<view class="header-img-box"> |
|
<image :src="item.avatar" mode="aspectFill"></image> |
|
</view> |
|
<view class="name-box"> |
|
<view class="name">{{item.name}}</view> |
|
<view class="tip lin2">{{item.job}}</view> |
|
</view> |
|
</view> |
|
<view class="info-box"> |
|
<u-read-more ref="uReadMore" showHeight="200" :toggle="true"> |
|
<rich-text :nodes="item.introduction"></rich-text> |
|
</u-read-more> |
|
</view> |
|
</view> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
export default{ |
|
props: { |
|
list: { |
|
type: Array, |
|
default: ()=> [] |
|
}, |
|
}, |
|
methods:{ |
|
|
|
} |
|
} |
|
</script> |
|
|
|
<style lang="less"> |
|
.expert-list{ |
|
width: 100%; |
|
padding: 36rpx 40rpx; |
|
.expert-item{ |
|
width: 100%; |
|
margin-bottom: 32rpx; |
|
.top-box{ |
|
width: 100%; |
|
padding: 34rpx 32rpx; |
|
background: linear-gradient(to right, #65666B, #BDC0CA); |
|
.header-img-box{ |
|
width: 136rpx; |
|
height: 136rpx; |
|
border-radius: 50%; |
|
overflow: hidden; |
|
margin-right: 30rpx; |
|
image{ |
|
width: 100%; |
|
height: 100%; |
|
} |
|
} |
|
.name-box{ |
|
width: calc(100% - 200rpx); |
|
font-size: 24rpx; |
|
color: #fff; |
|
.name{ |
|
font-size: 44rpx; |
|
margin-bottom: 24rpx; |
|
} |
|
} |
|
} |
|
.info-box{ |
|
height: auto; |
|
background: #F1F1F1; |
|
padding: 18rpx 32rpx; |
|
font-size: 24rpx; |
|
color: #6D6E74; |
|
} |
|
} |
|
} |
|
</style>
|
|
|