Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
693184244e |
+15
-236
@@ -6,39 +6,6 @@ on:
|
||||
branches:
|
||||
- master
|
||||
workflow_dispatch:
|
||||
inputs:
|
||||
mode:
|
||||
description: "What to run for a manual dispatch."
|
||||
required: true
|
||||
type: choice
|
||||
default: full
|
||||
options:
|
||||
- full
|
||||
- targeted
|
||||
- targeted-then-full
|
||||
target_specs:
|
||||
description: "Comma- or newline-separated Playwright spec paths under tests/e2e."
|
||||
required: false
|
||||
type: string
|
||||
default: "tests/e2e/superuser-department-overview.spec.js"
|
||||
target_projects:
|
||||
description: "JSON array of Playwright projects for targeted mode."
|
||||
required: false
|
||||
type: string
|
||||
default: '["chromium-desktop","chromium-mobile","chromium-tablet","webkit-mobile","webkit-desktop"]'
|
||||
target_grep:
|
||||
description: "Optional Playwright grep pattern for targeted mode."
|
||||
required: false
|
||||
type: string
|
||||
default: ""
|
||||
runner:
|
||||
description: "Runner pool for this manually dispatched test run"
|
||||
required: false
|
||||
default: "self-hosted"
|
||||
type: choice
|
||||
options:
|
||||
- self-hosted
|
||||
- github-hosted
|
||||
schedule:
|
||||
- cron: "0 2 * * *"
|
||||
|
||||
@@ -46,16 +13,16 @@ permissions:
|
||||
contents: read
|
||||
|
||||
concurrency:
|
||||
group: frontend-tests-${{ github.workflow }}-${{ github.event_name }}-${{ github.event_name == 'workflow_dispatch' && github.run_id || github.head_ref || github.ref_name }}
|
||||
group: frontend-tests-${{ github.workflow }}-${{ github.event_name }}-${{ github.head_ref || github.ref_name }}
|
||||
cancel-in-progress: true
|
||||
|
||||
jobs:
|
||||
format-tests:
|
||||
# CI normally runs on the repository's self-hosted pool; manual runs can opt into GitHub-hosted runners.
|
||||
runs-on: ${{ fromJSON(github.event_name == 'workflow_dispatch' && github.event.inputs.runner == 'github-hosted' && '["ubuntu-latest"]' || '["self-hosted","Linux","X64","pleno","frontend"]') }}
|
||||
# CI runs on the repository's self-hosted runner pool.
|
||||
runs-on: [self-hosted, Linux, X64, pleno, frontend]
|
||||
timeout-minutes: 15
|
||||
steps:
|
||||
- name: Normalize workspace permissions
|
||||
- name: Repair self-hosted workspace permissions
|
||||
shell: bash
|
||||
run: |
|
||||
if [[ -d "$GITHUB_WORKSPACE" ]]; then
|
||||
@@ -88,10 +55,10 @@ jobs:
|
||||
|
||||
build-and-unit:
|
||||
needs: format-tests
|
||||
runs-on: ${{ fromJSON(github.event_name == 'workflow_dispatch' && github.event.inputs.runner == 'github-hosted' && '["ubuntu-latest"]' || '["self-hosted","Linux","X64","pleno","frontend"]') }}
|
||||
runs-on: [self-hosted, Linux, X64, pleno, frontend]
|
||||
timeout-minutes: 30
|
||||
steps:
|
||||
- name: Normalize workspace permissions
|
||||
- name: Repair self-hosted workspace permissions
|
||||
shell: bash
|
||||
run: |
|
||||
if [[ -d "$GITHUB_WORKSPACE" ]]; then
|
||||
@@ -130,192 +97,11 @@ jobs:
|
||||
env:
|
||||
VITEST_BATCH_SIZE: 5
|
||||
|
||||
e2e-targeted:
|
||||
if: >
|
||||
github.event_name == 'workflow_dispatch' &&
|
||||
(inputs.mode == 'targeted' || inputs.mode == 'targeted-then-full')
|
||||
needs: build-and-unit
|
||||
name: E2E-targeted-${{ matrix.project }}
|
||||
# Use GitHub-hosted runners to avoid self-hosted desktop contention and sleep/power events.
|
||||
runs-on: ubuntu-24.04
|
||||
timeout-minutes: 35
|
||||
strategy:
|
||||
fail-fast: false
|
||||
matrix:
|
||||
project: ${{ fromJSON(inputs.target_projects || '["chromium-desktop"]') }}
|
||||
env:
|
||||
MATRIX_PROJECT: ${{ matrix.project }}
|
||||
PLAYWRIGHT_ARTIFACT_NAMESPACE: e2e-targeted-${{ matrix.project }}
|
||||
PLAYWRIGHT_REPORTER_MODE: line-html
|
||||
PLAYWRIGHT_WORKERS: 1
|
||||
PLAYWRIGHT_VIDEO_MODE: on-first-retry
|
||||
TARGET_GREP: ${{ inputs.target_grep }}
|
||||
TARGET_SPECS: ${{ inputs.target_specs }}
|
||||
RUN_ID: ${{ github.run_id }}
|
||||
steps:
|
||||
- name: Normalize workspace permissions
|
||||
shell: bash
|
||||
run: |
|
||||
if [[ -d "$GITHUB_WORKSPACE" ]]; then
|
||||
sudo -n chown -R "$(id -u):$(id -g)" "$GITHUB_WORKSPACE" 2>/dev/null || true
|
||||
foreign_entry="$(find "$GITHUB_WORKSPACE" -mindepth 1 -maxdepth 2 ! -user "$(id -u)" -print -quit 2>/dev/null || true)"
|
||||
if [[ -n "$foreign_entry" ]]; then
|
||||
trash="$GITHUB_WORKSPACE/../_workspace-trash-$GITHUB_RUN_ID-$GITHUB_JOB"
|
||||
rm -rf "$trash" 2>/dev/null || true
|
||||
mv "$GITHUB_WORKSPACE" "$trash" 2>/dev/null || true
|
||||
mkdir -p "$GITHUB_WORKSPACE"
|
||||
fi
|
||||
fi
|
||||
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v5
|
||||
|
||||
- name: Setup Node.js
|
||||
uses: actions/setup-node@v5
|
||||
with:
|
||||
node-version: 22
|
||||
|
||||
- name: Run targeted Playwright specs in container
|
||||
shell: bash
|
||||
run: |
|
||||
set -euo pipefail
|
||||
case "$MATRIX_PROJECT" in
|
||||
chromium-mobile) project_offset=1 ;;
|
||||
chromium-desktop) project_offset=2 ;;
|
||||
chromium-tablet) project_offset=3 ;;
|
||||
webkit-mobile) project_offset=31 ;;
|
||||
webkit-desktop) project_offset=32 ;;
|
||||
webkit-tablet) project_offset=33 ;;
|
||||
firefox-mobile) project_offset=61 ;;
|
||||
firefox-desktop) project_offset=62 ;;
|
||||
firefox-tablet) project_offset=63 ;;
|
||||
*) echo "Unsupported Playwright project: $MATRIX_PROJECT" >&2; exit 1 ;;
|
||||
esac
|
||||
port_seed=$((20000 + (RUN_ID % 20000) + project_offset))
|
||||
lock_root="${PLAYWRIGHT_PORT_LOCK_ROOT:-/tmp/pleno-playwright-port-locks}"
|
||||
mkdir -p "$lock_root"
|
||||
chmod 1777 "$lock_root" 2>/dev/null || true
|
||||
find "$lock_root" -mindepth 1 -maxdepth 1 -type d -mmin +360 -exec rmdir {} \; 2>/dev/null || true
|
||||
playwright_port_lock=""
|
||||
playwright_dev_port=""
|
||||
for ((candidate = port_seed; candidate < port_seed + 1000; candidate += 1)); do
|
||||
lock_dir="${lock_root}/${candidate}.lock"
|
||||
if ! mkdir "$lock_dir" 2>/dev/null; then
|
||||
continue
|
||||
fi
|
||||
if ss -H -ltn "sport = :${candidate}" 2>/dev/null | grep -q .; then
|
||||
rmdir "$lock_dir" || true
|
||||
continue
|
||||
fi
|
||||
playwright_port_lock="$lock_dir"
|
||||
playwright_dev_port="$candidate"
|
||||
break
|
||||
done
|
||||
if [[ -z "$playwright_dev_port" ]]; then
|
||||
echo "Unable to find a free Playwright dev-server port." >&2
|
||||
exit 1
|
||||
fi
|
||||
trap 'if [[ -n "${playwright_port_lock:-}" ]]; then rmdir "$playwright_port_lock" 2>/dev/null || true; fi' EXIT
|
||||
if docker info >/dev/null 2>&1; then
|
||||
docker_cmd=(docker)
|
||||
elif sudo -n docker info >/dev/null 2>&1; then
|
||||
docker_cmd=(sudo docker)
|
||||
else
|
||||
echo "Docker is not available to the runner user, and sudo docker is not available." >&2
|
||||
exit 1
|
||||
fi
|
||||
mkdir -p output/playwright
|
||||
scripts/ci/runner-diagnostics.sh "before targeted Playwright ${MATRIX_PROJECT}" -- "${docker_cmd[@]}"
|
||||
SYSTEMD_INHIBIT_REASON="Frontend targeted Playwright ${MATRIX_PROJECT}" \
|
||||
scripts/ci/with-systemd-inhibit.sh "${docker_cmd[@]}" run --rm --ipc=host --network host \
|
||||
--volume "$PWD:/source:ro" \
|
||||
--volume "$PWD/output/playwright:/work/output/playwright" \
|
||||
--workdir /work \
|
||||
--env HOME=/tmp \
|
||||
--env CI="${CI:-}" \
|
||||
--env PLAYWRIGHT_ARTIFACT_NAMESPACE="$PLAYWRIGHT_ARTIFACT_NAMESPACE" \
|
||||
--env PLAYWRIGHT_REPORTER_MODE="$PLAYWRIGHT_REPORTER_MODE" \
|
||||
--env PLAYWRIGHT_WORKERS="$PLAYWRIGHT_WORKERS" \
|
||||
--env PLAYWRIGHT_VIDEO_MODE="$PLAYWRIGHT_VIDEO_MODE" \
|
||||
--env PLAYWRIGHT_DEV_PORT="$playwright_dev_port" \
|
||||
--env MATRIX_PROJECT="$MATRIX_PROJECT" \
|
||||
--env TARGET_GREP="$TARGET_GREP" \
|
||||
--env TARGET_SPECS="$TARGET_SPECS" \
|
||||
mcr.microsoft.com/playwright:v1.58.2-noble \
|
||||
bash -lc '
|
||||
set -euo pipefail
|
||||
tar --exclude=./output/playwright -C /source -cf - . | tar -C /work -xf -
|
||||
git config --global --add safe.directory /work
|
||||
install_dependencies() {
|
||||
local attempt
|
||||
for attempt in 1 2 3; do
|
||||
if npm ci --legacy-peer-deps --fetch-retries=5 --fetch-retry-mintimeout=20000 --fetch-retry-maxtimeout=120000; then
|
||||
return 0
|
||||
fi
|
||||
if [[ "$attempt" == "3" ]]; then
|
||||
return 1
|
||||
fi
|
||||
echo "npm ci failed on attempt ${attempt}; retrying..." >&2
|
||||
sleep 20
|
||||
done
|
||||
}
|
||||
install_dependencies
|
||||
ulimit -n 16384 || true
|
||||
mapfile -t spec_args < <(printf "%s\n" "$TARGET_SPECS" | tr "," "\n" | sed "s/^[[:space:]]*//;s/[[:space:]]*$//;/^$/d")
|
||||
if [[ "${#spec_args[@]}" -eq 0 && -z "${TARGET_GREP:-}" ]]; then
|
||||
echo "Provide at least one spec path or grep pattern." >&2
|
||||
exit 1
|
||||
fi
|
||||
for spec_path in "${spec_args[@]}"; do
|
||||
if [[ "$spec_path" == /* || "$spec_path" == *".."* || "$spec_path" != tests/e2e/* ]]; then
|
||||
echo "Targeted spec must stay under tests/e2e: $spec_path" >&2
|
||||
exit 1
|
||||
fi
|
||||
if [[ ! -f "$spec_path" ]]; then
|
||||
echo "Targeted spec does not exist: $spec_path" >&2
|
||||
exit 1
|
||||
fi
|
||||
done
|
||||
args=("${spec_args[@]}")
|
||||
if [[ -n "${TARGET_GREP:-}" ]]; then
|
||||
args+=(--grep "$TARGET_GREP")
|
||||
fi
|
||||
args+=(--project="$MATRIX_PROJECT")
|
||||
npx playwright test "${args[@]}"
|
||||
'
|
||||
|
||||
- name: Runner diagnostics after Playwright failure
|
||||
if: failure() || cancelled()
|
||||
continue-on-error: true
|
||||
run: scripts/ci/runner-diagnostics.sh "after targeted Playwright ${{ matrix.project }}"
|
||||
|
||||
- name: Upload Playwright report
|
||||
if: failure() || cancelled()
|
||||
continue-on-error: true
|
||||
uses: actions/upload-artifact@v4
|
||||
with:
|
||||
name: playwright-report-targeted-${{ matrix.project }}
|
||||
path: |
|
||||
output/playwright/${{ env.PLAYWRIGHT_ARTIFACT_NAMESPACE }}-*
|
||||
output/playwright/${{ env.PLAYWRIGHT_ARTIFACT_NAMESPACE }}
|
||||
if-no-files-found: ignore
|
||||
retention-days: 1
|
||||
|
||||
e2e-pr:
|
||||
if: >
|
||||
always() &&
|
||||
github.event_name != 'schedule' &&
|
||||
needs.build-and-unit.result == 'success' &&
|
||||
!(github.event_name == 'workflow_dispatch' && inputs.mode == 'targeted') &&
|
||||
(
|
||||
github.event_name != 'workflow_dispatch' ||
|
||||
inputs.mode == 'full' ||
|
||||
needs.e2e-targeted.result == 'success'
|
||||
)
|
||||
needs: [build-and-unit, e2e-targeted]
|
||||
if: github.event_name != 'schedule'
|
||||
needs: build-and-unit
|
||||
name: E2E-pr-${{ matrix.suite }}-${{ matrix.project }}
|
||||
# Use GitHub-hosted runners to avoid self-hosted desktop contention and sleep/power events.
|
||||
runs-on: ubuntu-24.04
|
||||
runs-on: ubuntu-latest
|
||||
timeout-minutes: 45
|
||||
strategy:
|
||||
fail-fast: false
|
||||
@@ -329,7 +115,7 @@ jobs:
|
||||
PLAYWRIGHT_WORKERS: 1
|
||||
PLAYWRIGHT_VIDEO_MODE: on-first-retry
|
||||
steps:
|
||||
- name: Normalize workspace permissions
|
||||
- name: Repair self-hosted workspace permissions
|
||||
shell: bash
|
||||
run: |
|
||||
if [[ -d "$GITHUB_WORKSPACE" ]]; then
|
||||
@@ -505,22 +291,15 @@ jobs:
|
||||
if: >
|
||||
always() &&
|
||||
(github.event_name == 'schedule' || github.event_name == 'workflow_dispatch' || github.ref_name == github.event.repository.default_branch) &&
|
||||
!(github.event_name == 'workflow_dispatch' && inputs.mode == 'targeted') &&
|
||||
needs.build-and-unit.result == 'success' &&
|
||||
(github.event_name == 'schedule' || needs.e2e-pr.result == 'success') &&
|
||||
(
|
||||
github.event_name != 'workflow_dispatch' ||
|
||||
inputs.mode == 'full' ||
|
||||
needs.e2e-targeted.result == 'success'
|
||||
)
|
||||
needs: [build-and-unit, e2e-pr, e2e-targeted]
|
||||
(github.event_name == 'schedule' || needs.e2e-pr.result == 'success')
|
||||
needs: [build-and-unit, e2e-pr]
|
||||
name: E2E-full-${{ matrix.browser_label }}-${{ matrix.device }}-${{ matrix.role }}
|
||||
runs-on: ${{ fromJSON(github.event_name == 'workflow_dispatch' && github.event.inputs.runner == 'github-hosted' && '["ubuntu-latest"]' || '["self-hosted","Linux","X64","pleno","frontend","docker"]') }}
|
||||
runs-on: [self-hosted, Linux, X64, pleno, frontend, docker]
|
||||
timeout-minutes: 60
|
||||
strategy:
|
||||
fail-fast: false
|
||||
# Manual GitHub-hosted runs can use paid runner capacity to finish the full matrix faster.
|
||||
max-parallel: ${{ fromJSON(github.event_name == 'workflow_dispatch' && github.event.inputs.runner == 'github-hosted' && '12' || '2') }}
|
||||
max-parallel: 2
|
||||
matrix:
|
||||
browser: [chromium, webkit, firefox]
|
||||
device: [mobile, desktop, tablet]
|
||||
@@ -541,7 +320,7 @@ jobs:
|
||||
PLAYWRIGHT_WORKERS: 1
|
||||
PLAYWRIGHT_VIDEO_MODE: off
|
||||
steps:
|
||||
- name: Normalize workspace permissions
|
||||
- name: Repair self-hosted workspace permissions
|
||||
shell: bash
|
||||
run: |
|
||||
if [[ -d "$GITHUB_WORKSPACE" ]]; then
|
||||
|
||||
@@ -29,8 +29,8 @@ export const sourceMappings = [
|
||||
projects: chromiumProjects,
|
||||
},
|
||||
{
|
||||
name: "limited-backoffice",
|
||||
patterns: [/^src\/views\/backoffice\//u, /^src\/services\/limitedBackoffice\.js$/u],
|
||||
name: "backoffice",
|
||||
patterns: [/^src\/views\/backoffice\//u],
|
||||
specs: ["tests/e2e/limited-backoffice.spec.ts"],
|
||||
projects: chromiumProjects,
|
||||
},
|
||||
@@ -96,8 +96,8 @@ export const sourceMappings = [
|
||||
{
|
||||
name: "pos",
|
||||
patterns: [
|
||||
/(?:^|[/_.-])pos(?:[/_.-]|$)/iu,
|
||||
/(?:^|\/)(?:POS|Pos)[A-Z][^/]*\.(?:vue|js|ts)$/u,
|
||||
/\/pos[/-]/iu,
|
||||
/POS/iu,
|
||||
/^src\/assets\/pos\.css$/u,
|
||||
/^src\/components\/displays\/boxes\/ProductBox\.vue$/u,
|
||||
/^src\/features\/customer\/customerProductRules\.js$/u,
|
||||
@@ -120,22 +120,12 @@ export const sourceMappings = [
|
||||
{
|
||||
name: "admin-department-notifications",
|
||||
patterns: [
|
||||
/^src\/views\/dashboards\/departmentDashboard\/modules\/notifications\/DepartmentNotifications\.vue$/u,
|
||||
/^src\/components\/displays\/department\/notifications\//u,
|
||||
/^src\/components\/displays\/pagination\/models\/DepartmentPos\/NotificationsPhonePagination\.vue$/u,
|
||||
],
|
||||
specs: ["tests/e2e/admin-department-notifications.spec.ts"],
|
||||
projects: chromiumProjects,
|
||||
},
|
||||
{
|
||||
name: "admin-daily-report",
|
||||
patterns: [
|
||||
/^src\/views\/dashboards\/departmentDashboard\/modules\/daily-report\//u,
|
||||
/^src\/components\/session\/token\/SessionUser\/Objects\/DepartmentDailyReports\.vue$/u,
|
||||
],
|
||||
specs: ["tests/e2e/admin-daily-report.spec.ts"],
|
||||
projects: chromiumProjects,
|
||||
},
|
||||
{
|
||||
name: "limited-backoffice",
|
||||
patterns: [/^src\/views\/backoffice\/LimitedBackoffice/u],
|
||||
|
||||
@@ -126,8 +126,6 @@ const dropdownRoot = ref(null);
|
||||
const dropdownContent = ref(null);
|
||||
const isDropdownOpen = ref(false);
|
||||
const dropdownInstanceId = Math.random().toString(36).substring(2, 15);
|
||||
const dropdownPlacement = ref("bottom");
|
||||
const isDropdownPlacementLocked = ref(false);
|
||||
const shouldOpenDropdownUp = ref(false);
|
||||
const dropdownMaxHeight = ref(null);
|
||||
const isDesktopFlyoutLayout = ref(false);
|
||||
@@ -142,7 +140,6 @@ const previewRequestsInFlight = new Set();
|
||||
const generatedObjectUrls = new Set();
|
||||
let previewStateGeneration = 0;
|
||||
let contentResizeObserver = null;
|
||||
let dropdownLayoutUpdateId = 0;
|
||||
const desktopFlyoutMinViewportWidth = 1400;
|
||||
const desktopFlyoutRootPanelWidthRem = 15;
|
||||
const desktopFlyoutSubmenuWidthRem = 17;
|
||||
@@ -233,8 +230,6 @@ const dropdownContentStyle = computed(() => {
|
||||
});
|
||||
|
||||
const resetDropdownLayout = () => {
|
||||
dropdownPlacement.value = "bottom";
|
||||
isDropdownPlacementLocked.value = false;
|
||||
shouldOpenDropdownUp.value = false;
|
||||
dropdownMaxHeight.value = null;
|
||||
isFixedPosition.value = false;
|
||||
@@ -296,35 +291,7 @@ const getViewportInsets = () => {
|
||||
};
|
||||
};
|
||||
|
||||
const getDropdownPlacementSpaces = (triggerRect, viewportInsets = getViewportInsets()) => ({
|
||||
bottom: Math.max(window.innerHeight - triggerRect.bottom - viewportInsets.bottom, 0),
|
||||
top: Math.max(triggerRect.top - viewportInsets.top, 0),
|
||||
});
|
||||
|
||||
const resolveDropdownPlacement = (triggerRect, menuHeight, viewportInsets = getViewportInsets()) => {
|
||||
const spaces = getDropdownPlacementSpaces(triggerRect, viewportInsets);
|
||||
|
||||
return menuHeight > spaces.bottom && spaces.top > spaces.bottom ? "top" : "bottom";
|
||||
};
|
||||
|
||||
const getDropdownAvailableHeight = (triggerRect, viewportInsets = getViewportInsets()) => {
|
||||
const spaces = getDropdownPlacementSpaces(triggerRect, viewportInsets);
|
||||
|
||||
return dropdownPlacement.value === "top" ? spaces.top : spaces.bottom;
|
||||
};
|
||||
|
||||
const lockDropdownPlacement = (triggerRect, menuHeight, viewportInsets = getViewportInsets()) => {
|
||||
if (!isDropdownPlacementLocked.value) {
|
||||
dropdownPlacement.value = resolveDropdownPlacement(triggerRect, menuHeight, viewportInsets);
|
||||
isDropdownPlacementLocked.value = true;
|
||||
}
|
||||
|
||||
shouldOpenDropdownUp.value = dropdownPlacement.value === "top";
|
||||
};
|
||||
|
||||
const updateDropdownLayout = async () => {
|
||||
const updateId = ++dropdownLayoutUpdateId;
|
||||
|
||||
if (!isDropdownOpen.value || !dropdownRoot.value || !dropdownContent.value) {
|
||||
resetDropdownLayout();
|
||||
return;
|
||||
@@ -332,41 +299,35 @@ const updateDropdownLayout = async () => {
|
||||
|
||||
await nextTick();
|
||||
|
||||
if (updateId !== dropdownLayoutUpdateId || !isDropdownOpen.value || !dropdownRoot.value || !dropdownContent.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
const triggerElement = dropdownRoot.value.querySelector(".dropdown-trigger");
|
||||
const triggerRect = (triggerElement ?? dropdownRoot.value).getBoundingClientRect();
|
||||
syncDesktopFlyoutState(triggerRect);
|
||||
syncDesktopFlyoutPosition();
|
||||
|
||||
await nextTick();
|
||||
|
||||
if (updateId !== dropdownLayoutUpdateId || !isDropdownOpen.value || !dropdownContent.value) {
|
||||
if (!dropdownContent.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
const viewportInsets = getViewportInsets();
|
||||
const viewportTop = viewportInsets.top;
|
||||
const viewportBottom = window.innerHeight - viewportInsets.bottom;
|
||||
const spaceBelow = Math.max(window.innerHeight - triggerRect.bottom - viewportInsets.bottom, 0);
|
||||
const spaceAbove = Math.max(triggerRect.top - viewportInsets.top, 0);
|
||||
const menuHeight = Math.ceil(dropdownContent.value.scrollHeight);
|
||||
lockDropdownPlacement(triggerRect, menuHeight, viewportInsets);
|
||||
const availableHeight = getDropdownAvailableHeight(triggerRect, viewportInsets);
|
||||
const openUpward = menuHeight > spaceBelow && spaceAbove > spaceBelow;
|
||||
const availableHeight = openUpward ? spaceAbove : spaceBelow;
|
||||
const nextMaxHeight = availableHeight > 0 && menuHeight > availableHeight ? Math.floor(availableHeight) : null;
|
||||
|
||||
shouldOpenDropdownUp.value = openUpward;
|
||||
dropdownMaxHeight.value = nextMaxHeight;
|
||||
|
||||
await nextTick();
|
||||
|
||||
if (updateId !== dropdownLayoutUpdateId || !isDropdownOpen.value || !dropdownContent.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
syncDesktopFlyoutPosition();
|
||||
|
||||
await nextTick();
|
||||
|
||||
if (updateId !== dropdownLayoutUpdateId || !isDropdownOpen.value || !dropdownContent.value) {
|
||||
if (!dropdownContent.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -381,12 +342,6 @@ const updateDropdownLayout = async () => {
|
||||
const boundedHeight = Math.floor(renderedMenuRect.height - overflowAbove - overflowBelow);
|
||||
dropdownMaxHeight.value = boundedHeight > 0 ? boundedHeight : 1;
|
||||
|
||||
await nextTick();
|
||||
|
||||
if (updateId !== dropdownLayoutUpdateId || !isDropdownOpen.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
syncDesktopFlyoutPosition();
|
||||
};
|
||||
|
||||
@@ -1510,7 +1465,7 @@ onMounted(() => {
|
||||
|
||||
contentResizeObserver = new ResizeObserver(() => {
|
||||
if (isDropdownOpen.value) {
|
||||
void updateDropdownLayout();
|
||||
syncDesktopFlyoutPosition();
|
||||
}
|
||||
});
|
||||
|
||||
@@ -2444,7 +2399,7 @@ watch(
|
||||
() => {
|
||||
if (isDropdownOpen.value) {
|
||||
void nextTick(() => {
|
||||
void updateDropdownLayout();
|
||||
syncDesktopFlyoutPosition();
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -2552,6 +2507,7 @@ const syncDesktopFlyoutPosition = () => {
|
||||
|
||||
const triggerRect = triggerEl.getBoundingClientRect();
|
||||
const contentHeight = dropdownContentEl.scrollHeight;
|
||||
const viewportHeight = window.innerHeight;
|
||||
const viewportWidth = window.innerWidth;
|
||||
const contentRect = dropdownContentEl.getBoundingClientRect();
|
||||
|
||||
@@ -2581,13 +2537,12 @@ const syncDesktopFlyoutPosition = () => {
|
||||
|
||||
const viewportInsets = getViewportInsets();
|
||||
const viewportTop = viewportInsets.top;
|
||||
const effectiveContentHeight = dropdownMaxHeight.value
|
||||
? Math.min(contentHeight, dropdownMaxHeight.value)
|
||||
: contentHeight;
|
||||
const top =
|
||||
dropdownPlacement.value === "top"
|
||||
? Math.max(viewportTop, triggerRect.top - effectiveContentHeight)
|
||||
: triggerRect.bottom;
|
||||
const viewportBottom = viewportHeight - viewportInsets.bottom;
|
||||
let top = triggerRect.bottom;
|
||||
|
||||
if (top + contentHeight > viewportBottom) {
|
||||
top = Math.max(viewportTop, triggerRect.top - contentHeight);
|
||||
}
|
||||
|
||||
const nextFixedStyles = {
|
||||
top: `${top}px`,
|
||||
@@ -2603,8 +2558,18 @@ const syncDesktopFlyoutPosition = () => {
|
||||
fixedPositionStyles.value = nextFixedStyles;
|
||||
}
|
||||
} else {
|
||||
if (dropdownContentEl.style.top !== "") {
|
||||
dropdownContentEl.style.top = "";
|
||||
const contentRect = dropdownContentEl.getBoundingClientRect();
|
||||
const contentBottom = contentRect.top + contentRect.height;
|
||||
|
||||
if (contentBottom > viewportHeight) {
|
||||
const nextTop = `${triggerRect.top - contentRect.height}px`;
|
||||
if (dropdownContentEl.style.top !== nextTop) {
|
||||
dropdownContentEl.style.top = nextTop;
|
||||
}
|
||||
} else {
|
||||
if (dropdownContentEl.style.top !== "") {
|
||||
dropdownContentEl.style.top = "";
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
+1
-2
@@ -38,8 +38,7 @@ if (router.currentRoute.value.params.departmentId) {
|
||||
<TableLabeledPagination :label="SessionUser.objects.department_notification_sms.meta.title">
|
||||
<template #buttons="{ loadList }">
|
||||
<button
|
||||
class="button is-primary is-small"
|
||||
data-testid="department-notification-sms-add-button"
|
||||
class="button is-info is-small"
|
||||
@click="SessionUser.objects.department_notification_sms.showCreateObjectForm(() => loadList(), {department: parseInt(router.currentRoute.value.params.departmentId)})"
|
||||
>
|
||||
<span class="icon is-small">
|
||||
|
||||
@@ -164,21 +164,6 @@ const t = (key) => i18n.global.t(key);
|
||||
}
|
||||
);
|
||||
},
|
||||
setProductTarget: async ({ department_id, product_id, target_percentage }) => {
|
||||
const normalizedTarget = target_percentage === null || target_percentage === undefined || target_percentage === ""
|
||||
? null
|
||||
: Number(target_percentage);
|
||||
|
||||
return authenticatedRequest(
|
||||
"/departments/daily-reports/product-targets",
|
||||
"PUT",
|
||||
{
|
||||
department_id: parseInt(department_id, 10),
|
||||
product_id: parseInt(product_id, 10),
|
||||
target_percentage: normalizedTarget,
|
||||
}
|
||||
);
|
||||
},
|
||||
createComplaint: async ({
|
||||
department_id,
|
||||
customer_number = null,
|
||||
|
||||
@@ -1517,14 +1517,6 @@
|
||||
"subtitle_suffix": "@:{'words.generated.salg'} @:{'words.generated.af'} produktet",
|
||||
"title": "Produktsalg"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "Annuller mål",
|
||||
"edit_aria": "Rediger målprocent",
|
||||
"input_label": "Målprocent",
|
||||
"save_aria": "Gem mål",
|
||||
"save_error": "Målet kunne ikke gemmes.",
|
||||
"validation_range": "Målprocenten skal være mellem 0 og 100."
|
||||
},
|
||||
"reports": {
|
||||
"bookings": {
|
||||
"completed_count": "@.capitalize:{'words.generated.antal'} @:{'words.generated.fuldførte'}",
|
||||
|
||||
@@ -1628,14 +1628,6 @@
|
||||
"subtitle_suffix": "Produktverk?@:{'words.generated.ufe'}",
|
||||
"title": "@:{'templates.generated.compat.admin.daily_report.product_sales.subtitle_suffix'}"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "Ziel abbrechen",
|
||||
"edit_aria": "Zielprozentsatz bearbeiten",
|
||||
"input_label": "Zielprozentsatz",
|
||||
"save_aria": "Ziel speichern",
|
||||
"save_error": "Das Ziel konnte nicht gespeichert werden.",
|
||||
"validation_range": "Der Zielprozentsatz muss zwischen 0 und 100 liegen."
|
||||
},
|
||||
"reports": {
|
||||
"bookings": {
|
||||
"completed_count": "@:{'words.generated.abgeschlossene'} @:{'words.generated.anzahl'}",
|
||||
@@ -3595,13 +3587,6 @@
|
||||
"opening_hours": {
|
||||
"closed": "@:{'templates.generated.compat.global.closed'}"
|
||||
},
|
||||
"pricing": {
|
||||
"custom_pricing_disabled": "Fallback aktiviert",
|
||||
"custom_pricing_enabled": "Nur eigene Preise",
|
||||
"custom_pricing_missing_price": "Fehlende Abteilungspreise werden zu 999999.",
|
||||
"custom_pricing_only": "Keine Fallback-Preise",
|
||||
"effective_department_price": "Effektiver Abteilungspreis"
|
||||
},
|
||||
"search_placeholder": "@.capitalize:{'words.generated.nach'} @:{'words.generated.abteilungsname'} @:{'words.generated.suchen'}",
|
||||
"select_department": "@:{'templates.generated.compat.nav.select_department'}",
|
||||
"subtitle": "@:{'words.generated.abteilungen'} @:{'words.generated.verwalten'}",
|
||||
@@ -4441,7 +4426,6 @@
|
||||
"departments": {
|
||||
"columns": {
|
||||
"archived": "Archiviert",
|
||||
"custom_pricing_only": "@:{'templates.generated.compat.departments.pricing.custom_pricing_only'}",
|
||||
"dimension": "Abmessung",
|
||||
"economic_department": "@:{'templates.generated.compat.objects.economic_departments.single'}",
|
||||
"latitude": "@:{'templates.generated.compat.departments.form.latitude'}",
|
||||
@@ -6114,20 +6098,6 @@
|
||||
},
|
||||
"vehicles": {
|
||||
"add": "@:{'words.generated.fahrzeug'} @:{'words.generated.hinzuf'}?@:{'words.generated.gen'}",
|
||||
"add_modal": {
|
||||
"customer_label": "Kunde",
|
||||
"customer_placeholder": "Nach Kundenname oder Kundennummer suchen",
|
||||
"error": "Fahrzeug konnte nicht hinzugefuegt werden.",
|
||||
"no_customer_results": "Keine Kunden gefunden",
|
||||
"reference_placeholder": "Optionale Referenz",
|
||||
"registration_placeholder": "Kennzeichen",
|
||||
"selected_customer": "Ausgewaehlter Kunde",
|
||||
"submit": "Fahrzeug hinzufuegen",
|
||||
"title": "Fahrzeug hinzufuegen",
|
||||
"type_load_error": "Fahrzeugtypen konnten nicht geladen werden.",
|
||||
"type_placeholder": "Fahrzeugtyp auswaehlen",
|
||||
"validation_error": "Kunde, Kennzeichen und Fahrzeugtyp auswaehlen."
|
||||
},
|
||||
"brand": "@:{'templates.generated.compat.admin.pos.make'}",
|
||||
"color": "Farbe",
|
||||
"delete_vehicle": "@:{'templates.generated.compat.vehicles.delete'}",
|
||||
|
||||
@@ -1349,14 +1349,6 @@
|
||||
"subtitle_suffix": "@:{'words.generated.product'} @:{'words.generated.sales'}",
|
||||
"title": "@.capitalize:{'words.generated.product'} @.capitalize:{'words.generated.sales'}"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "Cancel target",
|
||||
"edit_aria": "Edit target percentage",
|
||||
"input_label": "Target percentage",
|
||||
"save_aria": "Save target",
|
||||
"save_error": "The target could not be saved.",
|
||||
"validation_range": "The target percentage must be between 0 and 100."
|
||||
},
|
||||
"reports": {
|
||||
"bookings": {
|
||||
"completed_count": "@.capitalize:{'words.generated.completed'} @:{'words.generated.count'}",
|
||||
|
||||
@@ -126,14 +126,6 @@
|
||||
"subtitle_suffix": "@:{'templates.generated.compat.admin.daily_report.product_sales.subtitle_suffix'}",
|
||||
"title": "@:{'templates.generated.compat.admin.daily_report.product_sales.title'}"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "@:{'templates.generated.compat.admin.daily_report.product_targets.cancel_aria'}",
|
||||
"edit_aria": "@:{'templates.generated.compat.admin.daily_report.product_targets.edit_aria'}",
|
||||
"input_label": "@:{'templates.generated.compat.admin.daily_report.product_targets.input_label'}",
|
||||
"save_aria": "@:{'templates.generated.compat.admin.daily_report.product_targets.save_aria'}",
|
||||
"save_error": "@:{'templates.generated.compat.admin.daily_report.product_targets.save_error'}",
|
||||
"validation_range": "@:{'templates.generated.compat.admin.daily_report.product_targets.validation_range'}"
|
||||
},
|
||||
"reports": {
|
||||
"avg_revenue": {
|
||||
"label": "@:{'templates.generated.compat.department_reports.avg_revenue_per_wash'}",
|
||||
@@ -4590,8 +4582,8 @@
|
||||
"overview": "Overview",
|
||||
"modules": "Modules",
|
||||
"branding": "Profile & Branding",
|
||||
"gateways": "@.capitalize:{'words.generated.gateways'}",
|
||||
"stripe": "@:{'words.generated.stripe'}",
|
||||
"gateways": "Gateways",
|
||||
"stripe": "Stripe",
|
||||
"pricing": "Pricing",
|
||||
"categories": "Categories"
|
||||
},
|
||||
@@ -4634,7 +4626,7 @@
|
||||
"department_id": "Department ID",
|
||||
"economic_department_id": "Economic department",
|
||||
"branding": "Branding",
|
||||
"created_at": "@:common.created",
|
||||
"created_at": "Created",
|
||||
"updated_at": "Updated"
|
||||
},
|
||||
"hardware": {
|
||||
@@ -4650,12 +4642,12 @@
|
||||
"quick_links": {
|
||||
"title": "Department tools",
|
||||
"subtitle": "Open the focused setup areas for this department",
|
||||
"modules": "@:superuser_dashboard.department_navigation.modules",
|
||||
"branding": "@:superuser_dashboard.department_overview.profile.branding",
|
||||
"gateways": "@:superuser_dashboard.department_navigation.gateways",
|
||||
"stripe": "@:superuser_dashboard.department_navigation.stripe",
|
||||
"pricing": "@:superuser_dashboard.department_navigation.pricing",
|
||||
"categories": "@:superuser_dashboard.department_navigation.categories"
|
||||
"modules": "Modules",
|
||||
"branding": "Branding",
|
||||
"gateways": "Gateways",
|
||||
"stripe": "Stripe",
|
||||
"pricing": "Pricing",
|
||||
"categories": "Categories"
|
||||
},
|
||||
"errors": {
|
||||
"invalid_department": "A valid department is required",
|
||||
|
||||
@@ -1631,14 +1631,6 @@
|
||||
"subtitle_suffix": "@:{'words.generated.produktsalg'}",
|
||||
"title": "@.capitalize:{'words.generated.produktsalg'}"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "Avbryt mål",
|
||||
"edit_aria": "Rediger målprosent",
|
||||
"input_label": "Målprosent",
|
||||
"save_aria": "Lagre mål",
|
||||
"save_error": "Målet kunne ikke lagres.",
|
||||
"validation_range": "Målprosenten må være mellom 0 og 100."
|
||||
},
|
||||
"reports": {
|
||||
"bookings": {
|
||||
"completed_count": "@.capitalize:{'words.generated.fullført'} @:{'words.generated.telling'}",
|
||||
@@ -3598,13 +3590,6 @@
|
||||
"opening_hours": {
|
||||
"closed": "Stengt"
|
||||
},
|
||||
"pricing": {
|
||||
"custom_pricing_disabled": "Fallback aktiv",
|
||||
"custom_pricing_enabled": "Kun egendefinerte priser",
|
||||
"custom_pricing_missing_price": "Manglende avdelingspriser blir 999999.",
|
||||
"custom_pricing_only": "Ingen fallback-priser",
|
||||
"effective_department_price": "Effektiv avdelingspris"
|
||||
},
|
||||
"search_placeholder": "@.capitalize:{'words.generated.søk'} @:{'words.generated.etter'} @:{'words.generated.avdelingsnavn'}",
|
||||
"select_department": "@.capitalize:{'words.generated.velg'} @:{'words.replication.host_definite_suffix'} @:{'words.generated.avdeling'}",
|
||||
"subtitle": "@.capitalize:{'words.generated.administrer'} @:{'words.generated.avdelinger'}",
|
||||
@@ -4444,7 +4429,6 @@
|
||||
"departments": {
|
||||
"columns": {
|
||||
"archived": "Arkivert",
|
||||
"custom_pricing_only": "@:{'templates.generated.compat.departments.pricing.custom_pricing_only'}",
|
||||
"dimension": "Dimensjon",
|
||||
"economic_department": "@.upper:{'words.generated.e'}-@:{'words.generated.økonomisk'} @:{'words.generated.avdeling'}",
|
||||
"latitude": "@:{'templates.generated.compat.departments.form.latitude'}",
|
||||
@@ -6117,20 +6101,6 @@
|
||||
},
|
||||
"vehicles": {
|
||||
"add": "@:{'words.generated.lagg'} @:{'words.generated.till'} @:{'words.generated.fordon'}",
|
||||
"add_modal": {
|
||||
"customer_label": "Kunde",
|
||||
"customer_placeholder": "Søk etter kundenavn eller kundenummer",
|
||||
"error": "Kunne ikke legge til kjøretøy.",
|
||||
"no_customer_results": "Ingen kunder funnet",
|
||||
"reference_placeholder": "Valgfri referanse",
|
||||
"registration_placeholder": "Registreringsnummer",
|
||||
"selected_customer": "Valgt kunde",
|
||||
"submit": "Legg til kjøretøy",
|
||||
"title": "Legg til kjøretøy",
|
||||
"type_load_error": "Kunne ikke laste kjøretøytyper.",
|
||||
"type_placeholder": "Velg kjøretøytype",
|
||||
"validation_error": "Velg kunde, registreringsnummer og kjøretøytype."
|
||||
},
|
||||
"brand": "Märke",
|
||||
"color": "Färg",
|
||||
"delete_vehicle": "@:{'templates.generated.compat.vehicles.delete'}",
|
||||
|
||||
@@ -1681,14 +1681,6 @@
|
||||
"subtitle_suffix": "@:{'words.generated.produktforsaljning'}",
|
||||
"title": "@.capitalize:{'words.generated.produktforsaljning'}"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "Avbryt mål",
|
||||
"edit_aria": "Redigera målprocent",
|
||||
"input_label": "Målprocent",
|
||||
"save_aria": "Spara mål",
|
||||
"save_error": "Målet kunde inte sparas.",
|
||||
"validation_range": "Målprocenten måste vara mellan 0 och 100."
|
||||
},
|
||||
"reports": {
|
||||
"bookings": {
|
||||
"completed_count": "@.capitalize:{'words.generated.antal'} @:{'words.generated.slutforda'}",
|
||||
@@ -3648,13 +3640,6 @@
|
||||
"opening_hours": {
|
||||
"closed": "Stengt"
|
||||
},
|
||||
"pricing": {
|
||||
"custom_pricing_disabled": "Fallback aktiv",
|
||||
"custom_pricing_enabled": "Endast egna priser",
|
||||
"custom_pricing_missing_price": "Saknade avdelningspriser blir 999999.",
|
||||
"custom_pricing_only": "Inga fallback-priser",
|
||||
"effective_department_price": "Effektivt avdelningspris"
|
||||
},
|
||||
"search_placeholder": "@:{'words.generated.sok'} @:{'words.generated.efter'} @:{'words.generated.avdelningsnamn'}",
|
||||
"select_department": "@:{'words.generated.velg'} @:{'words.replication.host_definite_suffix'} @:{'words.generated.avdeling'}",
|
||||
"subtitle": "@:{'words.generated.administrer'} @:{'words.generated.avdelinger'}",
|
||||
@@ -4494,7 +4479,6 @@
|
||||
"departments": {
|
||||
"columns": {
|
||||
"archived": "Arkiverad",
|
||||
"custom_pricing_only": "@:{'templates.generated.compat.departments.pricing.custom_pricing_only'}",
|
||||
"dimension": "Dimension",
|
||||
"economic_department": "@:{'templates.generated.compat.objects.economic_departments.single'}",
|
||||
"latitude": "Latitude",
|
||||
@@ -6167,20 +6151,6 @@
|
||||
},
|
||||
"vehicles": {
|
||||
"add": "@:{'words.generated.lagg'} @:{'words.generated.till'} @:{'words.generated.fordon'}",
|
||||
"add_modal": {
|
||||
"customer_label": "Kund",
|
||||
"customer_placeholder": "Sök efter kundnamn eller kundnummer",
|
||||
"error": "Det gick inte att lägga till fordon.",
|
||||
"no_customer_results": "Inga kunder hittades",
|
||||
"reference_placeholder": "Valfri referens",
|
||||
"registration_placeholder": "Registreringsnummer",
|
||||
"selected_customer": "Vald kund",
|
||||
"submit": "Lägg till fordon",
|
||||
"title": "Lägg till fordon",
|
||||
"type_load_error": "Det gick inte att läsa in fordonstyper.",
|
||||
"type_placeholder": "Välj fordonstyp",
|
||||
"validation_error": "Välj kund, registreringsnummer och fordonstyp."
|
||||
},
|
||||
"brand": "Märke",
|
||||
"color": "Färg",
|
||||
"delete_vehicle": "@.capitalize:{'words.generated.ta'} @:{'words.generated.bort'} @:{'words.generated.fordon'}",
|
||||
|
||||
@@ -27,14 +27,6 @@
|
||||
"subtitle_suffix": "@:{'terms.glossary.salg'} @:{'terms.glossary.af'} produktet",
|
||||
"title": "Produktsalg"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "Annuller mål",
|
||||
"edit_aria": "Rediger målprocent",
|
||||
"input_label": "Målprocent",
|
||||
"save_aria": "Gem mål",
|
||||
"save_error": "Målet kunne ikke gemmes.",
|
||||
"validation_range": "Målprocenten skal være mellem 0 og 100."
|
||||
},
|
||||
"reports": {
|
||||
"bookings": {
|
||||
"completed_count": "@.capitalize:{'terms.glossary.antal'} @:{'terms.glossary.fuldførte'}",
|
||||
|
||||
@@ -27,14 +27,6 @@
|
||||
"subtitle_suffix": "Produktverk?@:{'terms.glossary.ufe'}",
|
||||
"title": "@:{'phrases.compat.admin.daily_report.product_sales.subtitle_suffix'}"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "Ziel abbrechen",
|
||||
"edit_aria": "Zielprozentsatz bearbeiten",
|
||||
"input_label": "Zielprozentsatz",
|
||||
"save_aria": "Ziel speichern",
|
||||
"save_error": "Das Ziel konnte nicht gespeichert werden.",
|
||||
"validation_range": "Der Zielprozentsatz muss zwischen 0 und 100 liegen."
|
||||
},
|
||||
"reports": {
|
||||
"bookings": {
|
||||
"completed_count": "@:{'terms.glossary.abgeschlossene'} @:{'terms.glossary.anzahl'}",
|
||||
|
||||
@@ -21,13 +21,6 @@
|
||||
"opening_hours": {
|
||||
"closed": "@:{'phrases.compat.global.closed'}"
|
||||
},
|
||||
"pricing": {
|
||||
"custom_pricing_disabled": "Fallback aktiviert",
|
||||
"custom_pricing_enabled": "Nur eigene Preise",
|
||||
"custom_pricing_missing_price": "Fehlende Abteilungspreise werden zu 999999.",
|
||||
"custom_pricing_only": "Keine Fallback-Preise",
|
||||
"effective_department_price": "Effektiver Abteilungspreis"
|
||||
},
|
||||
"search_placeholder": "@.capitalize:{'terms.glossary.nach'} @:{'terms.glossary.abteilungsname'} @:{'terms.glossary.suchen'}",
|
||||
"select_department": "@:{'phrases.compat.nav.select_department'}",
|
||||
"subtitle": "@:{'terms.glossary.abteilungen'} @:{'terms.glossary.verwalten'}",
|
||||
|
||||
@@ -140,7 +140,6 @@
|
||||
"departments": {
|
||||
"columns": {
|
||||
"archived": "Archiviert",
|
||||
"custom_pricing_only": "@:{'phrases.compat.departments.pricing.custom_pricing_only'}",
|
||||
"dimension": "Abmessung",
|
||||
"economic_department": "@:{'phrases.compat.objects.economic_departments.single'}",
|
||||
"latitude": "@:{'phrases.compat.departments.form.latitude'}",
|
||||
|
||||
@@ -2,20 +2,6 @@
|
||||
"compat": {
|
||||
"vehicles": {
|
||||
"add": "@:{'terms.glossary.fahrzeug'} @:{'terms.glossary.hinzuf'}?@:{'terms.glossary.gen'}",
|
||||
"add_modal": {
|
||||
"customer_label": "Kunde",
|
||||
"customer_placeholder": "Nach Kundenname oder Kundennummer suchen",
|
||||
"error": "Fahrzeug konnte nicht hinzugefuegt werden.",
|
||||
"no_customer_results": "Keine Kunden gefunden",
|
||||
"reference_placeholder": "Optionale Referenz",
|
||||
"registration_placeholder": "Kennzeichen",
|
||||
"selected_customer": "Ausgewaehlter Kunde",
|
||||
"submit": "Fahrzeug hinzufuegen",
|
||||
"title": "Fahrzeug hinzufuegen",
|
||||
"type_load_error": "Fahrzeugtypen konnten nicht geladen werden.",
|
||||
"type_placeholder": "Fahrzeugtyp auswaehlen",
|
||||
"validation_error": "Kunde, Kennzeichen und Fahrzeugtyp auswaehlen."
|
||||
},
|
||||
"brand": "@:{'phrases.compat.admin.pos.make'}",
|
||||
"color": "Farbe",
|
||||
"delete_vehicle": "@:{'phrases.compat.vehicles.delete'}",
|
||||
|
||||
@@ -27,14 +27,6 @@
|
||||
"subtitle_suffix": "@:{'terms.glossary.product'} @:{'terms.glossary.sales'}",
|
||||
"title": "@.capitalize:{'terms.glossary.product'} @.capitalize:{'terms.glossary.sales'}"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "Cancel target",
|
||||
"edit_aria": "Edit target percentage",
|
||||
"input_label": "Target percentage",
|
||||
"save_aria": "Save target",
|
||||
"save_error": "The target could not be saved.",
|
||||
"validation_range": "The target percentage must be between 0 and 100."
|
||||
},
|
||||
"reports": {
|
||||
"bookings": {
|
||||
"completed_count": "@.capitalize:{'terms.glossary.completed'} @:{'terms.glossary.count'}",
|
||||
|
||||
@@ -34,14 +34,6 @@
|
||||
"subtitle_suffix": "@:{'phrases.compat.admin.daily_report.product_sales.subtitle_suffix'}",
|
||||
"title": "@:{'phrases.compat.admin.daily_report.product_sales.title'}"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "@:{'phrases.compat.admin.daily_report.product_targets.cancel_aria'}",
|
||||
"edit_aria": "@:{'phrases.compat.admin.daily_report.product_targets.edit_aria'}",
|
||||
"input_label": "@:{'phrases.compat.admin.daily_report.product_targets.input_label'}",
|
||||
"save_aria": "@:{'phrases.compat.admin.daily_report.product_targets.save_aria'}",
|
||||
"save_error": "@:{'phrases.compat.admin.daily_report.product_targets.save_error'}",
|
||||
"validation_range": "@:{'phrases.compat.admin.daily_report.product_targets.validation_range'}"
|
||||
},
|
||||
"reports": {
|
||||
"avg_revenue": {
|
||||
"label": "@:{'phrases.compat.department_reports.avg_revenue_per_wash'}",
|
||||
|
||||
@@ -44,8 +44,8 @@
|
||||
"overview": "Overview",
|
||||
"modules": "Modules",
|
||||
"branding": "Profile & Branding",
|
||||
"gateways": "@.capitalize:{'terms.glossary.gateways'}",
|
||||
"stripe": "@:{'terms.glossary.stripe'}",
|
||||
"gateways": "Gateways",
|
||||
"stripe": "Stripe",
|
||||
"pricing": "Pricing",
|
||||
"categories": "Categories"
|
||||
},
|
||||
@@ -88,7 +88,7 @@
|
||||
"department_id": "Department ID",
|
||||
"economic_department_id": "Economic department",
|
||||
"branding": "Branding",
|
||||
"created_at": "@:common.created",
|
||||
"created_at": "Created",
|
||||
"updated_at": "Updated"
|
||||
},
|
||||
"hardware": {
|
||||
@@ -104,12 +104,12 @@
|
||||
"quick_links": {
|
||||
"title": "Department tools",
|
||||
"subtitle": "Open the focused setup areas for this department",
|
||||
"modules": "@:superuser_dashboard.department_navigation.modules",
|
||||
"branding": "@:superuser_dashboard.department_overview.profile.branding",
|
||||
"gateways": "@:superuser_dashboard.department_navigation.gateways",
|
||||
"stripe": "@:superuser_dashboard.department_navigation.stripe",
|
||||
"pricing": "@:superuser_dashboard.department_navigation.pricing",
|
||||
"categories": "@:superuser_dashboard.department_navigation.categories"
|
||||
"modules": "Modules",
|
||||
"branding": "Branding",
|
||||
"gateways": "Gateways",
|
||||
"stripe": "Stripe",
|
||||
"pricing": "Pricing",
|
||||
"categories": "Categories"
|
||||
},
|
||||
"errors": {
|
||||
"invalid_department": "A valid department is required",
|
||||
|
||||
@@ -27,14 +27,6 @@
|
||||
"subtitle_suffix": "@:{'terms.glossary.produktsalg'}",
|
||||
"title": "@.capitalize:{'terms.glossary.produktsalg'}"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "Avbryt mål",
|
||||
"edit_aria": "Rediger målprosent",
|
||||
"input_label": "Målprosent",
|
||||
"save_aria": "Lagre mål",
|
||||
"save_error": "Målet kunne ikke lagres.",
|
||||
"validation_range": "Målprosenten må være mellom 0 og 100."
|
||||
},
|
||||
"reports": {
|
||||
"bookings": {
|
||||
"completed_count": "@.capitalize:{'terms.glossary.fullført'} @:{'terms.glossary.telling'}",
|
||||
|
||||
@@ -21,13 +21,6 @@
|
||||
"opening_hours": {
|
||||
"closed": "Stengt"
|
||||
},
|
||||
"pricing": {
|
||||
"custom_pricing_disabled": "Fallback aktiv",
|
||||
"custom_pricing_enabled": "Kun egendefinerte priser",
|
||||
"custom_pricing_missing_price": "Manglende avdelingspriser blir 999999.",
|
||||
"custom_pricing_only": "Ingen fallback-priser",
|
||||
"effective_department_price": "Effektiv avdelingspris"
|
||||
},
|
||||
"search_placeholder": "@.capitalize:{'terms.glossary.søk'} @:{'terms.glossary.etter'} @:{'terms.glossary.avdelingsnavn'}",
|
||||
"select_department": "@.capitalize:{'terms.glossary.velg'} @:{'terms.replication.host_definite_suffix'} @:{'terms.glossary.avdeling'}",
|
||||
"subtitle": "@.capitalize:{'terms.glossary.administrer'} @:{'terms.glossary.avdelinger'}",
|
||||
|
||||
@@ -140,7 +140,6 @@
|
||||
"departments": {
|
||||
"columns": {
|
||||
"archived": "Arkivert",
|
||||
"custom_pricing_only": "@:{'phrases.compat.departments.pricing.custom_pricing_only'}",
|
||||
"dimension": "Dimensjon",
|
||||
"economic_department": "@.upper:{'terms.glossary.e'}-@:{'terms.glossary.økonomisk'} @:{'terms.glossary.avdeling'}",
|
||||
"latitude": "@:{'phrases.compat.departments.form.latitude'}",
|
||||
|
||||
@@ -2,20 +2,6 @@
|
||||
"compat": {
|
||||
"vehicles": {
|
||||
"add": "@:{'terms.glossary.lagg'} @:{'terms.glossary.till'} @:{'terms.glossary.fordon'}",
|
||||
"add_modal": {
|
||||
"customer_label": "Kunde",
|
||||
"customer_placeholder": "Søk etter kundenavn eller kundenummer",
|
||||
"error": "Kunne ikke legge til kjøretøy.",
|
||||
"no_customer_results": "Ingen kunder funnet",
|
||||
"reference_placeholder": "Valgfri referanse",
|
||||
"registration_placeholder": "Registreringsnummer",
|
||||
"selected_customer": "Valgt kunde",
|
||||
"submit": "Legg til kjøretøy",
|
||||
"title": "Legg til kjøretøy",
|
||||
"type_load_error": "Kunne ikke laste kjøretøytyper.",
|
||||
"type_placeholder": "Velg kjøretøytype",
|
||||
"validation_error": "Velg kunde, registreringsnummer og kjøretøytype."
|
||||
},
|
||||
"brand": "Märke",
|
||||
"color": "Färg",
|
||||
"delete_vehicle": "@:{'phrases.compat.vehicles.delete'}",
|
||||
|
||||
@@ -27,14 +27,6 @@
|
||||
"subtitle_suffix": "@:{'terms.glossary.produktforsaljning'}",
|
||||
"title": "@.capitalize:{'terms.glossary.produktforsaljning'}"
|
||||
},
|
||||
"product_targets": {
|
||||
"cancel_aria": "Avbryt mål",
|
||||
"edit_aria": "Redigera målprocent",
|
||||
"input_label": "Målprocent",
|
||||
"save_aria": "Spara mål",
|
||||
"save_error": "Målet kunde inte sparas.",
|
||||
"validation_range": "Målprocenten måste vara mellan 0 och 100."
|
||||
},
|
||||
"reports": {
|
||||
"bookings": {
|
||||
"completed_count": "@.capitalize:{'terms.glossary.antal'} @:{'terms.glossary.slutforda'}",
|
||||
|
||||
@@ -21,13 +21,6 @@
|
||||
"opening_hours": {
|
||||
"closed": "Stengt"
|
||||
},
|
||||
"pricing": {
|
||||
"custom_pricing_disabled": "Fallback aktiv",
|
||||
"custom_pricing_enabled": "Endast egna priser",
|
||||
"custom_pricing_missing_price": "Saknade avdelningspriser blir 999999.",
|
||||
"custom_pricing_only": "Inga fallback-priser",
|
||||
"effective_department_price": "Effektivt avdelningspris"
|
||||
},
|
||||
"search_placeholder": "@:{'terms.glossary.sok'} @:{'terms.glossary.efter'} @:{'terms.glossary.avdelningsnamn'}",
|
||||
"select_department": "@:{'terms.glossary.velg'} @:{'terms.replication.host_definite_suffix'} @:{'terms.glossary.avdeling'}",
|
||||
"subtitle": "@:{'terms.glossary.administrer'} @:{'terms.glossary.avdelinger'}",
|
||||
|
||||
@@ -140,7 +140,6 @@
|
||||
"departments": {
|
||||
"columns": {
|
||||
"archived": "Arkiverad",
|
||||
"custom_pricing_only": "@:{'phrases.compat.departments.pricing.custom_pricing_only'}",
|
||||
"dimension": "Dimension",
|
||||
"economic_department": "@:{'phrases.compat.objects.economic_departments.single'}",
|
||||
"latitude": "Latitude",
|
||||
|
||||
@@ -2,20 +2,6 @@
|
||||
"compat": {
|
||||
"vehicles": {
|
||||
"add": "@:{'terms.glossary.lagg'} @:{'terms.glossary.till'} @:{'terms.glossary.fordon'}",
|
||||
"add_modal": {
|
||||
"customer_label": "Kund",
|
||||
"customer_placeholder": "Sök efter kundnamn eller kundnummer",
|
||||
"error": "Det gick inte att lägga till fordon.",
|
||||
"no_customer_results": "Inga kunder hittades",
|
||||
"reference_placeholder": "Valfri referens",
|
||||
"registration_placeholder": "Registreringsnummer",
|
||||
"selected_customer": "Vald kund",
|
||||
"submit": "Lägg till fordon",
|
||||
"title": "Lägg till fordon",
|
||||
"type_load_error": "Det gick inte att läsa in fordonstyper.",
|
||||
"type_placeholder": "Välj fordonstyp",
|
||||
"validation_error": "Välj kund, registreringsnummer och fordonstyp."
|
||||
},
|
||||
"brand": "Märke",
|
||||
"color": "Färg",
|
||||
"delete_vehicle": "@.capitalize:{'terms.glossary.ta'} @:{'terms.glossary.bort'} @:{'terms.glossary.fordon'}",
|
||||
|
||||
@@ -442,12 +442,6 @@ export const router = createRouter({
|
||||
},
|
||||
{
|
||||
name: 'limitedBackofficeEmployees',
|
||||
path: '/backoffice/departments/:departmentId/employees',
|
||||
component: LimitedBackofficeEmployees,
|
||||
meta: { middleware: authMiddleware, titleKey: 'templates.limited_backoffice.employees.title' }
|
||||
},
|
||||
{
|
||||
name: 'limitedBackofficeEmployeesLegacy',
|
||||
path: '/backoffice/employees',
|
||||
component: LimitedBackofficeEmployees,
|
||||
meta: { middleware: authMiddleware, titleKey: 'templates.limited_backoffice.employees.title' }
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
<script setup>
|
||||
import { computed, onMounted, ref, watch } from "vue";
|
||||
import { computed, onMounted, ref } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { useRoute, useRouter } from "vue-router";
|
||||
import RestrictedPageWrapper from "@/components/page/wrappers/RestrictedPageWrapper.vue";
|
||||
import { SessionUser } from "@/components/session/token/SessionUser.vue";
|
||||
import LimitedBackofficeLayout from "@/views/backoffice/components/LimitedBackofficeLayout.vue";
|
||||
@@ -34,14 +33,6 @@ const loadQRCodeModule = () => {
|
||||
};
|
||||
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const countryCodeLabels = {
|
||||
denmark: () => t("templates.limited_backoffice.employees.country_codes.denmark"),
|
||||
sweden: () => t("templates.limited_backoffice.employees.country_codes.sweden"),
|
||||
norway: () => t("templates.limited_backoffice.employees.country_codes.norway"),
|
||||
finland: () => t("templates.limited_backoffice.employees.country_codes.finland"),
|
||||
};
|
||||
const departments = ref([]);
|
||||
const roles = ref([]);
|
||||
const employees = ref([]);
|
||||
@@ -69,19 +60,6 @@ const form = ref({
|
||||
department_ids: [],
|
||||
});
|
||||
|
||||
const selectedDepartmentId = computed(() => {
|
||||
const departmentId = Number.parseInt(String(route.params.departmentId ?? ""), 10);
|
||||
return Number.isInteger(departmentId) && departmentId > 0 ? departmentId : null;
|
||||
});
|
||||
|
||||
const selectedDepartment = computed(() =>
|
||||
departments.value.find((department) => Number(department.id) === selectedDepartmentId.value) || null
|
||||
);
|
||||
|
||||
const hasForbiddenDepartment = computed(
|
||||
() => selectedDepartmentId.value !== null && departments.value.length > 0 && !selectedDepartment.value
|
||||
);
|
||||
|
||||
const roleMessages = computed(() => ({
|
||||
viewer: {
|
||||
label: t("templates.limited_backoffice.roles.viewer.label"),
|
||||
@@ -278,7 +256,7 @@ const countryCodeLabel = (countryCode) => {
|
||||
if (!option) {
|
||||
return "";
|
||||
}
|
||||
return `${option.flag} +${option.value} ${countryCodeLabels[option.labelKey]?.() || ""}`;
|
||||
return `${option.flag} +${option.value} ${t(`templates.limited_backoffice.employees.country_codes.${option.labelKey}`)}`;
|
||||
};
|
||||
|
||||
const formatEmployeePhone = (employee) => {
|
||||
@@ -294,23 +272,11 @@ const sanitizePhone = (event) => {
|
||||
|
||||
const absoluteLoginLink = (loginPath) => new URL(String(loginPath || ""), window.location.origin).toString();
|
||||
|
||||
const visibleEmployees = computed(() => {
|
||||
if (!selectedDepartmentId.value) {
|
||||
return employees.value;
|
||||
}
|
||||
|
||||
return employees.value.filter((employee) =>
|
||||
(employee.departments || []).some((department) => Number(department.id) === selectedDepartmentId.value)
|
||||
);
|
||||
});
|
||||
|
||||
const loadEmployees = async () => {
|
||||
const response = await getLimitedBackofficeEmployees({ includeInactive: includeInactive.value });
|
||||
employees.value = unwrapLimitedBackofficeResponse(response) || [];
|
||||
};
|
||||
|
||||
const defaultDepartmentIds = () => (selectedDepartment.value?.id ? [Number(selectedDepartment.value.id)] : []);
|
||||
|
||||
const loadData = async () => {
|
||||
loading.value = true;
|
||||
errorMessage.value = "";
|
||||
@@ -325,18 +291,6 @@ const loadData = async () => {
|
||||
if (!ROLE_KEYS.includes(form.value.role_key) || !roles.value.some((role) => role.key === form.value.role_key)) {
|
||||
form.value.role_key = roles.value[0]?.key || "viewer";
|
||||
}
|
||||
|
||||
const firstDepartment = departments.value[0] || null;
|
||||
if (!selectedDepartmentId.value && firstDepartment?.id) {
|
||||
await router.replace(`/backoffice/departments/${firstDepartment.id}/employees`);
|
||||
}
|
||||
|
||||
resetForm();
|
||||
if (hasForbiddenDepartment.value) {
|
||||
employees.value = [];
|
||||
return;
|
||||
}
|
||||
|
||||
await loadEmployees();
|
||||
} catch (error) {
|
||||
errorMessage.value = limitedBackofficeErrorMessage(
|
||||
@@ -358,7 +312,7 @@ const resetForm = () => {
|
||||
phone: "",
|
||||
password: "",
|
||||
role_key: roles.value[0]?.key || "viewer",
|
||||
department_ids: defaultDepartmentIds(),
|
||||
department_ids: [],
|
||||
};
|
||||
};
|
||||
|
||||
@@ -525,16 +479,7 @@ const closeEmployeeLoginLink = () => {
|
||||
loginLinkCopyMessage.value = "";
|
||||
};
|
||||
|
||||
const changeDepartment = async (departmentId) => {
|
||||
await router.push(`/backoffice/departments/${departmentId}/employees`);
|
||||
};
|
||||
|
||||
const reloadEmployees = async () => {
|
||||
if (hasForbiddenDepartment.value) {
|
||||
employees.value = [];
|
||||
return;
|
||||
}
|
||||
|
||||
loading.value = true;
|
||||
errorMessage.value = "";
|
||||
try {
|
||||
@@ -552,36 +497,12 @@ const reloadEmployees = async () => {
|
||||
onMounted(() => {
|
||||
void loadData();
|
||||
});
|
||||
|
||||
watch(
|
||||
() => selectedDepartmentId.value,
|
||||
async (nextDepartmentId, previousDepartmentId) => {
|
||||
if (nextDepartmentId === previousDepartmentId || loading.value || departments.value.length === 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
resetForm();
|
||||
await reloadEmployees();
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<RestrictedPageWrapper :hasPermission="SessionUser.hasPermission('limited_backoffice_access')">
|
||||
<LimitedBackofficeLayout
|
||||
active-tab="employees"
|
||||
:departments="departments"
|
||||
:selected-department-id="selectedDepartmentId"
|
||||
:loading-departments="loading"
|
||||
show-department-switcher
|
||||
@change-department="changeDepartment"
|
||||
>
|
||||
<div v-if="hasForbiddenDepartment" class="notification is-danger is-light" data-testid="limited-employees-forbidden">
|
||||
<strong>{{ t("templates.limited_backoffice.forbidden.title") }}</strong>
|
||||
<p>{{ t("templates.limited_backoffice.forbidden.department") }}</p>
|
||||
</div>
|
||||
|
||||
<div v-else class="columns is-variable is-5">
|
||||
<LimitedBackofficeLayout active-tab="employees" :departments="departments">
|
||||
<div class="columns is-variable is-5">
|
||||
<div class="column is-5">
|
||||
<form class="box limited-employee-form" data-testid="limited-employee-form" @submit.prevent="saveEmployee">
|
||||
<h2 class="title is-5">
|
||||
@@ -805,15 +726,11 @@ watch(
|
||||
{{ successMessage }}
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="!loading && visibleEmployees.length === 0"
|
||||
class="notification is-light"
|
||||
data-testid="limited-employees-empty"
|
||||
>
|
||||
<div v-if="!loading && employees.length === 0" class="notification is-light" data-testid="limited-employees-empty">
|
||||
{{ t("templates.limited_backoffice.employees.empty") }}
|
||||
</div>
|
||||
|
||||
<div v-if="!loading && visibleEmployees.length > 0" class="table-container">
|
||||
<div v-if="!loading && employees.length > 0" class="table-container">
|
||||
<table class="table is-fullwidth is-hoverable limited-employees-table" data-testid="limited-employees-table">
|
||||
<thead>
|
||||
<tr>
|
||||
@@ -826,7 +743,7 @@ watch(
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="employee in visibleEmployees" :key="employee.id" :data-testid="`limited-employee-row-${employee.id}`">
|
||||
<tr v-for="employee in employees" :key="employee.id" :data-testid="`limited-employee-row-${employee.id}`">
|
||||
<td>
|
||||
<span class="tag is-light" :data-testid="`limited-employee-user-id-${employee.id}`">
|
||||
{{ employee.user_id || employee.id }}
|
||||
|
||||
@@ -17,10 +17,6 @@ const departments = ref([]);
|
||||
const loading = ref(false);
|
||||
const errorMessage = ref("");
|
||||
|
||||
const changeDepartment = async (departmentId) => {
|
||||
await router.push(`/backoffice/departments/${departmentId}/prices`);
|
||||
};
|
||||
|
||||
const loadDepartments = async () => {
|
||||
loading.value = true;
|
||||
errorMessage.value = "";
|
||||
@@ -42,6 +38,10 @@ const loadDepartments = async () => {
|
||||
}
|
||||
};
|
||||
|
||||
const changeDepartment = async (departmentId) => {
|
||||
await router.push(`/backoffice/departments/${departmentId}/prices`);
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
void loadDepartments();
|
||||
});
|
||||
|
||||
@@ -35,12 +35,6 @@ const pricesRoute = computed(() =>
|
||||
: "/backoffice"
|
||||
);
|
||||
|
||||
const employeesRoute = computed(() =>
|
||||
props.selectedDepartmentId
|
||||
? `/backoffice/departments/${encodeURIComponent(String(props.selectedDepartmentId))}/employees`
|
||||
: "/backoffice/employees"
|
||||
);
|
||||
|
||||
const tabs = computed(() => [
|
||||
{
|
||||
key: "prices",
|
||||
@@ -50,7 +44,7 @@ const tabs = computed(() => [
|
||||
{
|
||||
key: "employees",
|
||||
label: t("templates.limited_backoffice.nav.employees"),
|
||||
to: employeesRoute.value,
|
||||
to: "/backoffice/employees",
|
||||
},
|
||||
]);
|
||||
|
||||
@@ -68,37 +62,8 @@ const selectDepartment = (event) => {
|
||||
<section class="section limited-backoffice" data-testid="limited-backoffice">
|
||||
<PageTitle
|
||||
:title="t('templates.limited_backoffice.title')"
|
||||
>
|
||||
<template #buttons>
|
||||
<div v-if="props.showDepartmentSwitcher" class="field limited-backoffice__department-field">
|
||||
<label class="label is-sr-only" for="limited-backoffice-department">
|
||||
{{ t("templates.limited_backoffice.department") }}
|
||||
</label>
|
||||
<div class="control">
|
||||
<div class="select is-small is-fullwidth">
|
||||
<select
|
||||
id="limited-backoffice-department"
|
||||
:value="props.selectedDepartmentId || ''"
|
||||
:disabled="props.loadingDepartments || props.departments.length === 0"
|
||||
data-testid="limited-backoffice-department-select"
|
||||
@change="selectDepartment"
|
||||
>
|
||||
<option value="" disabled>
|
||||
{{ t("templates.limited_backoffice.select_department") }}
|
||||
</option>
|
||||
<option v-for="department in props.departments" :key="department.id" :value="department.id">
|
||||
{{ department.name }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<p class="is-size-6 limited-backoffice__subtitle">
|
||||
{{ t("templates.limited_backoffice.subtitle") }}
|
||||
</p>
|
||||
</PageTitle>
|
||||
:subtitle="t('templates.limited_backoffice.subtitle')"
|
||||
/>
|
||||
|
||||
<div class="limited-backoffice__toolbar">
|
||||
<div class="tabs is-toggle is-small limited-backoffice__tabs" data-testid="limited-backoffice-tabs">
|
||||
@@ -110,6 +75,30 @@ const selectDepartment = (event) => {
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div v-if="props.showDepartmentSwitcher" class="field limited-backoffice__department-field">
|
||||
<label class="label" for="limited-backoffice-department">
|
||||
{{ t("templates.limited_backoffice.department") }}
|
||||
</label>
|
||||
<div class="control">
|
||||
<div class="select is-fullwidth">
|
||||
<select
|
||||
id="limited-backoffice-department"
|
||||
:value="props.selectedDepartmentId || ''"
|
||||
:disabled="props.loadingDepartments || props.departments.length === 0"
|
||||
data-testid="limited-backoffice-department-select"
|
||||
@change="selectDepartment"
|
||||
>
|
||||
<option value="" disabled>
|
||||
{{ t("templates.limited_backoffice.select_department") }}
|
||||
</option>
|
||||
<option v-for="department in props.departments" :key="department.id" :value="department.id">
|
||||
{{ department.name }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<slot />
|
||||
@@ -123,8 +112,10 @@ const selectDepartment = (event) => {
|
||||
|
||||
.limited-backoffice__toolbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-end;
|
||||
justify-content: space-between;
|
||||
gap: 1rem;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
@@ -132,12 +123,8 @@ const selectDepartment = (event) => {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.limited-backoffice__subtitle {
|
||||
margin-top: -0.75rem;
|
||||
}
|
||||
|
||||
.limited-backoffice__department-field {
|
||||
min-width: min(42vw, 280px);
|
||||
min-width: min(100%, 260px);
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
@@ -151,16 +138,9 @@ const selectDepartment = (event) => {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.limited-backoffice__tabs {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.limited-backoffice__tabs,
|
||||
.limited-backoffice__department-field {
|
||||
min-width: 9rem;
|
||||
}
|
||||
|
||||
.limited-backoffice__subtitle {
|
||||
margin-top: -0.5rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.limited-backoffice__tabs :deep(ul) {
|
||||
|
||||
-11
@@ -77,15 +77,6 @@ const normalizeMetricState = (metric, fallbackState = "ready", fallbackMessage =
|
||||
message: metric?.message || fallbackMessage,
|
||||
});
|
||||
|
||||
const normalizeNullableNumber = (value) => {
|
||||
if (value === null || value === undefined || value === "") {
|
||||
return null;
|
||||
}
|
||||
|
||||
const normalized = Number(value);
|
||||
return Number.isFinite(normalized) ? normalized : null;
|
||||
};
|
||||
|
||||
const resetOverviewState = () => {
|
||||
count_transactions.value = 0;
|
||||
count_products_sold.value = 0;
|
||||
@@ -158,8 +149,6 @@ const applyOverviewResponse = (overview) => {
|
||||
value: Number(product.value || 0),
|
||||
out_of: Number(product.out_of || 0),
|
||||
state: product.state || "ready",
|
||||
target_percentage: normalizeNullableNumber(product.target_percentage),
|
||||
target_department_id: normalizeNullableNumber(product.target_department_id),
|
||||
},
|
||||
])
|
||||
);
|
||||
|
||||
+4
-239
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, watch, onMounted, computed, nextTick } from 'vue';
|
||||
import { ref, watch, onMounted, computed } from 'vue';
|
||||
import {BSkeleton} from "buefy";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
@@ -76,18 +76,6 @@ const props = defineProps({
|
||||
type: Function,
|
||||
default: () => {}
|
||||
},
|
||||
canEditTarget: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
targetPercentage: {
|
||||
type: [Number, String],
|
||||
default: null,
|
||||
},
|
||||
saveTargetFunction: {
|
||||
type: Function,
|
||||
default: null,
|
||||
},
|
||||
styleContent: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
@@ -96,12 +84,6 @@ const props = defineProps({
|
||||
}
|
||||
});
|
||||
const percentageElement = ref<HTMLElement|null>(null);
|
||||
const targetInputElement = ref<HTMLInputElement|null>(null);
|
||||
const isTargetEditorOpen = ref(false);
|
||||
const targetInputValue = ref("");
|
||||
const isSavingTarget = ref(false);
|
||||
const targetError = ref("");
|
||||
|
||||
const getPercentage = () => {
|
||||
if (props.state !== "ready") {
|
||||
return null;
|
||||
@@ -111,91 +93,6 @@ const getPercentage = () => {
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
const formatPercentageValue = (value: number) => `${value.toFixed(1)}%`;
|
||||
const normalizedTargetPercentage = computed(() => {
|
||||
if (props.targetPercentage === null || props.targetPercentage === undefined || props.targetPercentage === "") {
|
||||
return null;
|
||||
}
|
||||
|
||||
const numericTarget = Number(props.targetPercentage);
|
||||
return Number.isFinite(numericTarget) ? numericTarget : null;
|
||||
});
|
||||
const hasTargetPercentage = computed(() => normalizedTargetPercentage.value !== null);
|
||||
const formattedTargetPercentage = computed(() => (
|
||||
normalizedTargetPercentage.value === null ? "" : formatPercentageValue(normalizedTargetPercentage.value)
|
||||
));
|
||||
const canUseTargetEditor = computed(() => Boolean(
|
||||
props.canEditTarget && props.saveTargetFunction && getPercentage() !== null && !props.isLoading
|
||||
));
|
||||
const percentageButtonTestid = computed(() => (props.dataTestid ? `${props.dataTestid}-percentage-button` : null));
|
||||
const targetButtonTestid = computed(() => (props.dataTestid ? `${props.dataTestid}-target-button` : null));
|
||||
const targetInputTestid = computed(() => (props.dataTestid ? `${props.dataTestid}-target-input` : null));
|
||||
const targetSaveTestid = computed(() => (props.dataTestid ? `${props.dataTestid}-target-save` : null));
|
||||
const targetCancelTestid = computed(() => (props.dataTestid ? `${props.dataTestid}-target-cancel` : null));
|
||||
const targetErrorTestid = computed(() => (props.dataTestid ? `${props.dataTestid}-target-error` : null));
|
||||
|
||||
const openTargetEditor = async () => {
|
||||
if (!canUseTargetEditor.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
targetInputValue.value = normalizedTargetPercentage.value === null
|
||||
? ""
|
||||
: String(normalizedTargetPercentage.value);
|
||||
targetError.value = "";
|
||||
isTargetEditorOpen.value = true;
|
||||
await nextTick();
|
||||
targetInputElement.value?.focus();
|
||||
autoAdjustedFontSizeTitle.value = determineTitleFontSize(props.title);
|
||||
};
|
||||
|
||||
const closeTargetEditor = () => {
|
||||
targetError.value = "";
|
||||
isTargetEditorOpen.value = false;
|
||||
nextTick(() => {
|
||||
autoAdjustedFontSizeTitle.value = determineTitleFontSize(props.title);
|
||||
});
|
||||
};
|
||||
|
||||
const parseTargetInputValue = () => {
|
||||
const rawValue = String(targetInputValue.value || "").trim().replace(",", ".");
|
||||
if (rawValue === "") {
|
||||
return { valid: true, value: null };
|
||||
}
|
||||
|
||||
const numericTarget = Number(rawValue);
|
||||
if (!Number.isFinite(numericTarget) || numericTarget < 0 || numericTarget > 100) {
|
||||
return { valid: false, value: null };
|
||||
}
|
||||
|
||||
return { valid: true, value: Math.round(numericTarget * 10) / 10 };
|
||||
};
|
||||
|
||||
const saveTarget = async () => {
|
||||
if (!canUseTargetEditor.value || isSavingTarget.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
const parsedTarget = parseTargetInputValue();
|
||||
if (!parsedTarget.valid) {
|
||||
targetError.value = t("admin.daily_report.product_targets.validation_range");
|
||||
return;
|
||||
}
|
||||
|
||||
isSavingTarget.value = true;
|
||||
targetError.value = "";
|
||||
try {
|
||||
await props.saveTargetFunction(parsedTarget.value);
|
||||
closeTargetEditor();
|
||||
} catch (error) {
|
||||
console.error("Failed to save daily report product target", error);
|
||||
targetError.value = t("admin.daily_report.product_targets.save_error");
|
||||
} finally {
|
||||
isSavingTarget.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const getAveragePercentage = () => {
|
||||
return null; // TODO: Average percentage
|
||||
}
|
||||
@@ -269,11 +166,6 @@ watch(() => props.count, (newVal) => {
|
||||
autoAdjustedFontSize.value = determineFontSize(newVal);
|
||||
determineTitleFontSize(props.title);
|
||||
}, { immediate: true });
|
||||
watch(() => [props.targetPercentage, isTargetEditorOpen.value], () => {
|
||||
nextTick(() => {
|
||||
autoAdjustedFontSizeTitle.value = determineTitleFontSize(props.title);
|
||||
});
|
||||
}, { immediate: true });
|
||||
|
||||
onMounted(() => {
|
||||
autoAdjustedFontSizeTitle.value = determineTitleFontSize(props.title);
|
||||
@@ -288,19 +180,12 @@ const isUnavailable = computed(() => props.state === "unavailable");
|
||||
<template>
|
||||
<div class="card" @click="clickFunction" :data-testid="dataTestid || null">
|
||||
<div class="card-content" :style="styleContent">
|
||||
<div class="daily-report-count__percentage-stack has-text-right is-flex is-flex-direction-column is-4" v-if="getPercentage() !== null" ref="percentageElement">
|
||||
<button
|
||||
type="button"
|
||||
class="button is-small is-info"
|
||||
:class="{
|
||||
<div class="is-pulled-right has-text-right is-flex is-flex-direction-column is-4" style="gap: 4px;" v-if="getPercentage() !== null" ref="percentageElement">
|
||||
<button class="button is-small is-info" :class="{
|
||||
'has-background-success has-text-black': getAveragePercentage() !== null && isAverage(),
|
||||
'has-background-danger has-text-black': getAveragePercentage() !== null && !isAverage(),
|
||||
'is-outlined': getAveragePercentage() === null
|
||||
}"
|
||||
:aria-label="canUseTargetEditor ? t('admin.daily_report.product_targets.edit_aria') : null"
|
||||
:data-testid="percentageButtonTestid"
|
||||
@click.stop="openTargetEditor"
|
||||
>
|
||||
}">
|
||||
<!--<span class="icon is-small">
|
||||
<i class="fas fa-sync-alt"></i>
|
||||
</span>-->
|
||||
@@ -312,75 +197,6 @@ const isUnavailable = computed(() => props.state === "unavailable");
|
||||
</template>
|
||||
</button>
|
||||
|
||||
<form
|
||||
v-if="isTargetEditorOpen"
|
||||
class="daily-report-count__target-editor"
|
||||
@submit.prevent.stop="saveTarget"
|
||||
@click.stop
|
||||
>
|
||||
<div class="field has-addons daily-report-count__target-editor-controls">
|
||||
<div class="control">
|
||||
<input
|
||||
ref="targetInputElement"
|
||||
v-model="targetInputValue"
|
||||
class="input is-small daily-report-count__target-input"
|
||||
type="number"
|
||||
min="0"
|
||||
max="100"
|
||||
step="0.1"
|
||||
inputmode="decimal"
|
||||
:aria-label="t('admin.daily_report.product_targets.input_label')"
|
||||
:data-testid="targetInputTestid"
|
||||
>
|
||||
</div>
|
||||
<div class="control">
|
||||
<button
|
||||
class="button is-small is-success"
|
||||
type="submit"
|
||||
:class="{ 'is-loading': isSavingTarget }"
|
||||
:aria-label="t('admin.daily_report.product_targets.save_aria')"
|
||||
:data-testid="targetSaveTestid"
|
||||
>
|
||||
<span class="icon is-small">
|
||||
<i class="fas fa-check"></i>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="control">
|
||||
<button
|
||||
class="button is-small"
|
||||
type="button"
|
||||
:aria-label="t('admin.daily_report.product_targets.cancel_aria')"
|
||||
:data-testid="targetCancelTestid"
|
||||
@click.stop="closeTargetEditor"
|
||||
>
|
||||
<span class="icon is-small">
|
||||
<i class="fas fa-times"></i>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<p
|
||||
v-if="targetError"
|
||||
class="help is-danger daily-report-count__target-error"
|
||||
:data-testid="targetErrorTestid"
|
||||
>
|
||||
{{ targetError }}
|
||||
</p>
|
||||
</form>
|
||||
|
||||
<button
|
||||
v-else-if="hasTargetPercentage"
|
||||
type="button"
|
||||
class="button is-small is-info is-outlined daily-report-count__target-button"
|
||||
:aria-label="canUseTargetEditor ? t('admin.daily_report.product_targets.edit_aria') : null"
|
||||
:data-testid="targetButtonTestid"
|
||||
@click.stop="openTargetEditor"
|
||||
>
|
||||
<i class="fas fa-bullseye daily-report-count__target-background-icon" aria-hidden="true"></i>
|
||||
<span class="daily-report-count__target-value">{{ formattedTargetPercentage }}</span>
|
||||
</button>
|
||||
|
||||
<button v-if="getAveragePercentage()" class="button is-small is-info is-outlined">
|
||||
<!--<span class="icon is-small">
|
||||
<i class="fas fa-sync-alt"></i>
|
||||
@@ -466,56 +282,5 @@ const isUnavailable = computed(() => props.state === "unavailable");
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.card-content {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.daily-report-count__percentage-stack {
|
||||
align-items: flex-end;
|
||||
gap: 4px;
|
||||
position: absolute;
|
||||
right: 1.25rem;
|
||||
top: 1.25rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.daily-report-count__target-button {
|
||||
min-width: 64px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.daily-report-count__target-background-icon {
|
||||
font-size: 1.35rem;
|
||||
left: 50%;
|
||||
opacity: 0.16;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.daily-report-count__target-value {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.daily-report-count__target-editor {
|
||||
width: 154px;
|
||||
}
|
||||
|
||||
.daily-report-count__target-editor-controls {
|
||||
justify-content: flex-end;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.daily-report-count__target-input {
|
||||
max-width: 68px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.daily-report-count__target-error {
|
||||
max-width: 154px;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
+1
-66
@@ -1,16 +1,9 @@
|
||||
<script setup>
|
||||
import { computed } from "vue";
|
||||
import { Colors } from "@/ThemeConfig.vue";
|
||||
import { SessionUser } from "@/components/session/token/SessionUser.vue";
|
||||
import {
|
||||
daily_report_products,
|
||||
refreshOverview,
|
||||
selected_department_ids,
|
||||
} from "@/views/dashboards/departmentDashboard/modules/daily-report/DepartmentDailyReportObject.vue";
|
||||
import { daily_report_products } from "@/views/dashboards/departmentDashboard/modules/daily-report/DepartmentDailyReportObject.vue";
|
||||
import DepartmentDashboardDailyReportCount from "@/views/dashboards/departmentDashboard/modules/daily-report/displays/DepartmentDashboardDailyReportCount.vue";
|
||||
|
||||
const SET_PRODUCT_TARGET_PERMISSION = "set_department_daily_report_product_targets";
|
||||
|
||||
const FALLBACK_PRODUCT_TITLES = {
|
||||
24: "Spot Free (Lastbil)",
|
||||
25: "Fælg flex pr. enhed",
|
||||
@@ -58,8 +51,6 @@ const productTile = computed(() => {
|
||||
out_of: 0,
|
||||
state: "ready",
|
||||
message: null,
|
||||
target_percentage: null,
|
||||
target_department_id: null,
|
||||
};
|
||||
});
|
||||
|
||||
@@ -79,59 +70,6 @@ const resolvedTitle = computed(() => {
|
||||
|
||||
return FALLBACK_PRODUCT_TITLES[props.product_id] || null;
|
||||
});
|
||||
|
||||
const selectedDepartmentId = computed(() => {
|
||||
const selectedDepartmentIds = Array.isArray(selected_department_ids.value)
|
||||
? selected_department_ids.value.map((departmentId) => Number(departmentId)).filter((departmentId) => departmentId > 0)
|
||||
: [];
|
||||
|
||||
return selectedDepartmentIds.length === 1 ? selectedDepartmentIds[0] : null;
|
||||
});
|
||||
|
||||
const targetPercentage = computed(() => {
|
||||
const target = productTile.value?.target_percentage;
|
||||
if (target === null || target === undefined || target === "") {
|
||||
return null;
|
||||
}
|
||||
|
||||
const numericTarget = Number(target);
|
||||
return Number.isFinite(numericTarget) ? numericTarget : null;
|
||||
});
|
||||
|
||||
const canEditProductTarget = computed(() => Boolean(
|
||||
selectedDepartmentId.value !== null && SessionUser.hasPermission(SET_PRODUCT_TARGET_PERMISSION)
|
||||
));
|
||||
|
||||
const saveProductTarget = async (nextTargetPercentage) => {
|
||||
const departmentId = selectedDepartmentId.value;
|
||||
if (departmentId === null) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const response = await SessionUser.objects.department_daily_reports.functions.setProductTarget({
|
||||
department_id: departmentId,
|
||||
product_id: props.product_id,
|
||||
target_percentage: nextTargetPercentage,
|
||||
});
|
||||
const savedTarget = response?.data?.data?.target_percentage ?? nextTargetPercentage;
|
||||
const normalizedTarget = savedTarget === null || savedTarget === undefined || savedTarget === ""
|
||||
? null
|
||||
: Number(savedTarget);
|
||||
|
||||
daily_report_products.value = {
|
||||
...daily_report_products.value,
|
||||
[props.product_id]: {
|
||||
...productTile.value,
|
||||
product_id: props.product_id,
|
||||
target_percentage: Number.isFinite(normalizedTarget) ? normalizedTarget : null,
|
||||
target_department_id: Number.isFinite(normalizedTarget) ? departmentId : null,
|
||||
},
|
||||
};
|
||||
|
||||
await refreshOverview();
|
||||
|
||||
return response;
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -145,9 +83,6 @@ const saveProductTarget = async (nextTargetPercentage) => {
|
||||
:isLoading="is_loading"
|
||||
:state="productTile.state || 'ready'"
|
||||
:unavailable-message="productTile.message || 'Ikke tilgængelig'"
|
||||
:can-edit-target="canEditProductTarget"
|
||||
:target-percentage="targetPercentage"
|
||||
:save-target-function="saveProductTarget"
|
||||
:style-content="styleContent"
|
||||
:data-testid="dataTestid"
|
||||
/>
|
||||
|
||||
+11
-11
@@ -14,16 +14,6 @@ import NotificationsPhonePagination
|
||||
:title="$t('admin.notifications.title')"
|
||||
:subtitle="$t('admin.notifications.subtitle')"
|
||||
>
|
||||
<header class="mb-5" data-testid="department-notifications-page-header">
|
||||
<h1 class="title is-3 mb-2" data-testid="department-notifications-title">
|
||||
{{ $t('admin.notifications.title') }}
|
||||
</h1>
|
||||
<p class="subtitle is-6 mb-0" data-testid="department-notifications-subtitle">
|
||||
<span>{{ $t('admin.notifications.sms_overview') }}</span>
|
||||
<br>
|
||||
<span>{{ $t('admin.notifications.sms_activated_description') }}</span>
|
||||
</p>
|
||||
</header>
|
||||
<NotFoundFallBackPageWrapper :exists="SessionUser.functions.getDepartmentIdFromUrl() && SessionUser.canAccessDepartment(SessionUser.functions.getDepartmentIdFromUrl())" :error="$t('admin.errors.select_department')">
|
||||
<element-tabs-box
|
||||
defaultActiveTab="sms"
|
||||
@@ -34,6 +24,16 @@ import NotificationsPhonePagination
|
||||
]"
|
||||
>
|
||||
<template #sms>
|
||||
<!-- What is this? -->
|
||||
<div class="message">
|
||||
<div class="message-header">
|
||||
<p>{{ $t('admin.notifications.sms_notifications') }}</p>
|
||||
</div>
|
||||
<div class="message-body">
|
||||
<p>{{ $t('admin.notifications.sms_overview') }}</p>
|
||||
<p>{{ $t('admin.notifications.sms_activated_description') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<NotificationsPhonePagination />
|
||||
</template>
|
||||
</element-tabs-box>
|
||||
@@ -44,4 +44,4 @@ import NotificationsPhonePagination
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
</style>
|
||||
@@ -4,8 +4,6 @@ import { isCompactProject } from "./support/projects";
|
||||
|
||||
const adminPermissions = [
|
||||
"admin",
|
||||
"list_department_daily_reports",
|
||||
"list_bookings",
|
||||
"create_department_daily_report_complaints",
|
||||
"department_access_1",
|
||||
"department_access_2",
|
||||
@@ -28,26 +26,8 @@ const buildOverviewPayload = ({
|
||||
complaintsMessage = null,
|
||||
metrics = {},
|
||||
products = [
|
||||
{
|
||||
product_id: 24,
|
||||
slug: "spot-free-lastbil",
|
||||
title: "Spot Free (Lastbil)",
|
||||
state: "ready",
|
||||
value: 3,
|
||||
out_of: 8,
|
||||
target_percentage: null,
|
||||
target_department_id: null,
|
||||
},
|
||||
{
|
||||
product_id: 25,
|
||||
slug: "faelg-flex",
|
||||
title: "Fælg flex pr. enhed",
|
||||
state: "ready",
|
||||
value: 2,
|
||||
out_of: 8,
|
||||
target_percentage: null,
|
||||
target_department_id: null,
|
||||
},
|
||||
{ product_id: 24, slug: "spot-free-lastbil", title: "Spot Free (Lastbil)", state: "ready", value: 3, out_of: 8 },
|
||||
{ product_id: 25, slug: "faelg-flex", title: "Fælg flex pr. enhed", state: "ready", value: 2, out_of: 8 },
|
||||
{
|
||||
product_id: 27,
|
||||
slug: "extraordinary-10-min",
|
||||
@@ -55,8 +35,6 @@ const buildOverviewPayload = ({
|
||||
state: "ready",
|
||||
value: 1,
|
||||
out_of: 8,
|
||||
target_percentage: null,
|
||||
target_department_id: null,
|
||||
},
|
||||
{
|
||||
product_id: 26,
|
||||
@@ -65,19 +43,8 @@ const buildOverviewPayload = ({
|
||||
state: "ready",
|
||||
value: 4,
|
||||
out_of: 8,
|
||||
target_percentage: null,
|
||||
target_department_id: null,
|
||||
},
|
||||
{
|
||||
product_id: 21,
|
||||
slug: "undervognsskyl",
|
||||
title: "Undervognsskyl pr. enhed",
|
||||
state: "ready",
|
||||
value: 2,
|
||||
out_of: 8,
|
||||
target_percentage: null,
|
||||
target_department_id: null,
|
||||
},
|
||||
{ product_id: 21, slug: "undervognsskyl", title: "Undervognsskyl pr. enhed", state: "ready", value: 2, out_of: 8 },
|
||||
{
|
||||
product_id: 22,
|
||||
slug: "double-duty-kemi",
|
||||
@@ -85,8 +52,6 @@ const buildOverviewPayload = ({
|
||||
state: "ready",
|
||||
value: 5,
|
||||
out_of: 8,
|
||||
target_percentage: null,
|
||||
target_department_id: null,
|
||||
},
|
||||
],
|
||||
...overrides
|
||||
@@ -127,9 +92,6 @@ async function mockDailyReportDependencies(
|
||||
body: Record<string, unknown>
|
||||
) => Promise<ReturnType<typeof json>> | ReturnType<typeof json>;
|
||||
complaintCustomerLookupHandler?: (url: URL) => Promise<ReturnType<typeof json>> | ReturnType<typeof json>;
|
||||
productTargetHandler?: (
|
||||
body: Record<string, unknown>
|
||||
) => Promise<ReturnType<typeof json>> | ReturnType<typeof json>;
|
||||
permissions?: string[];
|
||||
}
|
||||
| ((url: URL) => Promise<ReturnType<typeof json>> | ReturnType<typeof json>)
|
||||
@@ -152,16 +114,6 @@ async function mockDailyReportDependencies(
|
||||
},
|
||||
}));
|
||||
const complaintCustomerLookupHandler = options.complaintCustomerLookupHandler || (async () => json({ data: [] }));
|
||||
const productTargetHandler =
|
||||
options.productTargetHandler ||
|
||||
(async (body) =>
|
||||
json({
|
||||
data: {
|
||||
department_id: body.department_id,
|
||||
product_id: body.product_id,
|
||||
target_percentage: body.target_percentage ?? null,
|
||||
},
|
||||
}));
|
||||
|
||||
await seedAuthenticatedState(page);
|
||||
await mockApi(page, {
|
||||
@@ -215,12 +167,6 @@ async function mockDailyReportDependencies(
|
||||
await route.fulfill(response);
|
||||
});
|
||||
|
||||
await page.route(/\/departments\/daily-reports\/product-targets$/i, async (route) => {
|
||||
const body = route.request().postDataJSON() as Record<string, unknown>;
|
||||
const response = await productTargetHandler(body);
|
||||
await route.fulfill(response);
|
||||
});
|
||||
|
||||
await page.route(/\/departments\/daily-reports(?:\/overview)?(\?.*)?$/i, async (route) => {
|
||||
const url = new URL(route.request().url());
|
||||
if (url.pathname.endsWith("/departments/daily-reports/overview")) {
|
||||
@@ -253,7 +199,7 @@ test.describe("Admin daily report", () => {
|
||||
await page.goto("/admin/1/modules/daily-report?departmentIds=1&dateFrom=2026-03-23&dateTo=2026-03-23");
|
||||
|
||||
await expect(page.getByTestId("daily-report-page")).toBeVisible();
|
||||
await expect(page.locator(".card[data-testid^='daily-report-tile-']")).toHaveCount(17);
|
||||
await expect(page.locator("[data-testid^='daily-report-tile-']")).toHaveCount(17);
|
||||
await expect(page.getByTestId("daily-report-tile-bookings")).toContainText("4");
|
||||
await expect(page.getByTestId("daily-report-tile-complaints")).toContainText("2");
|
||||
await expect(page.getByTestId("daily-report-complaints-add-button")).toBeVisible();
|
||||
@@ -270,81 +216,6 @@ test.describe("Admin daily report", () => {
|
||||
await expect(page.getByTestId("daily-report-tile-double-duty-kemi")).toContainText("Tillæg for Specialsæbe - DD");
|
||||
});
|
||||
|
||||
test("lets permitted users set a target from an optional product percentage", async ({ page }) => {
|
||||
let targetPercentage: number | null = null;
|
||||
const targetRequests: Array<Record<string, unknown>> = [];
|
||||
|
||||
await mockDailyReportDependencies(page, {
|
||||
permissions: [...adminPermissions, "set_department_daily_report_product_targets"],
|
||||
overviewHandler: async () =>
|
||||
json(
|
||||
buildOverviewPayload({
|
||||
products: [
|
||||
{
|
||||
product_id: 24,
|
||||
slug: "spot-free-lastbil",
|
||||
title: "Spot Free (Lastbil)",
|
||||
state: "ready",
|
||||
value: 3,
|
||||
out_of: 8,
|
||||
target_percentage: targetPercentage,
|
||||
target_department_id: targetPercentage === null ? null : 1,
|
||||
},
|
||||
],
|
||||
})
|
||||
),
|
||||
productTargetHandler: async (body) => {
|
||||
targetRequests.push(body);
|
||||
targetPercentage = body.target_percentage === null ? null : Number(body.target_percentage);
|
||||
|
||||
return json({
|
||||
data: {
|
||||
department_id: body.department_id,
|
||||
product_id: body.product_id,
|
||||
target_percentage: targetPercentage,
|
||||
},
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
await page.goto("/admin/1/modules/daily-report?departmentIds=1&dateFrom=2026-03-23&dateTo=2026-03-23");
|
||||
await expect(page.getByTestId("daily-report-page")).toBeVisible();
|
||||
|
||||
const productTile = page.getByTestId("daily-report-tile-spot-free-lastbil");
|
||||
const percentageButton = page.getByTestId("daily-report-tile-spot-free-lastbil-percentage-button");
|
||||
await expect(percentageButton).toBeVisible();
|
||||
await expect(percentageButton).toHaveClass(/is-outlined/);
|
||||
await expect(page.locator('[data-testid="daily-report-tile-spot-free-lastbil-target-button"]')).toHaveCount(0);
|
||||
|
||||
await percentageButton.click();
|
||||
await page.getByTestId("daily-report-tile-spot-free-lastbil-target-input").fill("55.5");
|
||||
await page.getByTestId("daily-report-tile-spot-free-lastbil-target-save").click();
|
||||
|
||||
await expect.poll(() => targetRequests.length).toBe(1);
|
||||
expect(targetRequests[0]).toMatchObject({
|
||||
department_id: 1,
|
||||
product_id: 24,
|
||||
target_percentage: 55.5,
|
||||
});
|
||||
await expect(page.getByTestId("daily-report-tile-spot-free-lastbil-target-button")).toContainText("55.5%");
|
||||
await expect(productTile.locator(".daily-report-count__target-background-icon")).toHaveCount(1);
|
||||
});
|
||||
|
||||
test("does not open the product target editor without permission", async ({ page }) => {
|
||||
await mockDailyReportDependencies(page, {
|
||||
overviewHandler: async () => json(buildOverviewPayload()),
|
||||
permissions: adminPermissions,
|
||||
});
|
||||
|
||||
await page.goto("/admin/1/modules/daily-report?departmentIds=1&dateFrom=2026-03-23&dateTo=2026-03-23");
|
||||
await expect(page.getByTestId("daily-report-page")).toBeVisible();
|
||||
|
||||
await page.getByTestId("daily-report-tile-spot-free-lastbil-percentage-button").click();
|
||||
|
||||
await expect(page.locator('[data-testid="daily-report-tile-spot-free-lastbil-target-input"]')).toHaveCount(0);
|
||||
await expect(page.locator('[data-testid="daily-report-tile-spot-free-lastbil-target-button"]')).toHaveCount(0);
|
||||
});
|
||||
|
||||
test("renders rounded-up weather hours and keeps unknown productivity gray", async ({ page }) => {
|
||||
await mockDailyReportDependencies(page, {
|
||||
overviewHandler: async () => json(buildOverviewPayload()),
|
||||
|
||||
@@ -18,8 +18,6 @@ const json = (body: unknown, status = 200) => ({
|
||||
});
|
||||
const pageReadyTimeout = process.env.CI ? 30_000 : 15_000;
|
||||
|
||||
const pageBootstrapTimeoutMs = 45_000;
|
||||
|
||||
const setupNotificationSmsApi = async (page: Page) => {
|
||||
let listRequestCount = 0;
|
||||
const mutations: Array<{ method: string; body?: Record<string, unknown>; id?: number }> = [];
|
||||
@@ -120,21 +118,6 @@ test("@smoke department notification SMS active toggle and delete refresh the ta
|
||||
await page.goto("/admin/1/modules/notifications", { waitUntil: "domcontentloaded" });
|
||||
await expect.poll(() => notificationSmsApi.listRequestCount, { timeout: pageReadyTimeout }).toBeGreaterThan(0);
|
||||
|
||||
const pageTitle = page.getByTestId("department-notifications-title");
|
||||
await expect(pageTitle).toBeVisible({ timeout: pageBootstrapTimeoutMs });
|
||||
await expect(pageTitle).toContainText(/notifikationer|notifications/i);
|
||||
|
||||
const pageSubtitle = page.getByTestId("department-notifications-subtitle");
|
||||
await expect(pageSubtitle).toBeVisible();
|
||||
await expect(pageSubtitle).toContainText(/sms/i);
|
||||
await expect(page.locator(".message").filter({ hasText: /sms/i })).toHaveCount(0);
|
||||
|
||||
const addPhoneButton = page.getByTestId("department-notification-sms-add-button");
|
||||
await expect(addPhoneButton).toBeVisible();
|
||||
await expect(addPhoneButton).toHaveClass(/is-primary/);
|
||||
await expect(addPhoneButton).not.toHaveClass(/is-info/);
|
||||
await expect(addPhoneButton.locator(".fa-plus")).toBeVisible();
|
||||
|
||||
const row = page.locator("tr", { hasText: "Dispatch line" });
|
||||
await expect(row).toBeVisible({ timeout: pageReadyTimeout });
|
||||
const enabledToggle = page.getByTestId("department-notification-sms-enabled-toggle-501");
|
||||
|
||||
@@ -825,7 +825,7 @@ test.describe("Coolify infrastructure management", () => {
|
||||
await expect(actions.getByRole("button", { name: "Reconcile Coolify" })).toBeVisible();
|
||||
await expect(actions.getByRole("button", { name: "Coolify failover" })).toBeVisible();
|
||||
await actions.getByRole("button", { name: "Reconcile Coolify" }).click();
|
||||
await expect.poll(() => state.reconciledTargets.length).toBeGreaterThan(0);
|
||||
expect(state.reconciledTargets.length).toBeGreaterThan(0);
|
||||
});
|
||||
|
||||
test("resumes Coolify-backed provisioning after page reload", async ({ page }) => {
|
||||
@@ -1044,9 +1044,7 @@ test.describe("Coolify infrastructure management", () => {
|
||||
await actions.locator(".action-settings-wheel-trigger").click();
|
||||
await actions.getByRole("button", { name: /Rename|Omdøb/ }).click();
|
||||
|
||||
await expect
|
||||
.poll(() => state.renamedHosts)
|
||||
.toContainEqual({ kind: "database", id: 2, label: "mariadb-manual-replica" });
|
||||
expect(state.renamedHosts).toContainEqual({ kind: "database", id: 2, label: "mariadb-manual-replica" });
|
||||
await expect(page.getByTestId("replication-host-database-2")).toContainText("mariadb-manual-replica");
|
||||
});
|
||||
});
|
||||
|
||||
@@ -6,7 +6,6 @@ import { scanViewTranslationKeys, type ViewTranslationKeyUsage } from "./support
|
||||
const ACTIVE_LOCALES = ["da", "en", "sv", "de", "no"] as const;
|
||||
const GENERATED_LOCALES_DIRECTORY = path.join(process.cwd(), "src", "i18n", "generated");
|
||||
const REVIEWED_NON_LITERAL_CALLS = new Set([
|
||||
"src/views/backoffice/LimitedBackofficeEmployees.vue|t|return `${option.flag} +${option.value} ${t(`templates.limited_backoffice.employees.country_codes.${option.labelKey}`)}`;",
|
||||
"src/views/dashboards/superUserDashboard/InvoicingBillingPeriod/components/InvoicingPeriodFlagList.vue|t|const translated = t(key, params);",
|
||||
'src/views/dashboards/superUserDashboard/system/ReplicationManagement.vue|t|return t(`replication.status.${status || "unknown"}`);',
|
||||
"src/views/dashboards/superUserDashboard/system/ReplicationManagement.vue|te|if (key && te(key)) {",
|
||||
@@ -15,18 +14,9 @@ const REVIEWED_NON_LITERAL_CALLS = new Set([
|
||||
'src/views/dashboards/superUserDashboard/system/ReplicationManagement.vue|t|<li v-for="key in redisComposeInstructionKeys" :key="key">{{ t(key) }}</li>',
|
||||
'src/views/dashboards/superUserDashboard/system/ReplicationManagement.vue|t|<li v-for="key in minioComposeInstructionKeys" :key="key">{{ t(key) }}</li>',
|
||||
"src/views/dashboards/superUserDashboard/system/ReplicationManagement.vue|t|<td>{{ t(`replication.roles.${host.role}`) }}</td>",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|label: t(`roles.permissions.page_access.${permission}.label`),",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|description: t(`roles.permissions.page_access.${permission}.description`),",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|label: t(`roles.permissions.groups.${group.key}.label`),",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|description: t(`roles.permissions.groups.${group.key}.description`),",
|
||||
"src/views/dashboards/superUserDashboard/configuration/ConfigurationReleaseManager.vue|t|const tr = (key, params = {}) => t(`configuration.release_manager.${key}`, params);",
|
||||
"src/views/dashboards/superUserDashboard/configuration/ConfigurationReleaseManager.vue|t|const translated = t(fullKey, params);",
|
||||
"src/views/dashboards/superUserDashboard/ErrorReports.vue|t|const value = t(key);",
|
||||
"src/views/backoffice/LimitedBackofficeEmployees.vue|t|return `${option.flag} +${option.value} ${t(`templates.limited_backoffice.employees.country_codes.${option.labelKey}`)}`;",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|label: t(`roles.permissions.page_access.${permission}.label`),",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|description: t(`roles.permissions.page_access.${permission}.description`),",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|label: t(`roles.permissions.groups.${group.key}.label`),",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|description: t(`roles.permissions.groups.${group.key}.description`),",
|
||||
'src/views/dashboards/userDashboard/wash/components/LaneSelectionSection.vue|$t|:title="option.titleKey ? $t(option.titleKey) : null"',
|
||||
'src/views/dashboards/userDashboard/wash/components/LaneSelectionSection.vue|$t|:aria-label="option.titleKey ? $t(option.titleKey) : null"',
|
||||
"src/views/dashboards/userDashboard/wash/components/LaneSelectionSection.vue|$t|{{ $t(option.statusLabelKey) }}",
|
||||
@@ -34,10 +24,6 @@ const REVIEWED_NON_LITERAL_CALLS = new Set([
|
||||
"src/views/dashboards/userDashboard/wash/components/WashTypeSelector.vue|$t|{{ $t(option.statusLabelKey) }}",
|
||||
'src/views/dashboards/userDashboard/wash/MyWashStart.vue|$t|:vehicle-step-guidance="vehicleStepGuidanceKey ? $t(vehicleStepGuidanceKey) : null"',
|
||||
"src/views/dashboards/userDashboard/wash/MyWashStart.vue|$t|{{ $t(confirmActionLabelKey) }}",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|label: t(`roles.permissions.page_access.${permission}.label`),",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|description: t(`roles.permissions.page_access.${permission}.description`),",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|label: t(`roles.permissions.groups.${group.key}.label`),",
|
||||
"src/views/dashboards/superUserDashboard/roles/SuperUserRolesPermissions.vue|t|description: t(`roles.permissions.groups.${group.key}.description`),",
|
||||
]);
|
||||
|
||||
const readGeneratedJson = (fileName: string) => {
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { expect, test, type Page } from "@playwright/test";
|
||||
import { expect, test } from "@playwright/test";
|
||||
import { API_HOST, seedAuthenticatedState } from "./support/network.js";
|
||||
import { isDesktopProject } from "./support/projects";
|
||||
|
||||
@@ -14,7 +14,6 @@ const limitedManagerPermissions = [
|
||||
"limited_backoffice_prices_manage",
|
||||
"limited_backoffice_employees_manage",
|
||||
"department_access_1",
|
||||
"department_access_2",
|
||||
];
|
||||
|
||||
const sessionData = {
|
||||
@@ -63,10 +62,7 @@ const adminLimitedSessionData = {
|
||||
permissions: ["user", "admin", "limited_backoffice_access", "department_access_1"],
|
||||
};
|
||||
|
||||
const assignedDepartments = [
|
||||
{ id: 1, name: "Assigned Depot", description: "", visible: true, archived: false },
|
||||
{ id: 2, name: "Remote Depot", description: "", visible: true, archived: false },
|
||||
];
|
||||
const assignedDepartments = [{ id: 1, name: "Assigned Depot", description: "", visible: true, archived: false }];
|
||||
|
||||
const pricePayload = {
|
||||
department: { id: 1, name: "Assigned Depot", description: "" },
|
||||
@@ -239,11 +235,6 @@ const rolePermissionGroups = {
|
||||
],
|
||||
};
|
||||
|
||||
const remotePricePayload = {
|
||||
...pricePayload,
|
||||
department: { id: 2, name: "Remote Depot", description: "" },
|
||||
};
|
||||
|
||||
const rolesPayload = [
|
||||
{ key: "viewer", label: "Viewer", description: "Can view.", permission_groups: rolePermissionGroups.viewer },
|
||||
{ key: "cashier", label: "Cashier", description: "Can sell.", permission_groups: rolePermissionGroups.cashier },
|
||||
@@ -283,17 +274,6 @@ const employeesPayload = [
|
||||
created_at: "2026-01-01 00:00:00",
|
||||
updated_at: "2026-01-01 00:00:00",
|
||||
},
|
||||
{
|
||||
id: 502,
|
||||
customer_number: 900000502,
|
||||
display_name: "Riley Remote",
|
||||
email: "riley@example.com",
|
||||
active: true,
|
||||
role: { key: "viewer", label: "Viewer", description: "Can view." },
|
||||
departments: [{ id: 2, name: "Remote Depot" }],
|
||||
created_at: "2026-01-01 00:00:00",
|
||||
updated_at: "2026-01-01 00:00:00",
|
||||
},
|
||||
];
|
||||
|
||||
async function seedLimitedBackofficeSession(page, token = "limited-backoffice-token") {
|
||||
@@ -370,11 +350,6 @@ async function mockLimitedBackofficeApi(page, authSessionData = sessionData, opt
|
||||
return;
|
||||
}
|
||||
|
||||
if (pathname.endsWith("/limited-backoffice/departments/2/prices") && method === "GET") {
|
||||
await route.fulfill(json({ data: remotePricePayload }));
|
||||
return;
|
||||
}
|
||||
|
||||
if (pathname.endsWith("/limited-backoffice/departments/1/prices") && method === "PUT") {
|
||||
const body = request.postDataJSON?.() || null;
|
||||
priceUpdateCalls.push(body);
|
||||
@@ -487,20 +462,6 @@ async function mockLimitedBackofficeApi(page, authSessionData = sessionData, opt
|
||||
};
|
||||
}
|
||||
|
||||
async function expectDepartmentSelectorInTitleRow(page: Page) {
|
||||
const headingBox = await page.getByRole("heading", { name: "Backoffice" }).boundingBox();
|
||||
const selectBox = await page.getByTestId("limited-backoffice-department-select").boundingBox();
|
||||
|
||||
expect(headingBox).not.toBeNull();
|
||||
expect(selectBox).not.toBeNull();
|
||||
if (!headingBox || !selectBox) {
|
||||
return;
|
||||
}
|
||||
|
||||
expect(selectBox.x).toBeGreaterThan(headingBox.x);
|
||||
expect(Math.abs(selectBox.y + selectBox.height / 2 - (headingBox.y + headingBox.height / 2))).toBeLessThan(48);
|
||||
}
|
||||
|
||||
test.describe("Limited backoffice", () => {
|
||||
test("shows the limited backoffice header shortcut only on department-scoped admin pages", async ({
|
||||
page,
|
||||
@@ -578,9 +539,7 @@ test.describe("Limited backoffice", () => {
|
||||
await page.goto("/backoffice/departments/1/prices");
|
||||
|
||||
await expect(page.getByTestId("limited-prices-title")).toBeVisible();
|
||||
await expectDepartmentSelectorInTitleRow(page);
|
||||
await expect(page.getByTestId("limited-backoffice-department-select")).toContainText("Assigned Depot");
|
||||
await expect(page.getByTestId("limited-backoffice-department-select")).toContainText("Remote Depot");
|
||||
await expect(page.getByTestId("limited-backoffice-department-select")).not.toContainText("Other Depot");
|
||||
await expect(page.getByTestId("limited-price-row-101")).toContainText("Truck wash");
|
||||
await expect(page.getByTestId("limited-price-input-101")).toHaveValue("125");
|
||||
@@ -759,16 +718,12 @@ test.describe("Limited backoffice", () => {
|
||||
await seedLimitedBackofficeSession(page);
|
||||
const api = await mockLimitedBackofficeApi(page);
|
||||
|
||||
await page.goto("/backoffice/departments/1/employees");
|
||||
await page.goto("/backoffice/employees");
|
||||
|
||||
await expect(page.getByTestId("limited-employees-title")).toBeVisible();
|
||||
await expectDepartmentSelectorInTitleRow(page);
|
||||
await expect(page.getByTestId("limited-employee-row-501")).toContainText("Casey Clerk");
|
||||
await expect(page.getByTestId("limited-employee-user-id-501")).toHaveText("501");
|
||||
await expect(page.getByTestId("limited-employee-phone-501")).toHaveText("+45 12345678");
|
||||
await expect(page.getByTestId("limited-employee-row-502")).toHaveCount(0);
|
||||
await expect(page.getByTestId("limited-employee-department-1")).toBeChecked();
|
||||
await expect(page.getByTestId("limited-employee-department-2")).not.toBeChecked();
|
||||
await expect(page.locator("#limited-employee-role option")).toHaveCount(5);
|
||||
await expect(page.getByTestId("limited-employee-role")).not.toContainText("Superuser");
|
||||
await expect(page.locator("body")).not.toContainText("department_access_1");
|
||||
@@ -879,14 +834,15 @@ test.describe("Limited backoffice", () => {
|
||||
await expect(page.getByTestId("limited-employees-title")).toBeVisible();
|
||||
await expect(page.getByTestId("limited-employee-save")).toBeDisabled();
|
||||
await expect(page.getByTestId("limited-employee-save")).toHaveClass(/is-fullwidth/);
|
||||
await expect(page.getByTestId("limited-employee-departments").locator(".switch")).toHaveCount(2);
|
||||
await expect(page.getByTestId("limited-employee-department-1")).toBeChecked();
|
||||
await expect(page.getByTestId("limited-employee-department-2")).not.toBeChecked();
|
||||
await expect(page.getByTestId("limited-employee-departments").locator(".switch")).toHaveCount(1);
|
||||
await expect(page.getByTestId("limited-employee-phone-country-code")).toContainText("+45");
|
||||
|
||||
await page.getByTestId("limited-employee-name").fill("No Phone Worker");
|
||||
await page.getByTestId("limited-employee-email").fill("no-phone@example.com");
|
||||
await page.getByTestId("limited-employee-password").fill("Secret123!");
|
||||
await expect(page.getByTestId("limited-employee-save")).toBeDisabled();
|
||||
|
||||
await page.getByTestId("limited-employee-department-1").click();
|
||||
await expect(page.getByTestId("limited-employee-save")).toBeEnabled();
|
||||
await page.getByTestId("limited-employee-save").click();
|
||||
|
||||
@@ -900,13 +856,14 @@ test.describe("Limited backoffice", () => {
|
||||
role_key: "viewer",
|
||||
department_ids: [1],
|
||||
});
|
||||
await expect(page.getByTestId("limited-employee-row-903")).toContainText("No Phone Worker");
|
||||
await expect(page.getByTestId("limited-employee-row-902")).toContainText("No Phone Worker");
|
||||
|
||||
await page.getByTestId("limited-employee-name").fill("Phone Worker");
|
||||
await page.getByTestId("limited-employee-email").fill("phone@example.com");
|
||||
await page.getByTestId("limited-employee-phone-country-code").selectOption("358");
|
||||
await page.getByTestId("limited-employee-phone").fill("87654321");
|
||||
await page.getByTestId("limited-employee-password").fill("Secret123!");
|
||||
await page.getByTestId("limited-employee-department-1").click();
|
||||
await expect(page.getByTestId("limited-employee-save")).toBeEnabled();
|
||||
await page.getByTestId("limited-employee-save").click();
|
||||
|
||||
@@ -920,8 +877,8 @@ test.describe("Limited backoffice", () => {
|
||||
role_key: "viewer",
|
||||
department_ids: [1],
|
||||
});
|
||||
await expect(page.getByTestId("limited-employee-row-904")).toContainText("Phone Worker");
|
||||
await expect(page.getByTestId("limited-employee-phone-904")).toHaveText("+358 87654321");
|
||||
await expect(page.getByTestId("limited-employee-row-903")).toContainText("Phone Worker");
|
||||
await expect(page.getByTestId("limited-employee-phone-903")).toHaveText("+358 87654321");
|
||||
});
|
||||
|
||||
test("edits employee contact details without requiring a new password", async ({ page }) => {
|
||||
@@ -955,75 +912,19 @@ test.describe("Limited backoffice", () => {
|
||||
await expect(page.getByTestId("limited-employee-phone-501")).toHaveText("+358 87654321");
|
||||
});
|
||||
|
||||
test("keeps department context across employee access navigation", async ({ page }, testInfo) => {
|
||||
test.skip(!isDesktopProject(testInfo), "Desktop only");
|
||||
|
||||
await seedLimitedBackofficeSession(page);
|
||||
const api = await mockLimitedBackofficeApi(page);
|
||||
|
||||
await page.goto("/backoffice/employees");
|
||||
|
||||
await expect(page).toHaveURL(/\/backoffice\/departments\/1\/employees$/);
|
||||
await expect(page.getByTestId("limited-backoffice-tab-prices")).toHaveAttribute(
|
||||
"href",
|
||||
"/backoffice/departments/1/prices"
|
||||
);
|
||||
await expect(page.getByTestId("limited-backoffice-tab-employees")).toHaveAttribute(
|
||||
"href",
|
||||
"/backoffice/departments/1/employees"
|
||||
);
|
||||
|
||||
await page.getByTestId("limited-backoffice-department-select").selectOption("2");
|
||||
|
||||
await expect(page).toHaveURL(/\/backoffice\/departments\/2\/employees$/);
|
||||
await expect(page.getByTestId("limited-employee-row-501")).toHaveCount(0);
|
||||
await expect(page.getByTestId("limited-employee-row-502")).toContainText("Riley Remote");
|
||||
await expect(page.getByTestId("limited-employee-department-1")).not.toBeChecked();
|
||||
await expect(page.getByTestId("limited-employee-department-2")).toBeChecked();
|
||||
await expect(page.getByTestId("limited-backoffice-tab-prices")).toHaveAttribute(
|
||||
"href",
|
||||
"/backoffice/departments/2/prices"
|
||||
);
|
||||
|
||||
await page.getByTestId("limited-backoffice-tab-prices").click();
|
||||
await expect(page).toHaveURL(/\/backoffice\/departments\/2\/prices$/);
|
||||
await expect(page.getByTestId("limited-backoffice-tab-employees")).toHaveAttribute(
|
||||
"href",
|
||||
"/backoffice/departments/2/employees"
|
||||
);
|
||||
|
||||
expect(api.forbiddenCalls).toEqual([]);
|
||||
});
|
||||
|
||||
test("does not render data for a department outside the manager scope", async ({ page }, testInfo) => {
|
||||
test.skip(!isDesktopProject(testInfo), "Desktop only");
|
||||
|
||||
await seedLimitedBackofficeSession(page);
|
||||
const api = await mockLimitedBackofficeApi(page);
|
||||
|
||||
await page.goto("/backoffice/departments/3/prices");
|
||||
await page.goto("/backoffice/departments/2/prices");
|
||||
|
||||
await expect(page.getByTestId("limited-prices-forbidden")).toBeVisible();
|
||||
await expect(page.locator("body")).not.toContainText("Secret Depot");
|
||||
await expect(page.getByTestId("limited-prices-table")).toHaveCount(0);
|
||||
|
||||
expect(api.calls.some((call) => call.includes("/limited-backoffice/departments/3/prices"))).toBe(false);
|
||||
expect(api.forbiddenCalls).toEqual([]);
|
||||
});
|
||||
|
||||
test("does not render employee data for a department outside the manager scope", async ({ page }, testInfo) => {
|
||||
test.skip(!isDesktopProject(testInfo), "Desktop only");
|
||||
|
||||
await seedLimitedBackofficeSession(page);
|
||||
const api = await mockLimitedBackofficeApi(page);
|
||||
|
||||
await page.goto("/backoffice/departments/3/employees");
|
||||
|
||||
await expect(page.getByTestId("limited-employees-forbidden")).toBeVisible();
|
||||
await expect(page.locator("body")).not.toContainText("Secret Depot");
|
||||
await expect(page.getByTestId("limited-employees-table")).toHaveCount(0);
|
||||
|
||||
expect(api.calls.some((call) => call.includes("/limited-backoffice/employees"))).toBe(false);
|
||||
expect(api.calls.some((call) => call.includes("/limited-backoffice/departments/2/prices"))).toBe(false);
|
||||
expect(api.forbiddenCalls).toEqual([]);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -27,10 +27,7 @@ async function primeSession(page, { token, permissions, sessionData = {} }) {
|
||||
await seedAuthenticatedState(page, token);
|
||||
}
|
||||
|
||||
async function mockSelectedSubuserGrant(
|
||||
page,
|
||||
{ customerNumber = 12345679, permissions = ["user", "SELFSERVE_LIST", "SELFSERVE_ADD"] } = {}
|
||||
) {
|
||||
async function mockSelectedSubuserGrant(page, { customerNumber = 12345679, permissions = ["user"] } = {}) {
|
||||
await page.route("**/subusers/me", async (route) => {
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
@@ -252,7 +249,6 @@ test.describe("Self-serve wash", () => {
|
||||
},
|
||||
selfServe: true,
|
||||
});
|
||||
api.selfServe.commandResponseDelayMs = [500, 0];
|
||||
await primeSession(page, {
|
||||
token: "self-serve-user-token",
|
||||
permissions: ["user"],
|
||||
@@ -1049,7 +1045,7 @@ test.describe("Self-serve wash", () => {
|
||||
customerNumberInput: "777",
|
||||
});
|
||||
|
||||
const api = await mockApi(page, {
|
||||
await mockApi(page, {
|
||||
authenticated: true,
|
||||
permissions: ["user"],
|
||||
sessionData: {
|
||||
@@ -1067,25 +1063,6 @@ test.describe("Self-serve wash", () => {
|
||||
],
|
||||
},
|
||||
});
|
||||
api.selfServe.previewByKey["7:ZZ00000"] = {
|
||||
...api.selfServe.previewByKey["7:ZZ00000"],
|
||||
questions: [],
|
||||
tasks: [],
|
||||
};
|
||||
api.selfServe.summaryBySessionId[601] = {
|
||||
...api.selfServe.summaryBySessionId[601],
|
||||
questions: [],
|
||||
tasks: [],
|
||||
};
|
||||
api.selfServe.summaryByKey["7:ZZ00000"] = {
|
||||
session: api.selfServe.previewByKey["7:ZZ00000"].session,
|
||||
lane: api.selfServe.previewByKey["7:ZZ00000"].lane,
|
||||
questions: [],
|
||||
conditions: [],
|
||||
rules: [],
|
||||
tasks: [],
|
||||
events: [{ id: 4, type: "STARTED", created_at: "2026-01-01T11:01:00.000Z" }],
|
||||
};
|
||||
await primeSession(page, {
|
||||
token: "self-serve-start-retry-token",
|
||||
permissions: ["user"],
|
||||
@@ -1186,7 +1163,6 @@ test.describe("Self-serve wash", () => {
|
||||
authenticated: true,
|
||||
permissions: ["user"],
|
||||
selfServe: {
|
||||
commandResponseDelayMs: [500, 0],
|
||||
commandResponses: [
|
||||
{
|
||||
success: false,
|
||||
|
||||
@@ -25,44 +25,6 @@ async function bootSuperuser(page, { permissions = ["superuser", "user"], edgeGa
|
||||
await primeSuperuserSession(page);
|
||||
}
|
||||
|
||||
async function waitForLayoutFrame(page) {
|
||||
await page.evaluate(
|
||||
() =>
|
||||
new Promise((resolve) => {
|
||||
requestAnimationFrame(() => requestAnimationFrame(resolve));
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
async function getActionMenuVerticalPlacement(trigger, menu) {
|
||||
const [triggerBox, menuBox] = await Promise.all([trigger.boundingBox(), menu.boundingBox()]);
|
||||
|
||||
expect(triggerBox).not.toBeNull();
|
||||
expect(menuBox).not.toBeNull();
|
||||
|
||||
const belowGap = menuBox.y - (triggerBox.y + triggerBox.height);
|
||||
const aboveGap = triggerBox.y - (menuBox.y + menuBox.height);
|
||||
const isBelowButton = belowGap >= -2 && belowGap <= 16;
|
||||
const isAboveButton = aboveGap >= -2 && aboveGap <= 16;
|
||||
|
||||
expect(isBelowButton || isAboveButton).toBe(true);
|
||||
expect(menuBox.y >= triggerBox.y + triggerBox.height - 2 || menuBox.y + menuBox.height <= triggerBox.y + 2).toBe(
|
||||
true
|
||||
);
|
||||
|
||||
return isBelowButton ? "below" : "above";
|
||||
}
|
||||
|
||||
async function getSettledActionMenuVerticalPlacement(page, trigger, menu) {
|
||||
await waitForLayoutFrame(page);
|
||||
const firstPlacement = await getActionMenuVerticalPlacement(trigger, menu);
|
||||
await waitForLayoutFrame(page);
|
||||
const secondPlacement = await getActionMenuVerticalPlacement(trigger, menu);
|
||||
expect(secondPlacement).toBe(firstPlacement);
|
||||
|
||||
return secondPlacement;
|
||||
}
|
||||
|
||||
async function installSystemStatusMock(page, snapshot) {
|
||||
await page.route(/\/superuser\/system\/status(?:\?.*)?$/, async (route) => {
|
||||
await route.fulfill(
|
||||
@@ -853,38 +815,6 @@ test.describe("Superuser system status smoke", () => {
|
||||
await expect(page.getByTestId("database-status-card")).toContainText("8.0.36");
|
||||
});
|
||||
|
||||
test("@smoke @pr superuser replication action menu keeps stable vertical placement", async ({ page }) => {
|
||||
await bootSuperuser(page);
|
||||
await installReplicationMock(page);
|
||||
|
||||
await page.goto("/superuser/system/replication");
|
||||
|
||||
await expect(page.getByTestId("replication-management-page")).toBeVisible({ timeout: PAGE_READY_TIMEOUT });
|
||||
await expect(page.getByTestId("replication-host-database-2")).toContainText("mysql-replica-1");
|
||||
|
||||
const replicaActions = page.getByTestId("replication-actions-database-2");
|
||||
const replicaActionTrigger = replicaActions.locator(".action-settings-wheel-trigger");
|
||||
const replicaActionMenu = replicaActions.locator(".dropdown-content");
|
||||
|
||||
await expect(replicaActionTrigger).toBeVisible();
|
||||
await replicaActionTrigger.click();
|
||||
await expect(replicaActions.locator(".dropdown-item-action:visible")).toHaveCount(4);
|
||||
const initialPlacement = await getSettledActionMenuVerticalPlacement(page, replicaActionTrigger, replicaActionMenu);
|
||||
|
||||
await page.keyboard.press("Escape");
|
||||
await expect(replicaActionTrigger).not.toHaveClass(/action-settings-wheel-trigger--active/);
|
||||
|
||||
await replicaActionTrigger.click();
|
||||
await expect(replicaActions.locator(".dropdown-item-action:visible")).toHaveCount(4);
|
||||
const reopenedPlacement = await getSettledActionMenuVerticalPlacement(
|
||||
page,
|
||||
replicaActionTrigger,
|
||||
replicaActionMenu
|
||||
);
|
||||
|
||||
expect(reopenedPlacement).toBe(initialPlacement);
|
||||
});
|
||||
|
||||
test("@smoke superuser replication management page renders topology and percentages", async ({ page }) => {
|
||||
await bootSuperuser(page);
|
||||
const replicationRequests = await installReplicationMock(page);
|
||||
@@ -933,11 +863,15 @@ test.describe("Superuser system status smoke", () => {
|
||||
await replicaActionTrigger.click();
|
||||
await expect(replicaActions.locator(".dropdown-item-action:visible")).toHaveCount(4);
|
||||
await expect(replicaActions.getByRole("button", { name: "Omdøb" })).toBeVisible();
|
||||
await getSettledActionMenuVerticalPlacement(
|
||||
page,
|
||||
replicaActionTrigger,
|
||||
replicaActions.locator(".dropdown-content")
|
||||
);
|
||||
const [triggerBox, menuBox] = await Promise.all([
|
||||
replicaActionTrigger.boundingBox(),
|
||||
replicaActions.locator(".dropdown-content").boundingBox(),
|
||||
]);
|
||||
expect(triggerBox).not.toBeNull();
|
||||
expect(menuBox).not.toBeNull();
|
||||
const isMenuBelowButton = Math.abs(menuBox.y - (triggerBox.y + triggerBox.height)) <= 12;
|
||||
const isMenuAboveButton = Math.abs(menuBox.y + menuBox.height - triggerBox.y) <= 12;
|
||||
expect(isMenuBelowButton || isMenuAboveButton).toBe(true);
|
||||
await replicaActions.getByRole("button", { name: "Test" }).click();
|
||||
expect(replicationRequests.hostTestKinds).toContain("database");
|
||||
const addHostTabs = page.getByTestId("replication-add-host-tabs");
|
||||
|
||||
@@ -1317,7 +1317,6 @@ function createSelfServeFixture(overrides = {}) {
|
||||
answerRequests: [],
|
||||
commandResponse: { success: true },
|
||||
commandResponses: null,
|
||||
commandResponseDelayMs: 0,
|
||||
commandRequests: [],
|
||||
forceStopResponse: null,
|
||||
forceStopResponses: null,
|
||||
@@ -1484,14 +1483,6 @@ function buildEdgeGatewayOperationSummary(operations = []) {
|
||||
);
|
||||
}
|
||||
|
||||
function invalidateEdgeGatewayRuntimeSnapshot(gateway) {
|
||||
delete gateway.active_operation;
|
||||
delete gateway.recent_operations_summary;
|
||||
delete gateway.version_drift;
|
||||
delete gateway.diagnostics;
|
||||
delete gateway.error_state;
|
||||
}
|
||||
|
||||
function buildEdgeGatewayRuntimeFixture(gateway) {
|
||||
const relayHealth = (gateway.bindings || []).map((binding) => {
|
||||
const fallbackMode = binding.fallback_mode || "PREFER_LOCAL";
|
||||
@@ -1859,7 +1850,6 @@ function settleEdgeGatewayWork(edgeGatewayFixture, gatewayId) {
|
||||
: operation
|
||||
);
|
||||
delete edgeGatewayFixture.pendingDiscoveryByGatewayId[gatewayId];
|
||||
invalidateEdgeGatewayRuntimeSnapshot(gateway);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5411,7 +5401,6 @@ async function handleEdgeGatewayRoute({ route, request, parsedUrl, pathname, met
|
||||
{ id: Date.now(), created_at: now, action: "GATEWAY_OPERATION_CANCELLED", actor_type: "USER" },
|
||||
...(gateway.audit_logs || []),
|
||||
];
|
||||
invalidateEdgeGatewayRuntimeSnapshot(gateway);
|
||||
Object.assign(gateway, buildEdgeGatewayRuntimeFixture(gateway));
|
||||
await route.fulfill(
|
||||
json({
|
||||
@@ -5578,7 +5567,6 @@ async function handleEdgeGatewayRoute({ route, request, parsedUrl, pathname, met
|
||||
{ id: Date.now(), created_at: now, action: "GATEWAY_OPERATION_QUEUED", actor_type: "USER" },
|
||||
...(gateway.audit_logs || []),
|
||||
];
|
||||
invalidateEdgeGatewayRuntimeSnapshot(gateway);
|
||||
Object.assign(gateway, buildEdgeGatewayRuntimeFixture(gateway));
|
||||
await route.fulfill(
|
||||
json(
|
||||
@@ -6709,10 +6697,6 @@ export async function mockApi(page, options = {}) {
|
||||
Array.isArray(selfServe.commandResponses) && selfServe.commandResponses.length > 0
|
||||
? selfServe.commandResponses.shift()
|
||||
: selfServe.commandResponse;
|
||||
const commandResponseDelayMs = Array.isArray(selfServe.commandResponseDelayMs)
|
||||
? selfServe.commandResponseDelayMs.shift() || 0
|
||||
: selfServe.commandResponseDelayMs;
|
||||
await maybeDelayFixtureResponse(commandResponseDelayMs);
|
||||
await route.fulfill(json(commandResponse));
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -316,26 +316,6 @@ const flushMicrotasks = async () => {
|
||||
await Promise.resolve();
|
||||
};
|
||||
|
||||
const flushDropdownLayout = async () => {
|
||||
for (let index = 0; index < 8; index += 1) {
|
||||
await Promise.resolve();
|
||||
}
|
||||
};
|
||||
|
||||
const createRect = ({ left = 0, top = 0, width = 0, height = 0 }) => ({
|
||||
x: left,
|
||||
y: top,
|
||||
top,
|
||||
left,
|
||||
right: left + width,
|
||||
bottom: top + height,
|
||||
width,
|
||||
height,
|
||||
toJSON() {
|
||||
return this;
|
||||
},
|
||||
});
|
||||
|
||||
const setDesktopFlyoutViewport = () => {
|
||||
Object.defineProperty(window, "innerWidth", {
|
||||
configurable: true,
|
||||
@@ -415,95 +395,6 @@ const mockMenuGeometry = () =>
|
||||
};
|
||||
});
|
||||
|
||||
const mockDropdownPlacementGeometry = ({
|
||||
contentHeight = 180,
|
||||
contentWidth = 240,
|
||||
triggerHeight = 40,
|
||||
triggerLeft = 880,
|
||||
triggerTop = 520,
|
||||
triggerWidth = 80,
|
||||
} = {}) => {
|
||||
let currentContentHeight = contentHeight;
|
||||
const originalScrollHeightDescriptor = Object.getOwnPropertyDescriptor(HTMLElement.prototype, "scrollHeight");
|
||||
|
||||
Object.defineProperty(HTMLElement.prototype, "scrollHeight", {
|
||||
configurable: true,
|
||||
get() {
|
||||
if (this.classList?.contains("dropdown-content")) {
|
||||
return currentContentHeight;
|
||||
}
|
||||
|
||||
if (originalScrollHeightDescriptor?.get) {
|
||||
return originalScrollHeightDescriptor.get.call(this);
|
||||
}
|
||||
|
||||
return 0;
|
||||
},
|
||||
});
|
||||
|
||||
const rectSpy = vi.spyOn(HTMLElement.prototype, "getBoundingClientRect").mockImplementation(function rectMock() {
|
||||
if (this.classList?.contains("dropdown-trigger")) {
|
||||
return createRect({
|
||||
left: triggerLeft,
|
||||
top: triggerTop,
|
||||
width: triggerWidth,
|
||||
height: triggerHeight,
|
||||
});
|
||||
}
|
||||
|
||||
if (this.classList?.contains("dropdown-content")) {
|
||||
const dropdown = this.closest(".dropdown");
|
||||
const menu = this.closest(".dropdown-menu");
|
||||
const fixedTop = Number.parseFloat(menu?.style?.top || "");
|
||||
const maxHeight = Number.parseFloat(this.style?.maxHeight || "");
|
||||
const height = Number.isFinite(maxHeight) ? Math.min(currentContentHeight, maxHeight) : currentContentHeight;
|
||||
const top = Number.isFinite(fixedTop)
|
||||
? fixedTop
|
||||
: dropdown?.classList.contains("is-up")
|
||||
? triggerTop - height
|
||||
: triggerTop + triggerHeight;
|
||||
|
||||
return createRect({
|
||||
left: triggerLeft + triggerWidth - contentWidth,
|
||||
top,
|
||||
width: contentWidth,
|
||||
height,
|
||||
});
|
||||
}
|
||||
|
||||
if (this.classList?.contains("action-wheel-clip-host")) {
|
||||
return createRect({
|
||||
left: 0,
|
||||
top: 480,
|
||||
width: 1280,
|
||||
height: 120,
|
||||
});
|
||||
}
|
||||
|
||||
return createRect({
|
||||
left: 0,
|
||||
top: 0,
|
||||
width: 1280,
|
||||
height: 900,
|
||||
});
|
||||
});
|
||||
|
||||
return {
|
||||
restore() {
|
||||
rectSpy.mockRestore();
|
||||
|
||||
if (originalScrollHeightDescriptor) {
|
||||
Object.defineProperty(HTMLElement.prototype, "scrollHeight", originalScrollHeightDescriptor);
|
||||
} else {
|
||||
delete HTMLElement.prototype.scrollHeight;
|
||||
}
|
||||
},
|
||||
setContentHeight(nextHeight) {
|
||||
currentContentHeight = nextHeight;
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
const mountDesktopFlyoutButton = (props = {}) => {
|
||||
setDesktopFlyoutViewport();
|
||||
|
||||
@@ -525,29 +416,6 @@ const mountDesktopFlyoutButton = (props = {}) => {
|
||||
});
|
||||
};
|
||||
|
||||
const mountPositionedFlatDropdownButton = (options = {}) => {
|
||||
setCompactViewport();
|
||||
|
||||
return mount(ActionSettingsWheelButton, {
|
||||
props: {
|
||||
order_id: null,
|
||||
refreshFunction: vi.fn(() => Promise.resolve()),
|
||||
...(options.props || {}),
|
||||
},
|
||||
slots: {
|
||||
actions:
|
||||
options.actions || '<button type="button" class="dropdown-item dropdown-item-action">Custom action</button>',
|
||||
},
|
||||
attachTo: options.attachTo,
|
||||
global: {
|
||||
plugins: [i18n],
|
||||
stubs: {
|
||||
CustomerModal: { template: "<div />" },
|
||||
},
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const mountFlatDropdownButton = (props = {}) => {
|
||||
setCompactViewport();
|
||||
|
||||
@@ -696,93 +564,6 @@ describe("ActionSettingsWheelButton", () => {
|
||||
wrapper.unmount();
|
||||
});
|
||||
|
||||
it("uses the same vertical side when the dropdown is reopened with unchanged geometry", async () => {
|
||||
const geometry = mockDropdownPlacementGeometry({
|
||||
contentHeight: 420,
|
||||
triggerTop: 520,
|
||||
});
|
||||
const wrapper = mountPositionedFlatDropdownButton();
|
||||
await flushDropdownLayout();
|
||||
|
||||
const trigger = wrapper.get(".action-settings-wheel-trigger");
|
||||
|
||||
await trigger.trigger("click");
|
||||
await flushDropdownLayout();
|
||||
expect(wrapper.get(".dropdown").classes()).toContain("is-up");
|
||||
|
||||
await trigger.trigger("click");
|
||||
await flushDropdownLayout();
|
||||
expect(wrapper.get(".dropdown").classes()).not.toContain("is-active");
|
||||
|
||||
await trigger.trigger("click");
|
||||
await flushDropdownLayout();
|
||||
expect(wrapper.get(".dropdown").classes()).toContain("is-up");
|
||||
|
||||
wrapper.unmount();
|
||||
geometry.restore();
|
||||
});
|
||||
|
||||
it("keeps the initially selected side when the menu grows after opening", async () => {
|
||||
const geometry = mockDropdownPlacementGeometry({
|
||||
contentHeight: 120,
|
||||
triggerTop: 520,
|
||||
});
|
||||
const wrapper = mountPositionedFlatDropdownButton();
|
||||
await flushDropdownLayout();
|
||||
|
||||
await wrapper.get(".action-settings-wheel-trigger").trigger("click");
|
||||
await flushDropdownLayout();
|
||||
expect(wrapper.get(".dropdown").classes()).not.toContain("is-up");
|
||||
|
||||
geometry.setContentHeight(420);
|
||||
window.dispatchEvent(new Event("resize"));
|
||||
await flushDropdownLayout();
|
||||
|
||||
expect(wrapper.get(".dropdown").classes()).not.toContain("is-up");
|
||||
expect(wrapper.get(".dropdown-content").element.style.maxHeight).toBe("328px");
|
||||
|
||||
wrapper.unmount();
|
||||
geometry.restore();
|
||||
});
|
||||
|
||||
it("keeps fixed-position fallback on the chosen side and clears stale content top", async () => {
|
||||
const host = document.createElement("div");
|
||||
host.className = "action-wheel-clip-host";
|
||||
host.style.overflow = "hidden";
|
||||
document.body.appendChild(host);
|
||||
|
||||
const geometry = mockDropdownPlacementGeometry({
|
||||
contentHeight: 420,
|
||||
triggerTop: 520,
|
||||
});
|
||||
const wrapper = mountPositionedFlatDropdownButton({ attachTo: host });
|
||||
await flushDropdownLayout();
|
||||
|
||||
await wrapper.get(".action-settings-wheel-trigger").trigger("click");
|
||||
await flushDropdownLayout();
|
||||
|
||||
const dropdownContent = wrapper.get(".dropdown-content").element;
|
||||
const dropdownMenu = wrapper.get(".dropdown-menu").element;
|
||||
|
||||
expect(wrapper.get(".dropdown").classes()).toContain("is-up");
|
||||
expect(dropdownMenu.style.position).toBe("fixed");
|
||||
expect(dropdownMenu.style.top).toBe("100px");
|
||||
expect(dropdownContent.style.top).toBe("");
|
||||
|
||||
dropdownContent.style.top = "24px";
|
||||
window.dispatchEvent(new Event("resize"));
|
||||
await flushDropdownLayout();
|
||||
|
||||
expect(wrapper.get(".dropdown").classes()).toContain("is-up");
|
||||
expect(dropdownMenu.style.position).toBe("fixed");
|
||||
expect(dropdownMenu.style.top).toBe("100px");
|
||||
expect(dropdownContent.style.top).toBe("");
|
||||
|
||||
wrapper.unmount();
|
||||
geometry.restore();
|
||||
host.remove();
|
||||
});
|
||||
|
||||
it("resolves customer user id and reloads customer rules only when the target changes in direct mode", async () => {
|
||||
const wrapper = mount(ActionSettingsWheelButton, {
|
||||
props: {
|
||||
|
||||
@@ -85,18 +85,6 @@ const makeOverview = ({
|
||||
state: "ready",
|
||||
value: 3,
|
||||
out_of: 9,
|
||||
target_percentage: "56.5",
|
||||
target_department_id: "2",
|
||||
},
|
||||
{
|
||||
product_id: 25,
|
||||
slug: "faelg-flex",
|
||||
title: "Fælg flex pr. enhed",
|
||||
state: "ready",
|
||||
value: 0,
|
||||
out_of: 9,
|
||||
target_percentage: 0,
|
||||
target_department_id: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
@@ -227,15 +215,6 @@ describe("DepartmentDailyReportObject behavior", () => {
|
||||
slug: "spot-free-lastbil",
|
||||
value: 3,
|
||||
out_of: 9,
|
||||
target_percentage: 56.5,
|
||||
target_department_id: 2,
|
||||
});
|
||||
expect(module.daily_report_products.value[25]).toMatchObject({
|
||||
slug: "faelg-flex",
|
||||
value: 0,
|
||||
out_of: 9,
|
||||
target_percentage: 0,
|
||||
target_department_id: 2,
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
@@ -1,31 +1,11 @@
|
||||
// @vitest-environment jsdom
|
||||
import { mount } from "@vue/test-utils";
|
||||
import { nextTick } from "vue";
|
||||
import { beforeEach, describe, expect, it, vi } from "vitest";
|
||||
|
||||
const dailyReportProductsState = vi.hoisted(() => ({ value: {} }));
|
||||
const selectedDepartmentIdsState = vi.hoisted(() => ({ value: [] }));
|
||||
const refreshOverviewMock = vi.hoisted(() => vi.fn());
|
||||
const hasPermissionMock = vi.hoisted(() => vi.fn());
|
||||
const setProductTargetMock = vi.hoisted(() => vi.fn());
|
||||
|
||||
vi.mock("@/views/dashboards/departmentDashboard/modules/daily-report/DepartmentDailyReportObject.vue", () => ({
|
||||
daily_report_products: dailyReportProductsState,
|
||||
selected_department_ids: selectedDepartmentIdsState,
|
||||
refreshOverview: refreshOverviewMock,
|
||||
}));
|
||||
|
||||
vi.mock("@/components/session/token/SessionUser.vue", () => ({
|
||||
SessionUser: {
|
||||
hasPermission: hasPermissionMock,
|
||||
objects: {
|
||||
department_daily_reports: {
|
||||
functions: {
|
||||
setProductTarget: setProductTargetMock,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
}));
|
||||
|
||||
vi.mock("vue-i18n", async (importOriginal) => {
|
||||
@@ -44,12 +24,6 @@ import DepartmentDashboardDailyReportProductSales from "@/views/dashboards/depar
|
||||
describe("DepartmentDashboardDailyReportProductSales behavior", () => {
|
||||
beforeEach(() => {
|
||||
dailyReportProductsState.value = {};
|
||||
selectedDepartmentIdsState.value = [];
|
||||
refreshOverviewMock.mockReset();
|
||||
hasPermissionMock.mockReset();
|
||||
hasPermissionMock.mockReturnValue(false);
|
||||
setProductTargetMock.mockReset();
|
||||
setProductTargetMock.mockResolvedValue({ data: { data: { target_percentage: null } } });
|
||||
});
|
||||
|
||||
it("renders the API title when the overview payload includes one", () => {
|
||||
@@ -105,71 +79,4 @@ describe("DepartmentDashboardDailyReportProductSales behavior", () => {
|
||||
|
||||
expect(missingTileWrapper.text()).toContain("Tillæg for Specialsæbe - DD");
|
||||
});
|
||||
|
||||
it("shows a saved target percentage below the product percentage", () => {
|
||||
dailyReportProductsState.value = {
|
||||
24: {
|
||||
title: "Spot Free (Lastbil)",
|
||||
value: 3,
|
||||
out_of: 8,
|
||||
state: "ready",
|
||||
message: null,
|
||||
target_percentage: 62.5,
|
||||
target_department_id: 1,
|
||||
},
|
||||
};
|
||||
|
||||
const wrapper = mount(DepartmentDashboardDailyReportProductSales, {
|
||||
props: {
|
||||
product_id: 24,
|
||||
subtitle: "Dagens salg af produktet",
|
||||
dataTestid: "daily-report-tile-spot-free-lastbil",
|
||||
},
|
||||
});
|
||||
|
||||
expect(wrapper.get('[data-testid="daily-report-tile-spot-free-lastbil-target-button"]').text()).toContain("62.5%");
|
||||
});
|
||||
|
||||
it("opens the target editor from the percentage button and saves through the daily report API", async () => {
|
||||
selectedDepartmentIdsState.value = [1];
|
||||
hasPermissionMock.mockImplementation((permission) => permission === "set_department_daily_report_product_targets");
|
||||
setProductTargetMock.mockResolvedValue({ data: { data: { target_percentage: 70 } } });
|
||||
dailyReportProductsState.value = {
|
||||
24: {
|
||||
title: "Spot Free (Lastbil)",
|
||||
value: 3,
|
||||
out_of: 8,
|
||||
state: "ready",
|
||||
message: null,
|
||||
target_percentage: null,
|
||||
target_department_id: null,
|
||||
},
|
||||
};
|
||||
|
||||
const wrapper = mount(DepartmentDashboardDailyReportProductSales, {
|
||||
props: {
|
||||
product_id: 24,
|
||||
subtitle: "Dagens salg af produktet",
|
||||
dataTestid: "daily-report-tile-spot-free-lastbil",
|
||||
},
|
||||
});
|
||||
|
||||
await wrapper.get('[data-testid="daily-report-tile-spot-free-lastbil-percentage-button"]').trigger("click");
|
||||
await nextTick();
|
||||
await wrapper.get('[data-testid="daily-report-tile-spot-free-lastbil-target-input"]').setValue("70");
|
||||
await wrapper.find("form").trigger("submit");
|
||||
await nextTick();
|
||||
await Promise.resolve();
|
||||
|
||||
expect(setProductTargetMock).toHaveBeenCalledWith({
|
||||
department_id: 1,
|
||||
product_id: 24,
|
||||
target_percentage: 70,
|
||||
});
|
||||
expect(refreshOverviewMock).toHaveBeenCalledTimes(1);
|
||||
expect(dailyReportProductsState.value[24]).toMatchObject({
|
||||
target_percentage: 70,
|
||||
target_department_id: 1,
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -30,32 +30,20 @@ describe("Playwright full E2E workflow grouping", () => {
|
||||
);
|
||||
});
|
||||
|
||||
it("keeps self-hosted full-suite runner pressure bounded while hosted dispatch can fan out", () => {
|
||||
it("keeps full-suite runner pressure bounded and diagnosable", () => {
|
||||
const source = workflowSource();
|
||||
|
||||
expect(source).toMatch(
|
||||
/e2e-full:[\s\S]*?max-parallel: \$\{\{ fromJSON\(github\.event_name == 'workflow_dispatch' && github\.event\.inputs\.runner == 'github-hosted' && '12' \|\| '2'\) \}\}/u
|
||||
);
|
||||
expect(source).toMatch(/e2e-full:[\s\S]*?max-parallel: 2/u);
|
||||
expect(source).toMatch(/e2e-full:[\s\S]*?PLAYWRIGHT_WORKERS: 1/u);
|
||||
expect(source).toMatch(/e2e-full:[\s\S]*?PLAYWRIGHT_VIDEO_MODE: off/u);
|
||||
expect(source).toContain("scripts/ci/with-systemd-inhibit.sh");
|
||||
expect(source).toContain("scripts/ci/runner-diagnostics.sh");
|
||||
});
|
||||
|
||||
it("diffs pull request changed-area tests against the PR head instead of the merge commit", () => {
|
||||
const source = workflowSource();
|
||||
|
||||
expect(source).toContain("PR_HEAD_SHA: ${{ github.event.pull_request.head.sha }}");
|
||||
expect(source).toMatch(
|
||||
/if \[\[ "\$EVENT_NAME" == "pull_request" && -n "\$PR_BASE_SHA" \]\]; then[\s\S]*?head_ref="\$PR_HEAD_SHA"/u
|
||||
);
|
||||
expect(source).toContain('echo "head=$head_ref" >> "$GITHUB_OUTPUT"');
|
||||
});
|
||||
|
||||
it("keeps PR E2E runner pressure bounded and diagnosable", () => {
|
||||
const source = workflowSource();
|
||||
|
||||
expect(source).toMatch(/e2e-pr:[\s\S]*?runs-on: ubuntu-24\.04/u);
|
||||
expect(source).toMatch(/e2e-pr:[\s\S]*?runs-on: ubuntu-latest/u);
|
||||
expect(source).toMatch(/e2e-pr:[\s\S]*?max-parallel: 4/u);
|
||||
expect(source).toMatch(/e2e-pr:[\s\S]*?PLAYWRIGHT_WORKERS: 1/u);
|
||||
expect(source).toMatch(/e2e-pr:[\s\S]*?PLAYWRIGHT_VIDEO_MODE: on-first-retry/u);
|
||||
@@ -63,38 +51,11 @@ describe("Playwright full E2E workflow grouping", () => {
|
||||
expect(source).toMatch(/e2e-pr:[\s\S]*?--env PLAYWRIGHT_VIDEO_MODE="\$PLAYWRIGHT_VIDEO_MODE"/u);
|
||||
});
|
||||
|
||||
it("supports GitHub-hosted manual runners while keeping PR E2E on Ubuntu", () => {
|
||||
const source = workflowSource();
|
||||
|
||||
expect(source).toContain("github.event.inputs.runner == 'github-hosted'");
|
||||
expect(source).toContain('["ubuntu-latest"]');
|
||||
expect(source).toContain('["self-hosted","Linux","X64","pleno","frontend"]');
|
||||
expect(source).toMatch(/e2e-targeted:[\s\S]*?runs-on: ubuntu-24\.04/u);
|
||||
expect(source).toMatch(/e2e-pr:[\s\S]*?runs-on: ubuntu-24\.04/u);
|
||||
expect(source).toMatch(/e2e-full:[\s\S]*?frontend","docker"\]/u);
|
||||
});
|
||||
|
||||
it("supports targeted manual Playwright reruns on GitHub-hosted runners", () => {
|
||||
const source = workflowSource();
|
||||
|
||||
expect(source).toContain("workflow_dispatch:");
|
||||
expect(source).toContain("targeted-then-full");
|
||||
expect(source).toContain("target_specs:");
|
||||
expect(source).toContain("target_projects:");
|
||||
expect(source).toContain("e2e-targeted:");
|
||||
expect(source).toContain("matrix:");
|
||||
expect(source).toContain("project: ${{ fromJSON(inputs.target_projects || '[\"chromium-desktop\"]') }}");
|
||||
expect(source).toMatch(/e2e-targeted:[\s\S]*?runs-on: ubuntu-24\.04/u);
|
||||
expect(source).toContain('npx playwright test "${args[@]}"');
|
||||
expect(source).toContain('"$spec_path" != tests/e2e/*');
|
||||
expect(source).toMatch(/e2e-pr:[\s\S]*?needs: \[build-and-unit, e2e-targeted\]/u);
|
||||
});
|
||||
|
||||
it("uses a machine-wide Playwright port lock across self-hosted runner processes", () => {
|
||||
const source = workflowSource();
|
||||
|
||||
expect(source.match(/PLAYWRIGHT_PORT_LOCK_ROOT:-\/tmp\/pleno-playwright-port-locks/gu)).toHaveLength(3);
|
||||
expect(source.match(/chmod 1777 "\$lock_root"/gu)).toHaveLength(3);
|
||||
expect(source.match(/PLAYWRIGHT_PORT_LOCK_ROOT:-\/tmp\/pleno-playwright-port-locks/gu)).toHaveLength(2);
|
||||
expect(source.match(/chmod 1777 "\$lock_root"/gu)).toHaveLength(2);
|
||||
expect(source).not.toContain("${RUNNER_TEMP:-/tmp}/pleno-playwright-port-locks");
|
||||
});
|
||||
|
||||
|
||||
@@ -31,41 +31,21 @@ describe("Playwright PR mapping", () => {
|
||||
});
|
||||
|
||||
it("maps department notification table changes to the admin notification E2E coverage", () => {
|
||||
const notificationPaginationSpecs = specsFor(
|
||||
"src/components/displays/pagination/models/DepartmentPos/NotificationsPhonePagination.vue"
|
||||
);
|
||||
|
||||
expect(
|
||||
specsFor("src/views/dashboards/departmentDashboard/modules/notifications/DepartmentNotifications.vue")
|
||||
).toContain("tests/e2e/admin-department-notifications.spec.ts");
|
||||
expect(
|
||||
specsFor("src/components/displays/department/notifications/departmentNotificationsPhoneTable.vue")
|
||||
).toContain("tests/e2e/admin-department-notifications.spec.ts");
|
||||
expect(notificationPaginationSpecs).toContain("tests/e2e/admin-department-notifications.spec.ts");
|
||||
expect(notificationPaginationSpecs).not.toContain("tests/e2e/pos-flow.spec.js");
|
||||
expect(notificationPaginationSpecs).not.toContain("tests/e2e/pos-mobile-order-flow.spec.js");
|
||||
expect(notificationPaginationSpecs).not.toContain("tests/e2e/admin-pos-orders.spec.ts");
|
||||
});
|
||||
|
||||
it("maps admin daily-report changes to daily-report E2E coverage", () => {
|
||||
expect(
|
||||
specsFor(
|
||||
"src/views/dashboards/departmentDashboard/modules/daily-report/displays/DepartmentDashboardDailyReportProductSales.vue"
|
||||
)
|
||||
).toContain("tests/e2e/admin-daily-report.spec.ts");
|
||||
expect(specsFor("src/components/session/token/SessionUser/Objects/DepartmentDailyReports.vue")).toContain(
|
||||
"tests/e2e/admin-daily-report.spec.ts"
|
||||
);
|
||||
specsFor("src/components/displays/pagination/models/DepartmentPos/NotificationsPhonePagination.vue")
|
||||
).toContain("tests/e2e/admin-department-notifications.spec.ts");
|
||||
});
|
||||
|
||||
it("maps limited backoffice view and service changes to limited backoffice E2E coverage", () => {
|
||||
it("maps limited backoffice view changes to limited backoffice E2E coverage", () => {
|
||||
expect(specsFor("src/views/backoffice/LimitedBackofficePrices.vue")).toContain(
|
||||
"tests/e2e/limited-backoffice.spec.ts"
|
||||
);
|
||||
expect(specsFor("src/views/backoffice/components/LimitedBackofficeLayout.vue")).toContain(
|
||||
"tests/e2e/limited-backoffice.spec.ts"
|
||||
);
|
||||
expect(specsFor("src/services/limitedBackoffice.js")).toContain("tests/e2e/limited-backoffice.spec.ts");
|
||||
});
|
||||
|
||||
it("maps superuser role permission page changes to role permissions E2E coverage", () => {
|
||||
@@ -104,7 +84,6 @@ describe("Playwright PR mapping", () => {
|
||||
it("maps customer product rule changes to POS customer rule E2E coverage", () => {
|
||||
expect(specsFor("src/features/customer/customerProductRules.js")).toContain("tests/e2e/pos-customer-rules.spec.js");
|
||||
expect(specsFor("src/components/displays/boxes/ProductBox.vue")).toContain("tests/e2e/pos-customer-rules.spec.js");
|
||||
expect(specsFor("src/components/shop/POSDepartmentProcess.vue")).toContain("tests/e2e/admin-pos-orders.spec.ts");
|
||||
});
|
||||
|
||||
it("maps limited backoffice changes to the limited backoffice E2E coverage", () => {
|
||||
|
||||
Reference in New Issue
Block a user