Browse Source

Merge branch 'master' of http://118.195.146.34:3000/ygtx/ygoa_miniapp

wangpx 1 year ago
parent
commit
97ab239ce3
4 changed files with 146 additions and 131 deletions
  1. 1 1
      components/ygoa/messageList.vue
  2. 2 2
      pages/message/index.vue
  3. 110 67
      pages/mine/checkIn/checkIn.vue
  4. 33 61
      pages/mine/clockIn/clockIn.vue

+ 1 - 1
components/ygoa/messageList.vue

@@ -5,7 +5,7 @@
 				<template v-slot:title>
 					<uni-section :title="title" type="line" titleFontSize="1.3rem">
 						<template v-slot:right>
-							<uni-badge :text="unReadNum" style="margin-left: -10px;" v-if="unReadNum!==undefined&&unReadNum>0"></uni-badge>
+							<uni-badge :text="unReadNum" style="margin-right: 6rem;" v-if="unReadNum!==undefined&&unReadNum>0"></uni-badge>
 							<button @click.stop="clickReadButton" class="read_button" v-if="unReadNum!==undefined" :disabled="unReadNum===0?true:false">一键阅读</button>
 						</template>
 					</uni-section>

+ 2 - 2
pages/message/index.vue

@@ -7,7 +7,7 @@
 				<template v-slot:title>
 					<uni-section title="待办" type="line" titleFontSize="1.3rem">
 						<template v-slot:right>
-							<uni-badge :text="unProcessNum" style="margin-left: -10px;"
+							<uni-badge :text="unProcessNum"
 								v-if="unProcessNum > 0"></uni-badge>
 						</template>
 					</uni-section>
@@ -311,7 +311,7 @@ function setAllMsgRead() {
 }
 
 ::v-deep .uni-section-header__content {
-	max-width: 3rem;
+	// max-width: 3rem;
 }
 
 .toClockInBtn {

+ 110 - 67
pages/mine/checkIn/checkIn.vue

@@ -11,7 +11,8 @@
 		</view>
 
 		<!-- 今日签到信息区域 -->
-		<view class="todayCheckIn" :class="{ 'show': shouldShow }">
+		<!-- <view class="todayCheckIn" :class="{ 'show': shouldShow }"> -->
+		<view class="todayCheckIn" v-if="todayInfoShow">
 			<view class="check-in-container">
 				<text class="todayAttTitle">今日签到信息</text>
 				<view class="info-row">
@@ -39,6 +40,7 @@
 				</view>
 
 			</view>
+			<!-- 分界线 -->
 			<view class="divider"></view>
 
 			<!-- 打卡记录 -->
@@ -46,7 +48,6 @@
 				<view class="header">
 					<text class="clockRecordTitle">打卡记录</text>
 				</view>
-
 				<view class="content" style="height: 41vh;">
 					<z-paging :fixed="false" :default-page-size="pSize" default-page-no="1" @query="queryData"
 						ref="paging">
@@ -64,14 +65,23 @@
 							</view>
 						</view>
 					</z-paging>
-
 				</view>
 			</view>
+			
+			<!-- 日历板块 -->
+			<!-- <template>
+				<view class="calendar-content" >
+					<view>
+						<uni-calendar class="uni-calendar--hook" :selected="selected" :showMonth="true" @change="change"
+							@monthSwitch="monthSwitch" />
+					</view>
+				</view>
+			</template> -->		
 		</view>
 
 
 		<!-- 周,月数据统计区域 -->
-		<view class="statistics" :class="{ 'show': chartShow }">
+		<view class="statistics" v-if="chartShow">
 			<view class="statistic-card">
 				<view class="statistic-title">{{ selectedTimeRange }}考勤统计</view>
 				<view class="statistic-item">
@@ -113,9 +123,8 @@
 			</view>
 		</view>
 
-
 		<!-- 图表区域 -->
-		<view class="chart-container" :class="{ 'show': chartShow }">
+		<view class="chart-container" v-if="chartShow">
 			<view class="">
 				<text class="chart-title">考勤趋势图</text>
 				<view class="charts-box">
@@ -150,10 +159,52 @@
 		endTime: '', // 晚签到时间
 	})
 
