499 lines
		
	
	
		
			21 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
			
		
		
	
	
			499 lines
		
	
	
		
			21 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
| <?php /*a:4:{s:49:"E:\Demo\PHP\yunzer\app\index\view\index\index.php";i:1746890051;s:54:"E:\Demo\PHP\yunzer\app\index\view\component\header.php";i:1746796639;s:52:"E:\Demo\PHP\yunzer\app\index\view\component\main.php";i:1747316984;s:54:"E:\Demo\PHP\yunzer\app\index\view\component\footer.php";i:1746796639;}*/ ?>
 | |
| <!DOCTYPE html>
 | |
| <html>
 | |
| 
 | |
| <head>
 | |
|     <meta charset="utf-8">
 | |
|     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 | |
|     <title><?php echo htmlentities((string) $config['admin_name']); ?></title>
 | |
|     <link rel="stylesheet" href="/static/layui/css/layui.css">
 | |
|     <link rel="stylesheet" href="/static/css/style.css">
 | |
|     <link rel="stylesheet" href="/static/css/bootstrap.min.css">
 | |
|     <link rel="stylesheet" href="/static/css/fontawesome.css">
 | |
| 
 | |
|     <script src="/static/layui/layui.js" charset="utf-8"></script>
 | |
|     <script src="/static/js/bootstrap.bundle.js"></script>
 | |
| </head>
 | |
| 
 | |
| <body>
 | |
|     <div style="display: flex;flex-direction: column;">
 | |
|     <div class="topbar-one">
 | |
|         <div class="container">
 | |
|             <div style="width: 70%;">
 | |
|                 <ul class="list-unstyled topbar-one__info">
 | |
|                     <li class="topbar-one__info__item"><span class="topbar-one__info__icon fas fa-phone-alt"></span><a
 | |
|                             href="tel:629-555-0129">(629) 555-0129</a></li>
 | |
|                     <li class="topbar-one__info__item"><span class="topbar-one__info__icon fas fa-envelope"></span><a
 | |
|                             href="mailto:info@example.com">info@example.com</a></li>
 | |
|                 </ul>
 | |
|             </div>
 | |
|             <div class="topbar-one__social" style="width: 30%;">
 | |
|                 <a href="https://facebook.com"><i class="fab fa-facebook-f"></i></a>
 | |
|                 <a href="https://twitter.com"><i class="fab fa-twitter"></i></a>
 | |
|                 <a href="https://instagram.com"><i class="fab fa-instagram"></i></a>
 | |
|                 <a href="https://www.youtube.com/"><i class="fab fa-linkedin"></i></a>
 | |
|             </div>
 | |
|         </div>
 | |
|     </div>
 | |
|     <!-- 导航栏 -->
 | |
|     <div class="main-menu">
 | |
|         <div class="container">
 | |
|             <div class="main-menu__logo">
 | |
|                 <a href="index.html"><img src="/static/images/logo.png" width="186" alt="Logo"></a>
 | |
|             </div>
 | |
|             <div class="main-menu__nav">
 | |
|                 <ul class="main-menu__list">
 | |
|                     <li><a href="index.html">首页</a></li>
 | |
|                     <li><a href="about.html">关于我们</a></li>
 | |
|                     <li><a href="products.html">产品服务</a></li>
 | |
|                     <li><a href="contact.html">联系我们</a></li>
 | |
|                 </ul>
 | |
|             </div>
 | |
|             <div class="main-menu__right">
 | |
|                 <a href="#" class="main-menu__search"><i class="layui-icon layui-icon-search"></i></a>
 | |
|                 <a href="login.html" class="main-menu__login"><i class="layui-icon layui-icon-username"></i></a>
 | |
|             </div>
 | |
|         </div>
 | |
|     </div>
 | |
|     <div class="main-header">
 | |
|         <!-- Banner轮播 -->
 | |
|         <div class="layui-carousel" id="test10" lay-filter="test10">
 | |
|             <div carousel-item="">
 | |
|                 <div>
 | |
|                     <div class="banner-content">
 | |
