MIF7 移动信息架构整改收口

这个提交包含在:
2026-05-13 00:02:21 +08:00
父节点 39a930399f
当前提交 c83dbb7376
共修改 10 个文件,包含 691 行新增和 206 行删除
@@ -3,11 +3,11 @@ import path from "node:path";
import { expect, test, type Browser, type Page, type Route } from "@playwright/test";
const ROOT_DIR = path.resolve(process.cwd(), "..");
const SCREENSHOT_DIR = path.join(ROOT_DIR, "output/playwright/mobile-oa-information-dedupe-governance");
const SCREENSHOT_DIR = path.join(ROOT_DIR, "output/playwright/mobile-ia-flow-remediation");
const IOS_WECOM_UA =
"Mozilla/5.0 (iPhone; CPU iPhone OS 16_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148 wxwork/4.1.20 MicroMessenger/8.0.1 Language/zh_CN";
type RolePreset = "employee" | "manager";
type RolePreset = "employee" | "manager" | "finance" | "admin";
type MockNotification = {
id: string;
@@ -38,17 +38,25 @@ function screenshotPath(fileName: string) {
}
function buildMe(role: RolePreset) {
const roleMeta: Record<RolePreset, { employeeNo: string; name: string; email: string; roleCodes: string[] }> = {
employee: { employeeNo: "E-DG7", name: "测试员工", email: "[email protected]", roleCodes: ["employee"] },
manager: { employeeNo: "M-DG7", name: "测试审批人", email: "[email protected]", roleCodes: ["manager"] },
finance: { employeeNo: "F-DG7", name: "测试财务", email: "[email protected]", roleCodes: ["finance"] },
admin: { employeeNo: "A-DG7", name: "测试管理员", email: "[email protected]", roleCodes: ["admin"] },
};
const meta = roleMeta[role];
return {
id: `employee-dg7-${role}`,
employeeNo: role === "manager" ? "M-DG7" : "E-DG7",
name: role === "manager" ? "测试审批人" : "测试员工",
employeeNo: meta.employeeNo,
name: meta.name,
phone: "13800000000",
email: `${role}@hyinda.com`,
email: meta.email,
departmentId: "dept-dg7",
directManagerId: role === "manager" ? null : "employee-dg7-manager",
status: "active",
notificationPushEnabled: true,
roleCodes: role === "manager" ? ["manager"] : ["employee"],
roleCodes: meta.roleCodes,
profileCompleteness: {
hasEmergencyContact: true,
hasBankAccount: true,
@@ -337,6 +345,81 @@ function reimbursementListItem() {
};
}
function reimbursementDetail() {
return {
...reimbursementListItem(),
submitterId: "employee-dg7-employee",
ownerId: "employee-dg7-employee",
departmentId: "dept-dg7",
department: { id: "dept-dg7", name: "研发部" },
submittedAt: "2026-05-12T08:00:00.000Z",
projectId: null,
linkedTravelRequestId: null,
linkedTravelRequest: null,
invoices: [
{
id: "invoice-dg7",
status: "bound",
invoiceCode: "044001900111",
invoiceNumber: "12345678",
invoiceDate: "2026-05-10",
sellerName: "测试供应商",
totalAmount: "168.00",
originalName: "发票.pdf",
linkedItemId: "item-dg7",
},
],
attachments: [
{
id: "attachment-reimbursement-dg7",
originalName: "报销说明.pdf",
mimeType: "application/pdf",
fileSize: 20480,
fileSha256: "sha256-dg7",
uploadedBy: { id: "employee-dg7-employee", name: "测试员工", employeeNo: "E-DG7" },
createdAt: "2026-05-12T08:05:00.000Z",
},
],
budgetHint: null,
workflowProgress: {
currentStepIndex: 1,
totalSteps: 2,
steps: [
{ id: "step-submit", name: "提交", status: "completed" },
{ id: "step-dg7", name: "主管审批", status: "current" },
],
},
approvalHistory: [
{
id: "history-reimbursement-dg7",
taskId: "task-dg7",
actorName: "测试审批人",
action: "submit",
comment: "提交审批",
stepName: "提交",
createdAt: "2026-05-12T08:00:00.000Z",
},
],
riskFlags: [],
items: [
{
id: "item-dg7",
expenseTypeId: "expense-type-dg7",
expenseDate: "2026-05-12",
amount: "168.00",
description: "差旅报销",
expenseType: {
id: "expense-type-dg7",
code: "travel",
name: "交通费",
category: "travel",
enabled: true,
},
},
],
};
}
async function mockApis(page: Page, role: RolePreset, notifications: MockNotification[]) {
await page.route((url) => url.pathname.startsWith("/api/"), async (route) => {
const request = route.request();
@@ -409,6 +492,7 @@ async function mockApis(page: Page, role: RolePreset, notifications: MockNotific
}
if (pathName === "/api/portal/home") {
const isFinance = role === "finance";
await fulfillJson(route, {
workspace: { id: "workspace-dg7", persisted: true, profile: "small_team_internal" },
greeting: { name: buildMe(role).name },
@@ -418,6 +502,22 @@ async function mockApis(page: Page, role: RolePreset, notifications: MockNotific
riskSummary: null,
announcements: [],
quickLinks: [],
roleCapabilities: {
canSubmitApplications: role !== "admin",
canApproveTasks: role === "manager" || role === "finance",
canUseFinance: isFinance,
canManageSystem: role === "admin",
canViewTeam: role === "manager",
isAdminOnly: role === "admin",
},
financeSummary: isFinance
? {
pendingBatchCount: 2,
failedItemCount: 1,
riskCount: 3,
href: "/ap-operations",
}
: null,
recentActivities: [],
});
return;
@@ -511,6 +611,26 @@ async function mockApis(page: Page, role: RolePreset, notifications: MockNotific
return;
}
if (pathName === "/api/reimbursements/reimbursement-dg7" && request.method() === "GET") {
await fulfillJson(route, reimbursementDetail());
return;
}
if (pathName === "/api/expense-types") {
await fulfillJson(route, {
items: [
{
id: "expense-type-dg7",
code: "travel",
name: "交通费",
category: "travel",
enabled: true,
},
],
});
return;
}
if (pathName === "/api/leave-types") {
await fulfillJson(route, { items: [leaveType] });
return;
@@ -621,9 +741,9 @@ async function expectNoMobileShellRegression(page: Page) {
async function expectActionTileGapStable(page: Page) {
const gaps = await page.evaluate(() =>
Array.from(document.querySelectorAll<HTMLElement>("[data-testid='mobile-action-grid'] a")).map((tile) => {
const icon = tile.querySelector<HTMLElement>("[data-testid$='-icon']");
const label = tile.querySelector<HTMLElement>("[data-testid$='-label']");
Array.from(document.querySelectorAll<HTMLElement>("[data-testid='mobile-action-grid'] .mobile-icon-action")).map((tile) => {
const icon = tile.querySelector<HTMLElement>(".mobile-icon-action__icon");
const label = tile.querySelector<HTMLElement>(".mobile-icon-action__label");
if (!icon || !label) return null;
return label.getBoundingClientRect().top - icon.getBoundingClientRect().bottom;
}).filter((value): value is number => value !== null),
@@ -634,10 +754,27 @@ async function expectActionTileGapStable(page: Page) {
}
}
test.describe("DG7 移动信息架构与展示去重治理", () => {
test.skip(process.env.E2E_MODE === "live", "DG7 本地专项使用 mock 数据验证信息架构。");
async function expectCommonActionsDoNotDuplicateBottomTabs(page: Page) {
const labels = await page.evaluate(() => ({
actions: Array.from(document.querySelectorAll("[data-testid^='mobile-action-'][data-testid$='-label']"))
.map((item) => item.textContent?.trim())
.filter(Boolean),
bottomTabs: Array.from(document.querySelectorAll("[data-testid^='mobile-nav-'][data-testid$='-label']"))
.map((item) => item.textContent?.trim())
.filter(Boolean),
}));
expect(labels.actions).not.toContain("首页");
expect(labels.actions).not.toContain("审批");
expect(labels.actions).not.toContain("进度");
expect(labels.actions).not.toContain("报销");
expect(labels.actions).not.toContain("我的");
expect(labels.actions.filter((label) => labels.bottomTabs.includes(label)).length).toBe(0);
}
test("普通员工底部入口变为进度视角,首页宫格间距在多视口稳定", async ({ browser }) => {
test.describe("MIF7 移动信息架构整改", () => {
test.skip(process.env.E2E_MODE === "live", "MIF7 本地专项使用 mock 数据验证信息架构。");
test("首页常用入口不重复底部 Tab,员工进度页按状态分标签", async ({ browser }) => {
for (const width of [320, 360, 375, 390, 393, 414, 430]) {
const notifications = buildNotifications();
const mobile = await newMobilePage(browser, width);
@@ -647,14 +784,21 @@ test.describe("DG7 移动信息架构与展示去重治理", () => {
await mobile.page.goto("/mobile");
await expect(mobile.page.getByTestId("mobile-nav-approvals-label")).toHaveText("进度");
await expect(mobile.page.getByTestId("mobile-action-approvals-label")).toHaveText("进度");
await expect(mobile.page.getByTestId("mobile-action-approvals-label")).toHaveCount(0);
await expect(mobile.page.getByTestId("mobile-pending-summary")).toHaveCount(0);
await expect(mobile.page.getByTestId("mobile-action-grid")).toBeVisible();
await expectCommonActionsDoNotDuplicateBottomTabs(mobile.page);
await expectActionTileGapStable(mobile.page);
await expectNoMobileShellRegression(mobile.page);
await mobile.page.screenshot({ path: screenshotPath(`home-employee-w${width}`), fullPage: true });
await mobile.page.getByTestId("mobile-nav-approvals").click();
await expect(mobile.page).toHaveURL(/\/mobile\/approvals$/);
await expect(mobile.page.getByTestId("mobile-approvals-progress")).toBeVisible();
await expect(mobile.page.getByTestId("mobile-progress-tab-draft")).toBeVisible();
await expect(mobile.page.getByTestId("mobile-progress-tab-reviewing")).toBeVisible();
await expect(mobile.page.getByTestId("mobile-progress-tab-approved")).toBeVisible();
await expect(mobile.page.getByTestId("mobile-progress-tab-returned")).toBeVisible();
await expect(mobile.page.getByTestId("mobile-approvals-list")).toHaveCount(0);
await expect(mobile.page.getByTestId("mobile-approvals-approve")).toHaveCount(0);
await expect(mobile.page.getByTestId("mobile-approval-progress-card")).toHaveCount(3);
@@ -666,7 +810,7 @@ test.describe("DG7 移动信息架构与展示去重治理", () => {
}
});
test("审批人首页只保留一处待办摘要,审批详情使用 Push 页并隐藏底部 Tab", async ({ browser }) => {
test("审批人首页只保留轻待办摘要,审批页按待我审批和已处理分组", async ({ browser }) => {
const notifications = buildNotifications();
const mobile = await newMobilePage(browser, 390);
try {
@@ -677,7 +821,12 @@ test.describe("DG7 移动信息架构与展示去重治理", () => {
await expect(mobile.page.getByTestId("mobile-nav-approvals-label")).toHaveText("审批");
await expect(mobile.page.getByTestId("mobile-pending-summary")).toHaveCount(1);
await expect(mobile.page.getByTestId("mobile-notifications")).not.toContainText("报销待审批");
await expect(mobile.page.getByTestId("mobile-action-approvals")).not.toContainText("待批");
await expect(mobile.page.getByTestId("mobile-action-approvals")).toHaveCount(0);
await expectCommonActionsDoNotDuplicateBottomTabs(mobile.page);
await expect(mobile.page.getByTestId("mobile-pending-summary-count")).toHaveText("1");
await expect(mobile.page.getByTestId("mobile-pending-summary-primary")).toHaveCount(1);
await expect(mobile.page.getByRole("link", { name: "查看全部待办" })).toBeVisible();
await mobile.page.screenshot({ path: screenshotPath("home-manager-pending-summary"), fullPage: true });
const badgeMetrics = await mobile.page.evaluate(() => {
const nav = document.querySelector<HTMLElement>("[data-testid='mobile-nav-approvals']");
@@ -706,37 +855,121 @@ test.describe("DG7 移动信息架构与展示去重治理", () => {
await expect(mobile.page.getByTestId("mobile-approvals-detail")).toContainText("报销单 BX20260512001");
await expectNoMobileShellRegression(mobile.page);
await mobile.page.screenshot({ path: screenshotPath("manager-approval-push-detail"), fullPage: true });
await mobile.page.getByTestId("mobile-approvals-detail-header").getByRole("button", { name: "返回" }).click();
await expect(mobile.page).toHaveURL(/\/mobile$/);
await mobile.page.goto("/mobile/approvals");
await expect(mobile.page.getByRole("tab", { name: "待我审批" })).toBeVisible();
await expect(mobile.page.getByRole("tab", { name: "已处理" })).toBeVisible();
await mobile.page.screenshot({ path: screenshotPath("approver-task-tabs"), fullPage: true });
} finally {
await mobile.context.close();
}
});
test("通知中心点击通知直达请假和采购详情,不再回到通知列表或首页", async ({ browser }) => {
test("通知中心事件化,点击通知直达业务详情且返回来源页", async ({ browser }) => {
const notifications = buildNotifications();
const mobile = await newMobilePage(browser, 390);
try {
await mockApis(mobile.page, "employee", notifications);
await loginForMobile(mobile.page, "employee");
await mobile.page.goto("/mobile");
await expect(mobile.page.getByTestId("mobile-home-notification-card")).toHaveCount(3);
await mobile.page.getByTestId("mobile-home-notification-card").filter({ hasText: "采购已通过" }).click();
await expect(mobile.page).toHaveURL(/\/mobile\/purchase-requests\/purchase-dg7-approved$/);
await expect(mobile.page.getByTestId("mobile-purchase-detail-header")).toBeVisible();
await mobile.page.getByTestId("mobile-purchase-detail-header").getByRole("button", { name: "返回" }).click();
await expect(mobile.page).toHaveURL(/\/mobile$/);
await mobile.page.goto("/mobile/notifications");
await expect(mobile.page.getByTestId("mobile-notification-card")).toHaveCount(3);
await expect(mobile.page.getByTestId("mobile-notification-card").first()).toContainText("事件");
await expect(mobile.page.getByTestId("mobile-approvals-approve")).toHaveCount(0);
await expect(mobile.page.getByTestId("mobile-approvals-reject")).toHaveCount(0);
await mobile.page.screenshot({ path: screenshotPath("notifications-event-inbox"), fullPage: true });
await mobile.page.getByTestId("mobile-notification-card").filter({ hasText: "采购已通过" }).click();
await expect(mobile.page).toHaveURL(/\/mobile\/purchase-requests\/purchase-dg7-approved$/);
await expect(mobile.page.getByTestId("mobile-purchase-detail-header")).toBeVisible();
await expect(mobile.page.getByTestId("mobile-purchase-detail-summary")).toBeVisible();
await expect(mobile.page.getByTestId("mobile-bottom-nav")).toHaveCount(0);
await expectNoMobileShellRegression(mobile.page);
await mobile.page.screenshot({ path: screenshotPath("purchase-detail-shell"), fullPage: true });
await mobile.page.getByTestId("mobile-purchase-detail-header").getByRole("button", { name: "返回" }).click();
await expect(mobile.page).toHaveURL(/\/mobile\/notifications/);
await mobile.page.goto("/mobile/notifications");
await mobile.page.getByTestId("mobile-notification-card").filter({ hasText: "请假已通过" }).click();
await expect(mobile.page).toHaveURL(/\/mobile\/leave\/leave-dg7-approved$/);
await expect(mobile.page.getByTestId("mobile-leave-detail-header")).toBeVisible();
await expect(mobile.page.getByTestId("mobile-leave-record-card")).toBeVisible();
await expect(mobile.page.getByTestId("mobile-leave-form")).toHaveCount(0);
await expect(mobile.page.getByTestId("mobile-bottom-nav")).toHaveCount(0);
await expectNoMobileShellRegression(mobile.page);
await mobile.page.screenshot({ path: screenshotPath("notification-direct-leave-detail"), fullPage: true });
await mobile.page.getByTestId("mobile-leave-detail-header").getByRole("button", { name: "返回" }).click();
await expect(mobile.page).toHaveURL(/\/mobile\/notifications/);
} finally {
await mobile.context.close();
}
});
test("报销详情统一详情壳,直接进入请假详情返回进度标签", async ({ browser }) => {
const notifications = buildNotifications();
const mobile = await newMobilePage(browser, 390);
try {
await mockApis(mobile.page, "employee", notifications);
await loginForMobile(mobile.page, "employee");
await mobile.page.goto("/mobile/reimbursements/reimbursement-dg7");
await expect(mobile.page.getByTestId("mobile-reimbursement-detail-header")).toBeVisible();
await expect(mobile.page.getByTestId("mobile-bottom-nav")).toHaveCount(0);
const sectionOrder = await mobile.page.evaluate(() =>
[
"mobile-reimbursement-items",
"mobile-reimbursement-attachments",
"mobile-reimbursement-approval-history",
].map((testId) => document.querySelector(`[data-testid='${testId}']`)?.getBoundingClientRect().top ?? -1),
);
expect(sectionOrder[0]).toBeLessThan(sectionOrder[1]);
expect(sectionOrder[1]).toBeLessThan(sectionOrder[2]);
await expectNoMobileShellRegression(mobile.page);
await mobile.page.screenshot({ path: screenshotPath("reimbursement-detail-shell"), fullPage: true });
await mobile.page.goto("/mobile/leave/leave-dg7-approved");
await expect(mobile.page.getByTestId("mobile-leave-detail-header")).toBeVisible();
await mobile.page.getByTestId("mobile-leave-detail-header").getByRole("button", { name: "返回" }).click();
await expect(mobile.page).toHaveURL(/\/mobile\/approvals\?progress=approved/);
await expect(mobile.page.getByTestId("mobile-leave-form")).toHaveCount(0);
} finally {
await mobile.context.close();
}
});
test("财务首页角色化摘要只对财务角色展示", async ({ browser }) => {
const financeMobile = await newMobilePage(browser, 390);
try {
await mockApis(financeMobile.page, "finance", buildNotifications());
await loginForMobile(financeMobile.page, "finance");
await financeMobile.page.goto("/mobile");
await expect(financeMobile.page.getByTestId("mobile-finance-summary")).toBeVisible();
await expect(financeMobile.page.getByTestId("mobile-finance-summary")).toContainText("待付款");
await expect(financeMobile.page.getByTestId("mobile-finance-summary")).toContainText("台账/导出");
await expectNoMobileShellRegression(financeMobile.page);
await financeMobile.page.screenshot({ path: screenshotPath("home-finance-summary"), fullPage: true });
} finally {
await financeMobile.context.close();
}
const adminMobile = await newMobilePage(browser, 390);
try {
await mockApis(adminMobile.page, "admin", buildNotifications());
await loginForMobile(adminMobile.page, "admin");
await adminMobile.page.goto("/mobile");
await expect(adminMobile.page.getByTestId("mobile-finance-summary")).toHaveCount(0);
} finally {
await adminMobile.context.close();
}
});
});