-
+	//日历表数据
+	// const showCalendar = ref(true)
+	// const selected = ref([{
+	// 	date: getDate(new Date(), -3).fullDate,
+	// 	info: '打卡'
+	// },
+	// {
+	// 	date: getDate(new Date(), -2).fullDate,
+	// 	info: '签到',
+	// 	data: {
+	// 		custom: '自定义信息',
+	// 		name: '自定义消息头'
+	// 	}
+	// },
+	// {
+	// 	date: '2024-12-09',
+	// 	info: '已打卡'
+	// }
+	// ])
+
+
+	// function getDate(date, AddDayCount = 0) {
+	// 	if (!date) {
+	// 		date = new Date()
+	// 	}
+	// 	if (typeof date !== 'object') {
+	// 		date = date.replace(/-/g, '/')
+	// 	}
+	// 	const dd = new Date(date)
+
+	// 	dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期
+
+	// 	const y = dd.getFullYear()
+	// 	const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期,不足10补0
+	// 	const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号,不足10补0
+	// 	return {
+	// 		fullDate: y + '-' + m + '-' + d,
+	// 		year: y,
+	// 		month: m,
+	// 		date: d,
+	// 		day: dd.getDay()
+	// 	}
+	// }
 
 	// 控制今日签到信息和图表显示的状态
-	const shouldShow = ref(true) // 今日签到信息是否显示
+	const todayInfoShow = ref(true) // 今日签到信息是否显示
 	const chartShow = ref(false) // 图表是否显示
 
 	// 图表类型的响应式引用
@@ -270,7 +321,8 @@
 	const clockRecords = ref([])
 
 	const totalPage = ref(0)
-	//获取日考勤历史
+	
+	//获取日考勤历史(下拉刷新)
 	function getDayAttHistory() {
 		const params = {
 			type: 1, //不设时间区间
@@ -280,7 +332,7 @@
 			pSize: pSize.value,
 			p: 1
 		}
-		getMyQDQtAttendance(params).then(({returnParams}) => {
+		getMyQDQtAttendance(params).then(({ returnParams }) => {
 			totalPage.value = Math.ceil(returnParams.total / pSize.value)
 			const list = returnParams.list.map(item => {
 				return {
@@ -290,7 +342,7 @@
 				}
 			});
 			clockRecords.value = list;
-			
+
 			complete(clockRecords.value, returnParams.total, returnParams.current)
 		})
 	}
@@ -321,7 +373,7 @@
 			pSize: pSize,
 			p: pageNo
 		}
-		getMyQDQtAttendance(params).then(({returnParams}) => {
+		getMyQDQtAttendance(params).then(({ returnParams }) => {
 			const list = returnParams.list.map(item => {
 				return {
 					date: item.att_date.substring(0, 10),
@@ -331,10 +383,10 @@
 			});
 			// clockRecords.value.push(...list);
 			// complete(list,returnParams.total,pageNo)
-			if(pageNo<=totalPage.value){
+			if (pageNo <= totalPage.value) {
 				clockRecords.value.push(...list);
 			}
-			complete(list,returnParams.total,pageNo)
+			complete(list, returnParams.total, pageNo)
 
 		})
 	}
@@ -353,10 +405,10 @@
 			case '周':
 				chartsType.value = 'pie'; // 设置图表类型为饼图
 				fetchWeekAttData().then(message => {
-						console.log(message);
-						showWeekAndMonth();
-						updateChart(message);
-					})
+					console.log(message);
+					showWeekAndMonth();
+					updateChart(message);
+				})
 					.catch(error => {
 						console.error(error); // 如果失败,打印错误消息
 					});
@@ -364,10 +416,10 @@
 			case '月':
 				chartsType.value = 'column'; // 设置图表类型为柱状图
 				fetchMonthAttData().then(message => {
-						console.log('message', message);
-						showWeekAndMonth();
-						updateChart(message);
-					})
+					console.log('message', message);
+					showWeekAndMonth();
+					updateChart(message);
+				})
 					.catch(error => {
 						console.error(error); // 如果失败,打印错误消息
 					});
@@ -377,13 +429,13 @@
 
 	// 显示今日考勤数据
 	function showDay() {
-		shouldShow.value = true; // 显示今日签到信息
+		todayInfoShow.value = true; // 显示今日签到信息
 		chartShow.value = false; // 隐藏图表
 	}
 
 	// 显示周或者月考勤
 	function showWeekAndMonth() {
-		shouldShow.value = false; // 隐藏今日签到信息
+		todayInfoShow.value = false; // 隐藏今日签到信息
 		chartShow.value = true; // 显示图表
 	}
 
