日常开发

src/components/OnlineFaceWindow/index.vue

@@ -20,6 +20,7 @@
             </div>
           </div>
         </div>
+        <div @click="getCloseFace">关闭</div>
       </div>
     </Transition>
   </div>
@@ -27,7 +28,7 @@
 </template>
 <script setup lang="ts">
 import { useWebSocket } from '@/utils/faceWs';
-const { faceWs, checkFace, openFace, terminateFace, suspendFace, resumeFace, getFace } = useWebSocket();
+const { faceWs, startDevice, checkFace, openFace, terminateFace, suspendFace, resumeFace, getFace } = useWebSocket();
 const { proxy } = getCurrentInstance() as any;
 
 const data = reactive<any>({
@@ -35,20 +36,49 @@ const data = reactive<any>({
   faceState: false,//人脸识别窗口状态
   direction: "",//动画方向
   parameter: {},//参数
+  deviceInfo: {},
 });
 
-const { faceCheckStu, faceState, direction, parameter } = toRefs(data);
+const { faceCheckStu, faceState, direction, parameter, deviceInfo } = toRefs(data);
 
 onBeforeMount(() => {
   //加载手势WS
   faceWs((e: any) => {
     if (e?.wksid) {
+      //获取设备信息
+      getDevice();
+    }
+
+    //接收设备信息
+    if (e?.device_info) {
+      deviceInfo.value = e.device_info;
+      let handcontroller_id = deviceInfo.value.handcontroller_id;
       getCheckGrades();
       openFace();
     }
   });
 })
 
+/**
+ * 获取设备信息
+ */
+const getDevice = async () => {
+  let deviceid = localStorage.getItem('deviceid') || '';
+  if (deviceid) {
+    startDevice({ deviceid: deviceid });
+  } else {
+    proxy?.$modal.msgError(`缺少设备信息请重新登录！`);
+    await proxy?.$http.common.logout({}).then((res: any) => { });
+    proxy?.$modal?.closeLoading();
+    //清空缓存
+    // localStorage.clear();
+    localStorage.removeItem('token');
+    localStorage.removeItem('userInfo');
+    //跳转
+    router.push({ path: '/login/qrcode' });
+  }
+};
+
 /**
  * 查成绩
 */
@@ -58,10 +88,19 @@ const getCheckGrades = () => {
     proxy?.$modal.msgWarning('没有设备号，请重新登录');
     return false;
   }
-  checkFace()
+  let handcontroller_id = deviceInfo.value.handcontroller_id;
+  checkFace(handcontroller_id)
 };
 
 
+/**
+ * 关闭人脸识别
+*/
+const getCloseFace = () => {
+  let handcontroller_id = deviceInfo.value.handcontroller_id;
+  closeFace(handcontroller_id)
+};
+
 </script>
 <style lang="scss" scoped>
 .mask {

src/utils/faceWs.ts

@@ -6,7 +6,6 @@ export function useWebSocket() {
   const token: any = localStorage.getItem('token');
   const deviceid: any = localStorage.getItem('deviceid');
   const myToken: any = 'JWT ' + token;
-  const ctrlName: any = `facecontroller_${deviceid}`
 
   let socketFace: any = null; //ws实例对象
   socketFace = io(address + '/', {
@@ -27,6 +26,9 @@ export function useWebSocket() {
     socketFace.on('my_response', (e: any) => {
       callback(e);
     });
+    socketFace.on('fe_device_init_result', (e: any) => {
+      callback(e);
+    });
     socketFace.on('facecontroller_ack', (e: any) => {
       callback(e);
     });
@@ -48,6 +50,19 @@ export function useWebSocket() {
     }
   }
 
+  /**
+   * 开始连接设备信息
+   */
+  function startDevice(data?: any, callback?: any) {
+    sendMessage(
+      'fe_device_init',
+      {
+        data: data
+      },
+      () => {}
+    );
+  }
+
   /**
    * 查看人脸识别模块是否可用
    */
@@ -56,7 +71,7 @@ export function useWebSocket() {
       'facecontroller_ack',
       {
         cmd: 'check_facecontroller_available',
-        ctrl_name: ctrlName,
+        ctrl_name: `facecontroller_${data}`
       },
       () => {}
     );
@@ -70,7 +85,7 @@ export function useWebSocket() {
       'facecontroller_ack',
       {
         cmd: 'open_facecontroller',
-        ctrl_name: ctrlName,
+        ctrl_name: `facecontroller_${data}`
       },
       () => {}
     );
@@ -84,7 +99,7 @@ export function useWebSocket() {
       'facecontroller_ack',
       {
         cmd: 'terminate_facecontroller',
-        ctrl_name: ctrlName,
+        ctrl_name: `facecontroller_${data}`
       },
       () => {}
     );
@@ -98,7 +113,7 @@ export function useWebSocket() {
       'facecontroller_ack',
       {
         cmd: 'suspend_facecontroller',
-        ctrl_name: ctrlName,
+        ctrl_name: `facecontroller_${data}`
       },
       () => {}
     );
@@ -112,7 +127,7 @@ export function useWebSocket() {
       'facecontroller_ack',
       {
         cmd: 'resume_facecontroller',
-        ctrl_name: ctrlName,
+        ctrl_name: `facecontroller_${data}`
       },
       () => {}
     );
@@ -126,7 +141,7 @@ export function useWebSocket() {
       'facecontroller_ack',
       {
         cmd: 'get_facecontroller_state',
-        ctrl_name: ctrlName,
+        ctrl_name: `facecontroller_${data}`
       },
       () => {}
     );
@@ -139,5 +154,5 @@ export function useWebSocket() {
     }
   });
 
-  return { faceWs, sendMessage, checkFace, openFace, terminateFace, suspendFace, resumeFace, getFace };
+  return { faceWs,startDevice, sendMessage, checkFace, openFace, terminateFace, suspendFace, resumeFace, getFace };
 }

src/views/score/index.vue

@@ -235,12 +235,13 @@ onMounted(() => {
 .top {
   width: 100%;
   height: 12vh;
-  background-color: #b0ffac;
+  /*background-color: #b0ffac;
   background-image: url("@/assets/images/common/btnbg2.png");
   background-size: 100% 100%;
-  background-repeat: repeat;
+  background-repeat: repeat;*/
   display: flex;
   align-items: center;
+  background: radial-gradient(120% 126% at 5% 93%, #8EFFA9 0%, #07FFE7 100%);
 }
 
 .top .topLeft {