Skip to content

飞
飞鹤小程序
Commit dfc927c3 authored by spc's avatar spc
Browse files
Options

home

parent ff7b71f2
Hide whitespace changes
Inline Side-by-side
Showing with 132 additions and 46 deletions
views/Home.vue
View file @ dfc927c3
......@@ -175,22 +175,24 @@
pageName: '首页-三屏',
buttonName: `次位内容资源位-轮播-${index + 1}`
}" @tap="jumpLink(infoItem.link, false, false, $event)">
<image class="infoimg2" :src="$baseUrl + infoItem.bgUrl"></image>
<view class="infotitle2">
<view class="infotitle">{{ infoItem.desc }}</view>
<image class="infoimg" :src="$baseUrl + infoItem.bgUrl"></image>
<view class="infotitlebox">
<view class="infotitlecon">
<view class="infotitle">{{ infoItem.desc }}</view>
<view class="infotitletag"></view>
</view>
<view class="infodesc">长文本字段,多行文本示意。长文本字段,多行文本示意。长文本字段,多行文本示意。</view>
</view>
</view>
</view>
</view>
<view :data-log="{
<!-- <view :data-log="{
xcxClick: '首页-三屏页面点击',
pageName: '首页-三屏',
buttonName: `次位内容资源位-查看更多文字`
}" @tap="jumpLink(suggest.link, false, false, $event)" class="desc desc2">
更多星妈会权威专家服务团 <view class="desc1"> 点击查看 > </view>
</view>
</view> -->
</view>
<view class="channelbox" id="thirdScreen">
<text class="maintitle">有声频道</text>
......@@ -208,27 +210,28 @@
{{ item }}
</view>
</view>
<view class="channelscroll">
<view class="box">
<view class="infobox" :key="index" v-for="(infoItem, index) in changelInfoList[channelTabIndex]"
:data-log="{
<view class="channelscroll2">
<view class="box2">
<view class="infobox2" :key="index"
v-for="(infoItem, index) in [...changelInfoList[channelTabIndex],...changelInfoList[channelTabIndex],...changelInfoList[channelTabIndex]]" :data-log="{
xcxClick: '首页-三屏页面点击',
pageName: '首页-三屏',
buttonName: `首页内容资源位分类${channelTabIndex + 1}-${channelTabList[channelTabIndex]}-${index + 1}`
}" @tap="jumpLink(infoItem.link, false, false, $event)">
<image class="infoimg" :src="$baseUrl + infoItem.bgUrl"></image>
<view class="infotitle">{{ infoItem.desc }}</view>
<image class="infoimg2" :src="$baseUrl + infoItem.bgUrl"></image>
<view class="infotitle2box">
<view class="infotitle2">{{ infoItem.desc }}</view>
</view>
</view>
</view>
</view>
<view :data-log="{
<!-- <view :data-log="{
xcxClick: '首页-三屏页面点击',
pageName: '首页-三屏',
buttonName: `首位内容资源位-查看更多文字`
}" @tap="jumpLink(voiceStory.link, false, false, $event)" class="desc">
滑动或者点击查看全部 <view class="desc1"> 有声故事 > </view>
</view>
</view> -->
</view>
<view id="fourthScreen" class="bottomlink">
......@@ -1184,59 +1187,142 @@ export default {
width: 718rpx;
overflow-y: scroll;
margin-top: 32rpx;
height: 400rpx;
height: 620rpx;
// margin-left: -32rpx;
.box {
display: flex;
flex-direction: column;
.infobox {
width: 670rpx;
flex-shrink: 0;
height: 180rpx;
border: 2rpx solid #feedc7;
margin-left: 15rpx;
border-radius: 20rpx 20rpx 20rpx 20rpx;
display: flex;
align-items: center;
background-color: #fff;
border-radius: 16rpx;
border: 2rpx solid #feeecb;
margin-bottom: 20rpx;
.infoimg {
width: 180rpx;
height: 176rpx;
height: 178rpx;
border-radius: 16rpx 0rpx 0rpx 12rpx;
flex-shrink: 0;
margin-top: -1rpx;
}
.infoimg2 {
width: 180rpx;
height: 176rpx;
margin-left: 2rpx;
margin-top: 2rpx;
border-radius: 20rpx 0rpx 0rpx 20rpx;
}
.infotitlebox {
flex: 1;
margin-left: 20rpx;
display: flex;
flex-direction: column;
justify-content: center;
.infotitlecon {
display: flex;
flex-direction: row;
.infotitle {
color: @color-black-deep;
width: 400rpx;
font-size: 24rpx;
font-weight: bold;
margin-bottom: 8rpx;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
line-height: 1.3;
}
.infotitletag {}
}
.infotitle {
width: 350rpx;
color: @color-black-deep;
font-size: 30rpx;
text-align: left;
margin-left: 25rpx;
font-weight: bold;
.infodesc {
color: #999999;
font-size: 22rpx;
width: 450rpx;
line-height: 1.3;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
}
.infotitle2 {
margin-top: -10rpx;
width: 400rpx;
background-color: @color-gray-light;
border-bottom-left-radius: 20rpx;
border-bottom-right-radius: 20rpx;
.infotitle {
padding-top: 10rpx;
padding-bottom: 10rpx;
}
}
}
.channelscroll2 {
width: 718rpx;
overflow-y: scroll;
margin-top: 32rpx;
height: 620rpx;
.box2 {
width: 718rpx;
height: 620rpx;
position: relative;
.infobox2 {
width: 330rpx;
height: 430rpx;
display: inline-block;
align-items: center;
background-color: #fff;
border-radius: 16rpx;
border: 4rpx solid #feeecb;
margin-bottom: 20rpx;
margin-right: 15rpx;
position: relative;
.infoimg2 {
width: 330rpx;
height: 306rpx;
border-radius: 16rpx 16rpx 0rpx 0rpx;
flex-shrink: 1;
}
.infotitle2box {
margin-top: 10rpx;
flex-shrink: 1;
display: flex;
flex-direction: column;
justify-content: center;
.infotitle2 {
color: @color-black-deep;
width: 310rpx;
font-size: 24rpx;
font-weight: bold;
margin-bottom: 8rpx;
display: -webkit-box;
-webkit-line-clamp: 2;
margin-left: 10rpx;
-webkit-box-orient: vertical;
overflow: hidden;
line-height: 1.3;
}
}
}
}
}
.desc {
color: @color-black-deep;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment