【无标题】Hold_hold博客-CSDN博客

本文链接：https://blog.csdn.net/m0_59634500/article/details/145345916

API：

import axios from 'axios'

export function getHoldData() {
  // 获取当前的Hold货信息
  return axios.get('http://10.16/api/holdlot/queryHoldData/')
}

export function getKpcData(data) {
  // 获取当前的Hold货信息的KPC数据
  return axios.post('http://10.16/api/holdlot/queryKpcData/', data)
}

export function insertKpcConfirmData(data) {
  // 插入人员确认KPC后的Hold货信息
  return axios.post('http://10.12.6/api/holdlot/kpcConfirmLog/', data)
}

export function getRsData(data) {
  // 获取当前的Hold货信息的RS数据
  return axios.post('http://10.12:/api/holdlot/queryRsData/', data)
}

export function getMitImage(image_name) {
  // 获取ELA MIT IMAGE
  return axios.get(`http://10.126/api/holdlot/queryMitImage?image_name=${image_name}`, {responseType: 'blob'})
}

export function getMitData(data) {
  // 获取ELA MIT DATA
  return axios.post(`http://10.12.56/api/holdlot/queryMitData/`, data)
}

export function getTarImage(data) {
  // 获取TAR BIN MAP IMAGE
  return axios.post(`http://10.1/LOT/lotimgs`, data)
}

页面：

