Merge branch 'product' of git.mes123.com:zhouyx/mes-ui into product-rjt

components/page/dateRange.vue

 <template>
   <div class="time-view" v-if="startDate && endDate">
-    <div>{{ startDate }}</div>
-    <div class="jian-tou">
-      <div>{{ jg }} {{ unit }}</div>
-    </div>
-    <div>{{ endDate }}</div>
+    <span>{{ startDate }}</span>
+      <span  class="jian-tou">{{ jg }} {{ unit }}</span>
+    <span>{{ endDate }}</span>
   </div>
 </template>
 <script>
+import dayjs from "dayjs";
 export default {
   name: "",
   data() {
     return {
       startDate: null,
       endDate: null,
-      unit: "h",
+      unit: "天",
       jg: 0,
     };
   },
@@ -48,36 +47,12 @@ export default {
   methods: {
     init(v) {
       if (v) {
-        this.startDate = v[this.start];
-        this.endDate = v[this.end];
+        var start = dayjs(v[this.start]);
+        var end = dayjs(v[this.end]);
+        this.startDate=start.format("YYYY-MM-DD");
+        this.endDate=end.format("YYYY-MM-DD");
+        this.jg=end.diff(start,'day');
       }
-
-      this.unit = this.mode;
-      var date1 = new Date(this.startDate).getTime(); //开始时间，时间戳
-      var date2 = new Date(this.endDate).getTime(); //结束时间，时间戳
-
-      this.jg = date2 - date1;
-      var result = "";
-      var minute = 1000 * 60;
-      var hour = minute * 60;
-      var day = hour * 24;
-      var month = day * 30;
-      if (this.jg < 0) return;
-      var monthC = this.jg / month;
-      var weekC = this.jg / (7 * day);
-      var dayC = this.jg / day;
-      var hourC = this.jg / hour;
-      var minC = this.jg / minute;
-      if (this.unit == "m") {
-        result = "" + parseInt(monthC);
-      } else if (this.unit == "w") {
-        result = "" + parseInt(weekC);
-      } else if (this.unit == "d") {
-        result = "" + parseInt(dayC);
-      } else if (this.unit == "h") {
-        result = "" + parseInt(hourC);
-      }
-      this.jg = result;
     },
   },
   watch: {
@@ -92,21 +67,19 @@ export default {
 </script>
 <style lang="less">
 .time-view {
-  // width: 600px;
-  display: -webkit-flex;
-  display: flex;
+  display: inline-block;
 
   .jian-tou {
     min-width: 55px;
     text-align: center;
-    margin: 5px;
+   padding: 0 5px 2px 5px;
     background-image: url("../../assets/imgicon/range.png");
     background-size: 100%;
     background-repeat: no-repeat;
-    margin-top: 7px;
-    div {
-      margin-top: -13px;
-    }
+    background-position: bottom right;
+    // border-bottom: #eee 2px solid;
+    size: 12px;
+    font-weight: bold;
   }
 }
 </style>