|                         <span class="banner-title">智能科技 引领未来</span>
 | |
|                         <span class="banner-desc">打造智能化解决方案,助力企业数字化转型,打造智能化解决方案,助力企业数字化转型,打造智能化解决方案,助力企业数字化转型</span>
 | |
|                         <a href="#" class="btn btn-primary" style="margin-top: 20px;width:150px">了解更多</a>
 | |
|                     </div>
 | |
|                     <a href="#" class="banner-slide">
 | |
|                         <img src="/static/images/banner/banner1.jpg" alt="Banner 1">
 | |
|                     </a>
 | |
|                 </div>
 | |
|                 <div>
 | |
|                     <div class="banner-content">
 | |
|                         <span class="banner-title">创新技术 卓越服务</span>
 | |
|                         <spanp class="banner-desc">以创新科技为核心,为客户提供优质服务</spanp>
 | |
|                     </div>
 | |
|                     <a href="#" class="banner-slide">
 | |
|                         <img src="/static/images/banner/banner2.jpg" alt="Banner 2">
 | |
|                     </a>
 | |
|                 </div>
 | |
|                 <div>
 | |
|                     <div class="banner-content">
 | |
|                         <span class="banner-title">专业团队 值得信赖</span>
 | |
|                         <spanp class="banner-desc">资深专家团队,为您提供专业的技术支持</spanp>
 | |
|                     </div>
 | |
|                     <a href="#" class="banner-slide">
 | |
|                         <img src="/static/images/banner/banner3.jpg" alt="Banner 3">
 | |
|                     </a>
 | |
|                 </div>
 | |
|                 <div>
 | |
|                     <div class="banner-content">
 | |
|                         <span class="banner-title">全球视野 本地服务</span>
 | |
|                         <span class="banner-desc">立足本地,放眼全球,打造国际化服务</span>
 | |
|                     </div>
 | |
|                     <a href="#" class="banner-slide">
 | |
|                         <img src="/static/images/banner/banner4.jpg" alt="Banner 4">
 | |
|                     </a>
 | |
|                 </div>
 | |
|             </div>
 | |
|         </div>
 | |
|     </div>
 | |
| </div>
 | |
| 
 | |
| <!-- 固定导航 -->
 | |
| <div class="sticky-nav" style="display: none;">
 | |
|     <div class="container">
 | |
|         <div class="sticky-nav__logo">
 | |
|             <a href="index.html"><img src="/static/images/logo.png" width="150" alt="Logo"></a>
 | |
|         </div>
 | |
|         <div class="sticky-nav__menu">
 | |
|             <ul>
 | |
|                 <li><a href="index.html">首页</a></li>
 | |
|                 <li><a href="about.html">关于我们</a></li>
 | |
|                 <li><a href="products.html">产品服务</a></li>
 | |
|                 <li><a href="contact.html">联系我们</a></li>
 | |
|             </ul>
 | |
|         </div>
 | |
|         <div class="sticky-nav__right">
 | |
|             <a href="#" class="main-menu__search"><i class="layui-icon layui-icon-search"></i></a>
 | |
|             <a href="login.html" class="main-menu__login"><i class="layui-icon layui-icon-username"></i></a>
 | |
|         </div>
 | |
|     </div>
 | |
| </div>
 | |
| 
 | |
| <script>
 | |
