|
|
@@ -38,7 +38,7 @@
|
|
|
</div>
|
|
|
|
|
|
<p>{{Number(item.date)}}
|
|
|
- <div class="date-state-pointer d-state-zc"></div>
|
|
|
+ <div :class="calendarDaycount(item.year,item.month,item.date)"></div>
|
|
|
</p>
|
|
|
</div>
|
|
|
|
|
|
@@ -76,6 +76,9 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import {
|
|
|
+ getEventByCalendar
|
|
|
+} from '@/api/forest'
|
|
|
export default {
|
|
|
name: "ren-calendar",
|
|
|
props: {
|
|
|
@@ -127,10 +130,11 @@
|
|
|
monthOpen: false,
|
|
|
choose: "",
|
|
|
isCurM: true,
|
|
|
+ eventByCalendarList:[]
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
- this.dates = this.monthDay(this.y, this.m);
|
|
|
+ this.monthDay(this.y, this.m);
|
|
|
// !this.open && this.toggle();
|
|
|
},
|
|
|
watch: {
|
|
|
@@ -140,7 +144,7 @@
|
|
|
this.choose = this.selectDate
|
|
|
this.y = Number(this.selectDate.split('-')[0])
|
|
|
this.m = Number(this.selectDate.split('-')[1])
|
|
|
- this.dates = this.monthDay(this.y, this.m);
|
|
|
+ this.monthDay(this.y, this.m);
|
|
|
if (!this.monthOpen) {
|
|
|
let index = -1;
|
|
|
this.dates.forEach((i, x) => {
|
|
|
@@ -184,6 +188,20 @@
|
|
|
},
|
|
|
},
|
|
|
methods: {
|
|
|
+ // 标记日期状态颜色
|
|
|
+ calendarDaycount(y, m, d) {
|
|
|
+ let day=y + "-" + this.formatNum(m) + "-" + this.formatNum(d)
|
|
|
+ if(this.eventByCalendarList!=null&&this.eventByCalendarList.length>0){
|
|
|
+ for (let i = 0; i < this.eventByCalendarList.length; i++) {
|
|
|
+ if(this.eventByCalendarList[i].day==day&&this.eventByCalendarList[i].daycount>0&&this.eventByCalendarList[i].daycount<=10){
|
|
|
+ return "date-state-pointer d-state-t10"
|
|
|
+ }else if(this.eventByCalendarList[i].day==day&&this.eventByCalendarList[i].daycount>10){
|
|
|
+ return "date-state-pointer d-state-b10"
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return "date-state-pointer d-state-zc";
|
|
|
+ },
|
|
|
formatNum(num) {
|
|
|
let res = Number(num);
|
|
|
return res < 10 ? "0" + res : res;
|
|
|
@@ -203,10 +221,15 @@
|
|
|
return today;
|
|
|
},
|
|
|
// 获取当前月份数据
|
|
|
- monthDay(y, month) {
|
|
|
- let dates = [];
|
|
|
- let m = Number(month);
|
|
|
- let firstDayOfMonth = new Date(y, m - 1, 1).getDay(); // 当月第一天星期几
|
|
|
+ async monthDay(y, month) {
|
|
|
+ let param={ day: y+"-"+this.formatNum(Number(month)) }
|
|
|
+ await getEventByCalendar(param).then(res => {
|
|
|
+ //获取日历颜色状态
|
|
|
+ this.eventByCalendarList=res.data;
|
|
|
+ })
|
|
|
+ this.dates = [];
|
|
|
+ let m = Number(month);
|
|
|
+ let firstDayOfMonth = new Date(y, m - 1, 1).getDay(); // 当月第一天星期几
|
|
|
let lastDateOfMonth = new Date(y, m, 0).getDate(); // 当月最后一天
|
|
|
let lastDayOfLastMonth = new Date(y, m - 1, 0).getDate(); // 上一月的最后一天
|
|
|
let weekstart = this.weekstart == 7 ? 0 : this.weekstart;
|
|
|
@@ -222,7 +245,7 @@
|
|
|
})();
|
|
|
let endDay = 7 - ((startDay + lastDateOfMonth) % 7); // 结束还有几天是下个月的
|
|
|
for (let i = 1; i <= startDay; i++) {
|
|
|
- dates.push({
|
|
|
+ this.dates.push({
|
|
|
date: this.formatNum(lastDayOfLastMonth - startDay + i),
|
|
|
day: weekstart + i - 1 || 7,
|
|
|
month: m - 1 >= 1 ? this.formatNum(m - 1) : 12,
|
|
|
@@ -231,7 +254,7 @@
|
|
|
});
|
|
|
}
|
|
|
for (let j = 1; j <= lastDateOfMonth; j++) {
|
|
|
- dates.push({
|
|
|
+ this.dates.push({
|
|
|
date: this.formatNum(j),
|
|
|
day: (j % 7) + firstDayOfMonth - 1 || 7,
|
|
|
month: this.formatNum(m),
|
|
|
@@ -240,7 +263,7 @@
|
|
|
});
|
|
|
}
|
|
|
for (let k = 1; k <= endDay; k++) {
|
|
|
- dates.push({
|
|
|
+ this.dates.push({
|
|
|
date: this.formatNum(k),
|
|
|
day: (lastDateOfMonth + startDay + weekstart + k - 1) % 7 || 7,
|
|
|
month: m + 1 <= 12 ? this.formatNum(m + 1) : 1,
|
|
|
@@ -248,8 +271,6 @@
|
|
|
isCurM: false
|
|
|
});
|
|
|
}
|
|
|
- // console.log(dates);
|
|
|
- return dates;
|
|
|
},
|
|
|
isFutureDay(y, m, d) {
|
|
|
//是否未来日期
|
|
|
@@ -341,7 +362,7 @@
|
|
|
} else {
|
|
|
this.y = i.year
|
|
|
this.m = i.month
|
|
|
- this.dates = this.monthDay(this.y, this.m);
|
|
|
+ this.monthDay(this.y, this.m);
|
|
|
this.$emit("onDayClick", response);
|
|
|
}
|
|
|
}
|
|
|
@@ -351,7 +372,7 @@
|
|
|
},
|
|
|
//改变年月
|
|
|
changYearMonth(y, m) {
|
|
|
- this.dates = this.monthDay(y, m);
|
|
|
+ this.monthDay(y, m);
|
|
|
this.y = y;
|
|
|
this.m = m;
|
|
|
},
|
|
|
@@ -374,7 +395,7 @@
|
|
|
this.m = this.m + 1;
|
|
|
}
|
|
|
}
|
|
|
- this.dates = this.monthDay(this.y, this.m);
|
|
|
+ this.monthDay(this.y, this.m);
|
|
|
// this.$emit("changeMonth");
|
|
|
},
|
|
|
},
|
whao