ele-admin-plus 1.1.4 → 1.1.5-beta.2

package/es/ele-table/style/index.scss

@@ -1,21 +1,20 @@
 @use '../../style/themes/default.scss' as *;
 @use '../../style/util.scss' as *;
+@use '../../ele-data-table/style/css-var.scss' as *;
 @use './css-var.scss' as *;
 
 @include set-table-var($ele);
 
-/* 静态表格 */
 .ele-table {
   width: 100%;
   border-spacing: 0;
   border-collapse: separate;
-  background: eleVar('table', 'bg');
-  border-top-left-radius: eleVar('table', 'radius');
-  border-top-right-radius: eleVar('table', 'radius');
 
+  /* 单元格样式 */
   & > tr,
   & > thead > tr,
-  & > tbody > tr {
+  & > tbody > tr,
+  & > tfoot > tr {
     & > th,
     & > td {
       color: eleVar('table', 'color');
@@ -42,15 +41,47 @@
     }
   }
 
+  /* 表头单元格 */
   & > tr > th,
   & > thead > tr > th,
   & > tbody > tr > th,
+  & > tfoot > tr > th,
   & > thead > tr > td {
     color: eleVar('table', 'th-color');
     font-weight: eleVar('table', 'th-font-weight');
     background: eleVar('table', 'th-bg');
   }
 
+  & > thead > tr > th {
+    position: relative;
+
+    &::after {
+      content: '';
+      width: 0;
+      height: 20px;
+      border-right: 1px solid eleVar('table', 'border-color');
+      position: absolute;
+      right: 0;
+      top: 50%;
+      margin-top: -10px;
+    }
+  }
+
+  & > thead > tr > th:last-child::after,
+  &.is-border > thead > tr > th::after {
+    display: none;
+  }
+
+  /* 表尾 */
+  & > tfoot > tr > td {
+    background: eleVar('table', 'th-bg');
+  }
+
+  &:not(.is-border) > tfoot > tr:last-child > td {
+    border-bottom-width: 0;
+  }
+
+  /* 圆角 */
   & > thead > tr:first-child > th:first-child,
   & > thead > tr:first-child > td:first-child {
     border-top-left-radius: eleVar('table', 'radius');
@@ -61,7 +92,25 @@
     border-top-right-radius: eleVar('table', 'radius');
   }
 
-  // 斑马纹
+  & > tfoot > tr:last-child > td:first-child {
+    border-bottom-left-radius: eleVar('table', 'radius');
+  }
+
+  & > tfoot > tr:last-child > td:last-child {
+    border-bottom-right-radius: eleVar('table', 'radius');
+  }
+
+  &.has-header {
+    border-top-left-radius: eleVar('table', 'radius');
+    border-top-right-radius: eleVar('table', 'radius');
+  }
+
+  &.has-footer {
+    border-bottom-left-radius: eleVar('table', 'radius');
+    border-bottom-right-radius: eleVar('table', 'radius');
+  }
+
+  /* 斑马纹 */
   &.is-stripe {
     & > tr:nth-child(even),
     & > tbody > tr:nth-child(even) {
@@ -75,7 +124,7 @@
     }
   }
 
-  // 行选中
+  /* 行选中 */
   & > tr.is-active,
   & > tbody > tr.is-active,
   &.is-stripe > tr.is-active,
@@ -89,14 +138,12 @@
     }
   }
 
