dsh-niuma 0.2.0 → 0.2.1

package/CHANGELOG.md

@@ -2,6 +2,25 @@
 
 本文件记录用户可感知的变化。版本号遵循语义化版本。
 
+## 0.2.1 — 2026-10-21
+
+### 新增：本月工作天数进度
+
+- 「今日口径明细」新增 **本月已工作 / 剩余工作日** 两项：已工作 + 剩余 = 当月总工作日
+- 口径：已完成 = 今天之前的完整工作日；今天若已下班算 1 天，上班/午休中算剩余；
+  周末与节假日不算工作日（与工资口径完全一致）
+- 例：2026-10-21 下午上班中 → 已工作 10 天 / 剩余 8 天；18:00 下班后 → 11 / 7
+- core 的 `earnedToday()` 新增 `monthWorkdays / monthWorkdaysDone / monthWorkdaysLeft` 三个字段
+- **设置区默认展开**：进面板即可改工资/作息，不用先点开「设置」（手动收起后仍然保持收起）
+- **时间选择器固定 24 小时制**：上班/下班/午休起止改成「小时 : 分钟」两个原生下拉（00-23 / 00-59），
+  鼠标点选即可；不用 `<input type="time">` 是因为它的展示跟随浏览器 locale（英文环境会变 12 小时制 AM/PM）
+- 去掉设置区两行说明文案（「改完点保存生效…」「节假日数据见上方卡片…」）
+- **设置区排版（E 方案）**：行式短控件——左侧固定 62px 标签（实收月薪 / 工作时间 / 午休），
+  控件全部按内容定宽：月薪输入 88px、小时/分钟下拉各 40px、勾选为内联 chip；行间细分隔线，
+  保存按钮移到左侧。「午休」行顺序为 **时间 → 启用 → 算工时**（开关移到行尾），窄面板也能一行放下
+- 时间下拉加宽到 48px（之前 40px 会把末位数字切掉）
+- 5 项自检全绿（core 181 项）
+
 ## 0.2.0 — 2026-10-21
 
 界面重做（只改外观与信息层级，计算口径与配置完全不变）。

package/README.md

@@ -33,6 +33,7 @@
 - 午休可设置起止，**可勾选午休是否算工时**；午休不算工时则午休期间金额冻结
 - 状态徽标：休息日 / 未上班 / 搬砖中 / 午休中 / 已下班
 - 今日进度条、距上班/距下班倒计时
+- **本月已工作 / 剩余工作日**（与工资口径一致：节假日、周末、调休都算进去）
 
 ### 口径公式
 

package/lib/client.js

