首次提交：初始化项目代码

2026-07-31 14:42:05 +08:00
commit ecca407485
84 changed files with 24158 additions and 0 deletions
@@ -0,0 +1,160 @@
+<template>
+  <view
+    class="page-header"
+    :class="{ 'is-transparent': transparent }"
+    :style="headerStyle"
+  >
+    <view class="header-left">
+      <view
+        v-if="showBack"
+        class="back-btn btn btn--icon"
+        @click="handleBack"
+      >
+        <FaIcon icon="chevron-left" :size="22" :color="themeConfig.textPrimary" />
+      </view>
+    </view>
+
+    <view class="header-center">
+      <text class="header-title" :style="{ color: themeConfig.textPrimary }">{{ title }}</text>
+      <text v-if="subtitle" class="header-subtitle" :style="{ color: themeConfig.textSecondary }">{{ subtitle }}</text>
+    </view>
+
+    <view class="header-right">
+      <slot v-if="showRight" name="right"></slot>
+    </view>
+  </view>
+</template>
+
+<script>
+import themeMixin from '@/mixins/themeMixin.js'
+import { getThemeConfigFromStorage, THEME_CHANGE_EVENT, THEME_PRESETS, DEFAULT_THEME_KEY } from '@/utils/theme'
+import FaIcon from '@/components/FaIcon.vue'
+
+export default {
+  name: 'PageHeader',
+  components: { FaIcon },
+  mixins: [themeMixin],
+  props: {
+    title: {
+      type: String,
+      required: true
+    },
+    subtitle: {
+      type: String,
+      default: ''
+    },
+    showBack: {
+      type: Boolean,
+      default: false
+    },
+    showRight: {
+      type: Boolean,
+      default: false
+    },
+    transparent: {
+      type: Boolean,
+      default: false
+    }
+  },
+  computed: {
+    headerStyle() {
+      if (this.transparent) {
+        return {}
+      }
+      return {
+        backgroundColor: this.themeConfig.bgColor,
+        borderBottom: `2rpx solid ${this.themeConfig.borderLight}`
+      }
+    }
+  },
+  methods: {
+    handleBack() {
+      this.$emit('back')
+      if (!this.$listeners || !this.$listeners.back) {
+        uni.navigateBack()
+      }
+    },
+    handleThemeChange(themeData) {
+      let newTheme = null
+      if (themeData && themeData.key && THEME_PRESETS[themeData.key]) {
+        newTheme = THEME_PRESETS[themeData.key]
+      } else if (themeData && themeData.config) {
+        newTheme = themeData.config
+      }
+      if (newTheme) {
+        this.themeConfig = newTheme
+      }
+    }
+  },
+  mounted() {
+    const appInstance = getApp({ allowDefault: true })
+    const globalTheme = appInstance && appInstance.globalData && appInstance.globalData.themeConfig
+    this.themeConfig = globalTheme || getThemeConfigFromStorage() || THEME_PRESETS[DEFAULT_THEME_KEY]
+    this.themeChangeHandler = this.handleThemeChange.bind(this)
+    uni.$on(THEME_CHANGE_EVENT, this.themeChangeHandler)
+  },
+  beforeDestroy() {
+    uni.$off(THEME_CHANGE_EVENT, this.themeChangeHandler)
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.page-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 24rpx 36rpx;
+  padding-top: calc(24rpx + constant(safe-area-inset-top));
+  padding-top: calc(24rpx + env(safe-area-inset-top));
+  position: relative;
+  z-index: 10;
+  min-height: 120rpx;
+}
+
+.page-header.is-transparent {
+  background: transparent !important;
+  border-bottom: none !important;
+}
+
+.header-left {
+  width: 68rpx;
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+}
+
+.back-btn {
+  transition: all 0.25s ease;
+}
+
+.back-btn:active {
+  transform: scale(0.93);
+}
+
+.header-center {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4rpx;
+}
+
+.header-title {
+  font-size: 36rpx;
+  font-weight: 700;
+}
+
+.header-subtitle {
+  font-size: 24rpx;
+  font-weight: 500;
+}
+
+.header-right {
+  width: 68rpx;
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+</style>