From ad765d38cba19afba5d78cc19750b27bcc8ec230 Mon Sep 17 00:00:00 2001
From: huichao <hui.chao@ebiz-digits.com>
Date: Mon, 27 Jul 2020 18:11:53 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=B7=E6=96=B0=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/ebiz/attendance/Monthly.vue | 424 ++++++++++++++------------
 1 file changed, 228 insertions(+), 196 deletions(-)

diff --git a/src/views/ebiz/attendance/Monthly.vue b/src/views/ebiz/attendance/Monthly.vue
index ee410b8e1..e60f0d481 100644
--- a/src/views/ebiz/attendance/Monthly.vue
+++ b/src/views/ebiz/attendance/Monthly.vue
@@ -1,119 +1,138 @@
 <template>
   <div>
-       <van-sticky>
-        <DatetimePicker
-          ref="datetimepicker"
-          model="inline"
-          :scroll-change-date="true"
-          :visible.sync="isShowCalendar"
-          :default-datetime="defaultDatetime"
-          :is-show-week-view="isShowWeek"
-          :minute-step="1"
-          :mark-date="markDate"
-          mark-type="dot"
-          week-start="sunday"
-          picker-type="date"
-          :show-today-button="true"
-          :disabled-week-view="false"
-          format="YY/MM/DD hh:mm"
-          @get-height="getHeight"
-          @confirm="dateConfirm"
-          @change="dateChange"
-          :name="name"
-        ></DatetimePicker>
-       </van-sticky>
+    <van-sticky>
+      <DatetimePicker
+        ref="datetimepicker"
+        model="inline"
+        :scroll-change-date="true"
+        :visible.sync="isShowCalendar"
+        :default-datetime="defaultDatetime"
+        :is-show-week-view="isShowWeek"
+        :minute-step="1"
+        :mark-date="markDate"
+        mark-type="dot"
+        week-start="sunday"
+        picker-type="date"
+        :show-today-button="true"
+        :disabled-week-view="false"
+        format="YY/MM/DD hh:mm"
+        @get-height="getHeight"
+        @confirm="dateConfirm"
+        @change="dateChange"
+        :name="name"
+      ></DatetimePicker>
+    </van-sticky>
     <div class="footer" v-if="flagGo!=='4'">
       <div class="fs12 c-gray-base h30 line-height ml15">班次：正常 09:00-18:00</div>
-      <div class=" h40 flex align-items-c border-gb footer-bg">
+      <div class="h40 flex align-items-c border-gb footer-bg">
         <img class="h15 w15 ml15" src="@/assets/images/u20046.png" alt />
         <div class="fs14 ml5">今日打卡{{count}}次，工时共计{{Number(amount).toFixed(2)}}小时</div>
       </div>
-      <div class=" flex pt10 footer-bg">
+      <div class="flex pt10 footer-bg">
         <div class="text-center ml10 white">
-            <div class="w18 h18 fs12 bg-gray radius50">上</div>
-            <div class="lin"></div>
-            <div class="w18 h18 fs12 bg-gray radius50">下</div>
+          <div class="w18 h18 fs12 bg-gray radius50">上</div>
+          <div class="lin"></div>
+          <div class="w18 h18 fs12 bg-gray radius50">下</div>
         </div>
         <div>
           <div class="fs14 fw500 ml15">
-            打卡时间 <span v-if="flagGo!=='4'">{{goWorkTime}}</span>
+            打卡时间
+            <span v-if="flagGo!=='4'">{{goWorkTime}}</span>
             <span class="c-gray-base">(上班 时间 {{workTime}})</span>
           </div>
           <!-- <img class="w30 h20 ml15" src="@/assets/images/u1213.png" alt /> -->
-          <div class="w41 h18 ml15 bg-blue-dark white fs13 text-center text1" v-if="flagGo=='0'">{{text}}</div>
-          <div class="w41 h18 ml15  white fs13 text-center text" v-if="flagGo=='1'||flagGo=='2'">{{text1}}</div>
+          <div
+            class="w41 h18 ml15 bg-blue-dark white fs13 text-center text1"
+            v-if="flagGo=='0'"
+          >{{text}}</div>
+          <div
+            class="w41 h18 ml15 white fs13 text-center text"
+            v-if="flagGo=='1'||flagGo=='2'"
+          >{{text1}}</div>
           <div class="fs14 fw500 ml15 mt50">
-            打卡时间 <span v-if="flagOff!=='4'">{{offWorkTime}}</span>
+            打卡时间
+            <span v-if="flagOff!=='4'">{{offWorkTime}}</span>
             <span class="c-gray-base">(下班 时间 {{workTimeOff}})</span>
           </div>
