|
|
|
@ -29,30 +29,66 @@ |
|
|
|
</view> |
|
|
|
<!-- 商品列表 --> |
|
|
|
<view class="glistzone"> |
|
|
|
<Goods :dataList="gdlist" /> |
|
|
|
<view class="diy-goods"> |
|
|
|
<view class="goods-list display__list column__2"> |
|
|
|
<mescroll-body ref="mescrollRef" :sticky="true" @init="mescrollInit" :down="{ native: true }" @down="downCallback" :up="upOption" @up="upCallback"> |
|
|
|
<view class="goods-item" v-for="(dataItem, index) in gdlist.data" :key="index" @click="onTargetGoods(dataItem.goods_islicode)"> |
|
|
|
<!-- 多列商品 --> |
|
|
|
<block> |
|
|
|
<!-- 标的图片 --> |
|
|
|
<view class="goods-image"> |
|
|
|
<image class="image" mode="aspectFill" :src="dataItem.goods_image"></image> |
|
|
|
</view> |
|
|
|
<view class="detail"> |
|
|
|
<!-- 标的标题 --> |
|
|
|
<view class="goods-name"> |
|
|
|
<text class="twoline-hide">{{ dataItem.goods_name }}</text> |
|
|
|
</view> |
|
|
|
<!-- 标的价格 && 销量--> |
|
|
|
<view class="detail-price oneline-hide"> |
|
|
|
<text class="goods-price f-30 col-m">￥ {{ dataItem.price }}</text> |
|
|
|
<text class="sale-count col-9 f-24">销量：{{ dataItem.sale_count }}</text> |
|
|
|
</view> |
|
|
|
<!-- 标的所有者的信息 --> |
|
|
|
<view class="detail-owner oneline-hide"> |
|
|
|
<text class="oneline-hide"> {{dataItem.username}} </text> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</block> |
|
|
|
|
|
|
|
</view> |
|
|
|
</mescroll-body> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { setCartTabBadge } from '@/core/app' |
|
|
|
import * as Api from '@/api/page' |
|
|
|
// import Page from '@/components/page' |
|
|
|
import Banner from './components/banner' |
|
|
|
import Search from './components/search' |
|
|
|
import Goods from './components/goods' |
|
|
|
|
|
|
|
import * as Gapi from '@/api/goods' |
|
|
|
// 滚动加载 |
|
|
|
import MescrollBody from '@/components/mescroll-uni/mescroll-body.vue' |
|
|
|
import MescrollMixin from '@/components/mescroll-uni/mescroll-mixins' |
|
|
|
import { getEmptyPaginateObj, getMoreListData } from '@/core/app' |
|
|
|
|
|
|
|
const App = getApp() |
|
|
|
|
|
|
|
// 每页记录数量 |
|
|
|
const pageSize = 15 |
|
|
|
|
|
|
|
export default { |
|
|
|
components: { |
|
|
|
Banner, |
|
|
|
Search, |
|
|
|
Goods |
|
|
|
// 滚动标签 |
|
|
|
MescrollBody |
|
|
|
}, |
|
|
|
mixins: [MescrollMixin], |
|
|
|
data() { |
|
|
|
return { |
|
|
|
// 页面参数 |
|
|
|
@ -60,7 +96,22 @@ |
|
|
|
// 图片列表 |
|
|
|
imglist:[], |
|
|
|
// 商品列表 |
|
|
|
gdlist:[] |
|
|
|
gdlist: getEmptyPaginateObj(), |
|
|
|
// 上拉加载配置 |
|
|
|
upOption: { |
|
|
|
// 首次自动执行 |
|
|
|
auto: true, |
|
|
|
// 每页数据的数量; 默认10 |
|
|
|
page: { size: pageSize }, |
|
|
|
// 数量要大于4条才显示无更多数据 |
|
|
|
noMoreSize: 4, |
|
|
|
// 空布局 |
|
|
|
empty: { |
|
|
|
tip: '暂无记录' |
|
|
|
} |
|
|
|
}, |
|
|
|
// 控制onShow事件是否刷新订单列表 |
|
|
|
canReset: false, |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
@ -71,19 +122,32 @@ |
|
|
|
onLoad(options) { |
|
|
|
// 当前页面参数 |
|
|
|
this.options = options |
|
|
|
// 注册全局事件订阅: 是否刷新列表 |
|
|
|
uni.$on('syncRefresh', canReset => { |
|
|
|
this.canReset = canReset |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
/** |
|
|
|
* 生命周期函数--监听页面显示 |
|
|
|
*/ |
|
|
|
onShow() { |
|
|
|
// 更新购物车角标 |
|
|
|
setCartTabBadge() |
|
|
|
this.canReset && this.onRefreshList() |
|
|
|
this.canReset = false |
|
|
|
}, |
|
|
|
/** |
|
|
|
* 生命周期函数--监听页面的卸载 |
|
|
|
*/ |
|
|
|
onUnload() { |
|
|
|
// 卸载全局事件订阅 |
|
|
|
uni.$off('syncRefresh') |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
mounted() { |
|
|
|
this.getBannerList(); |
|
|
|
// |
|
|
|
this.getHomeList(); |
|
|
|
//this.getHomeList(); |
|
|
|
}, |
|
|
|
|
|
|
|
methods: { |
|
|
|
@ -97,62 +161,70 @@ |
|
|
|
console.log(err) |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
//商品列表 |
|
|
|
getHomeList(){ |
|
|
|
// 搜索的内容 |
|
|
|
getHomeList(pageNo = 1){ |
|
|
|
const app = this |
|
|
|
// 必须的字段 |
|
|
|
let stimestamp = new Date().getTime() |
|
|
|
let rqdata = {"pay_type":2,"goods_status":1,"page":1,"limit":6} |
|
|
|
// let rqdata = {"pay_type":2,"goods_status":1,"page":1,"limit":6,timestamp:stimestamp} |
|
|
|
//let rqdata={pay_type: 1,record_type: 2,goods_status: 1,page: 1,limit: 6} |
|
|
|
Gapi.soglist(rqdata) |
|
|
|
// Gapi.nbgoods(rqdata) |
|
|
|
// Gapi.souser({appkey:"006",timestamp:stimestamp,page:1,limit:16}) |
|
|
|
// promise 方式 |
|
|
|
return new Promise((resolve, reject) => { |
|
|
|
let rqdata = {"pay_type":2,"goods_status":1,"page":pageNo,"limit":pageSize} |
|
|
|
// 获取列表 |
|
|
|
Gapi.nbgoods(rqdata) |
|
|
|
.then(res=>{ |
|
|
|
console.log("res",res) |
|
|
|
this.gdlist = res.data |
|
|
|
}).catch(err=>{ |
|
|
|
console.log(err) |
|
|
|
}); |
|
|
|
} |
|
|
|
// 合并新数据 |
|
|
|
const newList = app.initList(res.data) |
|
|
|
console.log(newList,"newlist") |
|
|
|
app.gdlist.data = getMoreListData(newList, app.gdlist, pageNo) |
|
|
|
resolve(newList) |
|
|
|
}) |
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
/** |
|
|
|
* 下拉刷新 |
|
|
|
* 上拉加载的回调 (页面初始化时也会执行一次) |
|
|
|
* 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10 |
|
|
|
* @param {Object} page |
|
|
|
*/ |
|
|
|
onPullDownRefresh() { |
|
|
|
// 获取首页数据 |
|
|
|
this.getPageData(() => { |
|
|
|
uni.stopPullDownRefresh() |
|
|
|
upCallback(page) { |
|
|
|
const app = this |
|
|
|
// 设置列表数据 |
|
|
|
app.getHomeList(page.num) |
|
|
|
.then(list => { |
|
|
|
const curPageLen = list.data.length |
|
|
|
const totalSize = list.data.total |
|
|
|
app.mescroll.endBySize(curPageLen, totalSize) |
|
|
|
}) |
|
|
|
.catch(() => app.mescroll.endErr()) |
|
|
|
// 标的列表 |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
// 初始化订单列表数据 |
|
|
|
initList(newList) { |
|
|
|
newList.data.forEach(item => { |
|
|
|
item.username = item.user.name |
|
|
|
}) |
|
|
|
return newList |
|
|
|
}, |
|
|
|
|
|
|
|
// 刷新订单列表 |
|
|
|
onRefreshList() { |
|
|
|
this.gdlist = getEmptyPaginateObj() |
|
|
|
|
|
|
|
setTimeout(() => { |
|
|
|
this.mescroll.resetUpScroll() |
|
|
|
}, 120) |
|
|
|
}, |
|
|
|
|
|
|
|
/** |
|
|
|
* 分享当前页面 |
|
|
|
*/ |
|
|
|
onShareAppMessage() { |
|
|
|
const app = this |
|
|
|
const { page } = app |
|
|
|
return { |
|
|
|
title: page.params.share_title, |
|
|
|
path: "/pages/index/index?" + app.$getShareUrlParams() |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
/** |
|
|
|
* 分享到朋友圈 |
|
|
|
* 本接口为 Beta 版本，暂只在 Android 平台支持，详见分享到朋友圈 (Beta) |
|
|
|
* https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html |
|
|
|
*/ |
|
|
|
onShareTimeline() { |
|
|
|
const app = this |
|
|
|
const { page } = app |
|
|
|
return { |
|
|
|
title: page.params.share_title, |
|
|
|
path: "/pages/index/index?" + app.$getShareUrlParams() |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
</script> |
|
|
|
@ -216,4 +288,176 @@ |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.diy-goods { |
|
|
|
.goods-list { |
|
|
|
padding: 4rpx; |
|
|
|
box-sizing: border-box; |
|
|
|
|
|
|
|
.goods-item { |
|
|
|
// background-color: #fff; |
|
|
|
box-sizing: border-box; |
|
|
|
padding: 16rpx; |
|
|
|
|
|
|
|
.goods-image { |
|
|
|
position: relative; |
|
|
|
width: 100%; |
|
|
|
height: 0; |
|
|
|
padding-bottom: 100%; |
|
|
|
overflow: hidden; |
|
|
|
background: #fff; |
|
|
|
|
|
|
|
&:after { |
|
|
|
content: ''; |
|
|
|
display: block; |
|
|
|
margin-top: 100%; |
|
|
|
} |
|
|
|
|
|
|
|
.image { |
|
|
|
position: absolute; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
-o-object-fit: cover; |
|
|
|
object-fit: cover; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.detail { |
|
|
|
padding: 8rpx; |
|
|
|
background: #fff; |
|
|
|
border-radius: 0 0 6% 6%; |
|
|
|
box-shadow: #333 2rpx 3rpx 2rpx; |
|
|
|
|
|
|
|
.goods-name { |
|
|
|
min-height: 68rpx; |
|
|
|
line-height: 1.3; |
|
|
|
white-space: normal; |
|
|
|
color: #484848; |
|
|
|
font-size: 26rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.detail-price { |
|
|
|
.goods-price { |
|
|
|
font-weight: 800; |
|
|
|
margin-right: 8rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.sale-count { |
|
|
|
maring-left:20rpx; |
|
|
|
font-size: 18rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.detail-owner{ |
|
|
|
padding: 4rpx; |
|
|
|
font-size: 22rpx; |
|
|
|
color: #999; |
|
|
|
margin-left: 10rpx; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
&.display__slide { |
|
|
|
white-space: nowrap; |
|
|
|
font-size: 0; |
|
|
|
|
|
|
|
.goods-item { |
|
|
|
display: inline-block; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
&.display__list { |
|
|
|
.goods-item { |
|
|
|
float: left; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
&.column__2 { |
|
|
|
.goods-item { |
|
|
|
width: 50%; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
&.column__3 { |
|
|
|
.goods-item { |
|
|
|
width: 33.33333%; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
&.column__1 { |
|
|
|
.goods-item { |
|
|
|
width: 100%; |
|
|
|
height: 280rpx; |
|
|
|
margin-bottom: 12rpx; |
|
|
|
padding: 20rpx; |
|
|
|
box-sizing: border-box; |
|
|
|
background: #fff; |
|
|
|
line-height: 1.6; |
|
|
|
|
|
|
|
&:last-child { |
|
|
|
margin-bottom: 0; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.goods-item_left { |
|
|
|
display: flex; |
|
|
|
width: 40%; |
|
|
|
background: #fff; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
.image { |
|
|
|
display: block; |
|
|
|
width: 240rpx; |
|
|
|
height: 240rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.goods-item_right { |
|
|
|
position: relative; |
|
|
|
width: 60%; |
|
|
|
|
|
|
|
.goods-name { |
|
|
|
margin-top: 20rpx; |
|
|
|
min-height: 68rpx; |
|
|
|
line-height: 1.3; |
|
|
|
white-space: normal; |
|
|
|
color: #484848; |
|
|
|
font-size: 26rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.goods-item_desc { |
|
|
|
margin-top: 8rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.desc-selling_point { |
|
|
|
width: 400rpx; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #e49a3d; |
|
|
|
} |
|
|
|
|
|
|
|
.desc-goods_sales { |
|
|
|
color: #999; |
|
|
|
font-size: 24rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.desc_footer { |
|
|
|
font-size: 24rpx; |
|
|
|
|
|
|
|
.price_x { |
|
|
|
margin-right: 16rpx; |
|
|
|
color: #f03c3c; |
|
|
|
font-size: 30rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.price_y { |
|
|
|
text-decoration: line-through; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
</style> |
|
|
|
|
453530270@qq.com
2 years ago