seahorsesShop_miniapp/pages/spellGoodsDetails/spellGoodsDetails.wxml

<!-- 拼团商品详情 -->
<!--pages/snapUpDetail/snapUpDetail.wxml-->

<view class="top-goods-box">
  <!-- 商品图片 -->
  <!-- 轮播图 -->
  <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" indicator-color="{{indicatorColor}}" interval="{{interval}}" duration="{{duration}}" indicator-active-color="{{indicatorActiveColor}}">
    <block wx:for="{{imgs}}" wx:key='*this'>
      <swiper-item>
        <image src='{{item}}'></image>
      </swiper-item>
    </block>
  </swiper>
  <!-- 轮播图end -->
  <!-- 倒计时栏 -->
  <view class="countdown-box clearfix">
    <!-- 拼团 -->
    <text class="second-kill">拼团</text>
    <!-- 拼团开始后 -->
    <view class="countdown-content">
      <text class="countdown-tips">距结束仅剩</text>
      <text class="countdown-time">5 天 17 时 31 分 55 秒</text>
    </view>
    <!-- 拼团开始前 -->
    <!-- <view class="countdown-content">
      <text class="countdown-tips">距开始仅剩</text>
      <text class="countdown-time">01 天 08 时 28 分 49 秒</text>
    </view> -->
  </view>

  <!-- 商品信息 -->
  <view class="goods-msg">
    <!-- 标题 -->
    <view class="goods-title">{{prodName}}</view>
    <!-- 分享btn -->
    <view class="share-icon">
      <image src="../../images/icon/share.png"></image>
      <view class="share-text">分享</view>
    </view>
    <!-- 拼团价格区 -->
    <view class="goods-price">
      <view class="current-price">
        <text class="current-price"><text class="sub">￥</text>1.00</text>
        <text class="condition">3人拼团价</text>
      </view>
      <view class="original">原价<text class="original-price">￥2.00</text></view>
    </view>
    <!-- 运费 -->
    <view class="other-infor clearfix">
      <text class="freight">运费：免运费</text>
      <text class="inventory">剩余：44</text>
    </view>
    <!-- 【秒杀】预计开始时间 -->
    <view class="expect-start display">
      <text class="second-kill-icon">秒杀</text>
      预计 06 日 00：00：00 开始
    </view>
  </view>
</view>


<!-- 拼团信息 -->
<view class="spell-infor">
  <view class="spell-infor-title">
    以下小伙伴正在发起拼团，你可以直接参加
  </view>
  <view class="spell-infor-content">
    <!-- 头像 -->
    <view class="head-img">
      <image src="../../images/icon/head01.png"></image>
    </view>
    <!-- 信息 -->
    <view class="spell-msg">
      <view class="username">6.***</view>
      <view class="spell-text">还差 <text class="red-font"> 2 </text> 人成团，剩余 23时59分08秒</view>
    </view>
    <!-- 凑团按钮 -->
    <view class="join-group"  >去凑团</view>
  </view>
  <!-- 详情 -->
  <view class="rules clearfix">
    <text class="rules-text01">支付开团邀请2人参团，人数不足自动退款</text>
    <text class="rules-text02">玩法详情</text>
    <view class="right-arrow"><image src="../../images/icon/more.png"></image></view>
  </view>
</view>


<!-- 拼团信息end -->


<!-- 颜色 -->
<!-- <view class="choose-color" bindtap="showModal">
  选择：颜色
  <view class="more-icon"><image src="../../images/icon/more.png"></image></view>
</view> -->
<!-- 已选规格 -->
<view class="sku" bindtap='showSku'>
  <view class="sku-tit">已选</view>
  <view class="sku-con">{{selectedProp.length>0?selectedProp+'，':selectedProp}}{{prodNum}}件</view>
  <view class="more">...</view>
</view>
<!-- 已选规格end -->


<!-- 店铺 -->
<view class="shop-box">
  <view class="shop-icon"><image src="../../images/icon/thumb.png"></image></view>
  <text class="shop-name">笑橙小店190904</text>
  <view class="more-icon"><image src="../../images/icon/more.png"></image></view>
</view>


