Browse Source

feat(摄影): 优化拍摄流程和界面显示

- 在最后一张照片下方添加关闭按钮
-点击关闭按钮后隐藏最后一张照片
- 拍摄成功后显示 5 秒自动关闭
- 优化代码结构,提取重置状态方法
- 修复拍摄成功后未重置状态的问题
panqiuyao 4 months ago
parent
commit
f2f24947ee
1 changed files with 27 additions and 13 deletions
  1. 27 13
      frontend/src/views/Photography/shot.vue

+ 27 - 13
frontend/src/views/Photography/shot.vue

@@ -66,7 +66,15 @@
         </div>
 
         <div class="last-photo" v-show="showlastPhoto" v-key="lastPhoto.file_path">
-          <div>{{lastPhoto.action_name || ''}}</div>
+          <div class="flex between">
+            <div></div>
+            <div class="flex-item">{{ lastPhoto.action_name || '' }}</div>
+            <div class="cu-p">
+              <el-icon style="color: #000" @click="showlastPhoto = false" class="close-icon">
+                <Close/>
+              </el-icon>
+            </div>
+          </div>
           <el-image  :src="getFilePath(lastPhoto.file_path)"  fit="contain" ></el-image>
         </div>
 
@@ -204,6 +212,7 @@ import  generate from '@/utils/menus/generate'
 const loading = ref(false)
 const runLoading = ref(false)
 const takePictureLoading = ref(false)
+import { Close } from '@element-plus/icons-vue'
 
 
 import useUserInfo from "@/stores/modules/user";
@@ -575,6 +584,14 @@ const reTakePicture = async (img)=>{
 
 }
 
+const resetStatus = ()=>{
+  runLoading.value = false;
+  reNosObj.value.goods_art_no = ''
+  reNosObj.value.action = ''
+  runAction.value.goods_art_no = '';
+  runAction.value.action = '';
+}
+
 const reNosObj = ref({
   goods_art_no:null,
   action:null,
@@ -691,16 +708,11 @@ onMounted(async () => {
 
   })
 
-
   // 监听一键停止结束
   clientStore.ipc.on(icpList.socket.message + '_run_mcu_stop', (event, result) => {
     console.log('_run_mcu_stop')
 
-    runLoading.value = false;
-    reNosObj.value.goods_art_no = ''
-    reNosObj.value.action = ''
-    runAction.value.goods_art_no = '';
-    runAction.value.action = '';
+    resetStatus()
   })
 
 
@@ -868,20 +880,20 @@ clientStore.ipc.on(icpList.socket.message + '_run_mcu_update', (event, result) =
   if(result.code === 0){
     if(result.data?.file_path){
       if(  lastPhoto.value?.file_path == result.data?.file_path) return;
-
-      if(runAction.value.goods_art_no === result.data?.goods_art_no){
+      let goods_art_no =  runAction.value.goods_art_no ||  reNosObj.value.goods_art_no
+      if(goods_art_no === result.data?.goods_art_no){
         showlastPhoto.value = true
         goodsList.value.map(item=>{
           if(item.goods_art_no === result.data?.goods_art_no){
-            console.log('========item');
-            console.log(item);
             item.items[result.data.image_index].PhotoRecord.image_path = result.data?.file_path
             result.data.action_name =  item.items[result.data.image_index].action_name
             setTimeout(()=>{
               item.items[result.data.image_index].PhotoRecord.image_path = result.data?.file_path
             },1000)
-            console.log(item);
-            console.log( goodsList.value);
+
+            setTimeout(()=>{
+              showlastPhoto.value = false
+            },5000)
           }
         })
        // getPhotoRecords()
@@ -894,6 +906,8 @@ clientStore.ipc.on(icpList.socket.message + '_run_mcu_update', (event, result) =
   }else if(result.msg) {
     ElMessage.error(result.msg)
   }
+
+  resetStatus()
 })