| layui.use(['carousel', 'form'], function(){
 | |
|   var carousel = layui.carousel
 | |
|   ,form = layui.form;
 | |
|   
 | |
|   //图片轮播
 | |
|   carousel.render({
 | |
|     elem: '#test10'
 | |
|     ,width: '100%'
 | |
|     ,height: '86vh'
 | |
|     ,interval: 4000
 | |
|   });
 | |
|   
 | |
|   var $ = layui.$, active = {
 | |
|     set: function(othis){
 | |
|       var THIS = 'layui-bg-normal'
 | |
|       ,key = othis.data('key')
 | |
|       ,options = {};
 | |
|       
 | |
|       othis.css('background-color', '#5FB878').siblings().removeAttr('style'); 
 | |
|       options[key] = othis.data('value');
 | |
|       ins3.reload(options);
 | |
|     }
 | |
|   };
 | |
|   
 | |
|   //监听开关
 | |
|   form.on('switch(autoplay)', function(){
 | |
|     ins3.reload({
 | |
|       autoplay: this.checked
 | |
|     });
 | |
|   });
 | |
|   
 | |
|   $('.demoSet').on('keyup', function(){
 | |
|     var value = this.value
 | |
|     ,options = {};
 | |
|     if(!/^\d+$/.test(value)) return;
 | |
|     
 | |
|     options[this.name] = value;
 | |
|     ins3.reload(options);
 | |
|   });
 | |
|   
 | |
|   // 监听滚动事件
 | |
|   $(window).scroll(function() {
 | |
|     var scrollTop = $(window).scrollTop();
 | |
|     if (scrollTop > 150) { // 当滚动超过150px时显示固定导航
 | |
|       $('.sticky-nav').fadeIn();
 | |
|     } else {
 | |
|       $('.sticky-nav').fadeOut();
 | |
|     }
 | |
|   });
 | |
| });
 | |
| </script>
 | |
| 
 | |
|     <main class="main-content">
 | |
|     <div class="container">
 | |
|         <!-- 站点资讯模块 -->
 | |
|         <div class="core-block core-module" id="opencourse" style="order: 3;">
 | |
|             <div class="module-header">
 | |
|                 <div>
 | |
|                     <div class="ModuleTitle_titleWrapper">
 | |
|                         <h3 class="ModuleTitle_title">站点资讯</h3>
 | |
|                         <div class="tab-container">
 | |
|                             <div class="tab-header">
 | |
|                                 <div class="tab-item active" data-tab="all">全部</div>
 | |
|                                 <!-- 分类标签将通过JavaScript动态加载 -->
 | |
|                             </div>
 | |
|                         </div>
 | |
|                     </div>
 | |
|                 </div>
 | |
|                 <div class="more-btn">更多</div>
 | |
|             </div>
 | |
|             <div class="product-list" id="webArticlesList">
 | |
|                 <!-- 文章将通过JavaScript动态加载 -->
 | |
|             </div>
 | |
|         </div>
 | |
| 
 | |
|         <!-- 技术文章模块 -->
 | |
|         <div class="core-block core-module" id="techArticles" style="order: 3;">
 | |
|             <div class="module-header">
 | |
|                 <div>
 | |
|                     <div class="ModuleTitle_titleWrapper">
 | |
|                         <h3 class="ModuleTitle_title">技术文章11</h3>
 | |
|                         <div class="tab-container">
 | |
|                             <div class="tab-header">
 | |
|                                 <div class="tab-item active" data-tab="all">全部</div>
 | |
|                                 <!-- 分类标签将通过JavaScript动态加载 -->
 | |
|                             </div>
 | |
|                         </div>
 | |
|                     </div>
 | |
|                 </div>
 | |
|                 <div class="more-btn">更多</div>
 | |
|             </div>
 | |
|             <div class="product-list" id="techArticlesList">
 | |
|                 <!-- 文章将通过JavaScript动态加载 -->
 | |
|             </div>
 | |
|         </div>
 | |
| 
 | |
|     </div>
 | |
| </main>
 | |
| 
 | |
| <script>
 | |
|     // 加载站点新闻
 | |
|     function loadWebArticles() {
 | |
|         fetch('/index/index/siteNewslist')
 | |
|             .then(response => response.json())
 | |
|             .then(result => {
 | |
|                 if (result.code === 1) {
 | |
|                     // 渲染分类标签
 | |
|                     if (result.categories) {
 | |
|                         renderCategoryTabs(result.categories, 'opencourse');
 | |
|                     }
 | |
|                     // 渲染文章列表
 | |
|                     if (result.articles && result.articles.length > 0) {
 | |
|                         // 只取最新的4条
 | |
|                         renderWebArticles(result.articles.slice(0, 4), 'webArticlesList');
 | |
|                     } else {
 | |
|                         showNoData('webArticlesList');
 | |
|                     }
 | |
|                 } else {
 | |
|                     showNoData('webArticlesList');
 | |
|                 }
 | |
|             })
 | |
|             .catch(error => {
 | |
|                 console.error('请求失败:', error);
 | |
|                 showError('webArticlesList');
 | |
|             });
 | |
|     }
 | |
