fix(pl): 将统计展开内容约束到表格可视宽度并保持左对齐。

web-admin/scripts/quota-statistics.test.ts

@@ -64,6 +64,7 @@ function deferred() {
   return { promise, resolve, reject }
 }
 function harness(fixed?: string) {
+  const viewportWidth = vue.ref(1120)
   const calls: any[] = [],
     permissions: any[] = [],
     unmount: Function[] = []
@@ -97,6 +98,7 @@ function harness(fixed?: string) {
       permissions.push(p)
       return p.promise
     },
+    useElementSize: () => ({ width: viewportWidth }),
     useListTableViewportHeight: () => ({ tableHeight: vue.ref(400) }),
     usePersistedListColumns,
     useServerColumnFilters,
@@ -126,11 +128,12 @@ function harness(fixed?: string) {
   const state = scope.run(() =>
     new Function(
       ...Object.keys(env),
-      `${code}; return { rows, fixedDetail, details, load, loadDetail, allowed, canEdit, keyword, setFilterState, page, total }`
+      `${code}; return { rows, fixedDetail, details, load, loadDetail, allowed, canEdit, keyword, setFilterState, page, total, expansionStyle }`
     )(...Object.values(env))
   )
   return {
     state,
+    viewportWidth,
     calls,
     permissions,
     props,
@@ -632,6 +635,7 @@ for (const wrapper of [
         usePersistedListColumns,
         useServerColumnFilters,
         createStatisticsLoader,
+        useElementSize: () => ({ width: vue.ref(1120) }),
         useListTableViewportHeight: () => ({ tableHeight: vue.ref(400) }),
         statusLabel: statisticsLabels.statusLabel,
         contractTypeLabel: statisticsLabels.contractTypeLabel
@@ -669,3 +673,23 @@ for (const wrapper of [
       app.unmount()
     })
 }
+
+test('expanded content follows the table viewport width and keeps alignment local', () => {
+  const h = harness()
+  assert.equal(h.state.expansionStyle.value.width, '1120px')
+  h.viewportWidth.value = 760
+  assert.equal(h.state.expansionStyle.value.width, '760px')
+  const sfc = parse(
+    readFileSync(
+      new URL('../src/views/pl/quota-statistics/StatisticsPanel.vue', import.meta.url),
+      'utf8'
+    )
+  ).descriptor
+  assert.match(
+    sfc.template!.content,
+    /class="view-section statistics-expansion"\s+:style="expansionStyle"/
+  )
+  assert.equal(sfc.styles[0].scoped, true)
+  assert.match(sfc.styles[0].content, /text-align: left/)
+  h.stop()
+})