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