| 
 | |
|     // 加载技术文章
 | |
|     function loadTechArticles() {
 | |
|         fetch('/index/index/technicalArticleslist')
 | |
|             .then(response => response.json())
 | |
|             .then(result => {
 | |
|                 if (result.code === 1) {
 | |
|                     // 渲染分类标签
 | |
|                     if (result.categories) {
 | |
|                         renderCategoryTabs(result.categories, 'techArticles');
 | |
|                     }
 | |
|                     // 渲染文章列表
 | |
|                     if (result.articles && Object.keys(result.articles).length > 0) {
 | |
|                         // 合并所有分类的文章
 | |
|                         let allArticles = [];
 | |
|                         Object.values(result.articles).forEach(arr => {
 | |
|                             allArticles = allArticles.concat(arr);
 | |
|                         });
 | |
|                         // 按发布时间排序(降序)
 | |
|                         allArticles.sort((a, b) => b.publishdate - a.publishdate);
 | |
|                         // 只取最新的12条
 | |
|                         allArticles = allArticles.slice(0, 12);
 | |
|                         renderWebArticles(allArticles, 'techArticlesList');
 | |
|                     } else {
 | |
|                         showNoData('techArticlesList');
 | |
|                     }
 | |
|                 } else {
 | |
|                     showNoData('techArticlesList');
 | |
|                 }
 | |
|             })
 | |
|             .catch(error => {
 | |
|                 console.error('请求失败:', error);
 | |
|                 showError('techArticlesList');
 | |
|             });
 | |
|     }
 | |
| 
 | |
|     // 显示无数据提示
 | |
|     function showNoData(containerId) {
 | |
|         document.getElementById(containerId).innerHTML = '<div class="no-data">暂无数据</div>';
 | |
|     }
 | |
| 
 | |
|     // 显示错误提示
 | |
|     function showError(containerId) {
 | |
|         document.getElementById(containerId).innerHTML = '<div class="error-message">网络请求失败</div>';
 | |
|     }
 | |
| 
 | |
|     // 渲染分类标签
 | |
|     function renderCategoryTabs(categories, moduleId) {
 | |
|         const tabHeader = document.querySelector(`#${moduleId} .tab-header`);
 | |
|         if (!tabHeader) return;
 | |
| 
 | |
|         // 保留"全部"标签
 | |
|         const allTab = tabHeader.querySelector('.tab-item[data-tab="all"]');
 | |
|         tabHeader.innerHTML = '';
 | |
|         tabHeader.appendChild(allTab);
 | |
| 
 | |
|         // 添加分类标签
 | |
|         if (Array.isArray(categories)) {
 | |
|             categories.forEach(category => {
 | |
|                 const tabItem = document.createElement('div');
 | |
|                 tabItem.className = 'tab-item';
 | |
|                 tabItem.setAttribute('data-tab', category.id);
 | |
|                 tabItem.textContent = category.name;
 | |
|                 tabHeader.appendChild(tabItem);
 | |
|             });
 | |
|         }
 | |
| 
 | |
|         // 重新绑定点击事件
 | |
|         bindTabEvents(moduleId);
 | |
|     }
 | |
| 
 | |
|     // 绑定标签点击事件
 | |
|     function bindTabEvents(moduleId) {
 | |
|         const tabItems = document.querySelectorAll(`#${moduleId} .tab-item`);
 | |
|         tabItems.forEach(tab => {
 | |
|             tab.addEventListener('click', function() {
 | |
|                 // 移除所有active类
 | |
|                 tabItems.forEach(item => item.classList.remove('active'));
 | |
|                 // 添加active类到当前点击的tab
 | |
|                 this.classList.add('active');
 | |
|                 
 | |
|                 // 获取选中的分类ID
 | |
|                 const selectedCategoryId = this.getAttribute('data-tab');
 | |
|                 
 | |
|                 // 重新加载对应分类的文章
 | |
|                 if (moduleId === 'opencourse') {
 | |
|                     loadCategoryArticles(selectedCategoryId, 'webArticlesList');
 | |
|                 } else {
 | |
|                     loadCategoryArticles(selectedCategoryId, 'techArticlesList');
 | |
|                 }
 | |
|             });
 | |
|         });
 | |
|     }
 | |
