feat: 页面调整

src/pages-service/tickets/components/ProductDetail.vue

@@ -1,14 +1,12 @@
 <template>
   <view class="h-screen overflow-hidden bg-slate-50 flex flex-col">
-    <view class="shrink-0 bg-white px-[16px] pb-[12px] pt-[calc(env(safe-area-inset-top)+12px)]">
-      <view class="flex h-[32px] items-center justify-between">
-        <view class="flex h-[32px] w-[32px] items-center justify-center" @click="emit('back')">
-          <uni-icons type="left" size="22" color="#1f2937" />
-        </view>
-        <text class="text-[17px] font-semibold text-slate-800">商品详情</text>
-        <view class="h-[32px] w-[32px]" />
-      </view>
-    </view>
+    <TopNavBar
+      title="商品详情"
+      subtitle="费用说明与购买须知"
+      title-align="left"
+      background="#ffffff"
+      @back="emit('back')"
+    />
 
     <scroll-view class="min-h-0 flex-1" scroll-y>
       <image class="h-[280px] w-full bg-slate-200" :src="product.images && product.images[0]" mode="aspectFill" />
@@ -66,6 +64,8 @@
 </template>
 
 <script setup>
+import TopNavBar from "@/components/TopNavBar/index.vue"
+
 defineProps({
   product: { type: Object, required: true },
 })