subtrack
bb923aab4d
build / build-and-test (push) Successful in 3m41s
按「any → 包时 / 按次 / 包赛季」规则检查后修复 3 处问题： 1) 包赛季套餐编辑时「按日」也被勾中 - 赛季套餐在库里 unit='day' + season=1，模板只判断了 unit，导致按日/赛季两个 radio 都带 checked - 修正为「unit=day 且非赛季」才勾中按日 2) 客户开通表单：选中包赛季时仍显示且必填「开始日」 - 赛季起止由套餐决定，开始日应隐藏 - 表单加 data-start-wrap，JS 在赛季模式隐藏并取消 required，切回其它模式恢复 3) 按次开通时没有带出套餐默认有效期 - 套餐选项新增 data-validity，选中按次且终止日为空时，自动按「开始日 + 默认有效期 - 1」带出到期日，仍可手改 现状（已逐项验证）： - 包时：默认量单位「天」，无有效期/赛季字段 - 按次：默认量单位「次」，显示「按次默认有效期（天）」，开单自动带出到期日 - 包赛季：显示赛季开始日/结束日（必填），隐藏默认量有效期与开始日；过期套餐下拉置灰 测试： - 转换专项 10 项全过：三种模式的勾选状态、字段显示、按日→按次→赛季→按日 往返保存均正常 - 数据库未改动结构，往返保存后 unit/season/season_start/season_end 值正确 - 版本号 1.8.2
285 lines
11 KiB
JavaScript
285 lines
11 KiB
JavaScript
/* 代打台 · 交互增强（无框架，全部渐进增强） */
|
|
(function () {
|
|
'use strict';
|
|
|
|
/* 提示条自动淡出 */
|
|
document.querySelectorAll('[data-flash]').forEach(function (el) {
|
|
setTimeout(function () {
|
|
el.classList.add('hide');
|
|
setTimeout(function () { el.remove(); }, 450);
|
|
}, 4200);
|
|
});
|
|
|
|
/* 按 / 聚焦搜索框 */
|
|
document.addEventListener('keydown', function (e) {
|
|
if (e.key !== '/' || e.metaKey || e.ctrlKey || e.altKey) return;
|
|
var tag = (document.activeElement && document.activeElement.tagName) || '';
|
|
if (/^(INPUT|TEXTAREA|SELECT)$/.test(tag)) return;
|
|
var s = document.querySelector('[data-search]');
|
|
if (s) { e.preventDefault(); s.focus(); s.select(); }
|
|
});
|
|
|
|
/* 危险操作确认 */
|
|
document.querySelectorAll('form[data-confirm]').forEach(function (f) {
|
|
f.addEventListener('submit', function (e) {
|
|
if (!window.confirm(f.getAttribute('data-confirm'))) e.preventDefault();
|
|
});
|
|
});
|
|
|
|
/* 追加时长面板：点日历挑终止日 + 实时反算 */
|
|
function parseDay(s) { return new Date(s + 'T00:00:00'); }
|
|
function diffDays(a, b) { return Math.round((b.getTime() - a.getTime()) / 86400000); }
|
|
|
|
document.querySelectorAll('form[data-extend]').forEach(function (form) {
|
|
var base = parseDay(form.getAttribute('data-base'));
|
|
var today = parseDay(form.getAttribute('data-today'));
|
|
var input = form.querySelector('[data-end-input]');
|
|
var endLabel = form.querySelector('[data-end-label]');
|
|
var daysEl = form.querySelector('[data-days]');
|
|
var remainEl = form.querySelector('[data-remain]');
|
|
var buttons = form.querySelectorAll('.miniday');
|
|
if (!input) return;
|
|
|
|
function paint(date) {
|
|
if (!date) return;
|
|
var d = parseDay(date);
|
|
input.value = date;
|
|
if (endLabel) endLabel.textContent = date;
|
|
var days = diffDays(base, d) + 1;
|
|
if (daysEl) daysEl.textContent = days > 0 ? days : 0;
|
|
var remain = diffDays(today, d) + 1;
|
|
if (remainEl) remainEl.textContent = remain > 0 ? remain : 0;
|
|
buttons.forEach(function (b) {
|
|
b.classList.toggle('picked', b.getAttribute('data-date') === date);
|
|
});
|
|
}
|
|
|
|
buttons.forEach(function (b) {
|
|
b.addEventListener('click', function () {
|
|
if (!b.disabled) paint(b.getAttribute('data-date'));
|
|
});
|
|
});
|
|
input.addEventListener('change', function () { paint(input.value); });
|
|
if (input.value) paint(input.value);
|
|
});
|
|
|
|
/* 新订阅表单：按套餐类型切换「天数 / 次数 / 终止日」 */
|
|
document.querySelectorAll('form[data-sub-form]').forEach(function (form) {
|
|
var sel = form.querySelector('[data-pkg-select]');
|
|
var daysWrap = form.querySelector('[data-days-wrap]');
|
|
var countWrap = form.querySelector('[data-count-wrap]');
|
|
var endWrap = form.querySelector('[data-end-wrap]');
|
|
var startWrap = form.querySelector('[data-start-wrap]');
|
|
var startInput = form.querySelector('input[name="start_date"]');
|
|
if (!sel) return;
|
|
|
|
function sync() {
|
|
var opt = sel.options[sel.selectedIndex];
|
|
var unit = opt && opt.getAttribute('data-unit');
|
|
var amount = opt && opt.getAttribute('data-amount');
|
|
var validity = opt && parseInt(opt.getAttribute('data-validity') || '0', 10);
|
|
var endInput = endWrap && endWrap.querySelector('input');
|
|
|
|
if (unit === 'season') {
|
|
if (daysWrap) daysWrap.hidden = true;
|
|
if (countWrap) countWrap.hidden = true;
|
|
if (endWrap) endWrap.hidden = true;
|
|
if (startWrap) startWrap.hidden = true;
|
|
if (startInput) startInput.required = false;
|
|
return;
|
|
}
|
|
|
|
if (startWrap) startWrap.hidden = false;
|
|
if (startInput) startInput.required = true;
|
|
|
|
if (unit === 'count') {
|
|
if (daysWrap) daysWrap.hidden = true;
|
|
if (countWrap) { countWrap.hidden = false; if (amount) countWrap.querySelector('input').value = amount; }
|
|
if (endWrap) endWrap.hidden = false;
|
|
if (validity > 0 && endInput && !endInput.value && startInput && startInput.value) {
|
|
var d = new Date(startInput.value + 'T00:00:00');
|
|
d.setDate(d.getDate() + validity - 1);
|
|
endInput.value = d.toISOString().slice(0, 10);
|
|
}
|
|
} else if (unit === 'day') {
|
|
if (daysWrap) { daysWrap.hidden = false; if (amount) daysWrap.querySelector('input').value = amount; }
|
|
if (countWrap) countWrap.hidden = true;
|
|
if (endWrap) endWrap.hidden = false;
|
|
} else {
|
|
if (daysWrap) daysWrap.hidden = false;
|
|
if (countWrap) countWrap.hidden = true;
|
|
if (endWrap) endWrap.hidden = true;
|
|
}
|
|
}
|
|
sel.addEventListener('change', sync);
|
|
sync();
|
|
});
|
|
|
|
/* 套餐表单：切换默认量单位文案 */
|
|
document.querySelectorAll('form[data-package-form]').forEach(function (form) {
|
|
var label = form.querySelector('[data-unit-label]');
|
|
var radios = form.querySelectorAll('input[name="unit"]');
|
|
function sync() {
|
|
var v = 'day';
|
|
radios.forEach(function (r) { if (r.checked) v = r.value; });
|
|
if (label) label.textContent = v === 'count' ? '次' : '天';
|
|
var seasonWrap = form.querySelector('[data-season-wrap]');
|
|
var validityWrap = form.querySelector('[data-validity-wrap]');
|
|
if (seasonWrap) {
|
|
seasonWrap.hidden = v !== 'season';
|
|
seasonWrap.querySelectorAll('input').forEach(function (i) { i.required = v === 'season'; });
|
|
}
|
|
if (validityWrap) { validityWrap.hidden = v !== 'count'; }
|
|
}
|
|
radios.forEach(function (r) { r.addEventListener('change', sync); });
|
|
sync();
|
|
});
|
|
})();
|
|
|
|
/* ---------- 亮色 / 暗色切换 ----------
|
|
偏好写 cookie，服务端首屏直接带 data-theme，不闪。
|
|
没有 cookie 时跟随系统（由 CSS 的 prefers-color-scheme 决定）。 */
|
|
(function () {
|
|
'use strict';
|
|
var KEY = 'daili_theme';
|
|
var btns = document.querySelectorAll('[data-theme-toggle]');
|
|
if (!btns.length) return;
|
|
|
|
function effective() {
|
|
var attr = document.documentElement.getAttribute('data-theme');
|
|
if (attr === 'light' || attr === 'dark') return attr;
|
|
return window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
}
|
|
|
|
Array.prototype.forEach.call(btns, function (btn) {
|
|
btn.addEventListener('click', function () {
|
|
var next = effective() === 'dark' ? 'light' : 'dark';
|
|
document.documentElement.setAttribute('data-theme', next);
|
|
document.cookie = KEY + '=' + next + '; path=/; max-age=31536000; SameSite=Lax';
|
|
});
|
|
});
|
|
})();
|
|
|
|
/* ---------- 触摸小键盘 + 抽屉时钟 + 更多菜单 ---------- */
|
|
(function () {
|
|
'use strict';
|
|
|
|
/* 时钟：精确到秒 */
|
|
var clocks = document.querySelectorAll('[data-clock]');
|
|
function tick() {
|
|
var d = new Date();
|
|
var pad = function (n) { return n < 10 ? '0' + n : '' + n; };
|
|
var t = pad(d.getHours()) + ':' + pad(d.getMinutes()) + ':' + pad(d.getSeconds());
|
|
Array.prototype.forEach.call(clocks, function (el) { el.textContent = t; });
|
|
}
|
|
if (clocks.length) { tick(); setInterval(tick, 1000); }
|
|
|
|
/* 小键盘：输入手机尾号
|
|
关键点：鼠标按下时阻止默认行为，否则按钮会先抢走输入框焦点；
|
|
每次按键后再把焦点和光标送回输入框末尾。 */
|
|
Array.prototype.forEach.call(document.querySelectorAll('[data-keypad]'), function (pad) {
|
|
// 键盘是表单的兄弟节点（不在 <form> 内），所以先找输入框，再用 input.form 反查表单
|
|
var scope = pad.closest('.drawer-block') || pad.parentElement || document;
|
|
var input = scope.querySelector('input[name="tail"]');
|
|
if (!input) { return; }
|
|
var form = input.form;
|
|
if (!form) { return; }
|
|
|
|
function keepFocus() {
|
|
try { input.focus({ preventScroll: true }); } catch (err) { input.focus(); }
|
|
var end = input.value.length;
|
|
try { input.setSelectionRange(end, end); } catch (err) { /* number 类型时忽略 */ }
|
|
}
|
|
|
|
// mousedown 会触发“按钮获得焦点”，先拦下来；pointerdown 再兜底一次
|
|
pad.addEventListener('mousedown', function (e) {
|
|
e.preventDefault();
|
|
keepFocus();
|
|
});
|
|
pad.addEventListener('pointerdown', function () {
|
|
// 这里不能 preventDefault：会连带取消后面的 click 事件
|
|
keepFocus();
|
|
});
|
|
|
|
pad.addEventListener('click', function (e) {
|
|
var btn = e.target.closest('button[data-key]');
|
|
if (!btn) return;
|
|
var key = btn.getAttribute('data-key');
|
|
if (key === 'back') {
|
|
input.value = input.value.slice(0, -1);
|
|
} else if (key === 'ok') {
|
|
if (input.value) {
|
|
if (form.requestSubmit) { form.requestSubmit(); } else { form.submit(); }
|
|
}
|
|
return;
|
|
} else if (input.value.length < 8) {
|
|
input.value += key;
|
|
}
|
|
keepFocus();
|
|
});
|
|
});
|
|
|
|
/* 更多菜单：点开一个时收起其它，点空白处关闭 */
|
|
document.addEventListener('click', function (e) {
|
|
var opened = document.querySelectorAll('.more-actions[open]');
|
|
Array.prototype.forEach.call(opened, function (d) {
|
|
if (!d.contains(e.target)) { d.removeAttribute('open'); }
|
|
});
|
|
});
|
|
})();
|
|
|
|
|
|
/* ---------- 全选 + 触控/PC 小键盘模式 ---------- */
|
|
(function () {
|
|
'use strict';
|
|
|
|
/* 批量开通：表头全选 */
|
|
Array.prototype.forEach.call(document.querySelectorAll('[data-select-all]'), function (box) {
|
|
box.addEventListener('change', function () {
|
|
var form = box.closest('form') || document;
|
|
Array.prototype.forEach.call(form.querySelectorAll('input[name="customer_ids"]'), function (c) {
|
|
if (!c.disabled) { c.checked = box.checked; }
|
|
});
|
|
});
|
|
});
|
|
|
|
/* 触控 / PC 模式：触控时显示键盘并禁用输入框（不唤起系统输入法） */
|
|
var KEY = 'daili_keypad_mode';
|
|
|
|
function applyMode(touch) {
|
|
Array.prototype.forEach.call(document.querySelectorAll('[data-keypad]'), function (pad) {
|
|
pad.hidden = !touch;
|
|
var block = pad.closest('.drawer-block') || document;
|
|
var input = block.querySelector('input[name="tail"]');
|
|
if (input) {
|
|
input.readOnly = touch;
|
|
input.setAttribute('inputmode', touch ? 'none' : 'numeric');
|
|
input.setAttribute('placeholder', touch ? '点下方键盘输入尾号' : '输入手机尾号，回车即可完成');
|
|
}
|
|
var btn = block.querySelector('[data-keypad-toggle]');
|
|
if (btn) {
|
|
btn.textContent = touch ? '触控' : '⌨';
|
|
btn.classList.toggle('on', touch);
|
|
btn.title = touch ? '当前触控模式，点此切回 PC' : '当前 PC 模式，点此打开触控键盘';
|
|
}
|
|
});
|
|
}
|
|
|
|
var touchMode = false;
|
|
try { touchMode = localStorage.getItem(KEY) === 'touch'; } catch (err) { }
|
|
applyMode(touchMode);
|
|
|
|
Array.prototype.forEach.call(document.querySelectorAll('[data-keypad-toggle]'), function (btn) {
|
|
btn.addEventListener('click', function () {
|
|
touchMode = !touchMode;
|
|
try { localStorage.setItem(KEY, touchMode ? 'touch' : 'pc'); } catch (err) { }
|
|
applyMode(touchMode);
|
|
if (!touchMode) {
|
|
var block = btn.closest('.drawer-block') || document;
|
|
var input = block.querySelector('input[name="tail"]');
|
|
if (input) { input.focus(); }
|
|
}
|
|
});
|
|
});
|
|
})();
|