feat(web-admin): add mobile paste-create for third-party vehicle bundles.

Co-authored-by: Cursor <cursoragent@cursor.com>

web-admin/src/components/business/pl-paste-recognize-dialog/index.vue

@@ -1,18 +1,12 @@
 <!-- eslint-disable vue/no-v-model-argument -->
 <template>
-  <el-dialog
-    v-model="innerVisible"
-    :title="dialogTitle"
-    width="1100px"
-    align-center
-    destroy-on-close
-    append-to-body
-    class="dialog-form-layout pl-paste-recognize-dialog"
-    modal-class="order-module-dialog-mask"
-    :close-on-click-modal="false"
-    style="backdrop-filter: none"
+  <component
+    :is="isPageVariant ? 'div' : ElDialog"
+    v-bind="formShellBind"
     @closed="handleClosed"
+    @update:model-value="onFormShellVisible"
   >
+    <h2 v-if="isPageVariant" class="mp-plan-form-title">{{ dialogTitle }}</h2>
     <el-form label-position="top">
       <el-form-item label="客户原文">
         <el-input
@@ -123,9 +117,9 @@
       </template>
     </el-form>
 
-    <template #footer>
+    <template v-if="!isPageVariant" #footer>
       <div class="dialog-footer">
-        <el-button @click="innerVisible = false">
+        <el-button @click="handleCancel">
           <el-icon><Close /></el-icon>取消
         </el-button>
         <el-button type="primary" :loading="submitLoading" :disabled="!parsed" @click="handleSubmit">
@@ -133,10 +127,19 @@
         </el-button>
       </div>
     </template>
-  </el-dialog>
+    <div v-else class="mp-plan-form-footer dialog-footer">
+      <el-button @click="handleCancel">
+        <el-icon><Close /></el-icon>取消
+      </el-button>
+      <el-button type="primary" :loading="submitLoading" :disabled="!parsed" @click="handleSubmit">
+        <el-icon><Check /></el-icon>确认生成
+      </el-button>
+    </div>
+  </component>
 </template>
 
 <script setup lang="ts">
+  import { ElDialog } from 'element-plus'
   import { Check, Close, MagicStick } from '@element-plus/icons-vue'
   import {
     pasteRecognizeApi,
@@ -160,22 +163,49 @@
       visible: boolean
       mode: 'vehicle-bundle' | 'personnel-first'
       carrierOptions?: Carrier[]
+      variant?: 'dialog' | 'page'
     }>(),
     {
-      carrierOptions: () => []
+      carrierOptions: () => [],
+      variant: 'dialog'
     }
   )
 
   const emit = defineEmits<{
     'update:visible': [boolean]
     done: [result?: PasteCommitResult]
+    close: []
   }>()
 
+  const isPageVariant = computed(() => props.variant === 'page')
+
   const innerVisible = computed({
     get: () => props.visible,
     set: (v: boolean) => emit('update:visible', v)
   })
 
+  function onFormShellVisible(value: boolean) {
+    innerVisible.value = value
+  }
+
+  const formShellBind = computed(() => {
+    if (isPageVariant.value) {
+      return { class: 'mp-plan-form-page pl-paste-recognize-dialog' }
+    }
+    return {
+      modelValue: innerVisible.value,
+      title: dialogTitle.value,
+      width: '1100px',
+      alignCenter: true,
+      destroyOnClose: true,
+      appendToBody: true,
+      class: 'dialog-form-layout pl-paste-recognize-dialog',
+      modalClass: 'order-module-dialog-mask',
+      closeOnClickModal: false,
+      style: 'backdrop-filter: none'
+    }
+  })
+
   const dialogTitle = computed(() =>
     props.mode === 'vehicle-bundle' ? '快速识别创建（整车套装）' : '快速识别创建（以人为主）'
   )
@@ -407,6 +437,14 @@
     escortForm.idCardNo = ''
   }
 
+  function handleCancel() {
+    if (isPageVariant.value) {
+      emit('close')
+      return
+    }
+    innerVisible.value = false
+  }
+
   watch(
     () => props.visible,
     async v => {
@@ -414,11 +452,37 @@
         rawText.value = PL_PASTE_SAMPLE_TEXT
         await ensureCarriers()
       }
-    }
+    },
+    { immediate: true }
   )
 </script>
 
 <style scoped lang="scss">
+  .mp-plan-form-title {
+    margin: 0 0 12px;
+    font-size: 18px;
+    font-weight: 700;
+    color: #087f57;
+  }
+
+  .mp-plan-form-page {
+    :deep(.form-grid-4),
+    :deep(.form-grid-3) {
+      grid-template-columns: 1fr;
+    }
+  }
+
+  .mp-plan-form-footer {
+    position: sticky;
+    bottom: 0;
+    z-index: 2;
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+    padding: 12px 0 calc(8px + env(safe-area-inset-bottom));
+    background: #f5f8f7;
+  }
+
   .paste-conflict-block,
   :deep(.el-alert) {
     margin-top: 16px;

web-admin/src/views/m/pl/plan/paste.vue

@@ -1,18 +1,32 @@
 <template>
   <MpWebviewShell>
-    <p class="mp-wv-placeholder">三方人车快速创建加载中…</p>
+    <PlPasteRecognizeDialog
+      variant="page"
+      mode="vehicle-bundle"
+      :visible="true"
+      @done="onDone"
+      @close="onClose"
+    />
   </MpWebviewShell>
 </template>
 
 <script setup lang="ts">
+  import { useRouter } from 'vue-router'
   import MpWebviewShell from '@/layouts/MpWebviewShell.vue'
-</script>
+  import PlPasteRecognizeDialog from '@/components/business/pl-paste-recognize-dialog/index.vue'
+  import '@/styles/mp-webview.scss'
 
-<style scoped>
-  .mp-wv-placeholder {
-    margin: 24px 0 0;
-    font-size: 14px;
-    color: #6b7b74;
-    text-align: center;
+  const router = useRouter()
+
+  function onDone() {
+    void router.replace('/m/pl/plan')
   }
-</style>
+
+  function onClose() {
+    if (window.history.length > 1) {
+      router.back()
+      return
+    }
+    void router.replace('/m/pl/plan')
+  }
+</script>