小程序ui调整

component/calendar/index.wxml

@@ -1,20 +1,20 @@
 <view class="flex b tb ac" wx:if="{{calendar}}">
   <view class="calendar b tb">
     <!-- 头部操作栏 -->
-    <view wx:if="{{!calendarConfig.hideHeadOnWeekMode}}" class="handle {{calendarConfig.theme}}_handle-color fs28 b lr ac pc">
-      <view class="prev fs36" wx:if="{{calendarConfig.showHandlerOnWeekMode || !calendarConfig.weekMode}}">
+    <view wx:if="{{!calendarConfig.hideHeadOnWeekMode}}" class="handle {{calendarConfig.theme}}_handle-color fsnd b lr ac pc">
+      <view class="prev fsnd" wx:if="{{calendarConfig.showHandlerOnWeekMode || !calendarConfig.weekMode}}">
         <text class="prev-handle iconfont icon-doubleleft" bindtap="chooseDate" data-type="prev_year"></text>
         <text class="prev-handle iconfont icon-left" bindtap="chooseDate" data-type="prev_month"></text>
       </view>
       <view class="flex date-in-handle b lr cc" bindtap="doubleClickToToday">{{calendar.curYear || "--"}} 年 {{calendar.curMonth || "--"}} 月</view>
-      <view class="next fs36" wx:if="{{calendarConfig.showHandlerOnWeekMode || !calendarConfig.weekMode}}">
+      <view class="next fsnd" wx:if="{{calendarConfig.showHandlerOnWeekMode || !calendarConfig.weekMode}}">
         <text class="next-handle iconfont icon-right" bindtap="chooseDate" data-type="next_month"></text>
         <text class="next-handle iconfont icon-doubleright" bindtap="chooseDate" data-type="next_year"></text>
       </view>
     </view>
     <!-- 星期栏 -->
     <view class="weeks b lr ac {{calendarConfig.theme}}_week-color">
-      <view class="week fs28" wx:for="{{calendar.weeksCh}}" wx:key="index" data-idx="{{index}}">{{item}}</view>
+      <view class="week fsnd" wx:for="{{calendar.weeksCh}}" wx:key="index" data-idx="{{index}}">{{item}}</view>
     </view>
     <!-- 日历面板主体 -->
     <view class="b lr wrap"

component/calendar/index.wxss

@@ -60,6 +60,14 @@
     font-size: 36rpx;
 }
 
