135 lines
2.6 KiB
Vue
135 lines
2.6 KiB
Vue
<template>
|
|
<view style="padding-bottom: 50rpx;">
|
|
<!-- classify -->
|
|
<view class="classify">
|
|
<u-grid :border="false" col="3">
|
|
<u-grid-item v-for="(listItem,listIndex) in classifyList" :key="listIndex" @click="click(listIndex)">
|
|
<!-- 懒加载 :lazy-load="true" -->
|
|
<u--image :src="listItem.src" width="86rpx" height="86rpx" :lazy-load="true">
|
|
</u--image>
|
|
<text class="grid-text">{{listItem.title}}</text>
|
|
</u-grid-item>
|
|
</u-grid>
|
|
</view>
|
|
|
|
<!-- 行业新闻 -->
|
|
<view>
|
|
<view class="subtitle">
|
|
<u--image src="/static/report/hy_icon_xwx.png" width="24rpx" height="24rpx" :lazy-load="true">
|
|
</u--image>
|
|
<text class="xw_text text">行业新闻</text>
|
|
</view>
|
|
<news></news>
|
|
</view>
|
|
|
|
<!-- 新品发布 -->
|
|
<view>
|
|
<view class="subtitle">
|
|
<u--image src="/static/report/hy_icon_fux.png" width="24rpx" height="24rpx" :lazy-load="true">
|
|
</u--image>
|
|
<text class="xpfb_text text">新品发布</text>
|
|
</view>
|
|
<products></products>
|
|
</view>
|
|
|
|
<!-- 认证厂家 -->
|
|
<view>
|
|
<view class="subtitle">
|
|
<u--image src="/static/report/hy_icon_cjx.png" width="24rpx" height="24rpx" :lazy-load="true">
|
|
</u--image>
|
|
<text class="rzcj_text text">认证厂家</text>
|
|
</view>
|
|
<certifiedCj></certifiedCj>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
classifyList: [{
|
|
src: '/static/report/hy_icon_xw.png',
|
|
title: '行业新闻'
|
|
},
|
|
{
|
|
src: '/static/report/hy_icon_fu.png',
|
|
title: '新品发布'
|
|
},
|
|
{
|
|
src: '/static/report/hy_icon_cj.png',
|
|
title: '认证厂家'
|
|
},
|
|
],
|
|
|
|
}
|
|
},
|
|
methods: {
|
|
//点击一级分类
|
|
click(listIndex) {
|
|
//点击行内新闻时
|
|
if (listIndex == 0) {
|
|
uni.navigateTo({
|
|
url: '/pages/news/news'
|
|
})
|
|
} else if (listIndex == 2) {
|
|
uni.navigateTo({
|
|
url: '/pages/certifiedCj/certifiedCj'
|
|
})
|
|
}
|
|
},
|
|
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
//分类模块
|
|
.classify {
|
|
background: #FFFFFF;
|
|
border-radius: 0 0 24rpx 24rpx;
|
|
box-shadow: 0px 2px 4px 0px rgba(206, 206, 206, 0.5);
|
|
padding-bottom: 30rpx;
|
|
margin: 0 16rpx;
|
|
|
|
.u-grid {
|
|
padding-top: 22rpx;
|
|
|
|
.grid-text {
|
|
padding-top: 8rpx;
|
|
font-size: 24rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.subtitle {
|
|
margin: 24rpx 0 16rpx 16rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.text {
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
line-height: 40rpx;
|
|
padding-left: 4rpx;
|
|
}
|
|
}
|
|
|
|
.xw_text {
|
|
color: #5ACCF0;
|
|
}
|
|
|
|
|
|
|
|
|
|
.xpfb_text {
|
|
color: #FCAC18;
|
|
}
|
|
|
|
.rzcj_text {
|
|
color: #78E13A;
|
|
}
|
|
</style>
|