CRM_26-08-05#story#9126,车辆管理、服务商管理系统需求

src/views/index/vehicleAdd.vue

@@ -454,15 +454,6 @@
     </div>
   </van-popup>
 
-  <camera-guide
-    :visible="cameraGuideVisible"
-    :type="cameraGuideType"
-    :stream="cameraStream"
-    @confirm="onCameraConfirm"
-    @cancel="onCameraCancel"
-    @fallback="onCameraFallback"
-  />
-
 </div>
 </template>
 
@@ -475,7 +466,6 @@ import {vehicleTypeList,saveVehicle,getInfoById,supplierServiceTree, uploadImage
   userOperationPermissions,saveSupplierApproval} from "@/api/mine"
 import TwoCommonBtn from "@/components/twoBtnCommon.vue"
 import CellGroup from "@/components/cellGroup.vue";
-import CameraGuide from "@/components/CameraGuide.vue";
 export default {
   name: "vehicleAdd",
   mixins:[myMixins],
@@ -511,9 +501,7 @@ export default {
       oldSupplierServiceList:[],
       show:false,
       imageUrl: require('@/assets/arr_right.png'),
-      cameraGuideVisible: false, // 拍摄引导弹层显示
       cameraGuideType: 'front',  // 当前拍摄槽位 front/back/car
-      cameraStream: null,        // 探测成功的相机流，交给 CameraGuide 复用
       vehicleLicenseFrontList: [],
       vehicleLicenseBackList: [],
       vehicleLicenseCarPhotoList: [],
@@ -710,30 +698,54 @@ export default {
     },
   },
   async mounted() {
-    this.id=this.$route.params?.id
-    this.approvalForm.supplierId=this.$route.params?.supplierId
-    const urlParams = new URLSearchParams(window.location.search);
-    const rawId = this.$route.query.supplierId || urlParams.get('supplierId');
-    this.supplierId = rawId ? Number(rawId) : '';
-    await this.getSupplierServiceTree();
-    await this.getTypeList();
-    if( this.id){
-      await this.vehicleInfo()
-    }else{
-      this.originData={
-        vehicleType:'',
-        vehicleStatus:'',
-        virtualVehicle:'',
-        serviceIds:[],
-        hasLiabilityInsurance:'',
-        insuranceCorp:'',
-        liabilityInsuranceStartTime:'',
-        liabilityInsuranceEndTime:'',
-        insurancePicturePhoto:''
+    await this.initPage()
+    this.hasInited = true // 标记首次初始化完成（keep-alive 下 activated 据此判断再次进入需重新初始化）
+  },
+  activated() {
+    // 从拍摄页返回：取回拍照结果/降级信息，保留表单不重新初始化
+    const cam = this.$store.state.camera
+    if (cam.result || cam.fallback) {
+      const { result, fallback } = cam
+      this.$store.commit('camera/clear')
+      if (result) {
+        this.cameraGuideType = result.type
+        this.onCameraConfirm(result)
+      } else {
+        this.cameraGuideType = fallback.type
+        this.handleCameraFail(fallback.error)
       }
+      return
+    }
+    // 从车辆管理等其他页面再次进入（keep-alive 缓存复用）：按当前路由重新初始化
+    if (this.hasInited) {
+      this.initPage()
     }
   },
   methods:{
+    async initPage() {
+      this.id=this.$route.params?.id
+      this.approvalForm.supplierId=this.$route.params?.supplierId
+      const urlParams = new URLSearchParams(window.location.search);
+      const rawId = this.$route.query.supplierId || urlParams.get('supplierId');
+      this.supplierId = rawId ? Number(rawId) : '';
+      await this.getSupplierServiceTree();
+      await this.getTypeList();
+      if( this.id){
+        await this.vehicleInfo()
+      }else{
+        this.originData={
+          vehicleType:'',
+          vehicleStatus:'',
+          virtualVehicle:'',
+          serviceIds:[],
+          hasLiabilityInsurance:'',
+          insuranceCorp:'',
+          liabilityInsuranceStartTime:'',
+          liabilityInsuranceEndTime:'',
+          insurancePicturePhoto:''
+        }
+      }
+    },
     showDateHandler() {
       if( this.id ) {   // 修改
         if( this.permissonList.includes('hasInsuranceAudit') ) {
@@ -948,30 +960,19 @@ export default {
     isCameraSupported() {   // 是否支持 getUserMedia（不支持则降级系统选择器）
       return !!(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) && window.isSecureContext !== false
     },
-    async onLicenseSlotClick(type) {   // 行驶证三槽位点击拦截：前置探测相机，可用才进引导页，否则直接降级系统选择器
+    onLicenseSlotClick(type) {   // 行驶证三槽位点击拦截：跳独立拍摄页，不支持相机则直接降级系统选择器
       this.cameraGuideType = type
       if (!this.isCameraSupported()) {
         // 不支持 getUserMedia（如 iOS 微信、非 HTTPS、老 WebView）：直接调系统选择器
         this.triggerNativeUpload(type)
         return
       }
-      try {
-        // 前置真实探测相机可用性；探测成功的流直接交给 CameraGuide 复用，
-        // 避免 iOS 上 stop 后立即二次 getUserMedia 拿到不渲染的“死流”（黑屏）
-        const stream = await navigator.mediaDevices.getUserMedia({ video: { facingMode: 'environment' }, audio: false })
-        this.cameraStream = stream
-        this.cameraGuideVisible = true
-      } catch (e) {
-        console.warn('probe getUserMedia error:', e && (e.name || e.message || e))
-        this.handleCameraFail(e)
-      }
+      this.$router.push({ name: 'cameraGuide', query: { type } })
     },
     isCameraPermissionError(e) {   // 是否为相机权限类错误
       return !!(e && (e.name === 'NotAllowedError' || e.name === 'SecurityError' || e.name === 'PermissionDeniedError'))
     },
     handleCameraFail(e) {   // 相机不可用统一处理：权限类弹确认框，其他异常提示后由用户点击触发相册（保证点击手势有效）
-      this.cameraGuideVisible = false
-      this.cameraStream = null
       if (this.isCameraPermissionError(e)) {
         Dialog.confirm({
           title: '提示',
@@ -1005,8 +1006,6 @@ export default {
       })
     },
     onCameraConfirm({ blob, dataURL }) {   // 拍摄确认：构造 {file, content} 走现有压缩→上传→OCR 链路
-      this.cameraGuideVisible = false
-      this.cameraStream = null
       const type = this.cameraGuideType
       const file = new File([blob], `vehicle_license_${type}_${Date.now()}.jpg`, { type: 'image/jpeg' })
       const fileItem = { file, content: dataURL }
@@ -1024,13 +1023,6 @@ export default {
       this[listMap[type]] = [fileItem]
       this[handlerMap[type]](fileItem)
     },
-    onCameraCancel() {   // 返回放弃
-      this.cameraGuideVisible = false
-      this.cameraStream = null
-    },
-    onCameraFallback(e) {   // CameraGuide 内 getUserMedia 失败（前置探测已通过，概率极低）：按异常类型统一处理
-      this.handleCameraFail(e)
-    },
     async vehicleLicenseFrontHandler(file) {    // 上传 行驶证首页
       console.log('file',file)
       try {
@@ -1702,8 +1694,7 @@ export default {
   },
   components:{
     CellGroup,
-    TwoCommonBtn,
-    CameraGuide
+    TwoCommonBtn
   }
 }
 </script>