feat(sidepanel): 添加时间戳转换功能并优化默认状态
新增时间戳与日期时间相互转换的功能,包括输入框、选择器和转换按钮。 同时将侧边栏默认状态设为关闭,并完善相关样式和逻辑。 此外,增强复制功能的上下文检查以提升稳定性。
This commit is contained in:
+65
-9
@@ -48,6 +48,59 @@ toggleTimestampBtn.addEventListener('click', () => {
|
||||
updateTimestamp(showMilliseconds);
|
||||
});
|
||||
|
||||
const inputTimestamp = document.getElementById('input-timestamp');
|
||||
const convertTimestampBtn = document.getElementById('convert-timestamp-btn');
|
||||
const timestampInputResult = document.getElementById('timestamp-input-result');
|
||||
const timestampUnitSelect = document.querySelector('#page-timestamp select'); // 时间戳单位选择器
|
||||
|
||||
convertTimestampBtn.addEventListener('click', () => {
|
||||
const timestamp = inputTimestamp.value.trim();
|
||||
console.log('输入时间戳:', timestamp);
|
||||
|
||||
if (!timestamp) {
|
||||
timestampInputResult.value = '请输入时间戳';
|
||||
return;
|
||||
}
|
||||
|
||||
// 获取选择的时间戳单位(秒或毫秒)
|
||||
const isSeconds = timestampUnitSelect.value === 'seconds';
|
||||
|
||||
// 转换为数字
|
||||
let timestampNum = Number(timestamp);
|
||||
|
||||
// 如果是秒,转换为毫秒
|
||||
if (isSeconds) {
|
||||
timestampNum = timestampNum * 1000;
|
||||
}
|
||||
|
||||
// 检查是否为有效数字
|
||||
if (isNaN(timestampNum)) {
|
||||
timestampInputResult.value = '请输入有效的时间戳';
|
||||
return;
|
||||
}
|
||||
|
||||
// 创建日期对象
|
||||
const date = new Date(timestampNum);
|
||||
|
||||
// 检查日期是否有效
|
||||
if (isNaN(date.getTime())) {
|
||||
timestampInputResult.value = '无效的日期';
|
||||
return;
|
||||
}
|
||||
|
||||
console.log('转换日期对象:', date);
|
||||
const year = date.getFullYear();
|
||||
const month = date.getMonth() + 1;
|
||||
const day = date.getDate();
|
||||
const hours = date.getHours();
|
||||
const minutes = date.getMinutes();
|
||||
const seconds = date.getSeconds();
|
||||
|
||||
console.log('转换结果:', `${year}年${month}月${day}日 ${hours}时${minutes}分${seconds}秒`);
|
||||
|
||||
timestampInputResult.value = `${year}年${month}月${day}日 ${hours}时${minutes}分${seconds}秒`;
|
||||
});
|
||||
|
||||
// 复制时间戳到剪贴板
|
||||
const copyTimestampBtn = document.getElementById('copy-timestamp-btn');
|
||||
const currentTimestamp = document.getElementById('current-timestamp');
|
||||
@@ -55,15 +108,18 @@ copyTimestampBtn.addEventListener('click', () => {
|
||||
// 获取时间戳文本
|
||||
const timestampText = currentTimestamp.textContent;
|
||||
|
||||
chrome.runtime.sendMessage({ action: 'copyText', data: timestampText }, (res) => {
|
||||
if (chrome.runtime.lastError) {
|
||||
console.error('❌ 传送时间戳文本失败:', chrome.runtime.lastError);
|
||||
} else if (res?.success) {
|
||||
console.log('✅ 已复制:', timestampText);
|
||||
} else {
|
||||
console.error('❌ 复制失败:', res);
|
||||
}
|
||||
});
|
||||
// 检查扩展上下文是否仍然有效
|
||||
if (chrome.runtime && chrome.runtime.sendMessage) {
|
||||
chrome.runtime.sendMessage({ action: 'copyText', data: timestampText }, (res) => {
|
||||
if (chrome.runtime.lastError) {
|
||||
console.error('❌ 传送时间戳文本失败:', chrome.runtime.lastError);
|
||||
} else if (res?.success) {
|
||||
console.log('✅ 已复制:', timestampText);
|
||||
} else {
|
||||
console.error('❌ 复制失败:', res);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
function switchPage(pageName) {
|
||||
|
||||
Reference in New Issue
Block a user