From a7962a9614b7ec25bc2406a52175a42ed3fa8577 Mon Sep 17 00:00:00 2001
From: hanyuqing <1106611654@qq.com>
Date: Wed, 31 Dec 2025 14:45:38 +0800
Subject: [PATCH] all

---
 vue/src/system/KGData.vue | 335 +++++++++-------------------------------------
 1 file changed, 64 insertions(+), 271 deletions(-)

diff --git a/vue/src/system/KGData.vue b/vue/src/system/KGData.vue
index 01d150b..b81f247 100644
--- a/vue/src/system/KGData.vue
+++ b/vue/src/system/KGData.vue
@@ -172,7 +172,7 @@
             </div>
 
             <div class="table-shadow-wrapper table-compact">
-              <el-table v-loading="loading" :data="relData" class="ref-table" height="calc(100vh - 560px)">
+              <el-table v-loading="loading" :data="relData" class="ref-table" height="calc(100vh - 530px)">
                 <el-table-column prop="source" label="起始节点" min-width="200" align="center" show-overflow-tooltip/>
                 <el-table-column label="关系描述" width="150" align="center">
                   <template #default="scope">
@@ -586,274 +586,67 @@ onMounted(() => {
 </script>
 
 <style scoped>
-/* 样式保持不变... */
-.knowledge-graph-data-container {
-  background-color: #f4f7fa;
-  display: flex;
-  height: 100vh;
-  width: 100vw;
-}
-
-.main-body {
-  flex: 1;
-  padding: 25px 40px;
-  overflow-y: auto;
-}
-
-.page-header {
-  display: flex;
-  align-items: center;
-  margin-bottom: 25px;
-}
-
-.header-decorator {
-  width: 10px;
-  height: 26px;
-  background-color: #165dff;
-  border-radius: 5px;
-  margin-right: 15px;
-}
-
-.header-title {
-  font-size: 26px;
-  font-weight: bold;
-  color: #165dff;
-  margin: 0;
-}
-
-.stat-container {
-  display: flex;
-  gap: 80px;
-  margin-bottom: 30px;
-}
-
-.custom-stat-card {
-  flex: 1;
-  max-width: 280px;
-  height: 200px;
-  background: #ffffff;
-  border-radius: 30px;
-  padding: 0 35px;
-  box-shadow: 0 0 40px 0px rgba(22, 93, 255, 0.12);
-  border: 1px solid #ffffff;
-  display: flex;
-  align-items: center;
-  transition: transform 0.3s ease;
-}
-
-.stat-inner {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  width: 100%;
-}
-
-.stat-label {
-  color: #636364;
-  font-size: 21px;
-  font-weight: 600;
-  margin-bottom: 15px;
-}
-
-.stat-value {
-  color: #165dff;
-  font-size: 48px;
-  font-weight: 800;
-  margin-bottom: 15px;
-  line-height: 1;
-}
-
-.stat-desc {
-  color: #999;
-  font-size: 14px;
-  line-height: 1.4;
-}
-
-.data-content-wrapper {
-  margin-top: 20px;
-  display: flex;
-  flex-direction: column;
-}
-
-.custom-folder-tabs {
-  display: flex;
-  padding-left: 60px;
-}
-
-.folder-tab-item {
-  padding: 8px 20px;
-  font-size: 12px;
-  color: #86909c;
-  cursor: pointer;
-  background-color: #ecf2ff;
-  border: 1px solid #dcdfe6;
-  border-bottom: none;
-  border-radius: 8px 8px 0 0;
-}
-
-.folder-tab-item.active {
-  background-color: #f1f6ff !important;
-  color: #2869ff;
-  font-weight: bold;
-  border: 2px solid #6896ff;
-  border-bottom: 2px solid #ffffff;
-  margin-bottom: -1px;
-  z-index: 3;
-}
-
-.data-card-container {
-  background: #ffffff;
-  border-radius: 30px;
-  padding: 40px 20px;
-  box-shadow: 0 0 40px 0px rgba(22, 93, 255, 0.15);
-  border: 1px solid #eff4ff;
-  position: relative;
-  z-index: 2;
-  min-height: 300px;
-}
-
-.filter-bar {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 30px;
-}
-
-.filter-inputs {
-  display: flex;
-  gap: 35px;
-  flex-wrap: nowrap;
-}
-
-.input-group-inline {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  flex-shrink: 0;
-  white-space: nowrap;
-}
-
-.filter-label-text {
-  font-size: 14px;
-  color: #165dff;
-  font-weight: 600;
-  flex-shrink: 0;
-}
-
-.search-input, .search-select {
-  width: 160px !important;
-}
-
-.btn-search-ref {
-  background: #165dff !important;
-  border-radius: 8px;
-  height: 38px;
-}
-
-.btn-orange {
-  background: #ffb142 !important;
-  color: white !important;
-  border-radius: 8px;
-  height: 38px;
-  border: none !important;
-}
-
-.table-compact {
-  border-radius: 16px;
-  box-shadow: 0 4px 20px rgba(22, 93, 255, 0.08);
-  overflow: hidden;
-}
-
-.ref-table :deep(.el-table__header) th {
-  background-color: #e8f0ff !important;
-  color: #2869ff;
-  font-weight: 700;
-}
-
-.op-group {
-  display: flex;
-  gap: 8px;
-  justify-content: center;
-}
-
-.ref-op-btn {
-  border: none !important;
-  color: white !important;
-  padding: 6px 14px !important;
-  border-radius: 8px !important;
-}
-
-.ref-op-btn.edit {
-  background-color: #4379ff !important;
-}
-
-.ref-op-btn.delete {
-  background-color: #ff6060 !important;
-}
-
-.ref-op-btn.view {
-  background-color: #ffb142 !important;
-}
-
-.pagination-footer {
-  margin-top: 20px;
-  display: flex;
-  justify-content: flex-end;
-}
-
-:deep(.bold-header) {
-  padding: 20px 25px !important;
-  margin-right: 0 !important;
-  display: flex !important;
-  justify-content: flex-start !important;
-}
-
-:deep(.bold-header .el-dialog__title) {
-  font-family: "Microsoft YaHei", sans-serif !important;
-  font-weight: 900 !important;
-  font-size: 22px !important;
-  color: #000000 !important;
-}
-
-.custom-form :deep(.el-form-item__label) {
-  color: #767676 !important;
-  font-weight: bold !important;
-}
-
-.dialog-footer-wrap {
-  display: flex;
-  justify-content: flex-end;
-  gap: 15px;
-  padding: 10px 0;
-}
-
-.btn-cancel {
-  background-color: #e6e6e6 !important;
-  border: none !important;
-  color: #444 !important;
-  padding: 10px 25px !important;
-  font-weight: 500;
-}
-
-.btn-confirm {
-  background-color: #165dff !important;
-  border: none !important;
-  padding: 10px 25px !important;
-  font-weight: 500;
-}
-
-.animate-fade {
-  animation: fadeIn 0.4s ease-out;
-}
-
-@keyframes fadeIn {
-  from {
-    opacity: 0;
-    transform: translateY(5px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
+.knowledge-graph-data-container { background-color: #f4f7fa; display: flex; height: 100vh; width: 100vw; }
+.main-body { flex: 1; padding: 25px 40px;   overflow: auto;height: 100vh; }
+.page-header { display: flex; align-items: center; margin-bottom: 25px; }
+.header-decorator { width: 10px; height: 22px; background-color: #165dff; border-radius: 5px; margin-right: 10px; }
+.header-title { font-size: 22px; font-weight: bold; color: #165dff; margin: 0; }
+.stat-container { display: flex; gap: 5%; margin-bottom: 30px; }
+.custom-stat-card { flex: 1; max-width: 25%; height: 200px; background: #ffffff; border-radius: 40px; padding: 0 35px; box-shadow: 2px -1px 14px 9px #EBF1FF; border: 1px solid #ffffff; display: flex; align-items: center; transition: transform 0.3s ease; }
+.stat-inner { display: flex; flex-direction: column; align-items: flex-start; width: 100%; }
+.stat-label { color: #636364; font-size: 21px;  margin-bottom: 15px; }
+.stat-value { color: #165dff; font-size: 48px; font-weight: 800; margin-bottom: 15px; line-height: 1; }
+.stat-desc { color: #999; font-size: 14px; line-height: 1.4; }
+.data-content-wrapper { margin-top: 20px; display: flex; flex-direction: column; }
+.custom-folder-tabs { display: flex; padding-left: 40px; }
+.folder-tab-item { padding: 8px 20px; font-size: 12px; color: #86909c; cursor: pointer; background-color: #ecf2ff; border: 1px solid #dcdfe6; border-bottom: none; border-radius: 8px 8px 0 0; }
+.folder-tab-item.active { background-color: #f1f6ff !important; color: #2869ff; font-weight: bold; border: 2px solid #6896ff; border-bottom: 2px solid #ffffff; margin-bottom: -1px; z-index: 3; }
+.data-card-container { background: #ffffff; border-radius: 30px; padding: 20px 20px; box-shadow: 2px -1px 14px 4px #E1EAFF; border: 1px solid #eff4ff; position: relative; z-index: 4; min-height: 380px; }
+.filter-bar { display: flex; justify-content: flex-end; align-items: center; margin-bottom: 20px; }
+.filter-inputs { display: flex; gap: 35px; flex-wrap: nowrap;margin-right: 20px; }
+.input-group-inline { display: flex; align-items: center; gap: 12px; flex-shrink: 0; white-space: nowrap; }
+.filter-label-text { font-size: 14px; color: #165dff; font-weight: 600; flex-shrink: 0; }
+.search-input,.input-group-inline :deep(.el-input) { width: 200px !important;box-shadow: 0 0 0 2px #EBF0FF;border: none;border-radius: 5px; }
+.search-input, .search-select { width: 200px !important;box-shadow: 0 0 0 2px #EBF0FF;border: none;border-radius: 5px; }
+.input-group-inline :deep(.el-select__wrapper){
+  box-shadow: none !important;
+}
+:deep(.el-autocomplete .el-input__wrapper){
+  box-shadow: none !important;
+}
+
+.btn-search-ref { background: #165dff !important; border-radius: 8px; height: 38px; }
+.btn-orange { background: #ffb142 !important; color: white !important; border-radius: 8px; height: 38px; border: none !important; }
+.table-compact { box-shadow: 0 4px 20px rgba(22, 93, 255, 0.08); overflow: hidden; }
+.ref-table :deep(.el-table__header) th { background-color: #e8f0ff !important; color: #2869ff; font-weight: 700; }
+.op-group { display: flex; gap: 8px; justify-content: center; }
+.ref-op-btn { border: none !important; color: white !important; padding: 6px 14px !important; border-radius: 8px !important; }
+.ref-op-btn.edit { background-color: #4379ff !important; }
+.ref-op-btn.delete { background-color: #ff6060 !important; }
+.ref-op-btn.view { background-color: #ffb142 !important; }
+.pagination-footer { margin-top: 20px; display: flex; justify-content: flex-end; }
+:deep(.bold-header) { padding: 20px 25px !important; margin-right: 0 !important; display: flex !important; justify-content: flex-start !important; }
+:deep(.bold-header .el-dialog__title) { font-family: "Microsoft YaHei", sans-serif !important; font-weight: 900 !important; font-size: 22px !important; color: #000000 !important; }
+.custom-form :deep(.el-form-item__label) { color: #767676 !important; font-weight: bold !important; }
+.dialog-footer-wrap { display: flex; justify-content: flex-end; gap: 15px; padding: 10px 0; }
+.btn-cancel { background-color: #e6e6e6 !important; border: none !important; color: #444 !important; padding: 10px 25px !important; font-weight: 500; }
+.btn-confirm { background-color: #165dff !important; border: none !important; padding: 10px 25px !important; font-weight: 500; }
+.animate-fade { animation: fadeIn 0.4s ease-out; }
+.pagination-custom-text{color: #86909c}
+:deep(.el-select__placeholder){color: #86909c}
+:deep(.el-pagination__sizes .el-select__wrapper){box-shadow: 0 0 0 2px #EBF0FF;}
+:deep(.el-pagination.is-background .el-pager li.is-active){background-color: #165DFF;}
+/* 当前激活页码（无论是否 hover）始终是蓝色 */
+:deep(.el-pager li.is-active) {
+  color: #fff !important;
+}
+
+:deep(.el-pager li:not(.is-active):hover) {
+  color: #165DFF !important;
+}
+:deep(.el-pagination .btn-next:hover){color: #165DFF !important;}
+:deep(.el-pagination .btn-prev:hover){color: #165DFF !important;}
+.pagination-footer :deep(.el-pagination .el-input__inner){box-shadow: 0 0 0 2px #EBF0FF;border-radius: 5px; }
+.pagination-footer :deep(.el-input__wrapper){  box-shadow: none !important;}
+@keyframes fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
 </style>
\ No newline at end of file