@vunk/form 2.18.1 → 2.19.0

package/components/var-datetime-picker/index.mjs

@@ -1,17 +1,16 @@
-import { _VkfFormItemCtx, VkfFormItem } from '@vunk/form/components/form-item';
-import { defineComponent, computed, ref, resolveComponent, openBlock, createBlock, normalizeProps, guardReactiveProps, withCtx, createElementVNode, createVNode, normalizeClass, createCommentVNode } from 'vue';
-import { useComputedReadonly } from '@vunk/form/composables';
-import { useLocale } from '@vunk/form/composables/element-plus';
-import { Popup } from 'vant';
-import { DatePicker, TimePicker } from '@varlet/ui';
-import { ElDatePicker, ElTabPane, ElTabs, dayjs } from 'element-plus';
-import 'vant/es/popup/style';
-import '@varlet/ui/es/date-picker/style';
-import '@varlet/ui/es/time-picker/style';
-import { _ as _export_sfc } from '../_plugin-vue_export-helper.mjs';
-
-const props = {
-  ..._VkfFormItemCtx.props,
+import { _VkfFormItemCtx as Y, VkfFormItem as M } from "@vunk/form/components/form-item";
+import { defineComponent as w, computed as n, ref as F, resolveComponent as r, openBlock as h, createBlock as R, normalizeProps as B, guardReactiveProps as H, withCtx as i, createElementVNode as I, createVNode as u, normalizeClass as S, createCommentVNode as C } from "vue";
+import { useComputedReadonly as O } from "@vunk/form/composables";
+import { useLocale as U } from "@vunk/form/composables/element-plus";
+import { Popup as $ } from "vant";
+import { DatePicker as j, TimePicker as z } from "@varlet/ui";
+import { ElDatePicker as N, ElTabPane as L, ElTabs as _, dayjs as m } from "element-plus";
+import "vant/es/popup/style";
+import "@varlet/ui/es/date-picker/style";
+import "@varlet/ui/es/time-picker/style";
+import { _ as q } from "../_plugin-vue_export-helper.cjs";
+const A = {
+  ...Y.props,
   modelValue: null,
   readonly: Boolean,
   type: {
@@ -28,300 +27,222 @@ const props = {
     type: String,
     default: "YYYY-MM-DD HH:mm"
   }
-};
-const emits = {
+}, G = {
   "update:modelValue": null
-};
-
-const VarDatePickerTypeOptions = [
+}, J = [
   {
-    label: "\u65E5\u671F",
-    value: "date" /* date */,
+    label: "日期",
+    value: "date",
     format: "YYYY-MM-DD"
   },
   {
-    label: "\u5E74",
-    value: "year" /* year */,
+    label: "年",
+    value: "year",
     format: "YYYY"
   },
   {
-    label: "\u6708",
-    value: "month" /* month */,
+    label: "月",
+    value: "month",
     format: "YYYY-MM"
   }
-];
-const VarDatePickerTypeReflect = VarDatePickerTypeOptions.reduce((acc, cur) => {
-  acc[cur.value] = cur;
-  return acc;
-}, {});
-const ElDatePickerTypeOptions = [
+], K = J.reduce((e, a) => (e[a.value] = a, e), {}), Q = [
   {
-    label: "\u65E5\u671F",
+    label: "日期",
     value: "date",
-    varDatePickerType: "date" /* date */,
-    isRange: false
+    varDatePickerType: "date",
+    isRange: !1
   },
   {
-    label: "\u5E74",
+    label: "年",
     value: "year",
-    varDatePickerType: "year" /* year */,
-    isRange: false
+    varDatePickerType: "year",
+    isRange: !1
   },
   {
-    label: "\u6708",
+    label: "月",
     value: "month",
-    varDatePickerType: "month" /* month */,
-    isRange: false
+    varDatePickerType: "month",
+    isRange: !1
   },
   {
     value: "dates",
-    label: "\u591A\u9009\u65E5\u671F",
-    varDatePickerType: "date" /* date */,
-    isRange: false
+    label: "多选日期",
+    varDatePickerType: "date",
+    isRange: !1
   },
   {
     value: "week",
-    label: "\u5468",
-    varDatePickerType: "date" /* date */,
-    isRange: false
+    label: "周",
+    varDatePickerType: "date",
+    isRange: !1
   },
   {
     value: "datetime",
-    label: "\u65E5\u671F\u65F6\u95F4",
-    varDatePickerType: "date" /* date */,
-    isRange: false,
-    hasTime: true
+    label: "日期时间",
+    varDatePickerType: "date",
+    isRange: !1,
+    hasTime: !0
   },
   {
     value: "datetimerange",
-    label: "\u65E5\u671F\u65F6\u95F4\u8303\u56F4",
-    varDatePickerType: "date" /* date */,
+    label: "日期时间范围",
+    varDatePickerType: "date",
     /**
      * 采用独立的时间选择器
      */
-    isRange: false,
-    hasTime: true
+    isRange: !1,
+    hasTime: !0
   },
   {
     value: "daterange",
-    label: "\u65E5\u671F\u8303\u56F4",
-    varDatePickerType: "date" /* date */,
-    isRange: true
+    label: "日期范围",
+    varDatePickerType: "date",
+    isRange: !0
   },
   {
     value: "monthrange",
-    label: "\u6708\u8303\u56F4",
-    varDatePickerType: "month" /* month */,
-    isRange: true
+    label: "月范围",
+    varDatePickerType: "month",
+    isRange: !0
   }
-];
-const ElDatePickerTypeReflect = ElDatePickerTypeOptions.reduce((acc, cur) => {
-  acc[cur.value] = cur;
-  return acc;
-}, {});
-
-var _sfc_main = defineComponent({
+], T = Q.reduce((e, a) => (e[a.value] = a, e), {}), W = w({
   name: "VkfVarDatetimePicker",
   components: {
-    VkfFormItem,
-    ElDatePicker,
-    DatePicker,
-    TimePicker,
-    Popup,
-    ElTabPane,
-    ElTabs
+    VkfFormItem: M,
+    ElDatePicker: N,
+    DatePicker: j,
+    TimePicker: z,
+    Popup: $,
+    ElTabPane: L,
+    ElTabs: _
   },
-  props,
-  emits,
-  setup(props2, { emit }) {
-    const formItemBindProps = _VkfFormItemCtx.createBindProps(props2);
-    const { tr } = useLocale();
-    const varDatePickerType = computed(() => {
-      return ElDatePickerTypeReflect[props2.type].varDatePickerType;
-    });
-    const varDatePickerFormat = computed(() => {
-      return VarDatePickerTypeReflect[varDatePickerType.value].format;
-    });
-    const isRange = computed(() => {
-      return !!ElDatePickerTypeReflect[props2.type].isRange;
-    });
-    const hasTime = computed(() => {
-      return !!ElDatePickerTypeReflect[props2.type].hasTime;
-    });
-    const getDateFromModelValue = () => {
-      return props2.modelValue ? dayjs(props2.modelValue).format(varDatePickerFormat.value) : "";
-    };
-    const getTimeFromModelValue = () => {
-      return props2.modelValue ? dayjs(props2.modelValue).format(props2.useSeconds ? "HH:mm:ss" : "HH:mm") : "";
-    };
-    const tansformModelValueByDateValue = (dateValue) => {
-      if (!dateValue) return "";
-      const date = dayjs(dateValue, varDatePickerFormat.value);
-      if (!props2.modelValue) {
-        return date.format(props2.valueFormat);
-      }
-      return dayjs(props2.modelValue).year(date.year()).month(date.month()).date(date.date()).format(props2.valueFormat);
-    };
-    const tansformModelValueByTimeValue = (timeValue) => {
-      if (!timeValue) return "";
-      const time = dayjs(
-        timeValue,
-        props2.useSeconds ? "HH:mm:ss" : "HH:mm"
+  props: A,
+  emits: G,
+  setup(e, { emit: a }) {
+    const P = Y.createBindProps(e), { tr: D } = U(), p = n(() => T[e.type].varDatePickerType), c = n(() => K[p.value].format), f = n(() => !!T[e.type].isRange), s = n(() => !!T[e.type].hasTime), d = () => e.modelValue ? m(e.modelValue).format(c.value) : "", v = () => e.modelValue ? m(e.modelValue).format(e.useSeconds ? "HH:mm:ss" : "HH:mm") : "", k = (o) => {
+      if (!o)
+        return "";
+      const t = m(o, c.value);
+      return e.modelValue ? m(e.modelValue).year(t.year()).month(t.month()).date(t.date()).format(e.valueFormat) : t.format(e.valueFormat);
+    }, y = (o) => {
+      if (!o)
+        return "";
+      const t = m(
+        o,
+        e.useSeconds ? "HH:mm:ss" : "HH:mm"
       );
-      if (!props2.modelValue) {
-        return time.format(props2.valueFormat);
-      }
-      return dayjs(props2.modelValue).hour(time.hour()).minute(time.minute()).second(time.second()).format(props2.valueFormat);
-    };
-    const valueDate = computed({
+      return e.modelValue ? m(e.modelValue).hour(t.hour()).minute(t.minute()).second(t.second()).format(e.valueFormat) : t.format(e.valueFormat);
+    }, V = n({
       get() {
-        return getDateFromModelValue();
+        return d();
       },
-      set(val) {
-        const nModelValue = tansformModelValueByDateValue(val);
-        emit("update:modelValue", nModelValue);
+      set(o) {
+        const t = k(o);
+        a("update:modelValue", t);
       }
-    });
-    const valueTime = computed({
+    }), l = n({
       get() {
-        return getTimeFromModelValue();
+        return v();
       },
-      set(val) {
-        const nModelValue = tansformModelValueByTimeValue(val);
-        emit("update:modelValue", nModelValue);
-      }
-    });
-    const readonly = useComputedReadonly(props2);
-    const popupShow = ref(false);
-    const currentTab = ref("date");
-    const inputBlur = (e) => {
-      const target = e.target;
-      target.blur();
-    };
-    const preInput = () => {
-      if (readonly.value) return;
-      if (props2.modelValue && hasTime.value) {
-        currentTab.value = "time";
+      set(o) {
+        const t = y(o);
+        a("update:modelValue", t);
       }
-      popupShow.value = true;
-    };
+    }), E = O(e), b = F(!1), g = F("date");
     return {
-      preInput,
-      inputBlur,
-      popupShow,
-      formItemBindProps,
-      varDatePickerType,
-      isRange,
-      hasTime,
-      currentTab,
-      valueTime,
-      valueDate,
-      tr
+      preInput: () => {
+        E.value || (e.modelValue && s.value && (g.value = "time"), b.value = !0);
+      },
+      inputBlur: (o) => {
+        o.target.blur();
+      },
+      popupShow: b,
+      formItemBindProps: P,
+      varDatePickerType: p,
+      isRange: f,
+      hasTime: s,
+      currentTab: g,
+      valueTime: l,
+      valueDate: V,
+      tr: D
     };
   }
 });
-
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_ElDatePicker = resolveComponent("ElDatePicker");
-  const _component_DatePicker = resolveComponent("DatePicker");
-  const _component_ElTabPane = resolveComponent("ElTabPane");
-  const _component_TimePicker = resolveComponent("TimePicker");
-  const _component_ElTabs = resolveComponent("ElTabs");
-  const _component_Popup = resolveComponent("Popup");
-  const _component_VkfFormItem = resolveComponent("VkfFormItem");
-  return openBlock(), createBlock(
-    _component_VkfFormItem,
-    normalizeProps(guardReactiveProps(_ctx.formItemBindProps)),
-    {
-      default: withCtx(() => [
-        createElementVNode(
-          "div",
-          {
-            onClickCapture: _cache[0] || (_cache[0] = (...args) => _ctx.preInput && _ctx.preInput(...args))
-          },
-          [
-            createVNode(_component_ElDatePicker, {
-              "popper-class": "var-datetime-picker-el-popover",
-              "model-value": _ctx.modelValue,
-              type: _ctx.type,
-              readonly: true,
-              "value-format": _ctx.valueFormat,
-              onFocus: _ctx.inputBlur
-            }, null, 8, ["model-value", "type", "value-format", "onFocus"])
-          ],
-          32
-          /* NEED_HYDRATION */
-        ),
-        createVNode(_component_Popup, {
-          show: _ctx.popupShow,
-          "onUpdate:show": _cache[4] || (_cache[4] = ($event) => _ctx.popupShow = $event),
-          position: "bottom",
-          round: ""
-        }, {
-          default: withCtx(() => [
-            createVNode(_component_ElTabs, {
-              modelValue: _ctx.currentTab,
-              "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => _ctx.currentTab = $event),
-              class: normalizeClass(["var-datetime-picker-el-tabs", {
-                "is-hidden": !_ctx.hasTime
-              }])
-            }, {
-              default: withCtx(() => [
-                createVNode(_component_ElTabPane, {
-                  label: _ctx.valueDate || _ctx.tr("el.datepicker.selectDate", "\u9009\u62E9\u65E5\u671F"),
-                  name: "date"
-                }, {
-                  default: withCtx(() => [
-                    createVNode(_component_DatePicker, {
-                      modelValue: _ctx.valueDate,
-                      "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.valueDate = $event),
-                      type: _ctx.varDatePickerType,
-                      range: _ctx.isRange,
-                      "allowed-dates": _ctx.allowedDates
-                    }, null, 8, ["modelValue", "type", "range", "allowed-dates"])
-                  ]),
-                  _: 1
-                  /* STABLE */
-                }, 8, ["label"]),
-                _ctx.hasTime ? (openBlock(), createBlock(_component_ElTabPane, {
-                  key: 0,
-                  label: _ctx.valueTime || _ctx.tr("el.datepicker.selectTime", "\u9009\u62E9\u65F6\u95F4"),
-                  name: "time"
-                }, {
-                  default: withCtx(() => [
-                    createVNode(_component_TimePicker, {
-                      modelValue: _ctx.valueTime,
-                      "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => _ctx.valueTime = $event),
-                      format: "24hr"
-                    }, null, 8, ["modelValue"])
-                  ]),
-                  _: 1
-                  /* STABLE */
-                }, 8, ["label"])) : createCommentVNode("v-if", true)
-              ]),
-              _: 1
-              /* STABLE */
-            }, 8, ["modelValue", "class"])
-          ]),
-          _: 1
-          /* STABLE */
-        }, 8, ["show"])
-      ]),
-      _: 1
-      /* STABLE */
-    },
-    16
-    /* FULL_PROPS */
-  );
+function X(e, a, P, D, p, c) {
+  const f = r("ElDatePicker"), s = r("DatePicker"), d = r("ElTabPane"), v = r("TimePicker"), k = r("ElTabs"), y = r("Popup"), V = r("VkfFormItem");
+  return h(), R(V, B(H(e.formItemBindProps)), {
+    default: i(() => [
+      I("div", {
+        onClickCapture: a[0] || (a[0] = (...l) => e.preInput && e.preInput(...l))
+      }, [
+        u(f, {
+          "popper-class": "var-datetime-picker-el-popover",
+          "model-value": e.modelValue,
+          type: e.type,
+          readonly: !0,
+          "value-format": e.valueFormat,
+          onFocus: e.inputBlur
+        }, null, 8, ["model-value", "type", "value-format", "onFocus"])
+      ], 32),
+      u(y, {
+        show: e.popupShow,
+        "onUpdate:show": a[4] || (a[4] = (l) => e.popupShow = l),
+        position: "bottom",
+        round: ""
+      }, {
+        default: i(() => [
+          u(k, {
+            modelValue: e.currentTab,
+            "onUpdate:modelValue": a[3] || (a[3] = (l) => e.currentTab = l),
+            class: S(["var-datetime-picker-el-tabs", {
+              "is-hidden": !e.hasTime
+            }])
+          }, {
+            default: i(() => [
+              u(d, {
+                label: e.valueDate || e.tr("el.datepicker.selectDate", "选择日期"),
+                name: "date"
+              }, {
+                default: i(() => [
+                  u(s, {
+                    modelValue: e.valueDate,
+                    "onUpdate:modelValue": a[1] || (a[1] = (l) => e.valueDate = l),
+                    type: e.varDatePickerType,
+                    range: e.isRange,
+                    "allowed-dates": e.allowedDates
+                  }, null, 8, ["modelValue", "type", "range", "allowed-dates"])
+                ]),
+                _: 1
+              }, 8, ["label"]),
+              e.hasTime ? (h(), R(d, {
+                key: 0,
+                label: e.valueTime || e.tr("el.datepicker.selectTime", "选择时间"),
+                name: "time"
+              }, {
+                default: i(() => [
+                  u(v, {
+                    modelValue: e.valueTime,
+                    "onUpdate:modelValue": a[2] || (a[2] = (l) => e.valueTime = l),
+                    format: "24hr"
+                  }, null, 8, ["modelValue"])
+                ]),
+                _: 1
+              }, 8, ["label"])) : C("", !0)
+            ]),
+            _: 1
+          }, 8, ["modelValue", "class"])
+        ]),
+        _: 1
+      }, 8, ["show"])
+    ]),
+    _: 1
+  }, 16);
 }
-var VkfVarDatetimePicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\labCode\\vunk-form2\\packages\\components\\var-datetime-picker\\src\\index.vue"]]);
-
-var types = /*#__PURE__*/Object.freeze({
+const de = /* @__PURE__ */ q(W, [["render", X]]), pe = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null
-});
-
-VkfVarDatetimePicker.install = (app) => {
-  app.component(VkfVarDatetimePicker.name, VkfVarDatetimePicker);
+}, Symbol.toStringTag, { value: "Module" }));
+export {
+  de as VkfVarDatetimePicker,
+  pe as __VkfVarDatetimePicker,
+  de as default
 };
-
-export { VkfVarDatetimePicker, types as __VkfVarDatetimePicker, VkfVarDatetimePicker as default };

package/components/var-datetime-picker/src/ctx.d.ts

@@ -1,36 +1,28 @@
-import { PropType } from 'vue';
-import { DatePickType } from 'element-plus';
+import type { PropType } from 'vue';
 export declare const props: {
-    modelValue: any;
+    modelValue: null;
     readonly: BooleanConstructor;
     type: {
-        type: PropType<Exclude<DatePickType, "datetimerange">>;
+        type: PropType<"year" | "years" | "month" | "months" | "date" | "dates" | "week" | "datetime" | "daterange" | "monthrange" | "yearrange">;
         default: string;
     };
     allowedDates: {
         type: PropType<(date: string) => boolean>;
-        default: any;
+        default: undefined;
     };
     useSeconds: BooleanConstructor;
     valueFormat: {
         type: StringConstructor;
         default: string;
     };
-    required: {
-        readonly type: PropType<boolean>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    } & {
-        readonly default: undefined;
-    };
+    required: import("element-plus/es/utils/index.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
     formItemSize: {
         type: PropType<"default" | "small" | "large">;
         default: "default" | "small" | "large";
     };
     formItemSlots: {
-        type: PropType<import("@vunk/form/components/form-item/src/types").FormItemSlots>;
-        default: any;
+        type: PropType<import("../../form-item/src/types").FormItemSlots>;
+        default: undefined;
     };
     elRef: {
         type: PropType<any>;
@@ -42,67 +34,44 @@ export declare const props: {
     };
     formItemTip: {
         type: StringConstructor;
-        default: any;
+        default: undefined;
     };
-    formItemTipClass: any;
+    formItemTipClass: null;
     labelTip: {
         type: StringConstructor;
-        default: any;
+        default: undefined;
     };
     information: {
         type: BooleanConstructor;
         default: boolean;
     };
-    prop: any;
-    defaultModelValue: any;
+    prop: null;
+    defaultModelValue: null;
     label: StringConstructor;
     labelWidth: {
-        readonly type: PropType<string | number>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    } & {
-        readonly default: "";
-    };
-    labelPosition: {
-        readonly type: PropType<"" | "top" | "left" | "right">;
+        readonly type: PropType<import("element-plus/es/utils/index.mjs").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
-    } & {
-        readonly default: "";
     };
+    labelPosition: import("element-plus/es/utils/index.mjs").EpPropFinalized<StringConstructor, "" | "left" | "right" | "top", unknown, "", boolean>;
     rules: {
-        readonly type: PropType<unknown>;
+        readonly type: PropType<import("element-plus/es/utils/index.mjs").EpPropMergeType<(new (...args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>) | ((new (...args: any[]) => import("element-plus").FormItemRule | import("element-plus").FormItemRule[]) | (() => import("element-plus/es/utils/typescript.mjs").Arrayable<import("element-plus").FormItemRule>) | null)[], unknown, unknown>>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     };
     error: StringConstructor;
     validateStatus: {
-        readonly type: PropType<"" | "error" | "success" | "validating">;
+        readonly type: PropType<import("element-plus/es/utils/index.mjs").EpPropMergeType<StringConstructor, "" | "error" | "success" | "validating", unknown>>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     };
     for: StringConstructor;
-    inlineMessage: {
-        readonly type: PropType<string | boolean>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    } & {
-        readonly default: "";
-    };
-    showMessage: {
-        readonly type: PropType<boolean>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    } & {
-        readonly default: true;
-    };
+    inlineMessage: import("element-plus/es/utils/index.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+    showMessage: import("element-plus/es/utils/index.mjs").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
 };
 export declare const emits: {
-    'update:modelValue': any;
+    'update:modelValue': null;
 };