闫增涛
2024-05-07 4a9955330070cf8abd78d95aaa2067d9a06a88c3
pages/home/home.wxml
@@ -1,36 +1,438 @@
<view style="text-align: center; color: #b9b9b9" wx:if="{{pageLoading}}">
  <t-loading theme="circular" size="40rpx" text="加载中..." inherit-color />
<view class="container">
  <t-pull-down-refresh
    value="{{baseRefresh.value}}"
    loadingTexts="{{['下拉刷新', '松手刷新', '正在刷新', '刷新完成']}}"
    bind:refresh="onPullDownRefresh"
    wx:if="{{!loading}}"
    bind:scroll="onScroll"
  >
    <view
      class="background {{ isWhite ? 'white':''}}"
      style="padding-top: {{barHeight}}px"
    >
      <text class="text">京师E课</text>
    </view>
    <view class="home-page-header">
      <view class="bg">
        <image
          src="/static/images/home/home-bg.png"
          mode="heightFix"
          class="image"
        />
      </view>
      <view class="search">
        <t-search
          t-class-input="t-search__input"
          t-class-input-container="t-search__input-container"
          placeholder="请输入关键词/书名/ISBN/作者"
          leftIcon=""
          bind:submit="onRetrievalPage"
          model:value="{{searchVal}}"
        >
          <t-icon
            slot="left-icon"
            prefix="wr"
            name="search"
            size="40rpx"
            color="#bbb"
            bind:tap="navToSearchPage"
          />
        </t-search>
      </view>
      <view class="swiper-wrap">
        <!-- <t-swiper wx:if="{{bannerList.length > 0}}" list="{{bannerList}}" autoplay="{{autoplay}}" duration="{{duration}}" interval="{{interval}}" navigation="{{ { type: 'dots' } }}" height="380rpx" bind:click="navToActivityDetail" /> -->
        <swiper
          interval="5000"
          indicator-dots="true"
          autoplay="true"
          circular="true"
          class="swiper"
        >
          <swiper-item
            wx:for="{{bannerList}}"
            wx:for-index="index"
            wx:key="index"
            data-info="{{item}}"
            bindtap="navToActivityDetail"
          >
            <view class="swiperItem">
              <image src="{{item.value}}" mode="widthFix" class="img" />
            </view>
          </swiper-item>
        </swiper>
      </view>
    </view>
    <view class="home-page-menu">
      <t-grid
        class="t-grid-block"
        theme="card"
        border="{{border}}"
        column="{{5}}"
      >
        <t-grid-item
          wx:for="{{tabList}}"
          wx:for-index="index"
          wx:key="index"
          text="{{item.text}}"
          image="{{item.icon}}"
          data-info="{{item}}"
          bindtap="toPages"
        />
      </t-grid>
    </view>
    <view class="home-page-container">
      <view class="home-page-list">
        <view class="tabCardPublic iconOne">
          <view class="icon">
            <image
              src="/static/images/home/zhuantitaolun2.png"
              mode="aspectFit"
              class="iconImage"
            />
          </view>
          <view
            data-info="{{'zhuantitaolun'}}"
            bindtap="onMoreGuide"
            class="flex"
            style="align-items: center"
          >
            <text class="more">更多</text>
            <t-icon name="chevron-right" size="32rpx" color="#ff6d00" />
          </view>
        </view>
        <view class="listBox">
          <view
            wx:for="{{specialSubjectList}}"
            wx:for-item="item"
            wx:for-index="index"
            wx:key="index"
            class="listItemBox"
          >
            <view
              class="listItem"
              bindtap="goSubjectDetail"
              data-book="{{item}}"
            >
              <view class="specialSubject-img">
                <image src="{{item.icon}}" mode="aspectFill" class="img" />
              </view>
              <view class="body-info">
                <view class="name">{{item.name}}</view>
                <view class="time" wx:if="{{item.liveTime}}"
                  >直播时间:{{item.liveTime}}</view
                >
                <view class="time" wx:if="{{item.startTime}}"
                  >开播时间:{{ item.startTime }}</view
                >
                <view class="time" wx:if="{{!item.liveTime && !item.startTime}}"
                  >开播时间:<text class="grey">待定</text></view
                >
                <view class="flex jc-sb">
                  <text class="author"
                    >{{item.lecturer}} {{item.position}}</text
                  >
                  <text class="price" wx:if="{{item.price == 0}}">免费</text>
                  <text class="price" wx:if="{{item.price !== 0}}"
                    >¥{{item.price}}</text
                  >
                </view>
              </view>
            </view>
          </view>
        </view>
        <view class="tabCardPublic iconTwo">
          <view class="icon">
            <image
              src="/static/images/home/jingxuankecheng2.png"
              mode="aspectFit"
              class="iconImage"
            />
          </view>
          <view
            data-info="{{'jingxuankecheng'}}"
            bindtap="onMoreGuide"
            class="flex"
          >
            <text class="more">更多</text>
            <t-icon name="chevron-right" size="32rpx" color="#ff6d00" />
          </view>
        </view>
        <view class="home-page-tabs">
          <t-tabs
            t-class="t-tabs"
            split="{{false}}"
            defaultValue="{{activeItem}}"
            bind:change="tabChangeHandle"
          >
            <t-tab-panel
              wx:for="{{courseTypeList}}"
              wx:for-index="index"
              wx:key="index"
              label="{{item.name}}"
              value="{{index}}"
            />
          </t-tabs>
        </view>
        <view class="listBox1">
          <view wx:if="{{courseList.length>0}}">
            <view
              wx:for="{{courseList}}"
              wx:for-item="item"
              wx:for-index="index"
              wx:key="index"
              class="listItemBox"
            >
              <view class="listItem flex">
                <view
                  class="specialSubject-img"
                  data-book="{{item}}"
                  bindtap="goCourseDetail"
                >
                  <image src="{{item.icon}}" mode="aspectFill" class="img" />
                </view>
                <view class="body-info">
                  <view
                    class="name"
                    data-book="{{item}}"
                    bindtap="goCourseDetail"
                    >{{item.name}}</view
                  >
                  <view class="flex jc-sb">
                    <text class="author">{{item.courseLeader}}</text>
                    <text class="classHours">{{item.classHours}}课时</text>
                  </view>
                  <view class="priceBox flex jc-sb">
                    <text class="price" wx:if="{{item.price == 0}}">免费</text>
                    <text class="price" wx:if="{{item.price !== 0}}"
                      >¥{{item.price}}</text
                    >
                    <image
                      src="/static/images/home/home-cart.png"
                      mode="aspectFit"
                      class="addCartImg"
                      bind:tap="addCart"
                      data-info="{{item}}"
                    />
                  </view>
                </view>
              </view>
            </view>
          </view>
          <view class="empyt" wx:else>
            <t-empty icon="folder-open" description="暂无数据" font-size="80" />
          </view>
        </view>
        <view class="tabCardPublic iconTwo">
          <view class="icon">
            <image
              src="/static/images/home/tushufuwu2.png"
              mode="aspectFit"
              class="iconImage"
            />
          </view>
          <view data-info="{{'tushufuwu'}}" bindtap="onMoreGuide" class="flex">
            <text class="more">更多</text>
            <t-icon name="chevron-right" size="32rpx" color="#ff6d00" />
          </view>
        </view>
        <view class="home-page-tabs">
          <t-tabs
            t-class="t-tabs"
            split="{{false}}"
            position="{{'home'}}"
            defaultValue="{{activeItem1}}"
            bind:change="tabBookClick"
          >
            <t-tab-panel
              wx:for="{{bookTypeList}}"
              wx:for-index="index"
              wx:key="index"
              label="{{item.name}}"
              value="{{index}}"
            />
          </t-tabs>
        </view>
        <view class="listBox2">
          <view wx:if="{{booksList.length > 0}}" class="flex">
            <view
              wx:for="{{booksList}}"
              wx:for-item="item"
              wx:for-index="index"
              wx:key="index"
              class="booksListItemBox"
            >
              <view class="listItem" bind:tap="goDetail" data-book="{{item}}">
                <view class="specialSubject-img">
                  <image
                    src="{{item.icon ? item.icon : '/static/images/default-book-img.png'}}"
                    mode="aspectFit"
                    class="img"
                    aria-label="{{item.name}}"
                  />
                </view>
                <view class="body-info">
                  <view class="name">{{item.name}}</view>
                  <view class="author">{{item.author}}</view>
                </view>
              </view>
            </view>
          </view>
          <view class="empyt" wx:else>
            <t-empty icon="folder-open" description="暂无数据" font-size="80" />
          </view>
        </view>
        <view class="tabCardPublic iconTwo">
          <view class="icon">
            <image
              src="/static/images/home/shuziyuedu2.png"
              mode="aspectFit"
              class="iconImage"
            />
          </view>
          <view data-info="{{'shuziyuedu'}}" bindtap="onMoreGuide" class="flex">
            <text class="more">更多</text>
            <t-icon name="chevron-right" size="32rpx" color="#ff6d00" />
          </view>
        </view>
        <view class="listBox2 flex">
          <view
            wx:for="{{readBookList}}"
            wx:for-item="item"
            wx:for-index="index"
            wx:key="index"
            class="booksListItemBox"
          >
            <view
              class="listItem"
              bind:tap="goReadBookDetail"
              data-book="{{item}}"
            >
              <view class="specialSubject-img">
                <image src="{{item.icon}}" mode="aspectFit" class="img" />
              </view>
              <view class="body-info">
                <view class="name">{{item.name}}</view>
                <view class="author">{{item.author}}</view>
              </view>
            </view>
          </view>
        </view>
        <view class="tabCardPublic iconTwo">
          <view class="icon">
            <image
              src="/static/images/home/shuzijiaocai2.png"
              mode="aspectFit"
              class="iconImage"
            />
          </view>
          <view
            data-info="{{'shuzijiaocai'}}"
            bindtap="onMoreGuide"
            class="flex"
          >
            <text class="more">更多</text>
            <t-icon name="chevron-right" size="32rpx" color="#ff6d00" />
          </view>
        </view>
        <view class="listBox3">
          <view wx:if="{{textbookList.length > 0}}">
            <view
              wx:for="{{textbookList}}"
              wx:for-item="item"
              wx:for-index="index"
              wx:key="index"
              class="textbooksItemBox"
            >
              <view class="listItem flex">
                <view
                  class="specialSubject-img"
                  bind:tap="goTextBookDetail"
                  data-book="{{item}}"
                >
                  <image src="{{item.icon}}" mode="aspectFit" class="img" />
                </view>
                <view class="body-info">
                  <view
                    class="name"
                    bind:tap="goTextBookDetail"
                    data-book="{{item}}"
                    >{{item.name}}</view
                  >
                  <view
                    class="introduction"
                    bind:tap="goTextBookDetail"
                    data-book="{{item}}"
                    >{{item.description}}</view
                  >
                  <view class="author">{{item.author}}</view>
                  <view class="priceBox flex jc-sb">
                    <text class="price" wx:if="{{item.price == 0}}">免费</text>
                    <text class="price" wx:if="{{item.price !== 0}}"
                      >¥{{item.price}}</text
                    >
                    <image
                      src="/static/images/home/home-cart.png"
                      mode="aspectFit"
                      class="addCartImg"
                      bind:tap="addCart"
                      data-info="{{item}}"
                    />
                  </view>
                </view>
              </view>
            </view>
          </view>
          <view class="empyt" wx:else>
            <t-empty icon="folder-open" description="暂无数据" font-size="80" />
          </view>
        </view>
        <view class="tabCardPublic">
          <view class="icon">
            <image
              src="/static/images/home/paihangbang2.png"
              mode=""
              class="iconImage"
            />
          </view>
        </view>
        <view class="rankingList">
          <scroll-view class="srcolbox" scroll-x scroll-with-animation="true">
            <view class="booksListBox">
              <view
                wx:for="{{rankingList}}"
                wx:for-item="item"
                wx:for-index="index"
                wx:key="index"
                class="booksListItemBox"
              >
                <view class="listItem" bind:tap="goDetail" data-book="{{item}}">
                  <view class="specialSubject-img">
                    <image
                      src="{{item.icon}}"
                      mode="aspectFit"
                      class="img"
                      wx:if="{{item.icon}}"
                    />
                    <image
                      src="/static/images/default-book-img.png"
                      mode="aspectFit"
                      class="img"
                      wx:else
                    />
                  </view>
                  <view class="body-info">
                    <view class="name">{{item.name}}</view>
                    <!-- <view class="author">{{item.author}}</view> -->
                  </view>
                </view>
              </view>
            </view>
          </scroll-view>
        </view>
      </view>
    </view>
  </t-pull-down-refresh>
