Kaynağa Gözat

feat: pc端时间选择器添加beforeChange

cuiyalong 1 yıl önce
ebeveyn
işleme
8313c32357

+ 11 - 3
apps/bigmember_pc/src/components/selector/SearchTimeScopeSelector.vue

@@ -3,6 +3,7 @@
     <TimeSelectorContent
       ref="content"
       :options="options"
+      :beforeChange="beforeChange"
       :selectorTime="type"
       selectorType="line"
       :defaultSelectedKey="value"
@@ -23,12 +24,17 @@ export default {
     event: 'input'
   },
   props: {
+    beforeChange: Function,
     options: {
       type: Array,
       default() {
         return []
       }
     },
+    splitter: {
+      type: String,
+      default: '_'
+    },
     value: {
       type: String,
       default: 'thisyear'
@@ -61,15 +67,16 @@ export default {
   },
   methods: {
     syncState(val) {
+      const splitter = this.splitter // 默认_
       const time = this.transformTimeBefore(val)
-      if (time.indexOf('_') === -1) {
+      if (time.indexOf(splitter) === -1) {
         this.selectTime = {
           start: 0,
           end: 0,
           exact: time
         }
       } else {
-        const times = time.split('_')
+        const times = time.split(splitter)
         this.selectTime = {
           start: times[0] * 1000,
           end: times[1] * 1000,
@@ -109,8 +116,9 @@ export default {
       return timeMap[time] || time
     },
     onChange(state) {
+      const split = this.splitter
       if (state.exact === 'exact') {
-        this.$emit('input', `${state.start / 1000}_${state.end / 1000}`)
+        this.$emit('input', `${state.start / 1000}${split}${state.end / 1000}`)
       } else {
         this.$emit('input', this.transformTimeAfter(state.exact))
       }

+ 12 - 0
apps/bigmember_pc/src/components/selector/TimeSelectorContent.vue

@@ -233,6 +233,7 @@ export default {
     [DatePicker.name]: DatePicker
   },
   props: {
+    beforeChange: Function,
     selectorType: {
       type: String,
       default: 'card' // card/line
@@ -539,6 +540,17 @@ export default {
       return t
     },
     clickTimeButton(item) {
+      const beforeChange = this.beforeChange
+      if (beforeChange) {
+        const pass = beforeChange(item)
+        if (pass) {
+          this.changeSelectItem(item)
+        }
+      } else {
+        this.changeSelectItem(item)
+      }
+    },
+    changeSelectItem(item) {
       if (item.selected) return
       this.timeSelectList.forEach((v) => (v.selected = false))
       item.selected = true