<template>
  <div class="dashboard-container">
    <div class="content=container">
      <el-card>
        <el-table
          :data="holdList"
          border
          style="width: 100%">
           <el-table-column type="index"  width="50" label="ID" header-align="center" align="center" fixed></el-table-column>
          <el-table-column prop="ABBR_NO" label="ABBR" width="70" header-align="center" align="center" fixed></el-table-column>
          <el-table-column prop="LOT_ID" label="LOT_ID" width="115" header-align="center" align="center" fixed></el-table-column>
          <el-table-column prop="CASSETTE_ID" label="CST_ID" width="80" header-align="center" align="center" fixed></el-table-column>
          <el-table-column prop="OP_ID" label="OP_ID" width="100" header-align="center" align="center" fixed></el-table-column>
          <el-table-column prop="SHEET_QTY" label="SHEET_QTY" width="110" header-align="center" align="center" fixed></el-table-column>
          <el-table-column prop="TRANS_ID" label="TRANS_ID" width="100" header-align="center" align="center" fixed></el-table-column>
          <el-table-column prop="HOLD_NOTE" label="HOLD_NOTE" width="500" header-align="center" fixed></el-table-column>
          <!-- <el-table-column prop="HOLD_TIME" label="HOLD_TIME"  width="110" header-align="center" align="center"></el-table-column>
          <el-table-column prop="RESPONSE_DEPT" label="DEPT"  width="90" header-align="center" align="center"></el-table-column>
          <el-table-column prop="REQUEST_USER" label="REQUEST_USER"  width="140" header-align="center" align="center"></el-table-column>
          <el-table-column prop="ENGINEER_EXT" label="ENGINEER_EXT"  width="140" header-align="center" align="center"></el-table-column> -->
          <el-table-column label="操作" width="250" header-align="center">
            <template slot-scope="scope">
              <el-button type="primary" size="mini" @click="kpcEdit(scope.row)">KPC</el-button>
              <el-button class="mit-button" style="width:55px" v-if="scope.row.OP_ID.includes('POLY')" size="mini" @click="mitEdit(scope.row)">MIT</el-button>
              <el-button type="success" style="width:55px" v-else size="mini" @click="rsEdit(scope.row)">RS</el-button>
              <el-button type="warning" size="mini" @click="tarEdit(scope.row)">TAR</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-card>
    </div>

    <!-- KPC弹框 -->
    <el-dialog 
      class="kpc-dialog"
      width="83%"
      :visible="kpcDialogVisible" 
      @close="closeDialog"
      :style="{ top: '-70px' }"
    >
    <!-- <div style="height:600px"> -->
      <div>
        <p style="font-size: 15px;color: #66b1ff;"><i class="el-icon-s-custom"></i> HOLD NOTE：{
  
  {this.lot_info.hold_note}}</p>
      </div>
      <div v-if="isLoading" style="text-align: center;">
        <p style="color: red; font-weight: bold;">加载中...</p>
      </div>
      <!-- OPER过货记录 -->
      <div style="margin:10px 0px">
        <span style="font-size: 15px; color: #66b1ff; line-height:32px;"><i class="el-icon-s-custom"></i> OPI过货记录：</span>
      </div>
      <el-table
        :data="operList"
        border
        style="width: 100%; margin-top:10px"
      >
        <el-table-column prop="LOT_ID" label="LOT_ID" width="180" header-align="center" align="center"></el-table-column>
        <el-table-column prop="EQP_ID" label="TOOL_ID" width="110" header-align="center" align="center"></el-table-column>
        <el-table-column prop="OP_ID" label="OP_ID" width="110" header-align="center" align="center"></el-table-column>
        <el-table-column prop="LOGOFF_TIME" label="LOGOFF_TIME" width="160" header-align="center" align="center"></el-table-column>
        <el-table-column label="距下机超40min" width="130" align="center">
            <template slot-scope="scope">
              <div class="light-wrapper">
                <div v-if="scope.row.KEEP_TIME < 40" class="red-light"></div>
                <div v-else class="green-light"></div>
              </div>
            </template>
        </el-table-column>
        <el-table-column prop="PROCESS_SLOT" label="PROCESS_SLOT" header-align="center" align="left"></el-table-column>
      </el-table>

      <!-- Summary KPC -->
      <div style="margin:10px 0px">
        <span style="font-size: 15px; color: #66b1ff; line-height:32px;"><i class="el-icon-s-custom"></i> Summary KPC：</span>
      </div>
      <el-table
        :data="summaryKpcList"
        border
        style="width: 100%; margin-top:10px"
      >
        <el-table-column prop="LOT_ID" label="LOT_ID" width="180" header-align="center" align="center"></el-table-column>
        <el-table-column prop="TOOL_ID" label="TOOL_ID" width="110" header-align="center" align="center"></el-table-column>
        <el-table-column prop="OPERATION_ID" label="OP_ID" width="110" header-align="center" align="center"></el-table-column>
        <el-table-column prop="SLOT_ID" label="OK_SLOT" header-align="center" align="left"></el-table-column>
      </el-table>

      <div style="margin:10px 0px">
        <el-row>
          <el-col :span="22" style="text-align: left;">
            <!-- <el-tag effect="dark">KPC信息详情</el-tag> -->
            <span style="font-size: 15px; color: #66b1ff; line-height:32px;"><i class="el-icon-s-custom"></i> KPC信息详情（数据每小时的第9分、39分更新，若无KPC请稍后再查或查询机台端Log进行确认）：</span>
          </el-col>
          <el-col :span="2" style="text-align: right;">
            <el-button size="small" type="success" :disabled="kpcButtonvisible" @click="kpcConfirm">KPC已确认</el-button>
          </el-col>
          <!-- <el-col :span="2" style="text-align: right;">
            <el-button size="small" type="danger" :disabled="kpcButtonvisible">KPC NG</el-button>
          </el-col> -->
        </el-row>
      </div>
      <div style="max-height: 380px; overflow-y: auto;">
        <el-table
          :data="kpcList"
          border
          :height="350"
          style="width: 100%;"
        >
          <el-table-column prop="CREATE_TIME" label="CREATE_TIME" width="170" header-align="center" align="center" sortable></el-table-column>
          <el-table-column prop="LOT_ID" label="LOT_ID" width="120" header-align="center" align="center"></el-table-column>
          <el-table-column prop="SHEET_ID" label="SHEET_ID" width="110" header-align="center" align="center"></el-table-column>
          <el-table-column prop="SLOT_ID" label="SLOT_ID" width="110" header-align="center" align="center" sortable></el-table-column>
          <el-table-column prop="TOOL_ID" label="TOOL_ID" width="110" header-align="center" align="center"></el-table-column>
          <el-table-column prop="OPERATION_ID" label="OP_ID" width="100" header-align="center" align="center"></el-table-column>
           <el-table-column prop="PLAN_RECIPE" label="PLAN_RECIPE" width="145" header-align="center" align="center"></el-table-column>
          <el-table-column v-for="(item, index) in kpcDynamicColumns" :key="index" :prop="item.prop" :label="item.label" :width="item.width" header-align="center" align="center"></el-table-column>
        </el-table>
      </div>

      <!-- Cleaner KPC信息 -->
      <div style="margin:10px 0px">
        <el-row>
          <el-col :span="24" style="text-align: left;">
            <span style="font-size: 15px;color: #66b1ff; line-height:32px;"><i class="el-icon-s-custom"></i> Cleaner KPC信息详情：</span>
          </el-col>
        </el-row>
      </div>
      <div style="max-height: 380px; overflow-y: auto;">
        <el-table
          :data="clnKpcList"
          border
          :height="350"
          style="width: 100%;"
        >
          <el-table-column prop="REPORT_TIME" label="CREATE_TIME" width="170" header-align="center" align="center" sortable fixed></el-table-column>
          <el-table-column prop="LOT_ID" label="LOT_ID" width="120" header-align="center" align="center" fixed></el-table-column>
          <el-table-column prop="SHEET_ID" label="SHEET_ID" width="110" header-align="center" align="center" fixed></el-table-column>
          <el-table-column prop="SLOT_ID" label="SLOT_ID" width="110" header-align="center" align="center" sortable fixed></el-table-column>
          <el-table-column prop="TOOL_ID" label="TOOL_ID" width="110" header-align="center" align="center" sortable fixed></el-table-column>
          <el-table-column prop="OPERATION_ID" label="OP_ID" width="100" header-align="center" align="center"></el-table-column>
          <el-table-column v-for="(item, index) in dynamicColumns" :key="index" :prop="item.prop" :label="item.label" :width="item.width" header-align="center" align="center"></el-table-column>
        </el-table>
      </div>

      <!-- 底部 -->
      <el-row slot="footer" type="flex" justify="center">
        <el-button size="small" @click="closeDialog">关闭</el-button>
        <!-- <el-button size="small" type="primary" @click="rejudgeConfirm">确定</el-button> -->
      </el-row>
    </el-dialog>

    <!-- RS弹框 -->
    <el-dialog 
      class="kpc-dialog"
      width="83%"
      :visible="rsDialogVisible" 
      @close="rscloseDialog"
      :style="{ top: '-70px' }"
    >
      <div>
        <p style="font-size: 15px;color: #66b1ff;"><i class="el-icon-s-custom"></i> HOLD NOTE：{
  
  {this.lot_info.hold_note}}</p>
      </div>
      <div v-if="rsIsLoading" style="text-align: center;">
        <p style="color: red; font-weight: bold;">加载中...</p>
      </div>
      <div style="margin:10px 0px">
        <el-row>
          <el-col :span="24" style="text-align: left;">
            <span style="font-size: 15px;color: #66b1ff; line-height:32px;"><i class="el-icon-s-custom"></i> RS信息详情：</span>
          </el-col>
        </el-row>
      </div>

      <div>
        <el-table
          :data="rsList"
          border
          :height="500"
          style="width: 100%;"
        >
          <el-table-column prop="CREATE_TIME" label="CREATE_TIME" width="180" header-align="center" align="center" sortable></el-table-column>
          <el-table-column prop="LOT_ID" label="LOT_ID" width="110" header-align="center" align="center"></el-table-column>
          <el-table-column prop="SHEET_ID" label="SHEET_ID" width="110" header-align="center" align="center"></el-table-column>
          <el-table-column prop="SLOT_ID" label="SLOT_ID" width="110" header-align="center" align="center" sortable></el-table-column>
          <el-table-column prop="ACTUAL_RECIPE" label="ACTUAL_RECIPE" width="150" header-align="center" align="center"></el-table-column>
          <el-table-column prop="PROCESS_RECIPE" label="PROCESS_RECIPE" width="160" header-align="center" align="center"></el-table-column>
          <el-table-column prop="OPERATION_ID" label="OP_ID" width="100" header-align="center" align="center"></el-table-column>
          <el-table-column prop="RS_AVG" label="RS_AVG" width="110" header-align="center" align="center"></el-table-column>
          <el-table-column prop="RS_MAX" label="RS_MAX" width="110" header-align="center" align="center"></el-table-column>
          <el-table-column prop="RS_MIN" label="RS_MIN" width="110" header-align="center" align="center"></el-table-column>
          <el-table-column prop="P1" label="P1" width="80" header-align="center" align="center"></el-table-column>
          <el-table-column prop="P2" label="P2" width="80" header-align="center" align="center"></el-table-column>
          <el-table-column prop="P3" label="P3" width="80" header-align="center" align="center"></el-table-column>
          <el-table-column prop="P4" label="P4" width="80" header-align="center" align="center"></el-table-column>
          <el-table-column prop="P5" label="P5" width="80" header-align="center" align="center"></el-table-column>
          <el-table-column prop="P6" label="P6" width="80" header-align="center" align="center"></el-table-column>
          <el-table-column prop="P7" label="P7" width="80" header-align="center" align="center"></el-table-column>
          <el-table-column prop="P8" label="P8" width="80" header-align="center" align="center"></el-table-column>
          <el-table-column prop="P9" label="P9" width="80" header-align="center" align="center"></el-table-column>
          <el-table-column prop="P10" label="P10" width="80" header-align="center" align="center"></el-table-column>
          <el-table-column v-for="nP in nPs" :key="nP + 10" :prop="`P${nP+10}`" :label="`P${nP+10}`" width="80" header-align="center" align="center"></el-table-column>
        </el-table>
      </div>


    <!-- 底部 -->
      <el-row slot="footer" type="flex" justify="center">
        <el-button size="small" @click="rscloseDialog">关闭</el-button>
        <!-- <el-button size="small" type="primary" @click="rejudgeConfirm">确定</el-button> -->
      </el-row>
    </el-dialog>

    <!-- MIT弹框 -->
    <el-dialog 
      class="kpc-dialog"
      width="83%"
      :visible="mitDialogVisible" 
      @close="mitcloseDialog"
      :style="{ top: '-70px' }"
    >
      <div>
          <p style="font-size: 15px;color: #66b1ff;"><i class="el-icon-s-custom"></i> HOLD NOTE：{
  
  {this.lot_info.hold_note}}</p>
      </div>
      <div v-if="mitIsLoading" style="text-align: center;">
        <p style="color: red; font-weight: bold;">加载中...</p>
      </div>
      <div style="margin:10px 0px">
        <el-row>
          <el-col :span="24" style="text-align: left;">
            <span style="font-size: 15px;color: #66b1ff; line-height:32px;"><i class="el-icon-s-custom"></i> MIT信息详情：</span>
          </el-col>
        </el-row>
      </div>

      <div>
        <el-table
          :data="mitList"
          border
          :height="300"
          style="width: 100%;"
        >
          <el-table-column prop="CREATE_TIME" label="CREATE_TIME" width="180" header-align="center" align="center" sortable></el-table-column>
          <el-table-column prop="LOT_ID" label="LOT_ID" width="120" header-align="center" align="center"></el-table-column>
          <el-table-column prop="SHEET_ID" label="SHEET_ID" width="120" header-align="center" align="center" sortable></el-table-column>
          <el-table-column prop="OPERATION_ID" label="OP_ID" width="100" header-align="center" align="center" sortable></el-table-column>
          <el-table-column prop="CST_ID" label="CST_ID" width="110" header-align="center" align="center"></el-table-column>
          <el-table-column prop="SCAN_MURA_MEAN" label="SCAN_MURA_MEAN" width="180" header-align="center" align="center"></el-table-column>
          <el-table-column prop="SHOT_MURA_MEAN" label="SHOT_MURA_MEAN" width="180" header-align="center" align="center"></el-table-column>
          <el-table-column prop="BRT" label="BRT" width="150" header-align="center" align="center"></el-table-column>
          <el-table-column label="操作" width="145" header-align="center" align="center" >
            <template slot-scope="scope">
              <el-button 
                :class="{ 'is-active': activeId === scope.row.SHEET_ID }"  
                type="primary" 
                size="mini"
                @click="mitImage(scope.row)"
              >
                IMAGE
              </el-button>
            </template>
          </el-table-column>
        </el-table>
        <!-- <img :src="currentImage"> 显示图片 -->
        <el-row>
          <el-col :span="10" style="text-align: left">
            <div>
              <p style="font-size: 15px;color: #66b1ff;"><i class="el-icon-caret-right"></i> SHEET_ID：{
  
  {this.imageSheet}}</p>
            </div>
          </el-col>
          <el-col :span="14" style="text-align: left;">
            <div class="demo-image__preview" style="margin-top: 15px;">
              <el-image 
                style="width: 200px; height: 200px"
                :src="currentImage"
                :preview-src-list="previewSrcList"
              >
              </el-image>
            </div>
          </el-col>
        </el-row>
      </div>

    <!-- 底部 -->
      <el-row slot="footer" type="flex" justify="center">
        <el-button size="small" @click="mitcloseDialog">关闭</el-button>
        <!-- <el-button size="small" type="primary" @click="rejudgeConfirm">确定</el-button> -->
      </el-row>
    </el-dialog>

    <!-- TAR弹框 -->
    <el-dialog 
      class="kpc-dialog"
      width="83%"
      :visible="tarDialogVisible" 
      @close="tarCloseDialog"
      :style="{ top: '-70px' }"
    >
      <div>
          <p style="font-size: 15px;color: #66b1ff;"><i class="el-icon-s-custom"></i> HOLD NOTE：{
  
  {this.lot_info.hold_note}}</p>
      </div>
      <div v-if="tarIsLoading" style="text-align: center;">
        <p style="color: red; font-weight: bold;">加载中...</p>
      </div>
      <div style="margin:10px 0px">
        <el-row>
          <el-col :span="24" style="text-align: left;">
            <span style="font-size: 15px;color: #66b1ff; line-height:32px;"><i class="el-icon-s-custom"></i> TAR IMAGE(单击IMAGE显示图片)：</span>
          </el-col>
        </el-row>
      </div>

      <div style="margin:10px 0px">
        <el-row>
          <el-col :span="9" style="text-align: left;">
            <el-table
              :data="tarImage"
              border
              :height="470"
              style="width: 100%;"
            >
              <el-table-column prop="num" label="SHEET_ID" width="120" header-align="center" align="center" sortable></el-table-column>
              <el-table-column prop="filename" label="IMAGE NAME" width="180" header-align="center" align="center"></el-table-column>
              <el-table-column label="操作" width="145" header-align="center" align="center" >
                <template slot-scope="scope">
                  <el-button 
                    :class="{ 'is-active': activeId === scope.row.num }"  
                    type="primary" 
                    size="mini" 
                    @click="tarImageDetail(scope.row)"
                  >
                    IMAGE
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-col>
          <el-col :span="15" style="text-align: center;">
            <div class="demo-image__preview" style="margin-top: 15px;">
              <el-image 
                style="width: 500px; height: 450px"
                :src="tarImageUrl"
                alt="单击IMAGE显示图片"
                :preview-src-list="tarPreviewSrcList"
              >
              </el-image>
            </div>
          </el-col>
        </el-row>
      </div>

    <!-- 底部 -->
      <el-row slot="footer" type="flex" justify="center">
        <el-button size="small" @click="tarCloseDialog">关闭</el-button>
        <!-- <el-button size="small" type="primary" @click="rejudgeConfirm">确定</el-button> -->
      </el-row>
    </el-dialog>
  </div>
