书展和书展详情

yiming

2024-02-28 4cf55474ff49d11150dfaca3633224eceea47823

书展和书展详情

 app.json

@@ -2,6 +2,8 @@
  "pages": [
    "pages/home/home",
    "pages/bookServices/index",
    "pages/bookExhibitionList/index",
    "pages/bookExhibitionDetails/index",
    "pages/usercenter/index",
    "pages/usercenter/person-info/index",
    "pages/usercenter/address/list/index",

 assets/js/middleGround/api/store.js

@@ -301,7 +301,10 @@
        ]
      })
    }

    let token = wx.getStorageSync(tokenKey) ? wx.getStorageSync(tokenKey) : '';


    let url = token ? '/store/api/ApiQueryProductByAppUser' : '/store/api/ApiQueryProduct'
    return request({
      url: url,

 custom-tab-bar/data.js

@@ -9,6 +9,7 @@
    text: '图书服务',
    url: 'pages/bookServices/index'
  },

  {
    icon: 'sort',
    text: '学习',

 pages/bookExhibitionDetails/index.js

New file
@@ -0,0 +1,136 @@
// pages/bookExhibitionDetails/index.js
const app = getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    bookName: null,
    bookBeginDate: null,
    bookCreator: null,
    bookContent: null,
    bookImage: null,
    bookExhibitionList: []
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {

    const passId = options.id

    this.bookExhibitionGet(passId)
    this.getBookExhibitionDetails(passId)
  },

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

  },

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

  },

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

  },

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

  },

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

  },

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

  },

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

  },

  bookExhibitionGet(passId) {
    wx.showLoading({
      title: '加载中...',
    })
    console.log(passId, 8988989);
    app.MG.store.getProductDetail({
      storeInfo: 'jsek_bookFair', //商品库
      path: '*', //路径
      queryType: '*',
      productId: passId, //详情的id
      fields: {
        subtitle: [],
        content: [],
        isbn: [],
        introduction: [],
        Creator: []
      }
    }).then(res => {
      console.log(res.datas.datas.Creator.Name, 'res');
      this.setData({
        bookName: res.datas.name,
        bookBeginDate: res.datas.beginDate,
        bookCreator: res.datas.datas.Creator.Name,
        bookContent: res.datas.content,
        bookImage: res.datas.icon
      });
      wx.hideLoading()
    })
  },
  //书展详情接口
  getBookExhibitionDetails(passId) {
    app.MG.store.getProductList({
      path: '*',
      storeInfo: 'jsek_bookFair',
      mainProductId: passId,
      queryType: 'Related', // 查询类型： Related：查询关联商品；SubProduct: 查询子商品；
      fields: {
        author: [],
        publicationDate: [],
        isbn: [],
        content: [],
        Creator: []
      }
    }).then(res => {

      this.setData({
        bookExhibitionList: res.datas
      })
      console.log(this.data.bookExhibitionList, 88888);
    })
  },
  onBookDetails(event) {
    const item = event.currentTarget.dataset.item;
    console.log(item, 'item');
    // wx.navigateTo({
    //   url: '/pages/bookExhibitionDetails/index?id?name=' + item.id + item.name // 假设跳转到详情页面，并传递了id参数
    // });
  }

})

 pages/bookExhibitionDetails/index.json

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

 pages/bookExhibitionDetails/index.wxml

New file
@@ -0,0 +1,32 @@
<!--pages/bookExhibitionDetails/index.wxml-->


<view class="headBox">
  <text class="titleBox">{{bookName}}</text>
  <view class="informationBox">
    <text class="informationNameBox">发布人:{{bookCreator}}</text>
    <text class="informationTimeBox">发布日期：{{bookBeginDate}}</text>

  </view>
</view>



<image class="partingBox" src="/static/images/bookExhibitionDetails/Parting.png" mode="" />

<image class="bannerBox" src="{{bookImage}}" mode="" />

<view class="textContent">
  <rich-text nodes="{{bookContent}}"></rich-text>

  <!-- <text>{{bookContent}}</text> -->
</view>
<view class="outsideBooksBox">
  <view class="booksBox" wx:for="{{bookExhibitionList}}" wx:key="index" wx:for-item="item" wx:for-index="index" data-item="{{item}}" bind:tap="onBookDetails">
    <view class="outsideBooksImageBox">
      <image class="booksImageBox" src="{{item.icon}}" mode="" />
    </view>
    <view class="booksTextBox"> <text>{{item.name}}</text></view>

  </view>