-          <div class="w41 h18 ml15 bg-blue-dark white fs13 text-center text1" v-if="flagOff=='0'">{{text}}</div>
-           <div class="w41 h18 ml15  fs13 text-center text" v-if="flagOff=='1'||flagOff=='3'">{{text1}}</div>
+          <div
+            class="w41 h18 ml15 bg-blue-dark white fs13 text-center text1"
+            v-if="flagOff=='0'"
+          >{{text}}</div>
+          <div
+            class="w41 h18 ml15 fs13 text-center text"
+            v-if="flagOff=='1'||flagOff=='3'"
+          >{{text1}}</div>
         </div>
       </div>
     </div>
-    <div v-if="flagGo=='4'" class="ml15">
-          今日休息
-        </div>
+    <div v-if="flagGo=='4'" class="ml15">今日休息</div>
   </div>
 </template>
 <script>
 import DatetimePicker from './DatetimePicker.vue'
 import { Sticky } from 'vant'
-import { getDayDetail,getMonthDetail } from '@/api/ebiz/attendance/attendance';
+import { getDayDetail, getMonthDetail } from '@/api/ebiz/attendance/attendance'
 import { formatDate } from './utils/util'
 export default {
   name: 'monthly',
   components: {
-   DatetimePicker,
-   [Sticky.name]: Sticky,
+    DatetimePicker,
+    [Sticky.name]: Sticky,
   },
   data() {
     return {
       currentDate: new Date(),
-      date1:new Date(),
+      date1: new Date(),
       defaultDatetime: new Date(),
       date: '',
       show: false,
       isShowCalendar: true, // 是否显示弹窗
-      disabledWeekView:false,//是否显示周试图
+      disabledWeekView: false, //是否显示周试图
       markDate: [
         {
           color: 'red',
-          date: ['2020/03/25']
+          date: ['2020/03/25'],
         },
         {
           color: '#000000',
-          date: ['2020/03/29']
-        }
+          date: ['2020/03/29'],
+        },
       ], // 对象数组形式的标记日期，可以自定义标记颜色
       // 所有的行事历任务
       isShowWeek: false,
-      workTime:'',
-      workTimeOff:'',
-      count:'',
-      amount:'',
-      time:'',
-      week:'',
-      nomal:[],
-      name:'',
-      rest:[],
-      flagGo:'',
-      flagOff:'',
-      text:'',
-      text1:'',
-      goWorkTime:'',
-      offWorkTime:'',
-
+      workTime: '',
+      workTimeOff: '',
+      count: '',
+      amount: '',
+      time: '',
+      week: '',
+      nomal: [],
+      name: '',
+      rest: [],
+      flagGo: '',
+      flagOff: '',
+      text: '',
+      text1: '',
+      goWorkTime: '',
+      offWorkTime: '',
     }
   },
