create-windy 0.2.33 → 0.3.0

package/template/apps/web/src/pages/system/audit-time-range.ts

@@ -0,0 +1,28 @@
+export function localMinuteToIso(
+  value: string,
+  boundary: "start" | "end",
+): string | undefined {
+  const match =
+    /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2})$/.exec(value.trim());
+  if (!match) return undefined;
+  const [, year, month, day, hour, minute] = match;
+  const local = new Date(
+    Number(year),
+    Number(month) - 1,
+    Number(day),
+    Number(hour),
+    Number(minute),
+    boundary === "end" ? 59 : 0,
+    boundary === "end" ? 999 : 0,
+  );
+  if (
+    local.getFullYear() !== Number(year) ||
+    local.getMonth() !== Number(month) - 1 ||
+    local.getDate() !== Number(day) ||
+    local.getHours() !== Number(hour) ||
+    local.getMinutes() !== Number(minute)
+  ) {
+    return undefined;
+  }
+  return local.toISOString();
+}

package/template/apps/web/src/pages/system/components/AuditActionCell.vue

@@ -1,13 +1,9 @@
 <script setup lang="ts">
 import { computed } from "vue";
 import { AUDIT_ACTION_DEFINITIONS } from "@southwind-ai/shared";
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipTrigger,
-} from "@/components/ui/tooltip";
 import { useAccessSnapshot } from "@/composables/useAccessSnapshot";
 import type { SystemRecord } from "@/services/system-api";
