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-25 16:05:39 +08:00
parent 4050e638f0
commit fd6f5b5390
7 changed files with 305 additions and 191 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
components/products/products.vue
View File

@@ -2,31 +2,29 @@
<view>
<view class="products_box">
<u-grid :border="false" col="2">
<u-grid-item v-for="(item,index) in productList" :key="index">
<u-grid-item v-for="(item,index) in productList" :key="index" @click="toDetailPage(item)">
<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 :src="item.cover" width="346rpx" height="320rpx" :lazy-load="true">
</u-image>
<view class="img_tag">{{item.img_tag}}</view>
<view class="img_tag">{{item.cate_name}}</view>
</view>
<view style="padding: 14rpx 22rpx;">
<view class="title_box">
<text class="title">{{item.title}}</text>
<text class="title">{{item.name}}</text>
<u-tag :text="item.tag" type="warning" shape="circle"></u-tag>
</view>
<view class="product_desc">
{{item.desc}}
{{item.title}}
</view>
<view class="releaseDate">
<u-image src="/static/products/xp_icon_sjf.png" width="22rpx" height="22rpx"
:lazy-load="true">
</u-image>
<text class="release">发布日期：</text>
<text>{{item.time}}</text>
<text>{{item.pub_time}}</text>
</view>
</view>
</view>
@@ -37,49 +35,72 @@
</template>
<script>
// import {
// simpleDateFormat,
// simpleDateFormatByMoreLine
// } from '@/utills/util.js'
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'
}
]
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'
// }
],
query: {
sortType: 1,
pageSize: 4,
pageNum: 1
}
}
},
created() {
this.getProducts()
},
methods: {
//获取产品列表
getProducts() {
// console.log("子组件的获取产品列表方法====");
this.$apiServe.getProducts(this.query).then(res => {
// console.log(res.data.data)
this.productList = res.data.data
}).finally(_ => {})
},
//点击图片跳转到详情页
toDetailPage() {
toDetailPage(item) {
uni.navigateTo({
url: '/pages/detail/productsDetail/productsDetail'
url: '/pages/detail/productsDetail/productsDetail?id=' + item.id
})
}
}