auto commit

common/apiurl.js

@@ -19,6 +19,11 @@ const apiurl = {
 	//收费员密码修改
 	modifyPwdUrl:'/payee/payeeinfo/modifyPwd',
 	
+	//收费员打卡路段信息
+	punchInfoUrl:'/payee/payeeinfo/punchInfo/',
+	//收费员打卡签到
+	punchInUrl:'/payee/payeeinfo/punchIn',
+	
 	//设备注册
 	deviceReg: '/device/pda/accept'
 

common/http.api.js

@@ -23,6 +23,10 @@ const install = (Vue, vm) => {
 	
 	let deviceReg = (params = {}) => vm.$u.post(apiurl.deviceReg, params);
 	
+	let punchInfo = (params = {}) => vm.$u.get(apiurl.punchInfoUrl+params.roadNo);
+	
+	let punchIn = (params = {}) => vm.$u.post(apiurl.punchInUrl, params);	
+	
 	// 将各个定义的接口名称，统一放进对象挂载到vm.$u.api(因为vm就是this，也即this.$u.api)下
 	vm.$u.api = {
 		login,
@@ -33,7 +37,9 @@ const install = (Vue, vm) => {
 		baiduOcr,
 		entranceOutDetail,
 		modifyPwd,
-		deviceReg
+		deviceReg,
+		punchInfo,
+		punchIn
 	};
 }
 

manifest.json

@@ -122,6 +122,13 @@
         "template" : "template.h5.html",
         "router" : {
             "mode" : "hash"
+        },
+        "sdkConfigs" : {
+            "maps" : {
+                "qqmap" : {
+                    "key" : "BOGBZ-2BZ33-O4L32-Y3QJR-PGN66-RFFEL"
+                }
+            }
         }
     }
 }

pages/attence/attence.scss

@@ -120,4 +120,27 @@ page{
 			}
 		}
 	}
+}
+
+.bottom{
+	position: fixed;
+	left: 0;
+	right: 0;
+	bottom: 76rpx;
+}
+
+.remark{
+	.submit-btn{
+		position: absolute;
+		right: 40rpx;
+		top:40rpx;
+	}
+	.content{
+		padding: 40rpx;
+	}
+	.remark-tip{
+		margin-top: 24rpx;
+		font-size: 26rpx;
+		color: #333;
+	}
 }

pages/attence/attence.vue

@@ -13,47 +13,53 @@
 			<view class="payeeinfo u-flex">
 				<u-image src="../../static/img/default-portrait.png" width="87" height="87"></u-image>
 				<view class="payeeinfo-text">
-					<view class="name">智慧停车</view>
-					<view class="id">工号：20132311</view>
+					<view class="name">{{payeeinfo.payeeName||'智慧停车'}}</view>
+					<view class="id">工号：{{payeeinfo.payeeNo}}</view>
 				</view>
 			</view>
 			<view class="attence-block">
 				<view class="today-attence u-flex">
 					<view class="today-attence-item">
-						<view class="work-time">上班：09:00</view>
-						<view class="my-time">
+						<view class="work-time">上班：{{payeeinfo.workStartTime?payeeinfo.workStartTime.slice(11):''}}</view>
+						<view class="my-time" v-if="payeeinfo.isPunchIn">
 							<u-icon name="checkmark-circle-fill" color="#2979ff" size="28"></u-icon>
-							08:55已打卡
+							{{payeeinfo.punchInTime?payeeinfo.punchInTime.slice(11):''}}已打卡
 						</view>
+						<view class="my-time" v-else>未打卡</view>
 					</view>
 					<view class="today-attence-item">
-						<view class="work-time">下班：20:00</view>
-						<view class="my-time">
+						<view class="work-time">下班：{{payeeinfo.workEndTime?payeeinfo.workEndTime.slice(11):''}}</view>
+						<view class="my-time" v-if="payeeinfo.isPunchOut">
 							<u-icon name="checkmark-circle-fill" color="#2979ff" size="28"></u-icon>
-							08:55已打卡
+							{{payeeinfo.punchOutTime?payeeinfo.punchOutTime.slice(11):''}}已打卡
 						</view>
+						<view class="my-time" v-else>未打卡</view>
 					</view>
 				</view>
