Files
pupil/pages/report/report.vue
2023-01-17 23:19:52 +08:00

140 lines
2.8 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)">
<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>
<productsByTime></productsByTime>
</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: '../../packageReport/newsList/newsList'
})
} else if (listIndex == 1) {
uni.navigateTo({
url: '../../packageReport/newProductRelease/newProductRelease'
})
} else if (listIndex == 2) {
uni.navigateTo({
url: '../../packageReport/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;
}
.u-image__error {
position: static !important;
}
.xpfb_text {
color: #FCAC18;
}
.rzcj_text {
color: #78E13A;
}
</style>