qidian-vue-ui 2.1.1 → 2.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/dist/components/columns-controller/index.css +8 -8
  2. package/dist/components/columns-controller/index.vue.mjs +1 -1
  3. package/dist/components/columns-controller/index.vue2.mjs +29 -20
  4. package/dist/components/columns-controller/props.d.ts +1 -0
  5. package/dist/components/columns-controller/props.mjs +2 -1
  6. package/dist/components/columns-controller/types.d.ts +2 -0
  7. package/dist/components/crud/table/columnsCache.d.ts +5 -3
  8. package/dist/components/crud/table/columnsCache.mjs +10 -19
  9. package/dist/components/crud/table/index.css +11 -11
  10. package/dist/components/crud/table/index.vue.mjs +1 -1
  11. package/dist/components/crud/table/index.vue2.mjs +73 -47
  12. package/dist/components/crud/table/props.d.ts +1 -0
  13. package/dist/components/crud/tabs-table/index.vue.d.ts +1 -0
  14. package/dist/components/crud/tabs-table/index.vue2.mjs +1 -0
  15. package/dist/components/crud/tabs-table/props.d.ts +1 -0
  16. package/dist/components/input-number/props.d.ts +1 -1
  17. package/dist/components/input-number/props.mjs +1 -1
  18. package/dist/components/service/table/columnsCompensation.d.ts +39 -0
  19. package/dist/components/service/table/columnsCompensation.mjs +123 -0
  20. package/dist/components/service/table/index.css +72 -72
  21. package/dist/components/service/table/index.vue.mjs +1 -1
  22. package/dist/components/service/table/index.vue2.mjs +83 -6
  23. package/dist/components/service/table/props.d.ts +1 -0
  24. package/dist/components/service/table/props.mjs +1 -0
  25. package/dist/components/service/table/types.d.ts +1 -0
  26. package/dist/components/service-dialog-table-select/index.vue2.mjs +3 -0
  27. package/dist/components/service-dialog-table-select/props.d.ts +1 -0
  28. package/dist/components/service-dialog-tabs-table-select/index.vue2.mjs +3 -0
  29. package/dist/components/service-dialog-tabs-table-select/props.d.ts +1 -0
  30. package/dist/components/service-popup-table-select/index.vue2.mjs +3 -0
  31. package/dist/components/service-popup-table-select/props.d.ts +1 -0
  32. package/package.json +2 -1
