@kyfe/ks-query-table 0.0.9 → 0.0.11

package/kuasheng-ui/components/ks-date-picker/date-picker-top.vue

@@ -1,88 +0,0 @@
-<template>
-  <van-popup
-    :value="value"
-    position="top"
-    get-container="body"
-    class="ks-date-picker-top-popup"
-    duration="0.2"
-    :closeable="false"
-    :close-on-click-overlay="closeOverlay"
-    close-icon-position="top-left"
-    close-icon="arrow-left"
-    @input="handleClosePopup"
-    @open="handleOpenPopup"
-  >
-    <div class="ks-date-picker ks-date-picker-top">
-      <div class="ks-date-picker-top__header">
-        <div class="ks-date-picker-top__header-title">
-          <span class="ks-date-picker-top__header-title-start">{{startText}}</span>
-          <span v-show="type.includes('range') && startText" class="ks-date-picker-top__header-title-split"> - </span>
-          <span
-            v-show="type.includes('range') && startText"
-            class="ks-date-picker-top__header-title-end"
-            :class="{'ks-date-picker-top__header-title-end-not': startText && !endText}"
-          >
-            {{endText || (type === 'monthrange' ? '结束月份' : '结束时间')}}
-          </span>
-        </div>
-      </div>
-      <div class="ks-date-picker__body">
-        <component
-          ref="selector"
-          :is="currentCom"
-          v-bind="$attrs"
-          @select="handleSelect"
-        />
-      </div>
-      <div v-if="showConfirm" class="ks-date-picker-top__footer">
-        <van-button type="primary" :disabled="!currentSelectedValue" block class="van-calendar__confirm" @click="handleConfirm">确定</van-button>
-      </div>
-    </div>
-  </van-popup>
-</template>
-
-<script>
-import Mixins from './mixin.js'
-
-export default {
-  name: 'date-picker-top',
-  mixins: [Mixins]
-}
-</script>
-
-<style lang="less">
-@import url("./style.less");
-.ks-date-picker-top-popup {
-  height: 85%;
-  border-radius: 0 0 12px 12px;
-  .van-popup__close-icon--top-left {
-    top: 10px;
-    color: #999999;
-  }
-}
-.ks-date-picker-top {
-  height: 85vh;
-  overflow: hidden;
-  display: flex;
-  flex-direction: column;
-  &__header {
-    height: 40px;
-    &-title {
-      .header-title-text();
-    }
-  }
-  &__footer {
-    .footer-btn();
-  }
-}
-.ios .ks-date-picker-top-popup {
-  padding-top: 20px;
-}
-.ipx .ks-date-picker-top-popup {
-  padding-top: 44px;
-}
-
-.afc .ks-date-picker-top-popup {
-  padding-top: var(--status-bar-height, 0px);
-}
-</style>

package/kuasheng-ui/components/ks-date-picker/date-picker.js

@@ -1,15 +0,0 @@
-import { DatePickerBottom, DatePickerTop, DatePickerRight, DatePickerDropdown } from './index.js'
-export default {
-  functional: true,
-  name: 'date-picker',
-  render (h, ctx) {
-    ctx.data.scopedSlots = {
-      ...ctx.scopedSlots
-    }
-    if (ctx.props.horizontal) {
-      return h(DatePickerRight, ctx.data)
-    } else {
-      return h(ctx.props.position === 'dropdown' ? DatePickerDropdown : ctx.props.position === 'top' ? DatePickerTop : DatePickerBottom, ctx.data)
-    }
-  }
-}

package/kuasheng-ui/components/ks-date-picker/date-range-select.vue

