Merge pull request #4570 from Astrenix/fix/available-channels-scroll

fix(frontend): 修复可用渠道页面内容过多时无法滚动的问题

frontend/src/components/channels/AvailableChannelsTable.vue

@@ -1,5 +1,7 @@
 <template>
-  <div class="card overflow-hidden">
+  <!-- .table-wrapper 是 TablePageLayout 滚动链的挂载点：外层 .table-scroll-container
+       负责卡片外观并 overflow-hidden，本层接收 overflow-y-auto 才能在内容超高时滚动。 -->
+  <div class="table-wrapper">
     <table class="w-full table-fixed border-collapse text-sm">
       <thead>
         <tr class="border-b border-gray-100 bg-gray-50/50 text-xs font-medium uppercase tracking-wide text-gray-500 dark:border-dark-700 dark:bg-dark-800/50 dark:text-gray-400">

frontend/src/components/channels/__tests__/AvailableChannelsTable.spec.ts

@@ -0,0 +1,20 @@
+import { readFileSync } from 'node:fs'
+import { dirname, resolve } from 'node:path'
+import { fileURLToPath } from 'node:url'
+
+import { describe, expect, it } from 'vitest'
+
+const componentPath = resolve(dirname(fileURLToPath(import.meta.url)), '../AvailableChannelsTable.vue')
+const componentSource = readFileSync(componentPath, 'utf8')
+
+describe('AvailableChannelsTable scroll integration', () => {
+  // #4555：根元素必须是 TablePageLayout 滚动链约定的 .table-wrapper，
+  // 否则内容超出视口高度时被外层 overflow-hidden 裁剪且没有滚动条。
+  it('mounts the table on the .table-wrapper scroll hook', () => {
+    expect(componentSource).toMatch(/<div class="table-wrapper">\s*<table/)
+  })
+
+  it('does not clip content with its own overflow-hidden card wrapper', () => {
+    expect(componentSource).not.toMatch(/<div class="card overflow-hidden">/)
+  })
+})