@@ -1,31 +1,31 @@
1
- .qd-columns-controller__title[data-v-85b72687] {
1
+ .qd-columns-controller__title[data-v-ec921dfa] {
2
2
  display: flex;
3
3
  align-items: center;
4
4
  }
5
- .qd-columns-controller__drag[data-v-85b72687] {
5
+ .qd-columns-controller__drag[data-v-ec921dfa] {
6
6
  cursor: move;
7
7
  margin-right: var(--td-comp-margin-m);
8
8
  }
9
- .qd-columns-controller__ghost[data-v-85b72687] {
9
+ .qd-columns-controller__ghost[data-v-ec921dfa] {
10
10
  opacity: 0.5;
11
11
  background: var(--td-brand-color-light);
12
12
  }
13
- .qd-columns-controller__chosen[data-v-85b72687] {
13
+ .qd-columns-controller__chosen[data-v-ec921dfa] {
14
14
  background: var(--td-brand-color-light-hover);
15
15
  }
16
- .qd-columns-controller__width-input[data-v-85b72687] {
16
+ .qd-columns-controller__width-input[data-v-ec921dfa] {
17
17
  width: 100%;
18
18
  }
19
- .qd-columns-controller__help[data-v-85b72687] {
19
+ .qd-columns-controller__help[data-v-ec921dfa] {
20
20
  font-size: var(--td-font-size-title-large);
21
21
  }
22
- .qd-columns-controller__footer[data-v-85b72687] {
22
+ .qd-columns-controller__footer[data-v-ec921dfa] {
23
23
  width: 100%;
24
24
  display: flex;
25
25
  justify-content: space-between;
26
26
  align-items: center;
27
27
  }
28
- .qd-columns-controller__footer-actions[data-v-85b72687] {
28
+ .qd-columns-controller__footer-actions[data-v-ec921dfa] {
29
29
  flex: 1 1 0;
30
30
  overflow: hidden;
31
31
  }
@@ -2,7 +2,7 @@ import './index.css'
2
2
  import _sfc_main from "./index.vue2.mjs";
3
3
  /* empty css */
4
4
  import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
5
- const QdColumnsController = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-85b72687"]]);
5
+ const QdColumnsController = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-ec921dfa"]]);
6
6
  export {
7
7
  QdColumnsController as default
8
8
  };
@@ -6,6 +6,7 @@ import Sortable from "../../node_modules/.pnpm/sortablejs@1.15.6/node_modules/so
6
6
  import { MoveIcon, HelpCircleIcon } from "tdesign-icons-vue-next";
7
7
  import { Space, Link, Divider, InputNumber, Button, Tooltip } from "tdesign-vue-next";
8
8
  import { useConfig } from "../config-provider/useConfig.mjs";
9
+ import { COMPONENT_FONT_MAP, compensateWidth, calcOperationLinksWidth } from "../service/table/columnsCompensation.mjs";
9
10
  import { qdColumnsControllerProps } from "./props.mjs";
10
11
  import _sfc_main$1 from "../dialog/index.vue.mjs";
11
12
  /* empty css */
@@ -31,6 +32,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
31
32
  props: /* @__PURE__ */ mergeDefaults({
32
33
  columns: {},
33
34
  defaultColumns: {},
35
+ size: {},
34
36
  visible: {
35
37
  type: Boolean
36
38
  }
@@ -52,28 +54,34 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
52
54
  t: tDialog
53
55
  } = useConfig("dialog");
54
56
  const {
55
- t
57
+ t,
58
+ size: globalComponentSize
56
59
  } = useConfig("columnsController");
57
60
  const dialogRef = useTemplateRef("dialog");
58
61
  const tableRef = useTemplateRef("tableRef");
59
62
  const flatColumns = ref([]);
60
63
  const hasFormItemColumns = computed(() => hasFormItem(props.columns));
61
- const tableColumns = [{
62
- colKey: "title",
63
- title: t("columnNameText"),
64
- minWidth: 200
65
- }, {
66
- colKey: "width",
67
- title: t("widthText"),
68
- width: 250,
69
- align: "center"
70
- }, {
71
- colKey: "operation",
72
- title: t("operationText"),
73
- width: 300,
74
- align: "center",
75
- fixed: "right"
76
- }];
64
+ const tableColumns = computed(() => {
65
+ const tableSize = props.size ?? "small";
66
+ const fontSize = COMPONENT_FONT_MAP[globalComponentSize.value ?? "medium"] ?? COMPONENT_FONT_MAP.medium;
67
+ const widest = (...texts) => texts.reduce((a, b) => b.length > a.length ? b : a);
68
+ return [{
69
+ colKey: "title",
70
+ title: t("columnNameText"),
71
+ minWidth: compensateWidth(200, tableSize, globalComponentSize.value ?? "medium")
72
+ }, {
73
+ colKey: "width",
74
+ title: t("widthText"),
75
+ width: compensateWidth(250, tableSize, globalComponentSize.value ?? "medium"),
76
+ align: "center"
77
+ }, {
78
+ colKey: "operation",
79
+ title: t("operationText"),
80
+ width: calcOperationLinksWidth([t("moveUpText"), t("moveDownText"), widest(t("pinLeftText"), t("unpinText")), widest(t("pinRightText"), t("unpinText"))], tableSize, fontSize),
81
+ align: "center",
82
+ fixed: "right"
83
+ }];
84
+ });
77
85
  const selectedColKeys = computed(() => flatColumns.value.filter((c) => !c.hidden).map((c) => c.colKey));
78
86
  function hasFormItem(columns2) {
79
87
  return columns2?.some((column) => column.formItem || hasFormItem(column.children)) ?? false;
@@ -218,7 +226,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
218
226
  ref_key: "tableRef",
219
227
  ref: tableRef,
220
228
  data: flatColumns.value,
221
- columns: tableColumns,
229
+ columns: tableColumns.value,
230
+ size: __props.size,
231
+ "width-compensation": false,
222
232
  "row-key": "colKey",
223
233
  "select-type": hasFormItemColumns.value ? void 0 : "multiple",
224
234
  "selected-row-keys": selectedColKeys.value,
@@ -244,7 +254,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
244
254
  modelValue: row.width,
245
255
  "onUpdate:modelValue": ($event) => row.width = $event,
246
256
  min: 50,
247
- max: 1e3,
248
257
  step: 10,
249
258
  suffix: "px",
250
259
  placeholder: "auto"
@@ -291,7 +300,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
291
300
  _: 2
292
301
  }, 1024)]),
293
302
  _: 1
294
- }, 8, ["data", "select-type", "selected-row-keys"])]),
303
+ }, 8, ["data", "columns", "size", "select-type", "selected-row-keys"])]),
295
304
  _: 1