@@ -1,92 +0,0 @@
-<template>
-  <van-calendar
-    class="ks-daterange-select"
-    :default-date="currentDate"
-    :poppable="false"
-    :show-confirm="false"
-    :show-title="false"
-    :show-subtitle="false"
-    :min-date="currentMin"
-    :max-date="currentMax"
-    :lazy-render="false"
-    :allow-same-day="true"
-    row-height="44"
-    type="range"
-    @select="handleSelect"
-  />
-</template>
-
-<script>
-import { formatToDate, formatToString } from './utils'
-
-export default {
-  name: 'date-range-select',
-  props: {
-    defaultValue: {
-      type: Array,
-      default: () => ([])
-    },
-    min: [String, Number, Date],
-    max: [String, Number, Date]
-  },
-  data () {
-    return {
-      currentDate: [],
-      currentMin: new Date(),
-      currentMax: new Date()
-    }
-  },
-  created () {
-    this.init()
-  },
-  methods: {
-    init () {
-      if (this.defaultValue.length) {
-        this.currentDate = [formatToDate(this.defaultValue[0]), formatToDate(this.defaultValue[1])]
-      }
-      if (!this.min) {
-        let _date = new Date()
-        let y = _date.getFullYear()
-        let m = _date.getMonth() + 1
-        this.currentMin = (m - 6) < 1 ? new Date(y - 1, 12 + m - 5, 1) : new Date(y, m - 5, 1)
-      } else {
-        this.currentMin = formatToDate(this.min)
-      }
-      if (!this.max) {
-        let _date = new Date()
-        let y = _date.getFullYear()
-        let m = _date.getMonth() + 1
-        this.currentMax = (m + 6) > 12 ? new Date(y + 1, m + 6 - 12, 0) : new Date(y, m + 6, 0)
-      } else {
-        this.currentMax = formatToDate(this.max)
-      }
-    },
-    handleSelect (e) {
-      this.$emit('select', {date: e, str: [formatToString(e[0]), formatToString(e[1])]})
-    }
-  }
-}
-</script>
-
-<style lang="less">
-.ks-daterange-select {
-  .van-calendar__day {
-    margin: 3px 0;
-  }
-  .van-calendar__day--middle {
-    color: #165DFF !important;
-    &::after {
-      top: 0 !important;
-      bottom: 0 !important;
-    }
-  }
-  .van-calendar__day--start, .van-calendar__day--end {
-    margin-left: calc((14.285% - 44px) / 2);
-    margin-right: calc((14.285% - 44px) / 2);
-  }
-  .van-calendar__day--start-end {
-    margin-left: calc((14.285% - 54px) / 2);
-    margin-right: calc((14.285% - 54px) / 2);
-  }
-}
-</style>

package/kuasheng-ui/components/ks-date-picker/date-select.vue

@@ -1,65 +0,0 @@
-<template>
-  <van-calendar
-    :default-date="currentDate"
-    :poppable="false"
-    :show-confirm="false"
-    :show-title="false"
-    :show-subtitle="false"
-    :min-date="currentMin"
-    :max-date="currentMax"
-    :lazy-render="false"
-    row-height="50"
-    type="single"
-    @select="handleSelect"
-  />
-</template>
-
-<script>
-import { formatToDate, formatToString } from './utils'
-
-export default {
-  name: 'date-select',
-  props: {
-    defaultValue: {
-      type: [Date, String, Number],
-      default: new Date()
-    },
-    min: [String, Number, Date],
-    max: [String, Number, Date]
-  },
-  data () {
-    return {
-      currentDate: null,
-      currentMin: new Date(),
-      currentMax: new Date()
-    }
-  },
-  created () {
-    this.init()
-  },
-  methods: {
-    init () {
-      this.currentDate = formatToDate(this.defaultValue)
-      if (!this.min) {
-        let _date = new Date()
-        let y = _date.getFullYear()
-        let m = _date.getMonth() + 1
-        this.currentMin = (m - 6) < 1 ? new Date(y - 1, 12 + m - 5, 1) : new Date(y, m - 5, 1)
-      } else {
-        this.currentMin = formatToDate(this.min)
-      }
-      if (!this.max) {
-        let _date = new Date()
-        let y = _date.getFullYear()
-        let m = _date.getMonth() + 1
-        this.currentMax = (m + 6) > 12 ? new Date(y + 1, m + 6 - 12, 0) : new Date(y, m + 6, 0)
-      } else {
-        this.currentMax = formatToDate(this.max)
-      }
-    },
-    handleSelect (e) {
-      this.$emit('select', {date: e, str: formatToString(e)})
-    }
-  }
-}
-</script>

