1.考勤打卡功能完善 2.我要巡页面替换，功能完善，目前已实现可以查看巡逻路线和区域，可以相互切换，点击定位可以定位到当前位置，点击路线按钮可以定位到...

Administrator

2021-07-05 24b1c18aea4d88db84adaf90f5fa31a07a7f6eb4

 pages/clockSignIn/clockSignIn.vue

@@ -1,15 +1,6 @@
<template>
   <view class="content">
      <!-- 自定义顶部导航栏 -->
      <!-- <view class="uni-nav-bar-info" :fixed="true" :status-bar="true">
         <view class="uni-nav-bar-left" @click="goBack()">
            <image src="../../static/images/nav/back02.png" />
         </view>
         <view class="title" slot="default">考勤打卡</view>
         <view class="right">
            <view class="title-right">打卡记录</view>
         </view>
      </view> -->
      <u-navbar 
         :is-back="true" 
         title="考勤打卡" 
@@ -39,28 +30,41 @@
                     </view>
                  </view>
               </view>
               <view class="clock-position">
                  <image src="../../static/images/clock/position01.png"></image>
                  <view class="clock-position">您已进入考勤范围:&nbsp;万科中心</view>
               <view class="clock-position-info">
                  <view class="clock-position-box">
                     <view class="clock-position" v-if="isPositionThan==true">
                        <image src="../../static/images/clock/position01.png"/>
                        &nbsp;您已进入考勤范围:&nbsp;{{address}}</view>
                     <view class="clock-position" v-if="isPositionThan==false">
                        <image src="../../static/images/clock/position01.png"/>
                        &nbsp;不在考勤范围:&nbsp;{{address}}</view>
                  </view>
               </view>
					
               <view class="down-time">下班时间:&nbsp;18:00</view>
            </view>
         </view>
      </view>
      <iframe id="geoPage" width=0 height=0 frameborder=0  style="display:none;" scrolling="no"
          src="https://apis.map.qq.com/tools/geolocation?key=T7RBZ-62U3X-RSQ4P-ZZVCB-WE7JT-HRBOG&referer=myapp">
      </iframe>
      <!-- <web-view :src="urls"></web-view> -->
   </view>
</template>

<script>
   import genator from '../../xcxMapJQ/js/geolocation.min.js'
   export default {
      data() {
         return {
            urls: '',
            nowTime:'',
            name:'',
            code:'',
            jd:'',
            wd:'',
            address:'',
            isPositionThan:false,
            background:{
               backgroundColor:"#0BB9C8"
            }
@@ -89,16 +93,61 @@
                type: 'wgs84',
               geocode:'true',
                success: function (res) {
                  // debugger;
                    console.log('当前位置：' + res);
                  //114.921652006005 25.8457176283118
                  // that.jd =  '114.921652006005';
                  // that.wd =  '25.8457176283118';
                  that.jd =  res.longitude;
                  that.wd =  res.latitude;
                  //通过经纬度换算详细地址
                  that.getAddress();
                  //位置比对
                  that.positionThan();
                }
            });
         },
         //返回上一页
         goBack() {
            uni.navigateBack({})
         },
         //通过经纬度换算详细地址
         getAddress(){
            var that = this;
            uni.request({
               url: `https://fmap.sf-express.com/rgeo/api`,
               method: "GET",
               data:{
                  x: that.jd,
                  y: that.wd,
                  ak: '1986afc8a5744263971b7f2482253dfc'
               },
               header:{
                  'Content-type':'application/x-www-form-urlencoded'
               },
               success(res) {
                  that.address = res.data.result.pois[0].name
               }
            })
         },
         //比对考勤位置
         positionThan(){
            var that = this;
            uni.request({
               url: this.$store.state.piAPI + `/attendance/positionThan`,
               method: "GET",
               data:{
                  number: this.code,
                  jd: this.jd,
                  wd: this.wd
               },
               header:{
                  'Content-type':'application/x-www-form-urlencoded'
               },
               success(resdata) {
                  //不在考勤范围内
                  resdata.data.data==true?that.isPositionThan = true:that.isPositionThan = false;
               }
            })
         },
         
         //获取个人信息
@@ -110,6 +159,7 @@
               method:'POST',
               success(resdata) {
                  that.name = resdata.data.data.realName;
                  that.code = resdata.data.data.code;
               }
            })
         },
@@ -121,12 +171,15 @@
                url: this.$store.state.piAPI + `/attendance/AppSave`,
               method: "POST",
               data:{
                   number: this.$store.state.puserID,
                   number: this.code,
                   name: this.name,
                   clockTime: this.getNowTime(1),
                   jd: this.jd,
                   wd: this.wd,
                   address: this.address
               },
               header:{
                  'Content-type':'application/x-www-form-urlencoded'
               },
               success(resdata) {
                  //不在考勤范围内
@@ -176,10 +229,10 @@
             }
             var nowstr = null;
             if (type == 1) {
                 nowstr = year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;
                 nowstr = year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;
             }
             if (type == 2) {
                 nowstr = year + "年" + month + "月" + date + "日  " + hour + ":" + minute + ":" + second;
                 nowstr = year + "年" + month + "月" + date + "日 " + hour + ":" + minute + ":" + second;
             }
            if (type == 3) {
                nowstr = hour + ":" + minute + ":" + second;
@@ -252,7 +305,7 @@
            justify-items: center;
            
            image {
               // background-color: #00BFFF;
               background-color: #00BFFF;
               width: 1.6rem;
               height: 1.6rem;
            }
@@ -374,19 +427,36 @@
                     }
                  }
               }
					
               .clock-position-info{
                  width: 100%;
                  display: flex;
                  // align-items: center;
                  // justify-content: center;
                  text-align: center;
               }
					
               .clock-position-box {
                  width: 100%;
                  display: flex;
                  justify-content: center;
                  font-size: 0.8rem;
               }
            
               .clock-position{
                  width: 100%;
                  height: 2rem;
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  // float: left;
                  // display: flex;
                  // align-items: center;
                  // justify-content: center;
                  
                  image{
                     width: 2rem;
                     height: 1.5rem;
                     margin-left: 2rem;
                     width: 1.5rem;
                     height: 1.2rem;
                     float: left;
                     // margin-left: 2rem;
                  }
						
               }