ui: 移动端触控基线与板块重排(按钮32-36/输入38/弹窗按钮40;出勤2x2;计划操作等宽;记账工具栏分区;导出铺满;底栏56)

docs/release-notes-v0.6.4.md

@@ -0,0 +1,23 @@
+# v0.6.4 发布说明（2026-10-26）
+
+## 移动端布局与板块尺寸优化
+
+**触控基线**（全部界面统一）：
+- 常规按钮 36px / 次级 32px / 小按钮 30px（原 24-28px，触控不友好）
+- 输入框与下拉 38px 高；分段选择器 34px；图标按钮 34px
+- 弹窗底部主按钮 40px 并等宽铺满；弹窗宽距收窄近全屏
+
+**板块重排**：
+- 详情页：出勤信息改 2×2 紧凑网格（原手机上拉成 1 列过高）；打卡/休假按钮并排等宽
+- 计划页：每日任务操作按钮（计时/完成/跳过）等宽铺满、触控高度 32px；「今天 / 添加计划」等宽；长期计划卡操作角标化
+- 记账页：工具栏分区——月份导航一行、两个筛选并排、「记一笔」全宽主按钮
+- 详情页导出：指定日/当周/当月/自定义分段等宽铺满，日期输入全宽
+- 总结页：范围分段铺满一行；草稿编辑器高度收窄
+- 备忘录：列表收窄至 210px，底部按钮等宽
+- 底部标签栏加高至 56px、图标 22px；悬浮计时时钟位置同步适配
+- 顶栏打卡按钮加高至 34px，更易点按
+
+## 部署
+
+- 服务器：`cd /opt/daywork && git pull && cd server && docker compose up -d --build`（网页端即生效）
+- 桌面 / 安卓：安装 0.6.4 安装包

intern-log/dist/assets/index-B4IkKR-V.js

@@ -1,2 +1,2 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./web-DmHJbQPa.js","./index-BytpYHOU.js","./index-OQmtzryQ.css"])))=>i.map(i=>d[i]);
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./web-CAumy6rT.js","./index-DHLkCnnx.js","./index-BuZbSc5_.css"])))=>i.map(i=>d[i]);
-import{r as s,_ as i}from"./index-BytpYHOU.js";var t;(function(e){e.Documents="DOCUMENTS",e.Data="DATA",e.Library="LIBRARY",e.Cache="CACHE",e.External="EXTERNAL",e.ExternalStorage="EXTERNAL_STORAGE"})(t||(t={}));var a;(function(e){e.UTF8="utf8",e.ASCII="ascii",e.UTF16="utf16"})(a||(a={}));const E=s("Filesystem",{web:()=>i(()=>import("./web-DmHJbQPa.js"),__vite__mapDeps([0,1,2]),import.meta.url).then(e=>new e.FilesystemWeb)});export{t as Directory,a as Encoding,E as Filesystem};
+import{r as s,_ as i}from"./index-DHLkCnnx.js";var t;(function(e){e.Documents="DOCUMENTS",e.Data="DATA",e.Library="LIBRARY",e.Cache="CACHE",e.External="EXTERNAL",e.ExternalStorage="EXTERNAL_STORAGE"})(t||(t={}));var a;(function(e){e.UTF8="utf8",e.ASCII="ascii",e.UTF16="utf16"})(a||(a={}));const E=s("Filesystem",{web:()=>i(()=>import("./web-CAumy6rT.js"),__vite__mapDeps([0,1,2]),import.meta.url).then(e=>new e.FilesystemWeb)});export{t as Directory,a as Encoding,E as Filesystem};

intern-log/dist/index.html

@@ -8,8 +8,8 @@
     <link rel="icon" href="./icons/icon.svg" type="image/svg+xml" />
     <link rel="apple-touch-icon" href="./icons/icon-192.png" />
     <title>实习工作日志</title>
-    <script type="module" crossorigin src="./assets/index-BytpYHOU.js"></script>
+    <script type="module" crossorigin src="./assets/index-DHLkCnnx.js"></script>
-    <link rel="stylesheet" crossorigin href="./assets/index-OQmtzryQ.css">
+    <link rel="stylesheet" crossorigin href="./assets/index-BuZbSc5_.css">
   </head>
   <body>
     <div id="app"></div>

intern-log/package.json