</view>

 pages/bookExhibitionDetails/index.wxss

New file
@@ -0,0 +1,86 @@
/* pages/bookExhibitionDetails/index.wxss */
.headBox {
  /* width: 750rpx; */
  text-align: center;

}

.titleBox {
  font-weight: 800;
  font-size: 45rpx;
}

.informationBox {
  margin-top: 30rpx;
  display: flex;
  justify-content: space-around;
  padding: 0 50rpx;
  font-size: 25rpx;
  color: #545C63;
  font-weight: 400;
}

.partingBox {
  width: 750rpx;
  height: 40rpx;
  margin: 30rpx 0;
}

.bannerBox {
  width: 690rpx;
  height: 270rpx;
  margin: 0 30rpx;
}

.textContent {
  width: 690rpx;
  /* height: 315rpx; */
  padding: 0 30rpx;
  font-size: 25rpx;
  color: #545C63;
  font-weight: 400;
  line-height: 50rpx;
  margin: 20rpx 2rpx;
}


.booksBox {
  width: 330rpx;
  /* height: 430rpx; */
  /* background-color: #8bc34a; */
  margin: 20rpx;
  background: #FFFFFF;
  box-shadow: 0rpx 0rpx 18rpx 2rpx rgba(0, 0, 0, 0.08);
}

.booksImageBox {
  width: 240rpx;
  height: 300rpx;
  margin: 30rpx;

}

.outsideBooksImageBox {
  background: #F5F5F5;
  width: 300rpx;
  margin: 0 auto;
  margin-top: 15rpx;

}

.booksTextBox {
  font-size: 25rpx;
  font-family: PingFang SC, PingFang SC;
  font-weight: bold;
  width: 280rpx;
  margin: 30rpx 25rpx;
  /* overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; */

}

.outsideBooksBox {
  display: flex;
  flex-wrap: wrap;
}

 pages/bookExhibitionList/img/banner.png

 pages/bookExhibitionList/index.js

New file
@@ -0,0 +1,308 @@
// pages/bookExhibitionList/index.js
import Toast from 'tdesign-miniprogram/toast/index';

