feat: 计划模式(时间段+打卡+计时时钟) / 工作详情范围导出 / 工作与记账分类自定义(含历史迁移)

intern-log/src/views/SettingsView.vue

@@ -7,10 +7,11 @@ import {
   listAttendanceBetween, listLogItemsBetween, listProjects,
   renameProject, saveLocationPresets, setProjectArchived, setSetting, type WorkRule
 } from '../db/repo'
-import { categoryLabel, type Project } from '../db/schema'
+import { type Project } from '../db/schema'
+import { getLogCategories, setLogCategories, getLedgerCategories, setLedgerCategories } from '../db/categories'
 import { downloadText, } from '../lib/download'
 import { downloadCsv } from '../lib/csv'
-import { hhmm, parseDateStr, todayStr } from '../lib/date'
+import { addDays, hhmm, parseDateStr, todayStr, weekStart } from '../lib/date'
 import { computeDay } from '../domain/attendance'
 import { changeLoginPassword, deleteCurrentUser, getSession } from '../db/auth'
 import { ensureCloudBinding, getSyncLastTime, isSyncConfigured, syncWithStoredConfig, syncLastError, type SyncResult } from '../sync/engine'
@@ -27,6 +28,85 @@ const aiKey = ref('')
 const aiModel = ref('')
 const editingId = ref<number | null>(null)
 const editName = ref('')
+// ---- 分类管理 ----
+const logCats = ref<string[]>([])
+const expenseCats = ref<string[]>([])
+const incomeCats = ref<string[]>([])
+const editingCat = ref<{ kind: 'log' | 'expense' | 'income'; index: number; value: string } | null>(null)
+
+async function loadCategories() {
+  logCats.value = await getLogCategories()
+  expenseCats.value = await getLedgerCategories('expense')
+  incomeCats.value = await getLedgerCategories('income')
+}
+async function addCat(kind: 'log' | 'expense' | 'income') {
+  const name = window.prompt('新分类名称')
+  if (!name || !name.trim()) return
+  const list = kind === 'log' ? logCats.value : kind === 'expense' ? expenseCats.value : incomeCats.value
+  const clean = name.trim()
+  if (list.includes(clean)) { showToast('分类已存在'); return }
+  const next = [...list, clean]
+  if (kind === 'log') { logCats.value = next; await setLogCategories(next) }
+  else if (kind === 'expense') { expenseCats.value = next; await setLedgerCategories('expense', next) }
+  else { incomeCats.value = next; await setLedgerCategories('income', next) }
+  showToast('分类已添加')
+}
+async function renameCat(kind: 'log' | 'expense' | 'income', index: number, oldName: string) {
+  const name = window.prompt('修改分类名称', oldName)
+  if (!name || !name.trim() || name.trim() === oldName) return
+  const list = kind === 'log' ? logCats.value : kind === 'expense' ? expenseCats.value : incomeCats.value
+  const next = list.map((x, i) => (i === index ? name.trim() : x))
+  if (kind === 'log') { logCats.value = next; await setLogCategories(next) }
+  else if (kind === 'expense') { expenseCats.value = next; await setLedgerCategories('expense', next) }
+  else { incomeCats.value = next; await setLedgerCategories('income', next) }
+  showToast('分类已更新（历史记录自动跟随显示）')
+}
+async function removeCat(kind: 'log' | 'expense' | 'income', index: number) {
+  const list = kind === 'log' ? logCats.value : kind === 'expense' ? expenseCats.value : incomeCats.value
+  if (list.length <= 1) { showToast('至少保留一个分类'); return }
+  if (!window.confirm('删除分类「' + list[index] + '」？历史记录不受影响。')) return
+  const next = list.filter((_, i) => i !== index)
+  if (kind === 'log') { logCats.value = next; await setLogCategories(next) }
+  else if (kind === 'expense') { expenseCats.value = next; await setLedgerCategories('expense', next) }
+  else { incomeCats.value = next; await setLedgerCategories('income', next) }
+  showToast('分类已删除')
+}
+
+// ---- 工作详情范围导出 ----
+const expRange = ref<'day' | 'week' | 'month' | 'custom'>('day')
+const expStart = ref(todayStr())
+const expEnd = ref(todayStr())
+function rangeStartEnd(): { start: string; end: string; label: string } {
+  const t = todayStr()
+  if (expRange.value === 'day') return { start: expStart.value, end: expStart.value, label: expStart.value }
+  if (expRange.value === 'week') { const ws = weekStart(expStart.value); return { start: ws, end: addDays(ws, 6), label: ws + ' ~ ' + addDays(ws, 6) } }
+  if (expRange.value === 'month') { const y = expStart.value.slice(0, 4); const m = expStart.value.slice(5, 7); const last = new Date(Number(y), Number(m), 0).getDate(); return { start: y + '-' + m + '-01', end: y + '-' + m + '-' + last, label: y + '-' + m } }
+  return { start: expStart.value, end: expEnd.value, label: expStart.value + ' ~ ' + expEnd.value }
+}
+async function doExportRange() {
+  const { start, end, label } = rangeStartEnd()
+  const found = await Promise.all([listLogItemsBetween(start, end), listProjects(true)])
+  const items = found[0]
+  const projects = found[1]
+  const pmap = new Map<number, string>(projects.map(p => [p.id as number, p.name]))
+  const rows: (string | number | null)[][] = [['日期', '分类', '项目', '内容', '耗时(分钟)', '成果', '待跟进', '收获', '备注']]
+  for (const it of items) {
+    rows.push([
+      it.date,
+      categoryLabel(it.category),
+      it.project_id ? (pmap.get(it.project_id) || '') : '',
+      it.content,
+      it.minutes == null ? '' : it.minutes,
+      it.is_milestone ? '是' : '',
+      it.needs_followup ? '是' : '',
+      it.takeaway || '',
+      it.remark || ''
+    ])
+  }
+  const file = '工作详情_' + label.replace(/[~s]/g, '_') + '.csv'
+  const p = await downloadCsv(file, rows)
+  showToast(p ? '已导出：' + p : '已导出到系统下载目录（' + items.length + ' 条）')
+}
 const fileInput = ref<HTMLInputElement | null>(null)
 const pendingImport = ref<{ name: string; text: string } | null>(null)
 const importError = ref('')
