From ef37c59e055a990ce247b265b27d3fcef430a243 Mon Sep 17 00:00:00 2001
From: 杨磊 <505174330@qq.com>
Date: 星期五, 15 八月 2025 10:19:18 +0800
Subject: [PATCH] first submit
---
src/views/personalCenter/components/myCollection.vue | 471 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 471 insertions(+), 0 deletions(-)
diff --git a/src/views/personalCenter/components/myCollection.vue b/src/views/personalCenter/components/myCollection.vue
new file mode 100644
index 0000000..da610c1
--- /dev/null
+++ b/src/views/personalCenter/components/myCollection.vue
@@ -0,0 +1,471 @@
+<template>
+ <div>
+ <div class="title spaceBetween">
+ <span
+ :class="paymentStatus == 0 ? 'paymentStatus' : 'place'"
+ @click="
+ () => {
+ paymentStatus = 0;
+ this.paginationData.page = 1;
+ this.collectionList = [];
+ this.getBookData();
+ }
+ "
+ >鍥句功鏀惰棌</span
+ >
+ <span class="splitline"></span>
+ <span
+ :class="paymentStatus == 1 ? 'paymentStatus' : 'place'"
+ @click="
+ () => {
+ paymentStatus = 1;
+ this.paginationData.page = 1;
+ this.collectionList = [];
+ this.getResourceData();
+ }
+ "
+ >璧勬簮鏀惰棌</span
+ >
+ </div>
+ <div class="content" v-loading="loading">
+ <el-empty
+ v-if="collectionList.length == 0 && orderList.length == 0 && !loading"
+ :image-size="200"
+ description="鏆傛棤鏁版嵁"
+ ></el-empty>
+ <template>
+ <template v-if="paymentStatus == 0">
+ <div
+ class="bookItem"
+ v-for="(item, index) in collectionList"
+ :key="index"
+ >
+ <div class="wrapImg">
+ <img class="autoImg" :src="item.icon" alt="" />
+ </div>
+ <div class="information">
+ <div>
+ <span class="name ellipsis" @click="toDetail(item)">{{
+ item.name
+ }}</span>
+ <div class="cancelCollection">
+ <span @click="cancleBookCollect(item)">鍙栨秷鏀惰棌</span>
+ </div>
+ </div>
+ <p class="author">
+ 浣滆�咃細{{
+ item.caupress_author ? item.caupress_author : "鏈煡浣滆��"
+ }}
+ </p>
+ <p class="author" v-if="item.caupress_publicationDate">
+ 鍑虹増鏃堕棿锛歿{
+ moment(item.caupress_publicationDate).format("YYYY-MM-DD")
+ }}
+ </p>
+ <p class="author" v-if="item.caupress_ISBN">
+ ISBN锛歿{ item.caupress_ISBN }}
+ </p>
+ <p class="payPrice">
+ 瀹氫环锛�
+ <span
+ >锟� <span>{{ item.price }}</span>
+ </span>
+ </p>
+ </div>
+ </div>
+ </template>
+ <template v-else>
+ <div
+ class="resourcesItem"
+ v-for="(item, index) in orderList"
+ :key="index"
+ >
+ <span @click="preview(item)" class="resourcesPre"
+ >璧勬簮鍚嶇О锛�
+ <span style="color: #333">{{ item.name }}</span>
+ </span>
+ <span
+ >璧勬簮绫诲瀷锛�
+ <span style="color: #333">{{
+ RefCodeConvertFormat(item.caupress_fileType)
+ }}</span>
+ <div
+ class="cancelCollection"
+ @click="cancleResourceCollect(item)"
+ >
+ 鍙栨秷鏀惰棌
+ </div>
+ </span>
+ </div>
+ </template>
+ </template>
+ </div>
+ <!-- 鍒嗛〉 -->
+ <div
+ class="pageinateBox"
+ v-if="collectionList.length > 0 || orderList.length > 0"
+ >
+ <el-pagination
+ @size-change="
+ (val) => {
+ paginationData.limit = val;
+ if (paymentStatus == 0) {
+ getBookData();
+ } else {
+ getResourceData();
+ }
+ }
+ "
+ @current-change="
+ (val) => {
+ paginationData.page = val;
+ getBookData();
+ if (paymentStatus == 0) {
+ getBookData();
+ } else {
+ getResourceData();
+ }
+ }
+ "
+ background=""
+ :current-page="paginationData.page - 0"
+ :page-size="paginationData.limit"
+ prev-text="涓婁竴椤�"
+ next-text="涓嬩竴椤�"
+ layout="total, prev, pager, next, slot, jumper"
+ :total="paginationData.totalCount"
+ >
+ </el-pagination>
+ </div>
+ </div>
+</template>
+<script>
+export default {
+ data() {
+ return {
+ paginationData: {
+ page: 1,
+ totalCount: 0,
+ limit: 5,
+ totalPage: 0,
+ },
+ collectionList: [],
+ paymentStatus: 0,
+ loading: false,
+ orderList: [],
+ };
+ },
+ created() {
+ // 鐢ㄤ簬鎭㈠ 璺宠浆璇︽儏椤典箣鍓嶇殑鍒嗛〉
+ if (localStorage.getItem("searchPage")) {
+ this.paginationData = JSON.parse(localStorage.getItem("searchPage"));
+ localStorage.removeItem("searchPage");
+ this.paymentStatus = JSON.parse(localStorage.getItem("insideTabs"));
+ localStorage.removeItem("insideTabs");
+ }
+ if (this.paymentStatus == 0) {
+ this.getBookData();
+ } else {
+ this.getResourceData();
+ }
+ },
+ methods: {
+ RefCodeConvertFormat(refCode) {
+ switch (refCode) {
+ case "caupress_video":
+ return "瑙嗛";
+ case "caupress_audio":
+ return "闊抽";
+ case "caupress_pdf":
+ return "PDF";
+ case "caupress_zip":
+ return "Zip";
+ default:
+ break;
+ }
+ },
+ // 鑾峰彇鍥句功鏀惰棌
+ getBookData() {
+ this.loading = true;
+ this.paginationData.limit = 5;
+ let { limit, page } = this.paginationData;
+ this.paymentStatus == 0 ? "AppUserProductLink" : "AppUserCmsItemLink";
+ let query = {
+ queryType: "AppUserProductLink",
+ linkType: "Favorite",
+ paging: {
+ start: limit * page - limit,
+ size: limit,
+ },
+ sort: [],
+ fields: {
+ caupress_author: [],
+ caupress_ISBN: [],
+ caupress_publicationDate: [],
+ },
+ coverSize: {
+ width: 120,
+ },
+ };
+ this.MG.store.getProductList(query).then((res) => {
+ this.JumpToPreviousPage(res.datas);
+ this.collectionList = res.datas;
+ this.paginationData.totalCount = res.total;
+ this.loading = false;
+ });
+ },
+ // 鑾峰彇璧勬簮鏀惰棌
+ getResourceData() {
+ this.loading = true;
+ this.paginationData.limit = 12;
+ let { limit, page } = this.paginationData;
+ this.MG.resource
+ .getItem({
+ path: "*",
+ queryType: "AppUserCmsItemLink",
+ linkType: "Favorite",
+ paging: {
+ start: limit * page - limit,
+ size: limit,
+ },
+ fields: {
+ caupress_author: [],
+ caupress_ISBN: [],
+ caupress_publicationDate: [],
+ caupress_fileType: [],
+ caupress_file: [],
+ },
+ coverSize: {
+ width: 120,
+ },
+ })
+ .then((res) => {
+ this.JumpToPreviousPage(res.datas);
+ this.orderList = res.datas;
+ this.paginationData.totalCount = res.total;
+ this.loading = false;
+ });
+ },
+ // 鍙栨秷鍥句功鏀惰棌
+ cancleBookCollect(item) {
+ this.$confirm("纭畾鍙栨秷鏀惰棌鍚楋紵", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ this.loading = true;
+ let data = {
+ productIds: [item.id],
+ linkType: "Favorite",
+ };
+ this.MG.store.delProductLink(data).then((res) => {
+ if (res) {
+ this.loading = false;
+ this.$message({
+ type: "success",
+ message: "鍙栨秷鏀惰棌鎴愬姛!",
+ });
+ this.getBookData();
+ }
+ });
+ })
+ .catch(() => {
+ this.$message({
+ type: "info",
+ message: "宸插彇娑堟搷浣�",
+ });
+ });
+ },
+ // 鍙栨秷璧勬簮鏀惰棌
+ cancleResourceCollect(item) {
+ this.$confirm("纭畾鍙栨秷鏀惰棌鍚楋紵", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ this.loading = true;
+ let data = {
+ cmsItemIds: [item.id],
+ linkType: "Favorite",
+ };
+ this.MG.resource.delCmsItemLink(data).then((res) => {
+ if (res) {
+ this.loading = false;
+ this.$message({
+ type: "success",
+ message: "鍙栨秷鏀惰棌鎴愬姛!",
+ });
+ this.getResourceData();
+ }
+ });
+ })
+ .catch(() => {
+ this.$message({
+ type: "info",
+ message: "宸插彇娑堟搷浣�",
+ });
+ });
+ },
+ // 鍘诲線璇︽儏椤�
+ toDetail(item) {
+ let LinkTag = item.datas.LinkTag;
+ // 鏍规嵁涓嶅悓椤甸潰鏀惰棌鐨勮烦杞笉鍚岄〉闈�
+ let jumpPath =
+ LinkTag == "bookStore" ? "bookStore-detail" : "teachingServices-detail";
+ this.saveInformation();
+ this.$router.push({
+ name: jumpPath,
+ query: {
+ id: item.id,
+ cmsPath: item.rootCmsItemId,
+ },
+ });
+ },
+ //鍘昏祫婧愯鎯�
+ preview(item) {
+ let previewType = item.caupress_fileType.split("_")[1];
+ this.saveInformation();
+ if (previewType == "zip") {
+ this.$message({
+ type: "warning",
+ message: "姝ゆ枃浠剁被鍨嬩笉鏀寔棰勮",
+ });
+ } else {
+ this.$router.push({
+ name: `preview-${previewType}`,
+ query: {
+ md5: item.caupress_file,
+ titleName: item.name,
+ },
+ });
+ }
+ },
+ // 澶勭悊褰撳綋鍓嶉〉闈㈢殑鏁版嵁宸插叏閮ㄥ彇娑堟敹钘忓悗锛岃烦杞嚦鍓嶄竴椤�
+ JumpToPreviousPage(datas) {
+ if (this.paginationData.page > 1 && datas.length == 0) {
+ this.paginationData.page -= 1;
+ this.getBookData();
+ }
+ },
+ // 淇濆瓨褰撳墠椤甸潰淇℃伅锛岀敤浜庤鎯呴〉杩斿洖鏃舵仮澶嶉〉闈㈡暟鎹�
+ saveInformation() {
+ localStorage.setItem(
+ "searchPage",
+ JSON.stringify({ ...this.paginationData })
+ );
+ localStorage.setItem("selectedTab", JSON.stringify(2));
+ localStorage.setItem("insideTabs", JSON.stringify(this.paymentStatus));
+ },
+ },
+};
+</script>
+<style lang="less" scoped>
+.title {
+ font-size: 18px;
+ font-weight: 700;
+ letter-spacing: 1.8px;
+ border-top: 2px solid #008e3f;
+ line-height: 36px;
+ padding-left: 40px;
+ background: #d8f7e6;
+ line-height: 60px;
+ color: #00873c;
+ .splitline {
+ width: 1px;
+ height: 24px;
+ background-color: #008e3f;
+ }
+}
+.spaceBetween {
+ padding-left: 0;
+ display: flex;
+ justify-content: space-evenly;
+ align-items: center;
+ span {
+ font-weight: 400;
+ }
+ .paymentStatus {
+ font-weight: 700;
+ }
+ .place {
+ cursor: pointer;
+ }
+}
+.content {
+ min-height: 600px;
+ padding: 40px 40px 0 40px;
+ .cancelCollection {
+ cursor: pointer;
+ float: right;
+ color: #e50021;
+ }
+ .bookItem {
+ display: flex;
+ justify-content: space-between;
+ border-bottom: 1px solid #eeeeee;
+ padding-bottom: 40px;
+ margin-bottom: 40px;
+ .wrapImg {
+ position: relative;
+ border: 1px solid #e6e6e6;
+ background: #ffffff;
+ width: 150px;
+ height: 200px;
+ }
+ .information {
+ width: 520px;
+ font-size: 16px;
+ .name {
+ cursor: pointer;
+ width: 450px;
+ display: inline-block;
+ font-size: 24px;
+ font-weight: 700;
+ line-height: 24px;
+ padding-bottom: 20px;
+ color: #333333;
+ }
+
+ .author {
+ color: #666666;
+ padding: 8px 0;
+ }
+ .payPrice {
+ color: #333333;
+ padding: 14px 0;
+ span {
+ font-size: 14px;
+ color: #e50021;
+ span {
+ font-size: 24px;
+ }
+ }
+ }
+ }
+ }
+ .resourcesItem {
+ font-size: 16px;
+ color: #666;
+ display: flex;
+ line-height: 50px;
+ > span {
+ width: 50%;
+ }
+ }
+}
+.pageinateBox {
+ text-align: center;
+ padding: 40px 0;
+ :deep(.el-pagination.is-background .btn-next) {
+ padding: 0 10px;
+ }
+ :deep(.el-pagination.is-background .btn-prev) {
+ padding: 0 10px;
+ }
+}
+.resourcesPre {
+ cursor: pointer;
+}
+</style>
--
Gitblit v1.9.1