员工日工资设置记录高亮显示且在第一行

src/view/performance/yuangongrigongzi.vue

@@ -75,7 +75,7 @@
 		  
 		  <div class="gva-table-box">
 		    <!-- 数据展示 -->
-		    <el-table ref="multipleTable2" style="width: 100%;height: 40vh;" tooltip-effect="dark" :data="tableData2" row-key="ID"
+		    <el-table ref="multipleTable2" class="lower-table" style="width: 100%;height: 40vh;" tooltip-effect="dark" :data="tableData2" row-key="ID"
 		      highlight-current-row="true" border 
 			  :row-style="{ height: '20px' }"
 			  :cell-style="{ padding: '0px' }" :header-row-style="{ height: '20px' }"
@@ -365,7 +365,7 @@ import {
 import { getDictFunc, formatDate, formatBoolean, filterDict, ReturnArrImg, onDownloadFile } from '@/utils/format'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { Search, Refresh, Download } from '@element-plus/icons-vue'
-import { ref, reactive, onMounted, onBeforeMount } from 'vue'
+import { ref, reactive, onMounted, nextTick, onBeforeMount } from 'vue'
 import Ygjjmx from './printYgjjmx.vue'
 import * as XLSX from "xlsx";
 import { useUserStore } from '@/pinia/modules/user'
@@ -812,27 +812,38 @@ function ontable(row, column, event) {
   
   // # 截取第一个"-"之前的内容并赋值给新变量1
   let new_variable1 = parts[0]
-  
   // # 截取第一个"-"之后到第二个"-"之前的内容并赋值给新变量2
   let new_variable2 = parts[1]
-  Getundertable(new_variable1,row.bh)
-}
-//获取下列表
-const Getundertable = (date,bh) => {
-	if(bh == undefined) return
-  dailygetAllList({date:date,code:bh}).then(response=>{
+  if(row.bh == undefined) return
+
+  dailygetAllList({date:new_variable1,code:row.bh}).then(response=>{
 	  if(response.code==0){
 	  	   tableData2.splice(0, tableData2.length, ...response.data);
-	  	// console.log(response.data.num)
-	  	// const rowIndex = tableData.findIndex(row => row.UniqId === lastCellValue);
-	  	// console.log(rowIndex)
-	  	// tableData[rowIndex].sczl_废品率系数 = response.data.num;
+        // 为匹配的行添加黄色背景
+        nextTick(() => {
+          let i = 0
+          tableData2.forEach((item, index) => {
+          const rowElement = document.querySelector(`.lower-table  .el-table__row:nth-child(${index + 1})`);
+          
+          if (rowElement) {
+            if (item.sczl_rq == row.sczl_rq) { // 替换yourProperty为实际的属性名
+              if(i == 0){
+                //第一条数据,设置这条数据到视口顶部
+                rowElement.scrollIntoView();
+                console.log(rowElement)
+              }
+              i++
+              rowElement.style.backgroundColor = 'yellow';
+            }else{
+                rowElement.style.backgroundColor = '';
+            }
+          }
+        })
+       })
 	  }
   })
-  
-  // console.log(response)
-  // const rowIndex = tableData.findIndex(row => row.UniqId === 123);
 }
+
 // 双击表格操作
 function doubleClick(row, column, event) {
   // updateCompanyFunc(row);