@@ -109,6 +189,7 @@ async function load() {
   aiKey.value = await getSetting('ai_api_key', '')
   aiModel.value = await getSetting('ai_model', '')
   await loadSyncInfo()
+  await loadCategories()
 }
 
 async function saveAi() {
@@ -375,6 +456,64 @@ async function doImport() {
       </div>
     </div>
 
+    <div class="card section">
+      <div class="section-title">工作分类</div>
+<div class="cat-block">
+        <div class="cat-head"><span class="muted">工作记录分类</span><button class="btn btn-xs" @click="addCat('log')">添加</button></div>
+        <div class="cat-chips">
+          <span v-for="(c, i) in logCats" :key="c + i" class="cat-chip">
+            {{ c }}
+            <button class="chip-btn" title="修改" @click="renameCat('log', i, c)">改</button>
+            <button class="chip-btn" title="删除" @click="removeCat('log', i)">删</button>
+          </span>
+        </div>
+      </div>
+      <div class="cat-block">
+        <div class="cat-head"><span class="muted">记账支出分类</span><button class="btn btn-xs" @click="addCat('expense')">添加</button></div>
+        <div class="cat-chips">
+          <span v-for="(c, i) in expenseCats" :key="c + i" class="cat-chip">
+            {{ c }}
+            <button class="chip-btn" title="修改" @click="renameCat('expense', i, c)">改</button>
+            <button class="chip-btn" title="删除" @click="removeCat('expense', i)">删</button>
+          </span>
+        </div>
+      </div>
+      <div class="cat-block">
+        <div class="cat-head"><span class="muted">记账收入分类</span><button class="btn btn-xs" @click="addCat('income')">添加</button></div>
+        <div class="cat-chips">
+          <span v-for="(c, i) in incomeCats" :key="c + i" class="cat-chip">
+            {{ c }}
+            <button class="chip-btn" title="修改" @click="renameCat('income', i, c)">改</button>
+            <button class="chip-btn" title="删除" @click="removeCat('income', i)">删</button>
+          </span>
+        </div>
+      </div>
+    </div>
+
+    <div class="card section">
+      <div class="section-title">工作详情导出</div>
+      <div class="seg">
+        <button class="seg-btn" :class="{ active: expRange === 'day' }" @click="expRange = 'day'">当日</button>
+        <button class="seg-btn" :class="{ active: expRange === 'week' }" @click="expRange = 'week'">当周</button>
+        <button class="seg-btn" :class="{ active: expRange === 'month' }" @click="expRange = 'month'">当月</button>
+        <button class="seg-btn" :class="{ active: expRange === 'custom' }" @click="expRange = 'custom'">自定义</button>
+      </div>
+      <div class="exp-dates">
+        <template v-if="expRange === 'custom'">
+          <input class="input" type="date" v-model="expStart" />
+          <span class="muted">至</span>
+          <input class="input" type="date" v-model="expEnd" />
+        </template>
+        <template v-else>
+          <input class="input" type="date" v-model="expStart" />
+          <span class="muted loc-note">{{ expRange === 'day' ? '导出该日' : expRange === 'week' ? '导出该日期所在一周' : '导出该日期所在月份' }}</span>
+        </template>
+      </div>
+      <div class="rule-save">
+        <button class="btn btn-primary btn-sm" @click="doExportRange">导出 CSV</button>
+      </div>
+    </div>
+
     <div class="card section">
       <div class="section-title">数据备份</div>
       <div class="backup-row">
@@ -434,6 +573,21 @@ async function doImport() {
 .loc-note { font-size: 12px; }
 .ai-grid { display: flex; flex-direction: column; gap: 10px; }
 .backup-row { display: flex; gap: 8px; }
+.cat-block { margin-top: 10px; }
+.cat-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; font-size: 12px; }
+.cat-chips { display: flex; flex-wrap: wrap; gap: 6px; }
+.cat-chip {
+  display: inline-flex; align-items: center; gap: 4px;
+  border: 1px solid var(--border); border-radius: 999px;
+  padding: 2px 8px; font-size: 12px;
+}
+.chip-btn { border: none; background: transparent; color: var(--text-3); cursor: pointer; font-size: 11px; padding: 0 1px; }
+.chip-btn:hover { color: var(--accent); }
+.exp-dates { display: flex; align-items: center; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
+.exp-dates .input { width: 150px; }
+.seg { display: inline-flex; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); overflow: hidden; }
+.seg-btn { border: none; background: var(--bg-page); color: var(--text-2); cursor: pointer; font-size: 12px; padding: 5px 12px; }
+.seg-btn.active { background: var(--accent-bg); color: var(--accent); }
 .import-error { color: var(--danger); font-size: 12px; margin-top: 8px; }
 .backup-note { font-size: 12px; margin-top: 10px; }
 </style>