优化构架

src/components/common/PrototypeFeatureView.vue

@@ -0,0 +1,28 @@
+<script setup lang="ts">
+defineProps<{
+  title: string
+  description: string
+}>()
+</script>
+
+<template>
+  <section class="prototype-feature">
+    <div class="prototype-feature-empty">
+      <span>待接入</span>
+      <h2>{{ title }}</h2>
+      <p>{{ description }}的业务页面已建立，后续接入对应接口和操作流程。</p>
+      <RouterLink to="/">返回业务总览</RouterLink>
+    </div>
+  </section>
+</template>
+
+<style scoped>
+.prototype-feature { display: grid; min-height: calc(100vh - 128px); place-items: center; }
+.prototype-feature-empty { display: flex; width: min(520px, 100%); flex-direction: column; align-items: center; padding: 40px 28px; border: 1px solid var(--border); background: #fff; text-align: center; }
+.prototype-feature-empty span { color: var(--primary); font-size: 12px; font-weight: 700; }
+.prototype-feature-empty h2 { margin: 12px 0 8px; color: var(--navy); font-size: 22px; }
+.prototype-feature-empty p { max-width: 34ch; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
+.prototype-feature-empty a { margin-top: 22px; color: var(--primary); font-size: 13px; font-weight: 650; text-decoration: none; }
+.prototype-feature-empty a:hover { text-decoration: underline; }
+.prototype-feature-empty a:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
+</style>

src/components/first-leg/FirstLegOrderEditorShell.vue

@@ -1,59 +0,0 @@
-<script setup lang="ts">
-import { ArrowLeft } from '@lucide/vue'
-
-defineProps<{
-  modelValue: boolean
-  page: boolean
-  title: string
-  beforeClose: (done: () => void) => void | Promise<void>
-}>()
-
-const emit = defineEmits<{
-  'update:modelValue': [value: boolean]
-  back: []
-}>()
-</script>
-
-<template>
-  <section v-if="page" class="first-leg-editor-page">
-    <div class="editor-page-nav">
-      <el-button link type="primary" @click="emit('back')"><ArrowLeft :size="17" />返回订单列表</el-button>
-      <span>可先保存草稿，确认无误后再提交平台审核</span>
-    </div>
-    <div class="editor-page-body"><slot /></div>
-    <footer class="editor-page-footer"><slot name="footer" /></footer>
-  </section>
-
-  <el-drawer
-    v-else
-    class="first-leg-editor"
-    :model-value="modelValue"
-    :title="title"
-    size="1080px"
-    destroy-on-close
-    :before-close="beforeClose"
-    @update:model-value="emit('update:modelValue', $event)"
-  >
-    <slot />
-    <template #footer><slot name="footer" /></template>
-  </el-drawer>
-</template>
-
-<style scoped>
-.first-leg-editor-page { min-width: 0; border: 1px solid var(--border); background: #fff; }
-.editor-page-nav { display: flex; min-height: 52px; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 20px; border-bottom: 1px solid var(--border); }
-.editor-page-nav span { color: var(--muted); font-size: 12px; }
-.editor-page-body { padding: 22px 24px 30px; }
-.editor-page-footer { position: sticky; z-index: 3; bottom: 0; display: flex; justify-content: flex-end; padding: 12px 24px; border-top: 1px solid var(--border); background: rgba(255, 255, 255, 0.96); }
-
-@media (max-width: 720px) {
-  .editor-page-nav { align-items: flex-start; flex-direction: column; gap: 2px; padding: 10px 16px; }
-  .editor-page-nav span { padding-left: 1px; line-height: 1.5; }
-  .editor-page-body { padding: 18px 16px 24px; }
-  .editor-page-footer { padding: 10px 16px; }
-}
-
-@media (max-width: 480px) {
-  .editor-page-footer { position: static; }
-}
-</style>