fix: 修复分享到期时间显示的两个问题
问题1: 分享成功提示中到期时间显示为"永久有效" - 修复: backend/database.js 的create方法添加返回expires_at字段 - 修复: backend/server.js 的API响应中添加expires_at字段 - 现在创建分享后会正确显示设置的到期时间 问题2: share.html分享页面不显示到期时间 - 新增: 在分享信息中添加到期时间显示(frontend/share.html:527-528) - 新增: 添加formatExpireTime/isExpiringSoon/isExpired方法 - 效果: 访问分享页面时可以看到"到期时间"或"永久有效" 改进: - 使用颜色区分状态(绿色=永久/正常, 黄色=即将过期, 红色=已过期) - 友好的时间显示格式(X天后过期/明天过期等) 注意: 关于0.01天显示问题的优化方案已文档化,需要手动修改app.js 🤖 Generated with Claude Code Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -326,7 +326,8 @@ const ShareDB = {
|
|||||||
return {
|
return {
|
||||||
id: result.lastInsertRowid,
|
id: result.lastInsertRowid,
|
||||||
share_code: shareCode,
|
share_code: shareCode,
|
||||||
share_type: share_type
|
share_type: share_type,
|
||||||
|
expires_at: expiresAt,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@@ -1505,7 +1505,8 @@ app.post('/api/share/create', authMiddleware, (req, res) => {
|
|||||||
message: '分享链接创建成功',
|
message: '分享链接创建成功',
|
||||||
share_code: result.share_code,
|
share_code: result.share_code,
|
||||||
share_url: shareUrl,
|
share_url: shareUrl,
|
||||||
share_type: result.share_type
|
share_type: result.share_type,
|
||||||
|
expires_at: result.expires_at,
|
||||||
});
|
});
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('创建分享链接失败:', error);
|
console.error('创建分享链接失败:', error);
|
||||||
|
|||||||
@@ -524,6 +524,8 @@
|
|||||||
<p style="color: #666; margin-bottom: 20px;">
|
<p style="color: #666; margin-bottom: 20px;">
|
||||||
分享者: <strong>{{ shareInfo.username }}</strong> |
|
分享者: <strong>{{ shareInfo.username }}</strong> |
|
||||||
创建时间: {{ formatDate(shareInfo.created_at) }}
|
创建时间: {{ formatDate(shareInfo.created_at) }}
|
||||||
|
<span v-if="shareInfo.expires_at"> | 到期时间: <strong :style="{color: isExpiringSoon(shareInfo.expires_at) ? '#ffc107' : isExpired(shareInfo.expires_at) ? '#dc3545' : '#28a745'}">{{ formatExpireTime(shareInfo.expires_at) }}</strong></span>
|
||||||
|
<span v-else> | 有效期: <strong style="color: #28a745;">永久有效</strong></span>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<!-- 视图切换按钮 (多文件时才显示) -->
|
<!-- 视图切换按钮 (多文件时才显示) -->
|
||||||
@@ -822,6 +824,56 @@
|
|||||||
hour12: false
|
hour12: false
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
,
|
||||||
|
|
||||||
|
// 格式化到期时间显示
|
||||||
|
formatExpireTime(expiresAt) {
|
||||||
|
if (!expiresAt) return '永久有效';
|
||||||
|
|
||||||
|
const expireDate = new Date(expiresAt);
|
||||||
|
const now = new Date();
|
||||||
|
const diffMs = expireDate - now;
|
||||||
|
const diffDays = Math.ceil(diffMs / (1000 * 60 * 60 * 24));
|
||||||
|
|
||||||
|
// 格式化日期
|
||||||
|
const dateStr = expireDate.toLocaleString('zh-CN', {
|
||||||
|
year: 'numeric',
|
||||||
|
month: '2-digit',
|
||||||
|
day: '2-digit',
|
||||||
|
hour: '2-digit',
|
||||||
|
minute: '2-digit'
|
||||||
|
});
|
||||||
|
|
||||||
|
if (diffDays < 0) {
|
||||||
|
return `已过期 (${dateStr})`;
|
||||||
|
} else if (diffDays === 0) {
|
||||||
|
return `今天过期 (${dateStr})`;
|
||||||
|
} else if (diffDays === 1) {
|
||||||
|
return `明天过期 (${dateStr})`;
|
||||||
|
} else if (diffDays <= 7) {
|
||||||
|
return `${diffDays}天后过期 (${dateStr})`;
|
||||||
|
} else {
|
||||||
|
return dateStr;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 判断是否即将过期(3天内)
|
||||||
|
isExpiringSoon(expiresAt) {
|
||||||
|
if (!expiresAt) return false;
|
||||||
|
const expireDate = new Date(expiresAt);
|
||||||
|
const now = new Date();
|
||||||
|
const diffMs = expireDate - now;
|
||||||
|
const diffDays = diffMs / (1000 * 60 * 60 * 24);
|
||||||
|
return diffDays > 0 && diffDays <= 3;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 判断是否已过期
|
||||||
|
isExpired(expiresAt) {
|
||||||
|
if (!expiresAt) return false;
|
||||||
|
const expireDate = new Date(expiresAt);
|
||||||
|
const now = new Date();
|
||||||
|
return expireDate <= now;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
mounted() {
|
mounted() {
|
||||||
|
|||||||
Reference in New Issue
Block a user