</template>

<script>
import { getHoldData, getKpcData, insertKpcConfirmData, getRsData, getMitData, getMitImage, getTarImage } from '@/api/holdlot'
import { mapGetters } from 'vuex'
export default {
  data() {
    return {
      holdList: [],
      // KPC相关
      kpcList: [],
      operList: [],
      clnKpcList: [],
      kpcDialogVisible: false,
      lot_info: {},
      summaryKpcList: [],
      rowHoldData: {},
      isLoading: false,  // 添加加载状态
      kpcButtonvisible: true,  //KPC OK按钮是否被禁用
      dynamicColumns: [],  //Cleaner KPC过滤所需列
      kpcDynamicColumns: [], //KPC过滤出所需列

      // RS相关
      rsDialogVisible: false,
      // 为了GE特殊RECIPE RS需显示22个点
      nPs: [],
      rsList: [],
      rsIsLoading: false,  //RS加载状态

      // MIT相关
      mitDialogVisible: false,
      mitList: [],
      mitIsLoading: false,
      currentImage: '',  // 用来存储MIT图片数据
      previewSrcList: [],  // 用来存储大图的url
      imageSheet:'',

      // TAR相关: 
      tarinfo: {
        aoi_lots: [''],
        op_seq: ['']
      },
      tarImage:[
        {
          filename: '',
          img: '',
          num: '',
          op: ''
        }
      ],
      tarDialogVisible: false,
      tarIsLoading: false,
      tarImageUrl: '',
      tarPreviewSrcList: [],
      // 高亮显示当前所点击的按钮
      activeId: '' 
    }
  },
  mounted() {
    this.fetchHoldList()
  },
  computed: {
    ...mapGetters(['name'])
  },
  methods: {
    // 提取出对应行LotInfo，即给后端发送请求时的data
    extractLotInfo(row){
      // 获取这一行对应的Hold货数据
      this.rowHoldData = row
      // 获取lot_id以及截取layer
      const op_id = row.OP_ID
      const lot_id = row.LOT_ID
      const hold_note = row.HOLD_NOTE
      const layer = op_id.split(/[-+=]/)[0]
      if (layer === 'BP') {
        // 赋值给lot_info
        this.lot_info.layer = 'ITO'
      } else {
        this.lot_info.layer = layer
      }
      this.lot_info.lot_id = lot_id
      this.lot_info.hold_note = hold_note
      this.lot_info.op_id = op_id
    },

    // 获取Hold List
    async fetchHoldList() {
      const res = await getHoldData()
      // console.log(this.holdList)
      if(res.data.stat_code == 'A200'){
        this.holdList = res.data.stat_info
        if (this.holdList.length > 0) { // 检查是否有结果
           this.$message.success('查询成功');
        } else {
          this.$message.warning('未查询到相关信息'); // 显示警告信息
        }
      }else{
        this.$message.error('出错了，请联系管理员')
      }
    },
    
    // KPC按钮
    async kpcEdit(row) { 
      this.kpcDialogVisible = true // 打开弹框
      this.isLoading = true;  // 显示加载指示器

      // 提取出该行的LOT_ID，OP_ID，HOLD_NOTE
      this.extractLotInfo(row)
      // console.log('lot_info:',this.lot_info)

      const res = await getKpcData(this.lot_info)
      // const res = await getKpcData({lot_id:'XX4NC45000',layer:'POLY',op_id: 'POLY-ELA'})
      this.isLoading = false;  // 隐藏加载指示器
      if(res.data.stat_code == 'A200'){
        // 过货记录
        this.operList = res.data.stat_info.oper_list
        // 主机台的KPC信息
        this.kpcList = res.data.stat_info.kpc_list
        // Cleaner的KPC信息
        this.clnKpcList = res.data.stat_info.cln_kpc_list
        
        // 解除禁用：KPC已确认按钮
        this.kpcButtonvisible = false

        if (this.kpcList.length == 0 && this.clnKpcList.length == 0) { // 检查是否有结果
          this.$message.warning('未查询到相关信息'); // 显示警告信息
          // this.summaryKpc()
        } else if (this.clnKpcList.length == 0){
          this.summaryKpc()
          this.kpcInitData(this.kpcList)
          this.$message.warning('未查询到CLN KPC相关信息') // 显示警告信息
        } else if (this.kpcList.length == 0) {
          this.$message.warning('未查询到SPT KPC相关信息') // 显示警告信息
          this.initData(this.clnKpcList)
        } else {
          this.summaryKpc()
          this.kpcInitData(this.kpcList)
          this.initData(this.clnKpcList)
        }
      } else {
        this.$message.error(res.data.stat_info)
      }
    },

    // 汇总每个OP_ID出现过的片数号
    summaryKpc() {  // 新增方法
      this.summaryKpcList = JSON.parse(JSON.stringify(this.kpcList));  //深拷贝防止原数据改变
      for (let i = 0; i < this.summaryKpcList.length; i++) {
        let currentLotId = this.summaryKpcList[i]['LOT_ID'];
        let currentOpId = this.summaryKpcList[i]['OPERATION_ID'];
        // 寻找之后相同的LOT_ID和OPERATION_ID
        for (let j = i + 1; j < this.summaryKpcList.length; j++) {
          if (this.summaryKpcList[j]['LOT_ID'] === currentLotId && this.summaryKpcList[j]['OPERATION_ID'] === currentOpId) {
            this.summaryKpcList[i]['SLOT_ID'] += ',' + this.summaryKpcList[j]['SLOT_ID'];  // 添加slot_id
            this.summaryKpcList.splice(j, 1);  // 删除已处理元素
            j--;  // 由于数组长度减小，要维持j不变以便下一循环能正常运行
          }
        }
        // 保留指定字段
        let newObject = {
          'LOT_ID': this.summaryKpcList[i]['LOT_ID'],
          'OPERATION_ID': this.summaryKpcList[i]['OPERATION_ID'],
          'TOOL_ID': this.summaryKpcList[i]['TOOL_ID'],
          'SLOT_ID': this.summaryKpcList[i]['SLOT_ID']
        };
        this.summaryKpcList[i] = newObject
      }
    },

    // 已确认KPC按钮
    async kpcConfirm() {
      const now = new Date()
      const formattedTime = `${now.getFullYear()}-${(now.getMonth() + 1).toString().padStart(2, '0')}-${now.getDate().toString().padStart(2, '0')} ${now.getHours().toString().padStart(2, '0')}:${now.getMinutes().toString().padStart(2, '0')}:${now.getSeconds().toString().padStart(2, '0')}`
      // 记录人员确认过KPC的Hold货数据
      const kpcConfirmInfo = {
        ...this.rowHoldData,
        KPC_CONFIRM_USER: this.name,
        KPC_CONFIRM_TIME: formattedTime
      }
      // console.log('kpc确认后信息:',kpcConfirmInfo);
      const res = await insertKpcConfirmData(kpcConfirmInfo)
      // console.log(res);
      if(res.data.stat_code == 'A200'){
        this.$message.success(res.data.stat_info)
      }else{
        this.$message.error(res.data.stat_info)
      }
    },
    // 过滤出Cleaner KPC表格要呈现的列
    kpcInitData(kpcList) {
      // 这里的columnsConfig是你所有可能的列的配置
      let kpcColumnsConfig = [
        { prop: 'L1S3_SPTT_ACT', label: 'L1S3_TIME', width: '110'},
        { prop: 'L1S4_SPTT_ACT', label: 'L1S4_TIME', width: '110'},
        { prop: 'L1S5_SPTT_ACT', label: 'L1S5_TIME', width: '110'},
        { prop: 'L2S5_SPTT_ACT', label: 'L2S5_TIME', width: '110'},
        { prop: 'L3S5_SPTT_ACT', label: 'L3S5_TIME', width: '110'},
        { prop: 'PM2S3_POWER01', label: 'PM2S3_POWER01', width: '145'},
        { prop: 'OVEN_TIME', label: 'OVEN_TIME', width: '110'},
        { prop: 'STEP_NUMBER', label: 'STEP_NUMBER', width: '145'},
      ]
      // 使用filter来获取clnKpcList中存在的列
      this.kpcDynamicColumns = kpcColumnsConfig.filter(config => {
        // 假设kpcList是一个数组，我们检查第一个元素中是否有这个属性
        return kpcList.length > 0 && kpcList[0].hasOwnProperty(config.prop)
      })
    },

    // 过滤出Cleaner KPC表格要呈现的列
    initData(clnKpcList) {
      // 这里的columnsConfig是你所有可能的列的配置
      let columnsConfig = [
        { prop: 'O3_SWING_TIME', label: 'O3_SWING', width: '110'},
        { prop: 'HF1_SWING_TIME', label: 'HF1_SWING', width: '110'},
        { prop: 'RINSE_PROCESS_TIME', label: 'RINSE_PROCESS', width: '145'},
        { prop: 'HF1_PROCESS_TIME', label: 'HF1_PROCESS', width: '145'},
        { prop: 'HF2_PROCESS_TIME', label: 'HF2_PROCESS', width: '145'},
        { prop: 'HM_PROCESS_TIME', label: 'HM_PROCESS', width: '145'},
        { prop: 'AK_PROCESS_TIME', label: 'AK_PROCESS', width: '145'},
        { prop: 'NT_PROCESS_TIME', label: 'NT_PROCESS', width: '145'},
        { prop: 'O3_PROCESS_TIME', label: 'O3_PROCESS', width: '145'},
        { prop: 'ISO_PROCESS_TIME', label: 'ISO_PROCESS', width: '145'},
        { prop: 'FS_PROCESS_TIME', label: 'FS_PROCESS', width: '145'},
        { prop: 'HP_PROCESS_TIME', label: 'HP_PROCESS', width: '145'},
        { prop: 'KJ_PROCESS_TIME', label: 'KJ_PROCESS', width: '145'},
        { prop: 'HPMJ_PROCESS_TIME', label: 'HPMJ_PROCESS', width: '145'},
        { prop: 'HF1_1PROCESS_TIME', label: 'HF1_1PROCESS', width: '145'},
        { prop: 'HF1_2PROCESS_TIME', label: 'HF1_2PROCESS', width: '145'},
        { prop: 'EUV_PROCESS_TIME', label: 'EUV_PROCESS', width: '145'},
        { prop: 'NE_PROCESS_TIME', label: 'NE_PROCESS', width: '145'}
      ]
      // 使用filter来获取clnKpcList中存在的列
      this.dynamicColumns = columnsConfig.filter(config => {
        // 假设clnKpcList是一个数组，我们检查第一个元素中是否有这个属性
        return clnKpcList.length > 0 && clnKpcList[0].hasOwnProperty(config.prop)
      })
    },

    // 关闭KPC弹框
    closeDialog() {
      // 关闭弹框
      this.kpcDialogVisible = false
      // KPC已确认按钮禁用
      this.kpcButtonvisible = true
      // 清空数据
      this.rowHoldData = {}
      this.lot_info = {}
      this.summaryKpcList = []
      this.kpcList = []
      this.clnKpcList = []
      this.operList = []
      // 动态过滤KPC所需显示列
      this.dynamicColumns = []
      this.kpcDynamicColumns = []
    },

    // RS相关
    async rsEdit(row) {
      this.rsDialogVisible = true
      // 显示加载中......
      this.rsIsLoading = true

      // 提取出该行的LOT_ID，OP_ID，HOLD_NOTE
      this.extractLotInfo(row)
      // 发送请求，获取RsList
      const res = await getRsData(this.lot_info)
      // 隐藏加载显示器
      this.rsIsLoading = false     
      // console.log(res.data.stat_info)

      if(res.data.stat_code == 'A200'){
        // RS信息
        this.rsList = res.data.stat_info
        console.log(this.rsList);
        if (this.rsList.length > 0){
          const record = this.rsList[0]
          if (record.OPERATION_ID == 'GE=AFR' && ['', 'LM3000-12MM', 'LM3000-HR', 'LM3000-12MMHR'].includes(record.PROCESS_RECIPE)) {
              this.nPs = Array.from({ length: 12 }, (_, i) => i + 1)
          } else {
              this.nPs = []
          }
          this.$message.success('查询成功')
        } else {
          this.$message.warning('未查询到相关信息') // 显示警告信息
        }
      }else{
        this.$message.error('出错了，请联系管理员')
      }
    },
    rscloseDialog(){
      this.rsDialogVisible = false
      this.rsList = []
      this.rowHoldData = {}
      this.lot_info = {}
    },

    // MIT相关
    async mitEdit(row) {
      this.mitDialogVisible = true
      // 显示加载中......
      this.mitIsLoading = true

      // 提取出该行的LOT_ID，OP_ID，HOLD_NOTE
      this.extractLotInfo(row)
      // 发送请求，获取RsList
      const res = await getMitData(this.lot_info)
      // 隐藏加载显示器
      this.mitIsLoading = false 
      if(res.data.stat_code == 'A200'){
        // MIT数据信息
        this.mitList = res.data.stat_info
        if (this.mitList.length > 0){
          this.$message.success('查询成功')
        } else {
          this.$message.warning('未查询到相关信息') // 显示警告信息
        }
      }else{
        this.$message.error('出错了，请联系管理员')
      }
    },
    mitcloseDialog(){
      this.mitDialogVisible = false
      this.mitList = []
      this.rowHoldData = {}
      this.currentImage = ''
      this.imageSheet = ''
      this.previewSrcList = []
      this.activeId = ''
    },
    async mitImage(row){
      // console.log('mit信息：', row.IMAGE_NAME)
      try {
        // console.log('rownum:', row)
        const response = await getMitImage(row.IMAGE_NAME)  // 向后端请求图片
        const url = window.URL.createObjectURL(new Blob([response.data]))  // 创建object URL
        this.currentImage = url  // 将图片url存储在Vue组件的数据中
        this.previewSrcList = [url]  // 将大图的url存储在Vue组件的数据中
        this.activeId = row.SHEET_ID 
        this.imageSheet = row.SHEET_ID
      } catch (err) {
        if (err.response && err.response.status === 400) {
            this.$message.warning('未查询到图片信息') // 显示警告信息
        } else {
            console.error(err)  // 对于其他类型的错误，我们记录到控制台
        }
      }
    },

    // TAR相关
    async tarEdit(row){
      this.tarDialogVisible = true
      // 显示加载中......
      this.tarIsLoading = true

      // 提取出该行的LOT_ID，OP_ID，HOLD_NOTE
      this.extractLotInfo(row)

      this.tarinfo.aoi_lots = [this.rowHoldData.LOT_ID]
      // console.log(this.tarinfo)
      const res = await getTarImage(this.tarinfo)
      // 隐藏加载显示器
      this.tarIsLoading = false 

      if (res.status == '200') {
        if (Object.keys(res.data[0]).length){
          this.tarImage = res.data[0][0]
        } else {
          this.$message.warning('未查询到相关信息')
        }
      } else {
        this.$message.error('出错了，请联系管理员')
      }
    },
    tarCloseDialog(){
      this.tarDialogVisible = false
      this.rowHoldData = {}
      this.lot_info = {}
      this.tarImage = [
        {
          filename: '',
          img: '',
          num: '',
          op: ''
        }
      ],
      this.tarPreviewSrcList = []
      this.activeId = ''
    },
    tarImageDetail(row){
      const url = 'data:image/jpg;base64,' + row.img
      this.tarImageUrl = url
      this.tarPreviewSrcList = [url]
      this.activeId = row.num 
    }
  }
}
</script>

<style scoped>
.custom-header .el-table__header th {
  background-color: #409eff;
  color: white;
}
.kpc-dialog >>> .el-dialog__body {
  padding: 5px 20px;
}
.mit-button {
  color: white;
  background-color: #00b7a5;
  border-color: #00b7a5;
}
.mit-button:hover {
  background-color:#00cbb8;
  border-color:#00cbb8;
}
.is-active {
  background-color: #67c23a;
  border: 0px;
}

/* 红绿灯 */
.light-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  /* width: 40px;
   height: 40px; */
  border-radius: 50%;
  box-shadow: 0 0 5px rgba(255, 255, 255, 0.7);
}

.red-light {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #e56f70;
}

.green-light {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #66ad68;
}


</style>