71 lines
1.6 KiB
Vue
71 lines
1.6 KiB
Vue
<template>
|
||
<div>
|
||
<uni-calendar ref="calendar" :insert="false" @confirm="confirm" />
|
||
<div class="button"><button @click="open">请选择工单时间</button></div>
|
||
<div class="text">当前选择：{{year}}年-{{week}}周-{{date}}日</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
year:0,
|
||
week:0,
|
||
date:0
|
||
}
|
||
},
|
||
created() {
|
||
this.year = new Date().getFullYear();
|
||
this.week = this.getYearWeek(new Date().getFullYear(), new Date().getMonth()+1, new Date().getDate());
|
||
this.date = new Date().getDay()
|
||
this.emitData();
|
||
},
|
||
methods: {
|
||
open() {
|
||
this.$refs.calendar.open();
|
||
},
|
||
confirm(e) {
|
||
this.year = e.lunar.cYear;
|
||
this.week = this.getYearWeek(e.lunar.cYear, e.lunar.cMonth, e.lunar.cDay);
|
||
this.date = e.lunar.nWeek;
|
||
this.emitData();
|
||
|
||
},
|
||
// 选择日期
|
||
emitData() {
|
||
const data = {
|
||
year:this.year,
|
||
week:this.week,
|
||
date:this.date
|
||
}
|
||
this.$emit('dateChouse', data)
|
||
},
|
||
getYearWeek(year, month, day) {
|
||
/*
|
||
date1是当前日期
|
||
date2是当年第一天
|
||
date3是当前日期是今年第多少天
|
||
用date3 + 当前年的第一天的周差距的和在除以7就是本年第几周
|
||
*/
|
||
let date1 = new Date(year, parseInt(month) - 1, day),
|
||
date2 = new Date(year, 0, 1),
|
||
date3 = Math.round((date1.valueOf() - date2.valueOf()) / 86400000);
|
||
return Math.ceil((date3 + ((date2.getDay() + 1) - 1)) / 7);
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.text{
|
||
text-align: center;
|
||
font-size: 24px;
|
||
font-weight: 700;
|
||
}
|
||
.button{
|
||
width: 90%;
|
||
margin: 0 auto;
|
||
margin-top: 10px;
|
||
}
|
||
</style> |