payProject/pages/home/home.wxml

<import src="/components/local/wxParse/wxParse.wxml" />
<wxs src="./../../utils/wxsUtil.wxs" module="wxsUtil" />
<!-- 头部banner -->
<home-skeleton isLoading="{{isLoading}}">
<view class="navbar-distance" style="margin-top: {{navBarData.navBarHeight}}px;">距离{{wxsUtil.getDistance(lat1,lng1,homeData.store.latitude,homeData.store.longitude)}}Km</view>
<!-- 距离提示 -->
<view class="navbar-hint" style="margin-top: {{navBarData.navBarHeight+11}}px;" wx:if="{{wxsUtil.getDistance(lat1,lng1,homeData.store.latitude,homeData.store.longitude)<=1}}">
  <image src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/wxapp/20221017/%E7%BC%96%E7%BB%84%2022%402x.png">
  </image>
  <view class="navbar-hint-tip">距离变美只有一点点距离啦</view>
</view>
<view class="top-banner">
  <swiper class="top-swiper" indicator-color='#F0F0F0' indicator-dots indicator-active-color='#fa7d22' autoplay circular interval='3000'>
    <swiper-item wx:if="{{homeData.banner.length!=0}}" wx:for="{{homeData.banner}}" wx:key="index">
      <image data-source="{{item}}" data-url="{{ item.url }}" bindtap="goToUrl" bindload="imgInfo" src="{{item.image_url}}" lazy-load="true"></image>
    </swiper-item>
  </swiper>
