mod:虚拟遥控器

frontend/src/router/index.ts

@@ -5,7 +5,7 @@ import { authGuard } from './plugins/authGuard'
 const routes: RouteRecordRaw[] = [
     {
         path: "/",
-        redirect: "/photography/check"
+        redirect: "/home"
     },
     {
         path: "/home",

frontend/src/views/Photography/shot.vue

@@ -181,6 +181,9 @@ const menu = computed(()=>{
         type:'setting'
       },
       {
+        type:'remoteControl'
+      },
+      {
         type:'developer'
       }
     ]
@@ -190,6 +193,9 @@ const menu = computed(()=>{
   return [
     {
       type:'setting'
+    },
+    {
+      type:'remoteControl'
     }
   ]
 
@@ -249,15 +255,12 @@ async function getPhotoRecords(params?:{}) {
  * @param data - 包含拍摄所需的数据对象。
  */
 async function runGoods(data) {
-  console.log('aa2')
   await socketStore.connectSocket();
 
-  console.log('aa3')
   socketStore.sendMessage({
     type: 'run_mcu',
     data,
   })
-
   ElMessage.success('开始拍摄，请稍后')
   runLoading.value = true;
   runAction.value = data
@@ -358,6 +361,9 @@ onMounted(async () => {
     }
   });
 
+  window.addEventListener('storage', handleStorageEvent);
+
+
 
   await getPhotoRecords();
   // 监听图片处理完成事件
@@ -422,6 +428,25 @@ onMounted(async () => {
 
 })
 
+
+
+const handleStorageEvent = (e) => {
+  if(e.key === 'run_mcu' && e.newValue){
+    if(!goods_art_no.value){
+      ElMessage.error('请先扫描货号或者手动输入货号!')
+      localStorage.setItem('run_mcu','')
+      return;
+    }
+    let action = '执行左脚程序'
+    if(e.newValue  === 'right')  action = '执行右脚程序'
+    runGoods({
+      "action": action,
+      "goods_art_no": goods_art_no.value,
+    })
+    localStorage.setItem('run_mcu','')
+
+  }
+};
 const checkInfoStore = checkInfo()
 checkInfoStore.set_blue_tooth_scan_NO('')
 watchEffect(async ()=>{
@@ -442,6 +467,7 @@ onBeforeUnmount(() => {
   clientStore.ipc.removeAllListeners(icpList.socket.message + '_run_mcu');
   clientStore.ipc.removeAllListeners(icpList.socket.message + '_photo_take');
   clientStore.ipc.removeAllListeners(icpList.socket.message + '_photo_take_finish');
+  window.removeEventListener('storage', handleStorageEvent);
 
 
 })

frontend/src/views/RemoteControl/index.vue

@@ -8,24 +8,28 @@
   <div class="main-container">
     <el-row align="middle">
       <el-col :span="8"></el-col>
-      <el-col :span="8"><div class="button up">上</div></el-col>
+      <el-col :span="8"></el-col>
+<!--      <el-col :span="8"><div class="button up">上</div></el-col>-->
       <el-col :span="8"></el-col>
     </el-row>
     <el-row align="middle">
-      <el-col :span="8"><div class="button up">左脚</div></el-col>
-      <el-col :span="8"><div class="button up">拍照</div></el-col>
-      <el-col :span="8"><div class="button up">右脚</div></el-col>
+      <el-col :span="8"><div class="button up" @click="runLeft">左脚</div></el-col>
+      <el-col :span="8"><div class="button up" @click="run_take_picture">拍照</div></el-col>
+      <el-col :span="8"><div class="button up" @click="runRight">右脚</div></el-col>
     </el-row>
     <el-row align="middle">
       <el-col :span="8"></el-col>
-      <el-col :span="8"><div class="button up">下</div></el-col>
+      <el-col :span="8"></el-col>
+<!--      <el-col :span="8"><div class="button up">下</div></el-col>-->
       <el-col :span="8"></el-col>
     </el-row>
     <el-row align="middle" class="mar-top-50">
       <el-col :span="3"></el-col>
-      <el-col :span="8"><div class="button up">继续</div></el-col>
+      <el-col :span="8"></el-col>
+<!--      <el-col :span="8"><div class="button up">继续</div></el-col>-->
       <el-col :span="2"></el-col>
-      <el-col :span="8"><div class="button up">停止</div></el-col>
+      <el-col :span="8"></el-col>
+<!--      <el-col :span="8"><div class="button up">停止</div></el-col>-->
       <el-col :span="3"></el-col>
     </el-row>
   </div>
@@ -34,6 +38,31 @@
 
 <script setup lang="ts">
 import headerBar from '@/components/header-bar/index.vue'
+import icpList from '@/utils/ipc'
+import client from "@/stores/modules/client";
+import socket from "@/stores/modules/socket";
+
+const clientStore = client();
+// 初始化 WebSocket 状态管理
+const socketStore = socket()
+
+const runLeft = async () => {
+  localStorage.setItem('run_mcu','left')
+}
+
+
+const runRight = async () => {
+  localStorage.setItem('run_mcu','right')
+}
+
+
+
+const run_take_picture = () => {
+  socketStore.sendMessage({
+    type: 'handler_take_picture',
+  })
+}
+
 </script>
 
 <style scoped lang="scss">