ProductBarcode: allow passing parameters to Dialog

This commit is contained in:
Crumb Owl
2025-07-06 20:48:56 +02:00
parent 0e1e5ae3f0
commit fc88df0ff0
7 changed files with 25 additions and 13 deletions

View File

@@ -57,7 +57,7 @@
const { t } = useI18n(); const { t } = useI18n();
const { activeDialog, closeDialog } = useDialog(); const { activeDialog, closeDialog } = useDialog();
const open = computed(() => activeDialog.value === "scanner"); const open = computed(() => activeDialog.value && activeDialog.value.id === "scanner");
const sources = ref<MediaDeviceInfo[]>([]); const sources = ref<MediaDeviceInfo[]>([]);
const selectedSource = ref<string | null>(null); const selectedSource = ref<string | null>(null);

View File

@@ -270,7 +270,7 @@
watch( watch(
() => activeDialog.value, () => activeDialog.value,
async active => { async active => {
if (active === "create-item") { if (active !== null && active.id === "create-item") {
// needed since URL will be cleared in the next step => ParentId Selection should stay though // needed since URL will be cleared in the next step => ParentId Selection should stay though
subItemCreate.value = subItemCreateParam.value === "y"; subItemCreate.value = subItemCreateParam.value === "y";
let parentItemLocationId = null; let parentItemLocationId = null;

View File

@@ -54,7 +54,7 @@
watch( watch(
() => activeDialog.value, () => activeDialog.value,
active => { active => {
if (active === "create-location") { if (active && active.id === "create-location") {
if (locationId.value) { if (locationId.value) {
const found = locations.value.find(l => l.id === locationId.value); const found = locations.value.find(l => l.id === locationId.value);
form.parent = found || null; form.parent = found || null;

View File

@@ -1,19 +1,21 @@
<!-- DialogProvider.vue --> <!-- DialogProvider.vue -->
<script setup lang="ts"> <script setup lang="ts">
import { ref, reactive, computed } from "vue"; import { ref, reactive, computed } from "vue";
import { provideDialogContext } from "./utils"; import { provideDialogContext, ActiveDialog } from "./utils";
const activeDialog = ref<string | null>(null); const activeDialog = ref<ActiveDialog | null>(null);
const activeAlerts = reactive<string[]>([]); const activeAlerts = reactive<string[]>([]);
const openDialog = (dialogId: string) => { const openDialog = (dialogId: string, params?: any) => {
if (activeAlerts.length > 0) return; if (activeAlerts.length > 0) return;
activeDialog.value = dialogId;
const ad = new ActiveDialog(dialogId, params);
activeDialog.value = ad;
}; };
const closeDialog = (dialogId?: string) => { const closeDialog = (dialogId?: string) => {
if (dialogId) { if (dialogId) {
if (activeDialog.value === dialogId) { if (activeDialog.value && activeDialog.value.id === dialogId) {
activeDialog.value = null; activeDialog.value = null;
} }
} else { } else {

View File

@@ -2,10 +2,20 @@ import type { ComputedRef } from "vue";
import { createContext } from "reka-ui"; import { createContext } from "reka-ui";
import { useMagicKeys, useActiveElement } from "@vueuse/core"; import { useMagicKeys, useActiveElement } from "@vueuse/core";
export class ActiveDialog {
id: string;
params: any;
constructor(id: string, params: any = null) {
this.id = id;
this.params = params;
}
}
export const [useDialog, provideDialogContext] = createContext<{ export const [useDialog, provideDialogContext] = createContext<{
activeDialog: ComputedRef<string | null>; activeDialog: ComputedRef<ActiveDialog | null>;
activeAlerts: ComputedRef<string[]>; activeAlerts: ComputedRef<string[]>;
openDialog: (dialogId: string) => void; openDialog: (dialogId: string, params?: any) => void;
closeDialog: (dialogId?: string) => void; closeDialog: (dialogId?: string) => void;
addAlert: (alertId: string) => void; addAlert: (alertId: string) => void;
removeAlert: (alertId: string) => void; removeAlert: (alertId: string) => void;

View File

@@ -1,13 +1,13 @@
<script setup lang="ts"> <script setup lang="ts">
import { DialogRoot, type DialogRootEmits, type DialogRootProps, useForwardPropsEmits } from "reka-ui"; import { DialogRoot, type DialogRootEmits, type DialogRootProps, useForwardPropsEmits } from "reka-ui";
import { useDialog } from "../dialog-provider/utils"; import { useDialog, type ActiveDialog } from "../dialog-provider/utils";
const props = defineProps<DialogRootProps & { dialogId: string }>(); const props = defineProps<DialogRootProps & { dialogId: string }>();
const emits = defineEmits<DialogRootEmits>(); const emits = defineEmits<DialogRootEmits>();
const { closeDialog, activeDialog } = useDialog(); const { closeDialog, activeDialog } = useDialog();
const isOpen = computed(() => activeDialog.value === props.dialogId); const isOpen = computed(() => (activeDialog.value && activeDialog.value.id === props.dialogId));
const onOpenChange = (open: boolean) => { const onOpenChange = (open: boolean) => {
if (!open) closeDialog(props.dialogId); if (!open) closeDialog(props.dialogId);
}; };

View File

@@ -12,7 +12,7 @@
const { closeDialog, activeDialog } = useDialog(); const { closeDialog, activeDialog } = useDialog();
const isOpen = computed(() => activeDialog.value === props.dialogId); const isOpen = computed(() => activeDialog.value !== null && activeDialog.value.id === props.dialogId);
const onOpenChange = (open: boolean) => { const onOpenChange = (open: boolean) => {
if (!open) closeDialog(props.dialogId); if (!open) closeDialog(props.dialogId);
}; };