119 lines
2.8 KiB
TypeScript
119 lines
2.8 KiB
TypeScript
export const useNavBarStore = defineStore("nav-bar", () => {
|
|
const route = useRoute();
|
|
const router = useRouter();
|
|
|
|
const height = ref(0);
|
|
const title = ref("");
|
|
const backTo = ref<string>();
|
|
const rightIcon = ref("");
|
|
const rightBadge = ref<number>();
|
|
const rightText = ref("");
|
|
const rightTextColor = ref("");
|
|
const rightDisabled = ref(false);
|
|
const rightAction = shallowRef<(() => void | Promise<void>) | undefined>();
|
|
const customTitleVisible = ref(false);
|
|
const customRightVisible = ref(false);
|
|
|
|
const isShowing = computed(() => !!router.currentRoute.value.meta.navBarVisible);
|
|
const canBack = computed(() => !!router.currentRoute.value.meta.navBarCanBack);
|
|
|
|
watch(
|
|
() => route.meta.navBarTitle,
|
|
(value) => {
|
|
title.value = typeof value === "string" ? value : "";
|
|
},
|
|
{ immediate: true }
|
|
);
|
|
|
|
function setHeight(value: number): void {
|
|
height.value = value;
|
|
}
|
|
|
|
function setBackTo(value?: string): void {
|
|
backTo.value = value;
|
|
}
|
|
|
|
function setRightIcon(value?: string, action?: () => void | Promise<void>): void {
|
|
rightIcon.value = value || "";
|
|
rightBadge.value = undefined;
|
|
rightDisabled.value = false;
|
|
rightAction.value = action;
|
|
if (value) {
|
|
rightText.value = "";
|
|
rightTextColor.value = "";
|
|
customRightVisible.value = false;
|
|
}
|
|
}
|
|
|
|
function setRightBadge(value?: number): void {
|
|
rightBadge.value = value === undefined ? undefined : Math.max(0, value);
|
|
}
|
|
|
|
function setRightText(value?: string, color?: string, action?: () => void | Promise<void>): void {
|
|
rightText.value = value || "";
|
|
rightTextColor.value = color || "";
|
|
rightDisabled.value = false;
|
|
rightAction.value = action;
|
|
if (value) {
|
|
rightBadge.value = undefined;
|
|
rightIcon.value = "";
|
|
customRightVisible.value = false;
|
|
}
|
|
}
|
|
|
|
function setRightDisabled(value: boolean): void {
|
|
rightDisabled.value = value;
|
|
}
|
|
|
|
function setCustomTitleVisible(value: boolean): void {
|
|
customTitleVisible.value = value;
|
|
}
|
|
|
|
function setCustomRightVisible(value: boolean): void {
|
|
customRightVisible.value = value;
|
|
if (value) {
|
|
rightIcon.value = "";
|
|
rightBadge.value = undefined;
|
|
rightText.value = "";
|
|
rightTextColor.value = "";
|
|
rightDisabled.value = false;
|
|
rightAction.value = undefined;
|
|
}
|
|
}
|
|
|
|
function clearRight(): void {
|
|
rightIcon.value = "";
|
|
rightBadge.value = undefined;
|
|
rightText.value = "";
|
|
rightTextColor.value = "";
|
|
rightDisabled.value = false;
|
|
rightAction.value = undefined;
|
|
customRightVisible.value = false;
|
|
}
|
|
|
|
return {
|
|
height,
|
|
title,
|
|
backTo,
|
|
rightIcon,
|
|
rightBadge,
|
|
rightText,
|
|
rightTextColor,
|
|
rightDisabled,
|
|
rightAction,
|
|
customTitleVisible,
|
|
customRightVisible,
|
|
isShowing,
|
|
canBack,
|
|
setHeight,
|
|
setBackTo,
|
|
setRightIcon,
|
|
setRightBadge,
|
|
setRightText,
|
|
setRightDisabled,
|
|
setCustomTitleVisible,
|
|
setCustomRightVisible,
|
|
clearRight
|
|
};
|
|
});
|