倍思云接口对接完成

src/components/officialAccount/index.vue

@@ -2,10 +2,10 @@
     <div class="officialAccount">
         <div class="officialAccount-contain">
             <div class="officialAccount-contain-top">
-                <img src="@/assets/images/gzh.png" style="width:30rem"/>
+                <img src="@/assets/images/xcx.jpg" style="width:30rem"/>
             </div>
             <div class="officialAccount-contain-middle" @click="returnPage">
-                <span>为访客预约成功后能成功接收通知，请首次访客预约用户关注“XXXX”小程序，进行手机号授权，已关注用户可直接点击“下一步”。</span>
+                <span>为访客预约成功后能成功接收通知，请首次访客预约用户关注“共进科技大厦”小程序，进行手机号授权，已关注用户可直接点击“下一步”。</span>
             </div>
             <div class="officialAccount-contain-bottom" @click="next">
                 <el-button type="primary" style="width: 100%" size="large">

src/utils/request.js

@@ -66,8 +66,12 @@ service.interceptors.response.use(res => {
         const code = res.data.code;
         if (code == 200) {
             return  res.data
-        } else { //系统监控=>定时任务
-            return res.data.msg
+        } else { 
+            ElMessage({
+                message: res.data.msg,
+                type: 'error',
+                duration: 5 * 1000
+            })
         }
     },
     error => {

src/views/fillIn.vue

@@ -8,7 +8,7 @@
         ref="formRef"
         :model="form"
         :rules="rules"
-        label-width="15rem"
+        label-width="14.3rem"
         class="fillIn-contain-form"
         style="padding-right:30px;"
       >
@@ -22,7 +22,7 @@
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="被访人手机号码" prop="targetPeoplePhone">
+            <el-form-item label="被访人手机号码" :rules="rules.targetPeoplePhone">
               <el-input
                 placeholder="请输入被访人手机号码"
                 v-model="form.targetPeoplePhone"
@@ -129,9 +129,19 @@
         style="width: 20%; margin: 2rem 40% 0"
         size="large"
         @click="submitForm()"
+        v-if="loading"
       >
         <span>提 交</span>
       </el-button>
+      <el-button
+        type="primary"
+        style="width: 20%; margin: 2rem 40% 0"
+        size="large"
+        v-if="!loading"
+        disabled
+      >
+        <span v-if="!loading">提 交 中...</span>
+      </el-button>
     </div>
   </div>
   <layout :data="{ logoLeft: '2.1%', returnState: true }" />
@@ -154,15 +164,15 @@ import {  addVisitor } from "@/api/index";
 /*----------------------------------公共变量-----------------------------------*/
 const router = useRouter();
 const { proxy } = getCurrentInstance();
-
+const loading = ref(true); //loading状态
 /*----------------------------------变量声明-----------------------------------*/
 const formRef = ref(null); //refs
 const departData = ref(); //组织列表
 const phoneArray = ref([]); //人员电话号码合集
 const data = reactive({
   form: {
-    targetPeoplePhone:"13127578888",//被访人手机号
-    targetPeopleName:"金工",//被访人姓名 .
+    targetPeoplePhone:"13476084271",//被访人手机号
+    targetPeopleName:"阮升",//被访人姓名 .
     visitorReasonCode:"business_talks",//来访事由编码 .
     visitorReasonInfo:"business_talks",//来访事由 .
     visitorNumber:"3",//来访人数 .
@@ -170,10 +180,10 @@ const data = reactive({
     endTime:"", //结束时间 .
     visitorPersonList:[
       {
-        peopleName:"王工",//访客姓名 .
-        peoplePhone:"13127578866",//访客手机号 .
+        peopleName:"王涛",//访客姓名 .
+        peoplePhone:"13127578837",//访客手机号 .
         sex:"",//访客性别 .
-        cardId:"341282199208123456",//证件号 .
+        cardId:"341282199204020157",//证件号 .
         cardType:"2",//证件类型 .
         plates:"2",//车牌号 .
         callerCorpName:"永天",//来访单位 .
@@ -222,6 +232,19 @@ const data = reactive({
     cardId: [
       { required: true, message: "请输入访客身份证号码", trigger: "blur" },
     ],
+    targetPeoplePhone:proxy.regex.CheckMobile(
+      { required: true, message: "被访人手机号码不能为空" },
+      {
+        trigger: "blur",
+        validator: (rule, value, callback) =>
+          proxy.regex.equalToMobile(
+            rule,
+            phoneArray.value,
+            callback,
+            form.value.intervieweeMobile
+          ),
+      }
+    ),
     mobilePhone:proxy.regex.CheckMobile(
       { required: true, message: "访客手机号码不能为空" },
       {
@@ -291,23 +314,26 @@ function submitForm() {
       // .post(
       //   "http://218.4.219.62:8083/visitor/record",form.value
       // ).then((response) => {})
+      loading.value = false;
       let a = JSON.stringify(form.value)
-console.log(a)
-      addVisitor(a).then((requset) => {
-        // if (requset.success == true) {
-        //   ElMessage({
-        //     message: "访客预约申请成功,请稍后查看微信小程序推送信息",
-        //     type: "success",
-        //   });
-        //   setTimeout(function () {
-        //     formRef.value.resetFields(); //重置from校验
-        //     dateRange.value = [];
-        //     router.push({ path: "/" });
-        //   }, 5000);
-        // } else {
-        //   ElMessage.error(requset.msg);
-        // }
-      });
+      // addVisitor(a).then((requset) => {
+      //   loading.value = true;
+      //   if (requset.code == 200) {
+      //     ElMessage({
+      //       message: "访客预约申请成功,请稍后查看微信小程序推送信息",
+      //       type: "success",
+      //     });
+      //     setTimeout(function () {
+      //       formRef.value.resetFields(); //重置from校验
+      //       dateRange.value = [];
+      //       router.push({ path: "/" });
+      //     }, 2000);
+      //   } else {
+      //     ElMessage.error(requset.msg);
+      //   }
+      // }).catch((error) => {
+      //   loading.value = true;
+      // })
     }
   });
 }

src/views/validate.vue

@@ -13,25 +13,28 @@
         <image style="width: 130px; height: 130px" src="@/assets/images/idcard.png"  v-if="!cardId" />
         <div class="VisitorsRecord" >
           <p v-if="visitorsRecord == '查询数据为空' && visitorsRecordState"> 暂无访客记录 </p>
-          <!-- <div class="list" v-if="visitorsRecord.length>0">
-            <div class="item" v-for="(item,index) in visitorsRecord" :key="index" @click="handle('select',item)" :class="item.targetPeopleCode == active ? 'active' : ''">
+          <div class="list" v-if="visitorsRecord != '查询数据为空' && visitorsRecord.length>0 && cardId ">
+            <div class="item" v-for="(item,index) in visitorsRecord" :key="index" @click="handle('select',item)" :class="item.visitorPersonList[0].recordId == active ? 'active' : ''">
               <div>
-                <span class="p1">被访人姓名：</span><span class="p2">{{item.targetPeopleName}}</span>
+                <span class="p1">访客姓名：</span><span class="p2">{{item?.visitorPersonList[0].peopleName}}</span>
               </div>
               <div>
-                <span class="p1">被访人身份证号：</span><span class="p2">{{item.targetPeopleName}}</span>
+                <span class="p1">访客手机号：</span><span class="p2">{{item?.visitorPersonList[0].peoplePhone}}</span>
               </div>
               <div>
-                <span class="p1">被访人手机号：</span><span class="p2">{{item.targetPeopleName}}</span>
+                <span class="p1">被访人姓名：</span><span class="p2">{{item?.targetPeopleName}}</span>
               </div>
               <div>
-                <span class="p1">来访事由：</span><span class="p2">{{item.targetPeopleName}}</span>
+                <span class="p1">被访人手机号：</span><span class="p2">{{item?.targetPeoplePhone}}</span>
               </div>
               <div>
-                <span class="p1">来访时间：</span><span class="p2">{{item.targetPeopleName}}</span>
+                <span class="p1">来访事由：</span><span class="p2">{{item?.visitorReasonInfo}}</span>
+              </div>
+              <div>
+                <span class="p1">来访时间：</span><span class="p2">{{item?.startTime?.slice(5,20)}} ~ {{item?.endTime?.slice(5,20)}}</span>
               </div>
             </div>
-          </div> -->
+          </div>
         </div>  
         <el-button type="primary" @click="handle('signIn')" class="validate-contain-search-button" size="large" v-if="active" style="width:30%;margin:10% 35% 0;"> 签 到 </el-button>
       </div>
@@ -43,57 +46,21 @@
 /*----------------------------------依赖引入-----------------------------------*/
 import axios from "axios";
 import { ref } from "vue";
+import dayjs from 'dayjs'
 import { getVisitor, signinoutVisitor } from "@/api/index";
-import 'animate.css';
+import { ElMessage } from "element-plus";
+import { useRouter } from "vue-router";
 /*----------------------------------组件引入-----------------------------------*/
 import layout from "@/components/layout/index.vue";
+import 'animate.css';
 /*----------------------------------变量声明-----------------------------------*/
 const timer = ref(null);
-const cardId = ref('341282199208123456');//身份证号码
+const cardId = ref('341282199204020157');//身份证号码
 const active = ref(null); //当前选中的访客记录
 const visitorsRecordState = ref(false);//访客记录状态
-const visitorsRecord = ref([
-  {
-    targetPeoplePhone:"1111",
-    targetPeopleName:"2222",
-    visitorReason:"2222",
-    startTime:"2222",
-    endTime:"2222",
-    targetPeopleCode:1,
-  },
-  {
-    targetPeoplePhone:"1111",
-    targetPeopleName:"2222",
-    visitorReason:"2222",
-    startTime:"2222",
-    endTime:"2222",
-    targetPeopleCode:2,
-  },
-  {
-    targetPeoplePhone:"1111",
-    targetPeopleName:"2222",
-    visitorReason:"2222",
-    startTime:"2222",
-    endTime:"2222",
-    targetPeopleCode:3,
-  },
-  {
-    targetPeoplePhone:"1111",
-    targetPeopleName:"2222",
-    visitorReason:"2222",
-    startTime:"2222",
-    endTime:"2222",
-    targetPeopleCode:4,
-  },
-  {
-    targetPeoplePhone:"1111",
-    targetPeopleName:"2222",
-    visitorReason:"2222",
-    startTime:"2222",
-    endTime:"2222",
-    targetPeopleCode:5,
-  },
-]);
+const visitorsRecord = ref([]);
+const time = dayjs().startOf("day").format("YYYY-MM-DD HH:mm:ss")
+const router = useRouter();
 /*----------------------------------方法声明-----------------------------------*/
 /**
  * 公众号引导状态切换
@@ -114,17 +81,40 @@ function handle(type,item) {
   if(type === 'get'){ //获取访客记录
     getVisitor(JSON.stringify({cardId:cardId.value})).then((response) => {
       visitorsRecordState.value = true
-      visitorsRecord.value = response.data
-      console.log(visitorsRecord.value)
+      active.value = null
+      if(typeof(response.data) == 'object'){
+        visitorsRecord.value = []
+        for(let i=0;i<response.data.length;i++){
+          if(response.data[i]?.startTime?.slice(0,10) == time.slice(0,10)){
+            visitorsRecord.value.push(response.data[i])
+          }
+        }
+        if(visitorsRecord.value.length == 1){
+          active.value = visitorsRecord.value[0].visitorPersonList[0].recordId;
+        }
+      }else{
+        visitorsRecord.value = response.data
+      }
     }).catch((error) => {
       visitorsRecordState.value = true
     })
   }
   if(type ==='select'){ //选择访客记录
-    active.value = item.targetPeopleCode;
+    active.value = item.visitorPersonList[0].recordId;
   }
   if(type ==='signIn'){
-    signinoutVisitor({recordId:active.value})
+    signinoutVisitor({recordId:active.value,signInOutState:"in"}).then((response) => {
+      console.log(response)
+      if(response.code == 200){
+        ElMessage({
+          message: "线下签到成功,请留意'共进科技大厦'小程序推送的通行二维码",
+          type: "success",
+        });
+        setTimeout(function () {
+          router.push({ path: "/" });
+        }, 2000);
+      }
+    })
   }
 }
 onMounted(() => {
@@ -201,6 +191,7 @@ onUnmounted(() => {
       background: rgba(255,255,255,.8);
       border-radius: 10px;
       margin:1% 0 0 1%;
+      cursor: pointer;
       span{
         margin-top:10px;
       }