From 9cad6a832c786989be620573b09badccfe7e3b51 Mon Sep 17 00:00:00 2001
From: QYF-GitLab1 <1940665526@qq.com>
Date: 星期一, 25 八月 2025 15:11:37 +0800
Subject: [PATCH] 首页头部，样式调整
---
src/views/personalCenter/myBook.vue | 164 ++++++++++++++++++++++++++----------------------------
1 files changed, 78 insertions(+), 86 deletions(-)
diff --git a/src/views/personalCenter/myBook.vue b/src/views/personalCenter/myBook.vue
index b7ec6bf..f58b2b3 100644
--- a/src/views/personalCenter/myBook.vue
+++ b/src/views/personalCenter/myBook.vue
@@ -16,14 +16,12 @@
</div>
<div class="details">
<div class="text-flow" v-if="item.product.name">
- {{ item.product.name || "-" }}
+ {{ item.product.name || '-' }}
</div>
<div class="text-flow" :title="item.isbn">
- ISBN锛歿{ item.isbn.length != 0 ? 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">浣滆�咃細{{ item.author.length != 0 ? item.author : '-' }}</div>
<!-- <div class="text-flow" v-if="item.ExpiryDate">
鎴鏃ユ湡锛�<span style="color: #dd0000">{{ item.ExpiryDate }}</span>
</div> -->
@@ -31,7 +29,7 @@
</div>
</div>
<div class="myCarTopPage" v-else>
- <el-empty description="鎮ㄨ繕鏈喘涔颁换浣曞浘涔�" :image-size="200" />
+ <el-empty style="margin: auto" description="鎮ㄨ繕鏈喘涔颁换浣曞浘涔�" :image-size="200" />
</div>
</div>
<div class="pageCon">
@@ -70,134 +68,126 @@
</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");
+import { reactive, ref, onMounted, inject, watch } from 'vue'
+import { useRouter } from 'vue-router'
+import defaultImg from '@/assets/images/default-book-img.png'
+import tool from '@/assets/js/toolClass'
+const MG: any = inject('MG')
+const config: any = inject('config')
+const router = useRouter()
+let collectList = ref([])
+let isLoading = ref(false)
+
let paginationData = reactive({
page: 1,
- limit: 10,
+ limit: 6,
totalCount: 0,
totalPage: 0,
-});
-let inputPage = ref(1);
-const loading = ref(false);
-const listData = ref([]);
+})
+let inputPage = ref(1)
+const loading = ref(false)
+const listData = ref([])
const keyQueryRequests = [
{
- key: "author",
+ key: 'author',
},
{
- key: "isbn",
+ key: 'isbn',
},
-];
+]
const getData = () => {
- loading.value = true;
+ loading.value = true
const searchData = [
{
- keywords: "digitalTextbooks",
- field: "ProductType",
+ keywords: 'digitalTextbooks',
+ field: 'ProductType',
},
- ];
+ ]
const data = {
Size: paginationData.limit,
Start: (paginationData.page - 1) * paginationData.limit,
sort: {
- type: "Desc",
- field: "CreateDate",
+ type: 'Desc',
+ field: 'CreateDate',
},
searchList: searchData,
keyQueryRequests: keyQueryRequests,
- };
+ }
MG.store.getPurchasedProductList(data).then(async (response) => {
- listData.value = handResultsChange(response.datas);
+ listData.value = handResultsChange(response.datas)
listData.value.forEach((item) => {
- item.product.icon = tool.getPublicImage(item.product.icon);
- });
+ item.product.icon = tool.getPublicImage(item.product.icon)
+ })
// //褰撳墠椤甸潰
- paginationData.totalCount = response.totalSize;
+ 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;
- });
-};
+ : Math.floor(response.totalSize / paginationData.limit) + 1
+ loading.value = false
+ collectList.value = response.datas
+ })
+}
onMounted(() => {
- getData();
-});
+ getData()
+})
// 澶勭悊鏌ヨ缁撴灉
const handResultsChange = (data) => {
- let fieldsData = [];
+ let fieldsData = []
for (let i = 0; i < data.length; i++) {
- const item = data[i];
+ const item = data[i]
for (const val in keyQueryRequests) {
- fieldsData.push(keyQueryRequests[val].key);
+ 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];
+ 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;
+ item[field] = datas[0].Value
} else if (datas[0].Data) {
- item[field] = datas[0].Data.Value;
+ item[field] = datas[0].Data.Value
}
}
}
}
- return data;
-};
+ return data
+}
//鍒板浘涔﹁鎯�
const goDetail = (item) => {
router.push({
- path: "/bookdetail",
+ path: '/bookdetail',
query: {
bookId: item.product.id,
},
- });
-};
+ })
+}
//鍒嗛〉
const handleSizeChange = (val) => {
- paginationData.limit = val;
- getData();
-};
+ paginationData.limit = val
+ getData()
+}
const handleCurrentChange = (val) => {
- paginationData.page = val;
- inputPage.value = val;
- getData();
-};
+ paginationData.page = val
+ inputPage.value = val
+ getData()
+}
const jumpFun = (event) => {
- event.target.blur();
- var that = this;
+ event.target.blur()
+ var that = this
if (inputPage.value <= 0) {
- inputPage.value = 1;
+ inputPage.value = 1
}
if (inputPage.value > paginationData.totalPage) {
- inputPage.value = paginationData.totalPage;
+ inputPage.value = paginationData.totalPage
}
- paginationData.page = inputPage.value;
- getData();
-};
+ paginationData.page = inputPage.value
+ getData()
+}
</script>
<style scoped>
.pageCon {
@@ -210,14 +200,14 @@
.myCarTopPage {
display: flex;
justify-content: flex-start;
+ flex-wrap: wrap;
box-sizing: border-box;
- overflow: hidden;
- padding-bottom: 20px;
}
.details div:first-child {
font-size: 16px;
- color: #2b68cd;
+ color: #019e58;
margin-bottom: 11px;
+ line-height: 24px;
}
.details div:nth-child(2) {
@@ -258,14 +248,15 @@
}
.bookone {
display: flex;
- width: 420px;
+ width: 405px;
min-height: 173px;
- float: left;
cursor: pointer;
+ margin: 10px;
box-sizing: border-box;
- margin: 20px 0px 0 20px;
- padding: 10px 30px;
- border: 1px solid #ddd;
+ padding: 15px 30px;
+ border: 1px solid #b1ccc1;
+ box-sizing: border-box;
+ border-radius: 5px;
}
.bookone:hover {
-moz-box-shadow: 4px 3px 6px rgba(0, 0, 0, 0.3);
@@ -276,8 +267,9 @@
.bookone .imgBox {
position: relative;
width: 120px;
- height: 160px;
+ height: 150px;
background: #fff;
+ box-shadow: 0px 0px 20px 1px #ccc;
}
.newBookli .imgBox {
position: relative;
--
Gitblit v1.9.1