fix(grid): fix rowspan border can not visible (#3673)

Author: gimmyhehe

packages/theme-saas/src/grid/footer.less

@@ -24,7 +24,7 @@
 .@{grid-prefix-cls} .@{grid-prefix-cls}__footer-border-line {
   @apply w-full;
   @apply h-px;
-  @apply bg-color-bg-4;
+  @apply bg-color-border-separator;
   @apply absolute;
   @apply z-10;
 }

packages/theme-saas/src/grid/table-global.less

@@ -242,19 +242,9 @@
         );
       @apply bg-no-repeat;
       background-size: 1px 100%, 100% 1px;
-      background-position: 100% 0, 100% 99%;
-    }
-
-    &.is__row-span .@{grid-prefix-cls}-body__column {
       background-position: 100% 0, 100% 100%;
     }
 
-    .@{grid-prefix-cls}-body__row:last-child {
-      .@{grid-prefix-cls}-body__column {
-        background-position: 100% 0, 100% 100%;
-      }
-    }
-
     .@{grid-prefix-cls}__fixed-left-wrapper {
       .@{grid-prefix-cls}-body__column {
         @apply border-r-color-border;

packages/theme-saas/src/grid/table.less

@@ -268,6 +268,27 @@
     }
   }
 
+  // tiny新增滚动条放置表格内
+  tbody tr.row__last-visible {
+    @apply relative;
+
+    &::after {
+      @apply content-[''];
+      @apply absolute;
+      @apply bottom-0;
+      @apply left-0;
+      @apply right-0;
+      @apply bottom-0;
+      @apply h-px;
+      @apply bg-color-border-separator;
+      @apply ~'z-[3]';
+    }
+  }
+
+  &:has(.@{grid-prefix-cls}__footer-wrapper) tbody tr.row__last-visible {
+    display: none;
+  }
+
   &&__border,
   &&__border-saas {
     // 启用 border 只有表头生效，默认不建议启用 border 属性，另外如果内嵌列，则表头会自动启用 border 属性
@@ -323,16 +344,6 @@
       background-position: 100% 0, 100% 100%;
     }
 
-    &.is__row-span .@{grid-prefix-cls}-body__column {
-      background-position: 100% 0, 100% 100%;
-    }
-
-    .@{grid-prefix-cls}-body__row:last-child {
-      .@{grid-prefix-cls}-body__column {
-        background-position: 100% 0, 100% 100%;
-      }
-    }
-
     .@{grid-prefix-cls}__fixed-left-wrapper {
       .@{grid-prefix-cls}-body__column {
         @apply border-r-color-border;

packages/vue/src/grid/src/body/src/body.tsx

@@ -345,6 +345,8 @@ function renderRows(_vm) {
   const seqCount = { value: 0 }
   const $seq = ''
 
+  const lastVisibleIndex = rowPool.findLastIndex(({ used }) => Boolean(used))
+
   rowPool.forEach(({ id, item: { payload: row, level: rowLevel }, used }, $rowIndex) => {
     const rowActived = editConfig && actived.row === row
     const virtualRow = isVirtualRow(row)
@@ -369,7 +371,19 @@ function renderRows(_vm) {
 
     renderRowGroupData({ $table, _vm, id, row, rowGroup, rowid, rows, used, virtualRow })
 
-    let args = { $rowIndex, $seq, $table, _vm, editStore, id, isSkipRowRender, row, rowActived, rowClassName }
+    let args = {
+      $rowIndex,
+      $seq,
+      $table,
+      _vm,
+      editStore,
+      id,
+      isSkipRowRender,
+      row,
+      rowActived,
+      rowClassName,
+      lastVisibleIndex
+    }
 
     Object.assign(args, { rowIndex, rowLevel, rowid, rows, selection, seq, treeConfig, used, selectRow })
 
@@ -426,7 +440,7 @@ function renderRowAfter({ $table, _vm, row, rowIndex, rows, id, used }) {
 
 function renderRow(args) {
   const { $rowIndex, $seq, $table, _vm, editStore, id, isSkipRowRender, row, rowActived, rowClassName } = args
-  const { rowIndex, rowLevel, rowid, rows, selection, selectRow, seq, treeConfig, used } = args
+  const { rowIndex, rowLevel, rowid, rows, selection, selectRow, seq, treeConfig, used, lastVisibleIndex } = args
 
   if (isSkipRowRender) {
     return
@@ -459,7 +473,8 @@ function renderRow(args) {
           'row__new': editStore.insertList.includes(row),
           'row__selected': selection.includes(row),
           'row__radio': selectRow === row,
-          'row__actived': rowActived
+          'row__actived': rowActived,
+          'row__last-visible': lastVisibleIndex === $rowIndex
         },
         rowClassName
           ? isFunction(rowClassName)