import ksPopup from '../popup';
import ksButton from '../button';
import Mixins from './mixin.js';
import "./date-picker-bottom.css";
var titleMap = {
  'date': '日期选择',
  'daterange': '日期选择',
  'month': '月份选择',
  'monthrange': '月份选择',
  'week': '周选择',
  'quarter': '季度选择'
};
import './date-picker-bottom-sfc.css';

var __vue_render__ = function __vue_render__() {
  var _vm = this;

  var _h = _vm.$createElement;

  var _c = _vm._self._c || _h;

  return _c('ks-popup', {
    staticClass: "ks-date-picker-bottom-popup",
    attrs: {
      "value": _vm.value,
      "position": "bottom",
      "get-container": "body",
      "duration": "0.2",
      "closeable": true,
      "close-on-click-overlay": false
    },
    on: {
      "input": _vm.handleClosePopup,
      "open": _vm.handleOpenPopup
    }
  }, [_c('div', {
    staticClass: "ks-date-picker ks-date-picker-bottom"
  }, [_c('div', {
    staticClass: "ks-date-picker-bottom__header"
  }, [_c('div', {
    staticClass: "ks-date-picker-bottom__header-title"
  }, [_c('span', {
    staticClass: "ks-date-picker-bottom__header-title-text"
  }, [_vm._v(_vm._s(_vm.title))]), _vm._v(" "), _c('span', {
    staticClass: "ks-date-picker-bottom__header-title-start"
  }, [_vm._v(_vm._s(_vm.startText))]), _vm._v(" "), _c('span', {
    directives: [{
      name: "show",
      rawName: "v-show",
      value: _vm.type.includes('range') && _vm.startText,
      expression: "type.includes('range') && startText"
    }],
    staticClass: "ks-date-picker-bottom__header-title-split"
  }, [_vm._v(" - ")]), _vm._v(" "), _c('span', {
    directives: [{
      name: "show",
      rawName: "v-show",
      value: _vm.type.includes('range') && _vm.startText,
      expression: "type.includes('range') && startText"
    }],
    staticClass: "ks-date-picker-bottom__header-title-end",
    class: {
      'ks-date-picker-bottom__header-title-end-not': _vm.startText && !_vm.endText
    }
  }, [_vm._v("\n          " + _vm._s(_vm.endText || (_vm.type === 'monthrange' ? '结束月份' : '结束时间')) + "\n        ")])])]), _vm._v(" "), _c('div', {
    staticClass: "ks-date-picker__body"
  }, [_c(_vm.currentCom, _vm._b({
    ref: "selector",
    tag: "component",
    on: {
      "select": _vm.handleSelect,
      "change-type": _vm.changeType
    }
  }, 'component', _vm.$attrs, false))], 1), _vm._v(" "), _vm.showConfirm ? _c('div', {
    staticClass: "ks-date-picker-bottom__footer"
  }, [_c('ks-button', {
    staticClass: "van-calendar__confirm",
    attrs: {
      "type": "primary",
      "disabled": !_vm.currentSelectedValue,
      "block": ""
    },
    on: {
      "click": _vm.handleConfirm
    }
  }, [_vm._v("确定")])], 1) : _vm._e()])]);
};

var __vue_staticRenderFns__ = [];
export default {
  render: __vue_render__,
  staticRenderFns: __vue_staticRenderFns__,
  name: 'date-picker-bottom',
  mixins: [Mixins],
  components: {
    ksPopup: ksPopup,
    ksButton: ksButton
  },
  data: function data() {
    return {
      dateweekmonthType: 'date'
    };
  },
  computed: {
    title: function title() {
      if (this.type === 'dateweekmonth') {
        return titleMap[this.dateweekmonthType];
      } else {
        return titleMap[this.type];
      }
    }
  },
  methods: {
    changeType: function changeType(e) {
      this.dateweekmonthType = e;
    }
  }
};