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.
78 lines
1.5 KiB
78 lines
1.5 KiB
3 years ago
|
<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>
|