create-windy 0.6.21 → 0.7.0

package/template/apps/web/src/pages/system/components/user-account/UserRoleSelector.vue

@@ -1,8 +1,9 @@
 <script setup lang="ts">
 import type { PermissionDefinition } from "@southwind-ai/shared";
-import { onMounted, shallowRef } from "vue";
-import { Checkbox } from "@/components/ui/checkbox";
-import { listSystemResource } from "@/services/system-api";
+import { computed, onMounted, shallowRef } from "vue";
+import PagedSelectionList from "../PagedSelectionList.vue";
+import { loadSelectionRecords } from "../selection-options";
+
 import RolePermissionSummary from "./RolePermissionSummary.vue";
 
 interface RoleOption {
@@ -28,13 +29,8 @@ async function loadRoles() {
   loading.value = true;
   error.value = "";
   try {
-    const result = await listSystemResource("roles", {
-      page: 1,
-      pageSize: 100,
-      status: "active",
-      sort: "name",
-    });
-    roles.value = result.items.flatMap((item) =>
+    const records = await loadSelectionRecords("roles");
+    roles.value = records.flatMap((item) =>
       typeof item.code === "string" && typeof item.name === "string"
         ? [
             {
@@ -62,11 +58,15 @@ async function loadRoles() {
   }
 }
 
-function toggle(id: string, checked: boolean | "indeterminate") {
-  const selected = new Set(props.modelValue);
-  if (checked === true) selected.add(id);
-  else selected.delete(id);
-  emit("update:modelValue", [...selected]);
+const options = computed(() =>
+  roles.value.map((role) => ({
+    id: role.id,
+    label: role.name,
+    description: `${role.code} · ${dataScopeLabel(role.dataScope)}`,
+  })),
+);
+function rolePermissions(id: string): string[] {
+  return roles.value.find((role) => role.id === id)?.permissionKeys || [];
 }
 
 function dataScopeLabel(scope: string): string {
@@ -81,52 +81,28 @@ function dataScopeLabel(scope: string): string {
     }[scope] || scope
   );
 }
+defineExpose({ reload: loadRoles });
 </script>
 
 <template>
   <div class="grid gap-2">
-    <div class="flex items-center justify-between gap-3">
-      <label class="text-sm font-medium">账号角色</label>
-      <span class="text-xs text-muted-foreground">至少选择一个</span>
-    </div>
-    <div class="grid gap-3 rounded-lg border p-3" aria-label="账号角色">
-      <p v-if="loading" class="text-sm text-muted-foreground">正在加载角色…</p>
-      <p v-else-if="error" class="text-sm text-destructive">
-        {{ error }}
-      </p>
-      <template v-else>
-        <article
-          v-for="role in roles"
-          :key="role.id"
-          class="rounded-lg border p-3 transition-colors"
-          :class="
-            modelValue.includes(role.id)
-              ? 'border-primary/50 bg-primary/5'
-              : 'hover:bg-muted/40'
-          "
-        >
-          <label class="flex cursor-pointer items-start gap-3">
-            <Checkbox
-              :model-value="modelValue.includes(role.id)"
-              :aria-label="role.name"
-              @update:model-value="toggle(role.id, $event)"
-            />
-            <span class="grid gap-0.5 text-sm">
-              <span class="font-medium">{{ role.name }}</span>
-              <span class="text-xs text-muted-foreground">
-                {{ role.code }} · {{ dataScopeLabel(role.dataScope) }}
-              </span>
-            </span>
-          </label>
-          <RolePermissionSummary
-            :permission-keys="role.permissionKeys"
-            :permissions="permissions"
-          />
-        </article>
-        <p v-if="!roles.length" class="text-sm text-muted-foreground">
-          暂无可选角色。
-        </p>
+    <label class="text-sm font-medium">账号角色（至少选择一个）</label>
+    <p v-if="loading" class="text-sm text-muted-foreground">正在加载角色…</p>
+    <p v-else-if="error" class="text-sm text-destructive">{{ error }}</p>
+    <PagedSelectionList
+      v-else
+      :items="options"
+      :model-value="modelValue"
+      label="账号角色"
+      multiple
+      @update:model-value="emit('update:modelValue', $event)"
+    >
+      <template #detail="{ id }">
+        <RolePermissionSummary
+          :permission-keys="rolePermissions(id)"
+          :permissions="permissions"
+        />
       </template>
-    </div>
+    </PagedSelectionList>
   </div>
 </template>

package/template/apps/web/src/pages/system/components/user-account/UserRoleSelector.webtest.ts

@@ -27,7 +27,7 @@ describe("UserRoleSelector", () => {
       ],
       total: 1,
       page: 1,
-      pageSize: 100,
+      pageSize: 10,
     });
     const wrapper = mount(UserRoleSelector, {
       props: {
@@ -58,15 +58,15 @@ describe("UserRoleSelector", () => {
 
     expect(api.list).toHaveBeenCalledWith(
       "roles",
-      expect.objectContaining({ status: "active", pageSize: 100 }),
+      expect.objectContaining({ status: "active", pageSize: 10 }),
     );
     expect(wrapper.text()).toContain("部门负责人");
     expect(wrapper.text()).toContain("本部门及下级");
     expect(wrapper.text()).toContain("查看 2 项功能权限");
     await wrapper.get("summary").trigger("click");
     expect(wrapper.text()).toContain("用户账号");
-    expect(wrapper.text()).toContain("查看用户、管理用户");
-    await wrapper.get('[role="checkbox"]').trigger("click");
+    expect(wrapper.text()).toContain("管理用户、查看用户");
+    await wrapper.get('input[type="checkbox"]').setValue(true);
     expect(wrapper.emitted("update:modelValue")?.at(-1)).toEqual([
       ["role_manager"],
     ]);

package/template/apps/web/src/pages/system/components/user-account/save-user-account.ts

@@ -18,9 +18,11 @@ export async function saveUserAccount(
   id: string | undefined,
   save: SaveResource,
   toast: AccountToast,
+  onAccountSaved?: (account: SystemRecord) => void,
+  requireInitialPassword = !id,
 ): Promise<SystemRecord | undefined> {
   const password = readPassword(payload.temporaryPassword);
-  if (!id && !password) {
+  if (requireInitialPassword && !password) {
     toast.error("请设置一次性初始密码", {
       description: "密码至少 12 个字符，创建后首次登录即可修改。",
     });
@@ -29,6 +31,7 @@ export async function saveUserAccount(
   const accountPayload = { ...payload };
   delete accountPayload.temporaryPassword;
   const saved = await save(accountPayload, id);
+  if (saved) onAccountSaved?.(saved);
   if (!saved || !password) return saved || undefined;
   try {
     await resetSystemUserPassword(saved.id, password);

package/template/apps/web/src/pages/system/components/user-account/user-account-draft.ts

@@ -0,0 +1,81 @@
+import type { SystemRecord } from "@/services/system-api";
+
+export function normalizeUserForm(
+  defaults: Record<string, unknown>,
+  item?: SystemRecord,
+): Record<string, unknown> {
+  const source = { ...defaults, ...(item || {}) };
+  const result: Record<string, unknown> = Object.fromEntries(
+    [
+      "username",
+      "displayName",
+      "phone",
+      "email",
+      "departmentId",
+      "roleIds",
+      "status",
+    ].map((key) => [key, source[key]]),
+  );
+  result.roleIds = Array.isArray(result.roleIds)
+    ? [...result.roleIds].sort()
+    : [];
+  result.temporaryPassword = "";
+  for (const key of ["email", "phone"]) {
+    const value = item?.[key];
+    result[key] =
+      value && typeof value === "object" && "value" in value
+        ? (value as Record<string, unknown>).value
+        : typeof value === "string"
+          ? value
+          : "";
+  }
+  return result;
+}
+
+export function isMaskedField(value: unknown): boolean {
+  return Boolean(
+    value &&
+    typeof value === "object" &&
+    ((value as Record<string, unknown>).kind === "masked" ||
+      (value as Record<string, unknown>).kind === "hidden"),
+  );
+}
+
+export function readString(value: unknown): string | undefined {
+  return typeof value === "string" ? value : undefined;
+}
+
+export function readError(value: unknown): string {
+  return value instanceof Error ? value.message : String(value);
+}
+
+export const accountFields = [
+  {
+    key: "username",
+    label: "用户名",
+    placeholder: "例如 zhangsan",
+    type: "text",
+    maxLength: 80,
+  },
+  {
+    key: "displayName",
+    label: "姓名",
+    placeholder: "例如 张三",
+    type: "text",
+    maxLength: 120,
+  },
+  {
+    key: "phone",
+    label: "手机号",
+    placeholder: "可选",
+    type: "tel",
+    maxLength: 32,
+  },
+  {
+    key: "email",
+    label: "邮箱",
+    placeholder: "可选",
+    type: "email",
+    maxLength: 160,
+  },
+] as const;

package/template/apps/web/src/pages/system/composables/useDepartmentTransitions.ts

@@ -13,16 +13,14 @@ export function useDepartmentTransitions(options: {
   async function disable(
     department: SystemRecord,
     targetDepartmentId: string | undefined,
+    updates?: Record<string, unknown>,
   ): Promise<boolean> {
-    if (!targetDepartmentId) {
-      toast.error("请选择迁移目标");
-      return false;
-    }
     return transition(
       department,
       "disable",
       targetDepartmentId,
-      "部门已停用，关联数据已迁移",
+      "部门资料已保存，关联数据已迁移并停用",
+      updates,
     );
   }
 
@@ -34,10 +32,6 @@ export function useDepartmentTransitions(options: {
       toast.error("平台唯一根组织不能删除");
       return false;
     }
-    if (!targetDepartmentId) {
-      toast.error("请选择迁移目标");
-      return false;
-    }
     return transition(
       department,
       "delete",
@@ -49,14 +43,16 @@ export function useDepartmentTransitions(options: {
   async function transition(
     department: SystemRecord,
     action: "disable" | "delete",
-    targetDepartmentId: string,
+    targetDepartmentId: string | undefined,
     successMessage: string,
+    updates?: Record<string, unknown>,
   ): Promise<boolean> {
     loading.value = true;
     try {
       await transitionDepartment(department.id, {
         action,
         targetDepartmentId,
+        ...(updates ? { updates } : {}),
       });
       await options.reload();
       toast.success(successMessage);

package/template/apps/web/src/pages/system/composables/useResourceEditor.ts

@@ -0,0 +1,72 @@
+import { shallowRef } from "vue";
+import type { SystemRecord } from "@/services/system-api";
+import { useAppToast } from "@/composables/useAppToast";
+import { saveUserAccount } from "../components/user-account/save-user-account";
+
+type SaveResource = (
+  payload: Record<string, unknown>,
+  id?: string,
+) => Promise<SystemRecord | false | undefined>;
+export function useResourceEditor(options: {
+  key: string;
+  save: SaveResource;
+  disable: (
+    item: SystemRecord,
+    target: string | undefined,
+    updates?: Record<string, unknown>,
+  ) => Promise<boolean>;
+  mutated: () => void;
+}) {
+  const open = shallowRef(false);
+  const item = shallowRef<SystemRecord>();
+  const savedAccountId = shallowRef<string>();
+  const loading = shallowRef(false);
+  const toast = useAppToast();
+  function edit(record?: SystemRecord) {
+    item.value = record;
+    savedAccountId.value = record?.id;
+    open.value = true;
+  }
+  async function submit(payload: Record<string, unknown>): Promise<boolean> {
+    if (loading.value) return false;
+    loading.value = true;
+    try {
+      const normalized = { ...payload };
+      delete normalized._transitionTargetDepartmentId;
+      if (
+        options.key === "departments" &&
+        item.value &&
+        item.value.status !== "disabled" &&
+        payload.status === "disabled"
+      ) {
+        const target =
+          typeof payload._transitionTargetDepartmentId === "string"
+            ? payload._transitionTargetDepartmentId
+            : undefined;
+        const updates: Record<string, unknown> = {};
+        for (const key of ["name", "code", "order", "parentId"]) {
+          if (Object.hasOwn(normalized, key)) updates[key] = normalized[key];
+        }
+        return await options.disable(item.value, target, updates);
+      }
+      const saved =
+        options.key === "users"
+          ? await saveUserAccount(
+              normalized,
+              savedAccountId.value,
+              options.save,
+              toast,
+              (record) => {
+                savedAccountId.value = record.id;
+              },
+              !item.value,
+            )
+          : await options.save(normalized, item.value?.id);
+      if (saved) options.mutated();
+      return Boolean(saved);
+    } finally {
+      loading.value = false;
+    }
+  }
+  return { open, item, loading, edit, submit };
+}

package/template/apps/web/src/pages/system/composables/useResourceEditor.webtest.ts

@@ -0,0 +1,110 @@
+import { describe, expect, test, vi } from "vitest";
+import { flushPromises } from "@vue/test-utils";
+import { useResourceEditor } from "./useResourceEditor";
+const api = vi.hoisted(() => ({ reset: vi.fn() }));
+vi.mock("@/services/system-api", async () => ({
+  ...(await vi.importActual<typeof import("@/services/system-api")>(
+    "@/services/system-api",
+  )),
+  resetSystemUserPassword: api.reset,
+}));
+vi.mock("@/composables/useAppToast", () => ({
+  useAppToast: () => ({ success: vi.fn(), error: vi.fn() }),
+}));
+const payload = {
+  username: "alice",
+  displayName: "小王",
+  departmentId: "dept_1",
+  roleIds: ["role_1"],
+  temporaryPassword: "TemporaryPass123",
+};
+
+describe("账户编辑保存闭环", () => {
+  test("初始密码失败后重试更新已创建账号，不再发起新增", async () => {
+    const save = vi
+      .fn()
+      .mockResolvedValue({ id: "user_created", username: "alice" });
+    api.reset
+      .mockRejectedValueOnce(new Error("暂时不可用"))
+      .mockResolvedValueOnce({ success: true });
+    const mutated = vi.fn();
+    const editor = useResourceEditor({
+      key: "users",
+      save,
+      disable: vi.fn(),
+      mutated,
+    });
+    editor.edit();
+    expect(await editor.submit(payload)).toBe(false);
+    expect(editor.open.value).toBe(true);
+    expect(editor.item.value).toBeUndefined();
+    expect(save.mock.calls[0]?.[1]).toBeUndefined();
+    expect(mutated).not.toHaveBeenCalled();
+    expect(await editor.submit(payload)).toBe(true);
+    expect(save.mock.calls[1]?.[1]).toBe("user_created");
+    expect(api.reset).toHaveBeenLastCalledWith(
+      "user_created",
+      payload.temporaryPassword,
+    );
+    expect(mutated).toHaveBeenCalledTimes(1);
+  });
+
+  test("资料保存结束后，密码请求仍保持loading且阻止重复提交", async () => {
+    let finishPassword: (() => void) | undefined;
+    api.reset.mockImplementationOnce(
+      () =>
+        new Promise<void>((resolve) => {
+          finishPassword = resolve;
+        }),
+    );
+    const save = vi.fn().mockResolvedValue({ id: "user_created" });
+    const editor = useResourceEditor({
+      key: "users",
+      save,
+      disable: vi.fn(),
+      mutated: vi.fn(),
+    });
+    editor.edit();
+    const saving = editor.submit(payload);
+    await flushPromises();
+    expect(editor.loading.value).toBe(true);
+    expect(await editor.submit(payload)).toBe(false);
+    expect(save).toHaveBeenCalledTimes(1);
+    finishPassword?.();
+    expect(await saving).toBe(true);
+    expect(editor.loading.value).toBe(false);
+  });
+
+  test("部门同时修改资料并停用，将资料放入同一迁移请求", async () => {
+    const disable = vi.fn().mockResolvedValue(true);
+    const save = vi.fn();
+    const editor = useResourceEditor({
+      key: "departments",
+      save,
+      disable,
+      mutated: vi.fn(),
+    });
+    const original = {
+      id: "dept_1",
+      name: "旧名称",
+      status: "active",
+      parentId: "root",
+    };
+    editor.edit(original);
+    const updates = {
+      name: "新名称",
+      code: "sales",
+      order: 25,
+      parentId: "root",
+    };
+    expect(
+      await editor.submit({
+        ...updates,
+        status: "disabled",
+        _transitionTargetDepartmentId: "dept_2",
+      }),
+    ).toBe(true);
+    expect(disable).toHaveBeenCalledWith(original, "dept_2", updates);
+    expect(save).not.toHaveBeenCalled();
+  });
+});

package/template/apps/web/src/pages/system/composables/useSystemResource.ts

@@ -12,6 +12,7 @@ import {
   exportSystemResource,
   importSystemResource,
   listSystemResource,
+  listDepartmentOrganization,
   type SystemRecord,
   updateSystemResource,
 } from "@/services/system-api";
@@ -42,6 +43,11 @@ export function useSystemResource(options: UseSystemResourceOptions) {
   const page = shallowRef(1);
   const pageSize = shallowRef(DEFAULT_PAGE_SIZE);
   const q = shallowRef("");
+  const identityFilters = shallowRef<{
+    departmentId?: string;
+    roleId?: string;
+    status?: string;
+  }>({});
   const status = shallowRef("");
   const auditFilters = shallowRef<SystemResourceFilters>(
     initialResourceFilters(options.apiResource),
@@ -68,10 +74,19 @@ export function useSystemResource(options: UseSystemResourceOptions) {
       toValue(options.importable) !== false,
   );
 
+  let reloadVersion = 0;
   async function reload() {
+    const requestVersion = ++reloadVersion;
     loading.value = true;
     error.value = "";
     try {
+      if (options.apiResource === "departments") {
+        const result = await listDepartmentOrganization();
+        if (requestVersion !== reloadVersion) return;
+        items.value = result.items;
+        total.value = result.total;
+        return;
+      }
       const result = await listSystemResource(options.apiResource, {
         page: page.value,
         pageSize: pageSize.value,
@@ -79,19 +94,22 @@ export function useSystemResource(options: UseSystemResourceOptions) {
         action: options.searchParameter === "action" ? q.value : undefined,
         ...auditFilters.value,
         status: status.value,
+        ...identityFilters.value,
         sort: toValue(options.sort) || "-updatedAt",
       });
+      if (requestVersion !== reloadVersion) return;
       items.value = result.items;
       total.value = result.total;
       page.value = result.page;
       pageSize.value = result.pageSize;
     } catch (currentError) {
+      if (requestVersion !== reloadVersion) return;
       error.value =
         currentError instanceof Error
           ? currentError.message
           : String(currentError);
     } finally {
-      loading.value = false;
+      if (requestVersion === reloadVersion) loading.value = false;
     }
   }
 
@@ -149,6 +167,7 @@ export function useSystemResource(options: UseSystemResourceOptions) {
         ...auditFilters.value,
         ...exportOptions.value,
         status: status.value,
+        ...identityFilters.value,
         sort: toValue(options.sort) || "-updatedAt",
       });
       downloadJson(filename, payload);
@@ -204,6 +223,12 @@ export function useSystemResource(options: UseSystemResourceOptions) {
     void reload();
   }
 
+  function setIdentityFilters(filters: typeof identityFilters.value) {
+    identityFilters.value = filters;
+    page.value = 1;
+    void reload();
+  }
+
   function setExportOptions(options: typeof exportOptions.value) {
     exportOptions.value = options;
   }
@@ -257,6 +282,7 @@ export function useSystemResource(options: UseSystemResourceOptions) {
     setKeyword,
     setStatus,
     setAuditFilters,
+    setIdentityFilters,
     setExportOptions,
     setPage,
     setPageSize,

package/template/apps/web/src/pages/system/resource-config.ts

@@ -73,6 +73,8 @@ export const systemResourceConfigs: Record<
       { key: "username", label: "用户名" },
       { key: "displayName", label: "姓名" },
       { key: "phone", label: "手机号", format: "governed-value" },
+      { key: "departmentName", label: "所属部门" },
+      { key: "roleNames", label: "角色" },
       { key: "status", label: "状态" },
     ],
     fields: [

package/template/apps/web/src/services/system-api.ts

@@ -17,6 +17,8 @@ export interface SystemListQuery {
   occurredAfter?: string;
   occurredBefore?: string;
   status?: string;
+  departmentId?: string;
+  roleId?: string;
   sort?: string;
   includeScheduler?: boolean;
 }
@@ -46,6 +48,8 @@ export function listSystemResource(resource: string, query: SystemListQuery) {
   if (query.occurredAfter) params.set("occurredAfter", query.occurredAfter);
   if (query.occurredBefore) params.set("occurredBefore", query.occurredBefore);
   if (query.status) params.set("status", query.status);
+  if (query.departmentId) params.set("departmentId", query.departmentId);
+  if (query.roleId) params.set("roleId", query.roleId);
   if (query.sort) params.set("sort", query.sort);
   if (query.includeScheduler) params.set("includeScheduler", "true");
   return apiRequest<ApiPage<SystemRecord>>(
@@ -63,6 +67,8 @@ export function exportSystemResource(resource: string, query: SystemListQuery) {
   if (query.occurredAfter) params.set("occurredAfter", query.occurredAfter);
   if (query.occurredBefore) params.set("occurredBefore", query.occurredBefore);
   if (query.status) params.set("status", query.status);
+  if (query.departmentId) params.set("departmentId", query.departmentId);
+  if (query.roleId) params.set("roleId", query.roleId);
   if (query.sort) params.set("sort", query.sort);
   if (query.includeScheduler) params.set("includeScheduler", "true");
   return apiRequest<SystemExportPayload>(
@@ -160,6 +166,7 @@ export function transitionDepartment(
   payload: {
     action: "disable" | "delete";
     targetDepartmentId?: string;
+    updates?: Record<string, unknown>;
   },
 ) {
   return apiRequest<{
@@ -172,3 +179,21 @@ export function transitionDepartment(
     body: JSON.stringify(payload),
   });
 }
+
+export function listDepartmentOrganization() {
+  return apiRequest<{ items: SystemRecord[]; total: number }>(
+    "/system/departments/organization",
+  );
+}
+
+export interface DepartmentTransitionPreview {
+  childDepartmentCount: number;
+  userCount: number;
+  roleCount: number;
+}
+
+export function previewDepartmentTransition(departmentId: string) {
+  return apiRequest<DepartmentTransitionPreview>(
+    `/system/departments/${departmentId}/transition-preview`,
+  );
+}