const app = getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    nameSort: null,
    total: null,
    page: {
      start: 0,
      size: 16
    },
    keynoteValue: null,
    filteredItems: [],
    newValue: null,
    value: '',
    bookExhibitionList: [],
    sorter: {
      value: 'default',
    },
    product: {
      value: '*',

      options: [
        {
          value: '*',

          label: '总分类',
        },
        {
          value: 'jsek_bFHigherEducation',
          //重点项目
          price: 'jsek_higherEducation',
          label: '高等教育',
        },
        {
          value: 'jsek_bFVocationalEducation',
          //重点项目
          price: 'jsek_vocationalEducation',
          label: '职业教育',
        },
        {
          value: 'jsek_bFTeacherEducation',
          //重点项目
          price: 'jsek_teacherEducation',
          label: '教师教育',
        },
      ],
    },
    multipleSelect: {
      value: [],
      options: [],
    },
  },



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

  },

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

    this.keyProjectsGet()
  },

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

  },

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

  },

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

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {
    // console.log(this.data.page.size);
    // console.log(this.data.total);
    if (this.data.page.size >= this.data.total) {
      console.log('已加载完所有数据');
      Toast({
        context: this,
        selector: '#t-toast',
        message: '没有更多了',
        direction: 'column',
        duration: 1000,
        preventScrollThrough: true,
        icon: 'poweroff',
      });
    } else {
      // const currentPage = this.data.page.start + 1; // 获取当前页数并加1
      const newSize = this.data.page.size + 10; // 原来的基础上加10
      this.setData({
        // 'page.start': currentPage,
        'page.size': newSize
      });
      this.bookExhibitionGet(); // 调用方法加载更多数据
      console.log(1111);
    }
  },



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

  },
  // 图片数据的接口
  bookExhibitionGet(newValue) {
    wx.showLoading({
      title: '加载中...',
    })

    // console.log(this.data.keynoteValue);
    let sort = {
      Name: this.data.nameSort || 'Desc'
    }
    app.MG.store.getProductList({
      storeInfo: 'jsek_bookFair',
      path: newValue,
      queryType: '*',
      fields: {
        jsek_link: [],
        'bookClassification*': this.data.keynoteValue || []
      },
      paging: this.data.page,
      sort: sort,
      // coverSize: {
      //   width: 100
      // },
    }).then(res => {

      this.data.total = res.total

      //  list.push(res.datas)
      const list = [...res.datas]

      this.setData({
        bookExhibitionList: list
      })
      //取消
      wx.hideLoading()
      // console.log(this.data.bookExhibitionList, '数据');
    })

  },
  //重点项目接口
  keyProjectsGet(newPrice) {
    // console.log(newPrice, 'newPrice');
    let parms = {
      refCodes: ['bookClassification']
    }
    app.MG.store.getProductTypeField(parms).then(res => {

      const checkData = JSON.parse(res[0].config)


      checkData.option.forEach(item => {
        if (newPrice == item.value) {

          this.setData({
            filteredItems: item.child || [] // 如果存在子项则赋值，否则赋值为空数组
          });

          // console.log(this.data.filteredItems);

        }
      })

      this.onLoad();
    })
  },


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

    // 单列选择器选项
    const singleSelectOptions = this.data.filteredItems.map(item => ({
      label: item.name,
      value: item.value,
      disabled: false,
    }))

    if (this.data.filteredItems = []) {
      console.log(11111);
      singleSelectOptions.push({
        label: '禁用选项',
        value: 'disabled',
        disabled: true,
      });
    }

    // singleSelectOptions.push({
    //   label: '禁用选项',
    //   value: 'disabled',
    //   disabled: true,
    // });


    // 更新数据
    this.setData({
      'multipleSelect.options': singleSelectOptions,
    });

  },


  // 总分类
  // 总分类
  onChange(e) {

    this.data.page.size = 16 //更改显示的值
    const newValue = e.detail.value;
    const selectedOption = this.data.product.options.find(option => option.value === newValue);
    const newPrice = selectedOption ? selectedOption.price : null;
    this.setData({
      'product.value': newValue,
      'product.price': newPrice, // 将选中的 price 值保存在数据中
    });
    this.bookExhibitionGet(newValue);
    this.keyProjectsGet(newPrice);
    // 调用更新页面数据的函数，传入新的 value 和 price 值

    if (this.data.keynoteValue) {
      //如果有数据就清空并刷新页面
      this.data.keynoteValue = []

      this.bookExhibitionGet(newValue)
      this.onLoad()
      console.log('true');
    } else {
      // this.bookExhibitionGet(newValue);
      // this.keyProjectsGet(newPrice);
      console.log('fals');
    }

  },

  // 重点项目
  handleMultipleSelect(e) {
    this.setData({
      'multipleSelect.value': e.detail.value,
    });
  },
  handleConfirm(event) {
    const { value } = event.detail;
    // 确认操作的处理逻辑

    console.log('确认操作，选中的值为：', value);
    this.data.keynoteValue = value
    this.bookExhibitionGet()
  },
  handleReset() {
    // 重置操作的处理逻辑
    this.data.keynoteValue = []
    console.log('重置操作');
    this.bookExhibitionGet()
  },
  onSwapRight() {
    // console.log('xxxxxx');
    this.data.nameSort = 'Asc'
    this.bookExhibitionGet()
  },
  onSwapLeft() {
    this.data.nameSort = 'Desc'
    // console.log('sssssss');
    this.bookExhibitionGet()
  },
  onBookExhibitionDetails: function (event) {
    const item = event.currentTarget.dataset.item;
    console.log(item);
    wx.navigateTo({
      url: '/pages/bookExhibitionDetails/index?id=' + item.id // 假设跳转到详情页面，并传递了id参数
    });
  }
})

 pages/bookExhibitionList/index.json

New file
@@ -0,0 +1,12 @@
{
  "component": true,
  "usingComponents": {
    "t-button": "tdesign-miniprogram/button/button",
    "t-search": "tdesign-miniprogram/search/search",
    "t-dropdown-menu": "tdesign-miniprogram/dropdown-menu/dropdown-menu",
    "t-dropdown-item": "tdesign-miniprogram/dropdown-item/dropdown-item",
    "t-toast": "tdesign-miniprogram/toast/toast",
    "t-icon": "tdesign-miniprogram/icon/icon"
  },
  "onReachBottomDistance": 200
}

 pages/bookExhibitionList/index.wxml

New file
@@ -0,0 +1,47 @@
<!--pages/bookExhibitionList/index.wxml-->

<!-- 弹出框 禁止 -->
<t-toast id="t-toast" />


<view class="example-search">
  <t-search model:value="{{value}}" placeholder="请输入关键词/书目/ISBN/作者" />
</view>








