310 lines
16 KiB
HTML
310 lines
16 KiB
HTML
<!DOCTYPE html>
|
|
<html class="no-js" lang="">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>工业4.0时代的智能制造趋势 - 福安德信息科技有限公司</title>
|
|
<meta name="description" content="探讨工业4.0背景下智能制造的发展趋势和应用案例，分析如何通过数字化转型提升企业竞争力。">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="icon" type="image/x-icon" href="assets/logo/favicon.ico">
|
|
<link rel="apple-touch-icon" href="assets/logo/favicon.ico">
|
|
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
|
|
<link rel="stylesheet" href="assets/css/all.css">
|
|
<link rel="stylesheet" href="assets/css/slick-theme.css">
|
|
<link rel="stylesheet" href="assets/css/slick.css">
|
|
<link rel="stylesheet" href="assets/css/animate.css">
|
|
<link rel="stylesheet" href="assets/css/venobox.css">
|
|
<link rel="stylesheet" href="assets/css/flaticon.css">
|
|
<link rel="stylesheet" href="assets/css/flaticon1.css">
|
|
<link rel="stylesheet" href="assets/css/style.css">
|
|
<link rel="stylesheet" href="assets/css/responsive.css">
|
|
<meta name="theme-color" content="#fafafa">
|
|
</head>
|
|
|
|
<body id="home">
|
|
<div id="loading"><img src="assets/picture/preloader.gif" alt=""></div>
|
|
<header>
|
|
<div class="site-navigation menu-transparent" id="mainmenu-area">
|
|
<nav class="navbar navbar-expand-lg navbar-light navbar-floating">
|
|
<div class="container"><a class="navbar-brand" href="index.html">
|
|
<img src="assets/logo/logo-white.jpg" alt="福安德信息科技" class="img-fluid">
|
|
<span class="ml-2 text-white">福安德信息科技有限公司</span>
|
|
</a><button
|
|
class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarMenu"
|
|
aria-controls="navbarMenu" aria-expanded="false" aria-label="Toggle navigation"><span
|
|
class="navbar-toggler-icon"></span></button>
|
|
<div class="collapse navbar-collapse mainmenu" id="navbarMenu">
|
|
<ul class="navbar-nav mx-auto">
|
|
<li class="nav-item"><a href="index.html" class="nav-link">首页</a></li>
|
|
<li class="nav-item"><a href="about.html" class="nav-link">关于我们</a></li>
|
|
<li class="nav-item"><a href="service.html" class="nav-link">解决方案</a></li>
|
|
<li class="nav-item"><a href="articleList.html" class="nav-link">行业资讯</a></li>
|
|
<li class="nav-item"><a href="portfolio.html" class="nav-link">成功案例</a></li>
|
|
<li class="nav-item"><a href="contact.html" class="nav-link">联系我们</a></li>
|
|
</ul>
|
|
<div class="header-btn d-none d-lg-block"><a href="tel:+8615075462410"
|
|
class="btn btn-radius btn-solid-border text-uppercase">欢迎致电</a></div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
<section class="page-banner pt-60 pb-60">
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-xl-6">
|
|
<div class="page-banner-content text-center">
|
|
<h2>工业4.0时代的智能制造趋势</h2>
|
|
<ul class="list-inline">
|
|
<li class="list-inline-item"><a href="index.html">首页</a></li>
|
|
<li class="list-inline-item"><i class="fa fa-angle-right"></i></li>
|
|
<li class="list-inline-item"><a href="articleList.html">行业资讯</a></li>
|
|
<!-- <li class="list-inline-item"><i class="fa fa-angle-right"></i></li>
|
|
<li class="list-inline-item">工业4.0时代的智能制造趋势</li> -->
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section class="service-2 pt-100 pb-60 section bg-primary-light">
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-xl-8">
|
|
<div class="article-content">
|
|
<div class="article-meta mb-40" id="articleMeta">
|
|
<!-- 文章元信息将通过JavaScript动态渲染 -->
|
|
</div>
|
|
<div class="article-body" id="articleBody">
|
|
<!-- 文章内容将通过JavaScript动态渲染 -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section class="pricing section-padding pb-110 section">
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-xl-8">
|
|
<div class="section-heading text-center mb-60">
|
|
<span class="text-primary text-uppercase mb-10 d-inline-block">相关推荐</span>
|
|
<h2>更多行业资讯</h2>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section class="cta">
|
|
<div class="container">
|
|
<div class="cta-inner section">
|
|
<div class="cta-shape1"></div>
|
|
<div class="cta-shape2"></div>
|
|
<div class="cta-shape3"></div>
|
|
<div class="row align-items-center ">
|
|
<div class="col-xl-8 col-lg-8">
|
|
<div class="section-heading text-center text-lg-left mb-4 mb-lg-0">
|
|
<span class="text-white text-capitalize mb-10 d-inline-block">准备开始合作？</span>
|
|
<h2 class="text-white">联系我们</h2>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-4 col-lg-4">
|
|
<div class="text-center text-lg-right ">
|
|
<a href="contact.html" class="btn btn-main btn-radius text-uppercase">立即咨询</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<footer class="footer footer-2 pt-130">
|
|
<div class="footer-top">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-xl-3 col-md-6 col-sm-6">
|
|
<div class="footer-widget mb-5 mb-xl-0">
|
|
<div class="footer-logo">
|
|
<img src="assets/logo/logo-blue.jpg" alt="福安德信息科技" class="img-fluid">
|
|
</div>
|
|
<p>致力于为企业提供全方位的智能制造与数字化转型解决方案</p>
|
|
<div class="subscribe-form">
|
|
<form action="javascript:;" class="sub-form">
|
|
<input type="text" class="form-control" placeholder="请输入您的邮箱">
|
|
<a href="#"><i class="flaticon flaticon-paper-plane"></i></a>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 col-md-6 col-sm-6">
|
|
<div class="footer-widget mb-5 mb-xl-0 pl-xl-3">
|
|
<h3>快速链接</h3>
|
|
<ul class="list-unstyled">
|
|
<li><a href="about.html">关于我们</a></li>
|
|
<li><a href="service.html">解决方案</a></li>
|
|
<li><a href="portfolio.html">成功案例</a></li>
|
|
<li><a href="contact.html">联系我们</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-2 col-md-6 col-sm-6">
|
|
<div class="footer-widget mb-5 mb-xl-0">
|
|
<h3>支持服务</h3>
|
|
<ul class="list-unstyled">
|
|
<li><a href="contact.html">联系方式</a></li>
|
|
<li><a href="service.html">技术支持</a></li>
|
|
<li><a href="about.html">关于我们</a></li>
|
|
<li><a href="contact.html">在线咨询</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="col-xl-3 col-md-6 col-sm-6 offset-xl-1 col-lg-5">
|
|
<div class="footer-widget mb-5 mb-xl-0">
|
|
<h3>联系方式</h3>
|
|
<ul class="list-unstyled">
|
|
<li><strong>地址：</strong>山东省济宁市济宁经济开发区嘉瑞路与呈祥大道交汇处向北50米电子信息产业园A4号楼</li>
|
|
<li><a href="mailto:1225822242@qq.com"><strong>邮箱：</strong>1225822242@qq.com</a></li>
|
|
<li><a href="tel:15075462410"><strong>电话：</strong>15075462410</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="footer-copyright">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-xl-6 col-sm-6">
|
|
<p class="copyright text-center text-sm-left text-lg-left">Copyright © 2024 福安德信息科技有限公司. 版权所有</p>
|
|
</div>
|
|
<div class="col-xl-6 col-sm-6">
|
|
<div class="footer-socials text-center text-xl-right">
|
|
<a href="#"><i class="flaticon flaticon-weixin"></i></a>
|
|
<a href="#"><i class="flaticon flaticon-weibo"></i></a>
|
|
<a href="#"><i class="flaticon flaticon-linkedin"></i></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
<div class="fixed-btm-top"><a href="#home" class="smoth-scroll scroll-to-top bg-shadow"><i
|
|
class="fa fa-angle-up"></i></a></div>
|
|
<script src="assets/js/jquery-3.5.1.min.js"></script>
|
|
<script src="assets/js/popper.min.js"></script>
|
|
<script src="assets/js/bootstrap.min.js"></script>
|
|
<script src="assets/js/slick.min.js"></script>
|
|
<script src="assets/js/venobox.js"></script>
|
|
<script src="assets/js/tilt.js"></script>
|
|
<script src="assets/js/wow.min.js"></script>
|
|
<script src="assets/js/jquery.waypoints.min.js"></script>
|
|
<script src="assets/js/jquery.counterup.min.js"></script>
|
|
<script src="assets/js/map.js"></script>
|
|
<script src="assets/js/scripts.js"></script>
|
|
<script src="js/http.js"></script>
|
|
<script>
|
|
// 从URL参数中获取文章ID
|
|
function getArticleIdFromUrl() {
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
return urlParams.get('id');
|
|
}
|
|
|
|
// 渲染文章详情
|
|
async function renderArticleDetail() {
|
|
const articleId = getArticleIdFromUrl();
|
|
const articleMeta = document.getElementById('articleMeta');
|
|
const articleBody = document.getElementById('articleBody');
|
|
|
|
// 显示加载状态
|
|
articleMeta.innerHTML = '<div class="text-center py-5"><i class="fas fa-spinner fa-spin fa-2x text-primary"></i></div>';
|
|
articleBody.innerHTML = '<div class="text-center py-5"><i class="fas fa-spinner fa-spin fa-2x text-primary"></i></div>';
|
|
|
|
try {
|
|
// 获取文章详情
|
|
const articleResponse = await getArticleDetail(articleId);
|
|
console.log(articleResponse)
|
|
const article = articleResponse.data;
|
|
|
|
if (!article) {
|
|
articleMeta.innerHTML = '<div class="text-center py-5"><p>文章不存在</p></div>';
|
|
articleBody.innerHTML = '<div class="text-center py-5"><p>文章不存在或已被删除</p></div>';
|
|
return;
|
|
}
|
|
|
|
// 更新页面标题
|
|
document.title = `${article.title} - 福安德信息科技有限公司`;
|
|
|
|
// 更新banner标题
|
|
document.querySelector('.page-banner-content h2').textContent = article.title;
|
|
|
|
// 渲染文章元信息
|
|
articleMeta.innerHTML = `
|
|
<span class="mr-30"><i class="fas fa-calendar-alt"></i> ${article.publishedTime.split(' ')[0]}</span>
|
|
<span class="mr-30"><i class="fas fa-user"></i> 福安德信息科技</span>
|
|
<span><i class="fas fa-tag"></i> 行业资讯</span>
|
|
`;
|
|
|
|
// 渲染文章内容
|
|
articleBody.innerHTML = article.content;
|
|
|
|
// 渲染相关推荐
|
|
await renderRelatedArticles();
|
|
} catch (error) {
|
|
console.error('获取文章详情失败:', error);
|
|
articleMeta.innerHTML = '<div class="text-center py-5"><p>获取文章详情失败</p></div>';
|
|
articleBody.innerHTML = '<div class="text-center py-5"><p>获取文章详情失败，请刷新页面重试</p></div>';
|
|
}
|
|
}
|
|
|
|
// 渲染相关推荐文章
|
|
async function renderRelatedArticles() {
|
|
const relatedContainer = document.querySelector('.pricing .row');
|
|
if (!relatedContainer) {
|
|
console.error('未找到相关推荐容器');
|
|
return;
|
|
}
|
|
relatedContainer.innerHTML = '<div class="col-12 text-center py-5"><i class="fas fa-spinner fa-spin fa-2x text-primary"></i></div>';
|
|
|
|
|
|
try {
|
|
const response = await getArticleList({ pageNum: 1, pageSize: 3, langCode: 'zh' });
|
|
const relatedArticles = response.rows || [];
|
|
|
|
relatedContainer.innerHTML = '';
|
|
|
|
if (relatedArticles.length === 0) {
|
|
relatedContainer.innerHTML = '<div class="col-12 text-center py-5"><p>暂无相关推荐</p></div>';
|
|
return;
|
|
}
|
|
|
|
relatedArticles.forEach((article, index) => {
|
|
const delay = 0.2 + (index % 3) * 0.1;
|
|
const articleItem = document.createElement('div');
|
|
articleItem.className = 'col-xl-4 col-lg-6 col-md-6';
|
|
articleItem.innerHTML = `
|
|
<div class="about-item mb-25 wow slideInUp" data-wow-delay="${delay}s">
|
|
<div class="icon-box"><i class="fas fa-newspaper"></i></div>
|
|
<div class="about-item-content">
|
|
<h4 class="mb-15"><a href="article.html?id=${article.articleId}">${article.title}</a></h4>
|
|
<p>${article.summary || article.content.replace(/<[^>]*>/g, '').substring(0, 100)}...</p>
|
|
<p class="text-muted mt-10">${article.publishedTime.split(' ')[0]}</p>
|
|
</div>
|
|
</div>
|
|
`;
|
|
relatedContainer.appendChild(articleItem);
|
|
});
|
|
} catch (error) {
|
|
console.error('获取相关推荐失败:', error);
|
|
relatedContainer.innerHTML = '<div class="col-12 text-center py-5"><p>获取相关推荐失败</p></div>';
|
|
}
|
|
}
|
|
|
|
// 页面加载完成后渲染文章详情
|
|
window.onload = function() {
|
|
renderArticleDetail();
|
|
};
|
|
</script>
|
|
</body>
|
|
|
|
</html> |