</view>

  <!-- 自定义导航 -->
  <!-- TODO 遇到 bindtap触发不了的问题，应该是层级问题，暂时整体可点击 -->
  <navigation bindtap="goToStore">
    <cover-view class="navbar-box {{navBarBgClass}} " style="height:{{navBarData.navBarHeight}}px;" bindtap="goToStore">
      <cover-view class="navbar-box-container" style="height:{{navBarData.menuHeight}}px; min-height:{{navBarData.menuHeight}}px; line-height:{{navBarData.menuHeight}}px; bottom:{{navBarData.menuBotton}}px;">
        <cover-image class="navbar-location" src="{{navBarBgClass==''?'../../images/home/定位@2x.png':'../../images/home/定位@2x(2).png'}}"></cover-image>
        <cover-view class="navbar-store">
          <cover-view style="color: {{navBarBgClass!=''?'#333':'#fff'}};" class="navbar-tips">{{homeData.store.store_name}}</cover-view>
        </cover-view>
        <cover-image class="navbar-arrow" src="{{navBarBgClass==''?'../../images/home/展开@2x(1).png':'../../images/home/展开@2x.png'}}"></cover-image>
      </cover-view>
    </cover-view>
  </navigation>

  <view class="content" style="padding-bottom: 24rpx;">
    <!-- 消息提示框 -->
    <view class="message-box">
      <image class="trumpet" src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/wxapp/20221017/%E5%96%87%E5%8F%AD%402x.png"></image>
      <swiper class="message-tip" circular='{{true}}' autoplay	vertical='{{true}}' wx:if="{{messageList!=''}}">
      <swiper-item wx:for="{{messageList}}" wx:key="index">
      <view style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap; " class="message-contents">{{item.title}}</view>
      <view class="goMessage" data-notice='{{item.notice}}' data-id="{{item.id}}" bindtap="goMessageDetail">去看看>></view>
      </swiper-item>
    </swiper>
    <view class="message-tip" wx:if="{{messageList==''}}">【欢迎使用jolijoli小程序】</view>
      <!-- <image style="margin-left: 126rpx;" class="message-icon" src="../../images/home/time.png"></image> -->
      <view class="message-icon">
      <image bindtap="goMessageCenter"  src="../../images/home/message.png"></image>
      <view class="message-total" wx:if="{{notMessageTotal!=0}}">{{notMessageTotal}}</view>
      </view>
    </view>
    <!-- 肤龄 -->
    <view class="skin-box" bindtap="{{skinInfo==''?'goSkin':'goTestSkin'}}">
      <view class="skin-box-left">
        <view class="skin-title">肤龄</view>
        <view class="skin-date">{{skinInfo==''?'你还没有过测肤状况':skinInfo.create_time}}</view>
      </view>
      <view class="skin-box-right">
        <view class="skin-age" wx:if="{{skinInfo!=''}}">{{skin_type[skinInfo.skin_type-1]}}<text>{{skinInfo.skin_age}}</text>岁</view>
        <view class="skin-age" wx:else>立即<text style="font-size: 42rpx; color: #FA7D22;">去测肤</text></view>
      </view>
    </view>
    <!-- <button bindtap="open">点我</button> -->
    <!-- 项目分类 -->
    <view class="project-classify">
      <view class="project-classify-item" wx:for="{{homeData.shortcut}}" wx:key="index" data-index="{{item.url}}" bindtap="goOrder">
        <image src="{{item.image_url}}"></image>
        <view>{{item.name}}</view>
      </view>
    </view>
    <!-- 推荐项目 -->
    <view class="recommend-project" wx:if="{{homeData.config!=''&&homeData.referrals.length!=0}}">{{homeData.config}}</view>
    <!-- 推荐项目轮播图 -->
    <swiper class="projectImage" wx:if="{{homeData.config!=''&&homeData.referrals.length!=0}}" bindchange='changeSwiper' previous-margin='39rpx' next-margin='39rpx' circular='true'>
      <swiper-item class="projectImage-item" bindtap="goOtherUrl" data-type="{{item.url_type}}" data-url="{{item.url}}" wx:for="{{homeData.referrals}}" wx:key="index">
        <view class=" boxSmall {{index==swiperIndex?'boxBig':''}}">
          <image src="{{item.image_url}}"></image>
        </view>
      </swiper-item>
    </swiper>
    <!-- 美丽秘籍模块 -->
    <view class="article">
      <scroll-view class="article-tab {{tabClass}}" style='--top--:{{navBarData.navBarHeight}}px;' scroll-x="true">
        <view class="tab-item {{current == index?'tab-item-active':''}}" bindtap="onTabsChange" data-index='{{index}}' wx:for="{{ classify }}" wx:key="index">
          <view style="position: relative;">{{item.name}}</view>
        </view>
      </scroll-view>
      <!-- 瀑布流 -->
      <view class="main">
        <view wx:for="{{columns}}" wx:key="index" class="column">
          <view wx:for="{{item}}" wx:key="index" class="column_item" wx:for-item="pics" bindtap="goArticleDetail" data-id='{{pics.id}}'>
            <view class="main-box">
              <image src="{{pics.cover}}" class="column_pic" mode="widthFix" />
              <view class="main-content">
                <view class="main-title">{{pics.title}}</view>
                <view class="main-bottom">
                  <view class="main-author">{{pics.author_name}}</view>
                  <view class="main-time">{{pics.create_time}}</view>
                </view>
              </view>
            </view>
          </view>
        </view>
      </view>
      <view class="hide">
        <image wx:for="{{tempPics}}" wx:key="index" src="{{item.cover}}" bindload="loadPic" binderror="loadPicError" data-index="{{index}}" />
      </view>
    </view>
    <!-- listker打卡活动 -->
    <view hidden="{{true}}">
      <view class="title flex-align-center" catchtap="cardingCatchTap">
        <text class="title-text flex1 flex-align-center">打卡活动</text>
        <view class="right flex-align-center">
          <text style="color: #666666;font-size: 24rpx;">查看更多</text>
          <image src="/images/icon_08.png"></image>
        </view>
      </view>
      <view class="carding">
        <view class="top">
          <view class="title">免费领取菲洛嘉产品</view>
          <image class="img" src="/images/q_img.png" catchtap="guildMessage"></image>
        </view>
        <view class="carding_content">

          <view class="line_show"></view>

          <view class="carding_item" wx:for="{{progressList}}" wx:key="index">
            <image class="carding__img" src="{{(index==5?'/images/all_carding.png':item.status==0?'/images/not_carding.png':(item.status==1?'/images/user_carding.png':(item.status==2?'/images/is_carding.png':'/images/not_carding.png')))}}">
            </image>
            <view class="carding_number">{{item.day}}</view>
          </view>
        </view>
        <view class="viewData">*体验项目累计6天/月</view>
      </view>
    </view>

    <!-- <view wx:if="{{homeData.card_banner_list.length>0}}"> -->
    <view hidden="{{true}}">
      <view class="title flex-align-center">
        <text class="title-text flex-align-center">开卡活动</text>
      </view>
      <view class='swiper-box' style="padding-top: 12rpx;">
        <swiper circular current="{{cardBannerCurrentSwiper}}" bindanimationfinish="swiperChange" data-current-source="cardBanner">
          <swiper-item wx:for="{{homeData.card_banner_list}}" wx:key="index" bindtap="jumpByUrlType" data-item="{{item}}">
            <image src="{{item.image_url}}"></image>
          </swiper-item>
        </swiper>
        <view class="swiper-dots flex-align-center flex-column">
          <block wx:for="{{homeData.card_banner_list}}" wx:key="index">
            <view class="swiper-dot{{index == cardBannerCurrentSwiper ? ' swiper-dot-active' : ''}}"></view>
          </block>
        </view>
      </view>
    </view>
    <!-- 邀请/被邀请入口 -->
    <!-- <view class="invite" wx:if="{{allow_invite==1||allow_receive==1}}"> -->
    <!-- <view class="invite">
      <text class="invite-title">邀请活动</text>
      <view bindtap="onInvite">
        <image class="invite-banner" src="{{allow_invite==1?inviteImg:allow_receive==1?beInvitedImg:inviteImg}}"></image>
      </view>
    </view> -->
  </view>
  <view class="location flex-align-center" bindtap="goToStore" wx:if="{{false}}">
    <!-- <view class="img">
  <image class="img1" src="{{homeData.store.logo_url}}"></image>
  <image class="img2" src="/images/my/downsemicircle.png"></image>
  <text>已选</text>