package/kuasheng-ui/components/ks-date-picker/date-week-month.vue

@@ -1,131 +0,0 @@
-<template>
-  <div class="ks-date-week-month-picker">
-    <div class="ks-date-week-month-picker__header">
-      <div class="ks-date-week-month-picker__header-btn">
-        <van-button
-          :class="{'ks-date-week-month-picker__header-btn__action': currentType === 'date'}"
-          round
-          @click="handleChangeType('date')"
-        >
-          日期选择
-        </van-button>
-      </div>
-      <div class="ks-date-week-month-picker__header-btn">
-        <van-button
-          :class="{'ks-date-week-month-picker__header-btn__action': currentType === 'week'}"
-          round
-          @click="handleChangeType('week')"
-        >
-          周选择
-        </van-button>
-      </div>
-      <div class="ks-date-week-month-picker__header-btn">
-        <van-button
-          :class="{'ks-date-week-month-picker__header-btn__action': currentType === 'month'}"
-          round
-          @click="handleChangeType('month')"
-        >
-          月份选择
-        </van-button>
-      </div>
-    </div>
-    <div class="ks-date-week-month-picker__body">
-      <component
-        ref="com"
-        :is="currentCom"
-        v-bind="$attrs"
-        @select="handleSelect"
-      />
-    </div>
-  </div>
-</template>
-
-<script>
-import {
-  DateSelect,
-  MonthSelect,
-  WeekSelect
-} from './index'
-import { typeToSelectotMap } from './utils'
-
-export default {
-  name: 'date-week-month',
-  components: {
-    DateSelect,
-    MonthSelect,
-    WeekSelect
-  },
-  data () {
-    return {
-      currentType: 'date'
-    }
-  },
-  computed: {
-    currentCom () {
-      return typeToSelectotMap[this.currentType]
-    }
-  },
-  methods: {
-    init () {
-      this.$refs.com.init()
-    },
-    handleChangeType (e) {
-      this.currentType = e
-      this.$emit('change-type', e)
-      this.$nextTick(() => {
-        this.init()
-      })
-    },
-    handleSelect (e) {
-      this.$emit('select', e, this.currentType)
-    }
-  }
-}
-</script>
-
-<style lang="less">
-.ks-date-week-month-picker {
-  display: flex;
-  flex-direction: column;
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  &__header {
-    height: 62px;
-    display: flex;
-    box-shadow: 0 3px 10px 0 rgba(235,235,235,0.30);
-    &-btn {
-      flex: 1;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      .van-button--normal {
-        font-size: 14px;
-        color: #2F2F2F;
-      }
-      .van-button--default {
-        background-color: #F3F4F6;
-        border-color: #F3F4F6;
-      }
-      &__action {
-        background-color: #F1F0FE !important;
-        border-color: rgba(22,93,255,0.30) !important;
-      }
-    }
-  }
-  &__body {
-    flex: 1;
-    overflow: hidden;
-    position: relative;
-    > .van-calendar, > .van-calendar__body {
-      position: absolute;
-      bottom: 0;
-      top: 0;
-      left: 0;
-      right: 0;
-    }
-  }
-}
-</style>

package/kuasheng-ui/components/ks-date-picker/index.js

