From 0780b14607594c4300143091153bf635781ca55e Mon Sep 17 00:00:00 2001
From: 闫增涛 <1829501689@qq.com>
Date: 星期三, 03 四月 2024 11:19:36 +0800
Subject: [PATCH] 添加相关图书功能
---
packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxml | 33 ++++++-
packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxss | 55 +++++++++++++
packageBookService/pages/bookServices/detail/components/relatedBooks/index.json | 5 +
packageBookService/pages/bookServices/detail/index.wxml | 7 +
packageBookService/pages/bookServices/detail/index.js | 61 +++++++--------
packageBookService/pages/bookServices/detail/components/relatedBooks/index.js | 29 ++++++
6 files changed, 145 insertions(+), 45 deletions(-)
diff --git a/packageBookService/pages/bookServices/detail/components/relatedBooks/index.js b/packageBookService/pages/bookServices/detail/components/relatedBooks/index.js
index a88e921..0d85cc2 100644
--- a/packageBookService/pages/bookServices/detail/components/relatedBooks/index.js
+++ b/packageBookService/pages/bookServices/detail/components/relatedBooks/index.js
@@ -6,10 +6,20 @@
properties: {
relatedBookData: {
type: Array,
- value:[]
+ value: [],
+ },
+ relatedBookLoading: {
+ type: Boolean,
+ },
+ noRelatedBookData: {
+ type: Boolean,
},
},
-
+ observers: {
+ relatedBookLoading: function (newValue) {
+ console.log("l", newValue);
+ },
+ },
/**
* 缁勪欢鐨勫垵濮嬫暟鎹�
*/
@@ -18,5 +28,18 @@
/**
* 缁勪欢鐨勬柟娉曞垪琛�
*/
- methods: {},
+ methods: {
+ goBookDetails(e) {
+ const item = e.currentTarget.dataset.item;
+ var myEventDetail = {
+ id: item.id,
+ name: item.name,
+ };
+ var myEventOption = {
+ bubbles: true,
+ composed: true,
+ };
+ this.triggerEvent("goBookDetails", myEventDetail, myEventOption);
+ },
+ },
});
diff --git a/packageBookService/pages/bookServices/detail/components/relatedBooks/index.json b/packageBookService/pages/bookServices/detail/components/relatedBooks/index.json
index e8cfaaf..538bc1e 100644
--- a/packageBookService/pages/bookServices/detail/components/relatedBooks/index.json
+++ b/packageBookService/pages/bookServices/detail/components/relatedBooks/index.json
@@ -1,4 +1,7 @@
{
"component": true,
- "usingComponents": {}
+ "usingComponents": {
+ "t-empty": "tdesign-miniprogram/empty/empty",
+ "t-loading": "tdesign-miniprogram/loading/loading"
+ }
}
\ No newline at end of file
diff --git a/packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxml b/packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxml
index 556ddb0..d3a326f 100644
--- a/packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxml
+++ b/packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxml
@@ -1,8 +1,29 @@
<!--packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxml-->
-<view class="reletedBooks">
- <!-- <view wx:for="{{relatedBookData}}" wx:key="id" class="book-box">
- <image src="{{item.icon}}" />
- <text>{{item.name}}</text>
- </view> -->
- 鐩稿叧鍥句功
+<view class="reletedBooks fl between">
+ <view
+ wx:for="{{relatedBookData}}"
+ wx:key="id"
+ class="book-box"
+ wx:if="{{relatedBookData.length && !relatedBookLoading}}"
+ bind:tap="goBookDetails"
+ data-item="{{item}}"
+ >
+ <view class="book-image"
+ ><image
+ src="{{item.icon ? item.icon : '/static/images/default-book-img.png'}}"
+ mode="aspectFit"
+ /></view>
+ <text class="book-name">{{item.name}}</text>
+ </view>
+ <view class="noData" wx:if="{{noRelatedBookData}}">
+ <t-empty icon="folder-open" description="鏆傛棤鏁版嵁" />
+ </view>
+ <view class="loading-box" wx:if="{{relatedBookLoading}}">
+ <t-loading
+ theme="circular"
+ size="60rpx"
+ class="loading"
+ loading="{{relatedBookLoading}}"
+ />
+ </view>
</view>
diff --git a/packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxss b/packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxss
index febb9ae..708f333 100644
--- a/packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxss
+++ b/packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxss
@@ -1 +1,54 @@
-/* packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxss */
\ No newline at end of file
+/* packageBookService/pages/bookServices/detail/components/relatedBooks/index.wxss */
+.fl {
+ display: flex;
+ flex-wrap: wrap;
+}
+
+.between {
+ justify-content: space-between;
+}
+
+.ctr {
+ justify-content: center;
+}
+
+.reletedBooks {
+ padding: 80rpx 40rpx;
+}
+
+.book-box {
+ width: 28%;
+ margin-bottom: 40rpx;
+}
+
+.book-image {
+ width: 180rpx;
+ height: 254rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ box-shadow: 0px 3px 6px 1px rgba(0, 0, 0, 0.16);
+}
+
+.book-image image {
+ height: 100%;
+}
+
+.book-name {
+ color: #333;
+ margin-top: 20rpx;
+ width: 100%;
+ word-break: break-all;
+ display: -webkit-box;
+ -webkit-line-clamp: 2;
+ -webkit-box-orient: vertical;
+ overflow: hidden;
+}
+
+.loading-box {
+ margin: 100rpx auto;
+}
+
+.noData {
+ margin: 0 auto;
+}
\ No newline at end of file
diff --git a/packageBookService/pages/bookServices/detail/index.js b/packageBookService/pages/bookServices/detail/index.js
index 589b46c..d35e650 100644
--- a/packageBookService/pages/bookServices/detail/index.js
+++ b/packageBookService/pages/bookServices/detail/index.js
@@ -59,6 +59,8 @@
residue: 0, // 缁勫嵎鍓╀綑娆℃暟
mockList: [], // 鐢ㄦ埛缁勫嵎鎻愪氦淇℃伅
},
+ relatedBookLoading: false,
+ noRelatedBookData: false,
relatedBookPath: "", // 鐩稿叧鍥句功path
relatedBookData: [], // 鐩稿叧鍥句功鍒楄〃
flag: true,
@@ -143,27 +145,12 @@
* 鐢熷懡鍛ㄦ湡鍑芥暟--鐩戝惉椤甸潰鍔犺浇
*/
onLoad(options) {
- // 妫�鏌ョ櫥褰曠姸鎬�
- // const token = wx.getStorageSync(app.config.tokenKey)
- // if (!token) {
- // loginInfo(app, (data) => {
- // // 濡傛灉涓嶆槸绗竴娆＄櫥褰曪紝浼氭墽琛屽洖璋�
- // if (data) {
- // // 鐧诲綍鎴愬姛锛岃嚜鍔ㄨ褰晅oken鍜岀敤鎴蜂俊鎭紝骞惰繑鍥瀟rue
- // } else {
- // // 鍑虹幇閿欒锛岃繑鍥瀎alse
- // }
- // })
- // } else {
- // // 濡傛灉鏄涓�娆＄櫥褰曪紝浼氳烦杞嚦缁戝畾鐢ㄦ埛淇℃伅椤甸潰锛屽～鍐欏畬鐢ㄦ埛淇℃伅鍚庤繘琛岀櫥褰曞苟鍌ㄥ瓨token鍜岀敤鎴蜂俊鎭紝缁撴潫鍚庤烦杞洖褰撳墠椤甸潰锛堟惡甯﹂〉闈㈠弬鏁帮級
- // }
-
const systInfo = wx.getSystemInfoSync();
const menu = wx.getMenuButtonBoundingClientRect(); // 鑳跺泭淇℃伅
const navBarHeight =
(menu.top - systInfo.statusBarHeight) * 2 + menu.height; // 瀵艰埅鏍忛珮搴�
this.setData({
- bookId: options.id,
+ bookId: options.id + "",
barHeight: systInfo.statusBarHeight,
navBarHeight: navBarHeight,
});
@@ -173,7 +160,6 @@
name: options.name,
},
});
-
this.getBookInfo(options.id);
this.getResourceClass(); // 鑾峰彇璧勬簮鎵�灞炲垎绫�
const token = wx.getStorageSync(app.config.tokenKey);
@@ -1601,7 +1587,10 @@
},
// 鑾峰彇鐩稿叧鍥句功
getAboutBook(path) {
- // loadings.value.aboutBook = true
+ this.setData({
+ relatedBookLoading: true,
+ noRelatedBookData: false,
+ });
let query = {
path,
queryType: "*",
@@ -1623,24 +1612,30 @@
(item) => item.id != this.data.bookDetail.id
);
let bookArr = [];
- if (Arr.length) {
- if (Arr.length > 3) {
- for (var i = 0; i < 3; i++) {
- var _num = Math.floor(Math.random() * Arr.length);
- var mm = Arr[_num];
- Arr.splice(_num, 1);
- bookArr.push(mm);
- }
- } else {
- bookArr = Arr;
- }
+ // if (Arr.length > 3) {
+ // for (var i = 0; i < 3; i++) {
+ // var _num = Math.floor(Math.random() * Arr.length);
+ // var mm = Arr[_num];
+ // Arr.splice(_num, 1);
+ // bookArr.push(mm);
+ // }
+ // } else {
+ // bookArr = Arr;
+ // }
+ this.setData({
+ relatedBookData: Arr,
+ relatedBookLoading: false,
+ });
+ if (!this.data.relatedBookData.length)
this.setData({
- relatedBookData: bookArr,
+ noRelatedBookData: true,
});
- console.log("鐩稿叧鍥句功", this.data.relatedBookData);
- }
+ console.log("鐩稿叧鍥句功", this.data.relatedBookData);
});
- // loadings.value.aboutBook = false
+ },
+ goBookDetails(e) {
+ console.log(e);
+ this.onLoad({ id: e.detail.id, name: e.detail.name });
},
// 搴曢儴璐拱鎸夐挳
buyBtn() {
diff --git a/packageBookService/pages/bookServices/detail/index.wxml b/packageBookService/pages/bookServices/detail/index.wxml
index 981e948..882a230 100644
--- a/packageBookService/pages/bookServices/detail/index.wxml
+++ b/packageBookService/pages/bookServices/detail/index.wxml
@@ -287,7 +287,12 @@
value="related_books"
style="{{tabPanelstyle}}"
>
- <related-books relatedBookData="{{relatedBookData}}"></related-books>
+ <related-books
+ relatedBookData="{{relatedBookData}}"
+ relatedBookLoading="{{relatedBookLoading}}"
+ noRelatedBookData="{{noRelatedBookData}}"
+ bind:goBookDetails="goBookDetails"
+ ></related-books>
</t-tab-panel>
</t-tabs>
</view>
--
Gitblit v1.9.1