@@ -1,7 +1,7 @@
 {
   "name": "intern-log",
   "private": true,
-  "version": "0.6.3",
+  "version": "0.6.4",
   "type": "module",
   "scripts": {
     "dev": "vite",

intern-log/src/App.vue

@@ -743,14 +743,16 @@ onMounted(async () => {
   .mob-search-btn { display: flex; }
   .topbar-actions { margin-left: auto; gap: 6px; }
   .week-tip { height: 28px; max-width: 118px; padding: 0 8px; white-space: nowrap; overflow: hidden; }
-  .topbar-actions .btn { padding: 0 10px; height: 32px; }
+  .topbar-actions .btn { padding: 0 12px; height: 34px; }
   .topbar-actions .btn .num { font-size: 12px; }
 
   .tabbar { display: flex; }
+  .tab-btn { height: 56px; font-size: 11px; }
+  .tab-btn .icon { width: 22px; height: 22px; }
   .content { flex: 1; min-height: 0; }
   .content-inner {
     max-width: none;
-    padding: 12px 12px calc(70px + env(safe-area-inset-bottom));
+    padding: 12px 12px calc(78px + env(safe-area-inset-bottom));
   }
 
   .toast-wrap {

intern-log/src/components/TimerPanel.vue

@@ -147,7 +147,7 @@ onUnmounted(() => {
   .tp {
     left: 12px;
     right: 12px;
-    bottom: calc(66px + env(safe-area-inset-bottom));
+    bottom: calc(64px + env(safe-area-inset-bottom));
     max-width: none;
   }
 }

intern-log/src/components/TransactionDialog.vue

@@ -163,4 +163,8 @@ function save() {
 .dialog { width: 480px; }
 .add-cat { display: flex; gap: 6px; margin-top: 6px; }
 .add-cat-input { flex: 1; height: 28px; font-size: 12px; }
+@media (max-width: 720px) {
+  .add-cat-input { height: 34px; }
+  .add-cat .btn { height: 34px; }
+}
 </style>

intern-log/src/components/log/DayPanel.vue

@@ -452,7 +452,15 @@ async function confirmDelete() {
 }
 .dp-foot { margin-top: 10px; font-size: 12px; text-align: right; }
 
-@media (max-width: 560px) {
+@media (max-width: 720px) {
-  .att-grid { grid-template-columns: 1fr; }
+  .dp-head { margin-bottom: 10px; }
+  .att-grid { grid-template-columns: 1fr 1fr; gap: 10px 12px; }
+  .att-cell label { margin-bottom: 3px; }
+  .att-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
+  .att-actions .btn { width: 100%; }
+  .edit-row { flex-wrap: wrap; }
+  .edit-row .time-input { width: 100%; flex: 1 1 100%; }
+  .edit-row .btn { flex: 1; }
+  .item-main { gap: 6px; }
 }
 </style>

intern-log/src/styles/mobile.css

@@ -1,11 +1,40 @@
 /* ============================================================
-   手机端（<=720px）全局适配：作用于各视图与弹窗组件
+   手机端（<=720px）全局适配
-   （App.vue 的壳层样式是 scoped，跨组件规则统一放这里，便于集中管理）
+   原则：触控目标 ≥30px（按钮 32-36 / 输入 38 / 弹窗主按钮 40）、
+   板块两列优先避免过度堆叠、内容优先密度适中
    ============================================================ */
 
 @media (max-width: 720px) {
-  /* 卡片在窄屏贴边、圆角略收 */
+  /* ---------- 触控基线 ---------- */
+  .btn { height: 36px; padding: 0 14px; }
+  .btn-sm { height: 32px; padding: 0 12px; }
+  .btn-xs { height: 30px; padding: 0 12px; }
+  .icon-btn { width: 34px; height: 34px; }
+  .seg-btn { height: 34px; padding: 0 13px; }
+  .input, .select { height: 38px; padding: 0 12px; }
+  .textarea { min-height: 76px; padding: 10px 12px; }
+  .toggle-btn { height: 38px; }
+  .tag { height: 24px; line-height: 22px; padding: 0 9px; }
+  .dot { width: 7px; height: 7px; }
+
+  /* ---------- 弹窗：近全屏 + 大按钮 ---------- */
+  .dialog {
+    width: calc(100vw - 16px) !important;
+    max-width: calc(100vw - 16px) !important;
+    max-height: 90vh;
+    max-height: 90dvh;
+  }
+  .dialog-head { padding: 14px 16px 10px !important; }
+  .dialog-body { padding: 14px 16px !important; }
+  .dialog-btns { padding: 10px 16px calc(12px + env(safe-area-inset-bottom)) !important; gap: 10px; }
+  .dialog-btns .btn { flex: 1; height: 40px; }
+  .form-grid { grid-template-columns: 1fr !important; }
+
+  /* ---------- 卡片与分区 ---------- */
   .card { border-radius: 12px; }
+  .section, .sec { padding: 12px; }
+  .stat-num { font-size: 20px; }
+  .empty { padding: 22px 12px; }
 
   input.input, select.select, textarea.textarea {
     width: 100%;
@@ -13,20 +42,7 @@
   }
   .btn { touch-action: manipulation; }
 
-  /* ---------- 弹窗：窄屏近全屏 ---------- */
+  /* ---------- 日历当日抽屉：底部抽屉 ---------- */
-  .dialog {
-    width: calc(100vw - 20px) !important;
-    max-width: calc(100vw - 20px) !important;
-    max-height: 88vh;
-    max-height: 88dvh;
-  }
-  .dialog-head { padding: 14px 16px 10px !important; }
-  .dialog-body { padding: 14px 16px !important; }
-  .dialog-btns { padding: 10px 16px 14px !important; }
-  .dialog-btns .btn { flex: 1; }
-  .form-grid { grid-template-columns: 1fr !important; }
-
-  /* ---------- 日历当日抽屉：改为底部抽屉 ---------- */
   .drawer {
     top: auto !important;
     left: 0 !important;
@@ -42,7 +58,7 @@
   .drawer-head { border-radius: 14px 14px 0 0; }
   .drawer-body { padding: 12px !important; }
 
-  /* ---------- 记账表格：卡片行（带行内标签），手机上不横滚 ---------- */
+  /* ---------- 记账表格：卡片行（带行内标签） ---------- */
   .tx-table { min-width: 0 !important; }
   .tx-table thead { display: none !important; }
   .tx-table tr { display: block; padding: 10px 12px; border-bottom: 1px solid var(--border); background: transparent; }
@@ -63,11 +79,12 @@
     flex: none;
   }
   .tx-table td.ops-cell::before { content: none; }
-  .tx-table td.ops-cell { justify-content: flex-end; }
+  .tx-table td.ops-cell { justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
+  .tx-table td.ops-cell .btn { flex: none; }
   .tx-table td.empty { justify-content: center; }
   .tx-table td.empty::before { content: none !important; }
 
-  /* ---------- 密码库等其余宽表：横向滚动 ---------- */
+  /* ---------- 密码库等宽表：横滚 + 工具栏堆叠 ---------- */
   .table-card, .tx-card { overflow-x: auto; }
   .cred-table { min-width: 560px !important; }
   .th-ops { width: auto !important; }
@@ -79,15 +96,13 @@
   /* ---------- 统计卡两列 ---------- */
   .cards { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
   .stat-card { padding: 12px 14px !important; }
-  .stat-num { font-size: 19px !important; }
 
-  /* ---------- 分区与栅格收窄 ---------- */
+  /* ---------- 分区与栅格 ---------- */
-  .section, .sec { padding: 12px 12px !important; }
   .rule-grid { grid-template-columns: 1fr !important; }
   .two-col { grid-template-columns: 1fr !important; }
 
-  /* ---------- 日历格子收窄 ---------- */
+  /* ---------- 日历格子 ---------- */
-  .cal-toolbar { margin-bottom: 8px; }
+  .cal-toolbar { margin-bottom: 10px; }
-  .cal-cell { min-height: 54px !important; padding: 4px 5px !important; }
+  .cal-cell { min-height: 58px !important; padding: 5px 6px !important; }
-  .cal-marks { margin-top: 3px !important; height: 12px !important; gap: 3px !important; }
+  .cal-marks { margin-top: 4px !important; height: 14px !important; gap: 4px !important; }
 }

intern-log/src/views/CalendarView.vue

@@ -200,9 +200,7 @@ watch(focusDate, d => {
 .drawer-enter-from, .drawer-leave-to { opacity: 0; }
 
 @media (max-width: 720px) {
-  .cal-cell { min-height: 60px; padding: 4px 5px; }
   .cal-title { min-width: 76px; font-size: 13px; }
-  .cal-marks { gap: 3px; margin-top: 4px; height: 12px; }
   .drawer { width: 100%; }
 }
 </style>

intern-log/src/views/LedgerView.vue

@@ -332,7 +332,11 @@ async function confirmDelete() {
 .table-card { overflow-x: auto; }
 .table-note { margin-top: 10px; font-size: 12px; text-align: right; }
 
-@media (max-width: 560px) {
+@media (max-width: 720px) {
-  .ledger-toolbar .w-filter { flex: 1; min-width: 0; width: auto; }
+  .ledger-toolbar { gap: 8px; }
+  .ledger-toolbar .flex1 { display: none; }
+  .month-title { min-width: 0; flex: 1; text-align: left; }
+  .w-filter { flex: 1 1 calc(50% - 4px); min-width: 0; width: auto; }
+  .ledger-toolbar .btn-primary { flex: 1 1 100%; order: 9; }
 }
 </style>

intern-log/src/views/MemoView.vue

@@ -248,8 +248,11 @@ function fmtTime(s: string): string {
 }
 
 @media (max-width: 800px) {
-  .memo-page { grid-template-columns: 1fr; }
+  .memo-page { grid-template-columns: 1fr; gap: 10px; }
-  .memo-list { max-height: 240px; }
+  .memo-list { max-height: 210px; }
-  .content-textarea { min-height: 240px; }
+  .content-textarea { min-height: 260px; }
+  .title-input { height: 38px; }
+  .editor-foot { flex-wrap: wrap; }
+  .editor-foot .btn { flex: 1; min-height: 34px; }
 }
 </style>

intern-log/src/views/PlanView.vue

@@ -459,8 +459,19 @@ function weekday(s: string): string {
 .goal-hint { font-size: 12px; margin-top: 8px; }
 
 @media (max-width: 720px) {
-  .plan-item { flex-wrap: wrap; }
+  .blk-head { margin: 0 0 10px; }
-  .pi-ops { width: 100%; justify-content: flex-start; }
+  .day-head { margin-top: 16px; }
   .day-ops { width: 100%; }
+  .day-ops .btn { flex: 1; min-width: 0; }
+  .day-ops .btn-primary { flex: 1.5; }
+  .date-chip { min-width: 64px; }
+  .plan-item { flex-wrap: wrap; padding: 12px; gap: 10px; }
+  .pi-time { min-width: 0; padding-top: 0; }
+  .pi-ops { width: 100%; justify-content: flex-start; gap: 8px; }
+  .pi-ops .btn-xs { flex: 1; min-height: 32px; }
+  .goal-card { position: relative; flex-direction: column; gap: 8px; }
+  .goal-main { padding-right: 0; }
+  .goal-line { padding-right: 72px; }
+  .goal-ops { position: absolute; top: 10px; right: 8px; }
 }
 </style>

intern-log/src/views/ReportView.vue

@@ -228,4 +228,11 @@ function undoPolish() {
 @media (max-width: 960px) {
   .report-grid { grid-template-columns: 1fr; }
 }
+@media (max-width: 720px) {
+  .report-toolbar { gap: 8px; }
+  .report-toolbar .seg { flex: 1 1 100%; display: flex; }
+  .report-toolbar .seg-btn { flex: 1; }
+  .w-date { flex: 1; min-width: 0; width: auto; }
+  .md-editor { min-height: 300px; }
+}
 </style>

intern-log/src/views/TodayView.vue

@@ -138,8 +138,13 @@ watch(date, d => { expStart.value = d; if (expRange.value === 'custom') expEnd.v
 
 @media (max-width: 720px) {
   .tool-sep { display: none; }
-  .nav-row { flex: 1; }
+  .toolbar { padding: 10px 12px; gap: 10px; }
+  .nav-row { flex: 1 1 100%; }
   .date-title { min-width: 0; flex: 1; text-align: left; }
   .w-date { flex: 1; min-width: 120px; width: auto; }
+  .exp-row { width: 100%; }
+  .exp-row .seg { flex: 1; display: flex; }
+  .exp-row .seg-btn { flex: 1; padding: 0 6px; }
+  .w-exp { flex: 1; min-width: 0; width: auto; }
 }
 </style>