-				<view class="attence-button u-flex u-flex-wrap">
-					<view class="attence-button-type">下班打卡</view>
-					<view class="attence-button-time">17:20:32</view>
+				<view class="attence-button u-flex u-flex-wrap" @click="handlePunchIn">
+					<view class="attence-button-type">{{workType|filterWorkType}}打卡</view>
+					<view class="attence-button-time">{{ $u.timeFormat(currentTime, 'hh:MM:ss') }}</view>
 				</view>
-				<view class="position-tip">
+				<view class="position-tip" v-if="!outPosition">
 					<u-icon name="checkmark-circle-fill" color="#21CF3D" size="28"></u-icon>
-					您已进入考勤范围：甜蜜小镇D18组团
+					您已进入考勤范围：{{payeeinfo.roadName}}
+				</view>
+				<view class="position-tip" v-else>
+					<u-icon name="checkmark-circle-fill" color="#da0808" size="28"></u-icon>
+					您已超出考勤范围：{{payeeinfo.roadName}}
 				</view>
 				<view class="statistics u-flex">
 					<view class="statistics-item">
 						<view class="statistics-item-til">本月已打卡</view>
 						<view class="statistics-item-con">
-							<span class="number">5</span>
+							<span class="number">{{payeeinfo.punched}}</span>
 							天
 						</view>
 					</view>
 					<view class="statistics-item">
 						<view class="statistics-item-til">月目标打卡</view>
 						<view class="statistics-item-con">
-							<span class="number">23</span>
+							<span class="number">{{payeeinfo.punchTotal}}</span>
 							天
 						</view>
 					</view>
@@ -66,6 +72,19 @@
 				城市智慧停车 版权所有
 			</view>
 		</u-bottom>
+		
+		<u-popup class="remark" v-model="remarkPopupShow" @close="remarkClose" mode="bottom">
+			<u-button class="submit-btn" type="primary" size="mini" @click="getPunchIn">打卡</u-button>
+			<view class="content">
+				<u-form-item 
+					label="备注" 
+					:label-style="{fontSize:'36rpx'}"
+					label-position="top">
+					<u-input v-model="remark" type="textarea" />
+				</u-form-item>
+				<view class="remark-tip" v-if="remarkTip">{{remarkTip}}</view>
+			</view>
+		</u-popup>
 		<u-toast ref="uToast" />
 	</view>
 </template>
