20260723225202

code/fms/fms-vue/src/components/fms-table/FmsTable.vue

@@ -2,6 +2,7 @@
 import { computed, nextTick, ref, useSlots } from "vue";
 import { useRafFn, useResizeObserver } from "@vueuse/core";
 import { StkTable } from "stk-table-vue";
+import { createActionsCellRenderer } from "./utils/createActionsCellRenderer";
 import { createEditableCellRenderer } from "./utils/createEditableCellRenderer";
 import { createSelectionCellRenderers } from "./utils/createSelectionCellRenderers";
 
@@ -41,14 +42,20 @@ const { SelectionCell, SelectionHeaderCell } = createSelectionCellRenderers({
   onChange: (keys, rows) => props.rowSelection?.onChange?.(keys, rows),
 });
 
-// StkTable 的编辑单元格和多选列统一在封装层生成，业务页面只声明 editor / rowSelection。
+// StkTable 的编辑单元格、操作列和多选列统一在封装层生成，业务页面只声明 editor / actions / rowSelection。
 const tableColumnsModel = computed({
   get: () => {
-    const columns = props.columns.map((column) =>
-      column.editor && !column.customCell
-        ? { ...column, customCell: EditableCell, __fmsEditor: true }
-        : column,
-    );
+    // 依赖 activeRowKey：切换编辑行时触发 columns 重算，迫使 StkTable 重渲染单元格
+    void props.activeRowKey;
+    const columns = props.columns.map((column) => {
+      if (column.actions && !column.customCell) {
+        return { ...column, customCell: createActionsCellRenderer(column.actions), __fmsAction: true };
+      }
+      if (column.editor && !column.customCell) {
+        return { ...column, customCell: EditableCell, __fmsEditor: true };
+      }
+      return column;
+    });
     if (!props.rowSelection) return columns;
     return [
       {
@@ -72,10 +79,11 @@ const tableColumnsModel = computed({
       value
         .filter((column) => !column.__fmsSelection)
         .map((column) => {
-          if (!column.__fmsEditor) return column;
+          if (!column.__fmsEditor && !column.__fmsAction) return column;
           const rest = { ...column };
           delete rest.customCell;
           delete rest.__fmsEditor;
+          delete rest.__fmsAction;
           return rest;
         }),
     ),
@@ -117,6 +125,18 @@ const forwardSlots = computed(() => {
   }
   return result;
 });
+
+// 滚动到指定行；用于新增后自动聚焦
+async function scrollToRow(rowKey) {
+  await nextTick();
+  const el = tableRef.value?.$el;
+  if (!el) return;
+  const key = String(rowKey);
+  const rowEl = el.querySelector(`[data-row-key="${key}"]`);
+  rowEl?.scrollIntoView?.({ block: "nearest", behavior: "smooth" });
+}
+
+defineExpose({ scrollToRow });
 </script>
 
 <template>