feat: 金融市场接口调整、导航调整、footer调整
This commit is contained in:
parent
53517b4594
commit
25ee16640e
@ -80,4 +80,33 @@ export default {
|
||||
data: JSON.stringify(params),
|
||||
});
|
||||
},
|
||||
|
||||
// 获取银行-保险机构列表（type: 'xd'=信贷, 'bx'=保险）
|
||||
queryJgList(type) {
|
||||
return fetchSso({
|
||||
url: `${basurl}/gxzx/lsjr/queryJgList`,
|
||||
method: 'post',
|
||||
loading: true,
|
||||
data: JSON.stringify({ type }),
|
||||
});
|
||||
},
|
||||
|
||||
// 获取信贷、保险产品列表
|
||||
queryXdbxcpList(params = {}) {
|
||||
return fetchSso({
|
||||
url: `${basurl}/gxzx/lsjr/queryXdbxcpList`,
|
||||
method: 'post',
|
||||
loading: true,
|
||||
data: JSON.stringify({ type: 'xd', cpmc: '', pageNum: 1, pageSize: 9, ...params }),
|
||||
});
|
||||
},
|
||||
|
||||
// 获取信贷、保险产品详情
|
||||
queryXdbxcpxq(cpid) {
|
||||
return fetchSso({
|
||||
url: `${basurl}/gxzx/lsjr/queryXdbxcpxq?cpid=${cpid}`,
|
||||
method: 'get',
|
||||
loading: true,
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
@ -1,68 +1,65 @@
|
||||
<template>
|
||||
<footer class="bg-dark text-white" style="padding-top: 34px">
|
||||
<div class="container mx-auto px-4">
|
||||
<div class="footer-box">
|
||||
<div class="footer-box-1">
|
||||
<div class="font-semibold flex items-center btjs-title btjs-title-18">
|
||||
<logo :size="30" />平台介绍
|
||||
</div>
|
||||
<p class="btjs-text text-gray-400">
|
||||
{{ APP_INTRODUCTION1 }}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<div class="btjs-title font-semibold">联系方式</div>
|
||||
<div class="text-gray-400 btjs-text space-y-2">
|
||||
<div class="flex items-center mb-8px">
|
||||
<!-- <i class="fa fa-phone mr-2 text-secondary"></i> -->
|
||||
{{ contact.mobile }}
|
||||
</div>
|
||||
<div class="flex items-center mb-8px">
|
||||
<!-- <i class="fa fa-envelope mr-2 text-secondary"></i> -->
|
||||
{{ contact.email }}
|
||||
</div>
|
||||
<div class="flex items-center mb-8px">
|
||||
<!-- <i class="fa fa-map-marker mr-2 text-secondary"></i> -->
|
||||
{{ contact.address }}
|
||||
<footer class="bg-dark text-white">
|
||||
<div class="footer-container">
|
||||
<!-- 上部信息区 -->
|
||||
<div class="footer-top">
|
||||
<!-- 指导单位 -->
|
||||
<div class="footer-column">
|
||||
<div class="footer-title">指导单位</div>
|
||||
<div class="footer-links">
|
||||
<div class="footer-link-item">上海市数据局</div>
|
||||
<div class="footer-link-item">宝山区政府</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="btjs-title font-semibold">备案信息</div>
|
||||
<div class="text-gray-400">
|
||||
<div class="mb-8px" v-for="(item, index) in icpList" :key="index">
|
||||
<a v-if="item.herf" :href="item.herf" class="btjs-text" target="_blank">
|
||||
{{ item.title }}
|
||||
</a>
|
||||
<span class="btjs-text" v-else>{{ item.title }}</span>
|
||||
|
||||
<!-- 主办单位 -->
|
||||
<div class="footer-column">
|
||||
<div class="footer-title">主办单位</div>
|
||||
<div class="footer-links">
|
||||
<div class="footer-link-item">宝山区数据局</div>
|
||||
<div class="footer-link-item">宝山区发改委</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="btjs-title font-semibold">业务支持</div>
|
||||
<div class="text-gray-400">
|
||||
<div class="mb-8px" v-for="(item, index) in zddwList" :key="index">
|
||||
<a v-if="item.herf" :href="item.herf" class="btjs-text" target="_blank">
|
||||
{{ item.title }}
|
||||
</a>
|
||||
<span class="btjs-text" v-else>{{ item.title }}</span>
|
||||
|
||||
<!-- 运营单位 -->
|
||||
<div class="footer-column">
|
||||
<div class="footer-title">运营单位</div>
|
||||
<div class="footer-links">
|
||||
<div class="footer-link-item">上海浦江数链数字科技有限公司</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 业务支持 -->
|
||||
<div class="footer-column">
|
||||
<div class="footer-title">业务支持</div>
|
||||
<div class="footer-links">
|
||||
<div class="footer-link-item">上海数字基础设施协会可信碳专委会</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="btjs-title font-semibold">帮助中心</div>
|
||||
<div class="text-gray-400">
|
||||
<div class="mb-8px" v-for="(item, index) in helpCenterLinks" :key="index">
|
||||
<a v-if="item.herf" :href="item.herf" class="btjs-text" target="_blank">
|
||||
{{ item.title }}
|
||||
</a>
|
||||
<span class="btjs-text" v-else>{{ item.title }}</span>
|
||||
</div>
|
||||
|
||||
<!-- 联系方式 -->
|
||||
<div class="footer-column contact-column">
|
||||
<div class="footer-title">联系我们</div>
|
||||
<div class="footer-links contact-info">
|
||||
<div class="contact-item">
|
||||
<span class="contact-icon">📧</span>
|
||||
<span>{{ contact.email }}</span>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<span class="contact-icon">📍</span>
|
||||
<span>{{ contact.address }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-gray-400 footer-bottom">
|
||||
<p>{{ copyright }}</p>
|
||||
|
||||
<!-- 分隔线 -->
|
||||
<div class="footer-divider"></div>
|
||||
|
||||
<!-- 下部版权信息 -->
|
||||
<div class="footer-bottom">
|
||||
<p class="copyright">{{ copyright }}</p>
|
||||
<p class="infrastructure">基础设施：国家区块链网络基础底座（上海枢纽）</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
@ -70,58 +67,180 @@
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
import Logo from '@/pages/index/components/logo/index.vue';
|
||||
|
||||
export default {
|
||||
name: 'footer',
|
||||
components: {Logo},
|
||||
name: 'Footer',
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
computed: {
|
||||
...mapState('settings', ['APP_NAME', 'APP_INTRODUCTION1', 'contact', 'icpList', 'helpCenterLinks', 'copyright','zddwList']),
|
||||
...mapState('settings', ['APP_NAME', 'contact', 'copyright']),
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.footer-box {
|
||||
.footer-container {
|
||||
max-width: 1400px;
|
||||
padding: 40px 20px 20px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.footer-top {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
||||
.footer-box-1 {
|
||||
width: 250px;
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
.footer-column {
|
||||
max-width: 280px;
|
||||
min-width: 150px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.footer-title {
|
||||
position: relative;
|
||||
padding-left: 12px;
|
||||
margin-bottom: 16px;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
background: linear-gradient(180deg, #4caf50, #2e7d32);
|
||||
border-radius: 2px;
|
||||
content: '';
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
.btjs-text {
|
||||
|
||||
.footer-links {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.footer-link-item {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
letter-spacing: 0;
|
||||
// color: #fff;
|
||||
text-align: justify;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
transition: color 0.3s;
|
||||
|
||||
&:hover {
|
||||
color: #4caf50;
|
||||
}
|
||||
}
|
||||
.btjs-title {
|
||||
margin-bottom: 12px;
|
||||
|
||||
.contact-column {
|
||||
flex: 1.2;
|
||||
}
|
||||
|
||||
.contact-info {
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.contact-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
line-height: 24px;
|
||||
letter-spacing: 0;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
.btjs-title-18 {
|
||||
font-size: 18px;
|
||||
|
||||
.contact-icon {
|
||||
flex-shrink: 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
.mb-8px {
|
||||
margin-top: 0;
|
||||
margin-bottom: 8px;
|
||||
|
||||
.footer-divider {
|
||||
height: 1px;
|
||||
margin: 30px 0 20px;
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
.footer-bottom {
|
||||
padding: 20px 0;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
line-height: 18px;
|
||||
// color: #FFFFFF;
|
||||
letter-spacing: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
margin: 0 0 8px;
|
||||
font-size: 13px;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
}
|
||||
|
||||
.infrastructure {
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
|
||||
// 移动端适配
|
||||
@media (max-width: 1024px) {
|
||||
.footer-top {
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.footer-column {
|
||||
min-width: calc(50% - 12px);
|
||||
}
|
||||
|
||||
.contact-column {
|
||||
flex: 1 1 100%;
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.footer-container {
|
||||
padding: 30px 16px 16px;
|
||||
}
|
||||
|
||||
.footer-top {
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.footer-column {
|
||||
width: 100%;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.footer-title {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.footer-links {
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.footer-link-item {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.contact-info {
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.contact-item {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.footer-divider {
|
||||
margin: 24px 0 16px;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.infrastructure {
|
||||
font-size: 11px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -44,7 +44,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { logout, authorize, init } from '@/pages/index/api/login';
|
||||
import { logout, authorize } from '@/pages/index/api/login';
|
||||
import api from '@/pages/index/api/gxzx/index.js';
|
||||
|
||||
export default {
|
||||
@ -56,6 +56,17 @@ export default {
|
||||
return {
|
||||
curPage: "home",
|
||||
loginFlag: false, //是否已完成登录
|
||||
// 路由路径到菜单名的映射
|
||||
routeToMenuMap: {
|
||||
'/home': 'home',
|
||||
'/fwsc': 'fwsc',
|
||||
'/tfwsc': 'fwsc',
|
||||
'/txqsc': 'fwsc',
|
||||
'/tjrsc': 'fwsc',
|
||||
'/tsjsc': 'fwsc',
|
||||
'/yhzx': 'yhzx',
|
||||
'/login': 'login',
|
||||
},
|
||||
|
||||
menuOptions: [
|
||||
{
|
||||
@ -133,6 +144,7 @@ export default {
|
||||
value: 'tfwsc',
|
||||
content: '碳服务市场',
|
||||
divider: true,
|
||||
parentName: 'fwsc',
|
||||
},
|
||||
{
|
||||
name: 'tjrsc',
|
||||
@ -140,12 +152,14 @@ export default {
|
||||
value: 'tjrsc',
|
||||
content: '碳金融市场',
|
||||
divider: true,
|
||||
parentName: 'fwsc',
|
||||
}, {
|
||||
name: 'txqsc',
|
||||
title: '碳需求市场',
|
||||
value: 'txqsc',
|
||||
content: '碳需求市场',
|
||||
divider: true,
|
||||
parentName: 'fwsc',
|
||||
},
|
||||
{
|
||||
name: 'tsjsc',
|
||||
@ -153,6 +167,7 @@ export default {
|
||||
value: 'tsjsc',
|
||||
content: '碳数据市场',
|
||||
divider: true,
|
||||
parentName: 'fwsc',
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -197,11 +212,49 @@ export default {
|
||||
} else {
|
||||
this.loginFlag = false;
|
||||
}
|
||||
|
||||
// 根据当前路由更新选中状态
|
||||
this.updateCurPageByRoute();
|
||||
},
|
||||
watch: {
|
||||
// 监听路由变化，更新菜单选中状态
|
||||
$route: {
|
||||
handler(newRoute) {
|
||||
this.updateCurPageByRoute();
|
||||
},
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
beforeUnmount() { },
|
||||
methods: {
|
||||
// 根据当前路由更新菜单选中状态
|
||||
updateCurPageByRoute() {
|
||||
const path = this.$route.path;
|
||||
const routeName = this.$route.name;
|
||||
|
||||
// 优先精确匹配路径
|
||||
if (this.routeToMenuMap[path]) {
|
||||
this.curPage = this.routeToMenuMap[path];
|
||||
return;
|
||||
}
|
||||
|
||||
// 尝试从路径中提取关键部分进行匹配
|
||||
if (path.includes('tfwsc') || path.includes('txqsc') || path.includes('tjrsc') || path.includes('tsjsc')) {
|
||||
this.curPage = 'fwsc';
|
||||
return;
|
||||
}
|
||||
|
||||
// 如果都匹配不到，默认选中首页
|
||||
this.curPage = 'home';
|
||||
},
|
||||
//子菜单点击方法
|
||||
handleDropdownClick(menu) {
|
||||
// 如果有parentName，说明是子菜单，使用父级菜单名作为curPage
|
||||
if (menu.parentName) {
|
||||
this.curPage = menu.parentName;
|
||||
} else {
|
||||
this.curPage = menu.name;
|
||||
}
|
||||
this.gotoIfreamPage(menu); // 直接把子菜单项传入跳转方法
|
||||
},
|
||||
|
||||
@ -231,7 +284,8 @@ export default {
|
||||
this.curPage = menu.name;
|
||||
let iframeUrl = menu.iframeUrl;
|
||||
if (iframeUrl) {
|
||||
//调用login.js内的authorize方法
|
||||
//调用login.js内的authorize方法（如果需要的话）
|
||||
//这里直接使用iframeUrl，外部系统会通过SSO Cookie等方式处理登录状态
|
||||
this.$emit('gotoIfreamPage', iframeUrl);
|
||||
} else {
|
||||
this.$emit('gotoPage', this.curPage);
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user