hy-dispatch-ui-v3 0.2.1 → 0.2.3

package/es/components/appConfigProvider/appConfigProvider.vue.mjs

@@ -71,7 +71,8 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
     videoPlayer: {
       type: Object,
       required: false
-    }
+    },
+    ensureHyIcon: Function
   },
   setup(__props) {
     const props = __props;
@@ -84,6 +85,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
         permissionMap,
         audioPlayer,
         videoPlayer,
+        ensureHyIcon,
         ...config2
       } = globalConfig.value;
       return {

package/es/components/appDatePicker/appDatePicker.vue.mjs

@@ -1,6 +1,8 @@
-import { defineComponent, useTemplateRef, useModel, watch, unref, openBlock, createBlock, mergeProps, mergeModels } from 'vue';
+import { defineComponent, useTemplateRef, useModel, computed, watch, unref, openBlock, createBlock, mergeProps, mergeModels } from 'vue';
 import { ElDatePicker } from 'element-plus';
+import { getDefaultValueFormatByType } from '../../utils/date.mjs';
 import { isArray } from '../../utils/is.mjs';
+import { useLocale } from '../../hooks/useLocale.mjs';
 
 import "./style/appDatePicker.scss";
 
@@ -21,7 +23,15 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
       type: String,
       default: "date"
       // 'year' | 'years' |'month' | 'months' | 'date' | 'dates' | 'datetime' | 'week' | 'datetimerange' | 'daterange' | 'monthrange' | 'yearrange'
-    }
+    },
+    format: {
+      type: String
+    },
+    valueFormat: {
+      type: String
+    },
+    startPlaceholder: String,
+    endPlaceholder: String
   }, {
     "modelValue": { type: [String, Date, Array] },
     "modelModifiers": {},
@@ -34,10 +44,43 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
     const emits = __emit;
+    const { t } = useLocale();
     const appDatePicker = useTemplateRef("appDatePicker");
     const dateValue = useModel(__props, "modelValue");
     const startValue = useModel(__props, "start");
     const endValue = useModel(__props, "end");
+    const startPlaceholder = computed(() => {
+      if (props.startPlaceholder) {
+        return props.startPlaceholder;
+      }
+      switch (props.type) {
+        case "daterange":
+          return t("datePicker.startDate");
+        case "datetimerange":
+          return t("datePicker.startDateTime");
+        case "monthrange":
+          return t("datePicker.startMonth");
+        case "yearrange":
+          return t("datePicker.startYear");
+      }
+      return null;
+    });
+    const endPlaceholder = computed(() => {
+      if (props.endPlaceholder) {
+        return props.endPlaceholder;
+      }
+      switch (props.type) {
+        case "daterange":
+          return t("datePicker.endDate");
+        case "datetimerange":
+          return t("datePicker.endDateTime");
+        case "monthrange":
+          return t("datePicker.endMonth");
+        case "yearrange":
+          return t("datePicker.endYear");
+      }
+      return null;
+    });
     watch(
       () => [startValue.value, endValue.value],
       ([start, end]) => {
@@ -51,6 +94,10 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
       },
       { immediate: true }
     );
+    function dateFormHandler(format) {
+      if (format) return format;
+      return getDefaultValueFormatByType(props.type);
+    }
     function onChangeHandler(value) {
       const { timeRangeFill } = props;
       const isFill = timeRangeFill && ["daterange"].includes(props.type);
@@ -90,7 +137,14 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
         modelValue: dateValue.value,
         "onUpdate:modelValue": ($event) => dateValue.value = $event,
         type: __props.type
-      }, _ctx.$attrs, { onChange: onChangeHandler }), null, 16, ["modelValue", "onUpdate:modelValue", "type"]);
+      }, _ctx.$attrs, {
+        format: dateFormHandler(__props.format),
+        valueFormat: dateFormHandler(__props.valueFormat),
+        "start-placeholder": startPlaceholder.value,
+        "range-separator": unref(t)("datePicker.to"),
+        "end-placeholder": endPlaceholder.value,
+        onChange: onChangeHandler
+      }), null, 16, ["modelValue", "onUpdate:modelValue", "type", "format", "valueFormat", "start-placeholder", "range-separator", "end-placeholder"]);
     };
   }
 });

