From 6961b3c8049f388c357b0ec1c283ef002a2b89d9 Mon Sep 17 00:00:00 2001 From: liulujian Date: Mon, 6 Apr 2026 14:45:39 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E7=A7=BB=E5=8A=A8=E7=AB=AF=E9=80=82?= =?UTF-8?q?=E9=85=8D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- txw-mhzc-web/src/pages/index/assets/logo.png | Bin 0 -> 3013 bytes .../src/pages/index/components/nav/index2.vue | 325 +++++++++++++++++- txw-mhzc-web/src/pages/index/router/index.js | 4 + .../src/pages/index/views/fwsc/fwsc.vue | 171 ++++++++- .../src/pages/index/views/fwsc/index.vue | 132 ++++++- .../src/pages/index/views/fwsc/jrsc.vue | 159 ++++++++- .../src/pages/index/views/fwsc/sjlbc.vue | 149 +++++++- .../src/pages/index/views/fwsc/sjsc.vue | 163 ++++++++- .../src/pages/index/views/fwsc/xqsc.vue | 173 +++++++++- .../src/pages/index/views/home2/index.vue | 269 +++++++++++++-- txw-mhzc-web/src/pages/index/views/main.vue | 6 +- 11 files changed, 1497 insertions(+), 54 deletions(-) create mode 100644 txw-mhzc-web/src/pages/index/assets/logo.png diff --git a/txw-mhzc-web/src/pages/index/assets/logo.png b/txw-mhzc-web/src/pages/index/assets/logo.png new file mode 100644 index 0000000000000000000000000000000000000000..6004308258eae1d814024dbea8bc52c894876800 GIT binary patch literal 3013 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
-
+
@@ -20,9 +20,9 @@
-
+
-
+
工作台
@@ -31,15 +31,61 @@
退出登录
-
+
激活
|
登录
+ +
+
+ + + +
+
+ +
+
+
+
+ +
×
+
+
+
+ + +
+ + {{ menu.title }} + +
+ + +
+ + {{ menu.title }} + +
+
+
+
+
+
用户中心
+
退出登录
+
+
+
激活
+ +
+
+
+
@@ -56,6 +102,7 @@ export default { return { curPage: "home", loginFlag: false, //是否已完成登录 + mobileMenuOpen: false, //移动端菜单是否展开 // 路由路径到菜单名的映射 routeToMenuMap: { '/home': 'home', @@ -65,6 +112,9 @@ export default { '/tjrsc': 'fwsc', '/tsjsc': 'fwsc', '/yhzx': 'yhzx', + '/gxnlpt': 'gxnlpt', + '/qych': 'qych', + '/hyzt': 'hyzt', '/login': 'login', }, @@ -126,7 +176,7 @@ export default { name: 'tbgtg', title: '碳报告托管：', value: 'tgbcz', - content: '碳报告存证', + content: '碳报告托管', divider: true, needLogin: true, clientId: 'client_id_tfwzx', @@ -153,7 +203,8 @@ export default { content: '碳金融市场', divider: true, parentName: 'fwsc', - }, { + }, + { name: 'txqsc', title: '碳需求市场', value: 'txqsc', @@ -172,19 +223,19 @@ export default { ] }, { - name: 'gxnl', + name: 'gxnlpt', title: '共性能力', - disable: true + // disable: true }, { name: 'qych', title: '企业出海', - disable: true + // disable: true }, { name: 'hyzt', title: '行业专题', - disable: true + // disable: true }, ] }; @@ -227,6 +278,26 @@ export default { }, beforeUnmount() { }, methods: { + // 切换移动端菜单 + toggleMobileMenu() { + this.mobileMenuOpen = !this.mobileMenuOpen; + document.body.style.overflow = this.mobileMenuOpen ? 'hidden' : ''; + }, + // 关闭移动端菜单 + closeMobileMenu() { + this.mobileMenuOpen = false; + document.body.style.overflow = ''; + }, + // 返回首页 + goHome() { + this.$router.push('/home'); + this.closeMobileMenu(); + }, + // 移动端子菜单点击 + handleMobileDropdownClick(menu) { + this.handleDropdownClick(menu); + this.closeMobileMenu(); + }, // 根据当前路由更新菜单选中状态 updateCurPageByRoute() { const path = this.$route.path; @@ -282,6 +353,8 @@ export default { } this.curPage = menu.name; + // 关闭移动端菜单 + this.closeMobileMenu(); let iframeUrl = menu.iframeUrl; if (iframeUrl) { //调用login.js内的authorize方法（如果需要的话） @@ -317,12 +390,14 @@ export default { } }, gologin() { + this.closeMobileMenu(); this.$router.push("/login") // window.location.href = `/view/mhzc/login`; }, goyhzx() { - this.$router.push("/yhzx") + this.closeMobileMenu(); + this.$router.push("/yhzx/gzt") // window.location.href = `/view/mhzc/yhzx`; }, @@ -374,6 +449,7 @@ export default { }, async logoutHandler() { + this.closeMobileMenu(); const res = await logout(); const resVO = res.data; if (resVO.dcdz) { @@ -416,6 +492,11 @@ export default { } .logo-box { text-align: center; + cursor: pointer; +} + +.option-wrapper { + display: block; } .option-box { @@ -437,6 +518,7 @@ export default { display: flex; padding: 10px; text-align: center; + cursor: pointer; background: rgba(255, 255, 255, 0.3); border-radius: 6px; justify-content: space-around; @@ -473,4 +555,223 @@ export default { .meun-title-disable { cursor: not-allowed !important; } + +/* 汉堡菜单按钮 */ +.hamburger-btn { + display: none; + padding: 10px; + cursor: pointer; +} + +.hamburger-icon { + position: relative; + width: 24px; + height: 18px; +} + +.hamburger-icon span { + position: absolute; + left: 0; + width: 100%; + height: 2px; + background: #fff; + transition: all 0.3s ease; +} + +.hamburger-icon span:nth-child(1) { + top: 0; +} + +.hamburger-icon span:nth-child(2) { + top: 8px; +} + +.hamburger-icon span:nth-child(3) { + top: 16px; +} + +.hamburger-icon.active span:nth-child(1) { + top: 8px; + transform: rotate(45deg); +} + +.hamburger-icon.active span:nth-child(2) { + opacity: 0; +} + +.hamburger-icon.active span:nth-child(3) { + top: 8px; + transform: rotate(-45deg); +} + +/* 移动端菜单 */ +.mobile-menu { + position: fixed; + top: 0; + right: 0; + z-index: 10000; + width: 100%; + height: 100%; + visibility: hidden; + transition: visibility 0.3s ease; +} + +.mobile-menu.open { + visibility: visible; +} + +.mobile-menu-overlay { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.5); +} + +.mobile-menu-content { + position: absolute; + top: 0; + right: 0; + display: flex; + width: 280px; + height: 100%; + max-width: 80%; + background: #fff; + transform: translateX(100%); + transition: transform 0.3s ease; + flex-direction: column; +} + +.mobile-menu.open .mobile-menu-content { + transform: translateX(0); +} + +.mobile-menu-header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 16px 20px; + background: #009a29; +} + +.mobile-menu-header img { + height: 32px; +} + +.close-btn { + font-size: 32px; + line-height: 1; + color: #fff; + cursor: pointer; +} + +.mobile-menu-list { + padding: 10px 0; + overflow-y: auto; + flex: 1; +} + +.mobile-menu-item { + display: flex; + align-items: center; + padding: 14px 20px; + font-size: 15px; + color: #333; + cursor: pointer; + border-bottom: 1px solid #f0f0f0; + gap: 10px; +} + +.mobile-menu-item img { + width: 20px; + height: 20px; +} + +.mobile-menu-item .arrow { + margin-left: auto; + opacity: 0.5; +} + +.mobile-menu-item.active { + color: #009a29; + background: #f0f9f0; +} + +.mobile-menu-item.disable { + color: #999; + cursor: not-allowed; +} + +.mobile-menu-footer { + padding: 16px 20px; + background: #fafafa; + border-top: 1px solid #eee; +} + +.mobile-auth-btns { + display: flex; + gap: 10px; +} + +.mobile-auth-btn { + padding: 10px; + font-size: 14px; + color: #fff; + text-align: center; + cursor: pointer; + background: #009a29; + border-radius: 6px; + flex: 1; +} + +.mobile-auth-btn.activate { + color: #333; + background: #f0f0f0; +} + +.mobile-auth-btn.logout { + color: #666; + background: #fff; + border: 1px solid #ddd; +} + +/* 移动端适配 */ +@media (max-width: 768px) { + .nav-box { + height: 64px; + grid-template-columns: 1fr auto auto; + padding: 0 16px; + } + + .menu-box { + display: none; + } + + .option-wrapper { + display: none; + } + + .hamburger-btn { + display: block; + } + + .logo-box { + text-align: left; + } + + .logo-box img { + height: 28px; + } +} + +@media (max-width: 480px) { + .nav-box { + padding: 0 12px; + } + + .logo-box img { + height: 24px; + } +} diff --git a/txw-mhzc-web/src/pages/index/router/index.js b/txw-mhzc-web/src/pages/index/router/index.js index 91a1a53..07e490a 100644 --- a/txw-mhzc-web/src/pages/index/router/index.js +++ b/txw-mhzc-web/src/pages/index/router/index.js @@ -56,6 +56,10 @@ const router = new VueRouter({ mode: 'history', base: `${window.STATIC_ENV_CONFIG.ROUTER_PREFIX}/`, routes: [mainRoutes], + scrollBehavior(to, from, savedPosition) { + // 每次切换路由时滚动到顶部 + return { x: 0, y: 0 }; + }, }); router.beforeEach((to, from, next) => { diff --git a/txw-mhzc-web/src/pages/index/views/fwsc/fwsc.vue b/txw-mhzc-web/src/pages/index/views/fwsc/fwsc.vue index 7433a89..8d62e7e 100644 --- a/txw-mhzc-web/src/pages/index/views/fwsc/fwsc.vue +++ b/txw-mhzc-web/src/pages/index/views/fwsc/fwsc.vue @@ -24,7 +24,11 @@