数字教材列表

yiming

2024-06-04 1fa826006ce5458722eb68bdbd814b08bd6baad3

数字教材列表

 app.json

@@ -15,7 +15,9 @@
    "pages/bookServices/assort/index",
    "pages/testLogin/index",
    "pages/bindInfo/index",
    "pages/bookExhibitionList/select/select"
    "pages/bookExhibitionList/select/select",
    "pages/digitalTextbooks/index",
    "pages/digitalTextbooks/digitalTextbooksDetails/index"
  ],
  "subPackages": [
    {

 packageDomain/pages/resourceDetails/myAudio/index.js

@@ -573,6 +573,8 @@
    myAudio.onCanplay(() => {
      myAudio.duration; //必须写，不然获取不到
      setTimeout(() => {
        // 要初始化音频的时间
        // myAudio.startTime = myAudio.currentTime //开始时间
        this.setData({
          myAudioDuration: this.format(myAudio.duration),
          myAudioCurrent: this.format(myAudio.currentTime)
@@ -595,16 +597,20 @@
        myAudioCurrent: '00:00',
        myAudioPos: '',
      })



    });

    //进度条变化   
    myAudio.onTimeUpdate(() => {
      myAudio.startTime = 0
      this.setData({
        myAudioPos: myAudio.currentTime / myAudio.duration * 100,
        myAudioCurrent: this.format(myAudio.currentTime),
        myAudioDuration: this.format(myAudio.duration),
      });
      console.log(myAudio.currentTime, myAudio.duration);
      console.log(myAudio.currentTime.toFixed(3), myAudio.duration);
    })
  },


 pages/digitalTextbooks/digitalTextbooksDetails/index.js

New file
@@ -0,0 +1,66 @@
// pages/digitalTextbooks/digitalTextbooksDetails/index.js
Page({

  /**
   * 页面的初始数据
   */
  data: {

  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    console.log(options.id);
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})

 pages/digitalTextbooks/digitalTextbooksDetails/index.json

New file
@@ -0,0 +1,3 @@
{
  "usingComponents": {}
}

 pages/digitalTextbooks/digitalTextbooksDetails/index.wxml

New file
@@ -0,0 +1,5 @@
<!--pages/digitalTextbooks/digitalTextbooksDetails/index.wxml-->
<view>
  数字教材详情

</view>

 pages/digitalTextbooks/digitalTextbooksDetails/index.wxss

New file
@@ -0,0 +1 @@
/* pages/digitalTextbooks/digitalTextbooksDetails/index.wxss */

 pages/digitalTextbooks/index.js

New file
@@ -0,0 +1,232 @@
// pages/digitalTextbooks/digitalTextbooks.js
const app = getApp()
import {
  getPublicImage
} from "../../assets/js/middleGround/tool";
Page({

  /**
   * 页面的初始数据
   */
  data: {
    barHeight: "",
    navBarHeight: "",
    searchValue: "",
    tabPanelstyle: 'display:flex;justify-content:center;align-items:center;',
    tabList: [],
    selectedIndex: 0,
    digitalTextbooksData: [],
    path: "jsek_dTHigherEducation",

  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    const systInfo = wx.getSystemInfoSync();
    const menu = wx.getMenuButtonBoundingClientRect(); // 胶囊信息
    const navBarHeight =
      (menu.top - systInfo.statusBarHeight) * 2 + menu.height; // 导航栏高度
    this.setData({
      barHeight: systInfo.statusBarHeight,
      navBarHeight: navBarHeight,
    });
    this.getCourseTypeListList()
    this.bookExhibitionGet()
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  },
  //新加的函数

  getCourseTypeListList() {
    const data = {
      path: '*',
      filterList: [{
        value: 'Normal',
        field: 'state'
      }],
      queryType: '\\',
      searchList: [],
      size: '20',
      start: '0',
      storeRefCode: app.config.digitalTextbooks,
      sort: {
        type: 'Asc',
        field: 'LinkOrder'
      }
    }
    app.MG.store.getStoreChannelList(data).then((res) => {
      // 去除数组最后一个元素
      const newData = res.datas.slice(0, res.datas.length - 1)

      // 遍历数组并添加新的属性
      newData.forEach((item) => {
        item.titleIcon = getPublicImage(item.icon, '', '160')
      })

      this.setData({
        tabList: newData
      })
      console.log(this.data.tabList);

    })
  },




  goBack() {
    wx.navigateBack();
  },

  selectTab(e) {
    // console.log(index);
    let index = e.currentTarget.dataset.index
    console.log(index);
    this.setData({
      selectedIndex: index
    })

    if (index == 0) {
      this.setData({
        path: this.data.tabList[0].refCode
      })

    } else if (index == 1) {
      this.setData({
        path: this.data.tabList[1].refCode
      })

    } else if (index == 2) {
      this.setData({
        path: this.data.tabList[2].refCode
      })

    } else if (index == 3) {
      this.setData({
        path: this.data.tabList[3].refCode
      })

    }
    this.bookExhibitionGet()

  },
  // 获取图片文字列表
  bookExhibitionGet(keyword) {
    // console.log(path.value, '456')

    // loading.value = true
    let searchObj = {}
    // let sort = {}
    // 搜索框
    if (keyword) {
      searchObj = {
        'Name*': keyword.trim(),
        '||subtitle*': keyword.trim()
      }
    }

    // if (timeSort.value) {
    //     sort = {
    //         CreateDate: timeSort.value || 'Desc'
    //     }
    // } else {
    //     sort = {
    //         ViewCount: nameSort.value || 'Desc'

    //     }
    //     // 组合的写法 要查询的字段:升序和降序

    //     // Name: "Desc"
    //     //一般的排序传法
    //     // type: "Asc",
    //     // field: "CreateDate",
    // }
    app.MG.store
      .getProductList({
        storeInfo: 'jsek_digitalTextbooks',
        path: this.data.path,
        queryType: '*',
        paging: {
          start: 0,
          size: 99
        },
        // sort: sort,
        fields: {
          content: [],
          subtitle: [],
          backgroundSelection: [],
          author: [],
          viewCount: [],
          ...searchObj
        }
      })
      .then((res) => {
        this.setData({
          digitalTextbooksData: res.datas
        })
        console.log(this.data.digitalTextbooksData);
      })
  },
  searchBook: function (e) {
    const keyword = e.detail.value;
    this.bookExhibitionGet(keyword)
  },
  jumpDetails(e) {
    const item = e.currentTarget.dataset.item
    console.log(item);
    // 在某个事件处理函数中，比如按钮的点击事件
    wx.navigateTo({
      url: '/pages/digitalTextbooks/digitalTextbooksDetails/index?id=' + item.id
    });

  }
})

 pages/digitalTextbooks/index.json

New file
@@ -0,0 +1,9 @@
{
  "usingComponents": {
    "t-icon": "tdesign-miniprogram/icon/icon",
    "t-search": "tdesign-miniprogram/search/search",
    "t-empty": "tdesign-miniprogram/empty/empty"
  },
  "navigationStyle": "custom",
  "disableScroll": false
}

 pages/digitalTextbooks/index.wxml

New file
@@ -0,0 +1,63 @@
<!--pages/digitalTextbooks/digitalTextbooks.wxml-->

<view class="fixed-header">
  <view style="width: 100%; height: {{barHeight}}px;"></view>
  <view class="nacigationBar" style="width: 70%; height: {{navBarHeight}}px;">
    <view>
      <t-icon name="chevron-left" size="30" data-name="{{item}}" bind:click="goBack" />
    </view>
    <t-search model:value="{{searchValue}}" shape="round" placeholder="请输入关键词/书名/ISBN/作者" class="navBar-search" style="width: 464rpx" bind:submit="searchBook" />
  </view>



  <view class="tabBox">
    <view wx:for="{{tabList}}" wx:key="index" wx:for-item="item" wx:for-index="index" class="{{selectedIndex == index? 'nameBox' :''}}" data-index="{{index}}" bind:tap="selectTab">
      <view>
        {{item.name}}
      </view>
      <view style="margin-top: 20rpx; " class="{{selectedIndex == index? 'bottomLineBox' :''}}"></view>
    </view>
  </view>

</view>



<view class="contentBox">

  <view class="titleBox">
    <view class="frameBox"></view>
    <view class="titleTextBox">
      <!-- <image src="/static/images/bookExhibitionList/zhuantitaolun.png" mode="aspectFit" /> -->

      <view>数字教材列表</view>
    </view>
  </view>



  <view class="bookContentBox">
    <view class="external" wx:for="{{digitalTextbooksData}}" wx:key="index" wx:for-item="item" wx:for-index="index" data-item="{{item}}" bind:tap="jumpDetails">
      <view class="amountClick">
        <t-icon name="browse" size="15" data-name="{{item}}" bind:click="goBack" />
        <view>{{item.viewCount}}</view>
      </view>
      <view class="imageBox">
        <image src="{{item.icon ? item.icon : '/static/images/default-book-img.png'}}" mode="" />
      </view>
      <view class="bookName">{{item.name}}</view>
      <view class="information">
        <view wx:if="{{item.author}}" class="book-author">
          {{ item.author }}
        </view>
        <view wx:else>-</view>
        <view wx:if="{{item.price == 0}}" class="price"> 免费</view>
        <view wx:else class="price">￥{{ item.price }}</view>
      </view>
    </view>
    <view wx:if="{{!digitalTextbooksData.length }}" class="noData">
      <t-empty icon="folder-open" description="暂无数据" />
    </view>
  </view>
</view>

 pages/digitalTextbooks/index.wxss

New file
@@ -0,0 +1,186 @@
/* pages/digitalTextbooks/index.wxss */

.nacigationBar {
  display: flex;
  align-items: center;
  --td-search-font-size: 28rpx;
  margin-bottom: 30rpx;
}


.nacigationBar .t-icon-base {
  font-size: 38rpx;
}

.t-search__input-box {
  height: var(--td-search-height, 70rpx) !important;
}

.t-icon {
  font-family: t !important;
}





.tabBox {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  width: 750rpx;
  overflow-x: auto;
  /* 添加水平滚动条 */
  white-space: nowrap;
  /* 保持子元素在一行显示 */

}

.tabBox .nameBox {
  color: #FF6C00;
  height: 70rpx;
  /* border-bottom: 1px solid #FF6C00; */
}

.bottomLineBox {
  height: 5rpx;
  width: 50rpx;
  background-color: #FF6C00;
  margin: 0 auto;
}

.contentBox {
  background-color: #F2F3F8;
  height: 100%;
  margin-top: 268rpx;
}

.titleBox {
  display: flex;
  align-items: center;
  margin: 10px;
  margin-left: 0;
  padding-top: 30rpx;
}

.frameBox {
  width: 7rpx;
  height: 54rpx;
  background: #FF6C00;
  border-radius: 0rpx 9rpx 9rpx 0rpx;
}

.titleTextBox {
  margin-left: 15px;
  min-width: 180rpx;
  min-height: 36rpx;
  /*宽 3.7   高1 */
}

.titleTextBox image {
  width: 100%;
  height: 100%;
  image-rendering: -webkit-optimize-contrast;
}

.bookContentBox {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 20rpx;
}

.external {
  width: 300rpx;
  min-height: 520rpx;
  background-color: #fff;
  margin: 30rpx 10rpx;
  box-shadow: 0px 3px 6px 1px rgba(0, 0, 0, 0.16);
  padding: 15rpx;
}

.imageBox {
  width: 210rpx;
  height: 290rpx;
  margin: 30rpx auto;
  box-shadow: 0px 3px 6px 1px rgba(0, 0, 0, 0.16);
}

image {
  width: 100%;
  height: 100%;
}

.amountClick {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  font-size: 30rpx;

}

.information {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: 0 20rpx;
}

.bookName {
  margin: 0 20rpx;
  height: 75rpx;
  color: #333;
  width: 100%;
  font-size: 28rpx;
  font-weight: 700;
  word-break: break-all;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-align: left;
}

.book-author {
  color: #333;
  margin: 16rpx 0;
  font-size: 24rpx;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
}

.price {
  color: #FF6C00;
  margin: 16rpx 0;
  font-size: 24rpx;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
}

.noData {
  margin: 0 auto;
  margin-top: 100rpx;
}

/* 固定在顶部的盒子样式 */
.fixed-header {
  position: fixed;
  /* 固定定位 */
  top: 0;
  /* 距离顶部0px */
  left: 0;
  /* 距离左侧0px */
  width: 100%;
  /* 宽度为100%，可根据需要调整 */
  background-color: #ffffff;
  /* 背景颜色，可根据需要调整 */
  z-index: 999;
  /* 确保盒子在页面其他元素的上方 */
  /* 其他样式，如padding、box-shadow等 */
}

 pages/retrievalPage/index.js

@@ -38,7 +38,8 @@
      page: 1,
      total: 0,
    },
    tabValue: '0'
    tabValue: '0',
    tabPanelstyle: 'display:flex;justify-content:center;align-items:center;',
  },

  /**
@@ -554,6 +555,7 @@
   * 页面上拉触底事件的处理函数
   */
  onReachBottom(e) {
    console.log(this.data.tabValue);
    if (this.data.tabValue == 0) {
      console.log(0);
      if (this.data.bookData.length < this.data.bookTotal) {
@@ -867,4 +869,10 @@
      }
    }
  },
  onTabsClick(event) {
    console.log(`Click tab, tab-panel value is ${event.detail.value}.`);
  },
  tabClick() {
    console.log(2323);
  }
})

 pages/retrievalPage/index.wxml

@@ -12,8 +12,9 @@

  <view class="tabsBox">
    <!-- sticky="true" -->
    <t-tabs defaultValue="{{0}}" value="{{tabValue}}" bind:change="onTabsChange" t-class="custom-tabs" t-class-content="custom-panel">
      <t-tab-panel label="图书({{bookTotal}})" value="0">
    <t-tabs defaultValue="{{0}}" bind:change="onTabsChange" bind:click="onTabsClick" t-class="custom-tabs" t-class-content="custom-panel">

      <t-tab-panel label="图书({{bookTotal}})" value="0" style="{{tabPanelstyle}}" bind:tap="tabClick">
        <view wx:if="{{bookData.length <= 0}}" class="noDataBox">
          <t-empty icon="folder-open" description="暂无数据" />
        </view>