ホーム エクスプローラ ヘルプ
サインイン
liangyibo
/
CameraMachine
2
0
フォーク 0
ファイル 課題 0 プルリクエスト 0 Wiki
ソースを参照

feat(setting): 优化相机配置功能

- 在相机选择下拉框添加 focus 事件监听器 ensureCurrentCameraInList
- 更新多相机模式配置结构注释，明确使用原始 CameraKey 作为存储和显示
- 移除自动分配相机逻辑，改为手动选择模式
- 添加 ensureCurrentCameraInList 方法确保当前绑定相机在列表中显示
- 为 CameraConfig 组件添加 key 属性以优化渲染
- 新增 md5 工具函数用于生成相机标识的哈希值
- 更新打包文件中的资源引用路径
panqiuyao 16 時間 前
親
97aedf1507
コミット
f5055a3c2d
4 ファイル変更、41 行追加、21 行削除
一括表示 差分情報を表示
  1. 19 0
      frontend/src/utils/md5.ts
  2. 20 19
      frontend/src/views/Setting/components/CameraConfig.vue
  3. 1 1
      frontend/src/views/Setting/index.vue
  4. 1 1
      public/dist/index.html

+ 19 - 0
frontend/src/utils/md5.ts
ファイルの表示 

@@ -0,0 +1,19 @@
 
+import CryptoJS from 'crypto-js'
 
+
 
+/**
 
+ * 生成字符串的 MD5 哈希值
 
+ * @param str 需要哈希的字符串
 
+ * @returns MD5 哈希值
 
+ */
 
+export function generateMd5(str: string): string {
 
+  return CryptoJS.MD5(str).toString()
 
+}
 
+
 
+/**
 
+ * 生成 CameraKey 的 MD5 哈希值（用于避免特殊字符匹配问题）
 
+ * @param cameraKey 相机标识
 
+ * @returns MD5 哈希值
 
+ */
 
+export function generateCameraMd5(cameraKey: string): string {
 
+  return generateMd5(cameraKey)
 
+}

+ 20 - 19
frontend/src/views/Setting/components/CameraConfig.vue
ファイルの表示 

@@ -38,6 +38,7 @@
 
                 filterable
 
                 filterable
 
                 clearable
 
                 clearable
 
                 @change="onCameraChange(activePoint)"
 
                 @change="onCameraChange(activePoint)"
 
+                @focus="ensureCurrentCameraInList"
 
               >
 
               >
 
                 <el-option
 
                 <el-option
 
                   v-for="camera in availableCameras"
 
                   v-for="camera in availableCameras"
 
@@ -142,6 +143,7 @@ const pointList = [
 
 ]
 
 ]
 
 
 
 // 多相机模式的配置结构（统一数据结构）
 
 // 多相机模式的配置结构（统一数据结构）
 
