dm-vue3-ui/es/multiple-filter/component/date-range.vue.js

This Components Library will help get you started developing in Vue 3.

import { RangePicker } from "ant-design-vue/es";
import { defineComponent, ref, openBlock, createElementBlock, createVNode, unref, nextTick } from "vue";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
const _hoisted_1 = { class: "data-range-filter" };
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "date-range",
  props: {
    data: { default: () => ({}) }
  },
  emits: ["apply"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const value = ref([]);
    const openChange = () => {
      value.value = [];
    };
    const emit = __emit;
    const pickerOk = (dates) => {
      let data = { field: props.data.field, value: dates };
      nextTick(() => {
        emit("apply", data);
      });
    };
    return (_ctx, _cache) => {
      const _component_a_range_picker = RangePicker;
      return openBlock(), createElementBlock("div", _hoisted_1, [
        createVNode(_component_a_range_picker, {
          locale: unref(locale),
          value: value.value,
          "onUpdate:value": _cache[0] || (_cache[0] = ($event) => value.value = $event),
          placeholder: _ctx.data.placeholder,
          "value-format": "YYYY-MM-DD HH:mm:ss",
          onChange: pickerOk,
          onOpenChange: openChange,
          showTime: "",
          bordered: false,
          ranges: _ctx.data.ranges,
          disabled: _ctx.data.disabled,
          style: { "width": "100%" }
        }, null, 8, ["locale", "value", "placeholder", "ranges", "disabled"])
      ]);
    };
  }
});
export {
  _sfc_main as default
};