dsh-niuma 0.2.1 → 0.2.3

package/src/client/index.js

@@ -123,6 +123,16 @@ const zh = {
   'configFailed': '设置读取失败，使用默认值',
   'retry': '重试',
   'settings': '设置',
+  'decimalsLabel': '小数',
+  'decimalsUnit': '位',
+  'turboLabel': '加速',
+  'updateAvailable': '发现新版本 v{version}',
+  'updateNow': '立即更新',
+  'updating': '正在下载新版本…',
+  'updateStaged': 'v{version} 已下载 · 重启 DSH 生效',
+  'refreshRate': '刷新频率',
+  'rateSecond': '按秒（1s）',
+  'rateFrame': '刷新率（≈16ms）',
   'settingsHint': '改完点「保存」生效；格式不对会在下方红字提示，不影响计时。',
   'salaryField': '实收月薪',
   'groupSalary': '工资',
@@ -223,6 +233,16 @@ const en = {
   'configFailed': 'Failed to load settings, using defaults',
   'retry': 'Retry',
   'settings': 'Settings',
+  'decimalsLabel': 'Decimals',
+  'decimalsUnit': 'dp',
+  'turboLabel': 'Turbo',
+  'updateAvailable': 'New version v{version}',
+  'updateNow': 'Update now',
+  'updating': 'Downloading update…',
+  'updateStaged': 'v{version} downloaded · restart DSH to apply',
+  'refreshRate': 'Refresh rate',
+  'rateSecond': 'Per second (1s)',
+  'rateFrame': 'Display rate (~16ms)',
   'settingsHint': 'Click Save to apply. Invalid input is shown in red below; the ticker keeps running.',
   'salaryField': 'Net monthly salary',
   'groupSalary': 'Salary',
@@ -312,6 +332,7 @@ function formFromConfig(config) {
     lunchStart: String(config.lunchStart == null ? '' : config.lunchStart),
     lunchEnd: String(config.lunchEnd == null ? '' : config.lunchEnd),
     lunchPaid: config.lunchPaid === true,
+    updateMs: String(config.updateMs == null ? 1000 : config.updateMs),
   };
 }
 
@@ -326,6 +347,7 @@ function patchFromForm(form) {
     lunchStart: String(form.lunchStart || '').trim(),
     lunchEnd: String(form.lunchEnd || '').trim(),
     lunchPaid: Boolean(form.lunchPaid),
+    updateMs: Number(form.updateMs),
   };
 }
 
@@ -371,19 +393,63 @@ function useRemoteConfig() {
   return { ...state, refresh };
 }
 
