上传

app.json

@@ -108,6 +108,7 @@
   "tabBar": {
     "selectedColor": "#0177FF",
     "color": "#999",
+    "borderStyle": "white",
     "list": [{
         "pagePath": "pages/index/index",
         "text": "主页",

pages/clock/clock-success/clock-success.wxss

@@ -9,6 +9,7 @@ page {
   margin: 30rpx auto;
   padding-top: 70rpx;
   padding-bottom: 130rpx;
+  border-radius: 16rpx;
 }
 
 .clock-success {

pages/clock/clock-tongji/calendar/calendar.js

@@ -1,4 +1,5 @@
 // pages/clock/clock-tongji/calendar/calendar.js
+let first = true
 Component({
   /**
    * 组件的属性列表
@@ -18,16 +19,25 @@ Component({
     selectedIndex: '',
     selectedDay: {},
     // 日期list 
-    calendarDays: []
+    calendarDays: [],
+    defaultMonth: '',
+    defaultDate: '',
+    blue: ''
   },
   ready() {
-    this.getMonthDaysCurrent(new Date())
+
   },
   /**
    * 组件的方法列表
    */
   methods: {
-
+    init(e) {
+      this.setData({
+        defaultMonth: e.getMonth() + 1,
+        defaultDate: e.getDate(),
+      })
+      this.getMonthDaysCurrent(e)
+    },
     // 所选时间对应月份日期
     getMonthDaysCurrent(e) {
       let year = e.getFullYear()
@@ -43,7 +53,10 @@ Component({
       let lastDay = lastDate.getDay() //当月最后一天对应的星期
 
       let calendarDays = []
-
+      this.setData({
+        selectedIndex: '',
+        blue: ''
+      })
       // 上个月显示的天数及日期
       for (let i = firstDay - 2; i >= 0; i--) {
         let date = new Date(year, month - 1, -i)
@@ -69,10 +82,17 @@ Component({
         })
         if (i == date) {
           this.setData({
-            selectedIndex: index - 1,
             selectedDay: calendarDays[index - 1]
           })
-          console.log(calendarDays[index - 1])
+        }
+        if (month === this.data.defaultMonth && i === this.data.defaultDate) {
+          if (first) {
+            first = false
+            this.setData({
+              selectedIndex: index - 1,
+              blue: index - 1,
+            })
+          }
         }
       }
 

pages/clock/clock-tongji/calendar/calendar.wxml

@@ -7,7 +7,8 @@
     </view>
   </view>
   <view class="calendar-content">
-    <view class='calendar-item {{item.current ? "":"text-gray"}} {{selectedIndex === index ? "text-red":""}}'
+    <view
+      class='calendar-item {{item.current ? "":"text-gray"}} {{ calendar.getSelectClass(blue,selectedIndex ,index ,list[item.date - 1])}}'
       wx:for="{{calendarDays}}" wx:key="index" data-index='{{index}}' bindtap='clickDate'>
       <text>{{item.date}}</text>
       <block wx:if="{{item.current}}">

pages/clock/clock-tongji/calendar/calendar.wxs

@@ -9,6 +9,23 @@ function getClass(json) {
   }
   return ''
 }
+
+function getSelectClass(blue, selectedIndex, index, json) {
+  if (selectedIndex === index && json) {
+    if (blue === index) {
+      return 'text-blue';
+    }
+    if (json.startPunchClock && json.endPunchClock) {
+      return 'text-blue';
+    } else if (json.startPunchClock || json.endPunchClock) {
+      return 'text-yellow';
+    }
+    return 'text-blue';
+  }
+  return ''
+}
+
 module.exports = {
-  getClass: getClass
+  getClass: getClass,
+  getSelectClass: getSelectClass
 };

pages/clock/clock-tongji/calendar/calendar.wxss

@@ -7,6 +7,7 @@
 .title,
 .calendar-content {
   overflow: hidden;
+  padding-bottom: 8rpx;
 }
 
 .title-item {
@@ -57,7 +58,7 @@
   color: #999;
 }
 
-.text-red {
+.text-blue {
   width: 72rpx;
   height: 72rpx;
   font-weight: 600;
@@ -66,6 +67,15 @@
   border-radius: 100%;
 }
 
+.text-yellow {
+  width: 72rpx;
+  height: 72rpx;
+  font-weight: 600;
+  color: #FFFFFF;
+  background: #FD7235;
+  border-radius: 100%;
+}
+
 .point {
   height: 10rpx;
   width: 10rpx;
@@ -81,6 +91,6 @@
 }
 
 .all {
-  background-color: #BCBCBC;
+  background-color: #0177FF;
   border: 2rpx solid #FFFFFF;
 }

pages/clock/clock-tongji/index.js

@@ -8,6 +8,7 @@ import {
 import {
   imgServerUrl
 } from '../../../config/config.js'
+let selected = ''
 Page({
 
   /**
@@ -22,11 +23,12 @@ Page({
     text: '',
     currentDuration: 0,
     punckClockList: [],
-    nextMoney: 0
+    nextMoney: 0,
+    defaultDate: ''
   },
   toList() {
     wx.navigateTo({
-      url: './list',
+      url: './list?date=' + this.data.defaultDate,
     })
   },
   getList(month_type) {
@@ -38,12 +40,25 @@ Page({
   },
   getCurrent() {
     currentSettlement().then(data => {
-      const month = Number(data.data.currentSettlement.date.split('-')[1])
+      const date = new Date(data.data.currentSettlement.date.replace(/'-'/g, '/'))
+      // const month = Number(data.data.currentSettlement.date.split('-')[1])
+      let year = date.getFullYear()
+      let month = date.getMonth() + 1
+      let day = date.getDate()
+      this.selectComponent('.calendar').init(date)
       this.setData({
         currentSettlement: data.data.currentSettlement,
         text: month,
         mouth: month,
+        year,
+        defaultDate: data.data.currentSettlement.date.replace(/'-'/g, '/')
       })
+
+      const search_date = [year, month, day].map(val => {
+        const number = val.toString()
+        return number[1] ? number : '0' + number
+      }).join('-')
+      this.getDay(search_date)
     })
   },
   next() {
@@ -54,13 +69,6 @@ Page({
         text: this.data.mouth,
         next: `${imgServerUrl}/images/clock/clock-arrow-righr-disabled.png`,
         last: `${imgServerUrl}/images/clock/clock-arrow-left.png`,
-      }, _ => {
-        let { year, text } = this.data
-        const search_date = [year, text, 1].map(val => {
-          const number = val.toString()
-          return number[1] ? number : '0' + number
-        }).join('-')
-        this.getDay(search_date)
       })
     }
   },
@@ -70,26 +78,11 @@ Page({
       this.getList(2)
       if (this.data.mouth - 1 <= 0) {
         this.setData({
-          text: 12
-        }, _ => {
-          let { year, text } = this.data
-          const search_date = [year - 1, text, 1].map(val => {
-            const number = val.toString()
-            return number[1] ? number : '0' + number
-          }).join('-')
-          this.getDay(search_date)
-
+          text: 12,
         })
       } else {
         this.setData({
           text: this.data.mouth - 1
-        }, _ => {
-          let { year, text } = this.data
-          const search_date = [year, text, 1].map(val => {
-            const number = val.toString()
-            return number[1] ? number : '0' + number
-          }).join('-')
-          this.getDay(search_date)
         })
       }
       this.setData({
@@ -133,20 +126,8 @@ Page({
    * 生命周期函数--监听页面显示
    */
   onShow: function () {
-    const date = new Date()
-    let year = date.getFullYear()
-    let month = date.getMonth() + 1
-    let day = date.getDate()
-    const search_date = [year, month, day].map(val => {
-      const number = val.toString()
-      return number[1] ? number : '0' + number
-    }).join('-')
     this.getList(1)
     this.getCurrent()
-    this.getDay(search_date)
-    this.setData({
-      year
-    })
   },
 
   /**

pages/clock/clock-tongji/index.wxml

@@ -45,10 +45,9 @@
       <view class="clock-content" wx:for="{{punckClockList}}" wx:key='index'>
         <view class="left">
           <view class="top" wx:if="{{item.clockType === 1}}"></view>
-          <block wx:else>
-            <view class="midden"></view>
-            <view class="bottom"></view>
-          </block>
+          <view class="midden" wx:if="{{item.clockType === 1 && (punckClockList[index + 1] && punckClockList[index + 1].clockType !== 1)}}"></view>
+          <view class="midden-short" wx:if="{{item.clockType === 1 && (!punckClockList[index + 1] || punckClockList[index + 1].clockType === 1)}}"></view>
+          <view class="bottom" wx:if="{{item.clockType === 2 || item.clockType === 3}}"></view>
         </view>
         <view class="right">
           <view class="clock-in" wx:if="{{item.clockType === 1}}">
@@ -66,7 +65,7 @@
             </view>
           </view>
           <view class="clock-out" wx:if="{{item.clockType === 3}}">
-            <view class="clock-type">下班<text class="shortage">缺卡</text></view>
+            <view class="clock-type">下班 <text class="shortage"> 缺卡</text></view>
             <view class="address">
               <image src="{{imgServerUrl}}/images/clock/clock-position.png" class="position"></image>
               <text>{{item.companyName}}</text>
@@ -75,6 +74,9 @@
         </view>
       </view>
     </view>
+    <view wx:else class="no-data">
+      当天没有打卡记录
+    </view>
     <view class="nextMoney">
       <view class="nextMoney-message">当日可预支工资：</view>
       <view class="money">

pages/clock/clock-tongji/index.wxss

@@ -130,15 +130,14 @@ page {
 }
 
 .clock-content {
-  margin-top: 50rpx;
-  overflow: hidden;
+  display: flex;
 }
 
 .left {
   float: left;
   display: flex;
   align-items: center;
-  justify-content: center;
+  justify-content: flex-start;
   flex-direction: column;
   margin-right: 30rpx;
 }
@@ -161,12 +160,18 @@ page {
   background: #DDDDDD;
 }
 
+.midden-short {
+  width: 2rpx;
+  height: 60rpx;
+  background: #DDDDDD;
+}
+
 .right {
   float: left;
 }
 
 .clock {
-  margin-bottom: 113rpx;
+  /* margin-bottom: 113rpx; */
 }
 
 .clock-type {
@@ -192,8 +197,13 @@ page {
   margin-right: 15rpx;
 }
 
+.clock-in {
+  height: 154rpx;
+}
+
 .clock-out {
-  margin-top: 75rpx;
+  margin-top: -15rpx;
+  margin-bottom: 45rpx;
 }
 
 .shortage {
@@ -225,4 +235,13 @@ page {
   font-family: DINCondensed-Bold, DINCondensed;
   font-weight: bold;
   color: #0177FF;
+}
+
+.no-data {
+  margin-bottom: 100rpx;
+  font-size: 34rpx;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: 500;
+  color: #000000;
+  text-align: center;
 }

pages/clock/clock-tongji/list.js

@@ -24,6 +24,7 @@ Page({
     weekData: {},
     mouth: '',
     defaultmouth: '',
+    defaultDate: '',
     week: '本周'
   },
   getMouth(month_type) {
@@ -89,7 +90,7 @@ Page({
       this.setData({
         week: '本周',
         weekLast: `${imgServerUrl}/images/clock/clock-arrow-left.png`,
-        weekNext: `${imgServerUrl}/images/clock/clock-arrow-right-disabled.png`,
+        weekNext: `${imgServerUrl}/images/clock/clock-arrow-righr-disabled.png`,
       })
       this.getWeek(1)
     }
@@ -98,7 +99,11 @@ Page({
    * 生命周期函数--监听页面加载
    */
   onLoad: function (options) {
-   
+    this.setData({
+      avatar: wx.getStorageSync('userInfo').avatarUrl,
+      name: wx.getStorageSync('userInfo').nickName,
+      defaultDate: new Date(options.date)
+    })
   },
 
   /**
@@ -122,7 +127,7 @@ Page({
     })
     this.getMouth(1)
     this.getWeek(1)
-    const date = new Date()
+    const date = this.data.defaultDate
     let month = date.getMonth() + 1
     let year = date.getFullYear()
     this.setData({

pages/clock/clock.js

@@ -222,68 +222,78 @@ Page({
     })
   },
   async load() {
-    const data = await this.location()
-    punchClockNeedInfo({ longitude: data.longitude, latitude: data.latitude }).then(data => {
-      // punchClockNeedInfo({ longitude: 120.353312, latitude: 31.535582 }).then(data => {
-      locationStatus = true
-      let {
-        authenticationStatus,
-        startPunch,
-        endPunch,
-        todayMoney,
-        clockType, // 1:上班打卡 2：下班打卡 3：超出范围 4：已完成
-        sumDuration,
-        sumMoney,
-        wsPunchClockId,
-        dailyAvailableMinHour
-      } = data.data
-      this.setData({
-        approveStatus: authenticationStatus, // 认证状态（0：未认证 1：等待认证 2：未通过 3：已认证） ,
-        startPunch,
-        endPunch,
-        todayMoney,
-        clockType,
-        sumDuration,
-        sumMoney,
-        wsPunchClockId
+    try {
+      wx.showLoading({
+        icon: 'none',
+        title: '定位中...',
       })
-      if (clockType === 1 && !wsPunchClockId) {
-        this.setData({
-          statusImage: `${imgServerUrl}/images/clock/clock-in.png`,
-          statusIcon: `${imgServerUrl}/images/clock/clock-can.png`,
-        })
-      }
-      if (clockType === 1 && wsPunchClockId) {
-        this.setData({
-          statusImage: `${imgServerUrl}/images/clock/clock-out-disabled.png`,
-          statusIcon: `${imgServerUrl}/images/clock/clock-waring.png`,
-          statusMessage: `上班${dailyAvailableMinHour}小时候才能进行下班打卡`,
-        })
-      }
-      if (clockType === 2 && wsPunchClockId) {
-        this.setData({
-          statusImage: `${imgServerUrl}/images/clock/clock-out.png`,
-          statusIcon: `${imgServerUrl}/images/clock/clock-can.png`,
-          statusMessage: `已进入考勤打卡范围`,
-        })
-      }
-      if (clockType === 3) {
+      const data = await this.location()
+      wx.hideLoading()
+      punchClockNeedInfo({ longitude: data.longitude, latitude: data.latitude }).then(data => {
+        // punchClockNeedInfo({ longitude: 120.353312, latitude: 31.535582 }).then(data => {
+        locationStatus = true
+        let {
+          authenticationStatus,
+          startPunch,
+          endPunch,
+          todayMoney,
+          clockType, // 1:上班打卡 2：下班打卡 3：超出范围 4：已完成
+          sumDuration,
+          sumMoney,
+          wsPunchClockId,
+          dailyAvailableMinHour
+        } = data.data
         this.setData({
-          statusImage: `${imgServerUrl}/images/clock/clock-beyond.png`,
-          statusIcon: `${imgServerUrl}/images/clock/clock-waring.png`,
-          statusMessage: `请进入企业后再进行打卡`,
+          approveStatus: authenticationStatus, // 认证状态（0：未认证 1：等待认证 2：未通过 3：已认证） ,
+          startPunch,
+          endPunch,
+          todayMoney,
+          clockType,
+          sumDuration,
+          sumMoney,
+          wsPunchClockId
         })
-      }
-      if (clockType === 4) {
-        this.setData({
-          statusImage: `${imgServerUrl}/images/clock/clock-done.png`,
-          statusIcon: `${imgServerUrl}/images/clock/clock-can.png`,
-          statusMessage: `今日打卡已完成`,
-        })
-      }
-    }).catch(data => {
+        if (clockType === 1 && !wsPunchClockId) {
+          this.setData({
+            statusImage: `${imgServerUrl}/images/clock/clock-in.png`,
+            statusIcon: `${imgServerUrl}/images/clock/clock-can.png`,
+          })
+        }
+        if (clockType === 1 && wsPunchClockId) {
+          this.setData({
+            statusImage: `${imgServerUrl}/images/clock/clock-out-disabled.png`,
+            statusIcon: `${imgServerUrl}/images/clock/clock-waring.png`,
+            statusMessage: `上班${dailyAvailableMinHour}小时候才能进行下班打卡`,
+          })
+        }
+        if (clockType === 2 && wsPunchClockId) {
+          this.setData({
+            statusImage: `${imgServerUrl}/images/clock/clock-out.png`,
+            statusIcon: `${imgServerUrl}/images/clock/clock-can.png`,
+            statusMessage: `已进入考勤打卡范围`,
+          })
+        }
+        if (clockType === 3) {
+          this.setData({
+            statusImage: `${imgServerUrl}/images/clock/clock-beyond.png`,
+            statusIcon: `${imgServerUrl}/images/clock/clock-waring.png`,
+            statusMessage: `请进入企业后再进行打卡`,
+          })
+        }
+        if (clockType === 4) {
+          this.setData({
+            statusImage: `${imgServerUrl}/images/clock/clock-done.png`,
+            statusIcon: `${imgServerUrl}/images/clock/clock-can.png`,
+            statusMessage: `今日打卡已完成`,
+          })
+        }
+      }).catch(data => {
+        locationStatus = true
+      })
+    } catch (e) {
+      wx.hideLoading()
       locationStatus = true
-    })
+    }
   },
   reload() {
     if (locationStatus) {

pages/clock/clock.wxss

@@ -138,6 +138,7 @@ page {
 
 .unit {
   font-size: 28rpx;
+  margin-left: 10rpx;
 }
 
 .pass-header-message {