-  created(){
-    location.reload()
+  created() {
+    $(document).ready(function () {
+      //第一次进入页面刷新一次，仅一次
+      //location.href.indexOf("#")获取当前页面地址并在其中查找"#"首次出现位置，找不到就是-1
+      if (location.href.indexOf('#') == -1) {
+        //在当前页面地址加入"#"，使下次不再进入此判断
+        location.href = location.href + '#'
+        location.reload()
+      }
+    })
     // console.log(JSON.parse(window.localStorage.getItem('obj1')).time)
-    this.date1=new Date(JSON.parse(window.localStorage.getItem('obj1')).time)
-    this.time=JSON.parse(window.localStorage.getItem('obj1')).time
-    this.name=JSON.parse(window.localStorage.getItem('obj1')).name
-    this.getMonthDetail1();
-    this.time=formatDate(this.currentDate, 'YY-MM-DD')
+    this.date1 = new Date(JSON.parse(window.localStorage.getItem('obj1')).time)
+    this.time = JSON.parse(window.localStorage.getItem('obj1')).time
+    this.name = JSON.parse(window.localStorage.getItem('obj1')).name
+    this.getMonthDetail1()
+    this.time = formatDate(this.currentDate, 'YY-MM-DD')
   },
   methods: {
     onConfirm(date) {
@@ -121,172 +140,185 @@ export default {
     },
     //点击日期
     dateChange(e) {
-      this.time=formatDate(e, 'YY-MM-DD')
+      this.time = formatDate(e, 'YY-MM-DD')
       console.log(this.time)
       this.getMonthDetail1()
-      this.week=String(new Date(e).getDay()).replace("0","日").replace("1","一").replace("2","二").replace("3","三").replace("4","四").replace("5","五").replace("6","六")
-        let date={
-            date:String(this.time)
+      this.week = String(new Date(e).getDay())
+        .replace('0', '日')
+        .replace('1', '一')
+        .replace('2', '二')
+        .replace('3', '三')
+        .replace('4', '四')
+        .replace('5', '五')
+        .replace('6', '六')
+      let date = {
+        date: String(this.time),
+      }
+      //日上班
+      getDayDetail(date).then((res) => {
+        console.log(res)
+        if (res.result == 0) {
+          ;(this.workTime = res.content.workTime),
+            (this.workTimeOff = res.content.workTimeoff),
+            (this.count = res.content.count),
+            (this.amount = res.content.amount),
+            (this.flagGo = res.content.flagGo),
+            (this.flagOff = res.content.flagOff),
+            (this.goWorkTime = res.content.goWorkTime),
+            (this.offWorkTime = res.content.offWorkTime)
+          if (this.flagGo == '0' || this.flagOff == '0') {
+            this.goWorkTime = this.goWorkTime.split(' ')[1]
+            this.offWorkTime = this.offWorkTime.split(' ')[1]
+            this.text = '正常'
+          }
+          if (this.flagGo == '1') {
+            this.text1 = '缺勤'
+          }
+          if (this.flagGo == '2') {
+            this.text1 = '迟到'
+          }
+          if (this.flagOff == '3') {
+            this.text1 = '早退'
+          }
         }
-        //日上班
-        getDayDetail(date).then(res=>{
-            console.log(res)
-            if(res.result == 0){
-                this.workTime=res.content.workTime,
-                this.workTimeOff=res.content.workTimeoff,
-                this.count=res.content.count,
-                this.amount=res.content.amount,
-                this.flagGo=res.content.flagGo,
-                this.flagOff=res.content.flagOff,
-                this.goWorkTime=res.content.goWorkTime,
-                this.offWorkTime=res.content.offWorkTime
-                if(this.flagGo=='0'|| this.flagOff=='0'){
-                  this.goWorkTime=this.goWorkTime.split(' ')[1]
-                  this.offWorkTime=this.offWorkTime.split(' ')[1]
-                  this.text='正常'
-                }
-                if(this.flagGo=='1'){
-                  this.text1='缺勤'
-                }
-                if(this.flagGo=='2'){
-                  this.text1='迟到'
-                }
-                if(this.flagOff=='3'){
-                  this.text1='早退'
-                }
-            }
-        })
+      })
     },
-    dateConfirm(date){
+    dateConfirm(date) {
       this.time = utils.formatDate(date, 'YY-MM-DD')
-      this.timeChange= formatDate(date, 'YY-MM')
-      this.week=String(new Date(date).getDay()).replace("0","日").replace("1","一").replace("2","二").replace("3","三").replace("4","四").replace("5","五").replace("6","六")
-      let date1={
-            date:this.time
+      this.timeChange = formatDate(date, 'YY-MM')
+      this.week = String(new Date(date).getDay())
+        .replace('0', '日')
+        .replace('1', '一')
+        .replace('2', '二')
+        .replace('3', '三')
+        .replace('4', '四')
+        .replace('5', '五')
+        .replace('6', '六')
+      let date1 = {
+        date: this.time,
+      }
+      getDayDetail(date1).then((res) => {
+        console.log(res)
+        if (res.result == 0) {
+          ;(this.workTime = res.content.workTime),
+            (this.workTimeOff = res.content.workTimeoff),
+            (this.count = res.content.count),
+            (this.amount = res.content.amount),
+            (this.flagGo = res.content.flagGo),
+            (this.flagOff = res.content.flagOff),
+            (this.goWorkTime = res.content.goWorkTime),
+            (this.offWorkTime = res.content.offWorkTime)
+          if (this.flagGo == '0' || this.flagOff == '0') {
+            this.goWorkTime = this.goWorkTime.split(' ')[1]
+            this.offWorkTime = this.offWorkTime.split(' ')[1]
+            this.text = '正常'
+          }
+          if (this.flagGo == '1') {
+            this.text1 = '缺勤'
+          }
+          if (this.flagGo == '2') {
+            this.text1 = '迟到'
+          }
+          if (this.flagOff == '3') {
+            this.text1 = '早退'
+          }
         }
-       getDayDetail(date1).then(res=>{
-            console.log(res)
-            if(res.result == 0){
-                this.workTime=res.content.workTime,
-                this.workTimeOff=res.content.workTimeoff,
-                this.count=res.content.count,
-                this.amount=res.content.amount,
-                this.flagGo=res.content.flagGo,
-                this.flagOff=res.content.flagOff,
-                this.goWorkTime=res.content.goWorkTime,
-                this.offWorkTime=res.content.offWorkTime
-                if(this.flagGo=='0'|| this.flagOff=='0'){
-                  this.goWorkTime=this.goWorkTime.split(' ')[1]
-                  this.offWorkTime=this.offWorkTime.split(' ')[1]
-                  this.text='正常'
-                }
-                if(this.flagGo=='1'){
-                  this.text1='缺勤'
-                }
-                if(this.flagGo=='2'){
-                  this.text1='迟到'
-                }
-                if(this.flagOff=='3'){
-                  this.text1='早退'
-                }
-            }
-        })
+      })
     },
     //月历
-    getMonthDetail1(){
-      console.log("================"+this.time)
-         let date={
-            date:this.time
-        }
-        if(Date.parse(this.time)<=Date.parse(formatDate(new Date(), 'YY-MM-DD'))){
-            getMonthDetail(date).then(res=>{
-            // console.log(res)
-            if(res.result == 0){
-              let arr1=[]
-              let obj1={}
-              let date1=[]
-              obj1.color='#FFD700'
-             for(let i=0;i<res.content.rest.length;i++){
-                let workTime=res.content.rest[i].split(' ')
-                let workTime1=workTime[0]
-                if(Date.parse(workTime1)<Date.parse(formatDate(new Date(), 'YY-MM-DD'))){
-                    let arr2=res.content.rest.slice(0,i+1)
-                    obj1.date=arr2
-                    // console.log(arr2)
-                }
+    getMonthDetail1() {
+      console.log('================' + this.time)
+      let date = {
+        date: this.time,
+      }
+      if (Date.parse(this.time) <= Date.parse(formatDate(new Date(), 'YY-MM-DD'))) {
+        getMonthDetail(date).then((res) => {
+          // console.log(res)
+          if (res.result == 0) {
+            let arr1 = []
+            let obj1 = {}
+            let date1 = []
+            obj1.color = '#FFD700'
+            for (let i = 0; i < res.content.rest.length; i++) {
+              let workTime = res.content.rest[i].split(' ')
+              let workTime1 = workTime[0]
+              if (Date.parse(workTime1) < Date.parse(formatDate(new Date(), 'YY-MM-DD'))) {
+                let arr2 = res.content.rest.slice(0, i + 1)
+                obj1.date = arr2
+                // console.log(arr2)
               }
-              arr1.push(obj1)
-              // console.log(obj1)
-              // this.mask=arr1
-              let arr=arr1
-              let obj={}
-              let date=[]
-              let arr3=[]
-              obj.color='	#00BFFF'
-              for(let t=0;t<res.content.normal.length;t++){
-                 let workTime=res.content.normal[t].split(' ')
-                let workTime1=workTime[0]
-                 date.push(workTime1)
-                //  console.log(date)
-                 obj.date=date
-              }
-              arr.push(obj)
-              // arr3=arr3.concat(arr1,arr)
-              
-              this.markDate=arr
-              // console.log(this.mask)
             }
-        })  
-        }
-        
+            arr1.push(obj1)
+            // console.log(obj1)
+            // this.mask=arr1
+            let arr = arr1
+            let obj = {}
+            let date = []
+            let arr3 = []
+            obj.color = '	#00BFFF'
+            for (let t = 0; t < res.content.normal.length; t++) {
+              let workTime = res.content.normal[t].split(' ')
+              let workTime1 = workTime[0]
+              date.push(workTime1)
+              //  console.log(date)
+              obj.date = date
+            }
+            arr.push(obj)
+            // arr3=arr3.concat(arr1,arr)
+
+            this.markDate = arr
+            // console.log(this.mask)
+          }
+        })
+      }
     },
-     getHeight(val) {
+    getHeight(val) {
       this.calendarHeight = val
       let taskList = document.getElementsByClassName('footer')[0].previousElementSibling
       taskList.style.height = `${this.calendarHeight + 36}px`
     },
     //滑动结束
-    touchend(e){
+    touchend(e) {
       // console.log(e)
       // console.log(this.time)
       // this.getMonthDetail1()
-    }
+    },
   },
   destroyed: function () {
-          //  console.log("我已经离开了！");
-            localStorage.removeItem('obj1');
- },
+    //  console.log("我已经离开了！");
+    localStorage.removeItem('obj1')
+  },
 }
 </script>
 <style>
 .header {
   width: 100%;
   z-index: 100;
-  height:70px;
+  height: 70px;
 }
 .calendar {
   /* z-index: -1; */
   width: 100%;
 }
-.lin{
-    width: 1px;
-    height: 75px;
-    border-right: 1px solid #ccc;
-    margin-left:7px;
+.lin {
+  width: 1px;
+  height: 75px;
+  border-right: 1px solid #ccc;
+  margin-left: 7px;
 }
-.text{
+.text {
   line-height: 18px;
   border-radius: 10px;
-  background:#FFD700;
-  color:white
+  background: #ffd700;
+  color: white;
 }
-.text1{
-   line-height: 18px;
+.text1 {
+  line-height: 18px;
   border-radius: 10px;
-  background:	#00BFFF;
-  color:white
+  background: #00bfff;
+  color: white;
 }
-.footer-bg{
-  background:#F7F7F7;
+.footer-bg {
+  background: #f7f7f7;
 }
 </style>
\ No newline at end of file