@qin-ui/antd-vue-pro 2.0.9 → 2.0.11

package/README.md

@@ -2,6 +2,8 @@
 
 > 二次封装 ant-design-vue 组件，提供 ProForm 和 ProTable 高级组件。
 
+## [使用示例和文档详细内容](https://dufan3715.github.io/pro-components/)
+
 ---
 
 ## ✨ 特性
@@ -109,5 +111,3 @@ antd-vue-pro 导出了一个名为 `useTable` 的自定义 Hook，用于处理
 | button-bar  | 自定义按钮组   |
 | toolbar     | 自定义工具栏   |
 | table       | 自定义表格     |
-
-## [更多使用示例和文档详细内容](https://dufan3715.github.io/pro-components/)

package/es/antd-vue-pro.css

@@ -1,52 +1,52 @@
-.search-form[data-v-107a0198] .ant-form-item {
+.search-form[data-v-a5f1b551] .ant-form-item {
   margin: 0;
 }
-.expand-toggle-button[data-v-107a0198] {
+.expand-toggle-button[data-v-a5f1b551] {
   display: flex;
   align-items: center;
   padding: 0;
   padding-left: 4px;
 }
-.transition[data-v-107a0198] {
+.transition[data-v-a5f1b551] {
   transition: all 0.25s;
 }
-.search-form-container[data-v-5904d9f4] {
+.search-form-container[data-v-727c8aba] {
   margin-bottom: 24px;
   padding: 24px;
-  background-color: #fff;
 }
-.table-container[data-v-f089d734] {
+.table-container[data-v-185690a3] {
   flex: 1;
   padding: 24px 24px 0;
-  background-color: #fff;
 }
-.control-icon[data-v-d8e78b5b] {
+.size-control-button[data-v-b7eded53] {
   display: flex;
   align-items: center;
-  cursor: pointer;
+  padding-right: 12px;
+  padding-left: 12px;
 }
-.control-icon[data-v-d8e78b5b] :hover {
-  color: #1677ff;
+.size-control-button[data-v-b7eded53] svg {
+  transform: scale(1.3);
 }
-.control-icon[data-v-88c80679] {
+.column-control-button[data-v-cdcab425] {
   display: flex;
   align-items: center;
-  cursor: pointer;
+  padding-right: 12px;
+  padding-left: 12px;
 }
-.control-icon[data-v-88c80679] :hover {
-  color: #1677ff;
+.column-control-button[data-v-cdcab425] svg {
+  transform: scale(1.2, 1.4);
 }
-.pro-table .pro-table-header[data-v-eb2f3860] {
+.pro-table .pro-table-header[data-v-7b0601fa] {
   display: flex;
   align-items: center;
   justify-content: flex-end;
 }
-.pro-table .pro-table-header[data-v-eb2f3860]:empty {
+.pro-table .pro-table-header[data-v-7b0601fa]:empty {
   display: none;
 }
-.pro-table .pro-table-header + .pro-table-content[data-v-eb2f3860] {
+.pro-table .pro-table-header + .pro-table-content[data-v-7b0601fa] {
   margin-top: 16px;
 }
-.pro-table[data-v-eb2f3860] .ant-pagination .ant-pagination-total-text {
+.pro-table[data-v-7b0601fa] .ant-pagination .ant-pagination-total-text {
   flex: 1;
 }

package/es/form/index.js

@@ -1,5 +1,6 @@
 import { Form, Input, Textarea, InputSearch, InputPassword, InputNumber, Select, Cascader, DatePicker, RangePicker, TimePicker, CheckboxGroup, RadioGroup, Switch, Slider, TreeSelect, Transfer, Row, Col, FormItem } from "ant-design-vue";
 import "ant-design-vue/es/table";
+import "ant-design-vue/es/config-provider/context";
 import { useProviderDisabled, useInjectDisabled } from "ant-design-vue/es/config-provider/DisabledContext";
 import { colProps } from "ant-design-vue/es/grid/Col";
 import { formItemProps, useInjectFormItemContext } from "ant-design-vue/es/form";

package/es/index.d.ts

@@ -233,6 +233,10 @@ grid: Grid;
 fields: Fields;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
+declare type ButtonProps = {
+    onClick: () => void;
+};
+
 declare type CascaderSlots = CompSlot<'clearIcon' | 'expandIcon' | 'maxTagPlaceholder' | 'notFoundContent' | 'removeIcon' | 'suffixIcon' | 'tagRender'>;
 
 export declare type Column<D extends Data = Data> = Omit<ColumnType, 'dataIndex' | 'key'> & {
@@ -253,95 +257,6 @@ export declare type ComponentVars = Partial<RequiredComponentVars>;
  */
 declare type CompSlot<T extends string> = Partial<Record<KeyExpandString<T>, SlotComponentType>>;
 
-/**
- * @type {CompType} 字段类型集合
- */
-export declare type CompType = {
-    /** 文本框 */
-    'input': {
-        component: 'input';
-        slots?: InputSlots;
-    } & InputProps;
-    /** 文本域 */
-    'textarea': {
-        component: 'textarea';
-        slots?: InputSlots;
-    } & TextAreaProps;
-    /** 文本框-密码 */
-    'input-password': {
-        component: 'input-password';
-        slots?: InputSlots;
-    } & InputProps;
-    /** 文本框-搜索 */
-    'input-search': {
-        component: 'input-search';
-        slots?: InputSlots;
-    } & InputProps;
-    /** 数字文本框 */
-    'input-number': {
-        component: 'input-number';
-        slots?: InputNumberSlots;
-    } & InputNumberProps;
-    /** 下拉选择器 */
-    'select': {
-        component: 'select';
-        slots?: SelectSlots;
-    } & SelectProps;
-    /** 级联选择器 */
-    'cascader': {
-        component: 'cascader';
-        slots?: CascaderSlots;
-    } & CascaderProps;
-    /** 日期选择器 */
-    'date-picker': {
-        component: 'date-picker';
-        slots?: DatePickerSlots;
-    } & DatePickerProps;
-    /** 日期选择器-范围 */
-    'range-picker': {
-        component: 'range-picker';
-        slots?: RangePickerSlots;
-    } & RangePickerProps;
-    /** 时间选择器 */
-    'time-picker': {
-        component: 'time-picker';
-        slots?: TimePickerSlots;
-    } & TimePickerProps;
-    /** 复选框组 */
-    'checkbox-group': {
-        component: 'checkbox-group';
-    } & CheckboxGroupProps;
-    /** 单选框组 */
-    'radio-group': {
-        component: 'radio-group';
-    } & RadioGroupProps;
-    /** 开关 */
-    'switch': {
-        component: 'switch';
-        slots?: SwitchSlots;
-    } & SwitchProps;
-    /** 滑块 */
-    'slider': {
-        component: 'slider';
-        slots?: SliderSlots;
-    } & SliderProps;
-    /** 树形选择器 */
-    'tree-select': {
-        component: 'tree-select';
-        slots?: TreeSelectSlots;
-    } & TreeSelectProps;
-    /** 穿梭框 */
-    'transfer': {
-        component: 'transfer';
-        slots?: TransferSlots;
-    } & TransferProps;
-    /** 自定义组件 */
-    'custom': {
-        component?: RenderComponentType | Raw<RenderComponentType>;
-        slots?: Slots;
-    } & Record<string, any>;
-};
-
 /**
  * @description 容器组件类型
  */
@@ -435,6 +350,10 @@ declare type Expand = {
     expandStatus?: boolean;
 };
 
+declare type ExpandButtonProps = ButtonProps & {
+    expandStatus: boolean;
+};
+
 declare type ExtendWithAny<D> = {
     [K in keyof D]: IsRecord<D[K]> extends true ? ExtendWithAny<D[K]> : D[K];
 } & Record<string, any>;
@@ -443,7 +362,11 @@ declare type ExtendWithAny<D> = {
  * @description 字段配置类型，包含所有字段属性和响应式支持
  * @template D - 数据对象类型
  */
-export declare type Field<D extends Data = Data> = WithRef<CompType[keyof CompType] & Omit<FormItemProps, 'label'> & ColProps & Base<D>>;
+export declare type Field<D extends Data = Data> = {
+    [K in keyof FieldTypeMap]: {
+        component: K extends 'custom' ? FieldTypeMap<D>[K]['component'] : K;
+    } & FieldTypeMap<D>[K];
+}[keyof FieldTypeMap];
 
 /**
  * @description 字段数组类型
@@ -451,6 +374,78 @@ export declare type Field<D extends Data = Data> = WithRef<CompType[keyof CompTy
  */
 export declare type Fields<D extends Data = Data> = Array<Field<D>>;
 
+/**
+ * @type {FieldTypeMap} 字段类型集合
+ */
+export declare type FieldTypeMap<D extends Data = Data> = {
+    /** 文本框 */
+    'input': WithCommon<{
+        slots?: InputSlots;
+    } & InputProps, D>;
+    /** 文本域 */
+    'textarea': WithCommon<{
+        slots?: InputSlots;
+    } & TextAreaProps, D>;
+    /** 文本框-密码 */
+    'input-password': WithCommon<{
+        slots?: InputSlots;
+    } & InputProps, D>;
+    /** 文本框-搜索 */
+    'input-search': WithCommon<{
+        slots?: InputSlots;
+    } & InputProps, D>;
+    /** 数字文本框 */
+    'input-number': WithCommon<{
+        slots?: InputNumberSlots;
+    } & InputNumberProps, D>;
+    /** 下拉选择器 */
+    'select': WithCommon<{
+        slots?: SelectSlots;
+    } & SelectProps, D>;
+    /** 级联选择器 */
+    'cascader': WithCommon<{
+        slots?: CascaderSlots;
+    } & CascaderProps, D>;
+    /** 日期选择器 */
+    'date-picker': WithCommon<{
+        slots?: DatePickerSlots;
+    } & DatePickerProps, D>;
+    /** 日期选择器-范围 */
+    'range-picker': WithCommon<{
+        slots?: RangePickerSlots;
+    } & RangePickerProps, D>;
+    /** 时间选择器 */
+    'time-picker': WithCommon<{
+        slots?: TimePickerSlots;
+    } & TimePickerProps, D>;
+    /** 复选框组 */
+    'checkbox-group': WithCommon<CheckboxGroupProps, D>;
+    /** 单选框组 */
+    'radio-group': WithCommon<RadioGroupProps, D>;
+    /** 开关 */
+    'switch': WithCommon<{
+        slots?: SwitchSlots;
+    } & SwitchProps, D>;
+    /** 滑块 */
+    'slider': WithCommon<{
+        slots?: SliderSlots;
+    } & SliderProps, D>;
+    /** 树形选择器 */
+    'tree-select': WithCommon<{
+        slots?: TreeSelectSlots;
+    } & TreeSelectProps, D>;
+    /** 穿梭框 */
+    'transfer': WithCommon<{
+        slots?: TransferSlots;
+    } & TransferProps, D>;
+    /** 自定义组件 */
+    'custom': {
+        component?: RenderComponentType | Raw<RenderComponentType>;
+    } & WithCommon<{
+        slots?: Slots;
+    } & Record<string, any>, D>;
+};
+
 declare type FindBy<D extends Data> = (field: Readonly<Field<D>>) => boolean;
 
 declare type FindBy_2<D extends Data> = (column: Readonly<Column<D>>) => boolean;
@@ -502,7 +497,7 @@ declare type MaybeRefOrComputedRef<T = any> = MaybeRef<T> | ComputedRef<T>;
 /**
  * @description 不支持响应式的属性名
  */
-declare type NotSupportedRefOrGetterProps = 'container' | 'componentContainer' | 'valueFormatter' | 'fields' | 'slots' | 'modelName';
+declare type NotSupportedRefOrGetterProps = 'component' | 'container' | 'componentContainer' | 'valueFormatter' | 'fields' | 'slots' | 'modelName';
 
 declare type Option_2 = {
     label: string;
@@ -761,6 +756,9 @@ declare type SearchFormProps = {
     form: Form;
     layout?: 'grid' | 'inline';
     expand?: boolean | Expand;
+    searchButton?: Component<ButtonProps> | DefineComponent<ButtonProps>;
+    resetButton?: Component<ButtonProps> | DefineComponent<ButtonProps>;
+    expandButton?: Component<ExpandButtonProps> | DefineComponent<ExpandButtonProps>;
 } & /* @vue-ignore */ _FormProps & AllowedComponentProps;
 
 declare type SelectSlots = CompSlot<keyof InstanceType<typeof Select>['$slots']>;
@@ -969,6 +967,8 @@ export declare type WithAdditionalMethodsGetter<T> = T & {
     }>;
 };
 
+declare type WithCommon<T, D extends Data = Data> = WithRef<T & Omit<FormItemProps, 'label'> & ColProps & Base<D>>;
+
 /**
  * @description 为对象属性添加响应式支持的类型
  * @template T - 原始类型

package/es/table/index.js

@@ -1,8 +1,9 @@
-import { createElementBlock, openBlock, createElementVNode, defineComponent, ref, computed, watch, watchEffect, createBlock, unref, mergeProps, withCtx, createVNode, createCommentVNode, createTextVNode, toDisplayString, normalizeStyle, toValue, renderSlot, useAttrs, Fragment, renderList, withModifiers, inject, useSlots, onMounted, normalizeClass, isRef, createSlots, normalizeProps, guardReactiveProps, nextTick, reactive } from "vue";
+import { createElementBlock, openBlock, createElementVNode, defineComponent, ref, computed, watch, watchEffect, createBlock, unref, mergeProps, withCtx, createVNode, renderSlot, resolveDynamicComponent, createTextVNode, createCommentVNode, Fragment, toDisplayString, normalizeStyle, toValue, useAttrs, renderList, withModifiers, inject, useSlots, onMounted, normalizeClass, isRef, createSlots, normalizeProps, guardReactiveProps, nextTick, reactive } from "vue";
 import { I as INJECT_CONFIG, g as getObject, c as camelizeProperties } from "../component-provider/index-DXPHmG1H.js";
 import _sfc_main$9, { ContainerFragment as _sfc_main$a, useForm } from "../form/index.js";
-import { Space, Button, Dropdown, Menu, MenuItem, Checkbox, MenuDivider, Table } from "ant-design-vue";
+import { Space, Button, theme, Dropdown, Menu, MenuItem, Checkbox, MenuDivider, Table } from "ant-design-vue";
 import { p as pick, c as cloneDeep } from "../vendor/utils/lodash-es-B2uQdS28.js";
+import { useConfigContextInject } from "ant-design-vue/es/config-provider/context";
 import { tableProps } from "ant-design-vue/es/table";
 const _export_sfc = (sfc, props) => {
   const target = sfc.__vccOpts || sfc;
@@ -12,7 +13,7 @@ const _export_sfc = (sfc, props) => {
   return target;
 };
 const _sfc_main$8 = {};
-const _hoisted_1$7 = {
+const _hoisted_1$3 = {
   focusable: "false",
   "data-icon": "down",
   width: "1em",
@@ -21,12 +22,12 @@ const _hoisted_1$7 = {
   "aria-hidden": "true",
   viewBox: "64 64 896 896"
 };
-function _sfc_render$4(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$7, _cache[0] || (_cache[0] = [
+function _sfc_render$2(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$3, _cache[0] || (_cache[0] = [
     createElementVNode("path", { d: "M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z" }, null, -1)
   ]));
 }
-const DownOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["render", _sfc_render$4]]);
+const DownOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["render", _sfc_render$2]]);
 const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   ...{ name: "SearchForm" },
   __name: "SearchForm",
@@ -34,6 +35,9 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     form: {},
     layout: { default: "grid" },
     expand: { type: [Boolean, Object], default: true },
+    searchButton: { default: void 0 },
+    resetButton: { default: void 0 },
+    expandButton: { default: void 0 },
     class: {},
     style: {}
   },
@@ -111,7 +115,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
             minExpandRows * rowHeight + (minExpandRows - 1) * rowGap,
             +proFormHeight.value
           );
-          showExpandToggle.value = +proFormHeight.value > collapseHeight.value;
+          showExpandToggle.value = +proFormHeight.value - collapseHeight.value > 1;
           if (showExpandToggle.value) {
             setInitExpandStatus();
           }
@@ -138,6 +142,12 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
         grid: false
       }
     );
+    const onReset = () => {
+      emit("reset");
+    };
+    const onSearch = () => {
+      emit("search");
+    };
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(_sfc_main$9), mergeProps(layoutProps.value, {
         form: _ctx.form,
@@ -146,51 +156,71 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
         default: withCtx(() => [
           createVNode(unref(Space), { align: "start" }, {
             default: withCtx(() => [
-              createVNode(unref(Button), {
-                onClick: _cache[0] || (_cache[0] = ($event) => emit("reset"))
-              }, {
-                default: withCtx(() => _cache[2] || (_cache[2] = [
-                  createTextVNode("重置", -1)
-                ])),
-                _: 1,
-                __: [2]
-              }),
-              createVNode(unref(Button), {
-                type: "primary",
-                "html-type": "submit",
-                onClick: _cache[1] || (_cache[1] = ($event) => emit("search"))
-              }, {
-                default: withCtx(() => _cache[3] || (_cache[3] = [
-                  createTextVNode(" 查询 ", -1)
-                ])),
-                _: 1,
-                __: [3]
-              }),
-              showExpandToggle.value ? (openBlock(), createBlock(unref(Button), {
-                key: 0,
-                type: "link",
-                class: "expand-toggle-button",
-                onClick: changeExpandStatus
-              }, {
-                default: withCtx(() => [
-                  createTextVNode(toDisplayString(expandStatus.value ? "收起" : "展开") + " ", 1),
-                  createVNode(DownOutlined, {
-                    class: "transition",
-                    style: normalizeStyle([{ "margin-left": "4px" }, { transform: `rotate(${expandStatus.value ? -180 : 0}deg)` }])
-                  }, null, 8, ["style"])
-                ]),
-                _: 1
-              })) : createCommentVNode("", true)
+              renderSlot(_ctx.$slots, "reset-button", { onClick: onReset }, () => [
+                _ctx.resetButton ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.resetButton), {
+                  key: 0,
+                  onClick: onReset
+                })) : (openBlock(), createBlock(unref(Button), {
+                  key: 1,
+                  onClick: onReset
+                }, {
+                  default: withCtx(() => _cache[0] || (_cache[0] = [
+                    createTextVNode("重置", -1)
+                  ])),
+                  _: 1,
+                  __: [0]
+                }))
+              ], true),
+              renderSlot(_ctx.$slots, "search-button", { onClick: onSearch }, () => [
+                _ctx.searchButton ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.searchButton), {
+                  key: 0,
+                  onClick: onSearch
+                })) : (openBlock(), createBlock(unref(Button), {
+                  key: 1,
+                  type: "primary",
+                  "html-type": "submit",
+                  onClick: onSearch
+                }, {
+                  default: withCtx(() => _cache[1] || (_cache[1] = [
+                    createTextVNode(" 查询 ", -1)
+                  ])),
+                  _: 1,
+                  __: [1]
+                }))
+              ], true),
+              renderSlot(_ctx.$slots, "expand-button", { onClick: changeExpandStatus }, () => [
+                showExpandToggle.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                  _ctx.expandButton ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.expandButton), {
+                    key: 0,
+                    "expand-status": expandStatus.value,
+                    onClick: changeExpandStatus
+                  }, null, 8, ["expand-status"])) : (openBlock(), createBlock(unref(Button), {
+                    key: 1,
+                    type: "link",
+                    class: "expand-toggle-button",
+                    onClick: changeExpandStatus
+                  }, {
+                    default: withCtx(() => [
+                      createTextVNode(toDisplayString(expandStatus.value ? "收起" : "展开") + " ", 1),
+                      createVNode(DownOutlined, {
+                        class: "transition",
+                        style: normalizeStyle([{ "margin-left": "4px" }, { transform: `rotate(${expandStatus.value ? -180 : 0}deg)` }])
+                      }, null, 8, ["style"])
+                    ]),
+                    _: 1
+                  }))
+                ], 64)) : createCommentVNode("", true)
+              ], true)
             ]),
-            _: 1
+            _: 3
           })
         ]),
-        _: 1
+        _: 3
       }, 16, ["form"]);
     };
   }
 });
-const SearchForm = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-107a0198"]]);
+const SearchForm = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-a5f1b551"]]);
 function useModel(props, name, options) {
   const eventName = `onUpdate:${name}`;
   const emitUpdate = props[eventName];
@@ -204,24 +234,38 @@ function useModel(props, name, options) {
   });
   return modelValue;
 }
-const _sfc_main$6 = {};
-const _hoisted_1$6 = { class: "search-form-container" };
-function _sfc_render$3(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1$6, [
-    renderSlot(_ctx.$slots, "default", {}, void 0, true)
-  ]);
-}
-const DefaultSearchFormContainer = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$3], ["__scopeId", "data-v-5904d9f4"]]);
-const _sfc_main$5 = {};
-const _hoisted_1$5 = { class: "table-container" };
-function _sfc_render$2(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1$5, [
-    renderSlot(_ctx.$slots, "default", {}, void 0, true)
-  ]);
-}
-const DefaultTableContainer = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["render", _sfc_render$2], ["__scopeId", "data-v-f089d734"]]);
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+  __name: "DefaultSearchFormContainer",
+  setup(__props) {
+    const { token } = theme.useToken();
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "search-form-container",
+        style: normalizeStyle({ backgroundColor: unref(token).colorBgContainer })
+      }, [
+        renderSlot(_ctx.$slots, "default", {}, void 0, true)
+      ], 4);
+    };
+  }
+});
+const DefaultSearchFormContainer = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-727c8aba"]]);
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+  __name: "DefaultTableContainer",
+  setup(__props) {
+    const { token } = theme.useToken();
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "table-container",
+        style: normalizeStyle({ backgroundColor: unref(token).colorBgContainer })
+      }, [
+        renderSlot(_ctx.$slots, "default", {}, void 0, true)
+      ], 4);
+    };
+  }
+});
+const DefaultTableContainer = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-185690a3"]]);
 const _sfc_main$4 = {};
-const _hoisted_1$4 = {
+const _hoisted_1$2 = {
   focusable: "false",
   "data-icon": "column-height",
   width: "1em",
@@ -231,17 +275,20 @@ const _hoisted_1$4 = {
   viewBox: "64 64 896 896"
 };
 function _sfc_render$1(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$4, _cache[0] || (_cache[0] = [
+  return openBlock(), createElementBlock("svg", _hoisted_1$2, _cache[0] || (_cache[0] = [
     createElementVNode("path", { d: "M840 836H184c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h656c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zm0-724H184c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h656c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zM610.8 378c6 0 9.4-7 5.7-11.7L515.7 238.7a7.14 7.14 0 00-11.3 0L403.6 366.3a7.23 7.23 0 005.7 11.7H476v268h-62.8c-6 0-9.4 7-5.7 11.7l100.8 127.5c2.9 3.7 8.5 3.7 11.3 0l100.8-127.5c3.7-4.7.4-11.7-5.7-11.7H548V378h62.8z" }, null, -1)
   ]));
 }
 const ColumnHeightOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render$1]]);
-const _hoisted_1$3 = { class: "control-icon" };
 const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   __name: "SizeControl",
   setup(__props) {
+    var _a;
     const attrs = useAttrs();
-    const size = useModel(attrs, "size", { default: "large" });
+    const configContext = useConfigContextInject();
+    const size = useModel(attrs, "size", {
+      default: ((_a = configContext.componentSize) == null ? void 0 : _a.value) ?? "large"
+    });
     const onSizeChange = (val) => {
       size.value = val.key;
     };
@@ -264,18 +311,24 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
           }, null, 8, ["selected-keys", "items"])
         ]),
         default: withCtx(() => [
-          createElementVNode("div", _hoisted_1$3, [
-            createVNode(ColumnHeightOutlined, { style: { "font-size": "16px" } })
-          ])
+          createVNode(unref(Button), {
+            type: "text",
+            class: "size-control-button"
+          }, {
+            default: withCtx(() => [
+              createVNode(ColumnHeightOutlined)
+            ]),
+            _: 1
+          })
         ]),
         _: 1
       });
     };
   }
 });
-const SizeControl = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-d8e78b5b"]]);
+const SizeControl = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-b7eded53"]]);
 const _sfc_main$2 = {};
-const _hoisted_1$2 = {
+const _hoisted_1$1 = {
   focusable: "false",
   "data-icon": "filter",
   width: "1em",
@@ -285,12 +338,11 @@ const _hoisted_1$2 = {
   viewBox: "64 64 896 896"
 };
 function _sfc_render(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$2, _cache[0] || (_cache[0] = [
+  return openBlock(), createElementBlock("svg", _hoisted_1$1, _cache[0] || (_cache[0] = [
     createElementVNode("path", { d: "M880.1 154H143.9c-24.5 0-39.8 26.7-27.5 48L349 597.4V838c0 17.7 14.2 32 31.8 32h262.4c17.6 0 31.8-14.3 31.8-32V597.4L907.7 202c12.2-21.3-3.1-48-27.6-48zM603.4 798H420.6V642h182.9v156zm9.6-236.6l-9.5 16.6h-183l-9.5-16.6L212.7 226h598.6L613 561.4z" }, null, -1)
   ]));
 }
 const FilterOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render]]);
-const _hoisted_1$1 = { class: "control-icon" };
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   __name: "ColumnControl",
   props: {
@@ -299,6 +351,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const props = __props;
+    const open = ref(false);
     const checkAll = ref(false);
     const indeterminate = ref(false);
     const checkedColumnsOptions = computed(
@@ -349,6 +402,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     );
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(Dropdown), {
+        open: open.value,
+        "onUpdate:open": _cache[1] || (_cache[1] = ($event) => open.value = $event),
         arrow: "",
         placement: "bottomRight"
       }, {
@@ -367,11 +422,11 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                         indeterminate: indeterminate.value,
                         onChange: onCheckAllChange
                       }, {
-                        default: withCtx(() => _cache[1] || (_cache[1] = [
+                        default: withCtx(() => _cache[2] || (_cache[2] = [
                           createTextVNode(" 全选 ", -1)
                         ])),
                         _: 1,
-                        __: [1]
+                        __: [2]
                       }, 8, ["checked", "indeterminate"])
                     ])
                   ]),
@@ -405,16 +460,22 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
           ])
         ]),
         default: withCtx(() => [
-          createElementVNode("div", _hoisted_1$1, [
-            createVNode(FilterOutlined, { style: { "font-size": "17px" } })
-          ])
+          createVNode(unref(Button), {
+            type: "text",
+            class: "column-control-button"
+          }, {
+            default: withCtx(() => [
+              createVNode(FilterOutlined)
+            ]),
+            _: 1
+          })
         ]),
         _: 1
-      });
+      }, 8, ["open"]);
     };
   }
 });
-const ColumnControl = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-88c80679"]]);
+const ColumnControl = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-cdcab425"]]);
 const _hoisted_1 = { class: "pro-table-header" };
 const _hoisted_2 = {
   key: 0,
@@ -424,14 +485,8 @@ const _hoisted_3 = {
   key: 1,
   style: { "margin-left": "12px" }
 };
-const _hoisted_4 = {
-  key: 2,
-  style: { "margin-left": "12px" }
-};
-const _hoisted_5 = {
-  key: 3,
-  style: { "margin-left": "12px" }
-};
+const _hoisted_4 = { key: 2 };
+const _hoisted_5 = { key: 3 };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{ name: "ProTable", inheritAttrs: false },
   __name: "BaseTable",
@@ -620,7 +675,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const BaseTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-eb2f3860"]]);
+const BaseTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-7b0601fa"]]);
 const getDefaultPageParam = () => ({ current: 1, pageSize: 10, total: 0 });
 const pageParamProperty = ["current", "pageSize", "total"];
 const useTable = (params) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qin-ui/antd-vue-pro",
-  "version": "2.0.9",
+  "version": "2.0.11",
   "description": "二次封装antd vue组件",
   "type": "module",
   "module": "es/index.js",