diff --git a/src/views/modules/sampleTracking/projectProofTracking.vue b/src/views/modules/sampleTracking/projectProofTracking.vue
index 81f3a5b..41ab016 100644
--- a/src/views/modules/sampleTracking/projectProofTracking.vue
+++ b/src/views/modules/sampleTracking/projectProofTracking.vue
@@ -86,26 +86,19 @@
-
-
-
+
+
{{ processTooltip.content }}
+
@@ -866,6 +868,13 @@ export default {
selectionRows: [],
batchEditMode: false,
processHistoryMap: {},
+ processTooltipHoverKey: '',
+ processTooltip: {
+ visible: false,
+ content: '',
+ left: 0,
+ top: 0
+ },
processHistoryRows: [],
commentsEditingTrackingId: null,
commentsDraft: '',
@@ -1203,6 +1212,7 @@ export default {
this.dataListLoading = true
searchProofTracking(inData).then(({ data }) => {
this.dataListLoading = false
+ this.resetProcessTooltip()
if (data && data.code === 0) {
this.dataList = (data.page && data.page.list) || []
this.totalPage = (data.page && data.page.totalCount) || 0
@@ -1222,6 +1232,7 @@ export default {
}
}).catch(() => {
this.dataListLoading = false
+ this.resetProcessTooltip()
this.$message.error('查询异常')
})
},
@@ -1701,6 +1712,75 @@ export default {
}
return `${row.trackingId}_${processCol.code}`
},
+ resetProcessTooltip () {
+ this.processTooltipHoverKey = ''
+ this.processTooltip.visible = false
+ this.processTooltip.content = ''
+ },
+ hideProcessTooltip () {
+ this.processTooltip.visible = false
+ this.processTooltip.content = ''
+ },
+ updateProcessTooltipPosition (event) {
+ if (!event) {
+ return
+ }
+ const offsetX = 12
+ const offsetY = 16
+ let left = event.clientX + offsetX
+ let top = event.clientY + offsetY
+ const maxWidth = 220
+ const maxHeight = 120
+ if (left + maxWidth > window.innerWidth - 8) {
+ left = window.innerWidth - maxWidth - 8
+ }
+ if (top + maxHeight > window.innerHeight - 8) {
+ top = event.clientY - maxHeight - 8
+ }
+ this.processTooltip.left = Math.max(8, left)
+ this.processTooltip.top = Math.max(8, top)
+ },
+ handleProcessTooltipMouseMove (event) {
+ if (!this.processTooltip.visible) {
+ return
+ }
+ this.updateProcessTooltipPosition(event)
+ },
+ handleProcessTooltipMouseLeave () {
+ this.processTooltipHoverKey = ''
+ this.hideProcessTooltip()
+ },
+ handleProcessTooltipMouseEnter (row, processCol, event) {
+ const cacheKey = this.getProcessCacheKey(row, processCol)
+ if (!cacheKey) {
+ return
+ }
+ this.processTooltipHoverKey = cacheKey
+ this.updateProcessTooltipPosition(event)
+ const showTooltip = () => {
+ if (this.processTooltipHoverKey !== cacheKey) {
+ return
+ }
+ if (!this.hasProcessHistory(row, processCol)) {
+ this.hideProcessTooltip()
+ return
+ }
+ const content = this.getProcessTooltip(row, processCol)
+ if (!content) {
+ this.hideProcessTooltip()
+ return
+ }
+ this.processTooltip.content = content
+ this.processTooltip.visible = true
+ }
+ if (Object.prototype.hasOwnProperty.call(this.processHistoryMap, cacheKey)) {
+ showTooltip()
+ return
+ }
+ this.loadProcessHistory(row, processCol, false).then(() => {
+ showTooltip()
+ })
+ },
loadProcessHistory (row, processCol, refreshDialog) {
if (!row || !row.trackingId) {
return Promise.resolve([])
@@ -1940,6 +2020,20 @@ export default {
white-space: pre-line;
}
+.process-history-tooltip {
+ position: fixed;
+ z-index: 3000;
+ max-width: 220px;
+ padding: 10px 12px;
+ border-radius: 4px;
+ background: rgba(48, 49, 51, 0.95);
+ color: #fff;
+ font-size: 12px;
+ line-height: 1.5;
+ white-space: pre-line;
+ pointer-events: none;
+}
+
.link-date {
color: #0c4dbb;
text-decoration: none;