日历渲染

This commit is contained in:
huichao
2020-07-24 21:22:48 +08:00
parent bb177051d6
commit 595b2a98eb
7 changed files with 101 additions and 45 deletions

View File

@@ -13,7 +13,7 @@ export default [
}
},
{
path: '/attendance/Monthly',
path: '/attendance/Monthly/:obj',
name: 'Monthly',
component: monthly,
meta: {

View File

@@ -26,7 +26,7 @@ export default [
name: 'AttendanceInfo',
component: attendanceInfo,
meta: {
title: '考勤统计',
title: '业绩查询',
index: 3
}
},
@@ -35,7 +35,7 @@ export default [
name: 'PerformanceList',
component: PerformanceList,
meta: {
title: '考勤统计',
title: '业绩查询',
index: 3
}
}

View File

@@ -28,8 +28,8 @@
<div class="mt10 bg-white">
<div class="flex h70 align-items-c border-gb">
<img src="@/assets/images/u1203.png" alt class="h40 w40 ml15" />
<span class="ml10 fs14">王昭君</span>
<div class="absolute right20 flex" @click="month">
<span class="ml10 fs14">{{name}}</span>
<div class="absolute right20 flex" @click="month(obj)">
<div class="mt10">
<img src="@/assets/images/u1188.png" alt class />
</div>
@@ -94,7 +94,9 @@ export default {
forgetNum: 0,
dontWork: 0,
titleTime: '',
timeCode:''
timeCode:'',
name:'',
obj:{}
}
},
created() {
@@ -114,16 +116,18 @@ export default {
console.log(e)
this.titleTime = utils.formatDate(e, 'yyyy-MM')
this.timeCode=utils.formatDate(e, 'yyyy-MM-dd')
this.obj.time=this.timeCode
this.attendance1()
},
month() {
month(obj) {
this.$jump({
flag: 'h5',
extra: {
url: location.origin + `/#/attendance/Monthly`
url: location.origin + `/#/attendance/Monthly/${JSON.stringify(obj)}`
},
routerInfo: {
path: `/attendance/Monthly`
path: `/attendance/Monthly/${JSON.stringify(obj)}`
}
})
},
@@ -142,7 +146,9 @@ export default {
(this.earllyNum = res.content.earllyNum),
(this.earllyTime = res.content.earllyTime),
(this.forgetNum = res.content.forgetNum),
(this.dontWork = res.content.dontWork)
(this.dontWork = res.content.dontWork),
this.name=res.content.name,
this.obj.name=this.name
}
})
},
@@ -150,6 +156,7 @@ export default {
// console.log(utils.formatDate("2020-1-1"))
this.titleTime = utils.formatDate(this.currentDate, 'yyyy-MM')
this.timeCode = utils.formatDate(this.currentDate, 'yyyy-MM-dd')
this.obj.time=this.timeCode
console.log(this.titleTime)
}
}

View File

