增加文章点赞和分享功能

This commit is contained in:
2025-05-20 11:28:29 +08:00
parent 16d2fe4520
commit 40caef19dd
5 changed files with 391 additions and 209 deletions
+88 -55
View File
@@ -18,7 +18,8 @@
<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>
<span class="program-downloads"><i class="fa-solid fa-download"></i> <span id="programDownloads"></span>
下载</span>
</div>
</div>
@@ -44,12 +45,16 @@
</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">
<div class="action-item share-btn" id="shareBtn">
<i class="fa fa-share-alt"></i>
<span class="action-text">分享</span>
</div>
@@ -203,7 +208,7 @@
margin: 30px 0;
}
.program-navigation a{
.program-navigation a {
color: #333;
text-decoration: none;
}
@@ -363,25 +368,25 @@
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) {
@@ -393,7 +398,7 @@
} else {
prevProgram.innerHTML = '<span class="disabled"><i class="fa fa-arrow-left"></i> 没有上一个了</span>';
}
// 渲染下一个程序
const nextProgram = document.getElementById('nextProgram');
if (data.nextProgram) {
@@ -405,7 +410,7 @@
} 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) {
@@ -428,7 +433,7 @@
}
// 页面加载完成后执行
document.addEventListener('DOMContentLoaded', function() {
document.addEventListener('DOMContentLoaded', function () {
// 获取程序ID
const programId = new URLSearchParams(window.location.search).get('id');
if (!programId) {
@@ -442,61 +447,63 @@
'X-Requested-With': 'XMLHttpRequest'
}
})
.then(response => response.json())
.then(result => {
if (result.code === 1) {
renderProgramDetail(result.data);
// 更新访问次数
updateProgramViews(programId);
} else {
alert(result.msg || '获取程序详情失败');
}
})
.catch(error => {
console.error('获取程序详情失败:', error);
alert('获取程序详情失败,请检查网络连接或刷新页面重试');
});
.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() {
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('下载请求失败,请稍后重试');
});
.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() {
window.addEventListener('scroll', function () {
if (window.pageYOffset > 300) {
goToTop.classList.add('show');
} else {
goToTop.classList.remove('show');
}
});
// 点击返回顶部
goToTop.addEventListener('click', function() {
goToTop.addEventListener('click', function () {
window.scrollTo({
top: 0,
behavior: 'smooth'
@@ -516,19 +523,45 @@
id: programId
})
})
.then(response => response.json())
.then(result => {
if (result.code === 1) {
// 更新成功,更新页面上的访问次数显示
const viewsElement = document.getElementById('programViews');
if (viewsElement) {
viewsElement.textContent = result.data.views;
.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);
});
})
.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>
{include file="component/foot" /}