feat:优化部分页面问题
This commit is contained in:
parent
63eebcea09
commit
36843fb304
@ -122,13 +122,13 @@ export default {
|
||||
align-items: stretch;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
gap: 24px;
|
||||
gap: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-column {
|
||||
flex: 1 1 0;
|
||||
min-width: 0;
|
||||
flex: 1 1 auto;
|
||||
min-width: 200px;
|
||||
/* 优化需求:列内整体居中显示(标题+列表与列中心对齐) */
|
||||
text-align: center;
|
||||
display: flex;
|
||||
@ -139,7 +139,7 @@ export default {
|
||||
.footer-title {
|
||||
position: relative;
|
||||
margin: 0 0 12px;
|
||||
padding-left: 12px;
|
||||
// padding-left: 12px;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
line-height: 24px;
|
||||
@ -152,7 +152,7 @@ export default {
|
||||
left: 0;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
background: linear-gradient(180deg, #4caf50 0%, #2e7d32 100%);
|
||||
// background: linear-gradient(180deg, #4caf50 0%, #2e7d32 100%);
|
||||
border-radius: 2px;
|
||||
content: '';
|
||||
transform: translateY(-50%);
|
||||
|
||||
@ -1078,7 +1078,8 @@ export default {
|
||||
margin-top: auto;
|
||||
margin-bottom: 0;
|
||||
// 标题/副标题 与 搜索框 的间距:再收窄为 12px,符合 Figma 设计
|
||||
gap: var(--home-hero-content-gap-fluid, clamp(8px, 1.2vh, 12px));
|
||||
// gap: var(--home-hero-content-gap-fluid, clamp(8px, 1.2vh, 12px));
|
||||
gap: 36px !important;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
||||
@ -144,6 +144,10 @@ export default {
|
||||
mounted() {
|
||||
this.syncTabFromRoute(this.$route.query.type);
|
||||
this.fetchNewsData();
|
||||
window.addEventListener('scroll', this.onScroll, { passive: true });
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener('scroll', this.onScroll);
|
||||
},
|
||||
methods: {
|
||||
goHomeToNews() {
|
||||
@ -155,10 +159,8 @@ export default {
|
||||
if (index >= 0) this.activeTab = index;
|
||||
},
|
||||
switchTab(index) {
|
||||
if (this.activeTab === index) {
|
||||
// 再次点击当前 tab 仍然收起(首次进入除外)
|
||||
if (this.bannerCollapsed) return;
|
||||
}
|
||||
// 同 tab 直接 no-op(避免无意义的状态抖动)
|
||||
if (this.activeTab === index) return;
|
||||
this.activeTab = index;
|
||||
this.bannerCollapsed = true;
|
||||
const type = this.newsTabs[index]?.type;
|
||||
@ -174,7 +176,27 @@ export default {
|
||||
});
|
||||
},
|
||||
onPageChange() {
|
||||
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||||
const root = this.getScrollRoot();
|
||||
if (root && root !== window) {
|
||||
root.scrollTo({ top: 0, behavior: 'smooth' });
|
||||
} else {
|
||||
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||||
}
|
||||
},
|
||||
onScroll() {
|
||||
// 滚回 banner 顶部时自动展开 banner
|
||||
if (!this.bannerCollapsed) return;
|
||||
const root = this.getScrollRoot();
|
||||
const scrollTop = root === window ? window.scrollY : (root && root.scrollTop) || 0;
|
||||
if (scrollTop <= 8) {
|
||||
this.bannerCollapsed = false;
|
||||
}
|
||||
},
|
||||
getScrollRoot() {
|
||||
// 优先锁定 .content-wrap(main.vue 唯一滚动容器),兜底用 window
|
||||
const portalRoot = document.querySelector('.content-wrap');
|
||||
if (portalRoot) return portalRoot;
|
||||
return window;
|
||||
},
|
||||
handleNewsClick(item) {
|
||||
const link = item.yyLj || item.lj;
|
||||
|
||||
@ -1034,7 +1034,7 @@ body {
|
||||
.banner1 {
|
||||
--qych-section-bg: #f7faf8;
|
||||
background: url(../../assets/qych/banner3.png);
|
||||
background-size: contain;
|
||||
background-size: cover;
|
||||
background-position: center top;
|
||||
}
|
||||
.banner2 {
|
||||
@ -1044,7 +1044,7 @@ body {
|
||||
.banner3 {
|
||||
--qych-section-bg: #f0faf2;
|
||||
background: url(../../assets/qych/banner1.png);
|
||||
background-size: contain;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.open-page {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user