@@ -412,34 +464,34 @@
 				const mockData = {
 					series: [{
 						data: [{
-								"name": "出勤",
-								"value": myWeekAttData.type0,
-								"labelText": "出勤:" + myWeekAttData.type0 + "次"
-							},
-							{
-								"name": "外出",
-								"value": myWeekAttData.type1
-							},
-							{
-								"name": "公休",
-								"value": myWeekAttData.type2
-							},
-							{
-								"name": "未排班",
-								"value": myWeekAttData.type3,
-							},
-							{
-								"name": "迟到",
-								"value": myWeekAttData.type4
-							},
-							{
-								"name": "早退",
-								"value": myWeekAttData.type5
-							},
-							{
-								"name": "缺勤",
-								"value": myWeekAttData.type6
-							}
+							"name": "出勤",
+							"value": myWeekAttData.type0,
+							"labelText": "出勤:" + myWeekAttData.type0 + "次"
+						},
+						{
+							"name": "外出",
+							"value": myWeekAttData.type1
+						},
+						{
+							"name": "公休",
+							"value": myWeekAttData.type2
+						},
+						{
+							"name": "未排班",
+							"value": myWeekAttData.type3,
+						},
+						{
+							"name": "迟到",
+							"value": myWeekAttData.type4
+						},
+						{
+							"name": "早退",
+							"value": myWeekAttData.type5
+						},
+						{
+							"name": "缺勤",
+							"value": myWeekAttData.type6
+						}
 						]
 					}],
 
@@ -565,6 +617,10 @@
 	.attendance-page {
 		padding: 20px;
 		background-color: #f9f9f9;
+		.calendar-content{
+			margin: -20px;
+			margin-top: 20px;
+		}
 	}
 
 	.header {
@@ -594,7 +650,7 @@
 	}
 
 	.statistics {
-		display: flex;
+		// display: flex;
 		justify-content: center;
 	}
 
@@ -658,6 +714,7 @@
 	.todayCheckIn {
 		background-color: #ffffff;
 		padding: 20px;
+		margin: auto -20px;//抵消父级padding
 		box-sizing: border-box;
 		border-radius: 10px;
 		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
@@ -690,20 +747,6 @@
 	}
 
 
-	.todayCheckIn,
-	.chart-container,
-	.statistics {
-		/* 默认隐藏 */
-		display: none;
-	}
-
-	/* 当需要显示时,可以添加一个额外的类 */
-	.todayCheckIn.show,
-	.chart-container.show,
-	.statistics.show {
-		display: block;
-	}
-
 	.icon {
 		width: 50rpx;
 		height: 50rpx;

+ 33 - 61
pages/mine/clockIn/clockIn.vue

@@ -8,18 +8,18 @@
 		</view>
 		<!-- 打卡记录 -->
 		<view class="record">
-			<view class="record-item">
+			<view class="record-item" v-if="nowTime <= '12:00:00' || signName == '上班签到'">
 				<text class="ygoa-icon icon-goToWork"></text>
 				<text class="title">上班</text>
 				<text class="time">{{ signInTime || '未打卡' }}</text>
 				<text class="signStatus" v-if="!isSignInStatusDisabled">({{ signInStatusName }})</text>
 			</view>
-			<view class="record-item">
+			<view class="record-item" v-else-if="nowTime > '12:00:00' && signName == '下班签退'">
 				<text class="ygoa-icon icon-afterWork"></text>
 				<text class="title">下班</text>
 				<text class="time">{{ signOutTime || '未打卡' }}</text>
-				<text class="signStatus" v-if="!isSignOutStatusDisabled"
-					style="color: #e64340;">({{ signOutStatusName }})</text>
+				<text class="signStatus" v-if="!isSignOutStatusDisabled" style="color: #e64340;">({{ signOutStatusName
+					}})</text>
 			</view>
 			<view class="record-item" @click="getAddress">
 				<text class="ygoa-icon icon-location"></text>
@@ -28,7 +28,8 @@
 			</view>
 		</view>
 		<!-- 地图 -->
-		<atl-map :mapKey="config.mapKey" :mapType="mapType" :longitude="119.213036" :latitude="25.958812" :marker="marker" :polygons="polygons" :isPolygons="true">
+		<atl-map :mapKey="config.mapKey" :mapType="mapType" :longitude="119.213036" :latitude="25.958812"
+			:marker="marker" :polygons="polygons" :isPolygons="true">
 			<template v-slot:content>
 			</template>
 		</atl-map>
@@ -44,29 +45,15 @@
 
 
 <script setup lang="ts">
-import {
-	onBeforeUnmount,
-	onMounted,
-	reactive,
-	ref
-} from 'vue';
+import {onBeforeUnmount,onMounted,reactive,ref} from 'vue';
 // 导入地理位置相关函数
 import booleanPointInPolygon from "@turf/boolean-point-in-polygon";
-import {
-	point,
-	polygon
-} from "@turf/helpers";
-import {
-	useUserStore
-} from '@/store/user';
+import {point,polygon} from "@turf/helpers";
+import {useUserStore} from '@/store/user';
 import $modal from '@/plugins/modal.js'
 import $tab from '@/plugins/tab.js';
 import config from '@/config.js';
-import {
-	createAttendance,
-	tranAddress,
-	checkAttendance
-} from '@/api/mine.js'
+import {createAttendance,tranAddress,checkAttendance} from '@/api/mine.js'
 const userStore = useUserStore();
 const thisUser = userStore.user;
 const intervalId = ref(null); // 定时器ID
@@ -98,7 +85,6 @@ function showNowTime() {
 	intervalId.value = setInterval(() => {
 		nowTime.value = getNowTime()
 	}, 1000); // 每1秒更新一次
-
 }
 // 当前日期和时间相关信息
 const currentDate = ref('2023-04-01');
@@ -184,8 +170,7 @@ function signInOrOut() {
 	}
 }
 
