ele-admin-plus 1.4.0-beta.1 → 1.4.1-beta.1

package/es/ele-backtop/index.js

@@ -1,10 +1,10 @@
-import { defineComponent, ref, shallowRef, watch, onMounted, onBeforeUnmount, createBlock, openBlock, Transition, withCtx, createElementBlock, createCommentVNode, normalizeStyle, renderSlot, createVNode, unref } from "vue";
+import { defineComponent, ref, shallowRef, watch, onMounted, onBeforeUnmount, createBlock, openBlock, Transition, withCtx, createElementBlock, createCommentVNode, mergeProps, renderSlot, createVNode, unref } from "vue";
 import { ElIcon } from "element-plus";
 import { ArrowUp } from "../icons/index";
 import { throttle } from "../utils/common";
 import { backtopEmits, backtopProps } from "./props";
 const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...{ name: "EleBacktop" },
+  ...{ name: "EleBacktop", inheritAttrs: false },
   __name: "index",
   props: backtopProps,
   emits: backtopEmits,
@@ -67,15 +67,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createBlock(Transition, { name: _ctx.transitionName }, {
         default: withCtx(() => [
-          visible.value ? (openBlock(), createElementBlock("div", {
-            key: 0,
+          visible.value ? (openBlock(), createElementBlock("div", mergeProps({ key: 0 }, _ctx.$attrs, {
             class: "ele-backtop",
-            style: normalizeStyle({
+            style: {
               bottom: typeof _ctx.bottom === "number" ? `${_ctx.bottom}px` : _ctx.bottom,
               right: typeof _ctx.right === "number" ? `${_ctx.right}px` : _ctx.right
-            }),
+            },
             onClick: handleClick
-          }, [
+          }), [
             renderSlot(_ctx.$slots, "default", {}, () => [
               createVNode(unref(ElIcon), null, {
                 default: withCtx(() => [
@@ -84,7 +83,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 _: 1
               })
             ])
-          ], 4)) : createCommentVNode("", true)
+          ], 16)) : createCommentVNode("", true)
         ]),
         _: 3
       }, 8, ["name"]);

package/es/ele-basic-select/components/select-view.d.ts

@@ -0,0 +1,129 @@
+import { ElInputInstance } from '../../ele-app/el';
+import { SelectedItem } from '../types';
+
+declare function __VLS_template(): {
+    prefix?(_: {}): any;
+    clearIcon?(_: {}): any;
+    suffixIcon?(_: {
+        visible: boolean;
+    }): any;
+    maxTagPlaceholder?(_: {
+        omittedValues: SelectedItem[];
+        omittedSize: number;
+    }): any;
+    default?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    value: {
+        type: import('vue').PropType<import('../types').SelectValue>;
+        default: () => null;
+    };
+    multiple: BooleanConstructor;
+    disabled: BooleanConstructor;
+    size: import('vue').PropType<import('../../ele-app/el').ElInputProps["size"]>;
+    clearable: BooleanConstructor;
+    placeholder: StringConstructor;
+    selectedLabel: StringConstructor;
+    selected: import('vue').PropType<SelectedItem[]>;
+    maxTagCount: NumberConstructor;
+    maxTagTextLength: NumberConstructor;
+    tagType: import('vue').PropType<import('../../ele-app/el').ElTagProps["type"]>;
+    automaticDropdown: BooleanConstructor;
+    filterable: BooleanConstructor;
+    visible: BooleanConstructor;
+    teleported: BooleanConstructor;
+    persistent: BooleanConstructor;
+    placement: import('vue').PropType<import('../../ele-app/plus').EleTooltipProps["placement"]>;
+    transition: {
+        type: StringConstructor;
+        default: string;
+    };
+    popperOptions: import('vue').PropType<import('../../ele-app/plus').EleTooltipProps["popperOptions"]>;
+    popperClass: StringConstructor;
+    popperWidth: (StringConstructor | NumberConstructor)[];
+    selectClass: StringConstructor;
+    selectStyle: import('vue').PropType<import('../../ele-app/types').StyleValue>;
+    inputStyle: import('vue').PropType<import('../../ele-app/types').StyleValue>;
+    selectTagsStyle: import('vue').PropType<import('../../ele-app/types').StyleValue>;
+    popperType: import('vue').PropType<import('../types').PopperType>;
+    popperProps: import('vue').PropType<import('../types').PopperProps>;
+    popperSlots: ObjectConstructor;
+}>, {
+    inputRef: import('vue').Ref<ElInputInstance, ElInputInstance>;
+    searchRef: import('vue').Ref<ElInputInstance, ElInputInstance>;
+    currentTags: import('vue').ComputedRef<SelectedItem[]>;
+    omittedTags: import('vue').ComputedRef<SelectedItem[]>;
+    omittedSize: import('vue').ComputedRef<number>;
+    focusSearchInput: () => void;
+    updateSearchValue: (modelValue: string) => void;
+    updateInputValue: (modelValue: string) => void;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    clear: () => void;
+    focus: (_e: FocusEvent) => void;
+    blur: (_e: FocusEvent) => void;
+    "update:visible": (_visible: boolean) => void;
+    filterChange: (_value: string) => void;
+    removeTag: (_item: SelectedItem) => void;
+    inputClick: (_e: MouseEvent) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    value: {
+        type: import('vue').PropType<import('../types').SelectValue>;
+        default: () => null;
+    };
+    multiple: BooleanConstructor;
+    disabled: BooleanConstructor;
+    size: import('vue').PropType<import('../../ele-app/el').ElInputProps["size"]>;
+    clearable: BooleanConstructor;
+    placeholder: StringConstructor;
+    selectedLabel: StringConstructor;
+    selected: import('vue').PropType<SelectedItem[]>;
+    maxTagCount: NumberConstructor;
+    maxTagTextLength: NumberConstructor;
+    tagType: import('vue').PropType<import('../../ele-app/el').ElTagProps["type"]>;
+    automaticDropdown: BooleanConstructor;
+    filterable: BooleanConstructor;
+    visible: BooleanConstructor;
+    teleported: BooleanConstructor;
+    persistent: BooleanConstructor;
+    placement: import('vue').PropType<import('../../ele-app/plus').EleTooltipProps["placement"]>;
+    transition: {
+        type: StringConstructor;
+        default: string;
+    };
+    popperOptions: import('vue').PropType<import('../../ele-app/plus').EleTooltipProps["popperOptions"]>;
+    popperClass: StringConstructor;
+    popperWidth: (StringConstructor | NumberConstructor)[];
+    selectClass: StringConstructor;
+    selectStyle: import('vue').PropType<import('../../ele-app/types').StyleValue>;
+    inputStyle: import('vue').PropType<import('../../ele-app/types').StyleValue>;
+    selectTagsStyle: import('vue').PropType<import('../../ele-app/types').StyleValue>;
+    popperType: import('vue').PropType<import('../types').PopperType>;
+    popperProps: import('vue').PropType<import('../types').PopperProps>;
+    popperSlots: ObjectConstructor;
+}>> & Readonly<{
+    onClear?: (() => any) | undefined;
+    onFocus?: ((_e: FocusEvent) => any) | undefined;
+    onBlur?: ((_e: FocusEvent) => any) | undefined;
+    "onUpdate:visible"?: ((_visible: boolean) => any) | undefined;
+    onFilterChange?: ((_value: string) => any) | undefined;
+    onRemoveTag?: ((_item: SelectedItem) => any) | undefined;
+    onInputClick?: ((_e: MouseEvent) => any) | undefined;
+}>, {
+    value: import('../types').SelectValue;
+    teleported: boolean;
+    disabled: boolean;
+    clearable: boolean;
+    filterable: boolean;
+    persistent: boolean;
+    visible: boolean;
+    transition: string;
+    automaticDropdown: boolean;
+    multiple: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/es/ele-basic-select/components/select-view.js

@@ -0,0 +1,272 @@
+import { defineComponent, ref, computed, watch, createElementBlock, openBlock, normalizeStyle, normalizeClass, createVNode, createCommentVNode, renderSlot, unref, withKeys, createSlots, withCtx, createBlock, withModifiers, Fragment, renderList, createTextVNode, toDisplayString, nextTick } from "vue";
+import { ElInput, ElIcon, ElTag } from "element-plus";
+import { CloseCircleFilled, ArrowDown } from "../../icons/index";
+import { basicSelectEmits, basicSelectProps } from "../props";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{ name: "SelectView" },
+  __name: "select-view",
+  props: basicSelectProps,
+  emits: {
+    ...basicSelectEmits,
+    /** 输入框点击事件 */
+    inputClick: (_e) => true
+  },
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const inputRef = ref(null);
+    const searchRef = ref(null);
+    const inputValue = ref(
+      props.multiple || !props.selectedLabel ? "" : props.selectedLabel
+    );
+    const searchValue = ref("");
+    const isEmpty = computed(() => {
+      if (!props.multiple) {
+        return props.value == null || props.value === "";
+      }
+      return !Array.isArray(props.value) || !props.value.length;
+    });
+    const inputPlaceholder = computed(() => {
+      const str = isEmpty.value && props.placeholder ? props.placeholder : "";
+      if (!props.filterable || !props.visible || props.multiple) {
+        return str;
+      }
+      return props.selectedLabel || str;
+    });
+    const isCollapse = computed(() => {
+      return typeof props.maxTagCount === "number" && props.selected != null && props.selected.length > props.maxTagCount;
+    });
+    const currentTags = computed(() => {
+      if (!isCollapse.value || isEmpty.value || props.selected == null) {
+        return props.selected || [];
+      }
+      return props.selected.slice(0, props.maxTagCount);
+    });
+    const omittedTags = computed(() => {
+      if (!isCollapse.value || isEmpty.value || props.selected == null) {
+        return [];
+      }
+      return props.selected.slice(props.maxTagCount);
+    });
+    const omittedSize = computed(() => {
+      if (isEmpty.value || props.maxTagCount == null || props.maxTagCount < 0) {
+        return 0;
+      }
+      return props.value.length - props.maxTagCount;
+    });
+    const focusSearchInput = () => {
+      const input = props.multiple ? searchRef.value : inputRef.value;
+      input && input.focus();
+      nextTick(() => {
+        input && input.focus();
+      });
+    };
+    const updateSearchValue = (modelValue) => {
+      if (props.filterable && props.visible && props.multiple) {
+        searchValue.value = modelValue;
+        emit("filterChange", modelValue);
+      }
+    };
+    const updateInputValue = (modelValue) => {
+      if (props.filterable && props.visible && !props.multiple) {
+        inputValue.value = modelValue;
+        emit("filterChange", modelValue);
+      }
+    };
+    const updateVisible = (visible) => {
+      emit("update:visible", visible);
+    };
+    const handleTagClose = (item) => {
+      if (!props.disabled) {
+        emit("removeTag", item);
+      }
+    };
+    const handleClear = () => {
+      emit("clear");
+    };
+    const handleInputClick = (e) => {
+      emit("inputClick", e);
+    };
+    const handleInputFocus = (e) => {
+      if (props.automaticDropdown && !props.visible) {
+        updateVisible(true);
+      }
+      emit("focus", e);
+    };
+    const handleInputBlur = (e) => {
+      emit("blur", e);
+    };
+    const handleInputEsc = (e) => {
+      if (!props.disabled && props.visible) {
+        e.stopPropagation();
+        e.preventDefault();
+        updateVisible(false);
+      }
+    };
+    watch(
+      () => props.selectedLabel,
+      (label) => {
+        if (!props.filterable || !props.visible) {
+          inputValue.value = props.multiple || !label ? "" : label;
+        }
+      }
+    );
+    watch(
+      () => props.visible,
+      (visible) => {
+        if (props.filterable) {
+          if (props.multiple) {
+            searchValue.value = "";
+            if (visible) {
+              focusSearchInput();
+            }
+          } else {
+            const label = props.selectedLabel;
+            inputValue.value = visible || !label ? "" : label;
+          }
+        }
+      }
+    );
+    __expose({
+      inputRef,
+      searchRef,
+      currentTags,
+      omittedTags,
+      omittedSize,
+      focusSearchInput,
+      updateSearchValue,
+      updateInputValue
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([
+          "ele-select",
+          _ctx.selectClass,
+          { "is-empty": isEmpty.value },
+          { "is-multiple": _ctx.multiple },
+          { "is-disabled": _ctx.disabled },
+          { "is-filterable": _ctx.filterable },
+          { "is-small": _ctx.size === "small" },
+          { "is-large": _ctx.size === "large" },
+          { "is-opened": _ctx.visible }
+        ]),
+        style: normalizeStyle(_ctx.selectStyle)
+      }, [
+        createVNode(unref(ElInput), {
+          ref_key: "inputRef",
+          ref: inputRef,
+          size: _ctx.size,
+          disabled: _ctx.disabled,
+          validateEvent: false,
+          modelValue: inputValue.value,
+          placeholder: _ctx.filterable && _ctx.multiple && _ctx.visible ? "" : inputPlaceholder.value,
+          readonly: !(_ctx.filterable && !_ctx.multiple),
+          style: normalizeStyle(_ctx.inputStyle),
+          "onUpdate:modelValue": updateInputValue,
+          onClick: handleInputClick,
+          onFocus: handleInputFocus,
+          onBlur: handleInputBlur,
+          onKeydown: withKeys(handleInputEsc, ["esc"])
+        }, createSlots({
+          suffix: withCtx(() => [
+            _ctx.clearable && !_ctx.disabled && !isEmpty.value ? (openBlock(), createBlock(unref(ElIcon), {
+              key: 0,
+              class: "ele-select-clear el-input__icon",
+              onClick: withModifiers(handleClear, ["stop"])
+            }, {
+              default: withCtx(() => [
+                renderSlot(_ctx.$slots, "clearIcon", {}, () => [
+                  createVNode(unref(CloseCircleFilled))
+                ])
+              ]),
+              _: 3
+            })) : createCommentVNode("", true),
+            createVNode(unref(ElIcon), { class: "ele-select-arrow el-input__icon" }, {
+              default: withCtx(() => [
+                renderSlot(_ctx.$slots, "suffixIcon", { visible: _ctx.visible }, () => [
+                  createVNode(unref(ArrowDown))
+                ])
+              ]),
+              _: 3
+            })
+          ]),
+          _: 2
+        }, [
+          _ctx.$slots.prefix ? {
+            name: "prefix",
+            fn: withCtx(() => [
+              renderSlot(_ctx.$slots, "prefix")
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1032, ["size", "disabled", "modelValue", "placeholder", "readonly", "style"]),
+        _ctx.multiple ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: "ele-select-tags",
+          style: normalizeStyle(_ctx.selectTagsStyle)
+        }, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(currentTags.value, (item, index) => {
+            return openBlock(), createBlock(unref(ElTag), {
+              key: index + "-" + item.value,
+              size: _ctx.size,
+              type: _ctx.tagType,
+              closable: !_ctx.disabled,
+              disableTransitions: true,
+              title: item.label,
+              onClose: ($event) => handleTagClose(item)
+            }, {
+              default: withCtx(() => [
+                item.label && _ctx.maxTagTextLength && item.label.length > _ctx.maxTagTextLength ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                  createTextVNode(toDisplayString(item.label.slice(0, _ctx.maxTagTextLength)) + "... ", 1)
+                ], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                  createTextVNode(toDisplayString(item.label), 1)
+                ], 64))
+              ]),
+              _: 2
+            }, 1032, ["size", "type", "closable", "title", "onClose"]);
+          }), 128)),
+          isCollapse.value ? (openBlock(), createBlock(unref(ElTag), {
+            key: 0,
+            size: _ctx.size,
+            type: _ctx.tagType,
+            disableTransitions: true
+          }, {
+            default: withCtx(() => [
+              renderSlot(_ctx.$slots, "maxTagPlaceholder", {
+                omittedValues: omittedTags.value,
+                omittedSize: omittedSize.value
+              }, () => [
+                createTextVNode(" +" + toDisplayString(omittedSize.value), 1)
+              ])
+            ]),
+            _: 3
+          }, 8, ["size", "type"])) : createCommentVNode("", true),
+          !_ctx.disabled && _ctx.filterable ? (openBlock(), createBlock(unref(ElTag), {
+            key: 1,
+            size: _ctx.size,
+            disableTransitions: true,
+            class: "ele-select-search"
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(ElInput), {
+                ref_key: "searchRef",
+                ref: searchRef,
+                size: _ctx.size,
+                validateEvent: false,
+                modelValue: searchValue.value,
+                placeholder: inputPlaceholder.value,
+                "onUpdate:modelValue": updateSearchValue,
+                onKeydown: withKeys(handleInputEsc, ["esc"])
+              }, null, 8, ["size", "modelValue", "placeholder"])
+            ]),
+            _: 1
+          }, 8, ["size"])) : createCommentVNode("", true)
+        ], 4)) : createCommentVNode("", true),
+        renderSlot(_ctx.$slots, "default")
+      ], 6);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/ele-basic-select/index.d.ts