+.fs54 {
+    font-size: 54rpx;
+}
+
+.fsnd {
+    font-size: 40rpx;
+}
+
 .calendar {
     width: 100%;
     box-sizing: border-box;
@@ -178,6 +186,9 @@
 .todo-dot-top {
     top: 3rpx;
 }
+.mt10{
+    margin-top:10rpx;
+}
 
 .todo-dot.todo-dot-top-always {
     top: -8rpx;

component/v2/index.wxml

@@ -3,20 +3,22 @@
     <!-- 头部操作栏 -->
     <view
       wx:if="{{!config.hideHeader}}"
-      class="handle {{config.theme}}_handle-color fs28 b lr ac pc">
-      <view class="prev fs36" wx:if="{{!config.weekMode}}">
-        <text class="prev-handle iconfont icon-doubleleft" bindtap="changeDate" data-type="prev_year"></text>
+      class="handle {{config.theme}}_handle-color fsnd b lr ac pc fsnd">
+      <view class="prev fsnd" wx:if="{{!config.weekMode}}">
+        <text class="prev-handle iconfont icon-doubleleft fsnd" bindtap="changeDate" data-type="prev_year"></text>
         <text class="prev-handle iconfont icon-left" bindtap="changeDate" data-type="prev_month"></text>
       </view>
-      <view class="flex date-in-handle b lr cc" bindtap="doubleClickJumpToToday">{{calendar.curYear || "--"}} 年 {{calendar.curMonth || "--"}} 月</view>
-      <view class="next fs36" wx:if="{{!config.weekMode}}">
+      <view class="flex date-in-handle b lr cc fsnd" bindtap="doubleClickJumpToToday">
+        {{calendar.curYear || "--"}} 年 {{calendar.curMonth || "--"}} 月
+      </view>
+      <view class="next fsnd" wx:if="{{!config.weekMode}}">
         <text class="next-handle iconfont icon-right" bindtap="changeDate" data-type="next_month"></text>
         <text class="next-handle iconfont icon-doubleright" bindtap="changeDate" data-type="next_year"></text>
       </view>
     </view>
     <!-- 星期栏 -->
-    <view class="weeks b lr ac {{config.theme}}_week-color">
-      <view class="week fs28" wx:for="{{calendar.weeksCh}}" wx:key="index" data-idx="{{index}}">{{item}}</view>
+    <view class="weeks b lr ac {{config.theme}}_week-color mt10">
+      <view class="week fsnd" wx:for="{{calendar.weeksCh}}" wx:key="index" data-idx="{{index}}">{{item}}</view>
     </view>
     <!-- 日历面板主体 -->
     <view class="b lr wrap" bindtouchstart="calendarTouchstart" catchtouchmove="calendarTouchmove" catchtouchend="calendarTouchend">

component/v2/index.wxss

@@ -60,6 +60,11 @@
     font-size: 36rpx;
 }
 
+.fsnd {
+    font-weight: 500;
+    font-size: 45rpx;
+}
+
 .calendar {
     width: 100%;
     box-sizing: border-box;
@@ -77,15 +82,17 @@
 }
 
 .date-in-handle {
-    height: 80rpx;
+    height: 90rpx;
 }
 
 /* 星期栏 */
 
 .weeks {
-    height: 50rpx;
-    line-height: 50rpx;
-    opacity: 0.5;
+    height: 60rpx;
+    line-height: 60rpx;
+    font-size: 30rpx;
+    font-weight: 600;
+    opacity: 0.8;
 }
 
 .week {
@@ -99,7 +106,7 @@
 
 .date-wrap {
     width: 100%;
-    height: 80rpx;
+    height: 96rpx;
     position: relative;
     left: 0;
     top: 0;
@@ -109,13 +116,12 @@
     position: relative;
     left: 0;
     top: 0;
-    width: 55rpx;
-    height: 55rpx;
+    width: 65rpx;
+    height: 65rpx;
     text-align: center;
-    line-height: 55rpx;
-    font-size: 38rpx;
-    padding: 10rpx;
-    font-weight: 200;
+    line-height: 65rpx;
+    font-size: 40rpx;
+    font-weight: 600;
     border-radius: 50%;
     transition: all 0.3s;
     animation-name: choosed;
@@ -203,7 +209,10 @@
 }
 
 .date-desc.date-desc-bottom {
-    bottom: -14rpx;
+    bottom: -32rpx;
+    color: green;
+    font-size: 25rpx;
+    font-weight: 800;
 }
 
 .todo-circle .date-desc.date-desc-bottom {

component/v2/theme/theme-default.wxss

@@ -5,17 +5,17 @@
 .default_weekend-color,
 .default_handle-color,
 .default_week-color {
-    color: #ff629a;
+    color: red;
 }
 
 .default_today {
     color: #fff;
-    background-color: #874fb4;
+    background-color: #f31111;
 }
 
 .default_choosed {
     color: #fff;
-    background-color: #ff629a;
+    background-color: #f31111;
 }
 
 .default_date-disable {
@@ -24,7 +24,7 @@
 
 .default_choosed.default_date-disable {
     color: #e2e2e2;
-    background-color: #c2afb6;
+    background-color: green;
 }
 
 .default_prev-month-date,
@@ -33,7 +33,7 @@
 }
 
 .default_normal-date {
-    color: #88d2ac;
+    color: #a5990d;
 }
 
 .default_todo-circle {
@@ -57,5 +57,5 @@
 }
 
 .default_festival {
-    color: #c2c2c2;
+    color: green;
 }

pages/rili/index.js

@@ -21,12 +21,15 @@ const conf = {
     visitList:[],
     tableData: [],
     curDate: '',
+    fromDate:'',
+    toDate:'',
     calendarConfig: {
-      theme: 'elegant',
-      // showHolidays: true,
-      // emphasisWeek: true,
-      // chooseAreaMode: true
-      defaultDate: formatDate(new Date()),
+      theme: 'default',
+      showHolidays: true,
+      emphasisWeek: true,
+      chooseAreaMode: false,
+      autoChoosedWhenJump: true,
+      defaultDate: formatDate(new Date())
       // autoChoosedWhenJump: true
     },
     actionBtn: [
@@ -102,12 +105,19 @@ const conf = {
       }
     ]
   },
+  initData(){
+    let curDate = formatDate(new Date());
+    let fromDate = curDate.substr(0,8)+ "01"
+    let toDate = curDate.substr(0,8)+ "31"
+    this.setData( {curDate, fromDate, toDate})
+  },
   afterTapDate(e) {
     let curDate = object2Date( e.detail );
     this.setData({curDate});
     this.filterData()
   },
   onShow: function(){
+    this.initData();
     app.checkLogin(res=>{
       if( !res.userId ){
         wx.navigateTo({
@@ -120,6 +130,7 @@ const conf = {
   },
   filterData(){
     let {curDate, outList, visitList} = this.data;
+    
     let allList = outList.map( item=>{
         item.isOut= true
         return item;
@@ -131,7 +142,7 @@ const conf = {
         tableData.push( allList[i] );
       }
     }
-    console.log("tableData", curDate, allList, tableData)
+    console.log("filterData", curDate, tableData)
     this.setData({tableData})
   },
   gotoDetail( e ){
@@ -147,9 +158,7 @@ const conf = {
     }
   },
   loadData(){
-    let curDate = this.data.calendarConfig.defaultDate;
-    let fromDate = curDate.substr(0,8)+ "01"
-    let toDate = curDate.substr(0,8)+ "31"
+    let {fromDate, toDate} = this.data;
     app.formPost("User.loadData", {fromDate, toDate}).then( res=>{
       if( res.code == 200){
         let outList = res.data.outList||[];
@@ -170,8 +179,8 @@ const conf = {
       let {fromDate,toDate} = item;
       if( toDate < fromDate) continue;
       while( fromDate <= toDate){
-        dateMap[fromDate] = 1
-        fromDate = util.nextDate( fromDate);
+        dateMap[fromDate] = 1;
+        fromDate = util.nextDate(fromDate);
       }
     }
     // 
@@ -179,28 +188,36 @@ const conf = {
       let item = visitList[i];
       let {fromDate,toDate} = item;
       if( toDate < fromDate) continue;
-      while( fromDate <= toDate){
-        dateMap[fromDate] = dateMap[fromDate]?3:2
-        fromDate = util.nextDate( fromDate);
+      let tempDate = fromDate
+      while( tempDate <= toDate){
+        let curNum = dateMap[tempDate]||0;
+        if(  curNum == 1 ){
+           dateMap[tempDate] = 3;
+        } else if( !curNum ){
+          dateMap[tempDate] = 2
+        }
+        tempDate = util.nextDate( tempDate );
       }
     }
     var dates = [];
     for( let date in dateMap ){
       let d = new Date(date);
       let item = {year: d.getFullYear(), month: d.getMonth()+1, date: d.getDate()};
-      switch( dateMap[date]){
+      console.log("mark", date, dateMap[date])
+      switch( dateMap[date] ){
         case 1:
           item.todoText = "出";
+          item.dotColor = "red"
           break;
         case 2:
          item.todoText = "临";
+         item.dotColor = "green"
          break;
         default:
           item.todoText = "临&出";
       }
       dates.push( item );
     }
-    console.log("dates", dates );
     calendar.setTodos({
       showLabelAlways: true,
       dates
@@ -208,6 +225,11 @@ const conf = {
   },
   whenChangeMonth(e) {
     console.log('whenChangeMonth', e.detail)
+    let {year, month} = e.detail.next;
+    let fromDate = object2Date({year, month:month, date:1})
+    let toDate = object2Date({year, month:month, date:31})
+    this.setData({fromDate, toDate})
+    this.loadData()
   },
   whenChangeWeek(e) {
     console.log('whenChangeWeek', e.detail)

pages/rili/index.wxml

@@ -11,19 +11,19 @@
   ></calendar>
 </view>
 
-<view wx:for="{{tableData}}" wx:key="index">
+<view wx:for="{{tableData}}" wx:key="index" class="mt5">
   <view class="i-class i-card i-card-full" data-id="{{item.id}}" data-out="{{item.isOut}}"  bindtap="gotoDetail" >
     <view class="i-class i-card-header">
-      <view class="i-card-header-title">
+      <view class="i-card-header-title mt10" style="font-size:30rpx">
         {{item.username}} 
         <text wx:if="{{item.isOut}}" style="color:orange;">【外出】</text>
         <text wx:else style="color:green;">【莅临】</text>
       </view>
-      <view class="i-card-header-extra" >
+      <view class="i-card-header-extra" style="font-size:30rpx" >
         {{item.post}}
       </view>
     </view>
-    <view class="i-card-footer">
+    <view class="i-card-footer" style="font-size:35rpx">
       {{item.fromDate}} 到 {{item.toDate}}  
     </view>
   </view>