@@ -1,12 +0,0 @@
-export { default as DateSelect } from './date-select.vue'
-export { default as DateRangeSelect } from './date-range-select.vue'
-export { default as MonthSelect } from './month-select.vue'
-export { default as MonthRangeSelect } from './month-range-select.vue'
-export { default as WeekSelect } from './week-select.vue'
-export { default as QuarterSelect } from './quarter-select.vue'
-export { default as DateWeekMonth } from './date-week-month.vue'
-export { default as DatePickerBottom } from './date-picker-bottom.vue'
-export { default as DatePickerTop } from './date-picker-top.vue'
-export { default as DatePickerRight } from './date-picker-right.vue'
-export { default as DatePickerDropdown } from './date-picker-dropdown.vue'
-export { default } from './date-picker.js'

package/kuasheng-ui/components/ks-date-picker/mixin.js

@@ -1,92 +0,0 @@
-import { typeToSelectotMap } from './utils'
-import {
-  DateSelect,
-  DateRangeSelect,
-  MonthSelect,
-  MonthRangeSelect,
-  WeekSelect,
-  QuarterSelect,
-  DateWeekMonth
-} from './index'
-
-export default {
-  components: {
-    DateSelect,
-    DateRangeSelect,
-    MonthSelect,
-    MonthRangeSelect,
-    WeekSelect,
-    QuarterSelect,
-    DateWeekMonth
-  },
-  props: {
-    value: {
-      type: Boolean,
-      default: false
-    },
-    type: {
-      type: String,
-      default: 'date'
-    },
-    showConfirm: {
-      type: Boolean,
-      default: true
-    },
-    closeOverlay: {
-      type: Boolean,
-      default: false
-    }
-  },
-  watch: {
-    value(val) {
-      window.ks && window.ks.setCloseButton && window.ks.setCloseButton({ isShow: !val })
-    }
-  },
-  data () {
-    return {
-      currentCom: null,
-      currentSelectedValue: null,
-      startText: '',
-      endText: ''
-    }
-  },
-  methods: {
-    init () {
-      this.currentCom = typeToSelectotMap[this.type]
-      this.$nextTick(() => {
-        this.$refs.selector.init()
-      })
-    },
-    handleOpenPopup () {
-      this.init()
-    },
-    handleClosePopup (e) {
-      this.$emit('input', e)
-      this.currentCom = null
-      this.currentSelectedValue = null
-      this.startText = ''
-      this.endText = ''
-    },
-    handleSelect (e, type = this.type) {
-      this.$emit('select', e)
-      this.currentSelectedValue = e
-      if (this.type === 'dateweekmonth') {
-        this.dateweekmonthType = type
-      }
-      if (type === 'week') {
-        this.startText = `${e.year}年 ${e.num < 10 ? '0' + e.num : e.num}周(${e.week.startDayStr}~${e.week.endDayStr})`
-      } else if (type === 'quarter') {
-        this.startText = `${e.year}年 ${e.cn}`
-      } else if (type === 'month' || type === 'date') {
-        this.startText = e.str
-      } else if (type === 'monthrange' || type === 'daterange') {
-        this.startText = e.str[0]
-        this.endText = e.str[1]
-      }
-    },
-    handleConfirm () {
-      this.$emit('confirm', this.currentSelectedValue)
-      this.handleClosePopup(false)
-    }
-  }
-}

package/kuasheng-ui/components/ks-date-picker/month-range-select.vue

