填报--- 时间操作

liuqimichale
1 parent 513e06e5
Showing 5 changed files with 57 additions and 8 deletions
index/index.html
resource/public/commoncss.css
topages/workfill/workfill.css
topages/workfill/workfill.html
topages/workfill/workfill.js
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <title>Title</title>
+    <title>工时系统</title>
     <link rel="stylesheet" id="pageCssLink" type="text/css" href=""/>
     <link rel="stylesheet" href="../resource/lib/bootstrap/css/bootstrap.min.css">
     <link rel="stylesheet" href="../resource/lib/bootstrap-daterangepicker/daterangepicker.css">
@@ -17,6 +17,9 @@ ul,li{
 .cursorpointer{
     cursor: pointer;
 }
+.display-none{
+    display: none;
+}
 /********************************************头部公共样式*/
 header{
     width: 100%;
@@ -21,6 +21,7 @@
     width: 226px;
     height: 40px;
     line-height: 40px;
+    margin-top: 10px;
     font-size: 14px;
     color: rgba(0,0,0,.4);
     background-color: #fff;
 <div class="time-opr-wrap clearfix">
     <div class="float-left time-opr-area">
-        <div class="time-opr-nowtime">2018/07/13</div>
+        <div class="time-opr-nowtime" id="time-opr-nowtime"></div>
         <div class="time-opr-btnwrap clearfix">
-            <div class="time-opr-btn time-opr-prevbtn cursorpointer float-left">上一周</div>
-            <div class="time-opr-btn time-opr-nextbtn cursorpointer float-left">下一周</div>
+            <div class="time-opr-btn time-opr-prevbtn cursorpointer float-left" id="time-opr-prevbtn">上一周</div>
+            <div class="time-opr-btn time-opr-nextbtn cursorpointer float-left display-none" id="time-opr-nextbtn">下一周</div>
         </div>
     </div>
-    <div class="float-right time-opr-show text-center">
-        2018/07/04 - 2018/07/11
-    </div>
+    <div class="float-right time-opr-show text-center" id="time-opr-show"> </div>
 </div>
-<div>1</div>
 \ No newline at end of file
+<div>1</div>
+
+<script src="../topages/workfill/workfill.js"></script>
 \ No newline at end of file
 /**
  * Created by mac on 18/7/25.
  */
+var weekOfday = Number(moment().format('E'));//计算今天是这周第几天
+var clicknum = 0;//定义上下周点击次数
+var fun = {
+    init:function () {
+
+
+        //获取本周时间
+        $('#time-opr-show').text(moment().subtract('days', weekOfday-1).format('YYYY/MM/DD')+' - '+moment().subtract('days', 0).format('YYYY/MM/DD'));
+        // 获取今天时间
+        var todaytime  = moment().subtract('days', 0).format('YYYY/MM/DD');
+        $('#time-opr-nowtime').text(todaytime);
+    },
+    timeoprprevbtn:function () {
+        $('#time-opr-nextbtn').removeClass('display-none');
+        clicknum ++;
+        console.log(clicknum)
+        var start = weekOfday+7*clicknum-1;
+        var end = weekOfday+ clicknum*7-7;
+        $('#time-opr-show').text(moment().subtract('days', start).format('YYYY/MM/DD')+' - '+moment().subtract('days',end).format('YYYY/MM/DD'));
+    },
+    timeoprnextbtn:function () {
+
+        clicknum --;
+        console.log(clicknum)
+        if(clicknum == 0){
+            $('#time-opr-show').text(moment().subtract('days', weekOfday-1).format('YYYY/MM/DD')+' - '+moment().subtract('days', 0).format('YYYY/MM/DD'));
+            $('#time-opr-nextbtn').addClass('display-none');
+        }else{
+            var start = weekOfday+7*clicknum-1;
+            var end = weekOfday+ clicknum*7-7;
+            $('#time-opr-show').text(moment().subtract('days', start).format('YYYY/MM/DD')+' - '+moment().subtract('days',end).format('YYYY/MM/DD'));
+        }
+
+
+    },
+};
+fun.init();
+// 上一周点击time-opr-prevbtn
+$('#time-opr-prevbtn').on('click',function () {
+    fun.timeoprprevbtn();
+});
+// 下一周点击time-opr-nextbtn
+$('#time-opr-nextbtn').on('click',function () {
+    fun.timeoprnextbtn();
+});
 \ No newline at end of file