@@ -384,6 +384,13 @@ function earnedToday(config, now) {
   const monthEarned = earnedThisMonth(config, key, date, todayEarned, rates);
   const secondsToStart = workday && nowSec < startSec ? startSec - nowSec : 0;
   const secondsToEnd = workday && nowSec < endSec ? endSec - nowSec : 0;
+  const monthWorkdays = rates.monthlyWorkdays;
+  let monthWorkdaysDone = 0;
+  for (let day = 1; day < date.getDate(); day += 1) {
+    if (isWorkday(dateKeyOf(new Date(date.getFullYear(), date.getMonth(), day)), config)) monthWorkdaysDone += 1;
+  }
+  if (workday && status === "off") monthWorkdaysDone += 1;
+  const monthWorkdaysLeft = Math.max(0, monthWorkdays - monthWorkdaysDone);
   return {
     dateKey: key,
     isWorkday: workday,
@@ -394,6 +401,9 @@ function earnedToday(config, now) {
     todayTarget,
     todayProgress,
     monthEarned,
+    monthWorkdays,
+    monthWorkdaysDone,
+    monthWorkdaysLeft,
     secondsToStart,
     secondsToEnd,
     rates
@@ -571,19 +581,27 @@ var zh = {
   "paidHoursPerDay": "\u65E5\u6709\u6548\u5DE5\u65F6",
   "todayTarget": "\u4ECA\u65E5\u76EE\u6807",
   "monthEarned": "\u672C\u6708\u5DF2\u8D5A",
+  "monthWorkedDays": "\u672C\u6708\u5DF2\u5DE5\u4F5C",
+  "monthRemainingDays": "\u5269\u4F59\u5DE5\u4F5C\u65E5",
   "holidaySourceLink": "\u56FD\u52A1\u9662\u529E\u516C\u5385 2026 \u5E74\u8282\u5047\u65E5\u5B89\u6392",
   "configLoading": "\u6B63\u5728\u8BFB\u53D6\u8BBE\u7F6E\u2026",
   "configFailed": "\u8BBE\u7F6E\u8BFB\u53D6\u5931\u8D25\uFF0C\u4F7F\u7528\u9ED8\u8BA4\u503C",
   "retry": "\u91CD\u8BD5",
   "settings": "\u8BBE\u7F6E",
   "settingsHint": "\u6539\u5B8C\u70B9\u300C\u4FDD\u5B58\u300D\u751F\u6548\uFF1B\u683C\u5F0F\u4E0D\u5BF9\u4F1A\u5728\u4E0B\u65B9\u7EA2\u5B57\u63D0\u793A\uFF0C\u4E0D\u5F71\u54CD\u8BA1\u65F6\u3002",
-  "salaryField": "\u5B9E\u6536\u6708\u85AA\uFF08\u5143/\u6708\uFF09",
+  "salaryField": "\u5B9E\u6536\u6708\u85AA",
+  "groupSalary": "\u5DE5\u8D44",
+  "groupWorkTime": "\u5DE5\u4F5C\u65F6\u95F4",
+  "groupLunch": "\u5348\u4F11",
+  "salaryUnit": "\u5143 / \u6708",
   "workStartField": "\u4E0A\u73ED\u65F6\u95F4",
   "workEndField": "\u4E0B\u73ED\u65F6\u95F4",
   "lunchEnabledField": "\u542F\u7528\u5348\u4F11",
+  "lunchEnabledShort": "\u542F\u7528",
   "lunchStartField": "\u5348\u4F11\u5F00\u59CB",
   "lunchEndField": "\u5348\u4F11\u7ED3\u675F",
   "lunchPaidField": "\u5348\u4F11\u7B97\u5DE5\u65F6",
+  "lunchPaidShort": "\u7B97\u5DE5\u65F6",
   "holidaysCardTitle": "\u8282\u5047\u65E5\u5B89\u6392",
   "holidays2026Label": "2026 \u5E74\uFF08\u5B98\u65B9\uFF09",
   "holidays2027Label": "2027 \u5E74\uFF08\u9884\u4F30\uFF09",
@@ -607,6 +625,7 @@ var zh = {
   "saveFailed": "\u4FDD\u5B58\u5931\u8D25\uFF1A",
   "dayUnit": "\u5929",
   "hourUnit": "\u5C0F\u65F6",
+  "minuteUnit": "\u5206\u949F",
   "viewLabel": "\u67E5\u770B",
   "viewCurrent": "\u672C\u6708",
   "viewYear": "\u5168\u5E74\u5E73\u5747",
@@ -660,19 +679,27 @@ var en = {
   "paidHoursPerDay": "Paid hours / day",
   "todayTarget": "Today's target",
   "monthEarned": "Earned this month",
+  "monthWorkedDays": "Worked this month",
+  "monthRemainingDays": "Workdays left",
   "holidaySourceLink": "State Council 2026 holiday schedule",
   "configLoading": "Loading settings\u2026",
   "configFailed": "Failed to load settings, using defaults",
   "retry": "Retry",
   "settings": "Settings",
   "settingsHint": "Click Save to apply. Invalid input is shown in red below; the ticker keeps running.",
-  "salaryField": "Net monthly salary (CNY)",
+  "salaryField": "Net monthly salary",
+  "groupSalary": "Salary",
+  "groupWorkTime": "Working hours",
+  "groupLunch": "Lunch break",
+  "salaryUnit": "CNY / month",
   "workStartField": "Work start",
   "workEndField": "Work end",
   "lunchEnabledField": "Enable lunch break",
+  "lunchEnabledShort": "On",
   "lunchStartField": "Lunch start",
   "lunchEndField": "Lunch end",
   "lunchPaidField": "Lunch is paid",
+  "lunchPaidShort": "Paid",
   "holidaysCardTitle": "Holiday calendar",
   "holidays2026Label": "2026 (official)",
   "holidays2027Label": "2027 (estimated)",
@@ -696,6 +723,7 @@ var en = {
   "saveFailed": "Save failed: ",
   "dayUnit": "d",
   "hourUnit": "h",
+  "minuteUnit": "min",
   "viewLabel": "View",
   "viewCurrent": "This month",
   "viewYear": "Year average",
@@ -1131,7 +1159,9 @@ function DetailsFooter(props) {
     { key: "workdays", label: t("workdaysThisMonth"), value: `${rates.monthlyWorkdays}${t("dayUnit")}` },
     { key: "hours", label: t("paidHoursPerDay"), value: `${trimNumber(rates.paidHours, 2)}${t("hourUnit")}` },
     { key: "target", label: t("todayTarget"), value: money(snap.todayTarget, 2) },
-    { key: "month", label: t("monthEarned"), value: money(snap.monthEarned, 2) }
+    { key: "month", label: t("monthEarned"), value: money(snap.monthEarned, 2) },
+    { key: "worked", label: t("monthWorkedDays"), value: `${snap.monthWorkdaysDone}${t("dayUnit")}` },
+    { key: "left", label: t("monthRemainingDays"), value: `${snap.monthWorkdaysLeft}${t("dayUnit")}` }
   ];
   return import_react.default.createElement("div", {
     style: {
@@ -1302,84 +1332,147 @@ function SettingsSection(props) {
   const setCheck = props.setCheck;
   const save = props.save;
   const onSave = props.onSave;
+  const rowStyle = {
+    display: "flex",
+    alignItems: "center",
+    gap: 10,
+    minHeight: 33,
+    padding: "2px 0",
+    borderTop: `1px solid ${C.border1}`
+  };
+  const rowKeyStyle = { width: 62, flex: "0 0 62px", fontSize: 11.5, color: C.label3 };
+  const rowValStyle = { display: "flex", alignItems: "center", gap: 4, flexWrap: "wrap", minWidth: 0 };
   const inputStyle = {
-    width: "100%",
     boxSizing: "border-box",
-    padding: "6px 9px",
-    borderRadius: 8,
+    width: 88,
+    minHeight: 28,
+    padding: "4px 8px",
+    borderRadius: 7,
     border: `1px solid ${C.border}`,
     background: C.layer2,
     color: C.label,
-    fontSize: 13,
+    fontSize: 12.5,
     fontVariantNumeric: "tabular-nums",
     outline: "none"
   };
-  const labelStyle = { fontSize: 10.5, color: C.label3, fontWeight: 500 };
-  const textField = (field, labelKey, placeholder) => import_react.default.createElement("label", {
-    key: field,
-    style: { display: "flex", flexDirection: "column", gap: 4, flex: "1 1 130px", minWidth: 112 }
+  const selectStyle = {
+    boxSizing: "border-box",
+    width: 48,
+    minHeight: 28,
+    padding: "4px 2px 4px 6px",
+    borderRadius: 7,
+    border: `1px solid ${C.border}`,
+    background: C.layer2,
+    color: C.label,
+    fontSize: 12.5,
+    fontVariantNumeric: "tabular-nums",
+    outline: "none",
+    cursor: "pointer"
+  };
+  const unitStyle = { fontSize: 10.5, color: C.label3, whiteSpace: "nowrap" };
+  const dashStyle = { fontSize: 11, color: C.label3, margin: "0 1px" };
+  const HOUR_OPTIONS = Array.from({ length: 24 }, (_, i) => String(i).padStart(2, "0"));
+  const MINUTE_OPTIONS = Array.from({ length: 60 }, (_, i) => String(i).padStart(2, "0"));
+  const row = (key, label, values) => import_react.default.createElement("div", { key, style: rowStyle }, [
+    import_react.default.createElement("span", { key: "k", style: rowKeyStyle }, label),
+    import_react.default.createElement("div", { key: "v", style: rowValStyle }, values)
+  ]);
+  const timeSelects = (field, label, disabled = false) => {
+    const [rawHour = "00", rawMinute = "00"] = String(form[field] || "00:00").split(":");
+    const hour = HOUR_OPTIONS.includes(rawHour) ? rawHour : "00";
+    const minute = MINUTE_OPTIONS.includes(rawMinute) ? rawMinute : "00";
+    const commit = (nextHour, nextMinute) => setField(field, `${nextHour}:${nextMinute}`);
+    const style = { ...selectStyle, opacity: disabled ? 0.45 : 1, cursor: disabled ? "default" : "pointer" };
+    return import_react.default.createElement("span", { key: field, style: { display: "inline-flex", alignItems: "center", gap: 2 } }, [
+      import_react.default.createElement("select", {
+        key: "h",
+        value: hour,
+        disabled,
+        "aria-label": `${label} ${t("hourUnit")}`,
+        onChange: (event) => commit(event.target.value, minute),
+        style
+      }, HOUR_OPTIONS.map((value) => import_react.default.createElement("option", { key: value, value }, value))),
+      import_react.default.createElement("span", { key: "c", style: { color: C.label3, fontWeight: 700, fontSize: 12 } }, ":"),
+      import_react.default.createElement("select", {
+        key: "m",
+        value: minute,
+        disabled,
+        "aria-label": `${label} ${t("minuteUnit")}`,
+        onChange: (event) => commit(hour, event.target.value),
+        style
+      }, MINUTE_OPTIONS.map((value) => import_react.default.createElement("option", { key: value, value }, value)))
+    ]);
+  };
+  const timeRange = (startField, endField, label, disabled) => import_react.default.createElement("span", {
+    key: `${startField}-${endField}`,
+    style: { display: "inline-flex", alignItems: "center", gap: 2 }
   }, [
-    import_react.default.createElement("span", { key: "l", style: labelStyle }, t(labelKey)),
-    import_react.default.createElement("input", {
-      key: "i",
-      type: "text",
-      value: form[field],
-      placeholder: placeholder || "HH:mm",
-      onChange: (event) => setField(field, event.target.value),
-      style: inputStyle
-    })
+    timeSelects(startField, label, disabled),
+    import_react.default.createElement("span", { key: "dash", style: dashStyle }, "\u2013"),
+    timeSelects(endField, label, disabled)
   ]);
-  const checkField = (field, labelKey) => import_react.default.createElement("label", {
+  const toggle = (field, labelKey, disabled) => import_react.default.createElement("label", {
     key: field,
     style: {
-      display: "flex",
+      display: "inline-flex",
       alignItems: "center",
-      gap: 6,
-      flex: "1 1 140px",
-      fontSize: 12,
-      color: C.label2,
-      cursor: "pointer",
-      minHeight: 30
+      gap: 5,
+      padding: "2px 6px",
+      borderRadius: 8,
+      border: `1px solid ${C.border1}`,
+      background: C.layer2,
+      fontSize: 10.5,
+      color: disabled ? C.label3 : C.label2,
+      whiteSpace: "nowrap",
+      cursor: disabled ? "default" : "pointer",
+      opacity: disabled ? 0.55 : 1
     }
   }, [
     import_react.default.createElement("input", {
       key: "i",
       type: "checkbox",
       checked: Boolean(form[field]),
-      onChange: (event) => setCheck(field, event.target.checked)
+      disabled,
+      onChange: (event) => setCheck(field, event.target.checked),
+      style: { accentColor: GOLD_TINT, width: 13, height: 13, margin: 0, cursor: "inherit" }
     }),
     import_react.default.createElement("span", { key: "l" }, t(labelKey))
   ]);
+  const lunchDisabled = !form.lunchEnabled;
   return import_react.default.createElement("details", {
-    style: { background: C.layer1, border: `1px solid ${C.border1}`, borderRadius: 12, padding: "11px 13px" }
+    open: true,
+    style: { background: C.layer1, border: `1px solid ${C.border1}`, borderRadius: 12, padding: "10px 12px" }
   }, [
     import_react.default.createElement("summary", {
       key: "sum",
-      style: { cursor: "pointer", fontSize: 13, fontWeight: 650, color: C.label, userSelect: "none" }
+      style: { cursor: "pointer", fontSize: 12.5, fontWeight: 650, color: C.label, userSelect: "none" }
     }, t("settings")),
-    import_react.default.createElement("div", {
-      key: "hint",
-      style: { fontSize: 10.5, color: C.label3, margin: "5px 0 10px" }
-    }, t("settingsHint")),
-    import_react.default.createElement("div", {
-      key: "dataNote",
-      style: { fontSize: 10.5, color: C.label3, margin: "-4px 0 10px", lineHeight: 1.55 }
-    }, t("settingsDataNote")),
-    import_react.default.createElement("div", {
-      key: "fields",
-      style: { display: "flex", flexWrap: "wrap", gap: 9 }
-    }, [
-      textField("monthlySalary", "salaryField", "10000"),
-      textField("workStart", "workStartField", "09:00"),
-      textField("workEnd", "workEndField", "18:00"),
-      textField("lunchStart", "lunchStartField", "12:00"),
-      textField("lunchEnd", "lunchEndField", "13:00"),
-      checkField("lunchEnabled", "lunchEnabledField"),
-      checkField("lunchPaid", "lunchPaidField")
+    import_react.default.createElement("div", { key: "body", style: { marginTop: 7 } }, [
+      row("salary", t("salaryField"), [
+        import_react.default.createElement("input", {
+          key: "i",
+          type: "text",
+          inputMode: "decimal",
+          value: form.monthlySalary,
+          placeholder: "10000",
+          onChange: (event) => setField("monthlySalary", event.target.value),
+          style: inputStyle
+        }),
+        import_react.default.createElement("span", { key: "u", style: unitStyle }, t("salaryUnit"))
+      ]),
+      row("worktime", t("groupWorkTime"), [
+        timeRange("workStart", "workEnd", t("groupWorkTime"), false)
+      ]),
+      row("lunch", t("groupLunch"), [
+        // 时间在前、两个开关在后（放到行尾）
+        timeRange("lunchStart", "lunchEnd", t("groupLunch"), lunchDisabled),
+        toggle("lunchEnabled", "lunchEnabledShort", false),
+        toggle("lunchPaid", "lunchPaidShort", lunchDisabled)
+      ])
     ]),
     import_react.default.createElement("div", {
       key: "actions",
-      style: { display: "flex", alignItems: "center", gap: 10, flexWrap: "wrap", marginTop: 11 }
+      style: { display: "flex", alignItems: "center", gap: 10, marginTop: 7, paddingTop: 7, borderTop: `1px solid ${C.border1}` }
     }, [
       import_react.default.createElement("button", {
         key: "save",
@@ -1387,25 +1480,24 @@ function SettingsSection(props) {
         onClick: onSave,
         disabled: save.status === "saving",
         style: {
-          // 金色按钮：与主卡金额、节假日强调同一套金色系；深棕字保证任何主题下都有对比度
           border: `1px solid color-mix(in srgb, ${GOLD_TINT} 72%, rgba(0,0,0,.18))`,
           color: "#3A2A05",
           background: save.status === "saving" ? `color-mix(in srgb, ${GOLD_TINT} 52%, #fff)` : "linear-gradient(180deg, #F8DC86 0%, #EFC258 52%, #D99D2C 100%)",
           borderRadius: 8,
-          padding: "7px 20px",
-          fontSize: 13,
+          padding: "5px 16px",
+          fontSize: 12.5,
           fontWeight: 700,
           letterSpacing: ".3px",
           cursor: save.status === "saving" ? "default" : "pointer",
           opacity: save.status === "saving" ? 0.72 : 1,
-          boxShadow: `0 2px 10px color-mix(in srgb, ${GOLD_TINT} 36%, transparent), inset 0 1px 0 rgba(255,255,255,.45)`,
+          boxShadow: `0 2px 9px color-mix(in srgb, ${GOLD_TINT} 34%, transparent), inset 0 1px 0 rgba(255,255,255,.45)`,
           textShadow: "0 1px 0 rgba(255,255,255,.28)"
         }
       }, save.status === "saving" ? t("saving") : t("save")),
-      save.status === "ok" ? import_react.default.createElement("span", { key: "ok", style: { fontSize: 12, color: C.ok } }, save.message || t("saved")) : null,
+      save.status === "ok" ? import_react.default.createElement("span", { key: "ok", style: { fontSize: 11.5, color: C.ok } }, save.message || t("saved")) : null,
       save.status === "error" ? import_react.default.createElement("span", {
         key: "err",
-        style: { fontSize: 12, color: C.error, flex: "1 1 220px", whiteSpace: "pre-wrap" }
+        style: { fontSize: 11.5, color: C.error, flex: "1 1 200px", whiteSpace: "pre-wrap" }
       }, `${t("saveFailed")}${save.errors.join("\uFF1B")}`) : null
     ])
   ]);