296
305
  }, 8, ["visible", "header"]);
297
306
  };
@@ -2,4 +2,5 @@ export declare const qdColumnsControllerProps: {
2
2
  readonly visible: false;
3
3
  readonly columns: () => never[];
4
4
  readonly defaultColumns: undefined;
5
+ readonly size: undefined;
5
6
  };
@@ -1,7 +1,8 @@
1
1
  const qdColumnsControllerProps = {
2
2
  visible: false,
3
3
  columns: () => [],
4
- defaultColumns: void 0
4
+ defaultColumns: void 0,
5
+ size: void 0
5
6
  };
6
7
  export {
7
8
  qdColumnsControllerProps
@@ -1,11 +1,13 @@
1
1
  import type { TableRowData } from 'tdesign-vue-next';
2
2
  import type { QdCrudTableCol } from '../crud/table/types';
3
3
  import type { QdDialogInstanceFunctions, QdDialogProps } from '../dialog/types';
4
+ import type { QdServiceTableProps } from '../service';
4
5
  export interface QdColumnsControllerCol extends Pick<QdCrudTableCol, 'title' | 'hidden' | 'width' | 'minWidth' | 'fixed' | 'colKey'> {
5
6
  }
6
7
  export interface QdColumnsControllerProps<D extends TableRowData = TableRowData> extends Pick<QdDialogProps, 'visible'> {
7
8
  columns?: QdCrudTableCol<D>[];
8
9
  defaultColumns?: QdCrudTableCol<D>[];
10
+ size?: QdServiceTableProps['size'] | 'mini';
9
11
  }
10
12
  export interface QdColumnsControllerInstanceFunctions extends QdDialogInstanceFunctions {
11
13
  }
@@ -1,7 +1,9 @@
1
- import type { TableRowData } from 'tdesign-vue-next';
1
+ export * from '../../service/table/columnsCompensation';
2
2
  import type { QdColumnsControllerCol } from '../../columns-controller/types';
3
- import type { QdCrudTableCol } from './types';
3
+ import type { QdColumnWidthStore } from '../../service/table/columnsCompensation';
4
4
  export declare function getColumnsStorageKey(key: string): string;
5
5
  export interface QdCrudTableCacheCol extends Omit<QdColumnsControllerCol, 'title'> {
6
6
  }
7
- export declare function mergeColumnsWithCache<D extends TableRowData>(original: QdCrudTableCol<D>[], cached: QdCrudTableCacheCol[] | undefined): QdCrudTableCol<D>[];
7
+ export interface QdCrudTableColumnStore extends QdColumnWidthStore<QdCrudTableCacheCol> {
8
+ }
9
+ export declare function normalizeColumnStore(raw: unknown): QdCrudTableColumnStore;
@@ -2,28 +2,19 @@ const COLUMNS_CACHE_PREFIX = "qd-crud-table-columns";
2
2
  function getColumnsStorageKey(key) {
3
3
  return `${COLUMNS_CACHE_PREFIX}:${key}`;
4
4
  }
5
- function mergeColumnsWithCache(original, cached) {
6
- if (!cached?.length) return original;
7
- const originalMap = new Map(original.map((col) => [col.colKey, col]));
8
- const cachedCols = cached.filter((c) => c.colKey && originalMap.has(c.colKey)).map((cachedCol) => {
9
- const originalCol = originalMap.get(cachedCol.colKey);
10
- const { hidden, width, minWidth, fixed } = cachedCol;
11
- const reOther = {
12
- ...hidden === void 0 ? {} : { hidden },
13
- width,
14
- minWidth,
15
- fixed
16
- };
5
+ function normalizeColumnStore(raw) {
6
+ if (Array.isArray(raw)) return { columns: raw };
7
+ if (raw && typeof raw === "object") {
8
+ const store = raw;
17
9
  return {
18
- ...originalCol,
19
- ...reOther
10
+ columns: store.columns ?? [],
11
+ tableSize: store.tableSize,
12
+ globalSize: store.globalSize
20
13
  };
21
- });
22
- const cachedKeySet = new Set(cached.map((c) => c.colKey));
23
- const newCols = original.filter((col) => col.colKey && !cachedKeySet.has(col.colKey));
24
- return [...cachedCols, ...newCols];
14
+ }
15
+ return { columns: [] };
25
16
  }
26
17
  export {
27
18
  getColumnsStorageKey,
28
- mergeColumnsWithCache
19
+ normalizeColumnStore
29
20
  };
@@ -1,40 +1,40 @@
1
- .qd-crud-table[data-v-27ca87c9] {
1
+ .qd-crud-table[data-v-df12a161] {
2
2
  width: 100%;
3
3
  display: flex;
4
4
  flex-direction: column;
5
5
  }
6
- .qd-crud-table > .qd-crud-search:not(.qd-crud-search--hide) + .qd-crud-table__body[data-v-27ca87c9] {
6
+ .qd-crud-table > .qd-crud-search:not(.qd-crud-search--hide) + .qd-crud-table__body[data-v-df12a161] {
7
7
  margin-top: var(--td-comp-margin-l);
8
8
  }
9
- .qd-crud-table__body[data-v-27ca87c9] > .t-loading__parent > .t-card__body {
9
+ .qd-crud-table__body[data-v-df12a161] > .t-loading__parent > .t-card__body {
10
10
  display: flex;
11
11
  flex-direction: column;
12
12
  }
13
- .qd-crud-table__body[data-v-27ca87c9] > .t-loading__parent > .t-card__body > .qd-service-table .t-table__pagination {
13
+ .qd-crud-table__body[data-v-df12a161] > .t-loading__parent > .t-card__body > .qd-service-table .t-table__pagination {
14
14
  padding-bottom: 0;
15
15
  }
16
- .qd-crud-table--fit-parent-height[data-v-27ca87c9] {
16
+ .qd-crud-table--fit-parent-height[data-v-df12a161] {
17
17
  height: 100%;
18
18
  }
19
- .qd-crud-table--fit-parent-height > .qd-crud-table__body[data-v-27ca87c9] {
19
+ .qd-crud-table--fit-parent-height > .qd-crud-table__body[data-v-df12a161] {
20
20
  flex: auto;
21
21
  }
22
- .qd-crud-table--fit-parent-height > .qd-crud-table__body[data-v-27ca87c9] > .t-loading__parent > .t-card__body {
22
+ .qd-crud-table--fit-parent-height > .qd-crud-table__body[data-v-df12a161] > .t-loading__parent > .t-card__body {
23
23
  height: 100%;
24
24
  min-height: 443px;
25
25
  }
26
- .qd-crud-table--fit-parent-height > .qd-crud-table__body[data-v-27ca87c9] > .t-loading__parent > .t-card__body > .qd-service-table {
26
+ .qd-crud-table--fit-parent-height > .qd-crud-table__body[data-v-df12a161] > .t-loading__parent > .t-card__body > .qd-service-table {
27
27
  flex: 1 1 0;
28
28
  overflow: hidden;
29
29
  }
30
- .qd-crud-table__toolbar[data-v-27ca87c9] {
30
+ .qd-crud-table__toolbar[data-v-df12a161] {
31
31
  display: flex;
32
32
  justify-content: space-between;
33
33
  }
34
- .qd-crud-table__toolbar--has-space-item + .qd-service-table[data-v-27ca87c9] {
34
+ .qd-crud-table__toolbar--has-space-item + .qd-service-table[data-v-df12a161] {
35
35
  margin-top: var(--td-comp-margin-l);
36
36
  }
37
- .qd-crud-table__toolbar-separator[data-v-27ca87c9] {
37
+ .qd-crud-table__toolbar-separator[data-v-df12a161] {
38
38
  display: inline-block;
39
39
  padding-left: var(--td-comp-paddingLR-s);
40
40
  }
@@ -2,7 +2,7 @@ import './index.css'
2
2
  import _sfc_main from "./index.vue2.mjs";
3
3
  /* empty css */
4
4
  import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.mjs";
5
- const QdCrudTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-27ca87c9"]]);
5
+ const QdCrudTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-df12a161"]]);
6
6
  export {
7
7
  QdCrudTable as default
8
8
  };
@@ -6,9 +6,10 @@ import { SearchIcon, RefreshIcon, UnfoldLessIcon, UnfoldMoreIcon, SettingIcon, A
6
6
  import { Space, Button, Tooltip, Divider, Link } from "tdesign-vue-next";
7
7
  import { useConfig } from "../../config-provider/useConfig.mjs";
8
8
  import { qdServiceTableTreeConfig } from "../../service/table/props.mjs";
9
- import { getColumnsStorageKey, mergeColumnsWithCache } from "./columnsCache.mjs";
9
+ import { getColumnsStorageKey, normalizeColumnStore } from "./columnsCache.mjs";
10
10
  import { qdCrudTableProps } from "./props.mjs";
11
11
  import { useModal } from "../../../hooks/useModal.mjs";
12
+ import { COMPONENT_FONT_MAP, mergeColumnsWithCache, applySizeCompensation, OPERATION_EXTRA_WIDTH, SIZE_PADDING_MAP, calcTextWidth } from "../../service/table/columnsCompensation.mjs";
12
13
  import merge from "../../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/merge.mjs";
13
14
  import cloneDeep from "../../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/cloneDeep.mjs";
14
15
  import QdCrudSearch from "../search/index.vue.mjs";
@@ -77,6 +78,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
77
78
  columns: {},
78
79
  rowKey: {},
79
80
  size: {},
81
+ widthCompensation: {
82
+ type: Boolean
83
+ },
80
84
  selectType: {},
81
85
  activeRowType: {
82
86
  type: [String, Boolean]
@@ -422,17 +426,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
422
426
  alertWarning,
423
427
  confirm
424
428
  } = useModal();
425
- const COMPONENT_FONT_MAP = {
426
- large: 16,
427
- medium: 14,
428
- small: 12
429
- };
430
- const SIZE_PADDING_MAP = {
431
- large: 48,
432
- medium: 32,
433
- small: 16,
434
- mini: 12
435
- };
436
429
  const treeIsExpand = computed(() => !!expandedTreeNodes.value?.length);
437
430
  const dialogFormMap = reactive({});
438
431
  const ifRenderMap = reactive({});
@@ -539,8 +532,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
539
532
  }
540
533
  const operationLength = reRowActions.length;
541
534
  if (operationLength) {
542
- const operationSize = serviceTableOptions.size ?? tableGlobalConfig.value?.size ?? "medium";
543
- const operationFontSize = COMPONENT_FONT_MAP[globalComponentSize.value ?? "medium"] ?? 14;
535
+ const operationSize = serviceTableOptions.size ?? tableGlobalConfig.value?.size ?? "small";
536
+ const operationFontSize = COMPONENT_FONT_MAP[globalComponentSize.value ?? "medium"] ?? COMPONENT_FONT_MAP.medium;
544
537
  const operationIdx = reColumns.findIndex((item) => item.colKey === "operation");
545
538
  const defaultOperation = {
546
539
  title: t("operationText"),
@@ -588,7 +581,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
588
581
  manual: shouldValidateInitialSearch.value || serviceTableOptions.manual,
589
582
  maxHeight: fitParentHeight ? serviceTableOptions.maxHeight : void 0,
590
583
  selectType: void 0,
591
- transformParams
584
+ transformParams,
585
+ // crud 自带补偿 + 列缓存体系,禁止内嵌 service-table 再补偿(防双重补偿)
586
+ widthCompensation: false
592
587
  },
593
588
  formOptions: form,
594
589
  detailOptions: detail,
@@ -624,12 +619,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
624
619
  }
625
620
  return getColumnsStorageKey(key);
626
621
  });
627
- const cachedColumns = useLocalStorage(finalCacheColumnsKey, []);
622
+ const cachedColumnStore = useLocalStorage(finalCacheColumnsKey, {
623
+ columns: []
624
+ });
625
+ const columnStore = computed(() => normalizeColumnStore(cachedColumnStore.value));
626
+ const compensationTableSize = computed(() => reProps.value.serviceTableOptions.size ?? tableGlobalConfig.value?.size ?? "small");
627
+ const compensationGlobalSize = computed(() => globalComponentSize.value ?? "medium");
628
628
  const hasFormItemColumns = computed(() => hasFormItem(reProps.value.columns));
629
629
  const mergeColumns = computed({
630
630
  get: () => {
631
631
  const original = reProps.value.columns;
632
- const mergedColumns = cachedColumns.value ? mergeColumnsWithCache(original, cachedColumns.value) : original;
632
+ const cachedColumns = columnStore.value.columns;
633
+ const mergedColumns = mergeColumnsWithCache(original, cachedColumns);
633
634
  if (!hasFormItemColumns.value) return mergedColumns;
634
635
  return mergedColumns.map((column) => ({
635
636
  ...column,
@@ -637,19 +638,22 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
637
638
  }));
638
639
  },
639
640
  set: (val) => {
640
- cachedColumns.value = val.map(({
641
- colKey,
642
- hidden,
643
- width,
644
- minWidth,
645
- fixed
646
- }) => ({
647
- colKey,
648
- hidden: hasFormItemColumns.value ? false : hidden,
649
- width,
650
- minWidth,
651
- fixed
652
- }));
641
+ cachedColumnStore.value = {
642
+ ...columnStore.value,
643
+ columns: val.map(({
644
+ colKey,
645
+ hidden,
646
+ width,
647
+ minWidth,
648
+ fixed
649
+ }) => ({
650
+ colKey,
651
+ hidden: hasFormItemColumns.value ? false : hidden,
652
+ width,
653
+ minWidth,
654
+ fixed
655
+ }))
656
+ };
653
657
  }
654
658
  });
655
659
  const showColumns = computed(() => mergeColumns.value?.filter((item) => !item.hidden));
@@ -733,6 +737,26 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
733
737
  function toggleSearchVisible() {
734
738
  searchVisible.value = !searchVisible.value;
735
739
  }
740
+ function isSameWidthAsOriginal(next) {
741
+ const originalMap = new Map(reProps.value.columns.map((col) => [col.colKey, col]));
742
+ return next.columns.every((col) => {
743
+ const original = originalMap.get(col.colKey);
744
+ if (!original) return false;
745
+ return (col.width ?? void 0) === (original.width ?? void 0) && (col.minWidth ?? void 0) === (original.minWidth ?? void 0);
746
+ });
747
+ }
748
+ function syncColumnSizeCompensation() {
749
+ const prev = columnStore.value;
750
+ const next = applySizeCompensation(prev, reProps.value.columns, compensationTableSize.value, compensationGlobalSize.value, {
751
+ operation: {
752
+ authoredColumns: props.columns,
753
+ extraWidth: OPERATION_EXTRA_WIDTH
754
+ }
755
+ });
756
+ if (next === prev) return;
757
+ if (!prev.columns.length && isSameWidthAsOriginal(next)) return;
758
+ cachedColumnStore.value = next;
759
+ }
736
760
  function toggleTreeExpandAll() {
737
761
  if (treeIsExpand.value) tableRef.value?.foldAll();
738
762
  else tableRef.value?.expandAll();
@@ -757,13 +781,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
757
781
  if (!hasChanged) return;
758
782
  mergeColumns.value = newColumns;
759
783
  };
760
- function calcTextWidth(text, fontSize) {
761
- return [...text].reduce((width, char) => {
762
- if (char.charCodeAt(0) > 255) return width + fontSize;
763
- return width + Math.round(fontSize * (/[A-Z]/.test(char) ? 0.79 : 0.57));
764
- }, 0);
765
- }
766
- function getActionWidth(action, row, fontSize = 14) {
784
+ function getActionWidth(action, row, fontSize = COMPONENT_FONT_MAP.medium) {
767
785
  if (action.component) return Math.round(fontSize * 2);
768
786
  let iconWidth = 0;
769
787
  if (action.prefixIcon) {
@@ -796,11 +814,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
796
814
  }
797
815
  return ifRender !== false;
798
816
  }
799
- function calcOperationWidth(rowActions, rows, size = "medium", fontSize = 14) {
817
+ function calcOperationWidth(rowActions, rows, size = "small", fontSize = COMPONENT_FONT_MAP.medium) {
800
818
  const permittedActions = rowActions.filter((action) => hasPermiOr(action.permi, false));
801
819
  if (!permittedActions.length) return 0;
802
- const cellPadding = SIZE_PADDING_MAP[size] ?? 32;
803
- const sumWidth = (actions, row) => actions.reduce((width, action) => width + getActionWidth(action, row, fontSize), 0) + (actions.length - 1) * 25 + cellPadding + 8;
820
+ const cellPadding = SIZE_PADDING_MAP[size] ?? SIZE_PADDING_MAP.small;
821
+ const sumWidth = (actions, row) => actions.reduce((width, action) => width + getActionWidth(action, row, fontSize), 0) + (actions.length - 1) * 25 + cellPadding + OPERATION_EXTRA_WIDTH;
804
822
  if (!rows?.length) {
805
823
  return sumWidth(permittedActions);
806
824
  }
@@ -1205,12 +1223,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
1205
1223
  function syncToolbarHasSpaceItem() {
1206
1224
  toolbarHasSpaceItem.value = !!toolbarRef.value?.querySelector(".t-space-item");
1207
1225
  }
1226
+ watch([compensationTableSize, compensationGlobalSize, finalCacheColumnsKey], syncColumnSizeCompensation, {
1227
+ immediate: true
1228
+ });
1208
1229
  watch(hasFormItemColumns, (hasFormItem2) => {
1209
- if (!hasFormItem2 || !cachedColumns.value?.some((column) => column.hidden)) return;
1210
- cachedColumns.value = cachedColumns.value.map((column) => ({
1211
- ...column,
1212
- hidden: false
1213
- }));
1230
+ const columns = columnStore.value.columns;
1231
+ if (!hasFormItem2 || !columns.some((column) => column.hidden)) return;
1232
+ cachedColumnStore.value = {
1233
+ ...columnStore.value,
1234
+ columns: columns.map((column) => ({
1235
+ ...column,
1236
+ hidden: false
1237
+ }))
1238
+ };
1214
1239
  }, {
1215
1240
  immediate: true
1216
1241
  });
@@ -1457,8 +1482,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
1457
1482
  "onUpdate:visible": _cache[10] || (_cache[10] = ($event) => isRef(columnControllerVisible) ? columnControllerVisible.value = $event : null),
1458
1483
  columns: mergeColumns.value,
1459
1484
  "onUpdate:columns": _cache[11] || (_cache[11] = ($event) => mergeColumns.value = $event),
1460
- "default-columns": reProps.value.columns
1461
- }, null, 8, ["visible", "columns", "default-columns"])], 2);
1485
+ "default-columns": reProps.value.columns,
1486
+ size: compensationTableSize.value
1487
+ }, null, 8, ["visible", "columns", "default-columns", "size"])], 2);
1462
1488
  };
1463
1489
  }
1464
1490
  });
@@ -24,6 +24,7 @@ export declare const qdCrudTableProps: {
24
24
  readonly emptyImage: true;
25
25
  readonly readonly: undefined;
26
26
  readonly lazyForm: true;
27
+ readonly widthCompensation: true;
27
28
  readonly editCellValidationBlock: "error";
28
29
  readonly cellSelectable: undefined;
29
30
  readonly cellClipboard: true;
@@ -192,6 +192,7 @@ declare const _default: <D extends TableRowData = TableRowData, R = unknown, P =
192
192
  onSuccess?: ((data: import("qidian-shared").ServicePageDataType<D>) => void) | undefined;
193
193
  manual?: boolean | undefined;
194
194
  cellSelectable?: boolean | undefined;
195
+ widthCompensation?: boolean | undefined;
195
196
  selectType?: "single" | "multiple" | undefined;
196
197
  cellClipboard?: boolean | undefined;
197
198
  onCellCopy?: ((context: import("../../service/table/types").QdServiceTableCellCopyContext<D>) => void) | undefined;
@@ -43,6 +43,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
43
43
  columns: {},
44
44
  rowKey: {},
45
45
  size: {},
46
+ widthCompensation: { type: Boolean },
46
47
  selectType: {},
47
48
  activeRowType: { type: [String, Boolean] },
48
49
  cellSelectable: { type: Boolean },
@@ -18,6 +18,7 @@ export declare const qdCrudTabsTableProps: {
18
18
  readonly emptyImage: true;
19
19
  readonly readonly: undefined;
20
20
  readonly lazyForm: true;
21
+ readonly widthCompensation: true;
21
22
  readonly editCellValidationBlock: "error";
22
23
  readonly cellSelectable: undefined;
23
24
  readonly cellClipboard: true;
@@ -1,6 +1,6 @@
1
1
  export declare const qdInputNumberProps: {
2
2
  readonly allowInputOverLimit: false;
3
- readonly theme: "column";
3
+ readonly theme: "normal";
4
4
  readonly status: "default";
5
5
  readonly step: 1;
6
6
  readonly max: number;
@@ -1,6 +1,6 @@
1
1
  const qdInputNumberProps = {
2
2
  allowInputOverLimit: false,
3
- theme: "column",
3
+ theme: "normal",
4
4
  status: "default",
5
5
  step: 1,
6
6
  max: Infinity,
@@ -0,0 +1,39 @@
1
+ import type { TableRowData } from 'tdesign-vue-next';
2
+ import type { QdServiceTableCol } from './types';
3
+ export declare const SIZE_PADDING_MAP: Record<string, number>;
4
+ export declare const COMPONENT_FONT_MAP: Record<string, number>;
5
+ export declare const GLOBAL_SIZE_RATIO_MAP: Record<string, number>;
6
+ export declare const OPERATION_EXTRA_WIDTH = 8;
7
+ export type QdCompensatableCol<D extends TableRowData = TableRowData> = QdServiceTableCol<D> & {
8
+ hidden?: boolean;
9
+ };
10
+ export interface QdCachedCol {
11
+ colKey: string;
12
+ hidden?: boolean;
13
+ width?: QdServiceTableCol['width'];
14
+ minWidth?: QdServiceTableCol['minWidth'];
15
+ fixed?: QdServiceTableCol['fixed'];
16
+ }
17
+ export interface QdColumnWidthStore<C extends QdCachedCol = QdCachedCol> {
18
+ columns: C[];
19
+ tableSize?: string;
20
+ globalSize?: string;
21
+ }
22
+ export declare function resolveSizeRatio(globalSize?: string): number;
23
+ export declare function resolvePaddingDelta(tableSize?: string): number;
24
+ export declare function compensateWidth(base: number, tableSize?: string, globalSize?: string): number;
25
+ export declare function decompensateWidth(width: number, tableSize?: string, globalSize?: string): number;
26
+ export declare function calcTextWidth(text: string, fontSize: number): number;
27
+ export declare function calcOperationLinksWidth(links: string[], tableSize?: string, fontSize?: number): number;
28
+ export declare function isSizeExemptColumn<D extends TableRowData>(col?: QdCompensatableCol<D>): boolean;
29
+ export declare function isCompensatableColumn<D extends TableRowData>(col?: QdCompensatableCol<D>): boolean;
30
+ export declare function mergeColumnsWithCache<C extends {
31
+ colKey?: unknown;
32
+ } = QdCompensatableCol>(original: C[], cached: QdCachedCol[] | undefined): C[];
33
+ export interface SizeCompensationOptions<D extends TableRowData = TableRowData> {
34
+ operation?: {
35
+ authoredColumns?: QdCompensatableCol<D>[];
36
+ extraWidth: number;
37
+ };
38
+ }
39
+ export declare function applySizeCompensation<C extends QdCachedCol = QdCachedCol, D extends TableRowData = TableRowData>(store: QdColumnWidthStore<C>, originalColumns: QdCompensatableCol<D>[], nextTableSize: string, nextGlobalSize: string, options?: SizeCompensationOptions<D>): QdColumnWidthStore<C>;