From 49a435043b0b1a289a24606e35253365d7ab3956 Mon Sep 17 00:00:00 2001
From: QYF-GitLab1 <1940665526@qq.com>
Date: 星期一, 25 八月 2025 17:51:57 +0800
Subject: [PATCH] 首页、及教学出版样式修改
---
src/views/home/index.vue | 87 ++++++++++++++++++++++++++++++-------------
1 files changed, 61 insertions(+), 26 deletions(-)
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index a6ede68..d5dddec 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -2,7 +2,7 @@
<div class="homePage">
<el-carousel :height="'615px'">
<el-carousel-item v-for="(item, index) in banner" :key="index">
- <div class="bannerBox imgBox">
+ <div class="bannerBox">
<img id="autoHeight" class="bannerImg" :src="item.icon" @click="bannerLink(item)" />
</div>
</el-carousel-item>
@@ -28,7 +28,10 @@
<div class="bookListBox">
<div class="contentBox">
<div class="bookListTitle">
- <div class="title">鎺ㄨ崘鏁欐潗</div>
+ <div class="titleBox">
+ <span class="titleTextBg">鎺ㄨ崘</span>
+ <span>鏁欐潗</span>
+ </div>
<div class="more" @click="toMore">鏇村></div>
</div>
<div class="recommendList">
@@ -45,7 +48,7 @@
<span class="price" v-if="item.price && item.price > 0">
<span> 楼{{ item.price }}</span>
</span>
- <span class="oldPrice" v-if="item.oldPrice"> 楼{{ item.oldPrice }}</span>
+ <span class="oldPrice" v-if="item.oldPrice > 0"> 楼{{ item.oldPrice }}</span>
</div>
</div>
</div>
@@ -74,7 +77,10 @@
<div class="bookListTitle">
<div class="title" style="display: flex; line-height: 50px">
- <div>鏁欏瀵艰埅</div>
+ <div class="titleBox">
+ <span class="titleTextBg">鏁欏</span>
+ <span>瀵艰埅</span>
+ </div>
<div class="titleTabs" v-if="classfeild.length > 0">
<el-tabs v-model="activeName" @tab-change="handleClick">
<el-tab-pane v-for="item in classfeild" :key="item.value" :label="item.name" :name="item.value" />
@@ -99,7 +105,7 @@
<span class="price" v-if="item.price && item.price > 0">
<span>楼{{ item.price }}</span>
</span>
- <span class="oldPrice" v-if="item.oldPrice">楼{{ item.oldPrice }}</span>
+ <span class="oldPrice" v-if="item.oldPrice > 0">楼{{ item.oldPrice }}</span>
</div>
</div>
</div>
@@ -238,7 +244,13 @@
},
})
.then((res) => {
- navBookList.value = res.datas
+ navBookList.value = res.datas?.map(item => {
+ return {
+ ...item,
+ price: toolClass.toDecimal2(item.price),
+ oldPrice: toolClass.toDecimal2(item.oldPrice),
+ }
+ })
})
}
@@ -310,7 +322,13 @@
},
})
.then((res) => {
- bookListData.value = res.datas
+ bookListData.value = res.datas?.map(item => {
+ return {
+ ...item,
+ price: toolClass.toDecimal2(item.price),
+ oldPrice: toolClass.toDecimal2(item.oldPrice),
+ }
+ })
})
}
@@ -348,25 +366,30 @@
background-color: #fff;
padding-bottom: 100px;
- .bannerBox {
- height: 615px;
- position: relative;
- .bannerText {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 36px;
- font-weight: 700;
+ .titleBox {
+ min-width: 127px;
+ font-family: JDLangZhengTi, JDLangZhengTi;
+ font-weight: 400;
+ font-size: 24px;
+ color: #000;
+ line-height: 24px;
+ text-align: left;
+ white-space: nowrap;
+
+ .titleTextBg {
+ padding: 2px 5px;
+ box-sizing: border-box;
+ background-image: url('@/assets/images/xiehe/home/Text_bg2@.png');
+ background-size: 100% 100%;
+ background-repeat: no-repeat;
+ background-position: center;
color: #fff;
- text-shadow: 0px 0px 10px #000000;
- text-align: center;
}
- .enText {
- font-size: 28px;
- opacity: 0.45;
- margin-top: 10px;
- }
+ }
+
+ .bannerBox {
+ width: 100%;
+ height: 100%;
}
}
@@ -479,6 +502,7 @@
border: 1px solid #DEDEDE;
box-sizing: border-box;
padding: 30px 0;
+ box-sizing: border-box;
&:last-child {
margin-right: 0;
@@ -570,7 +594,7 @@
}
.titleTabs {
- margin-left: 50px;
+ margin-left: 30px;
width: 85%;
}
@@ -581,7 +605,6 @@
margin-bottom: 20px;
border-bottom: 1px solid #ebebeb;
- padding-bottom: 20px;
.title {
font-size: 20px;
@@ -594,6 +617,8 @@
color: #999999;
cursor: pointer;
font-weight: 500;
+ min-width: 60px;
+ text-align: center;
}
}
@@ -640,4 +665,14 @@
box-sizing: border-box;
margin: 0 10px;
}
+
+
+::v-deep(.el-tabs__header) {
+ padding: 0;
+ position: relative;
+ margin: 0 0 0 0px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between
+}
</style>
--
Gitblit v1.9.1