This commit is contained in:
”chenxuelian“
2022-12-18 13:29:01 +08:00
98 changed files with 4169 additions and 23 deletions

View File

@@ -0,0 +1,145 @@
<template>
<view>
<u--image :src="src" width="750rpx" height="290rpx" :lazy-load="true">
</u--image>
<view class="feature">
<text class="one_title">经营范围及特色</text>
<view class="green_block">
<text class="green_features">{{features}}</text>
</view>
</view>
<view class="introduce">
<view class="introduce_title">企业介绍</view>
<text class="business_introduce">{{business_introduce}}</text>
</view>
<view class="show">
<view class="introduce_title">企业展示</view>
<u-grid :border="false" col="4">
<u-grid-item v-for="(listItem,listIndex) in showList" :key="listIndex">
<u--image :src="listItem.src" width="170rpx" height="170rpx" :lazy-load="true">
</u--image>
</u-grid-item>
</u-grid>
</view>
<view class="footer">
<u-icon name="kefu-ermai" color="#fff" size="30rpx"></u-icon>
<text>联系客服</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
src: '/static/detail/cj_bg.png',
features: '活冻鲍鱼,冻煮鲍鱼,鲍鱼罐头 佛跳墙,海螺片',
business_introduce: '福建省海纳川食品有限公司是一家从事水产养殖,加工与销售为一体的现代化企业,公司主要加工:活冻鲍鱼,溏心皇金鲍,兰花蟹,黄金鲍片,佛跳墙,大盆菜,火锅小章鱼,鲨鱼礼盒等系列产品。公司位于福建省自由贸易试验区马尾片区,离全国大的水产交易市场--马尾名成水产市场不到一公里,这里交通方便,商贾云集,冷链物流通达全国。',
showList: [{
src: '/static/report/zhanwei_xf(1).png'
}, {
src: '/static/report/zhanwei_xf(1).png'
}, {
src: '/static/report/zhanwei_xf(1).png'
},
{
src: '/static/report/zhanwei_xf(1).png'
},
]
}
},
methods: {
}
}
</script>
<style lang="scss">
.feature {
padding: 20rpx 16rpx;
background-color: #fff;
margin-bottom: 30rpx;
.one_title {
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: bold;
color: #3E3E3E;
line-height: 40rpx;
}
.green_block {
background-color: #16CA65;
margin-top: 20rpx;
height: 139rpx;
border-radius: 6rpx;
.green_features {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
line-height: 33rpx;
margin-left: 20rpx;
margin-top: 14rpx;
}
}
}
.introduce {
padding: 20rpx 16rpx;
background-color: #fff;
margin-bottom: 30rpx;
.introduce_title {
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: bold;
color: #3E3E3E;
line-height: 40rpx;
margin-bottom: 10rpx;
}
.business_introduce {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
line-height: 33rpx;
}
}
.show {
padding: 20rpx 16rpx;
background-color: #fff;
margin-bottom: 78rpx;
.u-grid {
padding-top: 22rpx !important;
}
}
.footer {
height: 100rpx;
background: #0EBB5B;
display: flex;
flex-direction: column;
justify-content: center;
align-content: center;
text-align: center;
.u-icon {
justify-content: center;
}
text {
font-size: 20rpx;
font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
font-weight: bold;
color: #FFFFFF;
line-height: 26rpx;
}
}
</style>

View File

