增加友链功能

This commit is contained in:
2026-03-11 23:44:55 +08:00
parent e46a4100c7
commit 1f8d876cef
9 changed files with 503 additions and 83 deletions
+91 -8
View File
@@ -122,7 +122,7 @@ function stripHtml($html) {
<link rel="stylesheet" href="assets/css/lindy-uikit.css" />
<link rel="stylesheet" href="assets/css/all.min.css" />
<!-- Swiper CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" />
<link rel="stylesheet" href="assets/css/swiper-bundle.min.css" />
</head>
<body>
@@ -172,7 +172,7 @@ function stripHtml($html) {
<a class="page-scroll active" href="#home">主页</a>
</li>
<li class="nav-item">
<a class="page-scroll" href="#feature">文章中心</a>
<a class="page-scroll" href="#feature">新闻中心</a>
</li>
<li class="nav-item">
<a class="page-scroll" href="#about">关于我们</a>
@@ -207,7 +207,7 @@ function stripHtml($html) {
<div class="row justify-content-center">
<div class="col-xxl-5 col-xl-5 col-lg-7 col-md-8">
<div class="section-title text-center mb-60">
<h3 class="mb-15 wow fadeInUp" data-wow-delay=".2s">文章中心</h3>
<h3 class="mb-15 wow fadeInUp" data-wow-delay=".2s">新闻中心</h3>
</div>
</div>
</div>
@@ -257,8 +257,8 @@ function stripHtml($html) {
<div class="row align-items-center">
<div class="col-xl-5 col-lg-6">
<div class="section-title mb-60">
<h3 class="mb-15 wow fadeInUp" data-wow-delay=".2s">Pricing Plan</h3>
<p class="wow fadeInUp" data-wow-delay=".4s">Stop wasting time and money designing and managing a website that doesnt get results. Happiness guaranteed!Stop wasting time and money designing and managing a website that doesnt get results. Happiness guaranteed!</p>
<h3 class="mb-15 wow fadeInUp" data-wow-delay=".2s">特色业务</h3>
<p class="wow fadeInUp" data-wow-delay=".4s">我们始终以专业、高效、创新为核心,深耕行业多年,形成了独具优势的特色业务体系。凭借成熟的服务流程、过硬的技术实力与丰富的实战经验,为客户提供一站式、定制化解决方案。</p>
</div>
</div>
<div class="col-xl-7 col-lg-6">
@@ -470,15 +470,19 @@ function stripHtml($html) {
</div>
</div>
</section>
<!-- 友情链接 -->
<section class="clients-logo-section pt-100 pb-100">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="client-logo wow fadeInUp" data-wow-delay=".2s">
<img src="assets/img/clients/brands.svg" alt="" class="w-100">
<div class="section-title text-center mb-50">
<h3 class="wow fadeInUp" data-wow-delay=".2s">友情链接</h3>
</div>
</div>
</div>
<div class="row" id="friendlink-container">
<!-- 友情链接将通过 JavaScript 动态加载 -->
</div>
</div>
</section>
<footer class="footer footer-style-4">
@@ -554,7 +558,7 @@ function stripHtml($html) {
<script src="assets/js/main.js"></script>
<script src="assets/js/all.min.js"></script>
<!-- Swiper JS -->
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
<script src="assets/js/swiper-bundle.min.js"></script>
<!-- 加载新闻数据 -->
<script>
@@ -656,11 +660,51 @@ function stripHtml($html) {
return API_BASE_URL + (imagePath.startsWith('/') ? imagePath : '/' + imagePath);
}
// 加载友情链接
function loadFriendlinks() {
const container = document.getElementById('friendlink-container');
if (!container) return;
fetch(API_BASE_URL + '/friendlinks')
.then(res => res.json())
.then(result => {
if (result.code !== 200 || !result.data || result.data.length === 0) {
container.innerHTML = '<div class="col-12 text-center"><p>暂无友情链接</p></div>';
return;
}
let html = '';
result.data.forEach((item) => {
const logoUrl = item.link_logo ? (item.link_logo.startsWith('http') ? item.link_logo : API_BASE_URL + item.link_logo) : '';
const linkName = item.link_name || '';
const linkUrl = item.link_url || '#';
const description = item.description || '';
html += '<div class="col-lg-3 col-md-4 col-sm-6 mb-4">' +
'<a href="' + linkUrl + '" target="_blank" class="friendlink-item" title="' + description + '">' +
'<div class="friendlink-card">' +
(logoUrl ? '<img src="' + logoUrl + '" alt="' + linkName + '" class="friendlink-logo">' : '<div class="friendlink-name">' + linkName + '</div>') +
'</div>' +
'</a>' +
'</div>';
});
container.innerHTML = html;
})
.catch(err => {
console.error('加载友情链接失败:', err);
container.innerHTML = '<div class="col-12 text-center"><p>加载失败</p></div>';
});
}
// 页面加载完成后执行
document.addEventListener('DOMContentLoaded', function() {
// 加载 Banner 轮播图
loadBanners();
// 加载友情链接
loadFriendlinks();
// 加载新闻数据
const container = document.getElementById('news-container');
if (!container) return;
@@ -764,6 +808,45 @@ function stripHtml($html) {
background: #fff;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
}
/* 友情链接样式 */
.friendlink-item {
display: block;
text-decoration: none;
}
.friendlink-card {
background: #fff;
border-radius: 8px;
padding: 15px;
height: 150px;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease;
overflow: hidden;
}
.friendlink-card:hover {
border-color: #5864FF;
box-shadow: 0 4px 12px rgba(88, 100, 255, 0.15);
transform: translateY(-2px);
}
.friendlink-logo {
max-width: 100%;
max-height: 120px;
width: auto;
height: auto;
object-fit: contain;
}
.friendlink-name {
font-size: 16px;
font-weight: 600;
color: #333;
text-align: center;
}
</style>
<!-- 新闻卡片样式 -->