</view> -->
    <image src="{{homeData.store.logo_url}}"></image>
    <view class="text flex-column flex1">
      <view class="text-box flex-align-center" style="margin-bottom:8rpx;">
        <text class="ellipsis" style="font-family: PingFangSC-Semibold;">{{homeData.store.store_name}}</text>
        <view class="active flex-center">已选</view>
      </view>
      <view class="text-box flex-align-center">
        <text class="ellipsis" style="font-size:24rpx;width:280rpx;">{{homeData.store.belong_region}}</text>
        <text style="font-size:24rpx;color: #FA7D22;">更多>></text>
      </view>
    </view>
  </view>
  <view class="content" wx:if="{{false}}">
    <view class="title flex-align-center">项目推荐</view>
    <view class="list">
      <!-- <navigator wx:for="{{list}}" wx:key="index"
      url="/pages/projectDetail/projectDetail?project_id={{item.id}}&store_id={{homeData.store.id}}"
      hover-class="none" id="goToProject">
    </navigator> -->
      <view bindtap="goToProject" class="goToProject" data-item="{{item}}" wx:for="{{list}}" wx:key="index">
        <view class="item radius flex-column">
          <image class="item-top" src="{{item.cover_url}}"></image>
          <view class="item-text flex-column">
            <!-- <view class="box">
          <image src="/images/my/tag.png"></image>
          <view class="flex-center">{{index+1}}</view>
        </view> -->
            <text class="ellipsis" style="font-family: PingFangSC-Medium, PingFang SC;">{{item.project_name}}</text>
            <text class="ellipsis" style="font-size: 24rpx;color: #666;margin-top: 10rpx;" wx:if="{{item.project_desc}}">{{item.project_desc}}</text>
          </view>
          <view class="item-btn flex-align-center">
            <text style="font-family: PingFangSC-Semibold;font-size: 44rpx;color: #E95564;">¥{{item.price}}</text>
            <text style="margin-left:24rpx;font-size: 28rpx;color: #CCCCCC;text-decoration:line-through;">¥{{item.original_price}}</text>
            <text class="flex1"></text>
            <view class="btn flex-center">预约项目</view>
            <!-- <image src="/images/my/button.png">
          <text class="flex-center">预约项目</text>
        </image> -->
          </view>
        </view>
      </view>
      <view style="text-align:center;margin-top:100rpx;color:#fff;display: {{list.length == 0 ? 'block' : 'none'}};">
        该店铺暂无项目~
      </view>
    </view>
    <view class="title flex-align-center" style="justify-content: space-between" wx:if="{{ homeData.case_list && homeData.case_list.length > 0 }}">
      <text style="font-family: PingFangSC-Semibold, PingFang SC;">会员案例</text>
      <navigator url="/pages/caseList/caseList" hover-class="none">
        <view class="flex-align-center">
          <text style="font-size: 28rpx;color: #666666;">查看全部</text>
          <image style="width: 48rpx;height: 48rpx;" src="/images/icon_01.png"></image>
          <!-- <text style="font-size: 28rpx;color: #666666;">查看全部 >></text> -->
        </view>
      </navigator>
    </view>
    <scroll-view class="case-list" scroll-x>
      <view class="flex">
        <navigator url="/pages/caseDetail/caseDetail?id={{item.id}}" hover-class="none" wx:for="{{ homeData.case_list }}" wx:key="index" class="test">
          <view class="case-item flex-column">
            <image src="{{ item.cover }}"></image>
            <view class="text-box flex-column">
              <text class="ellipsis" style="font-size: 28rpx;font-family: PingFangSC-Medium, PingFang SC;">{{ item.title
                }}</text>
              <text class="ellipsis" style="font-size: 24rpx;color: #666666;">{{ item.desc }}</text>
            </view>
          </view>
        </navigator>
      </view>
    </scroll-view>
  </view>
  <navigator url="/pages/vip/vip" hover-class="none" wx:if="{{ activity.expire_time_seconds && activity.expire_time_seconds > 0 && btmToast }}">
    <view class="btm-toast">
      <view class="flex flex-center margin-box">
        <image src="/images/icon_avatar_01.png" class="left-image"></image>
        <view class="right flex1 flex-column">
          <view class="">
            <text>初次到店体验后福利，立即开卡享</text>
            <text style="color:#FF6CB2;">{{activity.discount}}</text>
            <text>折</text>
          </view>
          <text>福利活动剩余时间 {{activity.currentTime}}</text>
          <text>错过不再有，速领！</text>
        </view>
        <image src="/images/icon_close_01.png" class="close" catchtap="onCloseToast"></image>
        <view class="btn flex-center">立即开卡</view>
      </view>
    </view>
  </navigator>

  <wux-landscape visible="{{ false }}" maskClosable="{{ true }}" closable="{{ true }}" bind:close="onClose" data-key="visible" class="home-coupon" newPrefixCls="wux-popup-widtn">
    <view class="img-box" bindtap="onConfirm">
      <image src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/wxapp/20220413/coupon.png" class="coupon-popup-img" />
      <text>有效期：{{coupon.ex_time}}</text>
    </view>
    <!-- <view class="coupon-popup" style="display: none;">
  <text style="font-size: 36rpx;">恭喜获取优惠券一张</text>
  <view class="item flex">
    <view class="item-left flex-center">
      <text style="color: #fff;">新人\n体验券</text>
    </view>
    <view class="item-right flex1 flex-column">
      <text>有效期</text>
      <text>{{coupon.ex_time}}</text>
      <text>{{coupon.coupon_desc}}</text>
    </view>
  </view>
  <view class="btn flex-center" bindtap="onConfirm">确认领取</view>
