港大修复打卡记录迟到早退显示逻辑

src/views/system/dashboard/components/util.js

@@ -1113,20 +1113,63 @@ export function buildComponent(name, column, preview, vm) {
                 const event = arg.event
                 const ext = event.extendedProps
                 const titleStr = `${ext.banCiMing}`
-                
-                // 打卡时间只取时分秒
-                const startTime = ext.daKaShiJian1 ? ext.daKaShiJian1.substring(11, 19) : '未打卡'
-                const endTime = ext.daKaShiJian2 ? ext.daKaShiJian2.substring(11, 19) : '未打卡'
-                
-                // 判断上下班是否都有打卡记录
-                const hasBothClock = ext.daKaShiJian1 && ext.daKaShiJian2
-                // 小方块颜色：都有打卡为绿色，否则红色
-                const dotColor = hasBothClock ? '#67C23A' : '#F56C6C'
-                // 状态图标：都有打卡为绿色勾，否则红色警告
-                const statusIconHtml = hasBothClock
+              
+                const rawStart = ext.daKaShiJian1
+                const rawEnd = ext.daKaShiJian2
+              
+                const startTimeText = rawStart ? rawStart.substring(11, 19) : '未打卡'
+                const endTimeText = rawEnd ? rawEnd.substring(11, 19) : '未打卡'
+              
+                const hasStart = !!rawStart
+                const hasEnd = !!rawEnd
+              
+                // 迟到判断（仅当有上班打卡时）
+                let isLate = false
+                if (hasStart) {
+                  const startDateTime = new Date(rawStart)
+                  const banStart = new Date(ext.banCiKaiShi)
+                  isLate = startDateTime > banStart
+                }
+              
+                // 早退判断（仅当有下班打卡时）
+                let isEarlyLeave = false
+                if (hasEnd) {
+                  const endDateTime = new Date(rawEnd)
+                  const banEnd = new Date(ext.banCiJieShu)
+                  isEarlyLeave = endDateTime < banEnd
+                }
+              
+                // 最终是否完全正常：有两次打卡 && 不迟到 && 不早退
+                const isAllNormal = hasStart && hasEnd && !isLate && !isEarlyLeave
+              
+                // 小方块颜色与状态图标
+                const dotColor = isAllNormal ? '#67C23A' : '#F56C6C'
+                const statusIconHtml = isAllNormal
                   ? '<i class="el-icon-check" style="color:#67C23A; font-size:14px;"></i>'
                   : '<i class="el-icon-warning-outline" style="color:#F56C6C; font-size:14px;"></i>'
-          
+              
+                // 上班打卡显示
+                let startDisplay = startTimeText
+                let startColorStyle = ''
+                if (!hasStart) {
+                  startColorStyle = 'style="color:#F56C6C; font-weight:500;"'
+                } else if (isLate) {
+                  startDisplay = startTimeText + ' (迟到)'
+                  startColorStyle = 'style="color:#F56C6C; font-weight:500;"'
+                }
+                const startTimeHtml = `<span ${startColorStyle}>${startDisplay}</span>`
+              
+                // 下班打卡显示
+                let endDisplay = endTimeText
+                let endColorStyle = ''
+                if (!hasEnd) {
+                  endColorStyle = 'style="color:#F56C6C; font-weight:500;"'
+                } else if (isEarlyLeave) {
+                  endDisplay = endTimeText + ' (早退)'
+                  endColorStyle = 'style="color:#F56C6C; font-weight:500;"'
+                }
+                const endTimeHtml = `<span ${endColorStyle}>${endDisplay}</span>`
+              
                 const fragment = document.createDocumentFragment()
                 const content = document.createElement('div')
                 content.innerHTML = `
@@ -1138,8 +1181,8 @@ export function buildComponent(name, column, preview, vm) {
                     <div class="status-placeholder">${statusIconHtml}</div>
                   </div>
                   <div style="font-size:12px; color:#909399; margin-top:4px; line-height:1.4;">
-                    <div>上班打卡时间：${startTime}</div>
-                    <div>下班打卡时间：${endTime}</div>
+                    <div>上班打卡时间：${startTimeHtml}</div>
+                    <div>下班打卡时间：${endTimeHtml}</div>
                   </div>
                 `
                 fragment.appendChild(content)