feat: 新增单选时间picker

src/jfw/modules/app/src/web/staticres/jyapp/css/subscribe.css

@@ -859,10 +859,20 @@ font-weight: bold;
   background: #fff;
   border-bottom: 1px solid #E6E6E6;
 }
+.filter_tab .van-dropdown-menu__title .van-ellipsis .rootstyletitle > span:first-child {
+    vertical-align: middle;
+}
+.filter_tab .van-dropdown-menu__title .van-ellipsis {
+    font-size: 0.28rem;
+    line-height: 0.44rem;
+    height: 0.48rem;
+}
 .filter_tab .van-dropdown-menu__title{
   padding: 0 8px 0 0;
 }
 .filter_tab .van-dropdown-menu__title .rootstyletitle{
+  display: inline-block;
+  height: 100%;
   font-size: .28rem;
   font-weight: 500;
   color: #c0c4cc;

src/jfw/modules/app/src/web/staticres/jyapp/js/historypush.js

@@ -176,7 +176,7 @@ var vm = new Vue({
         start: parseInt(time.split('_')[0] * 1000),
         end: parseInt(time.split('_')[0] * 1000),
       }
-      this.tagText.timeText = new Date(pushtime.start).pattern('yyyy.MM.dd') + '~' + new Date(pushtime.end).pattern('yyyy.MM.dd')
+      this.tagText.timeText = new Date(pushtime.end).pattern('yyyy.MM.dd')
       this.selectDate.startDate = pushtime.start
       this.selectDate.endDate= pushtime.end
       this.selectDate.exact = 'exact'
@@ -234,7 +234,7 @@ var vm = new Vue({
             break
           }
           case 'exact': {
-            this.tagText.timeText = new Date(timeRange.start*1000).pattern('yyyy.MM.dd') + '~' + new Date(timeRange.end*1000).pattern('yyyy.MM.dd')
+            this.tagText.timeText = new Date(timeRange.end*1000).pattern('yyyy.MM.dd')
             break
           }
         }

src/jfw/modules/app/src/web/templates/weixin/historypush.html

@@ -142,7 +142,7 @@
                 </div> -->
                     <van-dropdown-menu style="width: auto;overflow-x: auto;">
                         <van-dropdown-item get-container="#dropDownItemGroup" :lazy-render="false" :title="tagText.timeText"  ref="dateItem" @open="open" @close="close">
-                            <date-component :key="setTimer.datetimer" @cancel="cancel" @confirm="confirm" :selectdate="selectDate"/>
+                            <date-component type="only-picker" :key="setTimer.datetimer" @cancel="cancel" @confirm="confirm" :selectdate="selectDate"/>
                         </van-dropdown-item>
                         <van-dropdown-item get-container="#dropDownItemGroup" :lazy-render="false" ref="areaItem" @open="open" @close="close">
                             <template #title>

src/web/staticres/common-module/collection/js/date-mobile.js

@@ -1,82 +1,100 @@
-var dateComponentTemplate = `<div class="j-container">
-<div class="dateTags j-main">
-    <div class="timeTag">
-    <div class="area-card-item" :class="{active:item.selected==true}" v-for="(item, index) in timeSelectList" :key="index" @click="selectFixedDate(item)">{{item.name}}</div>
-    </div>
-    <div class="timePicker" @click="dateShowEvent" :class="{clickactive:dateStyle==true}">
-    <van-field @focus="getStratFocus" v-model="dateTimePickerState.startPlaceHolder" placeholder="开始时间"></van-field>
-    <div class="line"></div>
-    <van-field @focus="getEndFocus" v-model="dateTimePickerState.endPlaceHolder" placeholder="结束时间"></van-field>
-    </div>
-</div>
-<van-popup v-model="datePicker.startshow" :safe-area-inset-bottom="true" get-container="#date-picker-other-box" round position="bottom" :style="{ height: '43%' }">
-    <div class="j-container">
-      <div class="j-header">
-        <div class="headertitle">
-          <div class="title_left">
-            选择开始时间
-          </div>
-          <span class="title_close" @click="pickerClose">
-          </span>
-        </div>
+var dateComponentTemplate = `
+<div class="j-container">
+  <div class="dateTags j-main" v-if="type === 'more-picker'">
+      <div class="timeTag">
+          <div class="area-card-item" :class="{active:item.selected==true}" v-for="(item, index) in timeSelectList" :key="index" @click="selectFixedDate(item)">{{item.name}}</div>
       </div>
-      <div class="j-main main-hidden">
-        <van-datetime-picker
-          class="datepopup"
-          :show-toolbar="false"
-          swipe-duration="300"
-          v-model="datePicker.startcurrentDate"
-          type="date"
-          title="选择年月日"
-          ref="getstartValues"
-          :formatter="formatter"
-          :min-date="datePicker.minDate"
-          :max-date="datePicker.maxDate"
-        >
-        </van-datetime-picker>
+      <div class="timePicker" @click="dateShowEvent" :class="{clickactive:dateStyle==true}">
+        <van-field @focus="getStratFocus" v-model="dateTimePickerState.startPlaceHolder" placeholder="开始时间"></van-field>
+        <div class="line"></div>
+        <van-field @focus="getEndFocus" v-model="dateTimePickerState.endPlaceHolder" placeholder="结束时间"></van-field>
       </div>
-      <div class="j-footer">
-        <div class="j-button-group">
-          <button class="j-button-cancel" @click="resetStart">重置</button>
-          <button class="j-button-confirm" @click="onStartConfirm">确认</button>
+  </div>
+  <div v-if="type === 'more-picker'">
+    <van-popup v-model="datePicker.startshow" :safe-area-inset-bottom="true" get-container="#date-picker-other-box" round position="bottom" :style="{ height: '43%' }">
+      <div class="j-container">
+        <div class="j-header">
+          <div class="headertitle">
+            <div class="title_left">
+              选择开始时间
+            </div>
+            <span class="title_close" @click="pickerClose">
+            </span>
+          </div>
         </div>
-      </div>
-    </div>
-  </van-popup>
-  <van-popup v-model="datePicker.endshow" :safe-area-inset-bottom="true" get-container="#date-picker-other-box" round position="bottom" :style="{ height: '43%' }">
-    <div class="j-container">
-      <div class="j-header">
-        <div class="headertitle">
-          <div class="title_left">
-            选择结束时间
+        <div class="j-main main-hidden">
+          <van-datetime-picker
+            class="datepopup"
+            :show-toolbar="false"
+            swipe-duration="300"
+            v-model="datePicker.startcurrentDate"
+            type="date"
+            title="选择年月日"
+            ref="getstartValues"
+            :formatter="formatter"
+            :min-date="datePicker.minDate"
+            :max-date="datePicker.maxDate"
+          >
+          </van-datetime-picker>
+        </div>
+        <div class="j-footer">
+          <div class="j-button-group">
+            <button class="j-button-cancel" @click="resetStart">重置</button>
+            <button class="j-button-confirm" @click="onStartConfirm">确认</button>
           </div>
-          <span class="title_close" @click="pickerClose">
-          </span>
         </div>
       </div>
-      <div class="j-main main-hidden">
-        <van-datetime-picker
-          class="datepopup"
-          :show-toolbar="false"
-          swipe-duration="300"
-          v-model="datePicker.endcurrentDate"
-          ref="getendValues"
-          type="date"
-          title="选择年月日"
-          :formatter="formatter"
-          :min-date="datePicker.minDate"
-          :max-date="datePicker.maxDate"
-        >
-        </van-datetime-picker>
-      </div>
-      <div class="j-footer">
-        <div class="j-button-group">
-          <button class="j-button-cancel" @click="resetEnd">重置</button>
-          <button class="j-button-confirm" @click="onendConfirm">确认</button>
+    </van-popup>
+    <van-popup v-model="datePicker.endshow" :safe-area-inset-bottom="true" get-container="#date-picker-other-box" round position="bottom" :style="{ height: '43%' }">
+      <div class="j-container">
+        <div class="j-header">
+          <div class="headertitle">
+            <div class="title_left">
+              选择结束时间
+            </div>
+            <span class="title_close" @click="pickerClose">
+            </span>
+          </div>
+        </div>
+        <div class="j-main main-hidden">
+          <van-datetime-picker
+            class="datepopup"
+            :show-toolbar="false"
+            swipe-duration="300"
+            v-model="datePicker.endcurrentDate"
+            ref="getendValues"
+            type="date"
+            title="选择年月日"
+            :formatter="formatter"
+            :min-date="datePicker.minDate"
+            :max-date="datePicker.maxDate"
+          >
+          </van-datetime-picker>
+        </div>
+        <div class="j-footer">
+          <div class="j-button-group">
+            <button class="j-button-cancel" @click="resetEnd">重置</button>
+            <button class="j-button-confirm" @click="onendConfirm">确认</button>
+          </div>
         </div>
       </div>
-    </div>
-  </van-popup>
+    </van-popup>
+  </div>
+  <div class="j-main" v-if="type === 'only-picker'">
+    <van-datetime-picker
+            class="datepopup"
+            :show-toolbar="false"
+            swipe-duration="300"
+            v-model="datePicker.endcurrentDate"
+            ref="getendValues"
+            type="date"
+            title="选择年月日"
+            :formatter="formatter"
+            :min-date="datePicker.minDate"
+            :max-date="datePicker.maxDate"
+          >
+    </van-datetime-picker>
+  </div>
   <div class="j-footer">
     <div class="j-button-group">
       <button class="j-button-cancel" @click="resetAll">重置</button>
@@ -88,7 +106,18 @@ var dateComponentTemplate = `<div class="j-container">
 
 var dateComponent = {
   name: 'date-mobile',
-  props: ['selectdate'],
+  props: {
+    'selectdate': {
+      type: Object,
+      default: function () {
+        return {}
+      }
+    },
+    'type': {
+      type: String,
+      default: 'more-picker'
+    }
+  },
   template: dateComponentTemplate,
   data:function () {
     return {
@@ -198,6 +227,11 @@ var dateComponent = {
       this.dateTimePickerState.start = ''
       this.dateTimePickerState.end = ''
     },
+    getOnlyPickerState () {
+      const timeState = this.calcNotExactTime('today', this.datePicker.endcurrentDate.getTime())
+      timeState.exact = 'exact'
+      return timeState
+    },
     getState () {
       // timeState.exact: all/lately7/lately30/lastYear/exact5种状态
       // 为true时候表示精确筛选，从时间选择器中获取值(其他为根据当前时间计算出的值)
@@ -240,6 +274,12 @@ var dateComponent = {
         day30: 60 * 60 * 1000 * 24 * 30
       }
       switch (exact) {
+        case 'today': {
+          const today = +new Date(new Date(endTime).Format('yyyy/MM/dd'))
+          t.start = today
+          t.end = today + durations.day1 - 1000
+          break
+        }
         case 'lately7': {
           t.start = t.end - durations.day7
           break
@@ -364,7 +404,7 @@ var dateComponent = {
     onConfirm: function(){
       let params = {
         name: 'dateItem',
-        data: this.getState()
+        data: this.type === 'more-picker' ? this.getState() : this.getOnlyPickerState()
       }
       this.$emit('confirm', params)
       return params

src/web/staticres/vipsubscribe/css/subscribe_list.css

@@ -162,10 +162,20 @@ font-weight: bold;
   background: #fff;
   font-size: 15px;
 }
+.filter_tab .van-dropdown-menu__title .van-ellipsis .rootstyletitle > span:first-child {
+    vertical-align: middle;
+}
+.filter_tab .van-dropdown-menu__title .van-ellipsis {
+    font-size: 0.28rem;
+    line-height: 0.44rem;
+    height: 0.48rem;
+}
 .filter_tab .van-dropdown-menu__title{
   padding: 0 8px 0 0;
 }
 .filter_tab .van-dropdown-menu__title .rootstyletitle{
+  display: inline-block;
+  height: 100%;
   font-size: .28rem;
   font-weight: 500;
   color: #c0c4cc;
@@ -583,4 +593,4 @@ display: flex;
   border: 1px solid #FB483D;
   border-radius: .16rem;
   font-size: .26rem;
-}
+}

src/web/staticres/vipsubscribe/js/historypush.js

@@ -160,7 +160,7 @@ var vm = new Vue({
         start: parseInt(time.split('_')[0] * 1000),
         end: parseInt(time.split('_')[0] * 1000),
       }
-      this.tagText.timeText = new Date(pushtime.start).pattern('yyyy.MM.dd') + '~' + new Date(pushtime.end).pattern('yyyy.MM.dd')
+      this.tagText.timeText = new Date(pushtime.end).pattern('yyyy.MM.dd')
       this.selectDate.startDate = pushtime.start
       this.selectDate.endDate= pushtime.end
       this.selectDate.exact = 'exact'
@@ -217,7 +217,7 @@ var vm = new Vue({
             break
           }
           case 'exact': {
-            this.tagText.timeText = new Date(timeRange.start*1000).pattern('yyyy.MM.dd') + '~' + new Date(timeRange.end*1000).pattern('yyyy.MM.dd')
+            this.tagText.timeText = new Date(timeRange.end*1000).pattern('yyyy.MM.dd')
             break
           }
         }

src/web/templates/weixin/historypush.html

@@ -589,9 +589,9 @@
                 </p>
             </div>
         </div> -->
-        <van-dropdown-menu style="width: auto;overflow-x: auto;" :class="{iosMeau:iosMeauStyle==true}">
+        <van-dropdown-menu style="width: auto;overflow-x: auto;">
             <van-dropdown-item get-container="#dropDownItemGroup" :lazy-render="false" :title="tagText.timeText"  ref="dateItem" id="showDatePicker" @open="open" @close="close">
-                <date-component :key="setTimer.datetimer" ref="datecom" @cancel="cancel" @confirm="confirm" :selectdate="selectDate"/>
+                <date-component type="only-picker" :key="setTimer.datetimer" ref="datecom" @cancel="cancel" @confirm="confirm" :selectdate="selectDate"/>
             </van-dropdown-item>
             <van-dropdown-item get-container="#dropDownItemGroup" :lazy-render="false" ref="areaItem" @open="open" @close="close">
                 <template #title>