fix bugs

components/custom-navbar/custom-navbar.vue

@@ -0,0 +1,101 @@
+<template>
+  <view class="custom-navbar" :style="{ height: navHeight + 'px', paddingTop: statusBarHeight + 'px' }">
+    <view class="navbar-content" :style="{ height: contentHeight + 'px' }">
+      <view class="navbar-left" @click="handleBack" v-if="showBack">
+        <text class="back-icon">&#xe601;</text>
+      </view>
+      <view class="navbar-title">{{ title }}</view>
+      <view class="navbar-right">
+        <slot name="right"></slot>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'CustomNavbar',
+  props: {
+    title: {
+      type: String,
+      default: ''
+    },
+    showBack: {
+      type: Boolean,
+      default: true
+    },
+    backgroundColor: {
+      type: String,
+      default: '#C93639'
+    }
+  },
+  data() {
+    return {
+      statusBarHeight: 0,
+      contentHeight: 44,
+      navHeight: 0
+    };
+  },
+  mounted() {
+    // 获取状态栏高度
+    const systemInfo = uni.getSystemInfoSync();
+    this.statusBarHeight = systemInfo.statusBarHeight;
+    this.navHeight = this.statusBarHeight + this.contentHeight;
+  },
+  methods: {
+    handleBack() {
+      uni.navigateBack({
+        delta: 1
+      });
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.custom-navbar {
+  width: 100%;
+  background-color: #C93639;
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 999;
+}
+
+.navbar-content {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 30rpx;
+  position: relative;
+}
+
+.navbar-left {
+  width: 60rpx;
+  height: 100%;
+  display: flex;
+  align-items: center;
+}
+
+.back-icon {
+  font-size: 44rpx;
+  color: #fff;
+}
+
+.navbar-title {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  font-size: 36rpx;
+  font-weight: bold;
+  color: #fff;
+}
+
+.navbar-right {
+  width: 60rpx;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+</style>