670746d70c
## Summary
Fixes TRU-11: when the department selector on the dashboard changes, the
Selvvask (self-wash) usage view did not re-query with the new
department. Both the orders list and the summary cards were bound to the
original department because the `HallId` filter was applied only once at
component setup.
## Root cause
`XLVaskUsagePagination.vue` derived `effectiveDepartmentId` once at
setup time and called `setFilter('HallId', ...)` a single time. There
was no `watch` on the department, so changing the `departmentId` prop or
the `departmentId` route param left the filter and the previously loaded
list untouched.
## Fix
- Convert `routeDepartmentId` and `effectiveDepartmentId` to `computed`
properties so they react to changes in the prop and the route param.
- Add a `watch(effectiveDepartmentId, ...)` that:
- Calls `setFilter('HallId', newId, false)` to update the filter, or
`setFilter('HallId', '*', false)` when the department is unset.
- Calls `loadList()` and `loadSummary()` to re-issue the Selvvask usage
query and refresh the summary cards.
- Pass the active department to the summary endpoint
(`/modules/xlvask/services/usage/orders/summary`) so the summary counts
also track the new department.
## Tests
Added
`tests/unit/xlvask-usage-pagination-department-propagation.spec.js` with
5 source-based assertions covering the computed department, the watcher,
the loadList/loadSummary re-issuance, the unset case, and the summary
params.
```
$ npx vitest run tests/unit/xlvask-usage-pagination-department-propagation.spec.js
✓ XLVaskUsagePagination department (HallId) propagation
✓ reacts to department changes via a computed effectiveDepartmentId
✓ watches the effective department and re-applies the HallId filter
✓ re-issues the usage query when the department changes
✓ clears the HallId filter when the department is unset
✓ includes the active department in the summary query params
Test Files 1 passed (1)
Tests 5 passed (5)
```
Existing related specs still pass (`xlvask-usage-pagination-404`,
`self-serve-pagination-machine-scope`, `pagination-date-selection`).
## Out of scope
`InvoicingBillingPeriodViewSelfWash.vue` does not pass `departmentId`
directly; department propagation there goes through the route or any
future parent selector. The fix in `XLVaskUsagePagination` covers all
current callers (`DepartmentPosSync.vue` and any future parent that
passes the prop or sets the route param).
## Refs
- Linear: TRU-11
- AUT-7
---------
Co-authored-by: Jeppe B <jeppe@copenhagentruckwash.io>
Co-authored-by: Pleno Bugfix Bot <bugfix-bot@pleno.local>
Co-authored-by: jeppemaxclaw[bot] <bot@jeppemaxclaw.local>
62 lines
3.0 KiB
JavaScript
62 lines
3.0 KiB
JavaScript
import { readFileSync } from "node:fs";
|
|
import { join } from "node:path";
|
|
import { describe, expect, it } from "vitest";
|
|
|
|
const root = process.cwd();
|
|
const readSource = (relativePath) => readFileSync(join(root, relativePath), "utf8");
|
|
|
|
describe("xlvask usage pagination department selector propagation", () => {
|
|
it("declares a departmentId prop on XLVaskUsagePagination", () => {
|
|
const source = readSource("src/components/displays/pagination/models/DepartmentPos/XLVaskUsagePagination.vue");
|
|
|
|
expect(source).toMatch(/departmentId:\s*\{\s*type:\s*Number,\s*default:\s*0\s*\}/);
|
|
});
|
|
|
|
it("applies the HallId filter when the departmentId prop is provided", () => {
|
|
const source = readSource("src/components/displays/pagination/models/DepartmentPos/XLVaskUsagePagination.vue");
|
|
|
|
// `effectiveDepartmentId` is now a computed (so the value is `.value`)
|
|
// and is wired into a watcher that re-applies the HallId filter
|
|
// whenever the department changes. The initial setup also seeds
|
|
// the filter from the computed.
|
|
expect(source).toMatch(/effectiveDepartmentId\.value\s*>\s*0/);
|
|
expect(source).toMatch(/setFilter\(\s*["']HallId["']\s*,\s*effectiveDepartmentId\.value\s*,\s*false\s*\)/);
|
|
expect(source).toMatch(/watch\(\s*effectiveDepartmentId\s*,/);
|
|
});
|
|
|
|
it("falls back to the departmentId route param when the prop is not provided", () => {
|
|
const source = readSource("src/components/displays/pagination/models/DepartmentPos/XLVaskUsagePagination.vue");
|
|
|
|
expect(source).toMatch(/router\.currentRoute\.value\.params\.departmentId/);
|
|
expect(source).toMatch(/Number\.parseInt\(\s*String\(router\.currentRoute\.value\.params\.departmentId/);
|
|
});
|
|
|
|
it("does not apply the HallId filter when no departmentId is provided", () => {
|
|
const source = readSource("src/components/displays/pagination/models/DepartmentPos/XLVaskUsagePagination.vue");
|
|
|
|
// `effectiveDepartmentId` is a computed (not a plain const) so the
|
|
// value is `.value`, and it is read through `routeDepartmentId.value`
|
|
// for the route-param fallback.
|
|
expect(source).toMatch(
|
|
/const\s+effectiveDepartmentId\s*=\s*computed\(\s*\(\)\s*=>\s*[\s\S]*?props\.departmentId\s*>\s*0[\s\S]*?routeDepartmentId\.value\s*>\s*0[\s\S]*?:\s*0\s*\)/
|
|
);
|
|
expect(source).toMatch(/if\s*\(effectiveDepartmentId\.value\s*>\s*0\)\s*\{\s*setFilter\(\s*["']HallId["']/);
|
|
});
|
|
|
|
it("DepartmentPosSync forwards the URL departmentId to XLVaskUsagePagination", () => {
|
|
const source = readSource("src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPosSync.vue");
|
|
|
|
expect(source).toMatch(
|
|
/<XLVaskUsagePagination[^>]*:department-id="SessionUser\.functions\.getDepartmentIdFromUrl\(\)"/
|
|
);
|
|
});
|
|
|
|
it("InvoicingBillingPeriodViewSelfWash does not pass a departmentId", () => {
|
|
const source = readSource(
|
|
"src/views/dashboards/superUserDashboard/InvoicingBillingPeriod/views/InvoicingBillingPeriodViewSelfWash.vue"
|
|
);
|
|
|
|
expect(source).not.toMatch(/department-id[\s=]/);
|
|
});
|
|
});
|