package/es/components/appDatePicker/index.mjs

@@ -2,5 +2,6 @@ import _sfc_main from './appDatePicker.vue.mjs';
 import { withInstall } from '../../utils/handler.mjs';
 
 const AppDatePicker = withInstall(_sfc_main);
+const ElDatePicker = withInstall(_sfc_main, "ElDatePicker");
 
-export { AppDatePicker, AppDatePicker as default };
+export { AppDatePicker, ElDatePicker, AppDatePicker as default };

package/es/components/appForm/cpns/appFormItem.vue.mjs

@@ -1,12 +1,13 @@
 import { computed, unref, openBlock, createBlock, normalizeStyle, withCtx, createCommentVNode, createElementVNode, renderSlot, toDisplayString, createElementBlock, createVNode, Fragment, mergeProps } from 'vue';
 import { ElFormItem, ElIcon, ElSelect, ElRadioGroup, ElCheckboxGroup, ElSwitch, ElInputNumber } from 'element-plus';
 import { QuestionFilled } from '@element-plus/icons-vue';
-import { AppDatePicker } from '../../appDatePicker/index.mjs';
-import { AppOrgCascader } from '../../appOrgCascader/index.mjs';
 import { columnShowHandler, columnItemStyle, isRequired, renderText, isDisabled, optionsHandler } from '../js/index.mjs';
 import { setValueByProp, getValueByProp } from '../../../utils/form.mjs';
 import { AppTooltip } from '../../appTooltip/index.mjs';
 import { AppInput } from '../../appInput/index.mjs';
+import { AppDatePicker } from '../../appDatePicker/index.mjs';
+import { AppTimePicker } from '../../appTimePicker/index.mjs';
+import { AppOrgCascader } from '../../appOrgCascader/index.mjs';
 import { isArray } from '../../../utils/is.mjs';
 import { funRunHandler } from '../../../utils/handler.mjs';
 
@@ -218,9 +219,38 @@ const _sfc_main = {
                 ],
                 64
                 /* STABLE_FRAGMENT */
