yunzer/runtime/index/temp/402d23cdf323169a38fb26d3649b6ad5.php
2025-05-28 00:41:02 +08:00

1272 lines
42 KiB
PHP
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<?php /*a:5:{s:52:"E:\Demo\PHP\yunzer\app\index\view\program\detail.php";i:1748185543;s:52:"E:\Demo\PHP\yunzer\app\index\view\component\head.php";i:1747649140;s:61:"E:\Demo\PHP\yunzer\app\index\view\component\header-simple.php";i:1748341037;s:54:"E:\Demo\PHP\yunzer\app\index\view\component\footer.php";i:1747649140;s:52:"E:\Demo\PHP\yunzer\app\index\view\component\foot.php";i:1746808046;}*/ ?>
<!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>
<script charset="UTF-8" id="LA_COLLECT" src="//www.yunzer.cn/plugins/js-sdk-pro.min.js"></script>
<script>LA.init({ id: "KoyzaWWEcLvPzkQn", ck: "KoyzaWWEcLvPzkQn", autoTrack: true, prefix: 'event' })</script>
</head>
<body>
<?php
// 获取当前登录状态
$isLoggedIn = false;
$userInfo = [
'is_login' => false,
'name' => '',
'avatar' => '/static/images/avatar.png' // 默认头像
];
// 检查cookie
$userAccount = cookie('user_account');
if ($userAccount) {
$isLoggedIn = true;
$userInfo = [
'is_login' => true,
'name' => cookie('user_name'),
'avatar' => cookie('user_avatar') ? cookie('user_avatar') : '/static/images/avatar.png'
];
}
// 添加一个隐藏的div来存储登录状态
$loginStatus = [
'isLoggedIn' => $isLoggedIn,
'userAccount' => $userAccount ?? ''
];
?>
<!-- 添加一个隐藏的div来存储登录状态 -->
<div id="loginStatus" style="display: none;" data-is-logged-in="<?php echo htmlentities((string) $isLoggedIn); ?>" data-user-account="<?php echo isset($userAccount) ? htmlentities((string) $userAccount) : ''; ?>">
</div>
<div style="display: flex;flex-direction: column;">
<!-- 导航栏 -->
<div class="main-menu">
<div class="container">
<div class="main-menu__logo">
<a href="/index.html"><img src="/static/images/logo1.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">
<div class="username">
<?php if ($userInfo['is_login']): ?>
<span class="username-text"><?php echo htmlentities((string) $userInfo['name']); ?></span>
<?php endif; ?>
</div>
<div class="layui-inline">
<!-- 根据登录状态显示不同的内容 -->
<?php if ($isLoggedIn): ?>
<div class="layui-inline" style="position: relative;margin-left:20px;">
<img src="<?php echo htmlentities((string) $userInfo['avatar']); ?>" class="layui-circle"
style="width: 40px; height: 40px; cursor: pointer;" id="userAvatarSticky">
<div class="user-dropdown" id="userDropdownSticky">
<ul>
<li>
<a href="/index/user/profile"><i
class="layui-icon layui-icon-user"></i><span>个人中心</span></a>
</li>
<li>
<a href="/index/user/settings"><i
class="layui-icon layui-icon-set"></i><span>账号管理</span></a>
</li>
<li>
<a href="javascript:;" class="logout-btn"><i
class="layui-icon layui-icon-logout"></i><span>退出登录</span></a>
</li>
</ul>
</div>
</div>
<?php else: ?>
<div class="layui-inline">
<a href="/index/user/login" class="layui-btn layui-btn-normal">登录</a>
<a href="/index/user/register" class="layui-btn layui-btn-primary">注册</a>
</div>
<?php endif; ?>
</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/logo1.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">
<div class="main-menu__right">
<div class="username">
<?php if ($userInfo['is_login']): ?>
<span class="username-text"><?php echo htmlentities((string) $userInfo['name']); ?></span>
<?php endif; ?>
</div>
<div class="layui-inline">
<!-- 根据登录状态显示不同的内容 -->
<?php if ($isLoggedIn): ?>
<div class="layui-inline" style="position: relative;margin-left:20px;">
<img src="<?php echo htmlentities((string) $userInfo['avatar']); ?>" class="layui-circle"
style="width: 40px; height: 40px; cursor: pointer;" id="userAvatarSticky">
<div class="user-dropdown" id="userDropdownSticky">
<ul>
<li>
<a href="/index/user/profile"><i
class="layui-icon layui-icon-user"></i><span>个人中心</span></a>
</li>
<li>
<a href="/index/user/settings"><i
class="layui-icon layui-icon-set"></i><span>账号管理</span></a>
</li>
<li>
<a href="javascript:;" class="logout-btn"><i
class="layui-icon layui-icon-logout"></i><span>退出登录</span></a>
</li>
</ul>
</div>
</div>
<?php else: ?>
<div class="layui-inline">
<a href="/index/user/login" class="layui-btn layui-btn-normal">登录</a>
<a href="/index/user/register" class="layui-btn layui-btn-primary">注册</a>
</div>
<?php endif; ?>
</div>
</div>
</div>
</div>
</div>
<style>
/* 用户头像样式 */
#userAvatar {
width: 40px;
height: 40px;
cursor: pointer;
transition: all 0.3s ease;
}
#userAvatar:hover {
transform: scale(1.05);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
/* 下拉菜单容器 */
.user-dropdown {
position: absolute;
top: 50px;
right: 0;
width: 160px;
background: #fff;
border-radius: 4px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
opacity: 0;
visibility: hidden;
transform: translateY(-10px);
transition: all 0.3s ease;
z-index: 9999;
}
.user-dropdown.show {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
/* 下拉菜单列表 */
.user-dropdown ul {
margin: 0;
padding: 5px 0;
list-style: none;
}
/* 下拉菜单项 */
.user-dropdown li {
margin: 0;
padding: 0;
}
/* 下拉菜单链接 */
.user-dropdown li a {
display: flex;
align-items: center;
padding: 10px 15px;
color: #333;
text-decoration: none;
transition: all 0.3s ease;
}
/* 下拉菜单图标 */
.user-dropdown li a i {
margin-right: 10px;
font-size: 16px;
color: #666;
}
/* 下拉菜单文字 */
.user-dropdown li a span {
font-size: 14px;
}
/* 下拉菜单悬停效果 */
.user-dropdown li a:hover {
background: #f5f5f5;
color: #1E9FFF;
}
.user-dropdown li a:hover i {
color: #1E9FFF;
}
/* 分隔线 */
.user-dropdown li:not(:last-child) {
border-bottom: 1px solid #f0f0f0;
}
#userDropdownSticky a {
color: #0d6efd !important;
}
/* Banner样式 */
.banner-content {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.banner-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.banner-image img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.banner-text {
position: absolute;
top: 40%;
left: 10%;
z-index: 1;
display: flex;
flex-direction: column;
align-items: flex-start;
color: #fff;
}
.banner-text a {
text-decoration: none;
margin-top: 30px;
}
.banner-title {
font-size: 4em;
font-weight: 600;
margin-bottom: 10px;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}
.banner-desc {
font-size: 2em;
font-weight: 400;
max-width: 800px;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}
.banner-btn {
background: #fff;
color: #000;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
transition: all 0.3s ease;
}
.banner-btn:hover {
background: #000;
color: #fff;
}
.banner-slider {
width: 100%;
height: 86vh;
overflow: hidden;
position: relative;
}
.banner-container {
width: 100%;
height: 100%;
}
.banner-slide {
display: block;
width: 100%;
height: 100%;
}
.banner-slide img {
width: 100%;
height: 100%;
object-fit: cover;
/* 关键:等比缩放并铺满 */
display: block;
}
.layui-carousel {
background: #f8f8f8;
margin: 0;
padding: 0;
}
/* 确保轮播容器和项目的高度正确 */
#test10,
#test10 [carousel-item],
#test10 [carousel-item]>* {
height: 86vh !important;
}
#test10 [carousel-item]>* {
background: none !important;
}
.main-menu__right {
display: flex;
align-items: center;
}
.username {
display: flex;
align-items: center;
}
</style>
<script>
// 在页面加载时立即执行
(function () {
// 检查是否已经刷新过
if (sessionStorage.getItem('has_refreshed') === 'true') {
return;
}
// 检查localStorage中是否有用户账号
var userAccount = localStorage.getItem('user_account');
if (userAccount) {
// 同步到cookie
document.cookie = "user_account=" + userAccount + "; path=/";
// 如果有其他必要的数据也同步到cookie
var userId = localStorage.getItem('user_id');
var userName = localStorage.getItem('user_name');
var userAvatar = localStorage.getItem('user_avatar');
if (userId) document.cookie = "user_id=" + userId + "; path=/";
if (userName) document.cookie = "user_name=" + userName + "; path=/";
if (userAvatar) document.cookie = "user_avatar=" + userAvatar + "; path=/";
// 刷新页面以应用新的cookie并标记已刷新
if (!document.cookie.includes('user_id')) {
sessionStorage.setItem('has_refreshed', 'true');
window.location.reload();
}
}
})();
layui.use(['carousel', 'form', 'layer'], function () {
var carousel = layui.carousel, form = layui.form, layer = layui.layer, $ = layui.$;
// 检查本地存储并自动登录
function checkAutoLogin() {
// 如果已经登录,不再执行自动登录
if ($('#userAvatarMain').length > 0) {
return;
}
// 如果已经尝试过自动登录,不再执行
if (sessionStorage.getItem('auto_login_attempted') === 'true') {
return;
}
// 从localStorage获取用户账号
var userAccount = localStorage.getItem('user_account');
if (userAccount) {
// 标记已尝试自动登录
sessionStorage.setItem('auto_login_attempted', 'true');
// 发送自动登录请求
$.ajax({
url: '/index/user/login',
type: 'POST',
data: {
account: userAccount,
password: atob(localStorage.getItem('user_password'))
},
dataType: 'json',
success: function (res) {
if (res.code === 0) {
// 设置cookie
document.cookie = "user_id=" + res.data.id + "; path=/";
document.cookie = "user_name=" + res.data.name + "; path=/";
document.cookie = "user_avatar=" + res.data.avatar + "; path=/";
document.cookie = "user_account=" + userAccount + "; path=/";
// 同时更新localStorage
localStorage.setItem('user_id', res.data.id);
localStorage.setItem('user_name', res.data.name);
localStorage.setItem('user_avatar', res.data.avatar);
// 登录成功,强制刷新页面
window.location.href = window.location.href + '?t=' + new Date().getTime();
} else {
// 登录失败,清除所有相关存储
localStorage.removeItem('user_account');
localStorage.removeItem('user_password');
sessionStorage.removeItem('auto_login_attempted');
}
}
});
}
}
// 页面加载时检查自动登录
checkAutoLogin();
$(document).ready(function () {
// 主导航头像
$("#userAvatarMain").click(function (e) {
e.stopPropagation();
$("#userDropdownMain").toggleClass("show");
$("#userDropdownSticky").removeClass("show"); // 保证只显示一个
});
// 固定导航头像
$("#userAvatarSticky").click(function (e) {
e.stopPropagation();
$("#userDropdownSticky").toggleClass("show");
$("#userDropdownMain").removeClass("show"); // 保证只显示一个
});
// 点击页面其他地方隐藏所有菜单
$(document).click(function (e) {
if (!$(e.target).closest('.user-dropdown, #userAvatarMain, #userAvatarSticky').length) {
$("#userDropdownMain, #userDropdownSticky").removeClass("show");
}
});
// 点击菜单项时隐藏菜单
$("#userDropdownMain li a, #userDropdownSticky li a").click(function () {
$("#userDropdownMain, #userDropdownSticky").removeClass("show");
});
});
// 退出登录
$('.logout-btn').on('click', function () {
layer.confirm('确定要退出登录吗?', {
btn: ['确定', '取消']
}, function () {
// 先发送退出请求
$.ajax({
url: '/index/user/logout',
type: 'POST',
dataType: 'json',
success: function (res) {
if (res.code === 0) {
// 清除localStorage
localStorage.removeItem('user_account');
localStorage.removeItem('user_password');
localStorage.removeItem('user_id');
localStorage.removeItem('user_name');
localStorage.removeItem('user_avatar');
// 清除sessionStorage
sessionStorage.removeItem('auto_login_attempted');
sessionStorage.removeItem('has_refreshed');
// 清除cookie
document.cookie = "user_id=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
document.cookie = "user_name=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
document.cookie = "user_avatar=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
document.cookie = "user_account=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
document.cookie = "user_password=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
// 强制刷新页面,不使用缓存
window.location.href = window.location.href + '?t=' + new Date().getTime();
}
}
});
});
});
// 监听滚动事件
$(window).scroll(function () {
var scrollTop = $(window).scrollTop();
if (scrollTop > 150) { // 当滚动超过150px时显示固定导航
$('.sticky-nav').fadeIn();
} else {
$('.sticky-nav').fadeOut();
}
});
// 公众号二维码
const trigger = document.querySelector('.qrcode-trigger');
const popup = document.querySelector('.qrcode-popup');
// 鼠标移入显示二维码
trigger.addEventListener('mouseenter', function () {
popup.style.display = 'block';
});
// 鼠标移出隐藏二维码
trigger.addEventListener('mouseleave', function () {
popup.style.display = 'none';
});
// 鼠标移入二维码区域时保持显示
popup.addEventListener('mouseenter', function () {
popup.style.display = 'block';
});
// 鼠标移出二维码区域时隐藏
popup.addEventListener('mouseleave', function () {
popup.style.display = 'none';
});
form.on('submit(accountLogin)', function (data) {
$.ajax({
url: '<?php echo url("index/user/login"); ?>',
type: 'POST',
data: data.field,
dataType: 'json',
success: function (res) {
if (res.code === 0) {
// 存储登录数据设置7天过期
var expireTime = new Date().getTime() + 7 * 24 * 60 * 60 * 1000;
// 设置localStorage
localStorage.setItem('user_account', data.field.account);
localStorage.setItem('user_password', btoa(data.field.password));
localStorage.setItem('expire_time', expireTime);
localStorage.setItem('is_auto_login', 'true');
// 设置cookie
document.cookie = "user_id=" + res.data.id + "; path=/";
document.cookie = "user_name=" + res.data.name + "; path=/";
document.cookie = "user_avatar=" + res.data.avatar + "; path=/";
document.cookie = "expire_time=" + expireTime + "; path=/";
document.cookie = "is_auto_login=true; path=/";
document.cookie = "user_account=" + data.field.account + "; path=/";
document.cookie = "user_password=" + btoa(data.field.password) + "; path=/";
// 设置sessionStorage
sessionStorage.setItem('auto_login_attempted', 'true');
layer.msg('登录成功', {
icon: 1,
time: 2000,
shade: 0.3
}, function () {
// 获取当前页面URL
var currentUrl = window.location.href;
// 如果当前页面是登录页面,则跳转到首页
if (currentUrl.includes('/index/user/login')) {
window.location.href = '/index.html';
} else {
// 否则刷新当前页面
window.location.href = currentUrl + '?t=' + new Date().getTime();
}
});
} else {
layer.msg(res.msg, {
icon: 2,
time: 2000
});
}
}
});
return false;
});
});
</script>
<div class="main">
<div class="location">
<div class="container">
<div class="location-item">
<a href="/">首页</a>
<span>></span>
<a href="/index/program/index" id="cateLink"></a>
</div>
</div>
</div>
<div class="program-detail-container">
<div class="program-header">
<h1 class="program-title" id="programTitle"></h1>
<div class="program-meta">
<span class="program-author"><i class="fa fa-user"></i> <span id="programAuthor"></span></span>
<span class="program-date"><i class="fa fa-calendar"></i> <span id="programDate"></span></span>
<span class="program-views"><i class="fa-solid fa-eye"></i> <span id="programViews"></span></span>
<span class="program-downloads"><i class="fa-solid fa-download"></i> <span id="programDownloads"></span></span>
</div>
</div>
<div class="program-content" id="programContent">
</div>
<div class="program-info">
<div class="info-item">
<span class="info-label">软件大小:</span>
<span id="programSize"></span>
</div>
<div class="info-item">
<span class="info-label">运行环境:</span>
<span id="programEnvironment"></span>
</div>
<div class="info-item">
<span class="info-label">更新时间:</span>
<span id="programUpdateTime"></span>
</div>
<div class="info-item">
<span class="info-label">软件版本:</span>
<span id="programVersion"></span>
</div>
</div>
<div class="program-content">
</div>
<div class="program-actions">
<div class="action-item download-btn" id="downloadBtn">
<i class="fa fa-download"></i>
<span class="action-text">立即下载</span>
</div>
<div class="action-item share-btn" id="shareBtn">
<i class="fa fa-share-alt"></i>
<span class="action-text">分享</span>
</div>
</div>
<div class="disclaimers">
<div class="disclaimer-item">
<div class="disclaimer-title">免责声明:</div>
<div class="disclaimer-content">
<?php echo $config['disclaimers'] ?>
</div>
</div>
</div>
<div class="program-navigation">
<div class="prev-program" id="prevProgram">
</div>
<div class="next-program" id="nextProgram">
</div>
</div>
<div class="related-programs">
<h3 class="related-title">相关推荐</h3>
<div class="related-list" id="relatedPrograms">
</div>
</div>
</div>
</div>
<!-- 返回顶部按钮 -->
<div class="go-to-top" id="goToTop">
<i class="layui-icon layui-icon-top"></i>
</div>
<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="<?php echo htmlentities((string) $config['logo']); ?>" 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="<?php echo htmlentities((string) $config['admin_wechat']); ?>" 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>
<div class="tongji">
<script id="LA-DATA-WIDGET" crossorigin="anonymous" charset="UTF-8"
src="https://v6-widget.51.la/v6/KoyzaWWEcLvPzkQn/quote.js?theme=#1690FF,#FFFFFF,#999999,#FFFFFF,#FFFFFF,#1690FF,12&f=12"></script>
</div>
</section>
<style>
.location {
max-width: 1000px;
margin: 30px auto;
}
.program-detail-container {
max-width: 1000px;
margin: 30px auto;
padding: 50px;
background: #fff;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
border-radius: 8px;
}
.program-header {
margin-bottom: 30px;
border-bottom: 1px solid #eee;
padding-bottom: 20px;
}
.program-title {
font-size: 28px;
font-weight: 700;
color: #333;
margin-bottom: 15px;
line-height: 1.4;
}
.program-meta {
display: flex;
flex-wrap: wrap;
gap: 20px;
color: #666;
font-size: 14px;
}
.program-meta span {
display: flex;
align-items: center;
}
.program-meta i {
margin-right: 5px;
}
.program-content {
line-height: 1.8;
color: #333;
font-size: 16px;
margin-bottom: 30px;
}
.program-info {
background: #f8f9fa;
padding: 20px;
border-radius: 8px;
margin: 20px 0;
}
.info-item {
margin-bottom: 10px;
display: flex;
align-items: center;
}
.info-label {
font-weight: bold;
width: 100px;
color: #666;
}
.program-actions {
display: flex;
justify-content: center;
gap: 40px;
margin: 30px 0;
padding: 20px 0;
border-top: 1px solid #eee;
border-bottom: 1px solid #eee;
}
.action-item {
display: flex;
flex-direction: column;
align-items: center;
cursor: pointer;
padding: 15px 30px;
border-radius: 8px;
transition: all 0.3s ease;
}
.download-btn {
background: #f57005;
color: #fff;
}
.download-btn:hover {
background: #e66600;
transform: translateY(-2px);
}
.share-btn {
background: #f8f9fa;
color: #666;
}
.share-btn:hover {
background: #e9ecef;
}
.action-item i {
font-size: 24px;
margin-bottom: 5px;
}
.action-text {
font-size: 14px;
}
.program-navigation {
display: flex;
justify-content: space-between;
margin: 30px 0;
}
.program-navigation a {
color: #333;
text-decoration: none;
}
.prev-program,
.next-program {
max-width: 45%;
}
.prev-program a,
.next-program a {
color: #333;
text-decoration: none;
}
.prev-program a:hover,
.next-program a:hover {
color: #f57005;
}
.disabled {
color: #999;
}
.related-programs {
margin: 40px 0;
}
.related-title {
font-size: 20px;
font-weight: 600;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #eee;
}
.related-list {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
}
.related-item {
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
transition: transform 0.3s;
}
.related-item:hover {
transform: translateY(-5px);
}
.related-item a {
text-decoration: none;
color: inherit;
}
.related-image img {
width: 100%;
height: 150px;
object-fit: cover;
}
.related-info {
padding: 10px;
}
.related-item-title {
font-size: 16px;
font-weight: 600;
margin-bottom: 5px;
color: #333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.related-item-desc {
font-size: 12px;
color: #666;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.go-to-top {
position: fixed;
right: 30px;
bottom: 30px;
width: 40px;
height: 40px;
background: #f57005;
color: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
z-index: 1000;
}
.go-to-top.show {
opacity: 1;
visibility: visible;
}
.go-to-top:hover {
background: #e66600;
transform: translateY(-3px);
}
@media (max-width: 768px) {
.program-title {
font-size: 24px;
}
.related-list {
grid-template-columns: repeat(1, 1fr);
}
.program-meta {
gap: 10px;
}
.go-to-top {
right: 20px;
bottom: 20px;
width: 36px;
height: 36px;
}
}
.location-item a {
color: #000 !important;
}
.disclaimers {
color: #b1b1b1;
width: 80%;
margin: 20px auto;
margin-bottom: 60px;
}
.disclaimer-title {
font-size: 16px;
font-weight: 600;
margin-bottom: 10px;
}
.disclaimer-content {
font-size: 14px;
line-height: 1.6;
}
.disclaimer-content p {
margin-bottom: 0;
}
</style>
<script>
// 格式化日期
function formatDate(timestamp) {
const date = new Date(timestamp * 1000);
return date.toLocaleDateString('zh-CN', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
});
}
// 渲染程序详情
function renderProgramDetail(data) {
// 渲染分类链接
document.getElementById('cateLink').textContent = data.cateName;
// 渲染程序标题
document.getElementById('programTitle').textContent = data.program.title;
// 渲染程序元信息
document.getElementById('programAuthor').textContent = data.program.author;
document.getElementById('programDate').textContent = formatDate(data.program.create_time);
document.getElementById('programViews').textContent = data.program.views;
document.getElementById('programDownloads').textContent = data.program.downloads;
// 渲染程序内容
document.getElementById('programContent').innerHTML = data.program.content;
// 渲染程序信息
document.getElementById('programSize').textContent = data.program.size || '未知';
document.getElementById('programEnvironment').textContent = data.program.environment || '通用';
document.getElementById('programUpdateTime').textContent = formatDate(data.program.update_time);
document.getElementById('programVersion').textContent = data.program.version || '1.0.0';
// 渲染上一个程序
const prevProgram = document.getElementById('prevProgram');
if (data.prevProgram) {
prevProgram.innerHTML = `
<a href="/index/program/detail?id=${data.prevProgram.id}">
<i class="fa fa-arrow-left"></i> 上一个:${data.prevProgram.title}
</a>
`;
} else {
prevProgram.innerHTML = '<span class="disabled"><i class="fa fa-arrow-left"></i> 没有上一个了</span>';
}
// 渲染下一个程序
const nextProgram = document.getElementById('nextProgram');
if (data.nextProgram) {
nextProgram.innerHTML = `
<a href="/index/program/detail?id=${data.nextProgram.id}">
下一个:${data.nextProgram.title} <i class="fa fa-arrow-right"></i>
</a>
`;
} else {
nextProgram.innerHTML = '<span class="disabled">没有下一个了 <i class="fa fa-arrow-right"></i></span>';
}
// 渲染相关程序
const relatedPrograms = document.getElementById('relatedPrograms');
if (data.relatedPrograms && data.relatedPrograms.length > 0) {
relatedPrograms.innerHTML = data.relatedPrograms.map(program => `
<div class="related-item">
<a href="/index/program/detail?id=${program.id}">
<div class="related-image">
<img src="${program.icon}" alt="${program.title}">
</div>
<div class="related-info">
<div class="related-item-title">${program.title}</div>
<div class="related-item-desc">${program.desc || ''}</div>
</div>
</a>
</div>
`).join('');
} else {
relatedPrograms.innerHTML = '<div class="no-related">暂无相关程序</div>';
}
}
// 页面加载完成后执行
document.addEventListener('DOMContentLoaded', function () {
// 获取程序ID
const programId = new URLSearchParams(window.location.search).get('id');
if (!programId) {
alert('程序ID不存在');
return;
}
// 获取程序详情
fetch(`/index/program/detail?id=${programId}`, {
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(response => response.json())
.then(result => {
if (result.code === 1) {
renderProgramDetail(result.data);
// 更新访问次数
updateProgramViews(programId);
// 初始化分享功能
initShareFunction();
} else {
alert(result.msg || '获取程序详情失败');
}
})
.catch(error => {
console.error('获取程序详情失败:', error);
alert('获取程序详情失败,请检查网络连接或刷新页面重试');
});
// 下载功能
const downloadBtn = document.getElementById('downloadBtn');
if (downloadBtn) {
downloadBtn.addEventListener('click', function () {
fetch('/index/program/download?id=' + programId, {
method: 'POST',
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(response => response.json())
.then(data => {
if (data.code === 1 && data.data && data.data.fileurl) {
const downloadUrl = window.location.origin + data.data.fileurl;
window.location.href = downloadUrl;
} else {
alert('下载地址不存在');
}
})
.catch(error => {
console.error('下载请求失败:', error);
alert('下载请求失败,请稍后重试');
});
});
}
// 返回顶部功能
const goToTop = document.getElementById('goToTop');
// 监听滚动事件
window.addEventListener('scroll', function () {
if (window.pageYOffset > 300) {
goToTop.classList.add('show');
} else {
goToTop.classList.remove('show');
}
});
// 点击返回顶部
goToTop.addEventListener('click', function () {
window.scrollTo({
top: 0,
behavior: 'smooth'
});
});
});
// 更新程序访问次数
function updateProgramViews(programId) {
fetch('/index/program/updateViews', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'X-Requested-With': 'XMLHttpRequest'
},
body: JSON.stringify({
id: programId
})
})
.then(response => response.json())
.then(result => {
if (result.code === 1) {
// 更新成功,更新页面上的访问次数显示
const viewsElement = document.getElementById('programViews');
if (viewsElement) {
viewsElement.textContent = result.data.views;
}
}
})
.catch(error => {
console.error('更新访问次数失败:', error);
});
}
// 初始化分享功能
function initShareFunction() {
const shareBtn = document.getElementById('shareBtn');
if (shareBtn) {
shareBtn.addEventListener('click', function () {
// 获取当前页面URL
const currentUrl = window.location.href;
// 创建临时输入框
const tempInput = document.createElement('input');
tempInput.value = currentUrl;
document.body.appendChild(tempInput);
// 选择并复制文本
tempInput.select();
document.execCommand('copy');
// 移除临时输入框
document.body.removeChild(tempInput);
// 提示用户复制成功
layer.msg('链接已复制到剪贴板');
});
}
}
</script>
</body>
</html>