@@ -1,17 +1,7 @@
-import { ElInputInstance } from '../ele-app/el';
-import { EleTooltipInstance } from '../ele-app/plus';
+import { EleTooltipInstance, EleBasicSelectViewInstance } from '../ele-app/plus';
 import { SelectedItem } from './types';
 
-declare function __VLS_template(): {
-    prefix?(_: {}): any;
-    clearIcon?(_: {}): any;
-    suffixIcon?(_: {
-        visible: boolean;
-    }): any;
-    maxTagPlaceholder?(_: {
-        omittedValues: SelectedItem[];
-        omittedSize: number;
-    }): any;
+declare function __VLS_template(): Partial<Record<string, (_: any) => any>> & Partial<Record<any, (_: any) => any>> & Partial<Record<string, (_: any) => any>> & {
     default?(_: {}): any;
 };
 declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
@@ -46,21 +36,18 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     selectStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     inputStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     selectTagsStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    popperType: import('vue').PropType<import('./types').PopperType>;
+    popperProps: import('vue').PropType<import('./types').PopperProps>;
+    popperSlots: ObjectConstructor;
 }>, {
     tooltipRef: import('vue').Ref<EleTooltipInstance, EleTooltipInstance>;
-    inputRef: import('vue').Ref<ElInputInstance, ElInputInstance>;
-    searchRef: import('vue').Ref<ElInputInstance, ElInputInstance>;
-    currentTags: import('vue').ComputedRef<SelectedItem[]>;
-    omittedTags: import('vue').ComputedRef<SelectedItem[]>;
-    omittedSize: import('vue').ComputedRef<number>;
+    selectViewRef: import('vue').Ref<EleBasicSelectViewInstance, EleBasicSelectViewInstance>;
     updatePopper: () => void;
     focusSearchInput: (e?: MouseEvent) => void;
-    updateSearchValue: (modelValue: string) => void;
-    updateInputValue: (modelValue: string) => void;
     updateVisible: (visible: boolean) => void;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    focus: (_e: FocusEvent) => void;
     blur: (_e: FocusEvent) => void;
+    focus: (_e: FocusEvent) => void;
     clear: () => void;
     "update:visible": (_visible: boolean) => void;
     filterChange: (_value: string) => void;
@@ -97,18 +84,21 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     selectStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     inputStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     selectTagsStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    popperType: import('vue').PropType<import('./types').PopperType>;
+    popperProps: import('vue').PropType<import('./types').PopperProps>;
+    popperSlots: ObjectConstructor;
 }>> & Readonly<{
-    onFocus?: ((_e: FocusEvent) => any) | undefined;
     onBlur?: ((_e: FocusEvent) => any) | undefined;
+    onFocus?: ((_e: FocusEvent) => any) | undefined;
     onClear?: (() => any) | undefined;
     "onUpdate:visible"?: ((_visible: boolean) => any) | undefined;
     onFilterChange?: ((_value: string) => any) | undefined;
     onRemoveTag?: ((_item: SelectedItem) => any) | undefined;
 }>, {
-    value: import('./types').SelectValue;
     teleported: boolean;
-    clearable: boolean;
     disabled: boolean;
+    clearable: boolean;
+    value: import('./types').SelectValue;
     filterable: boolean;
     persistent: boolean;
     visible: boolean;