| 
 | |
|     // 加载分类文章
 | |
|     function loadCategoryArticles(categoryId, containerId) {
 | |
|         const url = containerId === 'webArticlesList' ? '/index/index/siteNewslist' : '/index/index/technicalArticleslist';
 | |
|         fetch(url)
 | |
|             .then(response => response.json())
 | |
|             .then(result => {
 | |
|                 if (result.code === 1) {
 | |
|                     if (containerId === 'techArticlesList') {
 | |
|                         if (categoryId === 'all') {
 | |
|                             // 合并所有分类的文章
 | |
|                             let allArticles = [];
 | |
|                             if (typeof result.articles === 'object') {
 | |
|                                 Object.values(result.articles).forEach(arr => {
 | |
|                                     allArticles = allArticles.concat(arr);
 | |
|                                 });
 | |
|                             }
 | |
|                             // 按发布时间排序(降序)
 | |
|                             allArticles.sort((a, b) => b.publishdate - a.publishdate);
 | |
|                             // 只取最新的12条
 | |
|                             allArticles = allArticles.slice(0, 12);
 | |
|                             renderWebArticles(allArticles, containerId);
 | |
|                         } else {
 | |
|                             // 只显示选中分类的文章
 | |
|                             let filteredArticles = [];
 | |
|                             if (typeof result.articles === 'object' && result.articles[categoryId]) {
 | |
|                                 filteredArticles = result.articles[categoryId];
 | |
|                             }
 | |
|                             renderWebArticles(filteredArticles, containerId);
 | |
|                         }
 | |
|                     } else {
 | |
|                         // 站点资讯部分逻辑不变
 | |
|                         if (categoryId === 'all') {
 | |
|                             renderWebArticles(result.articles.slice(0, 4), containerId);
 | |
|                         } else {
 | |
|                             const filteredArticles = result.articles.filter(article => article.cate == categoryId);
 | |
|                             renderWebArticles(filteredArticles, containerId);
 | |
|                         }
 | |
|                     }
 | |
|                 } else {
 | |
|                     showNoData(containerId);
 | |
|                 }
 | |
|             })
 | |
|             .catch(error => {
 | |
|                 console.error('请求失败:', error);
 | |
|                 showError(containerId);
 | |
|             });
 | |
|     }
 | |
| 
 | |
|     // 渲染文章列表
 | |
|     function renderWebArticles(articles, containerId) {
 | |
|         const container = document.getElementById(containerId);
 | |
|         if (!container) return;
 | |
| 
 | |
|         let html = '';
 | |
|         if (Array.isArray(articles)) {
 | |
|             articles.forEach(article => {
 | |
|                 html += createArticleHtml(article);
 | |
|             });
 | |
|         }
 | |
| 
 | |
|         container.innerHTML = html || '<div class="no-data">暂无数据</div>';
 | |
|     }
 | |
| 
 | |
|     // 创建文章HTML
 | |
|     function createArticleHtml(article) {
 | |
|         if (!article) return '';
 | |
|         
 | |
|         // 格式化日期
 | |
|         const publishDate = new Date(article.publishdate * 1000);
 | |
|         const formattedDate = publishDate.toLocaleDateString('zh-CN', {
 | |
|             year: 'numeric',
 | |
|             month: '2-digit',
 | |
|             day: '2-digit'
 | |
|         });
 | |
|         
 | |
|         return `
 | |
|             <div class="opencourse product-item" onclick="window.open('/index/article/detail?id=${article.id || ''}', '_blank')">
 | |
|                 <div class="video">
 | |
|                     <img src="${article.image || ''}" alt="" class="cover">
 | |
|                 </div>
 | |
|                 <div class="introduction">
 | |
|                     <div class="title">${article.title || '无标题'}</div>
 | |
|                     <div class="publishdate">${formattedDate}</div>
 | |
|                 </div>
 | |
|                 <div class="bottom">
 | |
|                     <div class="views"><i class="fa-solid fa-eye"></i><span style="margin-left: 5px;">${article.views || 0}</span></div>
 | |
|                     <div class="author"><i class="fa-regular fa-user"></i><span style="margin-left: 5px;">${article.author || '未知作者'}</span></div>
 | |
|                 </div>
 | |
|             </div>
 | |
|         `;
 | |
|     }
 | |