<view class="menuBox">
  <t-dropdown-menu class="classification">

    <t-dropdown-item options="{{product.options}}" value="{{product.value}}" bindchange="onChange" />
    <t-dropdown-item label="重点项目" options="{{multipleSelect.options}}" value="{{multipleSelect.value}}" bindchange="handleMultipleSelect" multiple bind:confirm="handleConfirm" bind:reset="handleReset" />



  </t-dropdown-menu>
  <view class="sortBox">
    <text>排序</text>
    <view class="iconBox">
      <t-icon class="swapRight" name="swap-right" size="48rpx" bind:click="onSwapRight" />
      <t-icon class="swapLeft" name="swap-right" size="48rpx" bind:click="onSwapLeft" />
    </view>
  </view>
</view>

<view class="titleBox">
  <view class="frameBox"></view> <text class="titleTextBox"> 线上书展</text>
</view>
<view class="outside">

  <view class="contentBox" wx:for="{{bookExhibitionList}}" wx:key="index" wx:for-item="item" wx:for-index="index" bindtap="onBookExhibitionDetails" data-item="{{item}}">
    <image wx:if="{{item.icon}}" src="{{item.icon}}" mode="" />
    <image wx:else="" src="./img/banner.png" mode="" />
    <view class="textBox"> <text>{{item.name}}</text></view>
  </view>

</view>

 pages/bookExhibitionList/index.wxss

New file
@@ -0,0 +1,102 @@
/* pages/bookExhibitionList/index.wxss */



.outside {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 15px;
}

.contentBox {
  width: 330rpx;
  height: 130rpx;
  /* border: 1px #000 solid; */
  margin: 10px 0;

}

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


.textBox {

  width: 320rpx;
  font-size: 20rpx;
  /* display: flex;
  justify-content: center; */
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  text-align: center;

}


.example-search {
  width: 300px;
  background-color: #fff;
  /* padding: 16rpx 32rpx; */
}

.iconBox {
  transform: rotate(90deg);
  /* margin: 10px;
  margin-right: 20px; */
  margin-left: 30rpx;
}

.swapRight {
  /* margin-right: 10px; */

}

.swapLeft {
  transform: rotate(180deg);
}

.sortBox {
  display: flex;
  border-bottom: 1px #ededed solid;
  align-items: center;
  height: 86rpx;
  width: 195rpx;
}



.titleBox {
  display: flex;
  margin: 10px;
  margin-left: 0;
}

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

}

.titleTextBox {
  font-size: 20px;
  font-weight: bolder;
  margin-left: 10px;
  font-family: JDLangZhengTi, JDLangZhengTi;
}

.classification {
  width: 550rpx;
}

.menuBox {
  display: flex;

}

 pages/bookServices/index.js

@@ -62,5 +62,8 @@
   */
  onShareAppMessage() {

  }
  },



})

 pages/bookServices/index.json

@@ -1,3 +1,5 @@
{
  "usingComponents": {}
  "usingComponents": {
    "t-button": "tdesign-miniprogram/button/button"
  }
}

 pages/bookServices/index.wxml

@@ -1 +1 @@
<text>图书服务</text>
<text>图书服务</text>

 pages/home/home.js

@@ -29,6 +29,7 @@
    this.getTabBar().init();
    this.loadHomePage();
    this.getBannerList()

  },

  onLoad() {
@@ -64,20 +65,8 @@
    })
    console.log('轮播图', this.data.bannerList);
  },
  //搜索
  navToSearchPage() {
    wx.navigateTo({ url: '/pages/goods/search/index' });
  },
  //轮播图跳转
  navToActivityDetail({ detail }) {
    const data = this.data.bannerList[detail.index]
    console.log('跳转', data.link);
    // const { index: promotionID = 0 } = detail || {};
    // wx.navigateTo({
    //   url: `/pages/promotion-detail/index?promotion_id=${promotionID}`,
    // });
  },
  //获取目录


  loadHomePage() {
    wx.stopPullDownRefresh();
    this.setData({
@@ -154,5 +143,6 @@
        courseList: res.datas
      })
    })
  }
  },

});

 project.config.json

@@ -48,7 +48,7 @@
  },
  "compileType": "miniprogram",
  "libVersion": "2.23.1",
  "appid": "wx1432ecb6d1b86ade",
  "appid": "wx5461028c83fea0b3",
  "projectname": "tdesign-miniprogram-starter-retail",
  "simulatorType": "wechat",
  "simulatorPluginLibVersion": {},

 static/images/bookExhibitionDetails/Parting.png

 static/images/bookExhibitionDetails/shuzha.png