|
@@ -1,26 +1,49 @@
|
|
|
<template>
|
|
|
<view class="content">
|
|
|
- <u-swiper height="250" :list="imageTopList"></u-swiper>
|
|
|
- <view class="t1">
|
|
|
- <u-image height="40" src="/static/t1.png"></u-image>
|
|
|
+ <u-swiper height="320" :list="imageTopList"></u-swiper>
|
|
|
+ <!-- 导航按钮 -->
|
|
|
+ <view class="nav">
|
|
|
+ <u-grid :col="4" :border="false" @click="toPage">
|
|
|
+ <u-grid-item :index="0">
|
|
|
+ <u-image width="72rpx" height="72rpx" src="/static/zhinan.png"></u-image>
|
|
|
+ <view class="grid-text">分类指南</view>
|
|
|
+ </u-grid-item>
|
|
|
+ <u-grid-item :index="1">
|
|
|
+ <u-image width="72rpx" height="72rpx" src="/static/liucheng.png"></u-image>
|
|
|
+ <view class="grid-text">投递流程</view>
|
|
|
+ </u-grid-item>
|
|
|
+ <u-grid-item :index="2">
|
|
|
+ <u-image width="72rpx" height="72rpx" src="/static/shouyi.png"></u-image>
|
|
|
+ <view class="grid-text">乐豆收益</view>
|
|
|
+ </u-grid-item>
|
|
|
+ <u-grid-item :index="3">
|
|
|
+ <u-image width="72rpx" height="72rpx" src="/static/hexiao.png"></u-image>
|
|
|
+ <view class="grid-text">扫码核销</view>
|
|
|
+ </u-grid-item>
|
|
|
+ </u-grid>
|
|
|
</view>
|
|
|
- <!-- 商品 -->
|
|
|
- <view class="goods">
|
|
|
- <view v-if="goodsList.length">
|
|
|
- <u-section title="人气零食" v-if="goodsList.length" line-color="#01c9b2" sub-title="更多" @click="toGoods(1)"></u-section>
|
|
|
- <view class="goods-list">
|
|
|
- <uni-coods :list="goodsList"></uni-coods>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view v-if="goodsList.length">
|
|
|
- <u-section title="居家生活" v-if="goodsList.length" line-color="#01c9b2" sub-title="更多" @click="toGoods(2)"></u-section>
|
|
|
- <view class="goods-list">
|
|
|
- <uni-coods :list="goodsList"></uni-coods>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
+ <!-- 网点 -->
|
|
|
+ <view class="storeList">
|
|
|
+ <u-section title="附近的网点" :right="false" line-color="#01c9b2"></u-section>
|
|
|
+ <view class="stores-box">
|
|
|
+ <view class="stores-item" v-for="item in 3" @click="viewStore(item)">
|
|
|
+ <view class="s-name">
|
|
|
+ <view>
|
|
|
+ 网点名称啊撒地方就拉萨附近士大夫
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="s-address">
|
|
|
+ <view><text>陕西西安高新二路十字103号</text></view>
|
|
|
+ <view><u-icon name="map-fill" color="#01c9b2" size="30"></u-icon> 1.3KM</view>
|
|
|
+ </view>
|
|
|
+ <view class="s-time">
|
|
|
+ <view>
|
|
|
+ 营业时间:<text>9:00 - 11:00 , 12:00 - 17:00</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <!-- 购物车 -->
|
|
|
- <uni-cart-fix></uni-cart-fix>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
@@ -76,6 +99,40 @@
|
|
|
uni.navigateTo({
|
|
|
url:"/pages/goods/goods?id="+clsId
|
|
|
})
|
|
|
+ },
|
|
|
+ // 快速导航
|
|
|
+ toPage(e){
|
|
|
+ let path=[
|
|
|
+ '/pages/userCenter/zhinan',
|
|
|
+ '/pages/userCenter/liucheng',
|
|
|
+ '/pages/userCenter/ledouRecord',
|
|
|
+ ''
|
|
|
+ ]
|
|
|
+ if(path[e]!=''){
|
|
|
+ uni.navigateTo({
|
|
|
+ url: path[e]
|
|
|
+ })
|
|
|
+ }else{
|
|
|
+ // 核销
|
|
|
+ this.smHx()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 扫码核销
|
|
|
+ smHx(){
|
|
|
+ uni.scanCode({
|
|
|
+ success(e) {
|
|
|
+ console.log(e)
|
|
|
+ },
|
|
|
+ fail(err) {
|
|
|
+ console.log(err)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 查看网点
|
|
|
+ viewStore(item){
|
|
|
+ uni.navigateTo({
|
|
|
+ url: "/pages/store/store"
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
}
|
|
@@ -85,20 +142,52 @@
|
|
|
.content {
|
|
|
background: url(../../static/topBg.png) no-repeat top center;
|
|
|
background-size: 100%;
|
|
|
- .goods{
|
|
|
- >view{
|
|
|
- padding: 25upx 20upx 10upx;
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 15upx;
|
|
|
- box-shadow: 0upx 6upx 10upx #eee;
|
|
|
- margin-bottom: 20upx;
|
|
|
- > .goods-list{
|
|
|
- padding-top: 5upx;
|
|
|
- }
|
|
|
+ width: 100%;
|
|
|
+ .nav{
|
|
|
+ margin: 20upx 0;
|
|
|
+ border-radius: 15upx;
|
|
|
+ box-shadow: 0upx 3upx 6upx #eee;
|
|
|
+ overflow: hidden;
|
|
|
+ .grid-text{
|
|
|
+ padding-top: 10upx;
|
|
|
}
|
|
|
}
|
|
|
- .t1{
|
|
|
- padding: 20upx 0;
|
|
|
+ .storeList{
|
|
|
+ padding: 25upx 20upx 20upx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 15upx;
|
|
|
+ box-shadow: 0upx 3upx 6upx #eee;
|
|
|
+ .stores-box{
|
|
|
+ padding-top: 5upx;
|
|
|
+ .stores-item{
|
|
|
+ border-bottom: 1px solid #F8F8F8;
|
|
|
+ padding: 20upx 10upx;
|
|
|
+ &:last-child{
|
|
|
+ border: 0;
|
|
|
+ }
|
|
|
+ > view{
|
|
|
+ padding: 10upx 0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .s-address,.s-time{
|
|
|
+ justify-content: space-between;
|
|
|
+ color: #666;
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+ .s-address{
|
|
|
+ > view{
|
|
|
+ &:last-child{
|
|
|
+ font-size: 24rpx;
|
|
|
+ width: 30%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</style>
|