UNPKG

xdesign-vue-next

Version:

XDesign Component for vue-next

196 lines (192 loc) 8.09 kB
/** * xdesign v1.0.6 * (c) 2023 xdesign * @license MIT */ import { _ as _defineProperty } from '../../_chunks/dep-f9e836af.mjs'; import { defineComponent, toRefs, ref, computed, nextTick, onMounted, watch, createVNode, mergeProps } from 'vue'; import { d as dayjs } from '../../_chunks/dep-6fe15f5a.mjs'; import { c as customParseFormat } from '../../_chunks/dep-1671cde7.mjs'; import { DEFAULT_FORMAT, DEFAULT_STEPS } from '../../_common/js/time-picker/const.mjs'; import { panelProps } from './props.mjs'; import SinglePanel from './single-panel.mjs'; import TButton from '../../button/button.mjs'; import { usePrefixClass } from '../../hooks/useConfig.mjs'; import { useConfig } from '../../config-provider/useConfig.mjs'; import '../../_chunks/dep-82805301.mjs'; import '../../_chunks/dep-10a947a6.mjs'; import '../../_chunks/dep-e727a519.mjs'; import '../../_chunks/dep-6ad18815.mjs'; import '../../_chunks/dep-1cc1c24f.mjs'; import '../../_chunks/dep-b75d8d74.mjs'; import '../../_chunks/dep-7dcfa37a.mjs'; import '../../_chunks/dep-addc2a84.mjs'; import '../../_chunks/dep-b9fae426.mjs'; import '../props.mjs'; import '../../_chunks/dep-32d4c595.mjs'; import '../../_chunks/dep-89b966f4.mjs'; import '../../_chunks/dep-0c786bea.mjs'; import '../../_chunks/dep-a666b9ad.mjs'; import '../../_chunks/dep-7f239c43.mjs'; import '../../_chunks/dep-0e832fc7.mjs'; import '../../_chunks/dep-5755c21c.mjs'; import '../../_chunks/dep-e1ab85c5.mjs'; import '../../_chunks/dep-71f84cf2.mjs'; import '../../_chunks/dep-4903a8a8.mjs'; import '../../_chunks/dep-a95026f2.mjs'; import '../../_chunks/dep-068e912d.mjs'; import '../../_chunks/dep-735bcd0d.mjs'; import '../../_chunks/dep-765678ef.mjs'; import '../../_chunks/dep-2f9d2f2d.mjs'; import '../../_common/js/time-picker/utils.mjs'; import '../../_chunks/dep-5bec687c.mjs'; import '../../loading/index.mjs'; import '../../loading/directive.mjs'; import '../../loading/plugin.mjs'; import '../../loading/loading.mjs'; import '../../loading/icon/gradient.mjs'; import '../../_common/js/loading/circle-adapter.mjs'; import '../../_common/js/utils/set-style.mjs'; import '../../_common/js/utils/helper.mjs'; import '../../_chunks/dep-53e379cd.mjs'; import '../../_chunks/dep-11fa9c2c.mjs'; import '../../_chunks/dep-5a2ce53e.mjs'; import '../../_chunks/dep-1bae6a97.mjs'; import '../../_chunks/dep-23f91684.mjs'; import '../../utils/dom.mjs'; import '../../utils/easing.mjs'; import '../../utils/render-tnode.mjs'; import '../../_chunks/dep-9d7ebc32.mjs'; import '../../_chunks/dep-69963a8c.mjs'; import '../../_chunks/dep-6e7b37b8.mjs'; import '../../_chunks/dep-5f0e0453.mjs'; import '../../_chunks/dep-db381ece.mjs'; import '../../_chunks/dep-8d1c9a23.mjs'; import '../../_chunks/dep-dafada74.mjs'; import '../../_chunks/dep-a628549d.mjs'; import '../../_chunks/dep-f4eba04c.mjs'; import '../../_chunks/dep-8db27830.mjs'; import '../../_chunks/dep-ae4bffa5.mjs'; import '../../loading/props.mjs'; import '../../hooks/useTeleport.mjs'; import '../../_chunks/dep-91ac8f71.mjs'; import '../../_chunks/dep-c4737535.mjs'; import '../../_chunks/dep-81c83986.mjs'; import '../../_chunks/dep-6aa0223b.mjs'; import '../../_chunks/dep-6f04869e.mjs'; import '../../_chunks/dep-d32fbbb3.mjs'; import '../../_chunks/dep-03412fab.mjs'; import '../../_chunks/dep-205ff58d.mjs'; import '../../_chunks/dep-b09f48fa.mjs'; import '../../_chunks/dep-26bf361a.mjs'; import '../../_chunks/dep-3ec3335a.mjs'; import '../../_chunks/dep-ed4e7c50.mjs'; import '../../_common/js/global-config/default-config.mjs'; import '../../_common/js/global-config/locale/en_US.mjs'; import '../../config-provider/type.mjs'; import '../../utils/withInstall.mjs'; import './style/css.mjs'; import '../../loading/type.mjs'; import '../../button/props.mjs'; import '../../hooks/useRipple.mjs'; import '../../hooks/useKeepAnimation.mjs'; import '../../utils/set-style.mjs'; import '../../hooks/tnode.mjs'; import '../../hooks/useDisabled.mjs'; function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } dayjs.extend(customParseFormat); var _TimePickerPanel = defineComponent({ name: "XTimePickerPanel", props: _objectSpread(_objectSpread({}, panelProps()), {}, { isFooterDisplay: Boolean, handleConfirmClick: Function, onChange: Function }), setup: function setup(props) { var panelClassName = usePrefixClass("time-picker__panel"); var _toRefs = toRefs(props), steps = _toRefs.steps, isFooterDisplay = _toRefs.isFooterDisplay, isShowPanel = _toRefs.isShowPanel; var triggerScroll = ref(false); var panelRef = ref(); var _useConfig = useConfig("timePicker"), globalConfig = _useConfig.globalConfig; var showNowTimeBtn = computed(function () { return !!steps.value.filter(function (v) { return v > 1; }).length; }); var defaultValue = computed(function () { var isStepsSet = showNowTimeBtn.value; var formattedValue = dayjs(props.value, props.format); if (props.value && formattedValue.isValid()) { return formattedValue.format(props.format); } if (isStepsSet) { return dayjs().hour(0).minute(0).second(0).format(props.format); } return dayjs().hour(0).minute(0).second(0).format(props.format); }); var panelColUpdate = function panelColUpdate() { nextTick(function () { triggerScroll.value = true; }); }; var resetTriggerScroll = function resetTriggerScroll() { triggerScroll.value = false; }; onMounted(function () { panelColUpdate(); }); watch(function () { return isShowPanel.value; }, function () { panelColUpdate(); }); return function () { return createVNode("div", { "class": panelClassName.value }, [createVNode("div", { "class": "".concat(panelClassName.value, "-section-body") }, [createVNode(SinglePanel, mergeProps(props, { "ref": panelRef, "format": props.format || DEFAULT_FORMAT, "steps": props.steps || DEFAULT_STEPS, "value": dayjs(props.value, props.format).isValid() ? props.value : defaultValue.value, "triggerScroll": triggerScroll.value, "onChange": props.onChange, "resetTriggerScroll": resetTriggerScroll, "isShowPanel": props.isShowPanel }), null)]), isFooterDisplay.value ? createVNode("div", { "class": "".concat(panelClassName.value, "-section-footer") }, [createVNode(TButton, { "theme": "primary", "variant": "base", "disabled": !props.value, "onClick": function onClick() { return props.handleConfirmClick(defaultValue.value); }, "size": "small" }, { "default": function _default() { return [globalConfig.value.confirm]; } }), !showNowTimeBtn.value ? createVNode(TButton, { "theme": "primary", "variant": "text", "size": "small", "onClick": function onClick() { return props.onChange(dayjs().format(props.format)); } }, { "default": function _default() { return [globalConfig.value.now]; } }) : null]) : null]); }; } }); export { _TimePickerPanel as default }; //# sourceMappingURL=time-picker-panel.mjs.map