123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194 |
- <template>
- <view class="content">
- <u-swiper height="250" @click="clickBanner" :list="imageTopList"></u-swiper>
- <view class="t1">
- <u-image height="40" src="/static/t1.png"></u-image>
- </view>
- <!-- 商品 -->
- <view class="goods">
- <view v-for="(item,index) in goodsList" :key="index" v-if="item&&item.list.length">
- <u-section :title="item.type.name" font-size="35" line-color="#01c9b2" sub-title="更多" @click="toGoods(item.type)">
- <view slot="right" style="color: #01c9b2;font-size: 30rpx;">更多<u-icon name="arrow-right"></u-icon></view>
- </u-section>
- <view class="goods-list">
- <uni-coods :goldLimit="item.type.goldLimit" :list="item.list"></uni-coods>
- </view>
- </view>
- <view v-if="goodsListLength==0&&hasLogin">
- <u-empty icon-size="60" :text="noDataText" mode="list"></u-empty>
- </view>
- <view class="nologin" v-if="!hasLogin">
- <view>您还未登录,请登录后再浏览商品</view>
- <u-button plain size="mini" shape="circle" @click="toLoginPage">立即登录</u-button>
- </view>
- </view>
- <!-- 购物车 -->
- <uni-cart-fix :dragPic="dragPic"></uni-cart-fix>
- </view>
- </template>
- <script>
- import {
- getGoodsClass,
- getGoodsList
- } from '@/api/goods.js'
- import {bannerList} from '@/api/banner.js'
- import {checkLogin} from '@/api/login.js'
- export default {
- components: {
- },
- data() {
- return {
- noDataText: '正在加载...',
- imageTopList:[],
- goodsList:[], // 商品
- goodsType:[], // 商品分类
- dragPic: '/static/cart.png', // 购物车图标
- hasLogin: false
- }
- },
- onLoad() {
- this.pageInit()
- // 开启分享
- uni.showShareMenu({
- withShareTicket: true,
- menus: ['shareAppMessage', 'shareTimeline']
- })
- },
- computed: {
- goodsListLength() {
- let len = this.goodsList.length
- return len
- }
- },
- onShow() {
- // 是否登录
- checkLogin().then(res => {
- this.hasLogin = res.status == 200
- // if(res.status != 200){
- // uni.navigateTo({
- // url:"/pages/login/login"
- // })
- // }
- })
- },
- // 下拉刷新
- onPullDownRefresh() {
- console.log('refresh')
- this.noDataText = '正在加载...'
- this.pageInit()
- setTimeout(function () {
- uni.stopPullDownRefresh()
- }, 200)
- },
- methods: {
- pageInit(){
- this.getbannerList()
- this.goodsList = []
- getGoodsClass({}).then(res => {
- console.log(res)
- if(res.status == 200){
- this.goodsType = res.data
- this.goodsType.map((item,index) => {
- this.getGoods(item,index)
- })
- }else{
- this.goodsList = []
- this.noDataText = '暂无商品'
- }
- })
- },
- // 查询商品
- getGoods(item,index){
- getGoodsList({
- pageNo:1,
- pageSize:item.popularizeGoodsLimit,
- goodsTypeNo:item.goodsTypeNo,
- }).then(res => {
- console.log(res,'goodsList')
- if(res.status == 200&&res.data.list&&res.data.list.length){
- this.goodsList[index] = {
- type: item,
- list: res.data.list
- }
- this.goodsList.splice()
- }else{
- this.noDataText = '暂无商品'
- }
- })
- },
- // 点击banner
- clickBanner(index){
- let row = this.imageTopList[index]
- console.log(index,row)
- if(row.jumpType !== 'NONE'){
- if(this.hasLogin){
- // 跳外网地址
- if(row.jumpUrl.indexOf('http') == 0){
-
- }
- // 跳小程序页面
- if(row.jumpUrl.indexOf('/pages') == 0){
- uni.navigateTo({
- url: row.jumpUrl
- })
- }
- }else{
- this.toLoginPage()
- }
- }
- },
- // 获取banner
- getbannerList(){
- bannerList({type:'banner',location:'MALL_TOP'}).then(res=>{
- if(res.status==200){
- this.imageTopList=res.data
- }
- })
- },
- // 更多商品
- toGoods(item){
- uni.navigateTo({
- url:"/pagesA/goods/goods?goodsTypeNo="+ item.goodsTypeNo + "&goldLimit="+ item.goldLimit + "&name=" + item.name
- })
- },
- toLoginPage(){
- uni.navigateTo({
- url: '/pages/login/login'
- })
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- .content {
- background: url(../../static/topBg.png) no-repeat top center;
- background-size: 100%;
- width: 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;
- }
- }
- .nologin{
- padding: 50upx 0;
- text-align: center;
- >view{
- padding: 30upx 0;
- font-size: 0.8em;
- color: #666;
- }
- }
- }
- .t1{
- padding: 20upx 0;
- }
- }
- </style>
|