-/** 当前时间：每 250ms 检查一次，只有整秒变化才 setState（每秒重算一次）。 */
-function useSecondClock() {
-  const [now, setNow] = React.useState(() => new Date());
+/** 版本 / 自动更新状态：挂载时查一次、每 6 小时刷新；点「立即更新」触发下载暂存。 */
+function useUpdateInfo() {
+  const [state, setState] = React.useState({ status: 'loading', data: null, error: null });
+  const load = React.useCallback(() => {
+    if (typeof fetch !== 'function') {
+      setState({ status: 'failed', data: null, error: 'fetch unavailable' });
+      return;
+    }
+    fetch(`${ROUTE_BASE}/update`, { cache: 'no-store', credentials: 'same-origin' })
+      .then(async (response) => {
+        const body = await response.json();
+        if (!response.ok || !body || body.ok !== true) throw new Error((body && body.error) || `HTTP ${response.status}`);
+        return body.data || null;
+      })
+      .then((data) => setState({ status: 'ready', data, error: null }))
+      .catch((error) => setState({ status: 'failed', data: null, error: String((error && error.message) || error) }));
+  }, []);
   React.useEffect(() => {
-    let lastSecond = -1;
-    const timer = setInterval(() => {
-      const second = Math.floor(Date.now() / 1000);
-      if (second === lastSecond) return;
-      lastSecond = second;
-      setNow(new Date());
-    }, 250);
+    load();
+    const timer = setInterval(load, 6 * 3600 * 1000);
     return () => clearInterval(timer);
+  }, [load]);
+  const download = React.useCallback(() => {
+    setState((prev) => ({ ...prev, status: 'updating' }));
+    if (typeof fetch !== 'function') return;
+    fetch(`${ROUTE_BASE}/update`, { method: 'POST', credentials: 'same-origin' })
+      .then(async (response) => {
+        const body = await response.json();
+        if (!response.ok || !body || body.ok !== true) throw new Error((body && body.error) || `HTTP ${response.status}`);
+        return body.data || null;
+      })
+      .then((data) => setState({ status: 'ready', data, error: null }))
+      .catch((error) => setState({ status: 'failed', data: null, error: String((error && error.message) || error) }));
   }, []);
+  return { ...state, reload: load, download };
+}
+
+/**
+ * 当前时间：按配置的刷新间隔更新。
+ * - updateMs >= 50：setInterval（按秒 / 200ms / 100ms）
+ * - updateMs <= 16：requestAnimationFrame（跟随屏幕刷新率连续滚动）
+ */
+function useClock(updateMs) {
+  const [now, setNow] = React.useState(() => new Date());
+  React.useEffect(() => {
+    if (updateMs <= 16) {
+      let raf = 0;
+      const loop = () => {
+        setNow(new Date());
+        raf = requestAnimationFrame(loop);
+      };
+      raf = requestAnimationFrame(loop);
+      return () => cancelAnimationFrame(raf);
+    }
+    const timer = setInterval(() => setNow(new Date()), updateMs);
+    return () => clearInterval(timer);
+  }, [updateMs]);
   return now;
 }
 
@@ -471,10 +537,29 @@ function SectionTitle(props) {
 }
 
 /** 今日已赚主卡：渐变底 + 超大金额 + 进度条（视觉焦点只有这一处）。 */
+/* ------------------------------------------------------------------ *
+ * 主金额：毫秒级刷新时数字本身高速变化（末位小数在 60fps 下每帧都在跳），
+ * 视觉上就是「欻欻」往上滚；不做逐位轮盘，避免滚动裁切带来的重影。
+ * ------------------------------------------------------------------ */
+function RollingMoney(props) {
+  const decimals = Math.max(0, Math.min(6, Number.isInteger(props.decimals) ? props.decimals : 4));
+  return React.createElement('span', {
+    style: {
+      display: 'inline-block', whiteSpace: 'nowrap', letterSpacing: '-1.2px',
+      fontVariantNumeric: 'tabular-nums',
+      ...(props.style || {}),
+    },
+  }, formatMoney(props.value, decimals));
+}
+
 function HeroCard(props) {
   const t = props.t;
   const snap = props.snap;
   const rates = snap.rates;
+  const decimals = Number.isInteger(props.decimals) ? props.decimals : 4;
+  const onDecimalsChange = props.onDecimalsChange;
+  const turbo = props.turbo === true;
+  const onTurboChange = props.onTurboChange;
   const progress = Math.max(0, Math.min(1, Number(snap.todayProgress) || 0));
   const percentText = `${(progress * 100).toFixed(1)}%`;
   const live = snap.status === 'working';
@@ -521,22 +606,64 @@ function HeroCard(props) {
           : null,
         t('earnedToday'),
       ]),
-      React.createElement('span', { key: 'b', style: { fontSize: 11, color: C.label3, ...NUM } },
-        `${t('todayOn')} ${snap.dateKey}`),
+      React.createElement('div', {
+        key: 'b',
+        style: { display: 'flex', flexDirection: 'column', alignItems: 'flex-end', gap: 4 },
+      }, [
+        React.createElement('span', { key: 'd', style: { fontSize: 11, color: C.label3, ...NUM } },
+          `${t('todayOn')} ${snap.dateKey}`),
+        React.createElement('div', { key: 'c', style: { display: 'inline-flex', alignItems: 'center', gap: 6 } }, [
+          React.createElement('label', {
+            key: 'dec', title: t('decimalsLabel'),
+            style: { display: 'inline-flex', alignItems: 'center', gap: 3, fontSize: 10, color: C.label3, ...NUM },
+          }, [
+            React.createElement('span', { key: 'l' }, t('decimalsLabel')),
+            React.createElement('select', {
+              key: 's', value: String(decimals), 'aria-label': t('decimalsLabel'),
+              onChange: (event) => onDecimalsChange && onDecimalsChange(Number(event.target.value)),
+              style: {
+                height: 22, padding: '0 2px', borderRadius: 6,
+                border: `1px solid ${C.border1}`, background: C.layer2, color: C.label2,
+                fontSize: 10.5, fontVariantNumeric: 'tabular-nums', outline: 'none', cursor: 'pointer',
+              },
+            }, [0, 1, 2, 3, 4, 5, 6].map((n) => React.createElement('option', { key: n, value: String(n) }, String(n)))),
+            React.createElement('span', { key: 'u' }, t('decimalsUnit')),
+          ]),
+          React.createElement('label', {
+            key: 'turbo', title: t('turboLabel'),
+            style: {
+              display: 'inline-flex', alignItems: 'center', gap: 3,
+              fontSize: 10, padding: '1px 6px', borderRadius: 999,
+              border: `1px solid ${turbo ? `color-mix(in srgb, ${GOLD_TINT} 60%, ${C.border1})` : C.border1}`,
+              background: turbo ? `color-mix(in srgb, ${GOLD_TINT} 16%, transparent)` : 'transparent',
+              color: turbo ? C.label2 : C.label3, cursor: 'pointer', ...NUM,
+            },
+          }, [
+            React.createElement('input', {
+              key: 'i', type: 'checkbox', checked: turbo,
+              onChange: (event) => onTurboChange && onTurboChange(event.target.checked),
+              style: { accentColor: GOLD_TINT, width: 12, height: 12, margin: 0, cursor: 'inherit' },
+            }),
+            React.createElement('span', { key: 'l' }, t('turboLabel')),
+          ]),
+        ]),
+      ]),
     ]),
     React.createElement('div', {
       key: 'amt',
       style: { display: 'flex', alignItems: 'baseline', gap: 7, marginTop: 4, flexWrap: 'wrap' },
     }, [
-      React.createElement('span', {
+      React.createElement(RollingMoney, {
         key: 'val',
+        value: snap.todayEarned,
+        decimals,
         style: {
-          fontSize: 46, lineHeight: 1.12, fontWeight: 800, letterSpacing: '-1.2px',
-          ...GOLD,
+          fontSize: 46, lineHeight: 1.12, fontWeight: 800,
+          color: '#D9A441',
           ...NUM,
           ...(rest ? { opacity: 0.62 } : {}),
         },
-      }, formatMoney(snap.todayEarned, 4)),
+      }),
       React.createElement('span', {
         key: 'unit',
         style: { fontSize: 18, fontWeight: 700, color: C.label2, ...NUM },
@@ -949,6 +1076,13 @@ function SettingsSection(props) {
   ]);
 
   const lunchDisabled = !form.lunchEnabled;
+  const RATE_OPTIONS = [
+    ['1000', t('rateSecond')],
+    ['250', '250 ms'],
+    ['100', '100 ms'],
+    ['50', '50 ms'],
+    ['16', t('rateFrame')],
+  ];
 
   return React.createElement('details', {
     open: true,
@@ -975,6 +1109,14 @@ function SettingsSection(props) {
         toggle('lunchEnabled', 'lunchEnabledShort', false),
         toggle('lunchPaid', 'lunchPaidShort', lunchDisabled),
       ]),
+      row('refresh', t('refreshRate'), [
+        React.createElement('select', {
+          key: 'r',
+          value: String(form.updateMs),
+          onChange: (event) => setField('updateMs', event.target.value),
+          style: { ...selectStyle, width: 128, padding: '4px 6px' },
+        }, RATE_OPTIONS.map(([value, label]) => React.createElement('option', { key: value, value }, label))),
+      ]),
     ]),
     React.createElement('div', {
       key: 'actions',
@@ -1022,7 +1164,7 @@ function NiumaPanel(props) {
   const t = props && typeof props.t === 'function' ? props.t : fallbackTranslate;
 
   const remote = useRemoteConfig();
-  const now = useSecondClock();
+  const update = useUpdateInfo();
 
   // 服务端配置 -> 规范化配置；坏数据/缺字段一律退回 DEFAULTS（计算不会抛）。
   const cfg = React.useMemo(() => {
@@ -1036,7 +1178,11 @@ function NiumaPanel(props) {
     }
   }, [remote.data]);
 
-  // 每秒重算（core 是纯函数，重算代价极小；已下班/休息日会稳定在日工资或 0）。
+  // 刷新频率：1000=按秒；16≈屏幕刷新率（连续滚动）；中间值为毫秒级
+  const updateMs = cfg.turbo === true ? 16 : (Number.isInteger(cfg.updateMs) ? cfg.updateMs : 1000);
+  const now = useClock(updateMs);
+
+  // 每次刷新重算（core 是纯函数，重算代价极小；已下班/休息日会稳定在日工资或 0）。
   const snap = React.useMemo(() => earnedToday(cfg, now), [cfg, now]);
   const rates = snap && snap.rates ? snap.rates : computeRates(cfg, snap && snap.dateKey);
   const baseForm = React.useMemo(() => formFromConfig(cfg), [cfg]);
@@ -1157,7 +1303,30 @@ function NiumaPanel(props) {
       });
   };
 
+  // 快速保存：主金额小数位这种即时偏好，不走设置表单的「保存」流程
+  const [quickError, setQuickError] = React.useState('');
+  const postConfig = React.useCallback((patch) => {
+    if (typeof fetch !== 'function') return;
+    fetch(`${ROUTE_BASE}/settings`, {
+      method: 'POST',
+      headers: { 'content-type': 'application/json' },
+      credentials: 'same-origin',
+      body: JSON.stringify(patch),
+    })
+      .then(async (response) => {
+        let body = null;
+        try { body = await response.json(); } catch (error) { body = null; }
+        if (!response.ok || !body || body.ok !== true) throw new Error((body && body.error) || `HTTP ${response.status}`);
+        setQuickError('');
+        remote.refresh();
+      })
+      .catch((error) => setQuickError(String((error && error.message) || error)));
+  }, [remote.refresh]);
+  const onDecimalsChange = (value) => postConfig({ decimals: value });
+  const onTurboChange = (checked) => postConfig({ turbo: Boolean(checked) });
+
   const holidaySource = (remote.data && remote.data.holidaySource) || HOLIDAY_SOURCE;
+  const versionText = (remote.data && remote.data.version) || (update.data && update.data.currentVersion) || '';
   const banner = remote.status === 'failed'
     ? {
       color: C.warn,
@@ -1255,7 +1424,52 @@ function NiumaPanel(props) {
       ])
       : null,
 
-    React.createElement(HeroCard, { key: 'hero', t, snap }),
+    // 版本 / 自动更新提示：已下载→提示重启；发现新版→一键更新
+    update.data && update.data.staged
+      ? React.createElement('div', {
+        key: 'update',
+        style: {
+          display: 'flex', alignItems: 'center', gap: 8, flexWrap: 'wrap',
+          fontSize: 11.5, color: C.label2, padding: '6px 10px', borderRadius: 9,
+          border: `1px solid color-mix(in srgb, ${GOLD_TINT} 45%, transparent)`,
+          background: `color-mix(in srgb, ${GOLD_TINT} 10%, transparent)`,
+        },
+      }, [
+        React.createElement('span', { key: 'dot', 'aria-hidden': 'true', style: { width: 6, height: 6, borderRadius: '50%', background: GOLD_TINT } }),
+        React.createElement('span', { key: 'txt', style: { flex: '1 1 160px' } },
+          t('updateStaged').replace('{version}', String(update.data.stagedVersion || update.data.latestVersion || ''))),
+      ])
+      : update.status === 'updating'
+        ? React.createElement('div', {
+          key: 'update',
+          style: { fontSize: 11.5, color: C.label3, padding: '2px 2px' },
+        }, t('updating'))
+        : update.data && update.data.hasUpdate
+          ? React.createElement('div', {
+            key: 'update',
+            style: {
+              display: 'flex', alignItems: 'center', gap: 8, flexWrap: 'wrap',
+              fontSize: 11.5, color: C.label2, padding: '6px 10px', borderRadius: 9,
+              border: `1px solid color-mix(in srgb, ${GOLD_TINT} 45%, transparent)`,
+              background: `color-mix(in srgb, ${GOLD_TINT} 10%, transparent)`,
+            },
+          }, [
+            React.createElement('span', { key: 'txt', style: { flex: '1 1 160px' } },
+              t('updateAvailable').replace('{version}', String(update.data.latestVersion || ''))),
+            React.createElement('button', {
+              key: 'go',
+              type: 'button',
+              onClick: update.download,
+              style: {
+                border: `1px solid color-mix(in srgb, ${GOLD_TINT} 70%, rgba(0,0,0,.15))`,
+                color: '#3A2A05',
+                background: 'linear-gradient(180deg, #F8DC86 0%, #EFC258 52%, #D99D2C 100%)',
+                borderRadius: 7, padding: '3px 12px', fontSize: 11.5, fontWeight: 700, cursor: 'pointer',
+              },
+            }, t('updateNow')),
+          ])
+          : null,
+    React.createElement(HeroCard, { key: 'hero', t, snap, decimals: cfg.decimals, onDecimalsChange, turbo: cfg.turbo, onTurboChange }),
     React.createElement(CountdownRow, { key: 'countdown', t, snap }),
     React.createElement('div', {
       key: 'ratesHead',
@@ -1316,6 +1530,20 @@ function NiumaPanel(props) {
       save,
       onSave,
     }),
+    // 版本信息固定放在面板最底部
+    React.createElement('div', {
+      key: 'version',
+      style: {
+        display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 6,
+        padding: '4px 0 0', fontSize: 10.5, color: C.label3, ...NUM,
+      },
+    }, [
+      versionText ? React.createElement('span', { key: 'v' }, `牛马加速器 v${versionText}`) : null,
+      update.data && update.data.staged
+        ? React.createElement('span', { key: 's', style: { color: C.label3 } },
+          `· ${t('updateStaged').replace('{version}', String(update.data.stagedVersion || update.data.latestVersion || ''))}`)
+        : null,
+    ]),
     ]),
   ]);
 }

