classroom-music-activation/miniprogram/pages/index/index.wxml

<swiper indicator-dots="{{false}}" vertical="true" class="firstConainer">
  <!-- <swiper-item>
    <view class="pageContainer firstPageContainer">
      <navigation-bar title="器乐数字AI工具" back="{{false}}"></navigation-bar>
      <swiper indicator-dots="{{false}}" class="fistSwiperSection" previous-margin="78rpx" next-margin="78rpx" bindchange="onFirstChange">
        <swiper-item wx:for="{{firstImgList}}" wx:key="index">
          <view class="swiper-item {{ firstCurrent == index ? 'current' : '' }}">
            <image data-src="{{ item }}" src="{{ item }}"></image>
          </view>
        </swiper-item>
      </swiper>
      <view class="pageDot">
        <view wx:for="{{firstImgList}}" wx:key="index" class="dot-item {{ firstCurrent == index ? 'current' : '' }}"></view>
      </view>

      <image src="./images/up-arrow.png" class="upArrow"></image>
    </view>
  </swiper-item> -->
  <swiper-item>
    <view class="pageContainer">
      <!--index.wxml-->
      <scroll-view class="scrollarea" bounces="false" scroll-y="{{popupShow ? false : true}}" type="list">
        <view class="container">
          <!-- <view class="topShadow"></view> -->
          <view class="slider-count">{{current + 1}}/{{imgList.length}}</view>
          <swiper indicator-dots="{{false}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" bindchange="changeSwiper">
            <swiper-item wx:for="{{imgList}}" wx:key="index">
              <view class="swiper-item">
                <image bind:tap="onPreivewBannerImg" data-src="{{ item }}" src="{{ item }}"></image>
              </view>
            </swiper-item>
          </swiper>

          <view class="shop-section">
            <view class="showPrice">
              <view class="left">
                <view class="currentPrice">
                  <text class="stuff">¥</text>
                  <text class="priceZ">{{ selected.integerPart || 0 }}</text>
                  <text class="priceF">.{{ selected.decimalPart || '00' }}</text>
                  <text class="after">起</text>
                </view>
                <!-- <view class="originPrice"></view> -->
              </view>
              <view class="right">
                已售1w+
              </view>
            </view>

            <view class="shopName">
              <!-- {{ selected.name }} -->
              器乐数字AI工具会员卡
            </view>

            <view class="shopInfo">
              一款专为音乐学习者、爱好者设计的音乐学习软件。通过先进的人工智能技术，为您提供全方位的乐理知识、日常练习和智能评分等功能，帮助您在音乐道路上更上一层楼。
            </view>
            <view class="goods-btn">
              <view class="btn-submit">立即享受专属权益</view>
            </view>
          </view>

          <view class="goodsSection">
            <view class="goodsIntro">
              <view class="title">图文详情</view>
              <view class="images">
                <block wx:for="{{goodsImgList}}" wx:key="index">
                  <!--  bind:tap="onPreivewGoodsImg" -->
                  <image mode="widthFix" data-src="{{item}}" src="{{item}}"></image>
                </block>
              </view>
            </view>
          </view>

          <view class="bottom-section">
            <!-- <view class="orders" bind:tap="onService">
              <image src="./images/icon-service.png" />
              <text>客服</text>
            </view> -->
            <view class="orders" bind:tap="onOrder">
              <image src="./images/icon-order.png" />
              <text>订单</text>
            </view>
            <view class="btnSection">
              <button bind:tap="onBuyShop" type="primary" disabled="{{ isOverSaled }}">立即购买</button>
            </view>
          </view>

          <view class="popup-section" wx:if="{{popupShow}}">
            <view class="popup-mask" bind:tap="onClose"></view>
            <view class="popup-container">
              <image bind:tap="onClose" src="./images/icon-close.png" class="iconClose"></image>

              <view class="product-section">
                <view class="product-img">
                  <image bind:tap="onPreivewGoods" data-src="{{ selected.pic }}" src="{{ selected.pic }}"></image>
                </view>
                <view class="product-left">
                  <view class="currentPrice">
                    <text class="stuff">¥</text>
                    <text class="priceZ">{{ selected.integerPart }}</text>
                    <text class="priceF">.{{ selected.decimalPart }}</text>
                  </view>
                  <view class="originPrice">¥{{ selected.originalPrice }}</view>
                </view>
              </view>

              <view class="goodsInfo">
                <view class="desc">规格</view>
                <view class="goodsList">
                  <view wx:for="{{ list }}" wx:key="index" class="goodsItem {{ item.id == selected.id ? 'selected' : '' }} {{ item.stockNum <= 0 ? 'nosale' : '' }}" bind:tap="onSelectGoods" data-id="{{ item.id }}">{{ item.typeName }}
                    <image wx:if="{{ item.stockNum <= 0 }}" src="./images/nosale.png"></image>
                  </view>
                </view>
              </view>

              <button type="primary" bind:tap="onSubmit">立即购买</button>
            </view>
          </view>
        </view>

        <!-- <service popShow="{{ showService }}" bind:changePop="changePop"></service> -->
      </scroll-view>
    </view>
  </swiper-item>
</swiper>