</view> -->
  </wux-landscape>





  <!-- 一天一次 -->
  <!-- 项目详情 -->
  <!-- !visible && posterPopup -->
  <wux-landscape visible="{{ !visible && posterPopup }}" maskClosable="{{ true }}" closable="{{ true }}" wx:if="{{ homeData.ad && homeData.ad.cover }}" bind:close="onClose" data-key="posterPopup" class="home-poster" newPrefixCls="wux-popup-widtn">
    <view class="img-box" bindtap="goToUrl" data-url="{{ homeData.ad.url }}">
      <image src="{{homeData.ad.cover}}" class="coupon-popup-img" />
    </view>
  </wux-landscape>
</home-skeleton>

<wux-landscape visible="{{ guildMessage }}" maskClosable="{{ true }}" closable="{{ false }}" bind:close="onCloseLandscape" class="skin-popup" catchtouchmove="true">
  <view class="use-popup flex-column">
    <view class="text-cotent">
      <template is="wxParse" data="{{wxParseData:article.nodes}}" />
      <!-- <view class="title_guild">积分规则</view>
        <view class="inText">1.每消费1元=1积分</view>
        <view class="inText">2.游戏、任务、互动等赚积分（以具体告知为准）</view> -->
      <!-- <template is="wxParse" data="{{wxParseData:article.nodes}}" /> -->
    </view>
    <image src="/images/icon_20.png" class="close-img" bindtap="onCloseLandscape"></image>
  </view>