+import { auditOperationSummary } from "../audit-log-presenter";
 
 const props = defineProps<{
   item: SystemRecord;
@@ -22,71 +18,16 @@ const actionCatalog = computed(
 const definition = computed(() =>
   actionCatalog.value.find((item) => item.key === props.actionKey),
 );
-const target = computed(() => record(props.item.target));
-const metadata = computed(() => record(props.item.metadata));
-const details = computed(() => {
-  const values: string[] = [];
-  const message = text(props.item.message);
-  if (message) values.push(`补充说明：${message}`);
-  const targetLabel = text(target.value.label);
-  const targetType = text(target.value.type);
-  const targetId = text(target.value.id);
-  if (targetLabel || targetType || targetId) {
-    values.push(
-      `操作对象：${targetLabel || targetType || "未标注"}${targetId ? `（${targetId}）` : ""}`,
-    );
-  }
-  const query = text(metadata.value.query);
-  if (query) values.push(`搜索内容：${query}`);
-  const matched = metadata.value.matched;
-  if (typeof matched === "number") values.push(`匹配结果：${matched} 条`);
-  const enabled = metadata.value.enabled;
-  if (typeof enabled === "boolean") {
-    values.push(`开关状态：${enabled ? "已启用" : "已停用"}`);
-  }
-  const visible = text(metadata.value.visible);
-  if (visible) {
-    values.push(`入口可见性：${visible === "hidden" ? "隐藏" : "显示"}`);
-  }
-  if (Object.hasOwn(metadata.value, "licenseVersionOverride")) {
-    values.push(formatLicenseScope(metadata.value.licenseVersionOverride));
-  }
-  return values;
-});
-
-function record(value: unknown): Record<string, unknown> {
-  return value && typeof value === "object" && !Array.isArray(value)
-    ? (value as Record<string, unknown>)
-    : {};
-}
-
-function text(value: unknown): string | undefined {
-  return typeof value === "string" && value.trim() ? value.trim() : undefined;
-}
-
-function formatLicenseScope(value: unknown): string {
-  if (value === null) return "License 范围：跟随模块默认设置";
-  if (!Array.isArray(value) || value.length === 0) {
-    return "License 范围：基础能力（不限制版本）";
-  }
-  return `License 范围：${value.map(String).join("、")}`;
-}
+const summary = computed(() =>
+  auditOperationSummary(props.item, definition.value?.label),
+);
 </script>
 
 <template>
-  <Tooltip>
-    <TooltipTrigger as-child>
-      <button
-        type="button"
-        class="cursor-help text-left underline decoration-dotted underline-offset-4"
-      >
-        {{ definition?.label || key }}
-      </button>
-    </TooltipTrigger>
-    <TooltipContent class="max-w-sm flex-col items-start gap-1 p-3">
-      <p><span class="opacity-70">Key：</span>{{ key }}</p>
-      <p>{{ definition?.description || "平台记录的自定义审计动作。" }}</p>
-      <p v-for="detail in details" :key="detail">{{ detail }}</p>
-    </TooltipContent>
-  </Tooltip>
+  <div class="min-w-48 max-w-md space-y-1">
+    <p class="font-medium">{{ definition?.label || key }}</p>
+    <p class="line-clamp-2 break-words text-xs text-muted-foreground">
+      {{ summary }}
+    </p>
+  </div>
 </template>

package/template/apps/web/src/pages/system/components/AuditActionCell.webtest.ts

@@ -3,7 +3,7 @@ import { mount } from "@vue/test-utils";
 import AuditActionCell from "./AuditActionCell.vue";
 
 describe("AuditActionCell", () => {
-  test("显示中文动作名，并在组件库 Tooltip 中解释 key、对象和搜索内容", () => {
+  test("直接显示中文动作名和稳定的搜索操作摘要", () => {
     const wrapper = mount(AuditActionCell, {
       props: {
         actionKey: "data.search",
@@ -14,28 +14,13 @@ describe("AuditActionCell", () => {
           metadata: { query: "张三", matched: 2 },
         },
       },
-      global: {
-        stubs: {
-          Tooltip: { template: "<div><slot /></div>" },
-          TooltipTrigger: { template: "<div><slot /></div>" },
-          TooltipContent: {
-            template: '<div data-testid="tooltip-content"><slot /></div>',
-          },
-        },
-      },
     });
 
-    expect(wrapper.get("button").text()).toBe("数据搜索");
-    expect(wrapper.get("button").attributes("title")).toBeUndefined();
-    expect(wrapper.get('[data-testid="tooltip-content"]').text()).toContain(
-      "Key：data.search",
-    );
-    expect(wrapper.text()).toContain("操作对象：users");
-    expect(wrapper.text()).toContain("搜索内容：张三");
-    expect(wrapper.text()).toContain("匹配结果：2 条");
+    expect(wrapper.text()).toContain("数据搜索");
+    expect(wrapper.text()).toContain("搜索 users：张三");
   });
 
-  test("功能开关变更说明状态、可见性和 License 范围", () => {
+  test("功能开关变更给出启停与对象摘要", () => {
     const wrapper = mount(AuditActionCell, {
       props: {
         actionKey: "feature.update",
@@ -50,17 +35,25 @@ describe("AuditActionCell", () => {
           },
         },
       },
-      global: {
-        stubs: {
-          Tooltip: { template: "<div><slot /></div>" },
-          TooltipTrigger: { template: "<div><slot /></div>" },
-          TooltipContent: { template: "<div><slot /></div>" },
+    });
+
+    expect(wrapper.text()).toContain("停用 features（system.audit）");
+  });
+
+  test("未知业务动作保留 key、对象和已记录上下文", () => {
+    const wrapper = mount(AuditActionCell, {
+      props: {
+        actionKey: "case.review.complete",
+        item: {
+          id: "audit_unknown",
+          action: "case.review.complete",
+          target: { type: "case", id: "case_1", label: "案件甲" },
+          message: "完成人工复核",
         },
       },
     });
 
-    expect(wrapper.text()).toContain("开关状态：已停用");
-    expect(wrapper.text()).toContain("入口可见性：隐藏");
-    expect(wrapper.text()).toContain("License 范围：advanced");
+    expect(wrapper.text()).toContain("case.review.complete");
+    expect(wrapper.text()).toContain("完成人工复核；对象：案件甲");
   });
 });

package/template/apps/web/src/pages/system/components/AuditLogDetailDialog.vue

@@ -0,0 +1,134 @@
+<script setup lang="ts">
+import { computed } from "vue";
+import { AUDIT_ACTION_DEFINITIONS } from "@southwind-ai/shared";
+import { Button } from "@/components/ui/button";
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { useAccessSnapshot } from "@/composables/useAccessSnapshot";
+import { formatDateTime } from "@/lib/date-time";
+import type { SystemRecord } from "@/services/system-api";
+import {
+  auditActorLabel,
+  auditOperationSummary,
+  auditOutcomeLabel,
+  auditRecord,
+  auditTargetLabel,
+  auditText,
+  formatAuditMetadata,
+} from "../audit-log-presenter";
+
+const props = defineProps<{ item?: SystemRecord }>();
+const open = defineModel<boolean>("open", { required: true });
+const access = useAccessSnapshot();
+const catalog = computed(
+  () => access.snapshot.value?.auditActionCatalog || AUDIT_ACTION_DEFINITIONS,
+);
+const definition = computed(() =>
+  catalog.value.find(({ key }) => key === props.item?.action),
+);
+const actor = computed(() => auditRecord(props.item?.actor));
+const actionKey = computed(() => auditText(props.item?.action) || "unknown");
+const actionLabel = computed(() => definition.value?.label || actionKey.value);
+const summary = computed(() =>
+  props.item
+    ? auditOperationSummary(props.item, actionLabel.value)
+    : "未记录",
+);
+
+function value(value: unknown): string {
+  return auditText(value) || "未记录";
+}
+</script>
+
+<template>
+  <Dialog v-model:open="open">
+    <DialogContent class="max-h-[85vh] max-w-3xl overflow-y-auto">
+      <DialogHeader>
+        <DialogTitle>审计日志详情</DialogTitle>
+        <DialogDescription>
+          展示服务端已经脱敏并持久化的审计事实；未记录的信息不会推断补全。
+        </DialogDescription>
+      </DialogHeader>
+
+      <dl v-if="item" class="grid gap-x-6 gap-y-4 text-sm sm:grid-cols-2">
+        <div class="sm:col-span-2">
+          <dt class="text-muted-foreground">具体操作</dt>
+          <dd class="mt-1 break-words font-medium">{{ summary }}</dd>
+        </div>
+        <div>
+          <dt class="text-muted-foreground">动作</dt>
+          <dd class="mt-1 break-words">
+            {{ actionLabel }}（{{ actionKey }}）
+          </dd>
+        </div>
+        <div>
+          <dt class="text-muted-foreground">结果</dt>
+          <dd class="mt-1">{{ auditOutcomeLabel(item.outcome) }}</dd>
+        </div>
+        <div class="sm:col-span-2">
+          <dt class="text-muted-foreground">动作说明</dt>
+          <dd class="mt-1 break-words">
+            {{ definition?.description || "未记录该自定义动作的说明。" }}
+          </dd>
+        </div>
+        <div>
+          <dt class="text-muted-foreground">操作者</dt>
+          <dd class="mt-1 break-words">{{ auditActorLabel(item) }}</dd>
+        </div>
+        <div>
+          <dt class="text-muted-foreground">IP</dt>
+          <dd class="mt-1 break-all">{{ value(actor.ip) }}</dd>
+        </div>
+        <div>
+          <dt class="text-muted-foreground">时间</dt>
+          <dd class="mt-1">{{ formatDateTime(item.occurredAt) }}</dd>
+        </div>
+        <div>
+          <dt class="text-muted-foreground">操作对象</dt>
+          <dd class="mt-1 break-words">{{ auditTargetLabel(item) }}</dd>
+        </div>
+        <div>
+          <dt class="text-muted-foreground">模块</dt>
+          <dd class="mt-1 break-all">{{ value(item.module) }}</dd>
+        </div>
+        <div>
+          <dt class="text-muted-foreground">Request ID</dt>
+          <dd class="mt-1 break-all">{{ value(item.requestId) }}</dd>
+        </div>
+        <div class="sm:col-span-2">
+          <dt class="text-muted-foreground">Message</dt>
+          <dd class="mt-1 whitespace-pre-wrap break-words">
+            {{ value(item.message) }}
+          </dd>
+        </div>
+        <div class="sm:col-span-2">
+          <dt class="text-muted-foreground">User-Agent</dt>
+          <dd class="mt-1 whitespace-pre-wrap break-all">
+            {{ value(actor.userAgent) }}
+          </dd>
+        </div>
+        <div class="sm:col-span-2">
+          <dt class="text-muted-foreground">Metadata（已脱敏）</dt>
+          <dd class="mt-1">
+            <pre
+              class="max-h-64 overflow-auto whitespace-pre-wrap break-all rounded-md bg-muted p-3 font-mono text-xs"
+            >{{ formatAuditMetadata(item.metadata) }}</pre>
+          </dd>
+        </div>
+      </dl>
+
+      <DialogFooter>
+        <DialogClose as-child>
+          <Button variant="outline">关闭</Button>
+        </DialogClose>
+      </DialogFooter>
+    </DialogContent>
+  </Dialog>
+</template>

package/template/apps/web/src/pages/system/components/AuditLogDetailDialog.webtest.ts

@@ -0,0 +1,76 @@
+import { flushPromises, mount } from "@vue/test-utils";
+import { afterEach, describe, expect, test } from "vitest";
+import AuditLogDetailDialog from "./AuditLogDetailDialog.vue";
+
+afterEach(() => {
+  document.body.innerHTML = "";
+});
+
+describe("审计日志详情", () => {
+  test("以纯文本展示 IP、来源、对象、上下文和已脱敏 metadata", async () => {
+    const wrapper = mount(AuditLogDetailDialog, {
+      props: {
+        open: true,
+        item: {
+          id: "audit_1",
+          action: "feature.update",
+          outcome: "success",
+          actor: {
+            id: "user_1",
+            name: "管理员",
+            ip: "203.0.113.8",
+            userAgent: "Windy-Browser/1.0",
+          },
+          target: {
+            type: "features",
+            id: "system.audit",
+            label: "审计日志",
+          },
+          occurredAt: "2026-07-20T01:15:00.000Z",
+          message: "更新功能策略",
+          module: "system",
+          requestId: "request_1",
+          metadata: {
+            enabled: true,
+            token: "[REDACTED]",
+            note: "<script>unsafe()</script>",
+          },
+        },
+      },
+      attachTo: document.body,
+    });
+    await flushPromises();
+
+    expect(document.body.textContent).toContain("审计日志详情");
+    expect(document.body.textContent).toContain("管理员（user_1）");
+    expect(document.body.textContent).toContain("203.0.113.8");
+    expect(document.body.textContent).toContain("Windy-Browser/1.0");
+    expect(document.body.textContent).toContain("审计日志（features / system.audit）");
+    expect(document.body.textContent).toContain("[REDACTED]");
+    expect(document.body.querySelector("script")).toBeNull();
+    wrapper.unmount();
+  });
+
+  test("未知动作和缺失字段使用明确 fallback", async () => {
+    const wrapper = mount(AuditLogDetailDialog, {
+      props: {
+        open: true,
+        item: {
+          id: "audit_unknown",
+          action: "case.review.complete",
+          outcome: "success",
+          actor: { id: "service_1", name: "案件服务" },
+          occurredAt: "2026-07-20T01:15:00.000Z",
+        },
+      },
+      attachTo: document.body,
+    });
+    await flushPromises();
+
+    expect(document.body.textContent).toContain("case.review.complete");
+    expect(document.body.textContent).toContain("未记录操作对象");
+    expect(document.body.textContent).toContain("IP");
+    expect(document.body.textContent).toContain("未记录");
+    wrapper.unmount();
+  });
+});

package/template/apps/web/src/pages/system/components/AuditLogFilters.vue

@@ -1,6 +1,10 @@
 <script setup lang="ts">
 import { computed, onMounted, shallowRef, watch } from "vue";
 import { AUDIT_ACTION_DEFINITIONS } from "@southwind-ai/shared";
+import { SearchIcon, XIcon } from "@lucide/vue";
+import { Button } from "@/components/ui/button";
+import { Checkbox } from "@/components/ui/checkbox";
+import { Input } from "@/components/ui/input";
 import {
   Select,
   SelectContent,
@@ -8,20 +12,28 @@ import {
   SelectTrigger,
   SelectValue,
 } from "@/components/ui/select";
-import { Checkbox } from "@/components/ui/checkbox";
 import { useAccessSnapshot } from "@/composables/useAccessSnapshot";
 import { listSystemResource, type SystemRecord } from "@/services/system-api";
+import { localMinuteToIso } from "../audit-time-range";
+
+export interface AuditLogFilterValue {
+  q?: string;
+  actorId?: string;
+  action?: string;
+  occurredAfter?: string;
+  occurredBefore?: string;
+}
 
 const emit = defineEmits<{
-  change: [
-    filters: { actorId?: string; action?: string; occurredAfter?: string },
-  ];
+  change: [filters: AuditLogFilterValue];
   "export-options": [options: { includeScheduler: boolean }];
 }>();
 
+const keyword = shallowRef("");
 const actorId = shallowRef("all");
 const action = shallowRef("all");
-const timeRange = shallowRef("all");
+const occurredAfterLocal = shallowRef("");
+const occurredBeforeLocal = shallowRef("");
 const optionSource = shallowRef<SystemRecord[]>([]);
 const includeScheduler = shallowRef(false);
 const access = useAccessSnapshot();
@@ -53,66 +65,118 @@ onMounted(async () => {
   }
 });
 
-watch([actorId, action, timeRange], () => {
+watch(includeScheduler, (value) => {
+  emit("export-options", { includeScheduler: value });
+});
+
+function applyFilters() {
   emit("change", {
+    q: keyword.value.trim() || undefined,
     actorId: actorId.value === "all" ? undefined : actorId.value,
     action: action.value === "all" ? undefined : action.value,
-    occurredAfter: timeRangeStart(timeRange.value),
+    occurredAfter: localMinuteToIso(occurredAfterLocal.value, "start"),
+    occurredBefore: localMinuteToIso(occurredBeforeLocal.value, "end"),
   });
-});
+}
 
-watch(includeScheduler, (value) => {
-  emit("export-options", { includeScheduler: value });
-});
+function resetFilters() {
+  keyword.value = "";
+  actorId.value = "all";
+  action.value = "all";
+  occurredAfterLocal.value = "";
+  occurredBeforeLocal.value = "";
+  applyFilters();
+}
 
-function timeRangeStart(value: string) {
-  const duration = {
-    day: 24 * 60 * 60 * 1_000,
-    week: 7 * 24 * 60 * 60 * 1_000,
-    month: 30 * 24 * 60 * 60 * 1_000,
-  }[value];
-  return duration ? new Date(Date.now() - duration).toISOString() : undefined;
+function clearKeyword() {
+  keyword.value = "";
+  applyFilters();
 }
 </script>
 
 <template>
-  <div class="grid gap-3 md:grid-cols-3" data-testid="audit-filters">
-    <Select v-model="actorId">
-      <SelectTrigger aria-label="筛选操作者"><SelectValue /></SelectTrigger>
-      <SelectContent>
-        <SelectItem value="all">全部操作者</SelectItem>
-        <SelectItem v-for="actor in actors" :key="actor.id" :value="actor.id">
-          {{ actor.name }}（{{ actor.id }}）
-        </SelectItem>
-      </SelectContent>
-    </Select>
-
-    <Select v-model="action">
-      <SelectTrigger aria-label="筛选动作"><SelectValue /></SelectTrigger>
-      <SelectContent>
-        <SelectItem value="all">全部动作</SelectItem>
-        <SelectItem
-          v-for="definition in actionCatalog"
-          :key="definition.key"
-          :value="definition.key"
+  <form
+    class="space-y-3"
+    data-testid="audit-filters"
+    @submit.prevent="applyFilters"
+  >
+    <div class="grid gap-3 lg:grid-cols-2 xl:grid-cols-4">
+      <div class="flex gap-2">
+        <Input
+          v-model="keyword"
+          aria-label="审计关键字"
+          placeholder="搜索动作、操作者、对象、IP 或上下文"
+          maxlength="120"
+        />
+        <Button
+          v-if="keyword"
+          type="button"
+          variant="outline"
+          aria-label="清空审计关键字"
+          @click="clearKeyword"
         >
-          {{ definition.label }}（{{ definition.key }}）
-        </SelectItem>
-      </SelectContent>
-    </Select>
+          清空
+        </Button>
+      </div>
+      <Select v-model="actorId">
+        <SelectTrigger aria-label="筛选操作者"><SelectValue /></SelectTrigger>
+        <SelectContent>
+          <SelectItem value="all">全部操作者</SelectItem>
+          <SelectItem v-for="actor in actors" :key="actor.id" :value="actor.id">
+            {{ actor.name }}（{{ actor.id }}）
+          </SelectItem>
+        </SelectContent>
+      </Select>
+      <Select v-model="action">
+        <SelectTrigger aria-label="筛选动作"><SelectValue /></SelectTrigger>
+        <SelectContent>
+          <SelectItem value="all">全部动作</SelectItem>
+          <SelectItem
+            v-for="definition in actionCatalog"
+            :key="definition.key"
+            :value="definition.key"
+          >
+            {{ definition.label }}（{{ definition.key }}）
+          </SelectItem>
+        </SelectContent>
+      </Select>
+      <div class="flex gap-2">
+        <Button type="submit" class="flex-1">
+          <SearchIcon data-icon="inline-start" />
+          查询
+        </Button>
+        <Button type="button" variant="outline" @click="resetFilters">
+          <XIcon data-icon="inline-start" />
+          重置
+        </Button>
+      </div>
+    </div>
+
+    <div class="grid gap-3 md:grid-cols-2">
+      <label class="space-y-1 text-sm">
+        <span class="text-muted-foreground">开始时间（本地时间）</span>
+        <Input
+          v-model="occurredAfterLocal"
+          aria-label="审计开始时间"
+          type="datetime-local"
+          step="60"
+        />
+      </label>
+      <label class="space-y-1 text-sm">
+        <span class="text-muted-foreground">结束时间（本地时间）</span>
+        <Input
+          v-model="occurredBeforeLocal"
+          aria-label="审计结束时间"
+          type="datetime-local"
+          step="60"
+        />
+      </label>
+    </div>
+  </form>
 
-    <Select v-model="timeRange">
-      <SelectTrigger aria-label="筛选时间"><SelectValue /></SelectTrigger>
-      <SelectContent>
-        <SelectItem value="all">全部时间</SelectItem>
-        <SelectItem value="day">最近 24 小时</SelectItem>
-        <SelectItem value="week">最近 7 天</SelectItem>
-        <SelectItem value="month">最近 30 天</SelectItem>
-      </SelectContent>
-    </Select>
-  </div>
   <p class="text-xs text-muted-foreground">
-    操作者选项来自最近 100 条审计记录；动作名称和说明来自平台稳定动作目录。
+    起点按所选分钟的 00.000 秒计算，终点包含所选分钟至 59.999
+    秒；操作者选项来自最近 100 条审计记录。
   </p>
   <label class="flex w-fit items-center gap-2 text-sm">
     <Checkbox v-model="includeScheduler" aria-label="导出时包含定时器日志" />