From 5f00696dfb25bc90034448ceb634ed1ef256681a Mon Sep 17 00:00:00 2001
From: qiyunfeng-create <1940665526@qq.com>
Date: 星期四, 21 八月 2025 21:13:35 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/xiehe_website
---
src/views/personalCenter/myBook.vue | 318 ++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 315 insertions(+), 3 deletions(-)
diff --git a/src/views/personalCenter/myBook.vue b/src/views/personalCenter/myBook.vue
index 191e50d..b7ec6bf 100644
--- a/src/views/personalCenter/myBook.vue
+++ b/src/views/personalCenter/myBook.vue
@@ -1,7 +1,319 @@
<template>
- <div class="myBook">
- <div class="myBook_header">
- <div class="myBook_header_title">鎴戠殑璁㈠崟</div>
+ <div class="personalPage-box">
+ <div class="personalPage-title">鎴戠殑涔︽灦</div>
+ <div class="personalPage-content">
+ <div class="pageBox cartPage" v-loading="isLoading">
+ <div class="myCarTopPage" v-if="collectList.length > 0">
+ <div
+ class="bookone"
+ v-for="(item, index) in collectList"
+ :key="index"
+ @click="goDetail(item)"
+ >
+ <div class="imgBox">
+ <img v-if="item.product.icon" :src="item.product.icon" />
+ <img v-else :src="defaultImg" alt="" />
+ </div>
+ <div class="details">
+ <div class="text-flow" v-if="item.product.name">
+ {{ item.product.name || "-" }}
+ </div>
+ <div class="text-flow" :title="item.isbn">
+ ISBN锛歿{ item.isbn.length != 0 ? item.isbn : "-" }}
+ </div>
+ <div class="text-flow">
+ 浣滆�咃細{{ item.author.length != 0 ? item.author : "-" }}
+ </div>
+ <!-- <div class="text-flow" v-if="item.ExpiryDate">
+ 鎴鏃ユ湡锛�<span style="color: #dd0000">{{ item.ExpiryDate }}</span>
+ </div> -->
+ </div>
+ </div>
+ </div>
+ <div class="myCarTopPage" v-else>
+ <el-empty description="鎮ㄨ繕鏈喘涔颁换浣曞浘涔�" :image-size="200" />
+ </div>
+ </div>
+ <div class="pageCon">
+ <!-- 鍒嗛〉 -->
+ <el-pagination
+ background
+ :current-page="paginationData.page - 0"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ :page-size="paginationData.limit"
+ layout="total, prev, pager, next, slot"
+ :total="paginationData.totalCount"
+ >
+ <div style="display: flex; align-items: center">
+ <span class="el-pagination__jump"
+ >鍓嶅線
+ <div class="el-input el-pagination__editor is-in-pagination">
+ <input
+ type="number"
+ autocomplete="off"
+ min="1"
+ :max="paginationData.totalPage"
+ v-model="inputPage"
+ class="el-input__inner"
+ @keyup.enter="jumpFun($event)"
+ />
+ </div>
+ 椤�
+ </span>
+ <el-button type="primary" class="toBtn" @click="jumpFun">纭畾</el-button>
+ </div>
+ </el-pagination>
+ </div>
</div>
</div>
</template>
+
+<script lang="ts" setup>
+import { reactive, ref, onMounted, inject, watch } from "vue";
+import { useRouter } from "vue-router";
+import defaultImg from "@/assets/images/default-book-img.png";
+import { useUserStore } from "@/store";
+import tool from "@/assets/js/toolClass";
+const MG: any = inject("MG");
+const config: any = inject("config");
+const router = useRouter();
+let collectList = ref([]);
+let currentCollect = ref("book");
+let isLoading = ref(false);
+let pages = reactive({
+ page: 1,
+ pageSize: 10,
+ count: 0,
+ loading: false,
+});
+let linkType = ref("PurchasedProduct");
+let paginationData = reactive({
+ page: 1,
+ limit: 10,
+ totalCount: 0,
+ totalPage: 0,
+});
+let inputPage = ref(1);
+const loading = ref(false);
+const listData = ref([]);
+const keyQueryRequests = [
+ {
+ key: "author",
+ },
+ {
+ key: "isbn",
+ },
+];
+
+const getData = () => {
+ loading.value = true;
+ const searchData = [
+ {
+ keywords: "digitalTextbooks",
+ field: "ProductType",
+ },
+ ];
+ const data = {
+ Size: paginationData.limit,
+ Start: (paginationData.page - 1) * paginationData.limit,
+ sort: {
+ type: "Desc",
+ field: "CreateDate",
+ },
+ searchList: searchData,
+ keyQueryRequests: keyQueryRequests,
+ };
+ MG.store.getPurchasedProductList(data).then(async (response) => {
+ listData.value = handResultsChange(response.datas);
+ listData.value.forEach((item) => {
+ item.product.icon = tool.getPublicImage(item.product.icon);
+ });
+ // //褰撳墠椤甸潰
+ paginationData.totalCount = response.totalSize;
+ paginationData.totalPage =
+ response.totalSize % paginationData.limit === 0
+ ? response.totalSize / paginationData.limit
+ : Math.floor(response.totalSize / paginationData.limit) + 1;
+ loading.value = false;
+ collectList.value = response.datas;
+ });
+};
+onMounted(() => {
+ getData();
+});
+// 澶勭悊鏌ヨ缁撴灉
+const handResultsChange = (data) => {
+ let fieldsData = [];
+ for (let i = 0; i < data.length; i++) {
+ const item = data[i];
+ for (const val in keyQueryRequests) {
+ fieldsData.push(keyQueryRequests[val].key);
+ }
+ for (let i = 0; i < fieldsData.length; i++) {
+ const field = fieldsData[i];
+ item[field] = JSON.parse(item.datas[field]);
+ const datas = item[field];
+ if (datas.length > 0) {
+ if (datas[0].Value) {
+ item[field] = datas[0].Value;
+ } else if (datas[0].Data) {
+ item[field] = datas[0].Data.Value;
+ }
+ }
+ }
+ }
+ return data;
+};
+
+//鍒板浘涔﹁鎯�
+const goDetail = (item) => {
+ router.push({
+ path: "/bookdetail",
+ query: {
+ bookId: item.product.id,
+ },
+ });
+};
+
+//鍒嗛〉
+const handleSizeChange = (val) => {
+ paginationData.limit = val;
+ getData();
+};
+const handleCurrentChange = (val) => {
+ paginationData.page = val;
+ inputPage.value = val;
+ getData();
+};
+const jumpFun = (event) => {
+ event.target.blur();
+ var that = this;
+ if (inputPage.value <= 0) {
+ inputPage.value = 1;
+ }
+ if (inputPage.value > paginationData.totalPage) {
+ inputPage.value = paginationData.totalPage;
+ }
+ paginationData.page = inputPage.value;
+ getData();
+};
+</script>
+<style scoped>
+.pageCon {
+ width: 100%;
+ float: left;
+ margin-top: 20px;
+ display: flex;
+ justify-content: center;
+}
+.myCarTopPage {
+ display: flex;
+ justify-content: flex-start;
+ box-sizing: border-box;
+ overflow: hidden;
+ padding-bottom: 20px;
+}
+.details div:first-child {
+ font-size: 16px;
+ color: #2b68cd;
+ margin-bottom: 11px;
+}
+
+.details div:nth-child(2) {
+ font-size: 14px;
+ color: #666;
+ margin: 15px 0;
+}
+
+.details div:nth-child(3) {
+ margin-bottom: 11px;
+ display: flex;
+ align-items: center;
+}
+.details div:last-child {
+ font-size: 14px;
+ color: #666666;
+}
+.resonBox {
+ display: flex;
+ line-height: 24px;
+}
+.resonTxt {
+ flex: 1;
+ overflow: hidden;
+ line-height: 24px;
+ text-overflow: ellipsis;
+ display: -webkit-box;
+ -webkit-line-clamp: 3;
+ flex-direction: column;
+}
+
+.bookoneTitle {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding-bottom: 10px;
+ border-bottom: 1px solid #ddd;
+}
+.bookone {
+ display: flex;
+ width: 420px;
+ min-height: 173px;
+ float: left;
+ cursor: pointer;
+ box-sizing: border-box;
+ margin: 20px 0px 0 20px;
+ padding: 10px 30px;
+ border: 1px solid #ddd;
+}
+.bookone:hover {
+ -moz-box-shadow: 4px 3px 6px rgba(0, 0, 0, 0.3);
+ -webkit-box-shadow: 4px 3px 6px rgba(0, 0, 0, 0.3);
+ box-shadow: 4px 3px 6px rgba(0, 0, 0, 0.3);
+}
+
+.bookone .imgBox {
+ position: relative;
+ width: 120px;
+ height: 160px;
+ background: #fff;
+}
+.newBookli .imgBox {
+ position: relative;
+ width: 105px;
+ height: 140px;
+}
+
+.imgBox img {
+ width: auto;
+ height: auto;
+ max-width: 100%;
+ max-height: 100%;
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ margin: auto;
+}
+
+.details {
+ flex: 1;
+ margin-left: 10px;
+ margin-top: 10px;
+ overflow: hidden;
+}
+.pageBox {
+ width: 100%;
+}
+.noDataTxt {
+ margin: 50px auto;
+ text-align: center;
+ font-size: 22px;
+ color: #999;
+}
+.el-pagination button {
+ margin-left: 10px;
+}
+</style>
--
Gitblit v1.9.1