</view>
<view class="home-page-header">
  <view class="search" bind:tap="navToSearchPage">
    <t-search t-class-input="t-search__input" t-class-input-container="t-search__input-container" placeholder="请输入关键词/书名/ISBN/作者" leftIcon="" disabled>
      <t-icon slot="left-icon" prefix="wr" name="search" size="40rpx" color="#bbb" />
    </t-search>
  </view>
  <view class="swiper-wrap">
    <t-swiper
    wx:if="{{bannerList.length > 0}}"
    list="{{bannerList}}"
    current="{{current}}"
    autoplay="{{autoplay}}"
    duration="{{duration}}"
    interval="{{interval}}"
    navigation="{{navigation}}"
    bind:click="navToActivityDetail"
    />
  </view>
  <view class="headerList">
  </view>
</view>
<view class="home-page-container">
  <view class="home-page-tabs">
    <t-tabs t-class="t-tabs" t-class-active="tabs-external__active" t-class-item="tabs-external__item" defaultValue="{{0}}" space-evenly="{{false}}" bind:change="tabChangeHandle">
      <t-tab-panel wx:for="{{tabList}}" wx:for-index="index" wx:key="index" label="{{item.text}}" value="{{item.key}}" />
    </t-tabs>
  </view>
  <goods-list wr-class="goods-list-container" goodsList="{{goodsList}}" bind:click="goodListClickHandle" bind:addcart="goodListAddCartHandle" />
  <load-more list-is-empty="{{!goodsList.length}}" status="{{goodsListLoadStatus}}" bind:retry="onReTry" />
  <t-toast id="t-toast" />
</view>
<import src="home.skeleton.wxml" />
<template is="skeleton" wx:if="{{loading}}" />