<!-- 评价 -->
<view class='cmt-wrap'>
  <view class="cmt-tit" bindtap='showComment'>
    <view class="cmt-t">
      评价
      <text class="cmt-good">好评{{prodCommData.positiveRating}}%</text>
    </view>
    <view class="cmt-count">
      共{{prodCommData.number}}条
      <text class="cmt-more"></text>
    </view>
  </view>
  <view class="cmt-cont">
    <view class="cmt-tag" bindtap='showComment'>
      <text>全部({{prodCommData.number}})</text>
      <text>好评({{prodCommData.praiseNumber}})</text>
      <text>中评({{prodCommData.secondaryNumber}})</text>
      <text>差评({{prodCommData.negativeNumber}})</text>
      <text>有图({{prodCommData.picNumber}})</text>
    </view>
    <view class="cmt-items">
      <view class="cmt-item" wx:for="{{littleCommPage}}" wx:key="prodCommId">
        <view class="cmt-user">
          <text class="date">{{item.recTime}}</text>
          <view class="cmt-user-info">
            <image class="user-img" src="{{item.pic}}"></image>
            <view class="nickname">{{item.nickName}}</view>
            <comm-star value="{{item.score}}"></comm-star>
          </view>
        </view>
        <view class="cmt-cnt">{{item.content}}</view>
        <scroll-view class="cmt-attr" scroll-x="true" wx:if="{{item.pics.length}}">
          <image src="{{commPic}}" wx:for='{{item.pics}}' wx:for-item="commPic" wx:key='*this'></image>
        </scroll-view>
      </view>
    </view>
    <view class="cmt-more-v" wx:if="{{prodCommPage.records.length > 2}}">
      <text bindtap='showComment'>查看全部评价</text>
    </view>
  </view>
</view>
<!-- 评价 end -->


<!-- 商品详情介绍 -->
  <view class="prod-detail">
    <view>
      <rich-text nodes="{{content}}"></rich-text>
    </view>
  </view>
  <!-- 商品详情end -->


<!-- 【拼团】底部按钮 -->
<view class="foot-box">
  <view class="footer">
    <view class="foot-btn" bindtap='toHomePage'>
      <image src="../../images/tabbar/homepage.png"></image>
      首页
    </view>
    <view class="foot-btn" bindtap='toCartPage'>
      <image src="../../images/tabbar/basket.png"></image>
      购物车
      <view class='badge badge-1' wx:if="{{totalCartNum>0}}">{{totalCartNum}}</view>
    </view>
    <view class="buy-btn alone-buy" bindtap='buyNow'>
      <text>￥1.00购买</text>
    </view>
    <view class="buy-btn group-buy" bindtap='showModal'>
      <text>￥0.01开团</text>
    </view>
  </view>
</view>
<!-- end 底部按钮 -->


<!-- 拼团底部弹框 -->
<view class="modals" hidden="{{hideModal}}">
  <view class="modals-cancel" bindtap="hideModal"></view>
  <view class="bottom-dialog-body bottom-pos" animation="{{animationData}}">
    <!-- 上部 -->
    <view class="top-content">
      <view class="top-content-img-box">
        <image src="" />
      </view>
      <!-- 商品信息 -->
      <view class="goods-msg-box">
        <view class="goods-names">测试商品名称一</view>
        <view class="spell-group-price">3人拼团价</view>
        <view class="goods-prices">￥<text class="rmb-symbol">1.00</text></view>
        <!-- 关闭按钮 -->
      </view>
      <view class="close-btn" bindtap="hideModal"><image src="../../images/icon/close.png"></image></view>
    </view>

    <!-- 颜色 -->
    <view class="choose-color-box">
      <view class="color-txt">颜色：</view>
      <view class="color-box">
        <text class="color-item color-item-current">红色</text>
        <text class="color-item">黄色</text>
      </view>
    </view>

    <!-- 数量 -->
    <view class="quantity">
      <view class="left-text">
        <view class="left-text-top">购买数量：</view>
        <view class="left-text-bottom">剩余96件</view>
      </view>
      <!-- 数量加减 -->
      <view class="right-choose">
        <view class="subtract">–</view>
        <view class="show-num">1</view>
        <view class="add current-state">＋</view>
      </view>
    </view>

    <!-- 确认按钮 -->
    <view class="confirm-btn" bindtap="groupConfirmOrder">确认</view>
    
  </view>
</view>
<!-- 拼团底部弹框 end -->


