新增：京东下单页面

src/views/jingdong/components/JdNavBar.vue

@@ -0,0 +1,98 @@
+<template>
+  <header class="jd-nav">
+    <div class="jd-nav__left">
+      <img class="jd-nav__logo" :src="logo" alt="速哇" />
+      <h1 class="jd-nav__title">{{ title }}</h1>
+    </div>
+    <button class="jd-nav__remain" type="button" @click="emit('remain')">
+      <el-icon class="jd-nav__remain-icon" :size="14"><MagicStick /></el-icon>
+      <span>生图剩余 {{ remain }}次</span>
+    </button>
+  </header>
+</template>
+
+<script setup lang="ts">
+import { MagicStick } from '@element-plus/icons-vue'
+
+withDefaults(
+  defineProps<{
+    title?: string
+    remain?: number
+    logo: string
+  }>(),
+  {
+    title: '速哇手办制作Agent',
+    remain: 0,
+  },
+)
+
+const emit = defineEmits<{
+  (e: 'remain'): void
+}>()
+</script>
+
+<style scoped lang="scss">
+.jd-nav {
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  min-height: 48px;
+  padding: 6px 12px;
+  padding-top: calc(6px + env(safe-area-inset-top));
+  background: #ffffff;
+  border-bottom: 1px solid #f0f0f0;
+  box-sizing: border-box;
+}
+
+.jd-nav__left {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  gap: 8px;
+}
+
+.jd-nav__logo {
+  width: 32px;
+  height: 32px;
+  border-radius: 8px;
+  object-fit: contain;
+  object-position: center 35%;
+  background: #fff;
+  box-sizing: border-box;
+  flex-shrink: 0;
+}
+
+.jd-nav__title {
+  margin: 0;
+  font-size: 16px;
+  font-weight: 600;
+  line-height: 1.3;
+  color: #1a1a1a;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.jd-nav__remain {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  flex-shrink: 0;
+  height: 28px;
+  padding: 0 10px 0 8px;
+  border: 0;
+  border-radius: 999px;
+  background: #eaf6ec;
+  color: #3a8e4d;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 1;
+  cursor: pointer;
+}
+
+.jd-nav__remain-icon {
+  color: #3a8e4d;
+}
+</style>