Merge branch 'main' of https://dd3skj.picp.vip/JyuHsin/zhgh_cug_v4
# Conflicts: # src/main/java/com/budwk/app/sys/controller/SysConfController.java # src/main/resources/views/layouts/v4/home/index.html
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
const act = {
|
||||
template: /*language=HTML*/ `
|
||||
<!-- 活动 -->
|
||||
<div class="section-wrapper">
|
||||
<div class="activity-section-wrapper">
|
||||
<div class="section-act">
|
||||
<!-- Swiper容器 -->
|
||||
|
||||
@@ -77,8 +77,8 @@ const act = {
|
||||
/*初始化Swiper*/
|
||||
initSwiper() {
|
||||
this.swiper = new Swiper('.activity-swiper', {
|
||||
slidesPerView: 'auto',
|
||||
spaceBetween: 30,
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 18,
|
||||
centeredSlides: false,
|
||||
loop: false,
|
||||
navigation: {
|
||||
@@ -91,13 +91,13 @@ const act = {
|
||||
},
|
||||
breakpoints: {
|
||||
768: {
|
||||
slidesPerView: 1,
|
||||
},
|
||||
1024: {
|
||||
slidesPerView: 2,
|
||||
},
|
||||
1024: {
|
||||
slidesPerView: 4,
|
||||
},
|
||||
1200: {
|
||||
slidesPerView: 3,
|
||||
slidesPerView: 5,
|
||||
}
|
||||
}
|
||||
})
|
||||
@@ -131,7 +131,7 @@ const act = {
|
||||
this.listAct()
|
||||
},
|
||||
style: /*language=CSS*/ `
|
||||
.section-wrapper {
|
||||
.activity-section-wrapper {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@@ -176,7 +176,7 @@ const act = {
|
||||
.activity-swiper-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
padding: 9px 14px;
|
||||
/*margin-top: 30px;*/
|
||||
}
|
||||
|
||||
@@ -217,7 +217,7 @@ const act = {
|
||||
/* 进度条样式 */
|
||||
.activity-swiper-container .swiper-pagination {
|
||||
position: relative;
|
||||
margin-top: 30px;
|
||||
margin-top: 12px;
|
||||
height: 4px;
|
||||
}
|
||||
|
||||
@@ -239,8 +239,8 @@ const act = {
|
||||
|
||||
.activity-swiper .swiper-slide .item .img-box {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
border-radius: 12px;
|
||||
height: 128px;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
@@ -250,10 +250,12 @@ const act = {
|
||||
left: 0;
|
||||
top: 0;
|
||||
background: #c11623;
|
||||
padding: 6px 2px;
|
||||
min-width: 50px;
|
||||
padding: 4px 2px;
|
||||
min-width: 42px;
|
||||
color: #ffffff;
|
||||
border-radius: 0 0 50% 0;
|
||||
font-size: 12px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
|
||||
@@ -269,16 +271,16 @@ const act = {
|
||||
}
|
||||
|
||||
.activity-swiper .swiper-slide .item h4 {
|
||||
font-size: 20px;
|
||||
margin-top: 10px;
|
||||
height: 60px;
|
||||
font-size: 15px;
|
||||
margin: 8px 0 0;
|
||||
height: 42px;
|
||||
color: #333;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 1.5;
|
||||
line-height: 1.4;
|
||||
text-align: left;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
@@ -292,14 +294,14 @@ const act = {
|
||||
}
|
||||
|
||||
.activity-swiper .swiper-slide .item .time p {
|
||||
font-size: 13px;
|
||||
font-size: 12px;
|
||||
margin: 0;
|
||||
/*line-height: 1.5;*/
|
||||
line-height: 1.4;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.activity-swiper .swiper-slide .item .time i {
|
||||
margin-right: 5px;
|
||||
margin-right: 4px;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
const entry = {
|
||||
template: /*language=HTML*/ `
|
||||
<div class="entry-wrapper">
|
||||
<div class="entry-section" v-for="section in entrySections" :key="section.key">
|
||||
<div :class="['entry-section', 'entry-section-' + section.key]" v-for="section in entrySections" :key="section.key">
|
||||
<div class="entry-section-header">
|
||||
<div class="entry-section-title">
|
||||
<i :class="section.icon"></i>
|
||||
@@ -126,6 +126,11 @@ const entry = {
|
||||
margin-top: 22px;
|
||||
}
|
||||
|
||||
/* 临时屏蔽“我的收藏”分组，保留原节点和数据逻辑便于恢复 */
|
||||
.entry-section-fav {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.entry-section-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -10,37 +10,14 @@ layout("/layouts/v4/baseLayout.html"){
|
||||
}
|
||||
|
||||
.section-banner .banner-img {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 470px;
|
||||
}
|
||||
|
||||
.section-banner .banner-carousel,
|
||||
.section-banner .banner-carousel .el-carousel__container {
|
||||
height: 470px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.section-banner .banner-img img {
|
||||
width: 100%;
|
||||
height: 470px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.section-banner .banner-carousel .el-carousel__item {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.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;
|
||||
height: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.section-wrapper {
|
||||
@@ -78,31 +55,52 @@ layout("/layouts/v4/baseLayout.html"){
|
||||
align-items: center;
|
||||
min-width: 320px;
|
||||
background: white;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.06);
|
||||
padding: 11px;
|
||||
transition: transform 0.2s, box-shadow 0.2s;
|
||||
}
|
||||
|
||||
.home-section {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.home-section-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.home-section-title {
|
||||
display: inline-flex;
|
||||
align-items: baseline;
|
||||
gap: 6px;
|
||||
color: #19324d;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.home-section-title i {
|
||||
color: #409eff;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.home-section-title em {
|
||||
color: #b5c0d6;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div class="v4-container" id="v4-home-app">
|
||||
<!-- 首页banner -->
|
||||
<div class="section-banner">
|
||||
<div class="banner-img">
|
||||
<el-carousel
|
||||
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>
|
||||
<img :src="homeBannerList[0] || ''" alt=""/>
|
||||
<stats></stats>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -115,6 +113,21 @@ layout("/layouts/v4/baseLayout.html"){
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="home-grid">
|
||||
<div class="home-section">
|
||||
<div class="home-section-header">
|
||||
<div class="home-section-title">
|
||||
<i class="fa fa-calendar"></i>
|
||||
<span>最新活动</span>
|
||||
<em>/Activities</em>
|
||||
</div>
|
||||
</div>
|
||||
<div class="act-card">
|
||||
<act></act>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<work-template v-if="$auth.hasRoleOr(['SYSADMIN','SCHOOL_UNION_ADMIN'])"></work-template>
|
||||
|
||||
<jcdt :list="websiteNews"></jcdt>
|
||||
@@ -136,7 +149,7 @@ layout("/layouts/v4/baseLayout.html"){
|
||||
data(){
|
||||
return{
|
||||
websiteNews: [],
|
||||
homeBannerList: "${config.PCHomeImg!}".split(",").map(item => item.trim()).filter(item => item)
|
||||
homeBannerList: "${config.AppHomeImg!}".split(",").map(item => item.trim()).filter(item => item)
|
||||
}
|
||||
},
|
||||
components: {
|
||||
|
||||
@@ -109,6 +109,11 @@ const stats = {
|
||||
/*border: 1px solid #e8e8e8;*/
|
||||
}
|
||||
|
||||
/* 子内容临时屏蔽时，同步收起统计容器，避免首页 banner 下方出现空白 */
|
||||
.stats-section {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.stats-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
@@ -118,6 +123,11 @@ const stats = {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
/* 临时屏蔽首页右上角“待办、已办、消息、发起”统计卡片，保留原模板便于恢复 */
|
||||
.stats-grid {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.stat-item {
|
||||
background: rgba(255, 255, 255, 0.4);
|
||||
backdrop-filter: blur(10px);
|
||||
|
||||
@@ -138,20 +138,28 @@ const workTemplate = {
|
||||
}
|
||||
|
||||
.work-template-icon {
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
width: 55px;
|
||||
height: 55px;
|
||||
margin-bottom: 8px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.work-template-icon img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
width: 55px !important;
|
||||
height: 55px !important;
|
||||
max-width: none;
|
||||
max-height: none;
|
||||
object-fit: cover;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.work-template-name {
|
||||
min-height: 34px;
|
||||
font-size: 12px;
|
||||
font-size: 12px !important;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
line-height: 1.4;
|
||||
word-break: break-word;
|
||||
|
||||
@@ -305,7 +305,7 @@ const user = {
|
||||
|
||||
.user-container {
|
||||
width: 80%;
|
||||
margin: 20px auto;
|
||||
margin: 12px auto 20px;
|
||||
display: grid;
|
||||
grid-template-columns: 0.7fr 2.3fr;
|
||||
gap: 24px;
|
||||
|
||||
Reference in New Issue
Block a user