@lx-frontend/wrap-element-ui 1.0.1-beta.2 → 1.0.1-beta.4

package/src/components/EditableTable/useDefaultOperation.ts

@@ -1,96 +1,96 @@
-import { Ref, ref } from "vue"
-import { IEmits } from "./types"
-
-interface IParams {
-  emit: IEmits;
-  pageSize: Ref<number>;
-  currentPage: Ref<number>;
-  tableDomRef: Ref<any>;
-  hasExpandRow: boolean
-}
-
-export default function useDefaultOperation({emit, pageSize, currentPage, tableDomRef, hasExpandRow}: IParams) {
-  const operationPopoverRef = ref<any>(null);
-  const editingRowData = ref<Record<string, any>>({});
-  const editingRowIndex = ref<number>(-1);
-
-  const handleDelete = (row, index) => {
-    emit('row-delete', {
-      row,
-      index,
-      page: currentPage.value,
-      size: pageSize.value
-    })
-    closeOperationPopover();
-  }
-
-  const closeOperationPopover = () => {
-    operationPopoverRef.value?.forEach((item) => item?.doClose());
-  }
-
-  const closeAllExpandedRows = () => {
-    if (!hasExpandRow) return
-    tableDomRef.value?.data.forEach((item) => {
-      tableDomRef.value?.toggleRowExpansion(item, false)
-    })
-  }
-
-  const handleEdit = (scope) => {
-    // 折叠所有展开的行
-    closeAllExpandedRows();
-    const { row, $index: index } = scope;
-    editingRowData.value = {...row};
-    editingRowIndex.value = index;
-    emit('row-edit', { row, index, page: currentPage.value, size: pageSize.value});
-    closeOperationPopover();
-  }
-
-  const handleRowPinToTop = (scope) => {
-    const { row, $index: index, store } = scope;
-    const dataList = store.states.data;
-    const newList = [
-      ...dataList.slice(0, index),
-      ...dataList.slice(index + 1)
-    ];
-    newList.unshift({...row, isPinned: true});
-    store.states.data = newList;
-    emit('row-pin-to-top', { row, rawIndex: index, page: currentPage.value, size: pageSize.value});
-    closeOperationPopover();
-  }
-
-  const handleEditSave = (row) => {
-    editingRowIndex.value = -1;
-    const changedData = {}
-    for (const key of Object.keys(row)) {
-      if (row[key] !== editingRowData.value[key]) {
-        changedData[key] = editingRowData.value[key]
-      }
-    }
-
-    emit('row-edit-save', {
-      page: currentPage.value,
-      size: pageSize.value,
-      row,
-      changedData
-    });
-    editingRowData.value = {};
-  }
-
-  const handleEditCancel = (row) => {
-    editingRowIndex.value = -1;
-    editingRowData.value = {};
-    emit('row-edit-cancel', { row, page: currentPage.value, size: pageSize.value});
-  }
-
-  return {
-    operationPopoverRef,
-    editingRowData,
-    editingRowIndex,
-    handleDelete,
-    closeAllExpandedRows,
-    handleEdit,
-    handleEditSave,
-    handleEditCancel,
-    handleRowPinToTop
-  }
+import { Ref, ref } from "vue"
+import { IEmits, IProps } from "./types"
+
+interface IParams {
+  emit: IEmits;
+  pageSize: Ref<number>;
+  props: IProps
+  tableDomRef: Ref<any>;
+  hasExpandRow: boolean
+}
+
+export default function useDefaultOperation({ emit, pageSize, props, tableDomRef, hasExpandRow }: IParams) {
+  const operationPopoverRef = ref<any>(null);
+  const editingRowData = ref<Record<string, any>>({});
+  const editingRowIndex = ref<number>(-1);
+
+  const handleDelete = (row, index) => {
+    emit('row-delete', {
+      row,
+      index,
+      page: props.currentPage,
+      size: pageSize.value
+    })
+    closeOperationPopover();
+  }
+
+  const closeOperationPopover = () => {
+    operationPopoverRef.value?.forEach((item) => item?.doClose());
+  }
+
+  const closeAllExpandedRows = () => {
+    if (!hasExpandRow) return
+    tableDomRef.value?.data.forEach((item) => {
+      tableDomRef.value?.toggleRowExpansion(item, false)
+    })
+  }
+
+  const handleEdit = (scope) => {
+    // 折叠所有展开的行
+    closeAllExpandedRows();
+    const { row, $index: index } = scope;
+    editingRowData.value = { ...row };
+    editingRowIndex.value = index;
+    emit('row-edit', { row, index, page: props.currentPage, size: pageSize.value });
+    closeOperationPopover();
+  }
+
+  const handleRowPinToTop = (scope) => {
+    const { row, $index: index, store } = scope;
+    const dataList = store.states.data;
+    const newList = [
+      ...dataList.slice(0, index),
+      ...dataList.slice(index + 1)
+    ];
+    newList.unshift({ ...row, isPinned: true });
+    store.states.data = newList;
+    emit('row-pin-to-top', { row, rawIndex: index, page: props.currentPage, size: pageSize.value });
+    closeOperationPopover();
+  }
+
+  const handleEditSave = (row) => {
+    editingRowIndex.value = -1;
+    const changedData = {}
+    for (const key of Object.keys(row)) {
+      if (row[key] !== editingRowData.value[key]) {
+        changedData[key] = editingRowData.value[key]
+      }
+    }
+
+    emit('row-edit-save', {
+      page: props.currentPage,
+      size: pageSize.value,
+      row,
+      changedData
+    });
+    editingRowData.value = {};
+  }
+
+  const handleEditCancel = (row) => {
+    editingRowIndex.value = -1;
+    editingRowData.value = {};
+    emit('row-edit-cancel', { row, page: props.currentPage, size: pageSize.value });
+  }
+
+  return {
+    operationPopoverRef,
+    editingRowData,
+    editingRowIndex,
+    handleDelete,
+    closeAllExpandedRows,
+    handleEdit,
+    handleEditSave,
+    handleEditCancel,
+    handleRowPinToTop
+  }
 }