@@ -3,7 +3,7 @@
<div class="bg-white absolute header">
<div class="flex h70 align-items-c border-gb">
<img src="@/assets/images/u1203.png" alt class="h40 w40 ml15" />
<span class="ml10 fs14">王昭君</span>
<span class="ml10 fs14">{{name}}</span>
<div class="absolute right20 flex fs13">{{time}} 星期{{week}}</div>
<div class="CalendarDiv"></div>
</div>
@@ -16,6 +16,8 @@
:showTodayButton="showTodayButton"
@click="timeDate"
:disabledWeekView="disable"
:defaultDatetime="date1"
@touchend="touchend"
></vue-hash-calendar>
</div>
<div class="footer">
@@ -58,6 +60,7 @@ export default {
data() {
return {
currentDate: new Date(),
date1:new Date(),
date: '',
show: false,
isShowCalendar: true,
@@ -70,10 +73,15 @@ export default {
time:'',
week:'',
nomal:[],
disable:true
disable:true,
name:'',
rest:[]
}
},
created(){
this.date1=new Date(JSON.parse(this.$route.params.obj).time)
this.time=JSON.parse(this.$route.params.obj).time
this.name=JSON.parse(this.$route.params.obj).name
this.getMonthDetail1();
this.time=utils.formatDate(this.currentDate, 'yyyy-MM-dd')
},
@@ -83,12 +91,15 @@ export default {
},
change(e) {
this.time=utils.formatDate(e, 'yyyy-MM-dd')
console.log(this.time)
this.getMonthDetail1()
this.week=String(new Date(e).getDay()).replace("0","日").replace("1","一").replace("2","二").replace("3","三").replace("4","四").replace("5","五").replace("6","六")
let date={
date:String(this.time)
}
//日上班
getDayDetail(date).then(res=>{
// console.log(res)
console.log(res)
if(res.result == 0){
this.workTime=res.content.workTime,
this.workTimeOff=res.content.workTimeoff,
@@ -99,40 +110,66 @@ export default {
},
timeDate(date){
this.time = utils.formatDate(date, 'yyyy-MM-dd')
this.timeChange= utils.formatDate(date, 'yyyy-MM')
this.week=String(new Date(date).getDay()).replace("0","日").replace("1","一").replace("2","二").replace("3","三").replace("4","四").replace("5","五").replace("6","六")
let date1={
date:this.time
}
getDayDetail(date1).then(res=>{
// console.log(res)
if(res.result == 0){
this.workTime=res.content.workTime,
this.workTimeOff=res.content.workTimeoff,
this.count=res.content.count,
this.amount=res.content.amount
}
})
},
//月历
getMonthDetail1(){
console.log("================"+this.time)
let date={
date:"2020-07-01"
date:this.time
}
getMonthDetail(date).then(res=>{
console.log(res)
if(res.result == 0){
this.normal=res.content.normal,
this.rest=res.content.rest
let mask=[]
let arr1=[]
let obj1={}
let date1=[]
obj1.color='yellow'
for(let i=0;i<res.content.rest.length;i++){
let workTime=res.content.rest[i].split(' ')
let workTime1=workTime[0]
if(String(workTime1)==String(utils.formatDate(new Date(), 'yyyy-MM-dd'))){
let arr2=res.content.rest.slice(0,i)
obj1.date=arr2
}
}
arr1.push(obj1)
// this.mask=arr1
let arr=arr1
let obj={}
let arr=[]
for(let i=0;i<this.normal.length;i++){
let nomal=this.normal[i].split('T')
let nomal1=nomal[0]
arr.push(nomal1)
obj.color='blue',
obj.date=arr
mask.push(obj)
let date=[]
let arr3=[]
obj.color='blue'
for(let t=0;t<res.content.normal.length;t++){
let workTime=res.content.normal[t].split(' ')
let workTime1=workTime[0]
date.push(workTime1)
obj.date=date
}
for(let i=0;i<this.normal.length;i++){
let nomal=this.normal[i].split('T')
let nomal1=nomal[0]
arr.push(nomal1)
obj.color='blue',
obj.date=arr
mask.push(obj)
}
console.log(mask)
// this.mask=mask
arr.push(obj)
arr3=arr3.concat(arr1,arr)
this.mask=arr
}
})
},
//滑动结束
touchend(e){
console.log(e)
console.log(this.time)
this.getMonthDetail1()
}
}
}

View File

@@ -102,7 +102,7 @@
<div class="date">0</div>
</td>
<td>
<div class="date">查看</div>
<div class="date" @click="details">查看</div>
</td>
</tr>
@@ -161,6 +161,18 @@ export default {
}
})
},
//跳转查看
details(){
this.$jump({
flag: 'h5',
extra: {
url: location.origin + `/#/performance/Performance`
},
routerInfo: {
path: `/performance/Performance`
}
})
},
getBranchInfos1(){
getBranchInfos().then(res=>{
console.log(res)

View File

@@ -144,6 +144,7 @@ export default {
btns: [
{
title: '考勤记录',
titleColor:'#FF0000',
route: { flag: '', extra: {} },
},
],
@@ -191,10 +192,10 @@ export default {
this.timeCode = utils.formatDate(e, 'yyyy-MM-dd')
this.obj.date = this.timeCode
this.getPerformanceDetailC()
if (this.titleTime !== utils.formatDate(this.currentDate, 'yyyy-MM')) {
this.isShow = false
} else {
if (String(this.titleTime) === String(utils.formatDate(new Date(), 'yyyy-MM'))) {
this.isShow = true
} else {
this.isShow = false
}
},
formatDate1() {

View File

@@ -73,7 +73,6 @@
</div>
</div> -->
</div>
<div class="mt10 mh-auto content fs12 red">统计截至时间2020-01-12 1630</div>
</div>
</template>
<script>
@@ -140,7 +139,7 @@ export default {
btns: [
{
title: '考勤记录',
titleColor:'red',
titleColor:'#FF0000',
route: { flag: '', extra: {} },
},
],
@@ -171,7 +170,7 @@ export default {
this.parmas.date=this.dateTime
this.getPerformanceDetail1()
// console.log(this.titleTime)
if (this.titleTime !== String(utils.formatDate(this.currentDate, 'yyyy-MM'))) {
if (this.titleTime !== String(utils.formatDate(new Date(), 'yyyy-MM'))) {
this.isShow = false
} else {
this.isShow = true