| 
 | |
|     // 页面加载完成后执行
 | |
|     document.addEventListener('DOMContentLoaded', function() {
 | |
|         loadWebArticles();
 | |
|         loadTechArticles();
 | |
|     });
 | |
| </script>
 | |
|     <footer class="footer" style="background-image: url(/static/images/footer-bg-1.png)">
 | |
|     <div class="container">
 | |
|         <div class="row" style="width: 100%;">
 | |
|             <div class="row-main">
 | |
|                 <div class="mr-20">
 | |
|                     <img src="/static/images/logo-l-w.png" alt="" height="70">
 | |
|                     <p class="text-white-50 my-4 f18" style="width: 400px;">美天智能科技,这里是介绍!</p>
 | |
|                 </div>
 | |
|                 <div style="display: flex; justify-content: space-between;width: 100%;margin-right: 200px;">
 | |
|                     <div>
 | |
|                         <h4 class="text-white f-20 font-weight-normal mb-3">关于我们</h4>
 | |
|                         <ul class="list-unstyled footer-sub-menu">
 | |
|                             <li><a href="#" class="footer-link">概况</a></li>
 | |
|                             <li><a href="#" class="footer-link">资讯</a></li>
 | |
|                             <li><a href="#" class="footer-link">加入我们</a></li>
 | |
|                             <li><a href="#" class="footer-link">联系我们</a></li>
 | |
|                         </ul>
 | |
|                     </div>
 | |
|                     <div>
 | |
|                         <h4 class="text-white f-20 font-weight-normal mb-3">商务合作</h4>
 | |
|                         <ul class="list-unstyled footer-sub-menu">
 | |
|                             <li><a href="#" class="footer-link">商务合作</a></li>
 | |
|                         </ul>
 | |
|                     </div>
 | |
|                     <div>
 | |
|                         <h4 class="text-white f-20 font-weight-normal mb-3">服务支持</h4>
 | |
|                         <ul class="list-unstyled footer-sub-menu">
 | |
|                             <li><a href="#" class="footer-link">常见问答</a></li>
 | |
|                             <li><a href="#" class="footer-link">软件下载</a></li>
 | |
|                             <li><a href="#" class="footer-link">服务政策</a></li>
 | |
|                             <li><a href="#" class="footer-link">投诉建议</a></li>
 | |
|                         </ul>
 | |
|                     </div>
 | |
|                 </div>
 | |
| 
 | |
|                 <div>
 | |
|                     <div class="text-center">
 | |
|                         <img src="/static/images/code.png" alt="微信二维码" class="img-fluid" style="max-width: 150px;">
 | |
|                         <p class="text-white-50 mt-2">微信公众号</p>
 | |
|                     </div>
 | |
|                 </div>
 | |
|             </div>
 | |
|         </div>
 | |
|     </div>
 | |
| </footer>
 | |
| <section class="copyright text-center">
 | |
|     <div class="container wow fadeInUp animated" data-wow-delay="400ms"
 | |
|         style="visibility: visible; animation-delay: 400ms; animation-name: fadeInUp;">
 | |
|         <p class="copyright__text">Copyright <span class="dynamic-year">2025</span> | All Rights By <a
 | |
|                 href="http://www.yunzer.cn">Yunzer</a></p>
 | |
|     </div>
 | |
| </section>
 | |
| 
 | |
| </body>
 | |
| 
 | |
| </html>
 | 
