z-ui-pc 0.3.0 → 0.3.1

package/dist/components.d.ts

@@ -1,4 +1,12 @@
-import type { ZAutoTooltip, ZClassifyTitle, ZEmpty, ZForm, ZTable, ZTableLinkButton } from "./index";
+import type {
+  ZAutoTooltip,
+  ZClassifyTitle,
+  ZEmpty,
+  ZForm,
+  ZTable,
+  ZTableLinkButton,
+  ZTipsFormItem,
+} from "./index";
 
 declare module "vue" {
   export interface GlobalComponents {
@@ -8,5 +16,6 @@ declare module "vue" {
     ZForm: typeof ZForm;
     ZTable: typeof ZTable;
     ZTableLinkButton: typeof ZTableLinkButton;
+    ZTipsFormItem: typeof ZTipsFormItem;
   }
 }

package/dist/index.css

@@ -887,13 +887,13 @@
 }
 .table-link__button[data-v-a44085cd]:hover {
   color: #4080ff;
-}.base-table__container[data-v-f40a3c88] {
+}.base-table__container[data-v-a76e1df8] {
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
 }
-.base-table__header[data-v-f40a3c88] {
+.base-table__header[data-v-a76e1df8] {
   display: flex;
   justify-content: flex-end;
   align-items: center;
@@ -901,10 +901,10 @@
   padding: 0 24px;
   height: 64px;
 }
-.base-table__header .base-table__header-slot[data-v-f40a3c88] {
+.base-table__header .base-table__header-slot[data-v-a76e1df8] {
   flex: 1;
 }
-.base-table__header .select-count[data-v-f40a3c88] {
+.base-table__header .select-count[data-v-a76e1df8] {
   flex: 1;
   height: 40px;
   display: flex;
@@ -913,15 +913,15 @@
   border-radius: 2px;
   padding: 0 12px;
 }
-.base-table__header .select-count.select-count--auto-width[data-v-f40a3c88] {
+.base-table__header .select-count.select-count--auto-width[data-v-a76e1df8] {
   width: max-content;
   background-color: #fff;
   flex: unset;
 }
-.base-table__header .select-count .el-button + .el-button[data-v-f40a3c88] {
+.base-table__header .select-count .el-button + .el-button[data-v-a76e1df8] {
   margin-left: 24px;
 }
-.base-table__header .select-count .select-count__count[data-v-f40a3c88] {
+.base-table__header .select-count .select-count__count[data-v-a76e1df8] {
   display: flex;
   align-items: center;
   gap: 12px;
@@ -929,15 +929,15 @@
   font-size: 14px;
   margin-right: 24px;
 }
-.base-table__header .select-count .select-count__count .el-icon[data-v-f40a3c88] {
+.base-table__header .select-count .select-count__count .el-icon[data-v-a76e1df8] {
   color: #999;
   cursor: pointer;
 }
-.base-table__header .select-count .select-count__count.has-select-slot[data-v-f40a3c88] {
+.base-table__header .select-count .select-count__count.has-select-slot[data-v-a76e1df8] {
   position: relative;
   margin-right: 42px;
 }
-.base-table__header .select-count .select-count__count.has-select-slot[data-v-f40a3c88]::after {
+.base-table__header .select-count .select-count__count.has-select-slot[data-v-a76e1df8]::after {
   content: "";
   position: absolute;
   width: 2px;
@@ -945,75 +945,69 @@
   background-color: #e5e6eb;
   right: -24px;
 }
-.base-table__header-operation[data-v-f40a3c88] {
+.base-table__header-operation[data-v-a76e1df8] {
   display: flex;
   justify-content: flex-end;
   align-items: center;
   padding: 16px 0;
   gap: 10px;
 }
-.base-table__header-operation[data-v-f40a3c88]  .el-button + .el-button {
+.base-table__header-operation[data-v-a76e1df8]  .el-button + .el-button {
   margin-left: 0;
 }
-.base-table__table-header-cell[data-v-f40a3c88] {
+.base-table__table-header-cell[data-v-a76e1df8] {
   display: contents;
 }
-.base-table__table-header-content[data-v-f40a3c88] {
+.base-table__table-header-content[data-v-a76e1df8] {
   display: contents;
 }
-.base-table__body[data-v-f40a3c88] {
+.base-table__body[data-v-a76e1df8] {
   flex: 1;
 }
-.base-table__body[data-v-f40a3c88]  .el-table__header-wrapper .base-table__table-column-operation {
+.base-table__body[data-v-a76e1df8]  .el-table__header-wrapper .base-table__table-column-operation {
   padding: 0;
 }
-.base-table__body[data-v-f40a3c88]  .el-table__header-wrapper .el-table__cell__search-result .base-table__table-header-content {
+.base-table__body[data-v-a76e1df8]  .el-table__header-wrapper .el-table__cell__search-result .base-table__table-header-content {
   background-color: rgb(244, 154, 70);
   display: unset;
 }
-.base-table__body[data-v-f40a3c88]  .el-table__inner-wrapper .el-scrollbar__bar.is-horizontal {
-  left: var(--c6dace06);
-  z-index: 20;
-  position: fixed;
-  bottom: 98px;
-}
-.base-table__body[data-v-f40a3c88]  .base-table__table-column-operation .cell {
+.base-table__body[data-v-a76e1df8]  .base-table__table-column-operation .cell {
   padding-right: 0;
   height: 100%;
 }
-.base-table__body[data-v-f40a3c88]  .el-table__empty-block {
+.base-table__body[data-v-a76e1df8]  .el-table__empty-block {
   height: 200px !important;
   overflow: hidden;
 }
-.base-table__body[data-v-f40a3c88]  .custom-status__color {
+.base-table__body[data-v-a76e1df8]  .custom-status__color {
   display: flex;
   gap: 6px;
   align-items: center;
 }
-.base-table__body[data-v-f40a3c88]  .custom-status__color:before {
+.base-table__body[data-v-a76e1df8]  .custom-status__color:before {
   content: "";
   width: 8px;
   height: 8px;
   background-color: var(--status-color);
   border-radius: 50%;
 }
-.base-table__body[data-v-f40a3c88]  .el-loading-mask {
+.base-table__body[data-v-a76e1df8]  .el-loading-mask {
   display: flex;
   align-items: center;
   justify-content: center;
 }
-.base-table__body .base-table__table-header-cell--operation[data-v-f40a3c88] {
+.base-table__body .base-table__table-header-cell--operation[data-v-a76e1df8] {
   display: flex;
   align-items: center;
 }
-.base-table__body .base-table__table-header-cell--operation .base-table__table-header-content[data-v-f40a3c88] {
+.base-table__body .base-table__table-header-cell--operation .base-table__table-header-content[data-v-a76e1df8] {
   flex: 1;
   display: block;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.base-table__body .base-table__table-header-cell--operation .base-table__table-header-operation[data-v-f40a3c88] {
+.base-table__body .base-table__table-header-cell--operation .base-table__table-header-operation[data-v-a76e1df8] {
   width: 40px;
   display: flex;
   justify-content: center;
@@ -1021,32 +1015,38 @@
   height: 40px;
   cursor: pointer;
 }
-.base-table__body .base-table__table-header-cell--operation .base-table__table-header-operation[data-v-f40a3c88]:hover {
+.base-table__body .base-table__table-header-cell--operation .base-table__table-header-operation[data-v-a76e1df8]:hover {
   background-color: #e8e8e9;
 }
-.base-table__body.base-table__body__fix-pagination[data-v-f40a3c88] {
+.base-table__body.base-table__body__fix-pagination[data-v-a76e1df8] {
   padding: 0 24px 16px;
 }
-.base-table__body .base-table__draggable[data-v-f40a3c88] {
+.base-table__body.base-table__body__update-scroll[data-v-a76e1df8]  .el-table__inner-wrapper .el-scrollbar__bar.is-horizontal {
+  left: var(--4f0be7e2);
+  z-index: 20;
+  position: fixed;
+  bottom: 80px;
+}
+.base-table__body .base-table__draggable[data-v-a76e1df8] {
   height: 100%;
 }
-.base-table__body .base-table__table[data-v-f40a3c88] {
+.base-table__body .base-table__table[data-v-a76e1df8] {
   --el-table-text-color: var(--app-primary-text-color);
 }
-.base-table__pagination[data-v-f40a3c88] {
+.base-table__pagination[data-v-a76e1df8] {
   height: 48px;
   background-color: #fff;
   position: relative;
 }
-.base-table__base-pagination[data-v-f40a3c88] {
+.base-table__base-pagination[data-v-a76e1df8] {
   background-color: #fff;
   padding: 16px 24px;
   box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.08);
 }
-.base-table__base-pagination[data-v-f40a3c88] .el-pagination .el-pager li:hover {
+.base-table__base-pagination[data-v-a76e1df8] .el-pagination .el-pager li:hover {
   background-color: #e8f3ff;
 }
-.base-table__base-pagination[data-v-f40a3c88] .el-pagination .el-select__wrapper {
+.base-table__base-pagination[data-v-a76e1df8] .el-pagination .el-select__wrapper {
   width: 90px;
   gap: 0;
   box-shadow: none;
@@ -1055,22 +1055,22 @@
   padding: 0 6px;
   text-align: center;
 }
-.base-table__base-pagination[data-v-f40a3c88] .el-pagination .el-select {
+.base-table__base-pagination[data-v-a76e1df8] .el-pagination .el-select {
   width: 90px;
 }
-.base-table__pagination-fixed[data-v-f40a3c88] {
+.base-table__pagination-fixed[data-v-a76e1df8] {
   background-color: #fff;
-  width: var(--dac55732);
+  width: var(--4516a34c);
   position: fixed;
   bottom: 16px;
   z-index: 6;
 }
-.base-table__pagination-right[data-v-f40a3c88] {
+.base-table__pagination-right[data-v-a76e1df8] {
   display: flex;
   justify-content: flex-end;
 }
-.base-table__container[data-v-f40a3c88] .el-loading-spinner {
-  width: calc(100vw - var(--c6dace06));
+.base-table__container[data-v-a76e1df8] .el-loading-spinner {
+  width: calc(100vw - var(--4f0be7e2));
   position: fixed;
   top: 60%;
 }.z-tips-form-item__form-item[data-v-af10c35f]  .el-form-item__label {

package/dist/index.d.ts

@@ -1367,6 +1367,11 @@ export declare interface IBaseTableProps extends Partial<TableProps<TObj>> {
      * @default false
      */
     enableColumnSearch?: boolean;
+    /**
+     * 是否需要表格因为分页自带的间距
+     * @default false
+     */
+    whenFixedPaginationNoPadding?: boolean;
 }
 
 /**
@@ -1468,7 +1473,7 @@ export declare interface ICustomComponentDefinition {
 /**
  * EFormComponentType 类型扩展
  * @example
- * declare module "module-platform-common" {
+ * declare module "z-ui-pc" {
  *   export interface ICustomFormComponentType {
  *     // 也可以自定义对应枚举作为相应的 key
  *     'SELECT_STAFF': {
@@ -1484,7 +1489,12 @@ export declare interface ICustomFormComponentType {
      * @example
      */
     __example__: {
-        exampleProps: boolean;
+        attrs: {
+            exampleProps: boolean;
+        };
+        componentProps: {
+            exampleProps2: boolean;
+        };
     };
 }
 
@@ -1845,10 +1855,16 @@ export declare type TCreateBaseFormItemParams<T extends keyof IComponentProps, U
          componentProps?: Partial<ExtractPropTypes<PropsOf<T>>>;
      };
 
-     declare type TCreateCustomFormItemParamsByDefinition<T extends TKeyofCustomFormComponentType, U extends TObj = TObj> = Omit<IBaseFormItem<U>, "tag" | "attrs" | "componentProps"> & {
+     export declare type TCreateCustomFormItemParamsByDefinition<T extends TKeyofCustomFormComponentType, U extends TObj = TObj> = Omit<IBaseFormItem<U>, "tag" | "attrs" | "componentProps"> & {
          tag: T;
-         attrs?: Partial<ICustomFormComponentType[T]>;
-         componentProps?: Partial<ICustomFormComponentType[T]>;
+         /**
+          * 如果组件定义中存在 attrs 类型，则提供该类型的 Partial 作为提示，否则回退到 TObj。
+          */
+         attrs?: "attrs" extends keyof ICustomFormComponentType[T] ? Partial<ICustomFormComponentType[T]["attrs"]> : TObj;
+         /**
+          * 如果组件定义中存在 componentProps 类型，则提供该类型的 Partial 作为提示，否则回退到 TObj。
+          */
+         componentProps?: "componentProps" extends keyof ICustomFormComponentType[T] ? Partial<ICustomFormComponentType[T]["componentProps"]> : TObj;
      };
 
      export declare const TEMP_GROUP_ID = "-2";
@@ -2083,8 +2099,8 @@ export declare type TCreateBaseFormItemParams<T extends keyof IComponentProps, U
      };
 
      export declare const useOpenDialog: () => {
-         openDialog: <V = TAllType<string | number | boolean | object | null | undefined>, T extends Component = Component>(loader: AsyncComponentLoader<T> | T, props?: Partial<ExtractPropTypes<PropsOf_2<T>>>, closeId?: number) => Promise<V>;
-         createDialog: <V = TAllType<string | number | boolean | object | null | undefined>, T extends Component = Component>(loader: AsyncComponentLoader<T> | T, props?: Partial<ExtractPropTypes<PropsOf_2<T>>>) => {
+         openDialog: <V = TAllType<string | number | boolean | object | null | undefined>, T extends Component = Component>(loader: AsyncComponentLoader<T> | T, props?: Partial<PropsOf_2<T>>, closeId?: number) => Promise<V>;
+         createDialog: <V = TAllType<string | number | boolean | object | null | undefined>, T extends Component = Component>(loader: AsyncComponentLoader<T> | T, props?: Partial<PropsOf_2<T>>) => {
              confirm: (callBack: (data: V) => void) => /*elided*/ any;
              cancel: (callBack: (data: V) => void) => /*elided*/ any;
              finally: (callBack: () => void) => /*elided*/ any;
@@ -2279,6 +2295,7 @@ export declare type TCreateBaseFormItemParams<T extends keyof IComponentProps, U
          fixedPagination: boolean;
          stickyHeader: boolean;
          enableColumnSearch: boolean;
+         whenFixedPaginationNoPadding: boolean;
          }, false, {}, {}, GlobalComponents, GlobalDirectives, string, {
          baseTableContainerRef: HTMLDivElement;
          baseTableOperationElement: HTMLDivElement;
@@ -2365,6 +2382,7 @@ export declare type TCreateBaseFormItemParams<T extends keyof IComponentProps, U
          fixedPagination: boolean;
          stickyHeader: boolean;
          enableColumnSearch: boolean;
+         whenFixedPaginationNoPadding: boolean;
          }>;
          __isFragment?: never;
          __isTeleport?: never;
@@ -2449,6 +2467,7 @@ export declare type TCreateBaseFormItemParams<T extends keyof IComponentProps, U
      fixedPagination: boolean;
      stickyHeader: boolean;
      enableColumnSearch: boolean;
+     whenFixedPaginationNoPadding: boolean;
      }, {}, string, {}, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & VNodeProps & AllowedComponentProps & ComponentCustomProps & (new () => {
          $slots: Readonly<{
              header: (_props: {

package/dist/index.js

@@ -5054,7 +5054,9 @@ const useBaseTable = (props) => {
         tableData.value = result;
         pagination.value.total = isNaN(numberTotal) ? 0 : numberTotal;
       } else {
-        tableData.value = props.tableData ?? [];
+        watchEffect(() => {
+          tableData.value = props.tableData ?? [];
+        });
       }
     } finally {
       loadDataLoading.value = false;
@@ -5516,6 +5518,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     enableDragProps: {},
     draggableAttrs: {},
     enableColumnSearch: { type: Boolean, default: false },
+    whenFixedPaginationNoPadding: { type: Boolean, default: false },
     data: {},
     size: {},
     width: {},
@@ -5578,8 +5581,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   ], ["update:selectList"]),
   setup(__props, { expose: __expose, emit: __emit }) {
     useCssVars((_ctx) => ({
-      "c6dace06": tableScrollLeft.value,
-      "dac55732": unref(paginationWidth)
+      "4f0be7e2": tableScrollLeft.value,
+      "4516a34c": unref(paginationWidth)
     }));
     const props = __props;
     const selectList = useModel(__props, "selectList");
@@ -5841,7 +5844,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
             class: normalizeClass([
               "base-table__body",
               {
-                "base-table__body__fix-pagination": _ctx.fixedPagination
+                "base-table__body__fix-pagination": !_ctx.whenFixedPaginationNoPadding && _ctx.fixedPagination,
+                "base-table__body__update-scroll": _ctx.hasPagination && _ctx.fixedPagination
               }
             ])
           }, [
@@ -5967,7 +5971,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const ZTable = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-f40a3c88"]]);
+const ZTable = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-a76e1df8"]]);
 const installer$3 = withInstallComponent(ZTable, "ZTable");
 const installer$2 = withInstallComponent(ZTableLinkButton, "ZTableLinkButton");
 const _hoisted_1 = { class: "z-tips-form-item__container" };
@@ -6168,7 +6172,7 @@ const getInstallConfig = (config) => ({
   ...defaultConfig,
   ...config ?? {}
 });
-const version = "0.3.0";
+const version = "0.3.1";
 const pkg = {
   version
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "z-ui-pc",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "description": "适用于pc端的前端组件库",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",