新增‘‘用户自定义节假日提醒’功能

components/calendar/calendar.js

@@ -4,7 +4,10 @@ Component({
    * 组件的属性列表
    */
   properties: {
-
+    dateTimes:{
+      type:Array,
+      value:[]
+    }
   },
 
   /**
@@ -18,6 +21,7 @@ Component({
     curMonth:0,   //当前月份
     daysCountArr:[31,28,31,30,31,30,31,31,30,31,30,31],
     weekArr:['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
+    // dateTimes:[{day:'10-1',target:'国庆节'},{day:'10-2',target:'中秋节'}],
     dateList:[]
   },
 
@@ -62,9 +66,18 @@ Component({
         var week=new Date(Date.UTC(y,mon,i+1)).getDay();
         dateList[weekIndex].push({
           value:y+'-'+(mon+1)+'-'+(i+1),
+          dateTime:(mon+1)+'-'+(i+1),
           date:i+1,
           week:week
         });
+        // console.log(this.properties.dateTimes)
+        for(let k in vm.data.dateTimes){
+          for(let j in dateList[weekIndex]){
+            if(dateList[weekIndex][j].dateTime==vm.properties.dateTimes[k].day){
+              dateList[weekIndex][j].event=vm.properties.dateTimes[k].target
+            }
+          }
+        }
         if(week==6){
           weekIndex++;
           dateList[weekIndex]=[]

components/calendar/calendar.wxml

@@ -20,7 +20,7 @@
     </view>
     <view class="calendar_box" wx:for="{{dateList}}" wx:for-item="week"
       style="{{index==0?'justify-content:flex-end':''}}">
-      <view class="weekday_label {{(item.value==selectedDate)?'active_date':''}} {{(item.value==now_selectedDate)?'active_dates':''}}" wx:for="{{week}}">
+      <view class="weekday_label {{(item.value==selectedDate)?'active_date':''}} {{(item.value==now_selectedDate)?'active_dates':''}} {{(item.event)?'actived_date':''}}" wx:for="{{week}}" data-event="{{item.event}}">
         <view class="" bindtap="selectDate" data-date="{{item}}">
           {{item.date}}</view>
       </view>

components/calendar/calendar.wxss

@@ -72,7 +72,20 @@
   left: 50%;
   transform: translateX(-50%);
   color: blue;
-  font-size: 20rpx;
+  font-size: 18rpx;
+}
+.actived_date{
+  overflow: hidden;
+  position: relative;
+}
+.actived_date::after{
+  content: attr(data-event);
+  position: absolute;
+  bottom: 7%;
+  left: 50%;
+  transform: translateX(-50%);
+  color: blue;
+  font-size: 16rpx;
 }
 .show_box{
   padding: 20rpx;

pages/calendar/calendar.js

@@ -5,7 +5,7 @@ Page({
    * 页面的初始数据
    */
   data: {
-
+    dateTimes:[{day:'10-1',target:'国庆节'},{day:'10-2',target:'中秋节'}]
   },
 
   /**

pages/calendar/calendar.wxml

 <view>
-  <y-calendar bind:timeload="timeload" bind:timechanged="timechanged"></y-calendar>
+  <y-calendar dateTimes="{{dateTimes}}" bind:timeload="timeload" bind:timechanged="timechanged"></y-calendar>
 </view>
\ No newline at end of file