</wux-landscape>


<!-- <wux-landscape visible="{{ visible }}" maskClosable="{{ true }}" closable="{{ true }}" bind:close="onClose" data-key="visible" class="home-coupon" newPrefixCls="wux-popup-widtn" >
  <view class="img-box" bindtap="onConfirm">
    <swiper autoplay="{{true}}" class="coupon-popup-img1" bindchange="bindchanges" interval="1000">
      <block wx:for="{{newAcountImage}}" wx:key="*this">
        <swiper-item class="coupon-popup-img">
          <image src="{{item}}" class="coupon-popup-img1" />
          <view hidden="{{index==0?true:false}}" class="newAcountText">新用户专享</view>
          <view hidden="{{index==0?true:false}}" class="couponCard {{index==1?'colorShowLike':'colorVFace'}}">
            {{index==1?'上镜小V脸':'修丽可项目'}}</view>
          <view hidden="{{index==0?true:false}}" class="getNow {{index==1?'colorShowLikeGet':'colorVFaceGet'}}">立即领取
          </view>
        </swiper-item>
      </block>
    </swiper>

    <view class="onTag">
      <view wx:for="{{3}}" wx:key="*this" class="{{currentNewAcount==index?'onTag-index':'onTag-index-select'}}"></view>
    </view>
  </view>
</wux-landscape> -->
<!-- 十月一弹窗 -->
<!-- <wux-landscape wux-class='activePopBox' visible="{{ PopShow }}" bind:close="onClosePop">
  <view class="activePop">
    <image bindtap="gotoActive" src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/wxapp/20220928/%E4%BD%8D%E5%9B%BE%402x.png"></image>
  </view>
</wux-landscape> -->
<!-- <wux-landscape visible="{{ visible }}" maskClosable="{{ true }}" closable="{{ true }}" bind:close="onClose" data-key="visible" class="home-coupon" newPrefixCls="wux-popup-widtn">
</wux-landscape> -->
<!-- 匹配中弹窗 -->
<van-popup show="{{ matching }}" close-icon="close" closeable round bind:close="orderConfirmOnclose">
  <view class="scape-block">
    <!-- <view class="close">
      <image src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/wxapp/20220609/close.png"></image>
    </view> -->
    <view class="loading">
      <image src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/wxapp/20220609/loading.gif"></image>
    </view>
    <view class="matching-tips">美容师正在为您核实和确认搭配 项目和产品稍作等待……</view>
  </view>
</van-popup>
<!-- 悬浮领券图标 -->
<view class="suspend" bindtap="getCoupon" wx:if="{{false}}">
  <image src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/wxapp/20220822/%E7%BB%84%205%402x.png"></image>
</view>
<!-- 跳转公众号
<web-view>跳转</web-view> -->