-  // 尺寸控制
+  /* 大型尺寸 */
   &.is-large {
-    border-top-left-radius: eleVar('table', 'lg-radius');
-    border-top-right-radius: eleVar('table', 'lg-radius');
-
     & > tr,
     & > thead > tr,
-    & > tbody > tr {
+    & > tbody > tr,
+    & > tfoot > tr {
       & > th,
       & > td {
         font-size: eleVar('table', 'lg-size');
@@ -113,15 +160,32 @@
     & > thead > tr:first-child > td:last-child {
       border-top-right-radius: eleVar('table', 'lg-radius');
     }
+
+    & > tfoot > tr:last-child > td:first-child {
+      border-bottom-left-radius: eleVar('table', 'lg-radius');
+    }
+
+    & > tfoot > tr:last-child > td:last-child {
+      border-bottom-right-radius: eleVar('table', 'lg-radius');
+    }
+
+    &.has-header {
+      border-top-left-radius: eleVar('table', 'lg-radius');
+      border-top-right-radius: eleVar('table', 'lg-radius');
+    }
+
+    &.has-footer {
+      border-bottom-left-radius: eleVar('table', 'lg-radius');
+      border-bottom-right-radius: eleVar('table', 'lg-radius');
+    }
   }
 
+  /* 小型尺寸 */
   &.is-small {
-    border-top-left-radius: eleVar('table', 'sm-radius');
-    border-top-right-radius: eleVar('table', 'sm-radius');
-
     & > tr,
     & > thead > tr,
-    & > tbody > tr {
+    & > tbody > tr,
+    & > tfoot > tr {
       & > th,
       & > td {
         font-size: eleVar('table', 'sm-size');
@@ -138,16 +202,35 @@
     & > thead > tr:first-child > td:last-child {
       border-top-right-radius: eleVar('table', 'sm-radius');
     }
+
+    & > tfoot > tr:last-child > td:first-child {
+      border-bottom-left-radius: eleVar('table', 'sm-radius');
+    }
+
+    & > tfoot > tr:last-child > td:last-child {
+      border-bottom-right-radius: eleVar('table', 'sm-radius');
+    }
+
+    &.has-header {
+      border-top-left-radius: eleVar('table', 'sm-radius');
+      border-top-right-radius: eleVar('table', 'sm-radius');
+    }
+
+    &.has-footer {
+      border-bottom-left-radius: eleVar('table', 'sm-radius');
+      border-bottom-right-radius: eleVar('table', 'sm-radius');
+    }
   }
 
-  // 全边框
+  /* 全边框 */
   &.is-border {
     border-top: 1px solid eleVar('table', 'border-color');
     border-left: 1px solid eleVar('table', 'border-color');
 
     & > tr,
     & > thead > tr,
-    & > tbody > tr {
+    & > tbody > tr,
+    & > tfoot > tr {
       & > th,
       & > td {
         border-right-width: 1px;
@@ -155,8 +238,6 @@
     }
   }
 
-  // 开关
-  .el-switch {
-    height: auto;
-  }
+  /* 表格内组件样式优化 */
+  @include table-common-style();
 }

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

@@ -18,7 +18,7 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
     labelKey: {
-        type: StringConstructor;
+        type: StringConstructor; /** 下拉选择组件 */
         default: string;
     };
     initValue: import("vue").PropType<InitValue>;
@@ -29,11 +29,11 @@ declare const _default: import("vue").DefineComponent<{
     maxTagCount: NumberConstructor;
     maxTagTextLength: NumberConstructor;
     teleported: {
-        type: BooleanConstructor;
+        type: BooleanConstructor; /** 表格单选选中数据 */
         default: boolean;
     };
     persistent: {
-        type: BooleanConstructor;
+        type: BooleanConstructor; /** 表格多选选中数据 */
         default: boolean;
     };
     automaticDropdown: BooleanConstructor;
@@ -42,12 +42,13 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
     placement: {
-        type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement) | ((new (...args: any[]) => "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement))[], unknown, unknown> | undefined>;
+        type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, import("element-plus").Placement, unknown> | undefined>;
         default: string;
     };
     popperWidth: (StringConstructor | NumberConstructor)[];
     popperOptions: import("vue").PropType<Partial<import("element-plus").Options> | undefined>;
     popperClass: StringConstructor;
+    /** 更新下拉框显示状态 */
     responsive: {
         type: BooleanConstructor;
         default: null;
@@ -61,8 +62,30 @@ declare const _default: import("vue").DefineComponent<{
         label: string;
         value: SingleValue;
     }[]>;
-    current: import("vue").Ref<DataItem | null | undefined>;
-    selections: import("vue").Ref<DataItem[]>;
+    current: import("vue").Ref<{
+        [x: string]: any;
+        [x: number]: any;
+        [x: symbol]: any;
+        children?: any[] | undefined;
+        _rowKey?: import("../ele-data-table/types").DataKey | undefined;
+        _rowIndex?: number | undefined;
+        _rowDisabled?: boolean | undefined;
+        _isExpandRow?: boolean | undefined;
+        _expandParent?: any | undefined;
+        _expandParantIndex?: number | undefined;
+    } | null | undefined>;
+    selections: import("vue").Ref<{
+        [x: string]: any;
+        [x: number]: any;
+        [x: symbol]: any;
+        children?: any[] | undefined;
+        _rowKey?: import("../ele-data-table/types").DataKey | undefined;
+        _rowIndex?: number | undefined;
+        _rowDisabled?: boolean | undefined;
+        _isExpandRow?: boolean | undefined;
+        _expandParent?: any | undefined;
+        _expandParantIndex?: number | undefined;
+    }[]>;
     selectPopperClass: import("vue").ComputedRef<string>;
     updateVisible: (value: boolean) => void;
     onRemoveTag: (item: SelectedItem) => void;
@@ -79,7 +102,7 @@ declare const _default: import("vue").DefineComponent<{
     visibleChange: (_visible: boolean) => boolean;
     removeTag: (_value: SingleValue) => boolean;
     clear: () => boolean;
-    focus: (_e: FocusEvent) => boolean;
+    focus: (_e: FocusEvent) => boolean; /** 清空 */
     blur: (_e: FocusEvent) => boolean;
     select: (_item: DataItem | DataItem[]) => boolean;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
@@ -99,7 +122,7 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
     labelKey: {
-        type: StringConstructor;
+        type: StringConstructor; /** 下拉选择组件 */
         default: string;
     };
     initValue: import("vue").PropType<InitValue>;
@@ -110,11 +133,11 @@ declare const _default: import("vue").DefineComponent<{
     maxTagCount: NumberConstructor;
     maxTagTextLength: NumberConstructor;
     teleported: {
-        type: BooleanConstructor;
+        type: BooleanConstructor; /** 表格单选选中数据 */
         default: boolean;
     };
     persistent: {
-        type: BooleanConstructor;
+        type: BooleanConstructor; /** 表格多选选中数据 */
         default: boolean;
     };
     automaticDropdown: BooleanConstructor;
@@ -123,12 +146,13 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
     placement: {
-        type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement) | ((new (...args: any[]) => "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement))[], unknown, unknown> | undefined>;
+        type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, import("element-plus").Placement, unknown> | undefined>;
         default: string;
     };
     popperWidth: (StringConstructor | NumberConstructor)[];
     popperOptions: import("vue").PropType<Partial<import("element-plus").Options> | undefined>;
     popperClass: StringConstructor;
+    /** 更新下拉框显示状态 */
     responsive: {
         type: BooleanConstructor;
         default: null;
@@ -136,14 +160,14 @@ declare const _default: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_e: FocusEvent) => any) | undefined;
     onBlur?: ((_e: FocusEvent) => any) | undefined;
-    onVisibleChange?: ((_visible: boolean) => any) | undefined;
-    "onUpdate:modelValue"?: ((_value: SelectValue) => any) | undefined;
-    onChange?: ((_value: SelectValue) => any) | undefined;
     onSelect?: ((_item: DataItem | DataItem[]) => any) | undefined;
+    onChange?: ((_value: SelectValue) => any) | undefined;
+    "onUpdate:modelValue"?: ((_value: SelectValue) => any) | undefined;
+    onVisibleChange?: ((_visible: boolean) => any) | undefined;
     onClear?: (() => any) | undefined;
     onRemoveTag?: ((_value: SingleValue) => any) | undefined;
 }, {
-    placement: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement) | ((new (...args: any[]) => "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement))[], unknown, unknown> | undefined;
+    placement: import("element-plus/es/utils").EpPropMergeType<StringConstructor, import("element-plus").Placement, unknown> | undefined;
     disabled: boolean;
     teleported: boolean;
     autocomplete: string;

package/es/ele-table-select/index.js

@@ -254,11 +254,7 @@ const _sfc_main = defineComponent({
       }
     };
     const updatePopover = () => {
-      var _a, _b;
-      const popperRef = (_b = (_a = selectRef.value) == null ? void 0 : _a.popoverRef) == null ? void 0 : _b.popperRef;
-      if (popperRef == null ? void 0 : popperRef.popperInstanceRef) {
-        popperRef.popperInstanceRef.update();
-      }
+      selectRef.value && selectRef.value.updatePopper();
     };
     onMounted(() => {
       var _a;

package/es/ele-table-select/props.d.ts

@@ -7,52 +7,75 @@ import type { InitValue } from './types';
  * 属性
  */
 export declare const tableSelectProps: {
+    /** 绑定值 */
     modelValue: PropType<SelectValue>;
+    /** 是否多选 */
     multiple: BooleanConstructor;
+    /** 是否禁用 */
     disabled: BooleanConstructor;
+    /** 尺寸 */
     size: PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never> | undefined>;
+    /** 是否支持清除 */
     clearable: BooleanConstructor;
+    /** 占位符 */
     placeholder: StringConstructor;
+    /** input 的 name 属性 */
     name: StringConstructor;
+    /** input 的 autocomplete 属性 */
     autocomplete: {
         type: StringConstructor;
         default: string;
     };
+    /** value 的键名 */
     valueKey: {
         type: StringConstructor;
         default: string;
     };
+    /** label 的键名 */
     labelKey: {
         type: StringConstructor;
         default: string;
     };
+    /** 默认选中值 */
     initValue: PropType<InitValue>;
+    /** 表格配置 */
     tableProps: {
         type: PropType<Partial<ProTableProps>>;
         required: boolean;
     };
+    /** 最多显示多少个 tag */
     maxTagCount: NumberConstructor;
+    /** 最大显示的 tag 文本长度 */
     maxTagTextLength: NumberConstructor;
+    /** 是否将 popover 内容插入 body */
     teleported: {
         type: BooleanConstructor;
         default: boolean;
     };
+    /** 始终渲染 popover 内容 */
     persistent: {
         type: BooleanConstructor;
         default: boolean;
     };
+    /** 是否在输入框获得焦点后自动弹出选项菜单 */
     automaticDropdown: BooleanConstructor;
+    /** 标签类型 */
     tagType: {
         type: PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "success" | "warning" | "info" | "danger", unknown> | undefined>;
         default: string;
     };
+    /** 气泡框位置 */
     placement: {
-        type: PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement) | ((new (...args: any[]) => "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement))[], unknown, unknown> | undefined>;
+        type: PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, import("element-plus").Placement, unknown> | undefined>;
         default: string;
     };
+    /** popper 宽度 */
     popperWidth: (StringConstructor | NumberConstructor)[];
+    /** popper.js 的参数 */
     popperOptions: PropType<Partial<import("element-plus").Options> | undefined>;
+    /** 下拉框的类名 */
     popperClass: StringConstructor;
+    /** 是否开启响应式 */
     responsive: {
         type: BooleanConstructor;
         default: null;
@@ -63,12 +86,20 @@ export type TableSelectProps = ExtractPropTypes<typeof tableSelectProps>;
  * 事件
  */
 export declare const tableSelectEmits: {
+    /** 更新绑定值 */
     'update:modelValue': (_value: SelectValue) => boolean;
+    /** 选中值改变事件 */
     change: (_value: SelectValue) => boolean;
+    /** 下拉框展开状态改变事件 */
     visibleChange: (_visible: boolean) => boolean;
+    /** 多选移除选中标签事件 */
     removeTag: (_value: SingleValue) => boolean;
+    /** 清空事件 */
     clear: () => boolean;
+    /** 获取焦点事件 */
     focus: (_e: FocusEvent) => boolean;
+    /** 失去焦点事件 */
     blur: (_e: FocusEvent) => boolean;
+    /** 表格行选中事件 */
     select: (_item: DataItem | DataItem[]) => boolean;
 };

package/es/ele-table-select/props.js

@@ -1,94 +1,94 @@
 const tableSelectProps = {
-  // 绑定值
+  /** 绑定值 */
   modelValue: [String, Number, Boolean, Array],
-  // 是否多选
+  /** 是否多选 */
   multiple: Boolean,
-  // 是否禁用
+  /** 是否禁用 */
   disabled: Boolean,
-  // 尺寸
+  /** 尺寸 */
   size: String,
-  // 是否支持清除
+  /** 是否支持清除 */
   clearable: Boolean,
-  // 占位符
+  /** 占位符 */
   placeholder: String,
-  // input 的 name 属性
+  /** input 的 name 属性 */
   name: String,
-  // input 的 autocomplete 属性
+  /** input 的 autocomplete 属性 */
   autocomplete: {
     type: String,
     default: "off"
   },
-  // value 的键名
+  /** value 的键名 */
   valueKey: {
     type: String,
     default: "value"
   },
-  // label 的键名
+  /** label 的键名 */
   labelKey: {
     type: String,
     default: "label"
   },
-  // 默认选中值
+  /** 默认选中值 */
   initValue: [Object, Array],
-  // 表格配置
+  /** 表格配置 */
   tableProps: {
     type: Object,
     required: true
   },
-  // 最多显示多少个 tag
+  /** 最多显示多少个 tag */
   maxTagCount: Number,
-  // 最大显示的 tag 文本长度
+  /** 最大显示的 tag 文本长度 */
   maxTagTextLength: Number,
-  // 是否将 popover 内容插入 body
+  /** 是否将 popover 内容插入 body */
   teleported: {
     type: Boolean,
     default: true
   },
-  // 始终渲染 popover 内容
+  /** 始终渲染 popover 内容 */
   persistent: {
     type: Boolean,
     default: true
   },
-  // 是否在输入框获得焦点后自动弹出选项菜单
+  /** 是否在输入框获得焦点后自动弹出选项菜单 */
   automaticDropdown: Boolean,
-  // 标签类型
+  /** 标签类型 */
   tagType: {
     type: String,
     default: "info"
   },
-  // 气泡框位置
+  /** 气泡框位置 */
   placement: {
     type: String,
     default: "bottom-start"
   },
-  // popper 宽度
+  /** popper 宽度 */
   popperWidth: [Number, String],
-  // popper.js 的参数
+  /** popper.js 的参数 */
   popperOptions: Object,
-  // 下拉框的类名
+  /** 下拉框的类名 */
   popperClass: String,
-  // 是否开启响应式
+  /** 是否开启响应式 */
   responsive: {
     type: Boolean,
     default: null
   }
 };
 const tableSelectEmits = {
-  // 更新绑定值
+  /** 更新绑定值 */
   "update:modelValue": (_value) => true,
-  // 选中值改变事件
+  /** 选中值改变事件 */
   change: (_value) => true,
-  // 下拉框展开状态改变事件
+  /** 下拉框展开状态改变事件 */
   visibleChange: (_visible) => true,
-  // 多选移除选中标签事件
+  /** 多选移除选中标签事件 */
   removeTag: (_value) => true,
-  // 清空事件
+  /** 清空事件 */
   clear: () => true,
-  // 获取焦点事件
+  /** 获取焦点事件 */
   focus: (_e) => true,
-  // 失去焦点事件
+  /** 失去焦点事件 */
   blur: (_e) => true,
-  // 表格行选中事件
+  /** 表格行选中事件 */
   select: (_item) => true
 };
 export {

package/es/ele-table-select/style/css-var.scss

@@ -1,5 +1,6 @@
 @use '../../style/util.scss' as *;
 
+/* 表格下拉选择主题变量 */
 @mixin set-table-select-var($var) {
   .ele-table-select-popper {
     @include set-ele-var('table-select', $var);

package/es/ele-table-select/style/index.scss

@@ -5,14 +5,14 @@
 @include set-table-select-var($ele);
 
 .ele-table-select-popper {
-  & > .ele-popover-body > .ele-popover-content {
+  & > .ele-popover-body {
     padding: eleVar('table-select', 'padding');
 
-    & > .ele-pro-table {
+    & > .ele-pro-table > .ele-data-table,
+    & > .ele-pro-table > .ele-virtual-table {
       #{eleVarName('table', 'th-bg')}: eleVar('table-select', 'th-bg');
       #{eleVarName('table', 'tr-bg')}: eleVar('table-select', 'tr-bg');
       #{eleVarName('table', 'even-bg')}: eleVar('table-select', 'even-bg');
-      #{eleVarName('table', 'bg')}: eleVar('table-select', 'tr-bg');
     }
   }
 

package/es/ele-table-select/types/index.d.ts

@@ -1,5 +1,3 @@
-import type EleProTable from "../ele-pro-table/index";
-import type EleBasicSelect from "../ele-basic-select/index";
 /**
  * 单选 initValue
  */
@@ -12,11 +10,3 @@ export type MultipleInitValue = Array<SingleInitValue>;
  * initValue
  */
 export type InitValue = SingleInitValue | MultipleInitValue | undefined | null;
-/**
- * 高级表格组件实例
- */
-export type EleProTableInstance = InstanceType<typeof EleProTable> | null;
-/**
- * 通用下拉选择组件实例
- */
-export type EleBasicSelectInstance = InstanceType<typeof EleBasicSelect> | null;