From 051a1bec6a798a214fa2c0166a4af15c284716a4 Mon Sep 17 00:00:00 2001
From: andy <1042025947@qq.com>
Date: Thu, 11 Jun 2026 09:03:33 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/biz/orderItem/index.vue | 38 ++++++++++++++++++++++++++-----
 1 file changed, 32 insertions(+), 6 deletions(-)

diff --git a/src/views/biz/orderItem/index.vue b/src/views/biz/orderItem/index.vue
index f4cff9b..dfce9a2 100644
--- a/src/views/biz/orderItem/index.vue
+++ b/src/views/biz/orderItem/index.vue
@@ -66,7 +66,10 @@
         @update:checked-row-keys="handleCheck"
         :pagination="pagination"
          -->
+        <!--flex-height-->
       <n-data-table
+        ref="tableRef"
+        id="my-table"
         size="small"
         remote
          striped
@@ -75,6 +78,10 @@
         :columns="columns"
         :data="tableData"
         :loading="loading"
+        virtual-scroll
+        :virtual-scroll-x="true"
+        :scroll-x="scrollX"
+        :max-height="580"
       />
       <div class="pagination-container" style="display: flex; justify-content: flex-end; margin-top: 12px">
         <n-pagination
@@ -134,7 +141,6 @@
                   clearable
                   remote
                   :clear-filter-after-select="false"
-                  
                   @update:value="xmselupdate"
                 />
             </n-form-item>
@@ -487,13 +493,16 @@ const columns = [
   // },
   { 
     align:'center',
-    minWidth: 150,
+    minWidth: 260,
     title: '产品名称', 
-    key: 'projectName' 
+    key: 'projectName',
+    ellipsis: {
+      tooltip: true
+    } 
   },
   {
     align:'center',
-    minWidth: 150, 
+    minWidth: 200, 
     title: '物料名称', 
     key: 'name' 
   },
@@ -583,9 +592,9 @@ const columns = [
   },
   { 
     align:'center',
-    minWidth: 150,
     title: '备注', 
-    key: 'remark' 
+    key: 'remark', 
+    minWidth:200
   },
   // { title: '创建时间', key: 'createTime', width: 100 },
   // { title: '创建人', key: 'createBy' },
@@ -634,6 +643,19 @@ const columns = [
   }
 ]
 
+//根据内容设置表格滚动条
+let scrollX = ref(0)
+
+function updateScrollX() {
+  const tableElement = document.querySelector('#my-table .n-data-table-table')
+  if (tableElement) {
+    // 使用 scrollWidth 可以获取表格内容的总宽度，确保滚动条出现
+    scrollX.value = tableElement.scrollWidth
+  } else {
+    scrollX.value = 2000;
+  }
+};
+
 // 加载数据
 async function loadData() {
   loading.value = true
@@ -1058,7 +1080,11 @@ async function loadDictOptions() {
 onMounted(() => {
   loadData()
   loadDictOptions()
+
+  updateScrollX()
+  window.addEventListener('resize', updateScrollX)
 })
+
 </script>
 
 <style scoped>