feat: 新增订单列表交互

pages/order/components/TopNavBar/index.vue

@@ -0,0 +1,60 @@
+<template>
+  <view class="top-nav-bar" :style="{ paddingTop: statusBarHeight + 'px' }">
+    <view class="nav-content">
+      <view class="nav-left" @click="goBack">
+        <image
+          class="back-icon"
+          src="@/static/back.png"
+          mode="aspectFit"
+        ></image>
+      </view>
+      <view class="nav-center">
+        <slot name="title">
+          <text class="nav-title">{{ title }}</text>
+        </slot>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref, onMounted } from "vue";
+
+// Props
+const props = defineProps({
+  title: {
+    type: String,
+    default: "",
+  },
+  showBack: {
+    type: Boolean,
+    default: true,
+  },
+});
+
+// Emits
+const emit = defineEmits(["back"]);
+
+// 状态栏高度
+const statusBarHeight = ref(0);
+
+// 获取系统信息
+onMounted(() => {
+  const systemInfo = uni.getSystemInfoSync();
+  statusBarHeight.value = systemInfo.statusBarHeight || 44;
+});
+
+// 返回上一页
+const goBack = () => {
+  if (props.showBack) {
+    emit("back");
+    uni.navigateBack({
+      delta: 1,
+    });
+  }
+};
+</script>
+
+<style scoped>
+@import "./styles/index.scss";
+</style>