@@ -0,0 +1,175 @@
<template>
<view>
<view v-for="(item,index) in detailList" :key="index">
<u-image :src="item.src" width="750rpx" height="530rpx" :lazy-load="true">
</u-image>
<view class="collect">
<u-icon :name="like?'heart-fill':'heart'" color="#FEAA19" size="23" @click.stop="likeTap"></u-icon>
<view class="collect_text">收藏</view>
</view>
<view class="content">
<view class="title_box">
<text class="title">{{item.title}}</text>
<view class="title_tag">{{item.tag}}</view>
</view>
<view class="desc">
{{item.desc}}
</view>
<view class="classify">
{{item.classify}}
</view>
<view class="tagOne">{{item.tagOne}}</view>
<view class="tagTwo">{{item.tagTwo}}</view>
</view>
<view class="releaseDate">
<u-image src="/static/products/sy_icon_sjf.png" width="24rpx" height="24rpx" :lazy-load="true">
</u-image>
<text class="release">发布日期</text>
<text>{{item.time}}</text>
</view>
<u-parse :content="item.content" @preview="preview" @navigate="navigate"></u-parse>
</view>
</view>
</template>
<script>
export default {
data() {
return {
like: false,
detailList: [{
src: '/static/detail/zhanwei_xppx.png',
title: '锅巴',
tag: '零食铺子',
desc: '糯米蟹黄锅巴散装,非油炸绿色健康食品',
classify: '薯片膨化',
tagOne: '无添加剂',
tagTwo: '无添加剂',
time: '2022年12月04日',
content: '<h1>一级标题</h1><br/><h2>二级标题</h2>'
}]
}
},
methods: {
likeTap() {
this.like = !this.like
}
}
}
</script>
<style lang="scss">
.collect {
display: flex;
position: absolute;
top: 16rpx;
right: 0;
background-color: #a6a6a6;
color: #fff;
border-radius: 54rpx 0px 0px 54rpx;
padding: 2px 2px 2px 3px;
.collect_text {
font-size: 26rpx;
padding: 1px;
}
}
.content {
padding: 20rpx;
background-color: #fff;
.title_box {
position: relative;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
.title {
font-size: 36rpx;
font-weight: 400;
color: #0EBB5B;
line-height: 50rpx;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.title_tag {
height: 30rpx;
background: #0EBB5B;
border-radius: 7rpx;
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
line-height: 28rpx;
padding: 1rpx 15rpx;
}
}
.desc {
font-size: 30rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #3E3E3E;
line-height: 34rpx;
padding: 15rpx 0;
}
.classify {
width: 80rpx;
height: 30rpx;
border-radius: 6rpx;
border: 1rpx solid #EEEEEE;
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
line-height: 28rpx;
padding: 1rpx 15rpx;
}
.tagOne {
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #CCCCCC;
line-height: 28rpx;
float: left;
padding-top: 14rpx;
padding-right: 20rpx;
}
.tagTwo {
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #CCCCCC;
line-height: 28rpx;
padding-top: 14rpx;
}
}
.releaseDate {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
line-height: 33rpx;
display: flex;
align-items: center;
padding: 24rpx 20rpx;
margin-top: 20rpx;
background-color: #fff;
.release {
padding: 0 10rpx 0 6rpx;
}
}
</style>

View File

@@ -0,0 +1,67 @@
<template>
<view>
<view class="xw_title">
{{title}}
</view>
<view style="display: flex;">
<text class="xw_time">
{{time}}
</text>
<text class="xw_time xw_place">
{{place}}
</text>
</view>
<view class="xw_content">
<u-parse :content="news" @preview="preview" @navigate="navigate"></u-parse>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: '2022近50款食品饮料新品创新的方向都在这里',
time: '2022-12-03 09:59',
place: '第一食品资讯官方账号',
news: '<h1>一级标题</h1><br/><h2>二级标题</h2>'
}
},
methods: {
}
}
</script>
<style lang="scss">
page {
background-color: #fff;
padding: 12rpx 16rpx;
}
.xw_title {
font-size: 38rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: bold;
color: #3E3E3E;
line-height: 53rpx;
letter-spacing: 1rpx;
}
.xw_time {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #969696;
line-height: 33rpx;
margin-top: 6rpx;
}
.xw_place {
padding-left: 20rpx;
}
.xw_content {
margin-top: 38rpx;
}
</style>

View File

