This commit is contained in:
2026-06-01 08:41:09 +08:00
parent f05e534e52
commit 79e61f8d99
4 changed files with 105 additions and 66 deletions
@@ -103,6 +103,7 @@ public class SysConfController {
private void ensureConfigValueColumn(Sys_config conf) { private void ensureConfigValueColumn(Sys_config conf) {
if (conf == null || (!"AppHomeImg".equals(conf.getConfigKey()) if (conf == null || (!"AppHomeImg".equals(conf.getConfigKey())
&& !"PCHomeImg".equals(conf.getConfigKey())
&& !"AppFeaturedActivityImg".equals(conf.getConfigKey()) && !"AppFeaturedActivityImg".equals(conf.getConfigKey())
&& !"AppFestivalBenefitImg".equals(conf.getConfigKey()))) { && !"AppFestivalBenefitImg".equals(conf.getConfigKey()))) {
return; return;
@@ -10,20 +10,37 @@ layout("/layouts/v4/baseLayout.html"){
} }
.section-banner .banner-img { .section-banner .banner-img {
position: relative;
width: 100%; width: 100%;
height: auto; height: 470px;
}
.section-banner .banner-carousel,
.section-banner .banner-carousel .el-carousel__container {
height: 470px;
} }
.section-banner .banner-img img { .section-banner .banner-img img {
width: 100%; width: 100%;
/*height: 100%;*/
height: 470px; height: 470px;
object-fit: cover; object-fit: cover;
} }
/* 临时屏蔽首页背景图,保留原图片节点便于恢复 */ .section-banner .banner-carousel .el-carousel__item {
.section-banner .banner-img > img { overflow: hidden;
display: none; }
.section-banner .banner-stats {
position: absolute;
left: 0;
right: 0;
bottom: 20px;
z-index: 2;
pointer-events: none;
}
.section-banner .banner-stats .stats-section {
pointer-events: auto;
} }
.section-wrapper { .section-wrapper {
@@ -73,8 +90,19 @@ layout("/layouts/v4/baseLayout.html"){
<!-- 首页banner --> <!-- 首页banner -->
<div class="section-banner"> <div class="section-banner">
<div class="banner-img"> <div class="banner-img">
<img :src="homeBannerList[0] || ''" alt=""/> <el-carousel
<stats></stats> v-if="homeBannerList.length > 0"
class="banner-carousel"
height="470px"
:interval="5000"
arrow="hover">
<el-carousel-item v-for="(item, index) in homeBannerList" :key="index">
<img :src="item" alt=""/>
</el-carousel-item>
</el-carousel>
<div class="banner-stats">
<stats></stats>
</div>
</div> </div>
</div> </div>
@@ -108,7 +136,7 @@ layout("/layouts/v4/baseLayout.html"){
data(){ data(){
return{ return{
websiteNews: [], websiteNews: [],
homeBannerList: "${config.AppHomeImg!}".split(",").map(item => item.trim()).filter(item => item) homeBannerList: "${config.PCHomeImg!}".split(",").map(item => item.trim()).filter(item => item)
} }
}, },
components: { components: {
@@ -9,64 +9,56 @@ const stats = {
<div <div
class="stat-item pending" class="stat-item pending"
@click="handleStatClick('todo')" @click="handleStatClick('todo')"
@mouseenter="onMouseEnter"
@mouseleave="onMouseLeave"
> >
<div class="stat-icon stat-icon-hidden">
<i class="fa fa-clock-o"></i>
</div>
<div class="stat-content"> <div class="stat-content">
<div class="stat-label">待办</div> <div class="stat-label">待办</div>
<div class="stat-number">{{ stats.todoCount }}</div> <div class="stat-number">{{ stats.todoCount }}</div>
</div> </div>
<div class="stat-icon">
<i class="fa fa-clock-o"></i>
</div>
</div> </div>
<!-- 已办 --> <!-- 已办 -->
<div <div
class="stat-item completed" class="stat-item completed"
@click="handleStatClick('done')" @click="handleStatClick('done')"
@mouseenter="onMouseEnter"
@mouseleave="onMouseLeave"
> >
<div class="stat-icon stat-icon-hidden">
<i class="fa fa-check-circle"></i>
</div>
<div class="stat-content"> <div class="stat-content">
<div class="stat-label">已办</div> <div class="stat-label">已办</div>
<div class="stat-number">{{ stats.doneCount }}</div> <div class="stat-number">{{ stats.doneCount }}</div>
</div> </div>
<div class="stat-icon">
<i class="fa fa-check-circle"></i>
</div>
</div> </div>
<!-- 消息 --> <!-- 消息 -->
<div <div
class="stat-item messages" class="stat-item messages"
@click="handleStatClick('notification')" @click="handleStatClick('notification')"
@mouseenter="onMouseEnter"
@mouseleave="onMouseLeave"
> >
<div class="stat-icon stat-icon-hidden">
<i class="fa fa-bell"></i>
</div>
<div class="stat-content"> <div class="stat-content">
<div class="stat-label">消息</div> <div class="stat-label">消息</div>
<div class="stat-number">{{ stats.notifications }}</div> <div class="stat-number">{{ stats.notifications }}</div>
</div> </div>
<div class="stat-icon">
<i class="fa fa-bell"></i>
</div>
</div> </div>
<!-- 发起 --> <!-- 发起 -->
<div <div
class="stat-item reminders" class="stat-item reminders"
@click="handleStatClick('started')" @click="handleStatClick('started')"
@mouseenter="onMouseEnter"
@mouseleave="onMouseLeave"
> >
<div class="stat-icon stat-icon-hidden">
<i class="fa fa-file-text"></i>
</div>
<div class="stat-content"> <div class="stat-content">
<div class="stat-label">发起</div> <div class="stat-label">发起</div>
<div class="stat-number">{{ stats.startedCount }}</div> <div class="stat-number">{{ stats.startedCount }}</div>
</div> </div>
<div class="stat-icon">
<i class="fa fa-file-text"></i>
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -90,15 +82,6 @@ const stats = {
} }
}, },
onMouseEnter(event) {
event.target.style.transform = 'translateY(-2px)';
event.target.style.boxShadow = '0 4px 12px rgba(0,0,0,0.15)';
},
onMouseLeave(event) {
event.target.style.transform = 'none';
event.target.style.boxShadow = '0 2px 6px rgba(0,0,0,0.08)';
},
loadStats() { loadStats() {
this.$axios.post("/flow/todoCenter/statistics").then(res => { this.$axios.post("/flow/todoCenter/statistics").then(res => {
if (res.code === 0) { if (res.code === 0) {
@@ -136,75 +119,90 @@ const stats = {
} }
.stat-item { .stat-item {
background: #f8f9fa; background: rgba(255, 255, 255, 0.4);
color: #495057; backdrop-filter: blur(10px);
padding: 14px; -webkit-backdrop-filter: blur(10px);
border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.3);
color: #1f2937;
padding: 20px;
border-radius: 14px;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px; justify-content: space-between;
gap: 16px;
cursor: pointer; cursor: pointer;
transition: all 0.2s ease; transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
box-shadow: 0 2px 6px rgba(0,0,0,0.08); box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
width: 100%; width: 100%;
height: 90px; height: 90px;
} }
.stat-item:hover {
background: rgba(255, 255, 255, 0.62);
border-color: rgba(255, 255, 255, 0.55);
transform: translateY(-5px);
box-shadow: 0 16px 36px rgba(15, 23, 42, 0.18);
}
.stat-icon { .stat-icon {
font-size: 30px; font-size: 26px;
width: 50px; width: 44px;
height: 50px; height: 44px;
background: #e6f7ff; background: rgba(255, 255, 255, 0.42);
color: #1890ff; color: rgba(31, 41, 55, 0.72);
border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.35);
border-radius: 14px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} flex-shrink: 0;
/* 临时屏蔽待办、已办、消息、发起四个统计图标 */
.stat-icon-hidden {
display: none !important;
} }
.stat-item.pending .stat-icon, .stat-item.pending .stat-icon,
.stat-item.completed .stat-icon, .stat-item.completed .stat-icon,
.stat-item.messages .stat-icon, .stat-item.messages .stat-icon,
.stat-item.reminders .stat-icon { .stat-item.reminders .stat-icon {
background: #e6f7ff; background: rgba(255, 255, 255, 0.42);
color: #1890ff; }
.stat-item.pending .stat-icon {
color: #2563eb;
} }
.stat-item.completed .stat-icon { .stat-item.completed .stat-icon {
color: #52c41a; color: #16a34a;
} }
.stat-item.messages .stat-icon { .stat-item.messages .stat-icon {
color: #faad14; color: #d97706;
} }
.stat-item.reminders .stat-icon { .stat-item.reminders .stat-icon {
color: #13c2c2; color: #0891b2;
} }
.stat-content { .stat-content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin-left: 0; margin-left: 0;
min-width: 0;
text-align: left;
} }
.stat-label { .stat-label {
font-size: 15px; font-size: 14px;
opacity: 0.7; color: rgba(31, 41, 55, 0.78);
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.5px; letter-spacing: 1px;
line-height: 1.2;
} }
.stat-number { .stat-number {
font-size: 18px; font-size: 28px;
font-weight: bold; font-weight: 700;
margin-top: 2px; color: #111827;
margin-top: 6px;
line-height: 1;
} }
.stats-family { .stats-family {
@@ -99,6 +99,18 @@ layout("/layouts/platform.html"){
></file-upload> ></file-upload>
<span>最佳分辨率:2756 x 732,最多可上传 10 张,首页按上传顺序轮播</span> <span>最佳分辨率:2756 x 732,最多可上传 10 张,首页按上传顺序轮播</span>
</template> </template>
<template v-else-if="formData.configKey === 'PCHomeImg'">
<file-upload
key="PCHomeImg"
style="--upload-width: 214px;--upload-height:64px"
:value.sync="formData.configValue"
:upload_number="10"
upload_mode="image"
upload_result_category="interval"
upload_result_type="url"
></file-upload>
<span>最佳分辨率:2756 x 732,最多可上传 10 张,PC端首页按上传顺序轮播</span>
</template>
<template v-else-if="formData.configKey === 'AppFeaturedActivityImg'"> <template v-else-if="formData.configKey === 'AppFeaturedActivityImg'">
<file-upload <file-upload
key="AppFeaturedActivityImg" key="AppFeaturedActivityImg"