Forráskód Böngészése

Merge branch 'V0.0.2' of http://10.87.10.227:4000/jzyd_yyds/soc_app into V0.0.2

coys 2 éve
szülő
commit
f8da4f7629

+ 5 - 5
src/components/nfcPopup/gxmore.vue

@@ -11,13 +11,13 @@
 <!--          <p v-if="file" style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{'文件名:'+file}}</p>-->
           <p v-if="imageError">{{'Error:'+imageError}}</p>
           <div v-if="showBottomBox" class="bottom-box">
-            <div>
+            <div @click="nfcCheck">
               <img :src="require('../../assets/img/icon/NFC扫描-01.png')" />
-              <span @click="nfcCheck">NFC</span>
+              <span >NFC</span>
             </div>
-            <div>
+            <div @click="nfcTakePhotos">
               <img :src="require('../../assets/img/icon/camera.png')" />
-              <span @click="nfcTakePhotos">拍照</span>
+              <span>拍照</span>
             </div>
 
           </div>
@@ -259,7 +259,7 @@ export default {
 }
 .bottom-box{
   display: flex;
-  justify-content: space-around;//
+  justify-content: space-around;
   align-items: center;
   >div{
     display: flex;

+ 88 - 29
src/components/nfcPopup/more.vue

@@ -8,25 +8,28 @@
             <img class="background-image" v-if="!nfcImage" src="../../assets/img/NFCphone.png" alt="" >
             <img class="nfc-image" v-else :src="imgUrl(nfcImage)" alt="" @click="nfcTakePhotos">
           </div>
-<!--          <p v-if="file" style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{'文件名:'+file}}</p>-->
+          <!--          <p v-if="file" style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{'文件名:'+file}}</p>-->
           <p v-if="imageError">{{'Error:'+imageError}}</p>
           <div v-if="showBottomBox" class="bottom-box">
-            <div>
+            <div @click="nfcCheck">
               <img :src="require('../../assets/img/icon/NFC扫描-01.png')" />
-              <span @click="nfcCheck">NFC</span>
+              <span >NFC</span>
             </div>
-            <div>
+            <div @click="nfcTakePhotos">
               <img :src="require('../../assets/img/icon/camera.png')" />
-              <span @click="nfcTakePhotos">拍照</span>
+              <span>拍照</span>
             </div>
+
           </div>
           <div v-else>
-            <select-cell title="需要拍照的NFC" @change="changeNFC" v-model="selectNFC" :prop="prop" :dataList="dataList"/>
-            <van-button v-if="showBtn" type="info"  size="small" block @click="onConfirm">确认该照片</van-button>
+              <p>{{selectNFC}}</p>
+            <select-cell title="需要拍照的NFC" v-model="selectNFC" :prop="prop" :dataList="dataList"/>
+            <van-button v-if="selectNFC" type="info"  size="small" block @click="onConfirm">确认该照片</van-button>
           </div>
         </div>
       </div>
-      <input v-show="false" ref="upload"  type='file' accept="image/*" capture="camera" @change="fileChange"/>
+      <input v-show="false" ref="upload"  type='file' accept="image/*"  capture="camera" @change="fileChange" @click="useCamera(1)"/>
+      <!--      <input v-show="false" ref="upload"  type='file' accept="image/*" capture="camera" @change="fileChange"/>-->
     </van-popup>
   </div>
 </template>
@@ -34,9 +37,10 @@
 <script>
 import SelectCell from "@/components/selectCell";
 import {baseImg} from "@/views/menu/LZRegister/api";
-import {upload} from "@/api/public";
+import {upload, uploadBase64} from "@/api/public";
 import ImageCompressor from "js-image-compressor";
 import config from "@/config";
