From b15a997e95d715c41df3a76aecbf58ec1141ab53 Mon Sep 17 00:00:00 2001
From: qiyunfeng-create <1940665526@qq.com>
Date: 星期四, 21 八月 2025 18:37:17 +0800
Subject: [PATCH] 个人中心-接口测试
---
src/views/personalCenter/myCollection.vue | 348 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 347 insertions(+), 1 deletions(-)
diff --git a/src/views/personalCenter/myCollection.vue b/src/views/personalCenter/myCollection.vue
index 20bd004..365cd76 100644
--- a/src/views/personalCenter/myCollection.vue
+++ b/src/views/personalCenter/myCollection.vue
@@ -1,3 +1,349 @@
<template>
- <div>鎴戠殑鏀惰棌</div>
+ <!-- <page> -->
+ <div class="personalPage-box">
+ <div class="personalPage-title">鎴戠殑鏀惰棌</div>
+ <div class="personalPage-content">
+ <div class="cartClass">
+ <el-tabs v-model="currentCollect" type="capsule" @tab-click="tabCart">
+ <el-tab-pane label="鏁板瓧鏁欐潗" name="textBooks"></el-tab-pane>
+ </el-tabs>
+ </div>
+ <div class="myCarTopPage">
+ <div class="list-box" v-loading="pages.loading">
+ <div
+ :class="
+ currentCollect == 'book' || currentCollect == 'textBooks'
+ ? 'bookCartContent cartContent'
+ : currentCollect == 'course'
+ ? 'courseCartContent cartContent'
+ : 'cartContent'
+ "
+ >
+ <div
+ class="collectList flex jc-sb clear"
+ v-if="collectList.length > 0 && !pages.loading"
+ >
+ <div
+ v-for="(item, index) in collectList"
+ :key="index"
+ class="collectList-item fl"
+ >
+ <div class="cover" @click="goBookDetails(item.id, item.name)">
+ <img :src="item.icon" alt="" />
+ </div>
+ <div class="info" @click="goBookDetails(item.id, item.name)">
+ <span>{{ item.name }}</span>
+ </div>
+ <div class="currentBtn hover" @click="setCoolect(item)">
+ <img
+ src="@/assets/images/personalCenter/collect-click.png"
+ alt="star"
+ />
+ </div>
+ </div>
+ </div>
+ <div v-if="collectList.length == 0 && !pages.loading">
+ <el-empty :image-size="200" description="鏆傛棤鏁版嵁" />
+ </div>
+ </div>
+ <div class="pagination-box">
+ <el-pagination
+ v-model:current-page="pages.page"
+ v-model:page-size="pages.pageSize"
+ :disabled="disabled"
+ :background="background"
+ layout="total, prev, pager, next"
+ :total="pages.count"
+ @current-change="handleCurrentChange"
+ v-if="collectList.length > 0 && !pages.loading"
+ />
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- </page> -->
</template>
+
+<script setup lang="ts">
+import { reactive, ref, onMounted, inject, watch } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { useBreadcrumbStore, useUserStore } from '@/store'
+import { useRouter } from "vue-router";
+const crumbStore = useBreadcrumbStore()
+const userStore = useUserStore()
+const router = useRouter();
+const MG: any = inject("MG");
+const config: any = inject("config");
+let currentCollect = ref("book");
+let collectList = ref([]);
+const background = ref(false);
+const disabled = ref(false);
+let pages = reactive({
+ page: 1,
+ pageSize: 10,
+ count: 0,
+ loading: false,
+});
+let linkType = ref("FavoriteTextBooks");
+
+const tabCart = (event: Event) => {
+ pages.page = 1;
+ pages.loading = true;
+ collectList.value = [];
+ currentCollect.value = event.props.name;
+ if (currentCollect.value == "textBooks") {
+ linkType.value = "FavoriteTextBooks";
+ }
+ getDataList();
+};
+
+function getDataList() {
+ pages.loading = true;
+ MG.store
+ .getProductList({
+ handelEBooK: true,
+ queryType: "AppUserProductLink",
+ linkType: linkType.value,
+ paging: {
+ start: pages.pageSize * pages.page - pages.pageSize,
+ size: pages.pageSize,
+ },
+ })
+ .then((res) => {
+ collectList.value = res.datas;
+ pages.count = res.total;
+ pages.loading = false;
+ })
+ .catch(() => {
+ pages.loading = false;
+ });
+}
+onMounted(() => {
+ getDataList();
+});
+
+// watch(
+// () => userStore.token,
+// () => {
+// getDataList()
+// }
+// )
+
+const handleCurrentChange = (val: number) => {
+ pages.page = val;
+ getDataList();
+};
+
+const setCoolect = (item) => {
+ ElMessageBox.confirm("纭畾瑕佸彇娑堟敹钘忓悧锛�", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ autofocus: false,
+ type: "warning",
+ })
+ .then(() => {
+ MG.store
+ .delProductLink({
+ productIds: [item.id],
+ linkType: linkType.value,
+ })
+ .then(() => {
+ ElMessage({
+ message: "鏀惰棌宸插彇娑堬紒",
+ type: "success",
+ });
+ pages.page = 1;
+ getDataList();
+ });
+ })
+ .catch(() => {});
+};
+// 璺宠浆涔︽湰璇︽儏
+const goBookDetails = (id: number, name: string) => {
+ let crumbs = [
+ {
+ name,
+ isCrumbs: true,
+ type:
+ currentCollect.value == "book"
+ ? "bookService"
+ : currentCollect.value == "textBooks"
+ ? "digitalTextbooks"
+ : "digitalCourses",
+ path:
+ currentCollect.value == "book"
+ ? "/bookService/details"
+ : "/digitalCoursesDetails",
+ },
+ ];
+ // 鍦ㄥ叏灞�鏁版嵁涓缃潰鍖呭睉
+ crumbStore.setCrumbs({
+ type:
+ currentCollect.value == "book"
+ ? "bookService"
+ : currentCollect.value == "textBooks"
+ ? "digitalTextbooks"
+ : "digitalCourses",
+ data: crumbs,
+ callback: (key: any) => {
+ router.push({
+ name:
+ currentCollect.value == "book"
+ ? "bookDetails"
+ : currentCollect.value == "textBooks"
+ ? "digitalTextbooksDetails"
+ : "digitalCoursesDetails",
+ query: {
+ crumbsKey: key,
+ bookId: id,
+ bookName: name,
+ type:
+ currentCollect.value == "book"
+ ? "bookService"
+ : currentCollect.value == "textBooks"
+ ? "digitalTextbooks"
+ : "digitalCourses",
+ },
+ });
+ },
+ });
+};
+</script>
+<style lang="less" scoped>
+.cartClass {
+ ::v-deep .el-tabs__nav-wrap::after {
+ background-color: #019e58;
+ height: 1px;
+ }
+
+ ::v-deep .el-tabs__item {
+ width: 100px;
+ padding: 0;
+ color: #545c63;
+ }
+
+ ::v-deep .is-active {
+ background-color: #019e58;
+ color: #fff;
+ border-radius: 3px 3px 0 0;
+ }
+}
+
+.collectList {
+ // overflow: hidden;
+ justify-content: flex-start;
+ flex-wrap: wrap;
+}
+
+.bookCartContent {
+ .collectList-item {
+ width: 130px;
+ cursor: pointer;
+ box-sizing: border-box;
+ float: left;
+ position: relative;
+ margin-right: 38px;
+
+ .cover {
+ width: 100%;
+ height: 180px;
+ box-shadow: 0px 0px 20px 1px #ccc;
+
+ img {
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ }
+ }
+
+ .info {
+ height: 90px;
+ padding: 15px 0;
+ width: 100%;
+
+ span {
+ font-weight: bold;
+ height: 45px;
+ line-height: 22px;
+ display: -webkit-box;
+ margin-bottom: 5px;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 2;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+ }
+ }
+
+ .collectList-item:nth-child(5),
+ :nth-child(10) {
+ margin-right: 0;
+ }
+}
+
+.courseCartContent {
+ .collectList-item {
+ width: 28%;
+ cursor: pointer;
+ box-sizing: border-box;
+ float: left;
+ margin-right: 5%;
+ box-shadow: 0px 0px 20px 1px #ccc;
+ position: relative;
+
+ .cover {
+ width: 100%;
+ height: 130px;
+
+ img {
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ }
+ }
+
+ .info {
+ height: 70px;
+ padding: 15px;
+ width: 100%;
+
+ span {
+ font-weight: bold;
+ height: 45px;
+ line-height: 22px;
+ display: -webkit-box;
+ margin-bottom: 5px;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 2;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+ }
+ }
+}
+
+.currentBtn {
+ width: 20px;
+ height: 20px;
+ padding: 2px;
+ background-color: #fff;
+ position: absolute;
+ top: 10px;
+ right: 10px;
+
+ img {
+ width: 16px;
+ height: 16px;
+ }
+}
+
+.cartContent {
+ min-height: 495px;
+}
+
+.pagination-box {
+ display: flex;
+ justify-content: center;
+}
+</style>
--
Gitblit v1.9.1