<!-- 评价弹窗 -->
<view class="cmt-popup" wx:if="{{commentShow}}">
  <view class="cmt-tit">
    <view class="cmt-t">
      商品评价
      <text class="cmt-good">好评度{{prodCommData.positiveRating}}%</text>
    </view>
    <text class="close" bindtap='closePopup'></text>
  </view>
  <view class="cmt-cont">
    <view class="cmt-tag">
      <text bindtap='getProdCommPage' data-evaluate="-1" class="{{evaluate==-1?'selected':''}}">全部({{prodCommData.number}})</text>
      <text bindtap='getProdCommPage' data-evaluate="0" class="{{evaluate==0?'selected':''}}">好评({{prodCommData.praiseNumber}})</text>
      <text bindtap='getProdCommPage' data-evaluate="1" class="{{evaluate==1?'selected':''}}">中评({{prodCommData.secondaryNumber}})</text>
      <text bindtap='getProdCommPage' data-evaluate="2" class="{{evaluate==2?'selected':''}}">差评({{prodCommData.negativeNumber}})</text>
      <text bindtap='getProdCommPage' data-evaluate="3" class="{{evaluate==3?'selected':''}}">有图({{prodCommData.picNumber}})</text>
    </view>
    <view class="cmt-items">
      <view class="cmt-item" wx:for="{{prodCommPage.records}}" wx:key="prodCommId">
        <view class="cmt-user">
          <text class="date">{{item.recTime}}</text>
          <view class="cmt-user-info">
            <image class="user-img" src="{{item.pic}}"></image>
            <view class="nickname">{{item.nickName}}</view>
            <comm-star value="{{item.score}}"></comm-star>
          </view>
        </view>
        <view class="cmt-cnt">{{item.content}}</view>
        <scroll-view class="cmt-attr" scroll-x="true" wx:if="{{item.pics.length}}">
          <image src="{{commPic}}" wx:for='{{item.pics}}' wx:for-item="commPic" wx:key='*this'></image>
        </scroll-view>
        <view class="cmt-reply" wx:if="{{item.replyContent}}">
          <text class='reply-tit'>店铺回复：</text> {{item.replyContent}}
        </view>
      </view>
    </view>
    <view class="load-more" wx:if='{{prodCommPage.pages > prodCommPage.current}}'>
      <text bindtap='getMoreCommPage'>点击加载更多</text>
    </view>
  </view>
</view>
<!-- 评价弹窗 end -->


<!-- 规格弹窗 -->
<view class="pup-sku" wx:if="{{skuShow}}">
  <view class="pup-sku-main">
    <view class='pup-sku-header'>
      <image class="pup-sku-img" src="{{defaultSku.pic?defaultSku.pic:pic}}"></image>
      <view class="pup-sku-price">
        ￥
        <text class="pup-sku-price-int">{{wxs.parsePrice(defaultSku.price)[0]}}</text> .{{wxs.parsePrice(defaultSku.price)[1]}}
      </view>
      <view class='pup-sku-prop'>
        <text>已选</text> {{selectedProp.length>0?selectedProp+'，':selectedProp}}{{prodNum}}件
      </view>
      <view class='close' bindtap='closePopup'></view>
    </view>
    <view class='pup-sku-body'>
      <view class="pup-sku-area">
        <block wx:for="{{skuGroup}}" wx:for-index="key" wx:for-item="value" wx:key='*this'>
          <view class='sku-kind'>{{key}}</view>
          <view class='sku-choose'>
            <block wx:for="{{value}}" wx:key='*this'>
              <text class="sku-choose-item {{wxs.array_contain(selectedProp,item)?'active':''}} {{wxs.props_contain(allProperties,selectedPropObj,key,item,propKeys)?'':'gray'}}" data-ok="{{wxs.props_contain(allProperties,selectedPropObj,key,item,propKeys)}}" bindtap='toChooseItem'
                data-key="{{key}}" data-val="{{item}}">{{item}}</text>
            </block>
          </view>
        </block>
      </view>
      <view class="pup-sku-count">
        <view class="num-wrap">
          <view class="minus" bindtap='onCountMinus'>
            <text class="row"></text>
          </view>
          <view class="text-wrap">
            <input type="number" value="{{prodNum}}" disabled />
          </view>
          <view class="plus" bindtap='onCountPlus'>
            <text class="row"></text>
            <text class="col"></text>
          </view>
        </view>
        <view class="count-name">数量</view>
      </view>
    </view>
    <view class='pup-sku-footer'>
      <view class="btn cart" bindtap='buyNow'>￥1.00购买</view>
      <view class="btn buy" bindtap=''>￥0.01开团</view>
    </view>
  </view>
</view>
<!-- 规格弹窗 end -->