yumoqing/kboss
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首页更新

Browse Source
This commit is contained in:
hrx 2026-07-02 14:14:04 +08:00
parent 2b76171a1e
commit e4c6feccf1
1 changed files with 181 additions and 175 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

328
f/web-kboss/src/views/homePage/indexLast.vue
View File

@ -7,72 +7,78 @@
</div>
<!-- footer-->
<div class="footer">
<div class="left-box">
<ul class="bigUl">
<li class="bigLi footer-service">
<span class="title">产品服务</span>
<ul class="smallUl footer-service-list">
<div class="footer-main">
<div class="footer-brand-col">
<img
v-if="hasLogoInfo"
:src="footerHomeInfo.logoImg"
alt="logo"
class="footer-brand-logo"
>
</div>
<div class="footer-link-cols">
<div class="footer-link-col">
<h4 class="footer-col-title">产品服务</h4>
<ul class="footer-link-list">
<li
v-for="item in footerProductServices"
:key="item.label"
class="smallLi"
class="footer-link-item"
:class="{ clickable: !!item.path }"
@click="goFooterService(item.path)"
>
{{ item.label }}
</li>
</ul>
</li>
</ul>
<div class="footer-brand">
<img v-if="JSON.stringify(logoInfoNew)!=='{}'"
:src="logoInfoNew.home.logoImg" alt=""
class="img">
<div class="content-main">
<ul class="info">
<li>地址：<span v-if="JSON.stringify(logoInfoNew)!=='{}'">{{ logoInfoNew.home.adress }}</span>
</li>
<li v-if="JSON.stringify(logoInfoNew)!=='{}'"> 邮箱：{{logoInfoNew.home.email}}</li>
<!-- <li v-if="JSON.stringify(logoInfoNew)!=='{}'">电话： <span class="tel">{{logoInfoNew.home.mobile}}</span> -->
<!-- </li> -->
<li>
<!-- <a href="" rel="noreferrer" target="_blank"></a> -->
</li>
</ul>
</div>
</div>
<div v-if="JSON.stringify(logoInfoNew)!=='{}'&&logoInfoNew.home.bannerTitle!=='开元数智'" class="right-box">
<div class="footer-contact-col">
<h4 class="footer-col-title">联系我们</h4>
<ul class="footer-contact-list">
<li>地址：<span>{{ footerHomeInfo.adress }}</span></li>
<li>邮箱：<span>{{ footerHomeInfo.email }}</span></li>
<li>电话：<span>{{ footerHomeInfo.mobile }}</span></li>
</ul>
<div v-if="showFooterQrcode" class="footer-qrcode-row">
<div class="qr-box">
<div class="qr-code">
<img src="./img/img.png" alt="">
</div>
<span class="qr-content">微信客服</span>
</div>
<div class="qr-box">
<div class="qr-code">
<img src="./img/kefu.jpg" style="padding: 0.08rem" alt="">
<img src="./img/kefu.jpg" alt="">
</div>
<span class="qr-content">关注公众号</span>
</div>
<div class="qr-box">
<div class="qr-code">
<img src="./img/img.png" alt="">
</div>
<span class="qr-content">视频号</span>
</div>
</div>
</div>
</div>
</div>
<div class="footer-record">
<span v-if="JSON.stringify(logoInfoNew)!=='{}'"
<span v-if="hasLogoInfo"
class="footer-record__text"><span
class="goStyle"
@click="goOut('https://beian.miit.gov.cn/#/Integrated/index')">
京ICP备{{
logoInfoNew.home.license
footerHomeInfo.license
}}&nbsp;
<span style="padding: 4px;"></span>
</span> &nbsp;&nbsp;{{
logoInfoNew.home.footerTitle
footerHomeInfo.footerTitle
}}&nbsp;{{
logoInfoNew.home.copyright
footerHomeInfo.copyright
}}&nbsp; </span>
<!-- IPC备案号:{{ ICP }} <span style="margin-left: 0.267rem">版权所有 @kaiyuanyun 2023</span>-->
<!-- <img src="../../image/login/policeInsignia/policeInsignia.png" alt=""-->
@ -91,7 +97,6 @@
<script>
import Vue from 'vue'
import TopBox from "@/views/homePage/components/topBox/index.vue";
import {reqNewHomeFestival} from "@/api/newHome";
import {mapGetters, mapState} from "vuex";
export default Vue.extend({
@ -140,6 +145,30 @@ export default Vue.extend({
{ label: '智能体商店', path: '/homePage/agentStore' },
{ label: '供需广场', path: '/ncmatchHome/supplyAndDemandSquare' },
{ label: '文档中心', path: '/homePage/new' },
],
footerAboutUs: [
{ label: '关于我们', path: '/homePage/about' },
{ label: '文件中心', path: '/homePage/new' },
{ label: '联系我们', path: '/homePage/about' },
{ label: '人才招聘', path: '' },
{ label: '云作坊', path: '' },
{ label: '友情链接', path: '' },
],
footerSolutions: [
{ label: '汽车行业', path: '/homePage/solve/hospital' },
{ label: '金融行业', path: '' },
{ label: '政务行业', path: '' },
{ label: '工业行业', path: '' },
{ label: '教育行业', path: '' },
{ label: '医疗行业', path: '' },
{ label: '互联网行业', path: '' },
],
footerSupports: [
{ label: '备案服务', path: '' },
{ label: '服务咨询', path: '' },
{ label: '建议与反馈', path: '/homePage/about' },
{ label: '常见问题', path: '/homePage/new' },
{ label: '帮助中心', path: '/homePage/new' },
]
}
},
@ -160,6 +189,15 @@ export default Vue.extend({
console.log("此时是:", orgType !== '2' && orgType !== '3' && userId !== null)
return orgType !== '2' && orgType !== '3' && userId === null;
},
hasLogoInfo() {
return this.logoInfoNew && JSON.stringify(this.logoInfoNew) !== '{}' && this.logoInfoNew.home
},
footerHomeInfo() {
return this.hasLogoInfo ? this.logoInfoNew.home : {}
},
showFooterQrcode() {
return this.hasLogoInfo && this.footerHomeInfo.bannerTitle !== '开元数智'
},
username() {
return sessionStorage.getItem('username') || '';
},
@ -258,62 +296,122 @@ export default Vue.extend({
}
.footer {
padding: 42px 0 22px;
padding: 38px 0 22px;
width: 100%;
display: flex;
justify-content: center;
flex-wrap: wrap;
background-color: #fff;
background: #f1f3f7;
}
.left-box {
.footer-main {
width: 1400px;
min-height: 180px;
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 0 0 30px;
border-bottom: 1px solid rgba(122, 130, 160, 0.28);
gap: 38px;
padding: 0 0 32px;
border-bottom: 1px solid rgba(122, 130, 160, 0.22);
box-sizing: border-box;
}
.footer-brand {
width: 420px;
display: flex;
flex-direction: column;
.footer-brand-col {
width: 150px;
padding-top: 2px;
}
.img {
width: 168px;
height: 54px;
.footer-brand-logo {
width: 180px;
height: 50px;
object-fit: contain;
object-position: left center;
margin-bottom: 14px;
}
.footer-link-cols {
flex: 1;
display: flex;
justify-content: flex-start;
align-items: flex-start;
gap: 60px;
}
.footer-link-col {
min-width: 110px;
}
.footer-col-title {
margin: 0 0 14px;
color: #202634;
font-size: 16px;
font-weight: 600;
line-height: 1.5;
}
.footer-link-list {
margin: 0;
padding: 0;
list-style: none;
}
.footer-link-item {
margin-bottom: 9px;
color: #5d6477;
font-size: 14px;
line-height: 1.5;
white-space: nowrap;
transition: color .2s ease, transform .2s ease;
}
.footer-link-item:last-child {
margin-bottom: 0;
}
.footer-link-item.clickable {
cursor: pointer;
}
.footer-link-item.clickable:hover {
color: #1b5bff;
transform: translateX(3px);
}
.footer-contact-col {
// width: 360px;
}
.footer-contact-list {
margin: 0;
padding: 0;
list-style: none;
color: #5d6477;
font-size: 14px;
line-height: 1.6;
li {
margin-bottom: 5px;
}
}
.right-box {
min-width: 260px;
.footer-qrcode-row {
margin-top: 14px;
display: flex;
justify-content: center;
align-items: flex-start;
gap: 34px;
gap: 14px;
}
.content-main {
mix-blend-mode: normal;
color: #7A82A0;
font-size: 14px;
line-height: 1.8;
.qr-box {
display: flex;
flex-direction: column;
align-items: center;
}
.qr-code {
width: 112px;
height: 112px;
padding: 6px;
border: 1px solid #edf1f7;
border-radius: 12px;
box-sizing: border-box;
width: 84px;
height: 84px;
padding: 4px;
border: 1px solid #dde3ef;
background: #fff;
box-sizing: border-box;
img {
width: 100%;
@ -323,102 +421,10 @@ export default Vue.extend({
}
.qr-content {
mix-blend-mode: normal;
color: #4b5563;
font-family: PingFang SC, serif;
font-weight: 600;
font-size: 14px;
margin-top: 10px;
}
.qr-box {
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
}
.logo {
background-color: #32abfc;
img {
width: 100%;
height: 100%;
}
}
.bigUl {
margin: 0 80px 0 40px;
width: 260px;
display: flex;
justify-content: flex-start;
padding: 0;
list-style: none;
.bigLi {
margin: 0;
}
height: 100%;
.title {
color: #111827;
font-size: 18px;
margin-top: 8px;
color: #5d6477;
font-size: 13px;
line-height: 1.4;
font-weight: 700;
}
.smallUl {
padding: 0;
list-style: none;
font-size: 15px;
color: #7A82A0;
li {
margin: 10px 0;
}
}
}
.footer-service {
display: flex;
flex-direction: column;
}
.footer-service-list {
margin-top: 16px;
.smallLi {
line-height: 1.5;
white-space: nowrap;
}
}
.info {
font-size: 14px;
color: #7A82A0;
padding: 0;
margin: 0;
list-style: none;
li {
margin: 6px 0;
}
}
.tel {
color: #222F60;
font-size: 20px;
}
.smallLi {
transition: color .2s ease, transform .2s ease;
&:hover {
color: #1b5bff;
cursor: pointer;
transform: translateX(4px);
}
}
.footer-record {
@ -434,8 +440,8 @@ export default Vue.extend({
display: flex;
justify-content: center;
align-items: center;
color: #7A82A0;
font-size: 14px;
color: #7a82a0;
font-size: 13px;
}
.goStyle {