Add debug functionality and camera enhancements for POS mobile steps

- Introduced `PosDepartmentStepMobile1Debug.vue` to display debug information in POS mobile workflow.
- Integrated debug button and logic into `PosDepartmentStepMobile1.vue` for temporary state inspection.
- Enhanced `ScannerCamera.vue` by adding zoom and continuous focus capabilities in camera constraints.

src/components/displays/department/pos/steps/mobile/PosDepartmentStepMobile1.vue

@@ -25,6 +25,10 @@ import PosDepartmentStepMobileFixedBottomControl
   from "@/components/displays/department/pos/steps/mobile/elements/PosDepartmentStepMobileFixedBottomControl.vue";
 import PosDepartmentStepMobile1Location
   from "@/components/displays/department/pos/steps/mobile/elements/PosDepartmentStepMobile1Location.vue";
+import PosDepartmentStepMobile1Debug
+  from "@/components/displays/department/pos/steps/mobile/elements/PosDepartmentStepMobile1Debug.vue";
+//TODO: Remove this
+const debug_request_results = ref([]);
 
 const lastParsedImage = ref(null);
 const setLastCapturedImage = (image: string) => {
@@ -86,14 +90,20 @@ const parseImage = (image: string) => {
         base64_image: image
       },
   ).then((response) => {
+    debug_request_results.value.push(response); // TODO: Remove this debug line
+    // If the response is not successful, log an error and return
+    if (!response.data.success) {
+      console.error("LPR request was not successful:", response);
+      return;
+    }
     latestLPRResponse.value = response.data.data as LPRResponse;
     console.log("LPR Response:", latestLPRResponse.value);
     // Set the last successful capture time
     camera.setLastSuccess();
     // Handle parsed result.
     handleLPRResult()
-
   }).catch((error) => {
+    debug_request_results.value.push(error); // TODO: Remove this debug line
     console.error("Error parsing image:", error);
   });
 };
@@ -224,6 +234,8 @@ onUnmounted(() => {
       <div class="is-flex is-align-content-center is-justify-content-center is-flex-direction-column">
         <PosDepartmentStepMobile1RegistrationNumbers/>
       </div>
+      <!-- Debug -->
+      <PosDepartmentStepMobile1Debug :results="debug_request_results"/>
       <!-- Location -->
       <PosDepartmentStepMobile1Location/>
       <!-- Buttons -->

src/components/displays/department/pos/steps/mobile/elements/PosDepartmentStepMobile1Debug.vue

@@ -0,0 +1,30 @@
+<script setup lang="ts">
+import { ref, defineProps } from 'vue';
+import Swal from 'sweetalert2';
+const props = defineProps({
+  results: {
+    type: Array as () => Array<any>,
+    required: true
+  }
+})
+const onClickShowDebug = () => {
+  Swal.fire({
+    title: 'Debug Info',
+    html: `<div class="has-text-left"><pre>${JSON.stringify(props.results, null, 2)}</pre></div>`,
+    width: '600px',
+    confirmButtonText: 'Close'
+  });
+}
+</script>
+
+<template>
+  <div v-show="true">
+    <button @click="onClickShowDebug" class="btn btn-sm btn-outline-secondary">
+      Show Debug Info ({{ results.length }})
+    </button>
+  </div>
+</template>
+
+<style scoped>
+
+</style>

src/components/viewport/page/templates/scanner/graphics/ScannerCamera.vue

@@ -12,10 +12,24 @@ function startCamera() {
   const constraints = {
     video: {
       facingMode: 'environment',
+      zoom: 2,
       width: { ideal: 1920 },
       height: { ideal: 1080 },
-      aspectRatio: { ideal: 16/9 },
-      frameRate: { ideal: 30 }
+      frameRate: { ideal: 30 },
+
+      // New spec
+      advanced: [
+        { focusMode: 'continuous' },
+        { torch: false } // Set to true to enable flashlight if supported
+      ],
+      // Old spec
+      //focusMode: 'continuous',
+      // Zoom in on the environment camera if available
+      //facingMode: 'environment',
+      //width: { ideal: 1920 },
+      //height: { ideal: 1080 },
+      //aspectRatio: { ideal: 16/9 },
+      //frameRate: { ideal: 30 }
     }
   };