@@ -1,129 +0,0 @@
-<template>
- <div class="van-calendar__body" ref="body">
-    <div class="van-calendar__month" v-for="y of years" :key="y">
-      <div class="van-calendar__month-title">{{y}}年</div>
-      <div class="van-calendar__days">
-        <div
-          class="van-calendar__day ks-month__day"
-          v-for="m of months"
-          :key="m"
-          :class="{
-            'van-calendar__day--disabled': (currentMin && +new Date(`${y}/${m}/1`) < currentMin) || (currentMax && +new Date(`${y}/${m}/1`) > currentMax)
-          }"
-          @click="handleSelect(y, m, (currentMin && +new Date(`${y}/${m}/1`) < currentMin) || (currentMax && +new Date(`${y}/${m}/1`) > currentMax))"
-        >
-          <div
-            :class="{
-              'van-calendar__day--start': +currentStart === +new Date(`${y}/${m}/1`) && +currentEnd !== +new Date(`${y}/${m}/1`),
-              'van-calendar__day--end': +currentEnd === +new Date(`${y}/${m}/1`) && +currentStart !== +new Date(`${y}/${m}/1`),
-              'van-calendar__day--middle': +currentStart < +new Date(`${y}/${m}/1`) && +currentEnd > +new Date(`${y}/${m}/1`),
-              'van-calendar__day--start-end': +currentStart === +new Date(`${y}/${m}/1`) && +currentEnd === +new Date(`${y}/${m}/1`)
-            }">
-            {{m}}月
-            <div
-              v-if="+currentStart === +new Date(`${y}/${m}/1`) || +currentEnd === +new Date(`${y}/${m}/1`)"
-              class="van-calendar__bottom-info"
-            >
-              {{
-                +currentStart === +new Date(`${y}/${m}/1`) && +currentEnd === +new Date(`${y}/${m}/1`)
-                  ? '开始/结束'
-                  : +currentStart === +new Date(`${y}/${m}/1`) && +currentEnd !== +new Date(`${y}/${m}/1`)
-                  ? '开始'
-                  : '结束'
-              }}
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import { getRangeYears, foramtToMonth, formatToString } from './utils'
-
-export default {
-  name: 'month-range-select',
-  props: {
-    defaultValue: {
-      type: Array,
-      default: () => ([])
-    },
-    yearRange: {
-      type: Array,
-      default: () => [new Date().getFullYear() - 5, new Date().getFullYear()],
-    },
-    horizontal: {
-      type: Boolean,
-      default: false
-    },
-    min: [String, Number, Date],
-    max: [String, Number, Date]
-  },
-  data () {
-    return {
-      years: getRangeYears(this.yearRange),
-      months: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
-      currentStart: null,
-      currentEnd: null,
-      currentMin: null,
-      currentMax: null
-    }
-  },
-  methods: {
-    init () {
-      this.currentMin = this.min ? +foramtToMonth(this.min) : null
-      this.currentMax = this.max ? +foramtToMonth(this.max) : null
-      if (this.defaultValue.length === 2) {
-        let _start = foramtToMonth(this.defaultValue[0])
-        let _end = foramtToMonth(this.defaultValue[1])
-        if (_start && _end) {
-          this.currentStart = _start
-          let monthStr = formatToString(_end, 'month')
-          let arr = monthStr.split('/')
-          this.handleSelect(arr[0], arr[1], false)
-        } else if (_start && !_end) {
-          let monthStr = formatToString(_start, 'month')
-          let arr = monthStr.split('/')
-          this.handleSelect(arr[0], arr[1], false)
-        }
-        this.scrollInto()
-      }
-    },
-    scrollInto() {
-      setTimeout(() => {
-        if (this.currentMonth) {
-          let top = this.$el.querySelector('.van-calendar__day--start')
-          this.$refs.body.scrollTop = top ? top.getBoundingClientRect().top - 100 : 0
-        }
-      }, 240)
-    },
-    handleSelect(y, m, disabled) {
-      if (!disabled) {
-        let _month = foramtToMonth(`${y}/${m}`)
-        if (this.currentStart && !this.currentEnd && +this.currentStart <= +_month) {
-          this.currentEnd = _month
-          this.$emit('select', {
-            date: [this.currentStart, this.currentEnd],
-            str: [formatToString(this.currentStart, 'month'), formatToString(this.currentEnd, 'month')]
-          })
-        } else {
-          this.currentEnd = null
-          this.currentStart = _month
-          this.$emit('select', {
-            date: [this.currentStart, null],
-            str: [formatToString(this.currentStart, 'month'), '']
-          })
-        }
-      }
-    }
-  }
-}
-</script>
-
-<style lang="less">
-.ks-month__day {
-  width: 16.666%;
-  height: 50px;
-}
-</style>