mirror of
https://github.com/sysadminsmedia/homebox.git
synced 2025-12-21 13:23:14 +01:00
ProductBarcode: allow passing parameters to Dialog
This commit is contained in:
@@ -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);
|
||||||
|
|||||||
@@ -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;
|
||||||
|
|||||||
@@ -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;
|
||||||
|
|||||||
@@ -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 {
|
||||||
|
|||||||
@@ -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;
|
||||||
|
|||||||
@@ -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);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -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);
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user