ocr

src/pages/devicesSearch/ocrSearch.nvue

@@ -77,6 +77,9 @@
     </view>
     <!-- 相机预览页面 -->
     <view v-if="showCamera" class="camera-container">
+      <!-- 相机预览容器 -->
+      <view class="camera-preview-container" id="cameraPreview"></view>
+
       <!-- 顶部提示 -->
       <view class="top-tip">
         <text class="tip-text">请将识别编码置于取景框内，完成扫描</text>
@@ -254,47 +257,6 @@ export default {
       return null;
     },
 
-    // 检查相机权限 - 改进版本
-    async checkCameraPermission() {
-      return new Promise((resolve) => {
-        // 检查权限插件是否可用
-        const permissions = window.cordova?.plugins?.permissions;
-
-        if (!permissions) {
-          console.warn('权限插件不可用，跳过权限检查');
-          resolve(true);
-          return;
-        }
-
-        permissions.checkPermission(
-            permissions.CAMERA,
-            (status) => {
-              if (status.hasPermission) {
-                console.log('相机权限已授予');
-                resolve(true);
-              } else {
-                console.log('请求相机权限...');
-                permissions.requestPermission(
-                    permissions.CAMERA,
-                    (status) => {
-                      console.log('权限请求结果:', status.hasPermission);
-                      resolve(status.hasPermission);
-                    },
-                    (error) => {
-                      console.error('请求权限失败:', error);
-                      resolve(false);
-                    }
-                );
-              }
-            },
-            (error) => {
-              console.error('检查权限失败:', error);
-              resolve(true); // 权限检查失败时假设有权限
-            }
-        );
-      });
-    },
-
     // 打开相机 - 改进版本
     async openCamera() {
       console.log('尝试打开相机...');
@@ -314,17 +276,6 @@ export default {
       }
 
       try {
-        // 检查权限
-        const hasPermission = await this.checkCameraPermission();
-        if (!hasPermission) {
-          uni.showToast({
-            title: '需要相机权限才能使用此功能',
-            icon: 'none',
-            duration: 2000
-          });
-          return;
-        }
-
         // 显示相机界面
         this.showCamera = true;
 
@@ -348,46 +299,73 @@ export default {
     // 初始化相机 - 改进版本
     async initCamera() {
       return new Promise((resolve, reject) => {
-        console.log('初始化相机预览...');
-
         const CameraPreview = this.getCameraPlugin();
         if (!CameraPreview) {
           reject(new Error('相机插件不可用'));
           return;
         }
 
-        // 获取屏幕尺寸
+        // 使用setTimeout确保DOM更新完成
-        const screenWidth = uni.getSystemInfoSync().screenWidth;
+        setTimeout(() => {
-        const screenHeight = uni.getSystemInfoSync().screenHeight;
+          const query = uni.createSelectorQuery().in(this);
+          query.select('.camera-preview-container').boundingClientRect(data => {
+            if (!data) {
+              reject(new Error('无法获取相机容器尺寸'));
+              return;
+            }
+
+            // 计算实际像素值（某些平台需要px而非rpx）
+            const pixelRatio = uni.getSystemInfoSync().pixelRatio || 1;
+            const width = data.width * pixelRatio;
+            const height = data.height * pixelRatio;
 
             const options = {
-          x: 0,
+              x: data.left,
-          y: 0,
+              y: data.top,
-          width: window.innerWidth || 375,
+              width: data.width,
-          height: window.innerHeight || 667,
+              height: data.height,
               camera: CameraPreview.CAMERA_DIRECTION?.BACK || 'back',
               tapPhoto: false,
               previewDrag: false,
-          toBack: false,  // 改为 false，让相机显示在前面
+              toBack: true,
               alpha: 1,
               tapFocus: true
             };
 
             console.log('相机配置:', options);
 
+            // 先停止已有相机（如果有）
+            CameraPreview.stopCamera(() => {
+              // 启动新相机
               CameraPreview.startCamera(
                   options,
-            (result) => {
+                  () => {
-              console.log('相机启动成功:', result);
+                    console.log('相机启动成功');
                     this.cameraStarted = true;
                     resolve();
                   },
                   (error) => {
                     console.error('相机启动失败:', error);
-              this.cameraStarted = false;
+                    reject(new Error('相机启动失败'));
-              reject(new Error(`相机启动失败: ${error}`));
                   }
               );
+            }, () => {
+              // 即使停止失败也继续启动
+              CameraPreview.startCamera(
+                  options,
+                  () => {
+                    console.log('相机启动成功');
+                    this.cameraStarted = true;
+                    resolve();
+                  },
+                  (error) => {
+                    console.error('相机启动失败:', error);
+                    reject(new Error('相机启动失败'));
+                  }
+              );
+            });
+          }).exec();
+        }, 300); // 适当延迟确保DOM更新
       });
     },
 
@@ -416,6 +394,10 @@ export default {
       }
 
       return new Promise((resolve) => {
+        // 先隐藏相机预览
+        CameraPreview.hideCamera(() => {
+          console.log('相机已隐藏');
+          // 然后停止相机
           CameraPreview.stopCamera(
               () => {
                 console.log('相机已停止');
@@ -425,9 +407,25 @@ export default {
               (error) => {
                 console.error('停止相机失败:', error);
                 this.cameraStarted = false;
-              resolve(); // 即使失败也继续
+                resolve();
               }
           );
+        }, (error) => {
+          console.error('隐藏相机失败:', error);
+          // 即使隐藏失败也继续停止
+          CameraPreview.stopCamera(
+              () => {
+                console.log('相机已停止');
+                this.cameraStarted = false;
+                resolve();
+              },
+              (error) => {
+                console.error('停止相机失败:', error);
+                this.cameraStarted = false;
+                resolve();
+              }
+          );
+        });
       });
     },
 
@@ -662,6 +660,19 @@ export default {
 </script>
 
 <style>
+.camera-preview-container {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 1; /* 低于其他UI元素 */
+}
+
+/* 确保其他UI元素的z-index高于相机预览 */
+.top-tip, .viewfinder-container, .bottom-controls {
+  z-index: 10;
+}
 .page-container {
   display: flex;
   height: auto;