odjbin/pupil
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首页图片获取，行业报告中行业新闻及详情页和新品发布及详情页接口对接完毕

Browse Source
This commit is contained in:
clay
2022-12-28 22:15:56 +08:00
parent 8c63db07ab
commit b3b0b620bf
9 changed files with 89 additions and 184 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
components/certifiedCj/certifiedCj.vue
View File

@@ -1,7 +1,7 @@
<template>
<view>
<view class="xw_content" v-for="(item,index) in cjsList" :key="index" @click="clickCj(item)">
<u--image :src="item.cover" width="112rpx" height="112rpx" :lazy-load="true">
<u--image :src="imgUrl+item.cover" width="112rpx" height="112rpx" :lazy-load="true">
</u--image>
<view class="xw_right">
<view class="xw_title">
@@ -22,42 +22,13 @@
export default {
data() {
return {
cjsList: [
// {
// src: '/static/report/zhanwei_xf(1).png',
// title: '西安兴沃丰餐饮管理有限责任公司',
// tags: [{
// tag: '咖啡'
// },
// {
// tag: '饮品'
// }
// ]
// },
// {
// src: '/static/report/zhanwei_xf(1).png',
// title: '福建省海纳川食品有限公司',
// tags: [{
// tag: '活冻鲍鱼'
// },
// {
// tag: '鲍鱼罐头'
// },
// {
// tag: '佛跳墙'
// },
// {
// tag: '海螺片'
// }
// ]
// },
]
cjsList: [],
imgUrl: '',
}
},
created() {
this.getCertifiedCj()
this.imgUrl = uni.getStorageSync('img_url')
},
methods: {
// 获取认证厂家列表

22
components/news/news.vue
View File

@@ -1,7 +1,7 @@
<template>
<view>
<view class="xw_content" v-for="(item,index) in newsList" :key="index" @click="clickNews(item)">
<u--image :src="item.cover" width="192rpx" height="122rpx" :lazy-load="true">
<u--image :src="imgUrl+item.cover" width="192rpx" height="122rpx" :lazy-load="true">
</u--image>
<view class="xw_right">
<view class="xw_title">
@@ -27,25 +27,13 @@
export default {
data() {
return {
newsList: [
// {
// src: '/static/report/zhanwei_xf.png',
// title: '2022近50款食品饮料新品，创新的方向都在这里',
// time: '2022-12-03 09:59',
// place: '第一食品资讯官方账号'
// },
// {
// src: '/static/report/zhanwei_xf.png',
// title: '食品企业如何开发新产品？创新思维又发挥着怎样的效应呢？',
// time: '2022-10-18 14:43',
// place: '腾讯新闻 '
// },
],
imgUrl: '',
newsList: [],
}
},
created() {
this.getNews()
this.imgUrl = uni.getStorageSync('img_url')
},
methods: {
//获取行业新闻
@@ -55,7 +43,7 @@
// }
getNews() {
this.$apiServe.getNews().then(res => {
console.log('行业新闻', res.data.data)
// console.log('行业新闻', res.data.data)
for (const item of res.data.data) {
item.pub_time_str = dateFormat(item.pub_time_str)
}

49
components/products/products.vue
View File

@@ -7,14 +7,14 @@
</u-image>
<view class="bgContent">
<view>
<u-image :src="item.cover" width="346rpx" height="320rpx" :lazy-load="true">
<u-image :src="imgUrl+item.cover" width="346rpx" height="320rpx" :lazy-load="true">
</u-image>
<view class="img_tag">{{item.cate_name}}</view>
</view>
<view style="padding: 14rpx 22rpx;">
<view class="title_box">
<text class="title">{{item.name}}</text>
<u-tag :text="item.tag" type="warning" shape="circle"></u-tag>
<u-tag :text="item.tags" type="warning" shape="circle"></u-tag>
</view>
<view class="product_desc">
{{item.title}}
@@ -38,45 +38,14 @@
export default {
data() {
return {
productList: [
// {
// src: '/static/products/zhanwei_dg.png',
// title: '锅巴',
// tag: '无添加剂',
// img_tag: '零食铺子',
// desc: '糯米蟹黄锅巴散装，非油炸绿色健康食品',
// time: '2022-12-04'
// },
// {
// src: '/static/products/zhanwei_dg.png',
// title: '干吃汤圆',
// tag: '天然原料',
// img_tag: '糕点卷酥',
// desc: '休闲食品厂家甜品糯米食品零食闽南特产宵夜好吃糍粑',
// time: '2022-12-04'
// },
// {
// src: '/static/products/zhanwei_dg.png',
// title: '紫薯魔芋人参魔芋人参魔芋人参…',
// tag: '天然原料',
// img_tag: '健康创新',
// desc: '紫薯魔芋人参代餐粉 冲调饮品贴牌加工 五谷杂粮粉代餐',
// time: '2022-12-04'
// },
// {
// src: '/static/products/zhanwei_dg.png',
// title: '焦糖饼干',
// tag: '无防腐剂',
// img_tag: '饼干曲奇',
// desc: '比利时风味焦糖饼干代餐小吃零食品',
// time: '2022-12-04'
// }
],
imgUrl: '',
tagsArray: [],
productList: [],
}
},
created() {
this.getProducts()
this.imgUrl = uni.getStorageSync('img_url')
},
methods: {
@@ -85,6 +54,12 @@
// console.log("子组件的获取产品列表方法====");
this.$apiServe.getProducts().then(res => {
// console.log(res.data.data)
let tags = res.data.data
for (const item of tags) {
let tag = item.tags
this.tagsArray = tag.split(',')
item.tags = this.tagsArray[0]
}
this.productList = res.data.data
}).finally(_ => {})

3
packageReport/certifiedCjDetail/certifiedCjDetail.vue
View File

@@ -34,7 +34,6 @@
return {
id: '',
detailList: [],
// src: '/static/detail/cj_bg.png',
features: '活冻鲍鱼,冻煮鲍鱼,鲍鱼罐头 佛跳墙,海螺片',
business_introduce: '福建省海纳川食品有限公司是一家从事水产养殖，加工与销售为一体的现代化企业，公司主要加工：活冻鲍鱼，溏心皇金鲍，兰花蟹，黄金鲍片，佛跳墙，大盆菜，火锅小章鱼，鲨鱼礼盒等系列产品。公司位于福建省自由贸易试验区马尾片区，离全国大的水产交易市场--马尾名成水产市场不到一公里，这里交通方便，商贾云集，冷链物流通达全国。',
showList: [{
@@ -56,7 +55,7 @@
}
},
onLoad(option) {
console.log('认证厂家id', option.id);
// console.log('认证厂家id', option.id);
this.id = option.id
this.getCertifiedCjDetail()
},

16
packageReport/xwDetail/xwDetail.vue
View File

@@ -18,19 +18,17 @@
</template>
<script>
import {
dateFormatXwDetail
} from '../../utills/date.js'
export default {
data() {
return {
id: '',
detailList: []
// title: '2022近50款食品饮料新品，创新的方向都在这里',
// time: '2022-12-03 09:59',
// place: '第一食品资讯官方账号',
// news: '<h1>一级标题</h1><br/><h2>二级标题</h2>'
detailList: [],
}
},
onLoad(option) {
console.log('新闻详情id', option.id);
this.id = option.id
this.getNewsDetail()
},
@@ -38,9 +36,11 @@
//获取行业新闻详情
getNewsDetail() {
this.$apiServe.getNewsDetail(this.id).then(res => {
console.log('新闻详情页', res.data.data)
// console.log('新闻详情页', res.data.data)
let detail = res.data.data
detail.pub_time = dateFormatXwDetail(detail.pub_time)
this.detailList = res.data.data
}).finally(_ => {})
},
}

39
pages/detail/productsDetail/productsDetail.vue
View File

@@ -1,9 +1,8 @@
<template>
<view>
<view :key="index">
<u-swiper :list="detailList.images" indicatorMode="line " width="750rpx" height="530rpx" radius="0"
circular>
</u-swiper>
<u-image :src="imgUrl+detailList.cover" width="750rpx" height="530rpx">
</u-image>
<view class="collect">
<view class="star">
<u-image v-if="showStar==false" src="/static/detail/xp_icon_wstar.png" width="28rpx" height="28rpx"
@@ -31,8 +30,7 @@
</view>
<view class="tag_view">
<view>
<text class="tagOne">{{detailList.tags}}</text>
<!-- <text class="tagTwo">{{item.tagTwo}}</text> v-for="item in detailList.tags" :key="item.id" -->
<text class="tagOne" v-for="item in detailList.tags" :key="item.id">{{item}}</text>
</view>
<view v-if="isThumb==false" class="heart">
<u-image v-if="showHeart==false" src="/static/detail/xp_icon_heart.png" width="34rpx"
@@ -64,44 +62,39 @@
</template>
<script>
import {
dateFormatDetail
} from '../../../utills/date.js'
export default {
data() {
return {
id: '',
imgUrl: '',
tagsArray: [],
showStar: false,
showHeart: false,
isThumb: false,
detailList: [
// {
// title: '锅巴',
// tag: '零食铺子',
// desc: '糯米蟹黄锅巴散装，非油炸绿色健康食品',
// classify: '薯片膨化',
// tagOne: '无添加剂1',
// tagTwo: '无添加剂',
// time: '2022年12月04日',
// content: '<h1>一级标题</h1><br/><h2>二级标题</h2>'
// },
],
swiperList: [
'/static/detail/zhanwei_xppx.png',
'/static/detail/zhanwei_xppx.png'
]
detailList: []
}
},
onLoad(option) {
console.log('产品id', option.id);
this.id = option.id
this.getProductDetail()
this.imgUrl = uni.getStorageSync('img_url')
},
methods: {
//获取详情信息
getProductDetail() {
this.$apiServe.getProductDetail(this.id).then(res => {
// console.log('详情页', res.data.data.thumb)
// console.log('详情页', res.data.data)
if (res.data.data.thumb) {
this.isThumb = true
}
let detail = res.data.data
detail.pub_time = dateFormatDetail(detail.pub_time)
let tag = detail.tags
this.tagsArray = tag.split(',')
detail.tags = this.tagsArray
this.detailList = res.data.data
}).finally(_ => {})
},

70
pages/index/index.vue
View File

@@ -14,7 +14,7 @@
<view class="classify">
<u-grid :border="false" col="5">
<u-grid-item v-for="(listItem,listIndex) in classifyList" :key="listIndex" @click="toClassify()">
<u--image :src="listItem.icon" width="86rpx" height="86rpx" :lazy-load="true">
<u--image :src="imgUrl+listItem.icon" width="86rpx" height="86rpx" :lazy-load="true">
</u--image>
<!-- <u-icon size="86rpx" :name="listItem.icon"></u-icon> -->
<text class="grid-text">{{listItem.name}}</text>
@@ -23,7 +23,7 @@
</view>
<!-- 分类模块下的轮播图 -->
<view>
<u-swiper :list="swiperList" indicatorMode="line" radius="0" circular></u-swiper>
<u-swiper :list="swiperList" keyName="img" indicatorMode="line" radius="0" circular></u-swiper>
</view>
@@ -49,48 +49,7 @@
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: '创意工具'
// },
],
classifyList: [],
tabList: [{
name: '上架时间'
},
@@ -98,11 +57,8 @@
name: '点赞量'
},
],
// swiperList: [
// 'https://cdn.uviewui.com/uview/swiper/swiper3.png',
// 'https://cdn.uviewui.com/uview/swiper/swiper3.png'
// ],
imgUrl: '',
swiperList: [],
}
},
onPullDownRefresh() {
@@ -118,32 +74,26 @@
this.getBanner()
this.getImgUrl()
// this.$refs.getProducts.getProducts()
this.imgUrl = uni.getStorageSync('img_url')
},
methods: {
//获取一级分类
getCategories() {
this.$apiServe.getCategories().then(res => {
// console.log(res.data.data)
this.classifyList = res.data.data
}).finally(_ => {})
},
//获取首页轮播图
getBanner() {
this.$apiServe.getBanner().then(res => {
// console.log(res.data.data);
let banner = res.data.data
for (const item of banner) {
this.swiperList = item.img
// console.log(item);
item.img = this.imgUrl + item.img
}
// this.swiperList = res.data.data
this.swiperList = res.data.data
}).finally(_ => {})
},
//点击一级分类
// click(listIndex) {
// this.$refs.uToast.success(`点击了第${listIndex}个`)
// },
//点击搜索框跳转到搜索页面
toSearch() {
uni.navigateTo({
@@ -165,8 +115,6 @@
console.log("登录code", code);
//客户端成功获取授权临时票据（code）,向业务服务器发起登录请求。
// 调用登录接口 拿到token 传手机code,更新手机号码
},
@@ -184,7 +132,7 @@
},
getImgUrl() {
this.$apiServe.getImgUrl().then(res => {
console.log(res)
// console.log(res)
try {
uni.setStorageSync('img_url', res.data.data.img_url);
} catch (e) {

1
pages/report/report.vue
View File

@@ -4,7 +4,6 @@
<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>

36
utills/date.js
View File

@@ -9,8 +9,40 @@ function dateFormat(time) {
let seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
// 拼接
return year + "-" + month + "-" + day + " " + hours + ":" + minutes;
// return year + "-" + month + "-" + day;
}
//时间戳转换为2022年2月2日格式
function dateFormatDetail(time) {
time = time * 1000
let date = new Date(time);
let year = date.getFullYear();
// 在日期格式中，月份是从0开始的，因此要加0，使用三元表达式在小于10的前面加0，以达到格式统一 如 09:11:05
let month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
let hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
let minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
let seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
// 拼接
return year + "年" + month + "月" + day + "日";
}
//时间戳转换为2022-12-03 09:59
function dateFormatXwDetail(time) {
time = time * 1000
let date = new Date(time);
let year = date.getFullYear();
// 在日期格式中，月份是从0开始的，因此要加0，使用三元表达式在小于10的前面加0，以达到格式统一 如 09:11:05
let month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
let hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
let minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
let seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
// 拼接
return year + "-" + month + "-" + day + " " + hours + ":" + minutes;
}
module.exports = {
dateFormat
dateFormat,
dateFormatDetail,
dateFormatXwDetail
}