From 8bffcbb7f5fca4e1e7a308f6f786b63d0773704c Mon Sep 17 00:00:00 2001
From: zhongshujie <2862698242@qq.com>
Date: 星期一, 28 四月 2025 19:28:29 +0800
Subject: [PATCH] 页面优化
---
src/views/honors/index.vue | 51 +++++++++++++++++++++++++++++++++++++--------------
1 files changed, 37 insertions(+), 14 deletions(-)
diff --git a/src/views/honors/index.vue b/src/views/honors/index.vue
index c299f09..cae8214 100644
--- a/src/views/honors/index.vue
+++ b/src/views/honors/index.vue
@@ -11,8 +11,8 @@
<!-- 宸﹁竟鏍囬 -->
<div class="honors-main-title">鑽�<br />瑾�<br />濂�<br />椤�</div>
<!-- 鍙宠竟鍐呭 -->
- <div class="honors-text" v-loading="loading" element-loading-background="rgba(0, 0, 0, 0)" element-loading-text="瀛︾敓鍒楄〃鍔犺浇涓�"
- element-loading-spinner="el-icon-loading">
+ <div class="honors-text" v-loading="loading" element-loading-background="rgba(0, 0, 0, 0)"
+ element-loading-text="瀛︾敓鍒楄〃鍔犺浇涓�" element-loading-spinner="el-icon-loading">
<div style="min-height: 646px;">
<ul>
<li v-for="(item, index) in honorList" :key="index">
@@ -24,14 +24,17 @@
</li>
</ul>
</div>
- <!-- 鍒嗛〉 -->
- <div class="pagination">
- <el-pagination @current-change="handleCurrentChange" class="msg-pagination-container"
- :background="isBackground" layout="prev, pager, next" :total="total">
- </el-pagination>
+ <div class="honor-main-bottom">
+ <!-- 鈥滃北鈥濆浘鐗� -->
+ <img class="honor-Bg" src="../../assets/images/honors/honor-Bg.png" alt="" />
+ <!-- 鍒嗛〉 -->
+ <div class="pagination">
+ <el-pagination @current-change="handleCurrentChange" class="msg-pagination-container"
+ :background="isBackground" layout="prev, pager, next" :total="total">
+ </el-pagination>
+ </div>
</div>
- <!-- 鈥滃北鈥濆浘鐗� -->
- <img class="honor-Bg" src="../../assets/images/honors/honor-Bg.png" alt="" />
+ <el-empty v-if="!loading && !honorList.length"></el-empty>
</div>
</div>
</div>
@@ -49,7 +52,7 @@
honorList: [],
total: 0,
currentPage: 1,
- loading: false,
+ loading: true,
};
},
mounted() {
@@ -70,9 +73,6 @@
start: (this.currentPage - 1) * 10,
size: 10,
},
- // coverSize: {
- // height: 70
- // }
}).then((res) => {
console.log(res, "res");
if (res.datas && res.datas.length) {
@@ -141,6 +141,7 @@
flex: 1;
width: 100%;
height: 100%;
+ min-width: 1200px;
overflow: auto;
padding-top: 2%;
padding-bottom: 2%;
@@ -236,6 +237,23 @@
}
}
+.honor-main-bottom {
+ display: flex;
+ justify-content: space-between
+}
+
+::v-deep .el-loading-spinner {
+ .el-loading-text {
+ font-size: 14px;
+ color: #937950;
+ }
+
+ .el-icon-loading {
+ font-size: 14px;
+ color: #937950;
+ }
+}
+
@font-face {
font-family: "Alimama DongFangDaKai";
src: url("../../assets/font/闃块噷濡堝涓滄柟澶фシ.ttf");
@@ -317,6 +335,11 @@
background-color: #937950;
color: #fff;
border-radius: 5px;
- border: 1px solid #cccccc;
+ border: 1px solid#cccccc;
+}
+
+//淇敼榧犳爣婊戣繃鐨勯鑹�
+:deep.el-pagination.is-background .el-pager li:not(.disabled):hover {
+ color: #937950
}
</style>
--
Gitblit v1.9.1