@veltra/sheet 2.6.0 → 2.7.0

package/dist/components/sheet/sheet.js

@@ -53,9 +53,13 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 		readonly: {
 			type: Boolean,
 			default: false
+		},
+		colResize: {
+			type: Boolean,
+			default: false
 		}
 	},
-	emits: ["active-sheet-change"],
+	emits: ["active-sheet-change", "col-resize-end"],
 	setup(__props, { expose: __expose, emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
@@ -117,7 +121,8 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 			getActiveSheet: () => activeSheet.value,
 			context,
 			formulaBarRef,
-			isFunctionPopupOpen: () => popupTool.value?.popup === "functions"
+			isFunctionPopupOpen: () => popupTool.value?.popup === "functions",
+			onColResizeEnd: (event) => emit("col-resize-end", event)
 		});
 		__expose({
 			workbook,

package/dist/components/sheet/use-sheet-grid.js

@@ -71,9 +71,11 @@ function useSheetGrid(options) {
 			resolveCellRenderer: props.resolveCellRenderer,
 			header: props.header,
 			editors: props.editors,
+			colResize: props.colResize,
 			onContextMenu: handleContextMenu,
 			onEditStart: (addr) => formulaBarRef.value?.mirrorGridEdit(addr),
 			onEditEnd: (addr) => formulaBarRef.value?.exitMirror(addr),
+			onColResizeEnd: options.onColResizeEnd,
 			interceptSelection: () => (formulaBarRef.value?.isRefSelecting() ?? false) || (formulaBarRef.value?.isFunctionPopupOpen() ?? false) || (options.isFunctionPopupOpen?.() ?? false),
 			onSelectionIntercept: (range) => formulaBarRef.value?.handleRefSelect(range)
 		});
@@ -182,7 +184,8 @@ function useSheetGrid(options) {
 		props.showRowHeader,
 		props.showColHeader,
 		props.header,
-		props.editors
+		props.editors,
+		props.colResize
 	], ([nextRows, nextCols]) => {
 		const sheet = getActiveSheet();
 		if (nextRows != null) sheet.ensureTableSize(nextRows, 0);

package/dist/types/sheet.d.ts

@@ -49,6 +49,11 @@ export interface SheetProps {
   showColHeader?: boolean;
   /** 只读预览（关闭编辑回写、填充柄等写入口） */
   readonly?: boolean;
+  /**
+   * 列宽拖拽（透传 SheetGrid）：readonly 下置 true 仅放开列头 resize 手柄，编辑仍
+   * 关闭；缺省 false 行为不变。变化触发网格重建（构造期选项）
+   */
+  colResize?: boolean;
 }
 export interface SheetEmits {
   /** 激活 sheet 切换（点击 tab 或宿主调用 workbook.activateSheet） */
@@ -56,6 +61,11 @@ export interface SheetEmits {
     sheet: Sheet;
     index: number;
   }): void;
+  /** 列宽拖拽落定（写模型之后）：载荷含列索引与最终宽度 */
+  (name: 'col-resize-end', payload: {
+    col: number;
+    width: number;
+  }): void;
 }
 /** 在组件内部引用 */
 export interface _SheetExposed {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veltra/sheet",
-  "version": "2.6.0",
+  "version": "2.7.0",
   "homepage": "https://github.com/cabinet-fe/ultra-ui#readme",
   "bugs": {
     "url": "https://github.com/cabinet-fe/ultra-ui/issues"

package/src/components/sheet/__test__/sheet-component.test.ts

@@ -1186,6 +1186,52 @@ describe('USheet 行高/列宽右键菜单', () => {
   })
 })
 
+describe('USheet colResize（readonly 列宽拖拽）', () => {
+  it('readonly + colResize：列头拖宽写模型并 emit col-resize-end（col + 最终宽度）', async () => {
+    const workbook = createWorkbook()
+    const events: Array<{ col: number; width: number }> = []
+    const { el } = mount(() => ({
+      workbook,
+      rows: 10,
+      cols: 6,
+      readonly: true,
+      colResize: true,
+      onColResizeEnd: (event: { col: number; width: number }) => events.push(event)
+    }))
+    await nextTick()
+
+    // 第 0 列右缘（46 + 80 = 126，±4 手柄区）列头带内拖拽：宽 = 起始 80 + 指针位移 42
+    const instance = el.querySelector<HTMLElement>('.u-sheet__grid-instance')!
+    fire(instance, 'pointerdown', { clientX: 124, clientY: 10 })
+    fire(instance, 'pointermove', { clientX: 166, clientY: 10 })
+    fire(instance, 'pointerup', { clientX: 166, clientY: 10 })
+    await nextTick()
+    expect(events).toEqual([{ col: 0, width: 122 }])
+    expect(workbook.activeSheet.getColWidth(0)).toBe(122)
+  })
+
+  it('缺省 readonly 仍禁列宽拖拽（不 emit）', async () => {
+    const workbook = createWorkbook()
+    const events: Array<{ col: number; width: number }> = []
+    const { el } = mount(() => ({
+      workbook,
+      rows: 10,
+      cols: 6,
+      readonly: true,
+      onColResizeEnd: (event: { col: number; width: number }) => events.push(event)
+    }))
+    await nextTick()
+
+    const instance = el.querySelector<HTMLElement>('.u-sheet__grid-instance')!
+    fire(instance, 'pointerdown', { clientX: 124, clientY: 10 })
+    fire(instance, 'pointermove', { clientX: 166, clientY: 10 })
+    fire(instance, 'pointerup', { clientX: 166, clientY: 10 })
+    await nextTick()
+    expect(events).toEqual([])
+    expect(workbook.activeSheet.getColWidth(0)).toBeUndefined()
+  })
+})
+
 describe('fx 选区锚点', () => {
   const A1_ANCHOR = { minCol: 0, minRow: 0, maxCol: 0, maxRow: 0 }
 

package/src/components/sheet/sheet.vue

@@ -111,7 +111,8 @@ const props = withDefaults(defineProps<SheetProps>(), {
   showTabs: true,
   showRowHeader: true,
   showColHeader: true,
-  readonly: false
+  readonly: false,
+  colResize: false
 })
 
 const emit = defineEmits<SheetEmits>()
@@ -215,7 +216,8 @@ const { rebuildGrid, activateGrid, pruneCache, getGrid, setSelectionAnchor } = u
   context,
   formulaBarRef,
   // 工具栏「函数」弹框打开期间与 fx 入口一致：画布点击不清除目标格高亮
-  isFunctionPopupOpen: () => popupTool.value?.popup === 'functions'
+  isFunctionPopupOpen: () => popupTool.value?.popup === 'functions',
+  onColResizeEnd: (event) => emit('col-resize-end', event)
 })
 
 const exposed: _SheetExposed = {

package/src/components/sheet/use-sheet-grid.ts

@@ -39,6 +39,8 @@ interface UseSheetGridOptions {
   formulaBarRef: ElRef<FormulaBarMirror>
   /** 函数弹框打开中（宿主侧入口，如工具栏「函数」按钮） */
   isFunctionPopupOpen?: () => boolean
+  /** 列宽拖拽落定（SheetGrid 透传 → 宿主 emit col-resize-end） */
+  onColResizeEnd?: (event: { col: number; width: number }) => void
 }
 
 /** 缓存实例（LRU 淘汰）：每个 sheet 一个独立容器 div，非激活容器 visibility:hidden 堆叠 */
@@ -128,9 +130,11 @@ export function useSheetGrid(options: UseSheetGridOptions) {
       resolveCellRenderer: props.resolveCellRenderer,
       header: props.header,
       editors: props.editors,
+      colResize: props.colResize,
       onContextMenu: handleContextMenu,
       onEditStart: (addr) => formulaBarRef.value?.mirrorGridEdit(addr),
       onEditEnd: (addr) => formulaBarRef.value?.exitMirror(addr),
+      onColResizeEnd: options.onColResizeEnd,
       // 引用选择：不回写模型选区，序列化为 A1 / A1:B2 交给公式栏；
       // 函数弹框打开期间（fx / 工具栏两入口）同样拦截，画布点击不离开目标格
       interceptSelection: () =>
@@ -268,7 +272,8 @@ export function useSheetGrid(options: UseSheetGridOptions) {
         props.showRowHeader,
         props.showColHeader,
         props.header,
-        props.editors
+        props.editors,
+        props.colResize
       ] as const,
     ([nextRows, nextCols]) => {
       const sheet = getActiveSheet()

package/src/types/sheet.ts

@@ -57,11 +57,18 @@ export interface SheetProps {
   showColHeader?: boolean
   /** 只读预览（关闭编辑回写、填充柄等写入口） */
   readonly?: boolean
+  /**
+   * 列宽拖拽（透传 SheetGrid）：readonly 下置 true 仅放开列头 resize 手柄，编辑仍
+   * 关闭；缺省 false 行为不变。变化触发网格重建（构造期选项）
+   */
+  colResize?: boolean
 }
 
 export interface SheetEmits {
   /** 激活 sheet 切换（点击 tab 或宿主调用 workbook.activateSheet） */
   (name: 'active-sheet-change', payload: { sheet: Sheet; index: number }): void
+  /** 列宽拖拽落定（写模型之后）：载荷含列索引与最终宽度 */
+  (name: 'col-resize-end', payload: { col: number; width: number }): void
 }
 
 /** 在组件内部引用 */