From e0cb82c8dbf83fabc0cab548abc873926366fb75 Mon Sep 17 00:00:00 2001 From: zhengyiming <540361168@qq.com> Date: 星期三, 21 五月 2025 17:29:15 +0800 Subject: [PATCH] fix: 修改ui --- apps/taro/src/components/NavigationBar/TranslateNavigationBar.vue | 60 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 60 insertions(+), 0 deletions(-) diff --git a/apps/taro/src/components/NavigationBar/TranslateNavigationBar.vue b/apps/taro/src/components/NavigationBar/TranslateNavigationBar.vue new file mode 100644 index 0000000..f385484 --- /dev/null +++ b/apps/taro/src/components/NavigationBar/TranslateNavigationBar.vue @@ -0,0 +1,60 @@ +<template> + <div class="translate-navigation-bar" :style="barStyle"> + <TransparentNavigationBar + v-bind="_commonNavigationBarProps" + :is-absolute="false" + mode="dark" + navigationArrowWhite + :style="{ opacity: 1 - rangeValue }" + > + </TransparentNavigationBar> + <CommonNavigationBar v-bind="_commonNavigationBarProps" :style="{ opacity: rangeValue }" /> + </div> +</template> + +<script setup lang="ts"> +import { commonNavigationBarProps } from './commonNavigationBar'; +import { useSystemStore } from '@/stores/modules/system'; +import { CSSProperties } from 'vue'; +import TransparentNavigationBar from './TransparentNavigationBar.vue'; +import CommonNavigationBar from './CommonNavigationBar.vue'; +import { usePickProps } from 'senin-mini/hooks'; + +defineOptions({ + name: 'TranslateNavigationBar', +}); + +const systemStore = useSystemStore(); + +const props = defineProps({ + ...commonNavigationBarProps, + rangeValue: { + type: Number, + default: 0, + }, +}); + +const _commonNavigationBarProps = usePickProps(props, commonNavigationBarProps); + +const barStyle = computed(() => { + return { + height: systemStore.navigationBarHeight + 'px', + } as CSSProperties; +}); +</script> + +<style lang="scss"> +@import '@/styles/common.scss'; + +.translate-navigation-bar { + position: relative; + + .navigation-bar-wrapper { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + } +} +</style> -- Gitblit v1.9.1