-              )) : __props.column.type === "radio" ? (openBlock(), createElementBlock(
+              )) : __props.column.type === "time-picker" ? (openBlock(), createElementBlock(
                 Fragment,
                 { key: 4 },
+                [
+                  createCommentVNode(" \u65F6\u95F4\u9009\u62E9\u6846 "),
+                  __props.column.attrs.isRange ? (openBlock(), createBlock(unref(AppTimePicker), mergeProps({
+                    key: 0,
+                    start: bindValue.value,
+                    "onUpdate:start": ($event) => bindValue.value = $event,
+                    end: bindValue2.value,
+                    "onUpdate:end": ($event) => bindValue2.value = $event,
+                    "is-range": true,
+                    style: { "width": "100%" }
+                  }, __props.column.attrs, {
+                    disabled: unref(isDisabled)(props, __props.column),
+                    onChange: onChangeHandler
+                  }), null, 16, ["start", "onUpdate:start", "end", "onUpdate:end", "disabled"])) : (openBlock(), createBlock(unref(AppTimePicker), mergeProps({
+                    key: 1,
+                    modelValue: bindValue.value,
+                    "onUpdate:modelValue": ($event) => bindValue.value = $event,
+                    "is-range": false,
+                    style: { "width": "100%" }
+                  }, __props.column.attrs, {
+                    disabled: unref(isDisabled)(props, __props.column),
+                    onChange: onChangeHandler
+                  }), null, 16, ["modelValue", "onUpdate:modelValue", "disabled"]))
+                ],
+                64
+                /* STABLE_FRAGMENT */
+              )) : __props.column.type === "radio" ? (openBlock(), createElementBlock(
+                Fragment,
+                { key: 5 },
                 [
                   createCommentVNode(" \u5355\u9009 "),
                   createVNode(unref(ElRadioGroup), mergeProps({
@@ -236,7 +266,7 @@ const _sfc_main = {
                 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
               )) : __props.column.type === "checkbox" ? (openBlock(), createElementBlock(
                 Fragment,
-                { key: 5 },
+                { key: 6 },
                 [
                   createCommentVNode(" \u591A\u9009 "),
                   createVNode(unref(ElCheckboxGroup), mergeProps({
@@ -252,7 +282,7 @@ const _sfc_main = {
                 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
               )) : __props.column.type === "switch" ? (openBlock(), createElementBlock(
                 Fragment,
-                { key: 6 },
+                { key: 7 },
                 [
                   createCommentVNode(" \u5F00\u5173 "),
                   createVNode(unref(ElSwitch), mergeProps({
@@ -267,7 +297,7 @@ const _sfc_main = {
                 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
               )) : __props.column.type === "input-number" ? (openBlock(), createElementBlock(
                 Fragment,
-                { key: 7 },
+                { key: 8 },
                 [
                   createCommentVNode(" \u6570\u5B57\u8F93\u5165\u6846 "),
                   createVNode(unref(ElInputNumber), mergeProps({
@@ -282,7 +312,7 @@ const _sfc_main = {
                 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
               )) : __props.column.type === "org-cascader" ? (openBlock(), createElementBlock(
                 Fragment,
-                { key: 8 },
+                { key: 9 },
                 [
                   createCommentVNode(" \u90E8\u95E8\u7EA7\u8054\u9009\u62E9\u6846 "),
                   createVNode(unref(AppOrgCascader), mergeProps({

package/es/components/appForm/js/useAppForm.mjs

@@ -1,7 +1,6 @@
 import { unref, toRef } from 'vue';
 import { genValueByProp } from '../../../utils/form.mjs';
 import { funRunHandler, mergeDeep } from '../../../utils/handler.mjs';
-import { getDefaultValueFormatByType } from '../../../utils/date.mjs';
 import { isArray } from '../../../utils/is.mjs';
 import { useLocale } from '../../../hooks/useLocale.mjs';
 
@@ -23,33 +22,9 @@ const genPlaceholderHandler = (config) => {
       placeholder = placeholder || t("hy.pleaseEnterPlaceholder", [label]);
       break;
     case "select":
-      placeholder = placeholder || t("hy.pleaseSelectPlaceholder", [label]);
-      break;
     case "date-picker":
-      if (["datetimerange", "daterange", "monthrange", "yearrange"].includes(
-        attrs?.type
-      )) {
-        switch (attrs.type) {
-          case "yearrange":
-            startPlaceholder = startPlaceholder || t("hy.startYear");
-            endPlaceholder = endPlaceholder || t("hy.endYear");
-            break;
-          case "monthrange":
-            startPlaceholder = startPlaceholder || t("hy.startMonth");
-            endPlaceholder = endPlaceholder || t("hy.endMonth");
-            break;
-          case "daterange":
-            startPlaceholder = startPlaceholder || t("hy.startDate");
-            endPlaceholder = endPlaceholder || t("hy.endDate");
-            break;
-          case "datetimerange":
-            startPlaceholder = startPlaceholder || t("hy.startDateTime");
-            endPlaceholder = endPlaceholder || t("hy.endDateTime");
-            break;
-        }
-      } else {
-        placeholder = placeholder || t("hy.pleaseSelectPlaceholder", [label]);
-      }
+    case "time-picker":
+      placeholder = placeholder || t("hy.pleaseSelectPlaceholder", [label]);
       break;
     default:
       placeholder = placeholder || label;
@@ -86,7 +61,7 @@ const rulesHandler = (config) => {
 };
 function appFormItemHandler(column = {}) {
   const label = genDefaultLabel(column);
-  const { placeholder, startPlaceholder, endPlaceholder } = genPlaceholderHandler({ ...column, label });
+  const { placeholder} = genPlaceholderHandler({ ...column, label });
   const attrs = { ...column.attrs || {}, placeholder };
   column = mergeDeep(
     { ...column },
@@ -95,7 +70,8 @@ function appFormItemHandler(column = {}) {
       field: column.prop,
       label,
       readonly: column.readonly || false,
-      rules: rulesHandler(column)
+      rules: rulesHandler(column),
+      attrs
     }
   );
   if (/^(input)$/.test(column.type)) {
@@ -120,17 +96,6 @@ function appFormItemHandler(column = {}) {
         }
       }
     };
-  } else if (/^date-picker$/.test(column.type)) {
-    return {
-      ...column,
-      attrs: {
-        format: attrs.format || getDefaultValueFormatByType(attrs.type),
-        valueFormat: attrs.valueFormat || getDefaultValueFormatByType(attrs.type),
-        ...attrs,
-        startPlaceholder,
-        endPlaceholder
-      }
-    };
   } else if (/^(extra)$/.test(column.type)) {
     return {
       ...column,

package/es/components/appIcon/appIcon.vue.mjs

@@ -1,4 +1,5 @@
-import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, createElementVNode } from 'vue';
+import { defineComponent, onMounted, watch, computed, openBlock, createElementBlock, normalizeClass, createElementVNode } from 'vue';
+import { useEnsureHyIcon } from '../../hooks/useEnsureHyIcon.mjs';
 
 import "./style/appIcon.scss";
 
@@ -23,6 +24,9 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
   },
   setup(__props) {
     const props = __props;
+    const { ensureHyIcon } = useEnsureHyIcon();
+    onMounted(() => ensureHyIcon(props.svgName));
+    watch(() => props.svgName, ensureHyIcon);
     const iconName = computed(() => `#${props.prefix}${props.svgName}`);
     const svgClass = computed(() => {
       if (props.className) {

package/es/components/appInput/appInput.vue.mjs

@@ -12,9 +12,8 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
       default: "text"
     },
     clearSpaceType: {
-      type: String,
+      type: String
       // between-清除两端空格 all-清除所有空格 before-清除前面的空格 after-清除后面的空格 none-不清除空格
-      default: "between"
     }
   }, {
     "modelValue": { type: String, default: "" },
@@ -25,27 +24,31 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
     const props = __props;
     const modelValue = useModel(__props, "modelValue");
     const inputRef = useTemplateRef("inputRef");
+    const clearSpaceType = computed(() => {
+      if (props.clearSpaceType) {
+        return props.clearSpaceType;
+      }
+      return ["textarea", "password", "number"].includes(props.type) ? null : "between";
+    });
     const bindValue = computed({
       get() {
         return modelValue.value;
       },
       set(val) {
-        if (val && props.type !== "password") {
-          if (["between", "before"].includes(props.clearSpaceType)) {
+        if (val && clearSpaceType.value) {
+          if (["between", "before"].includes(clearSpaceType.value)) {
             modelValue.value = clearSpace(val, "before");
-            return;
-          }
-          if (["all"].includes(props.clearSpaceType)) {
-            modelValue.value = clearSpace(val, props.clearSpaceType);
-            return;
+          } else {
+            modelValue.value = clearSpace(val, clearSpaceType.value);
           }
+          return;
         }
         modelValue.value = val;
       }
     });
     function onBlurHandler() {
-      if (modelValue.value && props.type !== "password") {
-        modelValue.value = clearSpace(modelValue.value, props.clearSpaceType);
+      if (modelValue.value) {
+        modelValue.value = clearSpace(modelValue.value, clearSpaceType.value);
       }
     }
     __expose({
@@ -88,10 +91,9 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
         ref_key: "inputRef",
         ref: inputRef,
         modelValue: bindValue.value,
-        "onUpdate:modelValue": ($event) => bindValue.value = $event
-      }, _ctx.$attrs, {
-        onBlur: ($event) => onBlurHandler(props, _ctx.column)
-      }), null, 16, ["modelValue", "onUpdate:modelValue", "onBlur"]);
+        "onUpdate:modelValue": ($event) => bindValue.value = $event,
+        type: __props.type
+      }, _ctx.$attrs, { onBlur: onBlurHandler }), null, 16, ["modelValue", "onUpdate:modelValue", "type"]);
     };
   }
 });

package/es/components/appInput/index.mjs

@@ -2,5 +2,6 @@ import _sfc_main from './appInput.vue.mjs';
 import { withInstall } from '../../utils/handler.mjs';
 
 const AppInput = withInstall(_sfc_main);
+const ElInput = withInstall(_sfc_main, "ElInput");
 
-export { AppInput, AppInput as default };
+export { AppInput, ElInput, AppInput as default };

package/es/components/appSearch/cpns/appSearchItem.vue.mjs

@@ -1,11 +1,12 @@
 import { computed, unref, openBlock, createBlock, withCtx, createElementVNode, normalizeStyle, createCommentVNode, renderSlot, createElementBlock, toDisplayString, normalizeClass, Fragment, createVNode, mergeProps, withKeys, renderList } from 'vue';
 import { ElFormItem, ElSelect } from 'element-plus';
 import { columnShowHandler, columnItemStyle, columnItemInputStyle, isDisabled, optionsHandler, isSelectedTimeRange, timeRangeHandler } from '../js/index.mjs';
-import { AppDatePicker } from '../../appDatePicker/index.mjs';
-import { AppOrgCascader } from '../../appOrgCascader/index.mjs';
 import { isArray } from '../../../utils/is.mjs';
 import { setValueByProp, getValueByProp } from '../../../utils/form.mjs';
 import { AppInput } from '../../appInput/index.mjs';
+import { AppDatePicker } from '../../appDatePicker/index.mjs';
+import { AppTimePicker } from '../../appTimePicker/index.mjs';
+import { AppOrgCascader } from '../../appOrgCascader/index.mjs';
 
 const _sfc_main = {
   __name: "appSearchItem",
@@ -175,9 +176,38 @@ const _sfc_main = {
                       ],
                       64
                       /* STABLE_FRAGMENT */
-                    )) : __props.column.type === "org-cascader" ? (openBlock(), createElementBlock(
+                    )) : __props.column.type === "time-picker" ? (openBlock(), createElementBlock(
                       Fragment,
                       { key: 4 },
+                      [
+                        createCommentVNode(" \u65F6\u95F4\u9009\u62E9\u6846 "),
+                        __props.column.attrs.isRange ? (openBlock(), createBlock(unref(AppTimePicker), mergeProps({
+                          key: 0,
+                          start: bindValue.value,
+                          "onUpdate:start": ($event) => bindValue.value = $event,
+                          end: bindValue2.value,
+                          "onUpdate:end": ($event) => bindValue2.value = $event,
+                          "is-range": true,
+                          style: { "width": "100%" }
+                        }, __props.column.attrs, {
+                          disabled: unref(isDisabled)(props, __props.column),
+                          onChange: onChangeHandler
+                        }), null, 16, ["start", "onUpdate:start", "end", "onUpdate:end", "disabled"])) : (openBlock(), createBlock(unref(AppTimePicker), mergeProps({
+                          key: 1,
+                          modelValue: bindValue.value,
+                          "onUpdate:modelValue": ($event) => bindValue.value = $event,
+                          "is-range": false,
+                          style: { "width": "100%" }
+                        }, __props.column.attrs, {
+                          disabled: unref(isDisabled)(props, __props.column),
+                          onChange: onChangeHandler
+                        }), null, 16, ["modelValue", "onUpdate:modelValue", "disabled"]))
+                      ],
+                      64
+                      /* STABLE_FRAGMENT */
+                    )) : __props.column.type === "org-cascader" ? (openBlock(), createElementBlock(
+                      Fragment,
+                      { key: 5 },
                       [
                         createCommentVNode(" \u90E8\u95E8\u7EA7\u8054\u9009\u62E9\u6846 "),
                         createVNode(unref(AppOrgCascader), mergeProps({

package/es/components/appSearch/js/index.mjs

@@ -9,7 +9,7 @@ function columnItemStyle(props, column) {
   if (isNumber(width)) {
     style.width = `${width}px`;
   } else if (isString(width)) {
-    style.width = /(px|em|rem|vw|vh)$/.test(width) ? width : `${width}px`;
+    style.width = /^\d+$/.test(width) ? `${width}px` : width;
   }
   return style;
 }

package/es/components/appSearch/js/useAppSearch.mjs

@@ -1,7 +1,6 @@
 import { unref, toRef } from 'vue';
 import { funRunHandler, mergeDeep } from '../../../utils/handler.mjs';
 import { genValueByProp } from '../../../utils/form.mjs';
-import { getDefaultValueFormatByType } from '../../../utils/date.mjs';
 import { useLocale } from '../../../hooks/useLocale.mjs';
 import { isNumber } from '../../../utils/is.mjs';
 
@@ -21,33 +20,12 @@ const genPlaceholderHandler = (config) => {
   switch (type) {
     case "input":
       placeholder = placeholder || t("hy.pleaseEnterPlaceholder", [label]);
+      break;
     case "select":
-      placeholder = placeholder || t("hy.pleaseSelectPlaceholder", [label]);
     case "date-picker":
-      if (["datetimerange", "daterange", "monthrange", "yearrange"].includes(
-        attrs?.type
-      )) {
-        switch (attrs.type) {
-          case "yearrange":
-            startPlaceholder = startPlaceholder || t("hy.startYear");
-            endPlaceholder = endPlaceholder || t("hy.endYear");
-            break;
-          case "monthrange":
-            startPlaceholder = startPlaceholder || t("hy.startMonth");
-            endPlaceholder = endPlaceholder || t("hy.endMonth");
-            break;
-          case "daterange":
-            startPlaceholder = startPlaceholder || t("hy.startDate");
-            endPlaceholder = endPlaceholder || t("hy.endDate");
-            break;
-          case "datetimerange":
-            startPlaceholder = startPlaceholder || t("hy.startDateTime");
-            endPlaceholder = endPlaceholder || t("hy.endDateTime");
-            break;
-        }
-      } else {
-        placeholder = placeholder || t("hy.pleaseSelectPlaceholder", [label]);
-      }
+    case "time-picker":
+      placeholder = placeholder || t("hy.pleaseSelectPlaceholder", [label]);
+      break;
     default:
       placeholder = placeholder || label;
   }
@@ -71,6 +49,8 @@ const genColumnWidth = (config) => {
         default:
           inputWidth = 145;
       }
+    } else if (type === "time-picker" && attrs.isRange) {
+      width = 350;
     } else {
       width = 250;
     }
@@ -105,7 +85,7 @@ const timeRangeOptionsHandler = (config) => {
 };
 function appSearchItemHandler(column = {}) {
   const label = genDefaultLabel(column);
-  const { placeholder, startPlaceholder, endPlaceholder } = genPlaceholderHandler({ ...column, label });
+  const { placeholder} = genPlaceholderHandler({ ...column, label });
   const attrs = {
     clearable: true,
     ...column.attrs || {},
@@ -121,7 +101,8 @@ function appSearchItemHandler(column = {}) {
       readonly: column.readonly || false,
       width,
       inputWidth,
-      timeRangeOptions: timeRangeOptionsHandler(column)
+      timeRangeOptions: timeRangeOptionsHandler(column),
+      attrs
     }
   );
   if (/^(input)$/.test(column.type)) {
@@ -146,17 +127,6 @@ function appSearchItemHandler(column = {}) {
         }
       }
     };
-  } else if (/^date-picker$/.test(column.type)) {
-    return {
-      ...column,
-      attrs: {
-        format: attrs.format || getDefaultValueFormatByType(attrs.type),
-        valueFormat: attrs.valueFormat || getDefaultValueFormatByType(attrs.type),
-        ...attrs,
-        startPlaceholder,
-        endPlaceholder
-      }
-    };
   }
   return column;
 }