-
-
+//上班签到
 function signIn() {
 	const now = getNowTime();
 	//判断打卡时间是否符合
@@ -205,7 +190,6 @@ function signOut() {
 	const now = getNowTime();
 	const signOut = 2;
 	//判断打卡时间是否符合
-	console.log('now', now);
 	if (!isTimeInRange(now, ...config.signOutTimeRange)) {
 		$modal.confirm('当前非正常签退时间,是否继续?').then(res => {
 			if (res) {
@@ -333,13 +317,6 @@ function fetchLocation(resolve, reject) {
 
 // 获取当前位置地址
 function getAddress() {
-	// getlocation()
-	// 	.then(() => {
-	// 		tranLocationToAddress(); // 执行地址转换
-	// 	})
-	// 	.catch(err => {
-	// 		console.error('获取地址失败', err);
-	// 	});
 	return new Promise((resolve, reject) => {
 		getlocation()
 			.then(res => {
@@ -353,17 +330,16 @@ function getAddress() {
 	});
 }
 
-	// 经纬度转地址
-	function tranLocationToAddress() {
-		let locationStr = latitude.value + ',' + longitude.value; // 组合经纬度
-		tranAddress(locationStr).then(res => {
-				// console.log('地址转换请求成功', res);
-				address.value = res.result.address; // 保存地址
-			})
-			.catch(err => {
-				console.log('地址转换请求失败', err); // 请求错误处理
-			})
-	}
+// 经纬度转地址
+function tranLocationToAddress() {
+	let locationStr = latitude.value + ',' + longitude.value; // 组合经纬度
+	tranAddress(locationStr).then(res => {
+		address.value = res.result.address; // 保存地址
+	})
+		.catch(err => {
+			console.log('地址转换请求失败', err); // 请求错误处理
+		})
+}
 
 
 // 多边形区域设置
@@ -417,20 +393,20 @@ function clockIn(attType) {
 		unitId: thisUser.unitId
 	};
 	createAttendance(params).then(res => {
-		// console.log('createAttendance',res);
 		if ("success" == res.returnMsg) {
 			uni.showToast({
 				title: "打卡成功",
 				icon: 'none'
 			});
 			getTodayAtt(); //更新今日考勤数据
-			return true;
+			$tab.navigateTo('/pages/mine/checkIn/checkIn')
+			// return true;
 		} else {
 			uni.showToast({
 				title: "未在指定范围,打卡失败",
 				icon: 'none'
 			});
-			return false;
+			// return false;
 		}
 	})
 	// const _polygons = polygons.map((polygon) => {
@@ -454,16 +430,12 @@ function isClockIn(attType) {
 		case 2:
 			break;
 	}
-	console.log('attTypeData', attTypeData);
 	if ('' !== attTypeData) {
-		uni.showToast({
-			title: "请勿重复打卡",
-			icon: 'none'
-		});
+		$modal.showToast('请勿重复打卡')
 		return true;
 	}
-		return false;
-	}
+	return false;
+}
 </script>
 
 <style>
@@ -545,18 +517,18 @@ function isClockIn(attType) {
 }
 
 .map {
-	width: 100%;
-	height: 500rpx;
 	margin-top: 20rpx;
+	height: 56vh !important;
 }
 
 .footer {
 	width: 100%;
 	margin-top: 20rpx;
 	display: flex;
-	justify-content: space-around;	}
+	justify-content: space-around;
+}
 
-	.footer button {
-		width: 100%;
-	}
+.footer button {
+	width: 100%;
+}
 </style>