diff --git a/src/components/LabDetail.vue b/src/components/LabDetail.vue index 7984f40..d7305e2 100644 --- a/src/components/LabDetail.vue +++ b/src/components/LabDetail.vue @@ -113,7 +113,14 @@
-
评估摘要:{{ lab.abstracts }}
+
+
评估摘要:{{ lab.abstracts }}
+
+ {{ currentTooltip.content }} +
+
@@ -213,6 +220,26 @@ const scoreComparisonDialogVisible = ref(false); // 控制得分比较弹窗显 // 存储 Echarts 实例,用于销毁 const chartInstances = new Map(); +// Tooltip 相关 +const currentTooltip = ref({ + labId: null, + content: '', + visible: false +}); + +const showTooltip = (labId, content) => { + currentTooltip.value = { + labId: labId, + content: content, + visible: true + }; +}; + +const hideTooltip = () => { + currentTooltip.value.visible = false; +}; + + // 打开添加评估抽屉 const openAddEvaluationDrawer = () => { isEditMode.value = false; @@ -488,7 +515,7 @@ const scoreComparisonTableData = computed(() => { return selectedLabs.value.map(lab => { const row = { - category: lab.basicInformation.name2 // 纵向表头是中心名称 + category: `${lab.basicInformation.name0}-${lab.basicInformation.name2}` // 纵向表头是年份-中心名称 }; // 将 radarData 映射到 row 的动态属性上 lab.result.forEach((score, index) => { @@ -907,7 +934,7 @@ watch(filteredLabs, () => { min-height: 350px; cursor: pointer; transition: transform 0.2s, box-shadow 0.2s; - position: relative; + position: relative; /* 添加此行,以便tooltip定位 */ } .lab-card:hover { @@ -1129,7 +1156,53 @@ watch(filteredLabs, () => { .searchbox{ display: flex; } -.evaluation-info{ - padding: 20px 15px; + +/* 评估摘要的容器,用于定位tooltip */ +.evaluation-info-wrapper { + position: relative; + padding: 20px 15px; /* 保持原有的padding */ +} + +/* 评估摘要文本样式 */ +.evaluation-info { + white-space: normal; /* 允许文本正常换行 */ + overflow: hidden; /* 隐藏超出容器的内容 */ + text-overflow: ellipsis; /* 显示省略号 */ + display: -webkit-box; + -webkit-line-clamp: 2; /* 限制文本为2行 */ + -webkit-box-orient: vertical; + font-size: 12px; +} + +/* 鼠标悬停时显示的气泡样式 */ +.tooltip { + position: absolute; + bottom: 100%; /* 定位在文本上方 */ + left: 50%; + transform: translateX(-50%); + background-color: rgba(0, 0, 0, 0.85); + color: #fff; + padding: 8px 12px; + border-radius: 4px; + white-space: pre-wrap; /* 保持文本换行 */ + z-index: 100; + max-width: 90%; /* 限制最大宽度 */ + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); + font-size: 14px; + line-height: 1.5; + pointer-events: none; /* 确保不影响鼠标事件 */ + margin-bottom: 10px; /* 与文本的距离 */ +} + +/* 气泡的小箭头 */ +.tooltip::after { + content: ''; + position: absolute; + top: 100%; + left: 50%; + margin-left: -5px; + border-width: 5px; + border-style: solid; + border-color: rgba(0, 0, 0, 0.85) transparent transparent transparent; } \ No newline at end of file diff --git a/src/config.js b/src/config.js index 8619386..49a221e 100644 --- a/src/config.js +++ b/src/config.js @@ -6,7 +6,7 @@ const config = { apiBaseUrl: 'http://192.168.18.9:48080', }, production: { - apiBaseUrl: 'http://36.103.203.89:48088', + apiBaseUrl: 'http://36.103.203.89:48089', } }; diff --git a/upload.js b/upload.js index 6559cb2..f964bf7 100644 --- a/upload.js +++ b/upload.js @@ -29,7 +29,7 @@ const config = { const localDir = path.join(__dirname, 'dist'); // 服务器目标目录 // const remoteDir = process.env.SFTP_REMOTE_DIR; // 如果使用环境变量 -const remoteDir = '/home/ubuntu/mnt/teacher_test/nginx-1/dist'; +const remoteDir = '/home/ubuntu/mnt/Teacher_Evaluation/nginx/dist'; async function uploadToServer() { const sftp = new SftpClient();