fuint-uniapp-master/pages/category/index.vue

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<template>
  <view class="container">
	<!--店铺切换-->
	<Location v-if="storeInfo" :storeInfo="storeInfo"/>
	
    <!-- 搜索框 -->
    <Search tips="请输入搜索关键字..." @event="$navTo('pages/search/index')" />

    <!-- 分类样式：一级分类(大图) 10 -->
    <view class="cate-content" v-if="templet.style == 10 && list.length > 0">
      <view class="cate-wrapper cate_style__10">
        <scroll-view :scroll-y="true" :style="{ height: `${scrollHeight - 10}px` }">
          <view class="cate-item" v-for="(item, index) in list" :key="index" @click="onTargetGoodsList(item.category_id)">
            <image mode="widthFix" :src="item.logo"></image>
          </view>
        </scroll-view>
      </view>
    </view>

    <!-- 分类样式：二级分类 20 -->
    <view class="cate-content dis-flex" v-else-if="templet.style == 20 && list.length > 0">
	
      <!-- 左侧 一级分类 -->
      <scroll-view class="cate-left f-28" :scroll-y="true" :style="{ height: `${scrollHeight}px` }">
		  <view v-for="(item, index) in list" :key="index">
			  <text class="cart-badge" v-if="item.total">{{ item.total }}</text>
			  <text class="type-nav" :class="{ selected: curIndex == index }" @click="handleSelectNav(index)">{{ item.name }}</text>
		  </view>
      </scroll-view>

      <!-- 右侧 二级分类 -->
      <scroll-view class="cate-right b-f" :scroll-top="scrollTop" :scroll-y="true" :style="{ height: `${scrollHeight}px` }">
        <view v-if="list[curIndex]">
          <view class="cate-right-cont">
            <view class="cate-two-box">
              <view v-if="list[curIndex].goodsList.length" class="cate-cont-box">
                <view class="flex-five item" v-for="(item, idx) in list[curIndex].goodsList" :key="idx">
                  <view class="cate-img">
                    <image v-if="item.logo" :src="item.logo" @click="onTargetGoods(item.id)"></image>
                  </view>
				  <view class="cate-info">
                    <text class="name text">{{ item.name }}</text>
				    <text class="stock text">库存:{{ item.stock }} 已售:{{ item.initSale }}</text>
				    <view class="action">
						<text class="price">￥{{ item.price }}</text>
						<view class="cart">
							<view v-if="item.isSingleSpec === 'Y'" class="singleSpec">
								<view class="ii do-minus" v-if="item.buyNum" @click="onSaveCart(item.id, '-')"></view>
								<view class="ii num" v-if="item.buyNum">{{ (item.buyNum != undefined) ? item.buyNum : 0 }}</view>
								<view class="ii do-add" v-if="item.stock > 0" @click="onSaveCart(item.id, '+')"></view>
							</view>
							<view v-if="item.isSingleSpec === 'N'" class="multiSpec">
								<text class="num-badge" v-if="item.buyNum">{{ item.buyNum }}</text>
								<view class="select-spec" @click="onShowSkuPopup(2, item.id)">选规格</view>
							</view>
						</view>
					</view>
				  </view>
                </view>
              </view>