@@ -74,20 +93,186 @@
 	export default{
 		data(){
 			return{
-				
+				roadNo:'',
+				payeeinfo:[],
+				theRoad:[],
+				currentTime: new Date().getTime(), // 获取当前时间
+				outPosition:true,//是否超出打卡范围
+				positionInfo:true,//是否线上位置关系信息
+				remarkPopupShow:false,//备注弹框
+				remarkTip:'',
+				remark:'',
+				workType:1,
 			}
 		},
 		onLoad(){
 			
+		},
+		onShow() {
+			let that = this;
+				
+			setInterval(function () {
+				that.currentTime = new Date().getTime()//修改数据让他可以实时更新
+			}, 1000);
+				
+			this.payeeinfo = this.$store.state.vuex_user;
+			this.roadNo = this.payeeinfo?.roadList?.[0]?.roadNo;
+			// console.log(' this.payeeinfo1', this.payeeinfo);
+			this.getPunchInfo(this.roadNo);
 		},
 		methods:{
+			getLocation(){
+				ALog.info({msg:'请求定位'})
+				let that = this;
+				uni.getLocation({
+					type:"gcj02",
+					success : function (res) {
+						console.log("定位返回信息:", res)
+						// alert(res.longitude + "," + res.latitude )
+						ALog.info({msg:res})
+						that.payeeinfo.longitude = res.longitude;
+						that.payeeinfo.latitude = res.latitude;
+						var dst = `${that.payeeinfo.longitude},${that.payeeinfo.latitude}`;
+						var src = res.latitude + ',' + res.longitude;
+						var locRet = location?.distance?.(src, dst);
+						// console.log('locRet',locRet);
+						ALog.info({msg:locRet.distance})
+						if(!locRet<=that.payeeinfo.workDistance){//在打卡范围内
+							that.outPosition = false;
+							console.log('that.workType',that.workType);
+							// debugger;
+							if(that.workType==1){
+								let workStartTime = new Date(that.payeeinfo.workStartTime.replace(/-/g,'/'));
+								if(that.currentTime<=workStartTime.getTime()){
+									
+								}else{//迟到
+									that.remarkTip = '您已迟到!';
+									that.remarkPopupShow = true;
+									return;
+								}
+								console.log('workStartTime',workStartTime.getTime())
+							}else if(that.workType==2){
+								if(that.payeeinfo.isPunchOut){
+									that.$refs.uToast.show({
+										title: '已经打过下班卡!',
+										type: 'error',
+									});
+									return;
+								};
+								let workEndTime = new Date(that.payeeinfo.workEndTime.replace(/-/g,'/'));
+								if(that.currentTime<=workEndTime.getTime()){//
+									that.remarkTip = '还未到下班时间,现在打卡将视为早退!';
+									that.remarkPopupShow = true;
+									return;
+								}
+								console.log('workEndTime',workEndTime.getTime())
+								
+							}
+							that.getPunchIn();
+						}else{//不在打卡范围内
+							that.outPosition = true;
+							// that.remarkPopupShow = true;
+							// console.table({locRet:locRet,workDistance:that.payeeinfo.workDistance,r:locRet<=that.payeeinfo.workDistance});
+							that.$refs.uToast.show({
+								title: '超出打卡范围!',
+								type: 'error',
+							});
+						};
+						
+						
+						
+						
+					},
+					fail: function(res){
+						console.log('getLocation err',res)					
+						ALog.info({msg:'请求错误',err:res})
+					}
+				})
+			},
+			handlePunchIn(){
+				this.getLocation();
+			},
+			remarkClose(){
+				this.remark = '';
+			},
+			getPunchIn(){
+				let that = this;
+				let param ={
+					latitude:that.payeeinfo.latitude,
+					longitude:that.payeeinfo.longitude,
+					remark:that.remark,
+					roadNo:that.payeeinfo.roadNo,
+					workType:that.workType
+				}
+				that.$u.api.punchIn(param)
+				.then(res=>{
+					this.$refs.uToast.show({
+						title: res.msg,
+						type: 'success',
+					});
+					this.remarkPopupShow = false;
+					
+					this.getPunchInfo(this.roadNo);
+					console.log('this.punchIn',res)
+				}).catch(err=>{
+					if(err.errMsg){
+						this.$refs.uToast.show({
+							title: '请检查网络',
+							type: 'error',
+						});
+						return false;
+					};
+					this.$refs.uToast.show({
+						title: err.msg,
+						type: 'error',
+					});
+					console.log('punchIn ',err)
+				});
+			},
 			customBack(){
 				this.$u.route({
 					// type:'switchTab',
 					url: 'pages/index/index'
 				});
 			},
+			getPunchInfo(roadNo){
+				this.$u.api.punchInfo({roadNo:roadNo})
+				.then(res=>{
+					// this.$refs.uToast.show({
+					// 	title: res.msg,
+					// 	type: 'success',
+					// });
+					this.payeeinfo ={...this.payeeinfo,...res.data};
+					
+					if(!res.data.isPunchIn){//还未打上班卡
+						this.workType = 1;
+					}
+					else{//已打上班卡
+						this.workType = 2;
+					}
+					
+					// console.log('this.payeeinfo',this.payeeinfo)
+				}).catch(err=>{
+					if(err.errMsg){
+						this.$refs.uToast.show({
+							title: '请检查网络',
+							type: 'error',
+						});
+						return false;
+					};
+					this.$refs.uToast.show({
+						title: err.msg,
+						type: 'error',
+					});
+					console.log('punchInfo ',err)
+				});
+			}
 			
+		},
+		filters:{
+			filterWorkType(WorkType){
+				return (WorkType==1)?'上班':'下班'
+			}
 		}
 	}
 </script>

pages/login/login.vue

@@ -69,8 +69,8 @@
 			// 	}
 			// },
 			handleLogin(){
-				this.form.deviceNo = '1122334455';
-				// this.form.deviceNo = device?.getDeviceInfo()?.deviceId;
+				// this.form.deviceNo = '1122334455';
+				this.form.deviceNo = device?.getDeviceInfo()?.deviceId;
 				this.$u.api.login(this.form)
 				.then(res=>{
 					this.$refs.uToast.show({