Pārlūkot izejas kodu

自定义日历组件移动

htc 1 mēnesi atpakaļ
vecāks
revīzija
812eff3533
2 mainītis faili ar 1 papildinājumiem un 196 dzēšanām
  1. 0 195
      components/CusCalendar/index.vue
  2. 1 1
      pagesStatistics/index.vue

+ 0 - 195
components/CusCalendar/index.vue

@@ -1,195 +0,0 @@
-<template>
-	<view class="box">
-		<div class="week">
-			<div class="w_pre" v-for="(pre,idx) in weekList" :key="idx">{{pre}}</div>
-		</div>
-		<div class="date">
-			<div class="d_pre" v-for="(pre,idx) in calendarList" :key="idx" @tap="selectDay(pre,idx)">
-				<div class="day" :class="{'dq':pre.iscurrentday,'select':pre.select,'wd':pre.isweekday}">{{pre.day}}</div>
-				<div class="status" :class="{'zc':pre.status===0,'yc':pre.status===1}" v-if="pre.status<2"></div>
-			</div>
-		</div>
-	</view>
-</template>
-
-<script>
-	export default {
-		data(){
-			return {
-				weekList:['一','二','三','四','五','六','日'],
-				year:new Date().getFullYear(),
-				month:new Date().getMonth()+1,
-				calendarList:[],
-				clockList:[]
-			}
-		},
-		// created() {
-		// 	this.getDataByMonth(this.year,this.month);
-		// },
-		methods:{
-			getDataByMonth(year,month){
-				const daysInMonth = new Date(year, month, 0).getDate();
-				let calendar = [];
-				for (let day = 1; day <= daysInMonth; day++) {
-					let date = new Date(year, month - 1, day); // 注意月份从0开始
-					let nyr = `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
-					calendar.push({
-					  nyr,
-					  year,
-					  month,
-					  day,
-					  week: date.getDay()||7,
-					  isweekday:(date.getDay()||7)<6,
-					  iscurrentday:nyr==new Date().Format('yyyy-MM-dd')
-					});
-				}
-				let qlist = this.insertDays(year,month,calendar);
-				let hlist = this.appendDays(year,month,calendar);
-				let list = qlist.concat(calendar).concat(hlist);
-				this.calendarList = JSON.parse(JSON.stringify(list));
-				this.calendarList.forEach((c,i)=>{
-					this.$set(this.calendarList[i],'select',false);
-					let t = this.clockList.find(l=>l.attendanceDate==c.nyr);
-					if(t&&c.month==month){
-						this.$set(this.calendarList[i],'status',t?.isLeave===0?0:1);
-						this.$set(this.calendarList[i],'id',t?.id);
-					} 
-					else this.$set(this.calendarList[i],'status',2);
-				})
-			},
-			insertDays(year,month,calendar){
-				let week = calendar[0].week;
-				if(week==1) return []
-				let qyear = month==1?(year-1):year;
-				let qmonth = month==1?12:month-1;
-				let daysInMonth = new Date(qyear, qmonth, 0).getDate();
-				let list = [];
-				for (let day = daysInMonth-week+2; day <= daysInMonth; day++) {
-					let date = new Date(qyear, qmonth - 1, day);
-					list.push({
-					  nyr: `${qyear}-${String(qmonth).padStart(2, '0')}-${String(day).padStart(2, '0')}`,
-					  year:qyear,
-					  month:qmonth,
-					  day,
-					  week: date.getDay()||7
-					});
-				}
-				return list
-			},
-			appendDays(year,month,calendar){
-				let week = calendar[calendar.length-1].week;
-				if(week==7) return []
-				let hyear = month==12?(year+1):year;
-				let hmonth = month==12?1:month+1;
-				let daysInMonth = new Date(hyear, hmonth, 0).getDate();
-				let list = [];
-				for (let day = 1; day <= 7-week; day++) {
-					let date = new Date(hyear, hmonth - 1, day);
-					list.push({
-					  nyr: `${hyear}-${String(hmonth).padStart(2, '0')}-${String(day).padStart(2, '0')}`,
-					  year:hyear,
-					  month:hmonth,
-					  day,
-					  week: date.getDay()||7
-					});
-				}
-				return list
-			},
-			async selectDay(pre,idx){
-				let info = {
-					iswd:pre.isweekday,
-					clockTimes:0,
-					workHours:0,
-					sbTime:'',
-					xbTime:'',
-					status:0
-				}
-				if(pre.id){
-					let res = await this.$api.get('/wms/outsourced/attendance/'+pre?.id||'');
-					if(res.data.code!==0) return this.$showToast(res.data.msg)
-					let d = res.data.data;
-					info.clockTimes = d.isLeave===0?2:((d.isLeave===1||d.isLeave===2)?1:0);
-					info.workHours = d.workingHours;
-					info.sbTime = (d.isLeave===0||d.isLeave===2)?d.checkInTime:'';
-					info.xbTime = (d.isLeave===0||d.isLeave===1)?d.clockOutTime:'';
-					info.status = 1;
-				}
-				this.$emit('selectInfo',info);
-				
-				if(pre?.month==this.month){
-					this.calendarList.forEach((c,i)=>{
-						this.$set(this.calendarList[i],'select',i===idx);
-					})
-				}else{
-					this.$emit('selectDay',pre);
-				}
-			}
-		}
-	}
-</script>
-
-<style scoped lang="less">
-	.box{
-		.week{
-			display: flex;
-			.w_pre{
-				width: calc(100% / 7);
-				font-family: PingFangSC, PingFang SC;
-				font-weight: 400;
-				font-size: 28rpx;
-				color: #9D9D9D;
-				line-height: 72rpx;
-				text-align: center;
-			}
-		}
-	
-		.date{
-			display: flex;
-			flex-wrap: wrap;
-			.d_pre{
-				width: calc(100% / 7);
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-				padding: 15rpx 0;
-				.day{
-					width: 64rpx;
-					height: 64rpx;
-					border-radius: 16rpx;
-					background: #FFFFFF;
-					font-family: PingFangSC, PingFang SC;
-					font-weight: 400;
-					font-size: 28rpx;
-					color: #9D9D9D;
-					line-height: 64rpx;
-					text-align: center;
-					&.wd{
-						color: #1D2129;
-					}
-					&.dq{
-						color: #2E69EB;
-						font-weight: bold;
-						background: rgba(46,105,235,0.1);
-					}
-					&.select{
-						color: #FFFFFF;
-						font-weight: bold;
-						background: #2E69EB;
-					}
-				}
-				.status{
-					width: 10rpx;
-					height: 10rpx;
-					border-radius: 50%;
-					margin-top: 5rpx;
-					&.zc{
-						background: #2E69EB;
-					}
-					&.yc{
-						background: #FEA400;
-					}
-				}
-			}
-		}
-	}
-</style>

+ 1 - 1
pagesStatistics/index.vue

@@ -58,7 +58,7 @@
 </template>
 
 <script>
-	import Calendar from '@/components/CusCalendar/index.vue'
+	import Calendar from './components/CusCalendar/index.vue'
 	import Tabbar from '@/components/CusTabbar/clock.vue'
 	export default {
 		components:{ Calendar,Tabbar },