From 046413405828de7108031ad45eacac9006e16ec6 Mon Sep 17 00:00:00 2001
From: zq <136432190602163.com>
Date: Fri, 8 Aug 2025 11:51:09 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E8=A1=A8=E6=A0=BC=E8=87=AA?=
 =?UTF-8?q?=E5=AE=9A=E4=B9=89=E7=A9=BA=E7=8A=B6=E6=80=81=E5=B1=95=E7=A4=BA?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/GuipTable.vue | 50 +++++++++++++++++++++++++++++++++++++-------
 src/style/theme/common.scss  |  2 +-
 src/views/agent/siteList.vue |  1 +
 3 files changed, 44 insertions(+), 9 deletions(-)

diff --git a/src/components/GuipTable.vue b/src/components/GuipTable.vue
index 6b5c9c2..ef3b199 100644
--- a/src/components/GuipTable.vue
+++ b/src/components/GuipTable.vue
@@ -1,6 +1,8 @@
 <template>
+   <div class="table-container">
+
     <el-table ref="guiptable" v-bind="$attrs" :data="tableData"  v-on="$listeners" :border="border" @selection-change="handleSelectionChange"
-      :style="{ width: width ? width : '100%', height: height ? height : '100%' }" v-loading="loading">
+      :style="{ width: width ? width : '100%', height: height ? height : '100%' }" v-loading="loading" empty-text=" ">
       <!-- 多选 -->
       <template v-if="multiple">
         <el-table-column type="selection" width="55">
@@ -36,10 +38,13 @@
 
         </el-table-column>
       </template>
-      <template #empty>
-        <el-empty :image="emptyImg"></el-empty>
-      </template>
     </el-table>
+    <div v-if="tableData.length === 0" class="custom-empty">
+      <img :src="emptyImg" alt="无数据" />
+      <p>暂无数据</p>
+    </div>
+   </div>
+
 </template>
 
 <script>
@@ -82,12 +87,41 @@ export default {
   }
 }
 </script>
-<style scoped>
+<style scoped lang="scss">
+
+/* 外层容器需设为 relative，以便空状态定位 */
+.table-container {
+  position: relative;
+  width: 100%;
+}
+
+/* 空状态固定定位（不随滚动移动） */
 .custom-empty {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -35%);
+  width: 200px;
   text-align: center;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
+  background-color: #fff; /* 避免透明背景被表格线干扰 */
+  // padding: 20px;
+  z-index: 10; /* 确保显示在表格上方 */
+  img{
+    width: 80px;
+    height: 80px;
+  }
+  p{
+    font-size: 12px;
+    font-weight: normal;
+    line-height: 13px;
+    letter-spacing: 0.08em;
+    color: #626573;
+  }
+}
+
+/* 确保表格有最小高度（避免高度塌陷） */
+.el-table ::v-deep .el-table__body-wrapper {
+  min-height: 150px !important;
 }
 
 .empty-image {
diff --git a/src/style/theme/common.scss b/src/style/theme/common.scss
index 81e99b3..4dcdd29 100644
--- a/src/style/theme/common.scss
+++ b/src/style/theme/common.scss
@@ -956,7 +956,7 @@ body {
 
 // table start
 .el-table {
-    min-height: 218px;
+    min-height: 200px;
 
     th,
     td {
diff --git a/src/views/agent/siteList.vue b/src/views/agent/siteList.vue
index 453a33d..119f5f5 100644
--- a/src/views/agent/siteList.vue
+++ b/src/views/agent/siteList.vue
@@ -185,6 +185,7 @@ export default {
                     that.siteList = response.data.sitelist
                 })
             }).catch(error => {
+                this.tableLoading = false
                 console.error(error, 'error')
             })
         },