mirror of
https://github.com/Cola-Echo/Cola.git
synced 2026-06-06 03:35:50 +00:00
Add files via upload
This commit is contained in:
@@ -677,10 +677,6 @@ function handleFuncItemClick(func) {
|
||||
showTransferPage();
|
||||
}
|
||||
return;
|
||||
case 'time':
|
||||
hideFuncPanel();
|
||||
showTimePicker();
|
||||
return;
|
||||
case 'listen':
|
||||
hideFuncPanel();
|
||||
// 群聊不支持一起听
|
||||
@@ -758,194 +754,5 @@ export function initFuncPanel() {
|
||||
// 初始化音乐面板事件
|
||||
initMusicEvents();
|
||||
initMusicShareListener();
|
||||
initTimePickerEvents();
|
||||
initListenTogether();
|
||||
}
|
||||
|
||||
// ============ 时间选择器相关 ============
|
||||
|
||||
// 存储选择的时间(null 表示使用当前时间)
|
||||
let selectedTime = null;
|
||||
let timePickerInited = false;
|
||||
|
||||
// 时间选择器当前选中的值
|
||||
let pickerValues = {
|
||||
year: new Date().getFullYear(),
|
||||
month: new Date().getMonth() + 1,
|
||||
day: new Date().getDate(),
|
||||
hour: new Date().getHours(),
|
||||
minute: new Date().getMinutes(),
|
||||
second: new Date().getSeconds()
|
||||
};
|
||||
|
||||
// 获取选择的时间(供 chat.js 使用)
|
||||
export function getSelectedTime() {
|
||||
return selectedTime;
|
||||
}
|
||||
|
||||
// 清除选择的时间
|
||||
export function clearSelectedTime() {
|
||||
selectedTime = null;
|
||||
updateTimeIndicator();
|
||||
}
|
||||
|
||||
// 显示时间选择器
|
||||
function showTimePicker() {
|
||||
const picker = document.getElementById('wechat-time-picker');
|
||||
if (!picker) return;
|
||||
|
||||
// 初始化为当前时间
|
||||
const now = new Date();
|
||||
pickerValues = {
|
||||
year: now.getFullYear(),
|
||||
month: now.getMonth() + 1,
|
||||
day: now.getDate(),
|
||||
hour: now.getHours(),
|
||||
minute: now.getMinutes(),
|
||||
second: now.getSeconds()
|
||||
};
|
||||
|
||||
renderTimePickerColumns();
|
||||
updateTimePickerDisplay();
|
||||
picker.classList.remove('hidden');
|
||||
}
|
||||
|
||||
// 隐藏时间选择器
|
||||
function hideTimePicker() {
|
||||
const picker = document.getElementById('wechat-time-picker');
|
||||
picker?.classList.add('hidden');
|
||||
}
|
||||
|
||||
// 渲染时间选择器列
|
||||
function renderTimePickerColumns() {
|
||||
const currentYear = new Date().getFullYear();
|
||||
|
||||
// 年份:前后5年
|
||||
renderPickerColumn('year', currentYear - 5, currentYear + 5, pickerValues.year, '年');
|
||||
// 月份:1-12
|
||||
renderPickerColumn('month', 1, 12, pickerValues.month, '月');
|
||||
// 日期:根据年月动态计算
|
||||
const daysInMonth = new Date(pickerValues.year, pickerValues.month, 0).getDate();
|
||||
renderPickerColumn('day', 1, daysInMonth, pickerValues.day, '日');
|
||||
// 小时:0-23
|
||||
renderPickerColumn('hour', 0, 23, pickerValues.hour, '时');
|
||||
// 分钟:0-59
|
||||
renderPickerColumn('minute', 0, 59, pickerValues.minute, '分');
|
||||
// 秒:0-59
|
||||
renderPickerColumn('second', 0, 59, pickerValues.second, '秒');
|
||||
}
|
||||
|
||||
// 渲染单个列
|
||||
function renderPickerColumn(type, min, max, selected, suffix) {
|
||||
const container = document.getElementById(`wechat-time-picker-${type}`);
|
||||
if (!container) return;
|
||||
|
||||
let html = '';
|
||||
for (let i = min; i <= max; i++) {
|
||||
const value = type === 'year' ? i : i.toString().padStart(2, '0');
|
||||
const isSelected = i === selected;
|
||||
html += `<div class="wechat-time-picker-item${isSelected ? ' selected' : ''}" data-value="${i}">${value}${suffix}</div>`;
|
||||
}
|
||||
container.innerHTML = html;
|
||||
|
||||
// 滚动到选中项
|
||||
setTimeout(() => {
|
||||
const selectedItem = container.querySelector('.selected');
|
||||
if (selectedItem) {
|
||||
container.scrollTop = selectedItem.offsetTop - container.offsetHeight / 2 + selectedItem.offsetHeight / 2;
|
||||
}
|
||||
}, 0);
|
||||
}
|
||||
|
||||
// 更新显示的时间
|
||||
function updateTimePickerDisplay() {
|
||||
const display = document.getElementById('wechat-time-picker-display');
|
||||
if (!display) return;
|
||||
|
||||
const { year, month, day, hour, minute, second } = pickerValues;
|
||||
display.textContent = `${year}-${month.toString().padStart(2, '0')}-${day.toString().padStart(2, '0')} ${hour.toString().padStart(2, '0')}:${minute.toString().padStart(2, '0')}:${second.toString().padStart(2, '0')}`;
|
||||
}
|
||||
|
||||
// 更新输入框旁的时间指示器
|
||||
function updateTimeIndicator() {
|
||||
let indicator = document.getElementById('wechat-time-indicator');
|
||||
|
||||
if (!selectedTime) {
|
||||
indicator?.remove();
|
||||
return;
|
||||
}
|
||||
|
||||
if (!indicator) {
|
||||
const inputArea = document.querySelector('.wechat-chat-input-area');
|
||||
if (!inputArea) return;
|
||||
|
||||
indicator = document.createElement('div');
|
||||
indicator.id = 'wechat-time-indicator';
|
||||
indicator.className = 'wechat-time-indicator';
|
||||
inputArea.insertBefore(indicator, inputArea.firstChild);
|
||||
}
|
||||
|
||||
const date = new Date(selectedTime);
|
||||
const month = date.getMonth() + 1;
|
||||
const day = date.getDate();
|
||||
const hour = date.getHours().toString().padStart(2, '0');
|
||||
const minute = date.getMinutes().toString().padStart(2, '0');
|
||||
|
||||
indicator.innerHTML = `
|
||||
<span class="wechat-time-indicator-text">${month}月${day}日 ${hour}:${minute}</span>
|
||||
<button class="wechat-time-indicator-clear" id="wechat-time-indicator-clear">✕</button>
|
||||
`;
|
||||
|
||||
// 绑定清除按钮
|
||||
document.getElementById('wechat-time-indicator-clear')?.addEventListener('click', (e) => {
|
||||
e.stopPropagation();
|
||||
clearSelectedTime();
|
||||
});
|
||||
}
|
||||
|
||||
// 初始化时间选择器事件
|
||||
function initTimePickerEvents() {
|
||||
if (timePickerInited) return;
|
||||
timePickerInited = true;
|
||||
|
||||
// 监听列项点击
|
||||
document.addEventListener('click', (e) => {
|
||||
const item = e.target.closest('.wechat-time-picker-item');
|
||||
if (!item) return;
|
||||
|
||||
const column = item.closest('.wechat-time-picker-column');
|
||||
if (!column) return;
|
||||
|
||||
const type = column.dataset.type;
|
||||
const value = parseInt(item.dataset.value);
|
||||
|
||||
// 更新选中值
|
||||
pickerValues[type] = value;
|
||||
|
||||
// 更新选中样式
|
||||
column.querySelectorAll('.wechat-time-picker-item').forEach(el => {
|
||||
el.classList.toggle('selected', parseInt(el.dataset.value) === value);
|
||||
});
|
||||
|
||||
// 如果改变了年或月,需要重新渲染日期列
|
||||
if (type === 'year' || type === 'month') {
|
||||
const daysInMonth = new Date(pickerValues.year, pickerValues.month, 0).getDate();
|
||||
if (pickerValues.day > daysInMonth) {
|
||||
pickerValues.day = daysInMonth;
|
||||
}
|
||||
renderPickerColumn('day', 1, daysInMonth, pickerValues.day, '日');
|
||||
}
|
||||
|
||||
updateTimePickerDisplay();
|
||||
});
|
||||
|
||||
// 确认按钮
|
||||
document.getElementById('wechat-time-picker-confirm')?.addEventListener('click', () => {
|
||||
const { year, month, day, hour, minute, second } = pickerValues;
|
||||
selectedTime = new Date(year, month - 1, day, hour, minute, second).getTime();
|
||||
|
||||
hideTimePicker();
|
||||
updateTimeIndicator();
|
||||
showToast('已设置发送时间', '⏰');
|
||||
});
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user