@@ -1,41 +1,119 @@
<!-- 首页 -->
<template>
<view>
<view class="input_block">
<view class="input_block_border">
<view @click="toSearch">
<u-input placeholder="搜索优质产品" placeholder-style="color: #969696" prefixIcon="search"
<!-- 搜索框 -->
<view class="search_box">
<view class="search_box_border">
<u-input placeholder="搜索优质产品" placeholder-style="color: #969696" prefixIcon="search"
prefixIconStyle="font-size: 22px;color: #909399;margin-left:30rpx">
</u-input>
</view>
</view>
</view>
<view class="content">
<!-- 分类模块 -->
<view class="classify">
<u-grid :border="false" col="5">
<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>
<u-toast ref="uToast" />
</view>
<!-- 分类模块下的轮播图 -->
<view>
<u-swiper :list="swiperList" indicatorMode="line" radius="0" circular></u-swiper>
</view>
<!-- 选项卡: 上架时间和点赞量 -->
<view>
<u-tabs :list="tabList" lineColor="#15CA65" :is-scroll="false"
activeStyle="color:#15CA65;font-weight: bold;">
</u-tabs>
</view>
<!-- 产品 -->
<products></products>
</view>
</view>
</template>
<script>
export default {
data() {
return {
classifyList: [{
src: '/static/classify/sy_icon_hp.png',
title: '烘培宝典'
},
{
src: '/static/classify/sy_icon_ls.png',
title: '零食铺子'
},
{
src: '/static/classify/sy_icon_yp.png',
title: '饮品大全'
},
{
src: '/static/classify/sy_icon_tw.png',
title: '调味菜单'
},
{
src: '/static/classify/sy_icon_rs.png',
title: '肉食荟萃'
},
{
src: '/static/classify/sy_icon_np.png',
title: '乳品手册'
},
{
src: '/static/classify/sy_icon_gs.png',
title: '果蔬地图'
},
{
src: '/static/classify/sy_icon_sj.png',
title: '食界新贵'
},
{
src: '/static/classify/sy_icon_hz.png',
title: '欢喜盒子'
},
{
src: '/static/classify/sy_icon_cy.png',
title: '创意工具'
},
],
tabList: [{
name: '上架时间'
},
{
name: '点赞量'
},
],
swiperList: [
'/static/products/sy_bg.png',
'https://cdn.uviewui.com/uview/swiper/swiper3.png'
],
}
},
onPullDownRefresh() {
//关闭下拉刷新
uni.stopPullDownRefresh()
},
methods: {
toSearch() {
console.log('--search')
uni.navigateTo({
url: '/pages/index/search/search'
})
//点击一级分类
click(listIndex) {
this.$refs.uToast.success(`点击了第${listIndex}`)
}
}
}
</script>
<style lang="scss">
.input_block {
// 搜索框样式
.search_box {
background: linear-gradient(135deg, #12CA64 0%, #1ACA67 100%);
.input_block_border {
.search_box_border {
width: 94.6%;
height: 124rpx;
background: linear-gradient(320deg, #36E182 0%, #26DD76 100%, #26DD76 100%);
@@ -51,8 +129,59 @@
height: 64rpx;
border-radius: 32rpx;
background-color: #fff;
.u-input__content__field-wrapper__field {
font-size: 26rpx !important;
}
}
}
}
}
</style>
.content {
//分类模块
.classify {
height: 350rpx;
background: #FFFFFF;
border-radius: 24rpx;
box-shadow: 0px 2px 4px 0px rgba(206, 206, 206, 0.5);
.u-grid {
padding-top: 30rpx;
.grid-text {
padding-top: 8rpx;
font-size: 24rpx;
}
.u-grid-item {
padding-bottom: 38rpx;
}
}
}
//轮播图
.u-swiper__wrapper__item__wrapper {
margin-top: 20rpx;
height: 290rpx;
}
.u-swiper-indicator__wrapper {
display: none !important;
}
// 选项卡
.u-tabs__wrapper__nav {
background-color: #FFFFFF;
.u-tabs__wrapper__nav__item {
padding: 0 !important;
flex: 1;
}
}
}
</style>

View File

@@ -0,0 +1,29 @@
<template>
<view>
<myForm></myForm>
<u-button type="success" text="确定" color="#0EBB5B"></u-button>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style lang="scss">
.u-button {
width: 644rpx !important;
height: 86rpx !important;
background: #0EBB5B;
border-radius: 20rpx !important;
margin-top: 168rpx;
}
</style>

View File

@@ -0,0 +1,196 @@
<template>
<view>
<view class="products_box">
<u-grid :border="false" col="2">
<u-grid-item v-for="(item,index) in productList" :key="index">
<u-image src="/static/products/sy_bb.png" width="354rpx" height="539rpx" :lazy-load="true">
</u-image>
<view class="bgContent">
<view>
<u-image :src="item.src" width="346rpx" height="320rpx" :lazy-load="true"
@click="toDetailPage()">
</u-image>
<view class="img_tag">{{item.img_tag}}</view>
</view>
<view style="padding: 16rpx;">
<view class="title_box">
<text class="title">{{item.title}}</text>
<u-tag :text="item.tag" type="warning" shape="circle"></u-tag>
</view>
<view class="product_desc">
{{item.desc}}
</view>
<view class="releaseDate">
<u-image src="/static/products/sy_icon_sjf.png" width="22rpx" height="22rpx"
:lazy-load="true">
</u-image>
<text class="release">发布日期</text>
<text>{{item.time}}</text>
</view>
</view>
</view>
<u-button v-if="type==1" type="success" text="移除" color="#0EBB5B"></u-button>
<u-button v-if="type==2" type="success" text="取消收藏" color="#0EBB5B"></u-button>
</u-grid-item>
</u-grid>
</view>
</view>
</template>
<script>
export default {
data() {
return {
type: '',
productList: [{
src: '/static/products/zhanwei_dg.png',
title: '锅巴',
tag: '无添加剂',
img_tag: '零食铺子',
desc: '糯米蟹黄锅巴散装,非油炸绿色健康食品',
time: '2022-12-04'
},
{
src: '/static/products/zhanwei_dg(2).png',
title: '干吃汤圆',
tag: '天然原料',
img_tag: '糕点卷酥',
desc: '休闲食品厂家甜品糯米食品零食闽南特产宵夜好吃糍粑',
time: '2022-12-04'
},
{
src: '/static/products/zhanwei_dg(1).png',
title: '紫薯魔芋人参魔芋人参魔芋人参…',
tag: '天然原料',
img_tag: '健康创新',
desc: '紫薯魔芋人参代餐粉 冲调饮品贴牌加工 五谷杂粮粉代餐',
time: '2022-12-04'
},
{
src: '/static/products/zhanwei_dg(3).png',
title: '焦糖饼干',
tag: '无防腐剂',
img_tag: '饼干曲奇',
desc: '比利时风味焦糖饼干代餐小吃零食品',
time: '2022-12-04'
}
]
}
},
onLoad(options) {
this.type = options.id
},
methods: {
}
}
</script>
<style lang="scss">
.u-button {
width: 150rpx !important;
height: 50rpx !important;
background: #0EBB5B;
border-radius: 10rpx !important;
margin-top: 22rpx;
margin-bottom: 50rpx;
}
.products_box {
padding: 10rpx;
.u-grid-item {
.bgContent {
position: absolute;
right: 0;
top: 0;
.u-image__image {
margin-left: 6px;
}
.img_tag {
position: absolute;
padding: 2rpx 8rpx;
right: 5px;
top: 30rpx;
border-radius: 54rpx 0px 0px 54rpx;
box-shadow: 0px 2rpx 4rpx 0px #078C42;
background: linear-gradient(135deg, #0DB658 0%, #16DD6D 100%);
font-size: 20rpx;
color: #FFFFFF;
line-height: 28rpx;
}
.title_box {
position: relative;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
.title {
width: 186rpx;
font-size: 26rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: bold;
color: #0EBB5B;
line-height: 37rpx;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.u-tag {
height: 26rpx;
line-height: 26rpx;
background: linear-gradient(124deg, #FEAA19 0%, #FDCF3A 100%);
.u-tag__text {
font-size: 20rpx;
}
}
}
.product_desc {
font-size: 22rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #3E3E3E;
line-height: 26rpx;
margin-top: 24rpx;
margin-bottom: 20rpx;
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
.releaseDate {
font-size: 22rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #A3A3A3;
line-height: 26rpx;
display: flex;
align-items: center;
padding-bottom: 25rpx;
image {
margin-left: 0;
}
.release {
padding: 0 10rpx 0 5rpx;
}
}
}
}
}
</style>

View File

@@ -0,0 +1,91 @@
<template>
<view>
<u-navbar :autoBack="true" title="会员中心"></u-navbar>
<u--image src="/static/my/wo_icon_hyzxbj.png" width="750rpx" height="349rpx" :lazy-load="true">
</u--image>
<myAvatar></myAvatar>
<myForm></myForm>
<view class="commitment">
{{commitment}}
</view>
<u-button type="success" text="升级VIP" color="#0EBB5B" @click="showModal()"></u-button>
<u-modal :show="showM" closeOnClickOverlay confirmText="确定" @confirm="confirm" @close="close">
<rich-text :nodes="content"></rich-text>
</u-modal>
</view>
</template>
<script>
export default {
data() {
return {
showM: false,
content: `请保持手机畅通<br>
客服会及时联系您`,
commitment: '承诺声明预留文字位置承诺声明预留文字位置承诺声明预留文字位置承诺声明预留文字位置承诺声明预留文字位置承诺声明预留文字位置承诺声明预留文字位置承诺声明预留文字位置承诺声明预留文字位置承诺声明预留文字位置承诺声明预留文字位置承诺声明预留文字位置'
}
},
methods: {
// 联系客服模态框
showModal() {
this.showM = true
},
confirm() {
this.showM = false
},
cancel() {
this.showM = false
},
close() {
this.showM = false
},
}
}
</script>
<style lang="scss">
.commitment {
font-size: 26rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #C8C8C8;
line-height: 28rpx;
margin: 40rpx 66rpx;
}
.u-button {
width: 644rpx !important;
height: 86rpx !important;
background: #0EBB5B;
border-radius: 20rpx !important;
}
.u-modal {
width: 472rpx !important;
}
.u-modal__content {
padding: 43rpx 104rpx !important;
text-indent: 14rpx;
}
.u-modal__content__text {
font-size: 32rpx !important;
font-weight: 400;
color: #252421 !important;
}
.u-modal__button-group__wrapper--hover {
background: #0EBB5B !important;
}
.u-modal__button-group__wrapper--confirm {
background: #0EBB5B;
.u-modal__button-group__wrapper__text {
color: #fff !important;
}
}
</style>

View File

@@ -1,6 +1,163 @@
<!-- 个人中心 -->
<template>
<view class="components-theme">
我的
<view>
<u-navbar :autoBack="false" title="我的"></u-navbar>
<u--image src="/static/my/wo_icon_bj1.png" width="750rpx" height="349rpx" :lazy-load="true">
</u--image>
<myAvatar></myAvatar>
<view class="table">
<u-cell-group>
<u-cell size="large" title="绑定公司" icon="/static/my/wo_icon_bd.png" :isLink="true" value="未绑定公司"
@click="bindCompany()">
</u-cell>
<u-cell size="large" title="会员中心" icon="/static/my/wo_icon_hyzx.png" :isLink="true"
@click="toMemberCenter()"></u-cell>
<u-cell size="large" title="浏览记录" icon="/static/my/wo_icon_lljl.png" :isLink="true"
@click="toBrowseHistory()"></u-cell>
<u-cell size="large" title="我的收藏" icon="/static/my/wo_icon_sc.png" :isLink="true"
@click="toMyCollect()"></u-cell>
<u-cell size="large" title="联系客服" icon="/static/my/wo_icon_lxkf.png" :isLink="true"
@click="showModal()">
</u-cell>
</u-cell-group>
<u-modal :show="showM" showCancelButton closeOnClickOverlay confirmText="是" cancelText="否"
@confirm="confirm" @cancel="cancel" @close="close">
<rich-text :nodes="content"></rich-text>
</u-modal>
</view>
</view>
</template>
<script>
export default {
data() {
return {
show: false,
showM: false,
content: `138 1222 222<br>
是否拨打客服电话`,
}
},
methods: {
//跳转到绑定公司页面
bindCompany() {
uni.navigateTo({
url: '/pages/my/bindCompony/bindCompony'
})
},
//跳转到会员中心页面
toMemberCenter() {
uni.navigateTo({
url: '/pages/my/memberCenter/memberCenter'
})
},
//跳转到浏览记录页面
toBrowseHistory() {
uni.navigateTo({
url: '/pages/my/browseHistory/browseHistory?id=' + 1
})
},
//跳转到我的收藏页面
toMyCollect() {
uni.navigateTo({
url: '/pages/my/browseHistory/browseHistory?id=' + 2
})
},
// 联系客服模态框
showModal() {
this.showM = true
},
confirm() {
this.showM = false
let phone = '1381222222'
uni.makePhoneCall({
phoneNumber: phone,
success: function() {
console.log('拨打电话成功');
},
fail() {
console.log('打电话失败了');
}
})
},
cancel() {
this.showM = false
},
close() {
this.showM = false
},
}
}
</script>
<style lang="scss">
.table {
background-color: #fff;
margin-top: 50rpx;
}
.u-line {
display: none !important;
}
.u-cell--clickable {
background-color: #fff !important;
}
.u-cell {
border-bottom: 1rpx solid #EEEEEE;
}
.u-icon__icon--info {
font-size: 28rpx !important;
}
.u-cell__title-text {
margin-left: 20rpx;
font-size: 24rpx !important;
color: #252421;
line-height: 33rpx !important;
}
.u-cell__value {
font-size: 24rpx !important;
color: #CCCCCC !important;
}
.u-modal {
width: 472rpx !important;
}
.u-modal__button-group__wrapper--cancel {
background: #D8D8D8;
.u-modal__button-group__wrapper__text {
color: #fff !important;
}
}
.u-modal__content {
padding: 43rpx 104rpx !important;
text-indent: 25rpx;
}
.u-modal__content__text {
font-size: 32rpx !important;
font-weight: 400;
color: #252421 !important;
}
.u-modal__button-group__wrapper--confirm {
background: #0EBB5B;
.u-modal__button-group__wrapper__text {
color: #fff !important;
}
}
</style>

View File

@@ -0,0 +1,67 @@
<template>
<view style="margin-top: 20rpx; height: 1176rpx;background: #FFFFFF;">
<certifiedCj></certifiedCj>
<view v-if="cjsShow" class="no-data">已经到底啦</view>
</view>
</template>
<script>
export default {
data() {
return {
cjsShow: true,
}
},
methods: {
// this.cjsShow = this.list.length === 0 ? true : false
}
}
</script>
<style lang="scss">
.no-data {
text-align: center;
margin-top: 29rpx;
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #BBBBBB;
line-height: 28rpx;
}
.xw_content {
background: #FFFFFF;
border: 1rpx solid #EEEEEE;
display: flex;
padding: 29rpx 19rpx;
.xw_right {
padding-left: 19rpx;
display: flex;
flex-direction: column;
.xw_title {
font-size: 30rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: bold;
color: #3E3E3E;
line-height: 42rpx;
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
.cj_tags {
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #969696;
line-height: 33rpx;
padding-right: 10rpx;
margin-top: 35rpx;
}
}
}
</style>

View File

@@ -0,0 +1,34 @@
<template>
<view style="margin-top: 20rpx; height: 1176rpx;background: #FFFFFF;">
<news></news>
<view v-if="newsShow" class="no-data">已经到底啦</view>
</view>
</template>
<script>
export default {
data() {
return {
newsShow: true,
}
},
onLoad() {
},
methods: {
// this.newsShow = this.list.length === 0 ? true : false
}
}
</script>
<style lang="scss">
.no-data {
text-align: center;
margin-top: 29rpx;
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #BBBBBB;
line-height: 28rpx;
}
</style>

View File

@@ -1,5 +1,134 @@
<template>
<view>
行业报告
<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/report/news/news'
})
} else if (listIndex == 2) {
uni.navigateTo({
url: '/pages/report/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>