+// 使用原始 CameraKey 作为存储和显示
 
 const multiConfig = reactive({
 
 const multiConfig = reactive({
 
   A: {
 
   A: {
 
     iso: { low: '100', high: '6400' },
 
     iso: { low: '100', high: '6400' },
 
@@ -221,10 +223,7 @@ const fetchCameraList = () => {
 
   clientStore.ipc.invoke(icpList.camera.getCameraList).then(result => {
 
   clientStore.ipc.invoke(icpList.camera.getCameraList).then(result => {
 
     if (result && result.CameraLists && Array.isArray(result.CameraLists)) {
 
     if (result && result.CameraLists && Array.isArray(result.CameraLists)) {
 
       cameraList.value = result.CameraLists
 
       cameraList.value = result.CameraLists
 
-      // 自动分配相机到点位
 
-      if (isMultiCameraMode.value) {
 
-        autoAssignCameras()
 
-      }
 
+      // 不再自动分配相机，让用户手动选择
 
       updatePointConnectionStatus()
 
       updatePointConnectionStatus()
 
     }
 
     }
 
   }).catch(err => {
 
   }).catch(err => {
 
@@ -232,21 +231,6 @@ const fetchCameraList = () => {
 
   })
 
   })
 
 }
 
 }
 
 
 
-// 自动分配相机到点位
 
-const autoAssignCameras = () => {
 
-  const cameras = cameraList.value || []
 
-  const unassignedCameras = cameras.filter(cam => {
 
-    return !Object.values(multiConfig).some(p => p.CameraKey === cam.CameraKey)
 
-  })
 
-  const points = ['A', 'B', 'C']
 
-  unassignedCameras.slice(0, 3).forEach((cam, index) => {
 
-    if (points[index]) {
 
-      multiConfig[points[index]].CameraKey = cam.CameraKey
 
-      multiConfig[points[index]].CameraName = cam.CameraName
 
-    }
 
-  })
 
-}
 
-
 
 // 相机选择变更
 
 // 相机选择变更
 
 const onCameraChange = (pointKey) => {
 
 const onCameraChange = (pointKey) => {
 
   const cameraKey = multiConfig[pointKey].CameraKey
 
   const cameraKey = multiConfig[pointKey].CameraKey
 
@@ -262,6 +246,23 @@ const onCameraChange = (pointKey) => {
 
   updatePointConnectionStatus()
 
   updatePointConnectionStatus()
 
 }
 
 }
 
 
 
+// 确保当前绑定的相机在列表中（即使断开连接也显示）
 
+const ensureCurrentCameraInList = () => {
 
+  const currentCameraKey = multiConfig[activePoint.value].CameraKey
 
+  if (!currentCameraKey) return
 
+
 
+  // 检查是否已在列表中
 
+  const exists = cameraList.value.some(c => c.CameraKey === currentCameraKey)
 
+  if (!exists) {
 
+    // 添加一个临时条目（未连接状态）用于显示
 
+    cameraList.value.push({
 
+      CameraKey: currentCameraKey,
 
+      CameraName: multiConfig[activePoint.value].CameraName || currentCameraKey,
 
+      CameraStatus: false
 
+    })
 
+  }
 
+}
 
+
 
 // 监听multiConfig变化并更新父组件
 
 // 监听multiConfig变化并更新父组件
 
 watch(multiConfig, (newVal) => {
 
 watch(multiConfig, (newVal) => {
 
   emit('update:camera_configs', {
 
   emit('update:camera_configs', {

+ 1 - 1
frontend/src/views/Setting/index.vue
ファイルの表示 

@@ -155,7 +155,7 @@
 
       <!--基础配置-->
 
       <!--基础配置-->
 
       <!--相机配置-->
 
       <!--相机配置-->
 
       <template v-if="activeIndex === 3">
 
       <template v-if="activeIndex === 3">
 
-      <CameraConfig ref="cameraConfigRef" :camera_configs="formData.camera_configs" @update:camera_configs="updateCameraConfigs"/>
 
+         <CameraConfig ref="cameraConfigRef" :key="activeIndex" :camera_configs="formData.camera_configs" @update:camera_configs="updateCameraConfigs"/>
 
 
 
       </template>
 
       </template>
 
       <!--相机配置-->
 
       <!--相机配置-->

+ 1 - 1
public/dist/index.html
ファイルの表示 

@@ -5,7 +5,7 @@
 
     <link rel="icon" type="image/svg+xml" href="./vite.svg" />

     <link rel="icon" type="image/svg+xml" href="./vite.svg" />

     <meta name="viewport" content="width=device-width, initial-scale=1.0" />

     <meta name="viewport" content="width=device-width, initial-scale=1.0" />

     <title>智惠映AI自动拍照机</title>

     <title>智惠映AI自动拍照机</title>

-    <script type="module" crossorigin src="./assets/index-L1oZlcc3.js"></script>
 
+    <script type="module" crossorigin src="./assets/index-BROJaE7c.js"></script>
 
     <link rel="stylesheet" crossorigin href="./assets/index-B8MPi9a0.css">
 
     <link rel="stylesheet" crossorigin href="./assets/index-B8MPi9a0.css">
 
   </head>

   </head>

   <body>

   <body>