package/src/core.mjs

@@ -27,6 +27,12 @@ export const DEFAULTS = Object.freeze({
   lunchPaid: false,
   holidays: DEFAULT_HOLIDAYS,
   extraWorkdays: DEFAULT_EXTRA_WORKDAYS,
+  /** 主金额小数位（0-6） */
+  decimals: 4,
+  /** 面板刷新间隔 ms：1000=按秒；16≈屏幕刷新率（连续滚动）；中间值为毫秒级 */
+  updateMs: 1000,
+  /** 加速（滚动模式）：true 时强制毫秒级刷新（≈屏幕刷新率），数字连续滚动 */
+  turbo: false,
 });
 
 const SALARY_MAX = 10_000_000;
@@ -159,6 +165,23 @@ export function normalizeConfig(patch) {
   merged.lunchEnabled = merged.lunchEnabled !== false;
   merged.lunchPaid = merged.lunchPaid === true;
 
+  // 展示/刷新偏好：主金额小数位 0-6；刷新间隔 16-1000ms（16 ≈ 屏幕刷新率）；加速开关
+  merged.turbo = merged.turbo === true;
+  const decimals = Number(merged.decimals);
+  if (!Number.isInteger(decimals) || decimals < 0 || decimals > 6) {
+    errors.push('小数位数需要是 0~6 的整数');
+    merged.decimals = Number.isInteger(decimals) ? decimals : DEFAULTS.decimals;
+  } else {
+    merged.decimals = decimals;
+  }
+  const updateMs = Number(merged.updateMs);
+  if (!Number.isInteger(updateMs) || updateMs < 16 || updateMs > 1000) {
+    errors.push('刷新间隔需要是 16~1000ms 的整数');
+    merged.updateMs = Number.isInteger(updateMs) ? updateMs : DEFAULTS.updateMs;
+  } else {
+    merged.updateMs = updateMs;
+  }
+
   // 日期列表
   const holidays = normalizeDateList(merged.holidays);
   const extraWorkdays = normalizeDateList(merged.extraWorkdays);