+import {imgUrl} from "@/utils";
 export default {
   components:{SelectCell},
   data(){
@@ -53,8 +57,8 @@ export default {
       selectNFC:null,
       //自定义字段
       prop:{
-        label:'checkName',
-        value:'nfccdoe'
+        label:'nfcName',
+        value:'nfcCode'
       },
       //提交按钮
       showBtn:false,
@@ -62,6 +66,9 @@ export default {
       imageError:null
     }
   },
+  mounted() {
+
+  },
   watch:{
     visible(val){
       if(!this.visible){
@@ -69,24 +76,75 @@ export default {
       }
     }
   },
-  mounted(){
-    window.openNFCScanCallBack = this.openNFCScanCallBack;
-  },
   methods:{
-    openNFCScanCallBack(data){
-      alert(data)
-      if(!data) {
-        this.$toast('扫描失败');
-        return
+    openCameraCallBack(data){
+      let img =  JSON.parse(data);
+      this.content = data;
+      let params = {
+        extension:img.extension,
+        content:img.content,
+      }
+      this.$toast.loading({
+        duration: 0, // 持续展示 toast
+        forbidClick: true,
+        message: "上传中..."
+      });
+      uploadBase64(params).then(res=>{
+        this.$toast.clear();
+        /*上传成功*/
+        this.$toast.success('上传成功')
+        //上传成功后,将图片显示在页面上并禁用退出
+        this.nfcImage =  res.data.url;
+        this.showBottomBox = false;
+      }).catch((err) => {
+        /*上传失败*/
+        this.$toast.fail('上传失败')
+      });
+    },
+    isAndroidOrIos(){
+      const urls = navigator.userAgent;
+      let isAndroid = urls.indexOf('Android') > -1 || urls.indexOf('Linux') > -1;
+      let isIos = !!urls.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
+      if(isAndroid){
+        return 1;
+      }
+      if(isIos){
+        return 2;
+      }
+    },
+    useCamera(actionType){
+      window.openCameraCallBack = null;
+      window.openCameraCallBack = this.openCameraCallBack;
+      let parms = {};
+      if(actionType){
+        parms.actionType = actionType;
+      }
+      let system = this.isAndroidOrIos();
+      if(system === 1){
+        //android
+        // 判断当前环境是是否存在 js桥 'sap'
+        const hasSap = window.hasOwnProperty('sap');
+        if (hasSap) {
+          // 判断是否存在方法 ?preview
+          const fun = sap.hasOwnProperty('openCamera');
+          if (fun) {
+            sap.openCamera(JSON.stringify(parms));
+          }
+        }
+      }
+
+      if(system === 2){
+        //ios
+        // 判断 ios是否存在方法 preview
+        const preview = window.webkit.messageHandlers.hasOwnProperty('openCamera')
+        if (preview) {
+          window.webkit.messageHandlers.openCamera.postMessage(JSON.stringify(parms))
+        }
       }
-      let code = JSON.parse(data).content;
-      this.$emit('NFCCode',code);
-      this.$toast('扫描成功');
     },
     //nfc扫描
     nfcCheck(){
-      this.useNFC();
-
+      this.$emit('checkNFC');
     },
     onConfirm(){
       if(!this.selectNFC) return this.$toast('请选择NFC');
@@ -94,11 +152,11 @@ export default {
         nfcCode:this.selectNFC,
         url: this.nfcImage,
       }
+      alert(JSON.stringify(data));
       this.$emit('change',data);
       this.visible = false;
       this.clear();
     },
-    //切换nfc后可点击退出
     changeNFC(){
       this.showBtn = true;
     },
@@ -115,12 +173,13 @@ export default {
     show(list){
       this.visible = true;
       this.dataList = list;
+      //alert( JSON.stringify(this.dataList ))
     },
     //上传前
     async fileChange(e){
       let file = e.target.files[0];
       this.file = e.target.files[0].name;
-     // let fileName = e.target.files[0].name;
+      // let fileName = e.target.files[0].name;
       let imgFile = await this.imageCompress(file);
       let formData = new FormData();
       formData.append('file',imgFile);
@@ -132,8 +191,8 @@ export default {
     },
     //压缩图片
     imageCompress(file){
-       this.file = file.name;
-       return new Promise((resolve,reject)=>{
+      this.file = file.name;
+      return new Promise((resolve,reject)=>{
         new ImageCompressor({
           file,
           quality: 0.6,
@@ -203,7 +262,7 @@ export default {
 }
 .bottom-box{
   display: flex;
-  justify-content: space-around;//
+  justify-content: space-around;
   align-items: center;
   >div{
     display: flex;

+ 4 - 0
src/components/selectCell/index.vue

@@ -87,10 +87,12 @@ export default {
         return null;
       }
       let val;
+      console.log(this.label,'label1111');
       this.columns.forEach(v=> {
         if (v[this.prop.value] === this.value) {
           val = v;
           this.label = v[this.prop.label];
+          console.log(this.label,'label2222');
         }
       });
       return val;
@@ -101,8 +103,10 @@ export default {
       this.showPicker = false;
     },
     pickerConfirm(val){
+      console.log(val,'val')
       if(!val) return;
       this.label = val[this.prop.label];
+      console.log(this.label,'label')
       this.showPicker = false;
       this.$emit('change',val[this.prop.value])
     },

+ 25 - 11
src/views/menu/securityCheckRegister/detail.vue

@@ -38,8 +38,11 @@
                     <pre>{{ item.pointName }}</pre>
                   </template>
                   <template #right-icon>
+                    <span v-if="item.nfcList && item.nfcList.length">
+                        <span>{{ getNfcState(item.nfcList) }}</span>/<span >{{item.nfcList.length}}</span>
+                    </span>
                     <img
-                      v-if="enable && nfcState(item)"
+                      v-if="enable && item.nfcList && item.nfcList.length"
                       :src="require('../../../assets/svg/NFC.svg')"
                       class="nfc-icon"
                       @click="clickNFC(item.nfcList)"
@@ -123,7 +126,6 @@
     <!--    </van-image-preview>-->
 
     <!--  nfc弹窗  -->
-    <nfc-popup v-if="enable" ref="NfcPopup" @NFCCode="getCode" @change="changeNfcImg"></nfc-popup>
     <nfc-popup v-if="enable" ref="NfcPopup" @checkNFC="checkNFC" @change="changeNfcImg"></nfc-popup>
   </div>
 
@@ -136,7 +138,7 @@ import NavBar from '@/components/NavBar'
 import SelectCell from '@/components/selectCell'
 import DateCell from '@/components/dateCell'
 import Uploader from '@/components/upload/gxuploader'
-import NfcPopup from '@/components/nfcPopup/gxmore'
+import NfcPopup from '@/components/nfcPopup/more'
 import AddCheck from './addCheck'
 import { registerDetail, registerSubmit } from './api'
 import { imgUrl } from '@/utils'
@@ -190,12 +192,23 @@ export default {
     this.id = this.$route.query.id
     this.getData()
   },
-  destroyed(){
-    window.openCameraCallBack = null;
-    window.openNFCScanCallBack = null;
+  beforeDestroy() {
+    window.openCameraCallBack = null
+    window.openNFCScanCallBack = null
   },
   methods: {
+    getNfcState(arr){
+        arr = arr || [];
+        let num = 0;
+        arr.forEach(v=>{
+          if(v.status === 1){
+            num++
+          }
+        })
+        return num;
+    },
     checkNFC(){
+      window.openNFCScanCallBack = this.openNFCScanCallBack;
       this.useNFC();
       this.$toast.loading({
         duration: 0, // 持续展示 toast
@@ -222,12 +235,13 @@ export default {
       clearInterval(this.timer);
       let nfc = JSON.parse(nfcStr);
       let nfcCode =  nfc.content;
+      //alert(nfcCode)
       this.checkNfcFilter(nfcCode);
     },
     checkNfcFilter(nfcCode){
       let areaId = null;
       let checkOk =  false;
-      this.nfcs.forEach(v => {
+      this.NFCList.forEach(v => {
         if(v.nfcCode === nfcCode){
           areaId = v.areaId;
           this.switchArea(areaId);
@@ -439,16 +453,16 @@ export default {
     },
     //添加图片时的回调
     changeNfcImg(imgItem) {
-      console.log(imgItem, this.selectArea.nfclist, 'imgItem')
-      this.selectArea.nfclist.forEach(v => {
-        if (v.nfccdoe === imgItem.nfcCode) {
+      console.log(imgItem, this.NFCList, 'imgItem')
+      this.NFCList.forEach(v => {
+        if (v.nfcCode === imgItem.nfcCode) {
           v.img = imgItem.url
           v.status = 1
           v.scanMethod = 1
           this.nfcImage.push(v)
         }
       })
-      console.log(this.selectArea.nfclist, this.nfcImage, 'nfcObj')
+      console.log(this.NFCList, this.nfcImage, 'nfcObj')
     },
 
   }