|  |  | 
 |  |  |                         <div class="content_left_item1_content_row_line"> | 
 |  |  |                             <el-progress | 
 |  |  |                                 :show-text="false" | 
 |  |  |                                 :percentage="item.doneNum / baseNum"> | 
 |  |  |                                 :percentage="item.doneNum / baseNum * 100"> | 
 |  |  |                             </el-progress> | 
 |  |  |                         </div> | 
 |  |  |                         <div class="content_left_item1_content_row_num">{{ item.doneNum }}</div> | 
 |  |  | 
 |  |  |                                         effect="dark" | 
 |  |  |                                         :content="'已报工良品数' + child.doneNum + ';工序计划数' + child.planNum" | 
 |  |  |                                         placement="top"> | 
 |  |  |                                         <div class="scroll_item_row_item" @click="jump(child.procedureId)"> | 
 |  |  |                                         <div class="scroll_item_row_item" @click="jump(child.procedureId, child.procedureName)"> | 
 |  |  |                                             <div class="scroll_item_row_item_x"></div> | 
 |  |  |                                             <!-- <img v-if="i == 0 || i == 1" src="@/assets/img/ic_complete@2x.png" alt="" /> --> | 
 |  |  |                                             <span v-if="child.rate < 100">{{ child.rate }}%</span> | 
 |  |  |                                             <img v-else src="@/assets/img/ic_complete@2x.png" alt="" /> | 
 |  |  |                                             <span class="scroll_item_row_item_wz">{{ child.procedureName }}</span> | 
 |  |  |                                         </div> | 
 |  |  |                                     </el-tooltip> | 
 |  |  |                                 </div> | 
 |  |  | 
 |  |  | </template> | 
 |  |  |  | 
 |  |  | <script setup> | 
 |  |  |     import { reactive, ref, onMounted, nextTick, onUnmounted, computed, watch, onActivated } from 'vue' | 
 |  |  |     import { reactive, ref, onMounted, nextTick, onUnmounted, computed, watch, toRefs } from 'vue' | 
 |  |  |     import { getPlanData, getTop, getStockList, getWorkPlansList, getProcedureProcessList, getRecordLogPage, getDeviceCheckPage, getUnqualified7DayData, getUnqualifiedCateData } from '@/utils/api.js' | 
 |  |  |     import { useCounterStore } from '@/stores/counter.js' | 
 |  |  |     import * as echarts from 'echarts' | 
 |  |  | 
 |  |  |     let timer2 = ref(null) | 
 |  |  |     let timer3 = ref(null) | 
 |  |  |     let timer4 = ref(null) | 
 |  |  |     let timer5 = ref(null) | 
 |  |  |     let scrollContainer = ref(null) | 
 |  |  |     let scrollContainer1 = ref(null) | 
 |  |  |     let scrollContainer2 = ref(null) | 
 |  |  | 
 |  |  |         return enterprise.departId | 
 |  |  |     }) | 
 |  |  |  | 
 |  |  |     const jump = (procedureId) => { | 
 |  |  |     const jump = (procedureId, procedureName) => { | 
 |  |  |         enterprise.setProcedureName(procedureName) | 
 |  |  |         router.push({ name: 'process', query: { procedureId } }) | 
 |  |  |     } | 
 |  |  |  | 
 |  |  | 
 |  |  |         clearTimeout(timer2.value) | 
 |  |  |         clearTimeout(timer3.value) | 
 |  |  |         clearTimeout(timer4.value) | 
 |  |  |         clearTimeout(timer5.value) | 
 |  |  |     }) | 
 |  |  |     const clickCate = (index) => { | 
 |  |  |         clearTimeout(timer1.value) | 
 |  |  | 
 |  |  |     // }) | 
 |  |  |  | 
 |  |  |     onMounted(() => { | 
 |  |  |         console.log('11111') | 
 |  |  |         init() | 
 |  |  |         if (!departId.value) return; | 
 |  |  |         timer5.value = setInterval(init(), 60000) | 
 |  |  |     }) | 
 |  |  | </script> | 
 |  |  |  | 
 |  |  | 
 |  |  |                                 align-items: center; | 
 |  |  |                                 .scroll_item_row { | 
 |  |  |                                     flex: 1; | 
 |  |  |                                     width: 0; | 
 |  |  |                                     overflow: hidden; | 
 |  |  |                                     text-overflow: ellipsis; | 
 |  |  |                                     white-space: nowrap; | 
 |  |  | 
 |  |  |                                     align-items: center; | 
 |  |  |                                     justify-content: center; | 
 |  |  |                                     color: #FFFFFF; | 
 |  |  |                                     font-size: 13px; | 
 |  |  |                                     &:first-child { | 
 |  |  |                                         flex: 1.5; | 
 |  |  |                                     } | 
 |  |  | 
 |  |  |                                 .scroll_item_row { | 
 |  |  |                                     flex: 1; | 
 |  |  |                                     height: 100%; | 
 |  |  |                                     overflow: hidden; | 
 |  |  |                                     text-overflow: ellipsis; | 
 |  |  |                                     white-space: nowrap; | 
 |  |  |                                     display: flex; | 
 |  |  |                                     align-items: center; | 
 |  |  |                                     justify-content: center; | 
 |  |  |                                     color: #FFFFFF; | 
 |  |  |                                     font-size: 13px; | 
 |  |  |                                     &:nth-child(5) { | 
 |  |  |                                         flex: 3; | 
 |  |  |                                     } | 
 |  |  | 
 |  |  |                                             font-family: PingFangSC-Regular, PingFang SC; | 
 |  |  |                                             font-weight: 400; | 
 |  |  |                                             color: #01D9FE; | 
 |  |  |                                         } | 
 |  |  |                                         .scroll_item_row_item_wz { | 
 |  |  |                                             white-space: nowrap; | 
 |  |  |                                             position: absolute; | 
 |  |  |                                             bottom: -10px; | 
 |  |  |                                             left: 50%; | 
 |  |  |                                             transform: translate(-50%, 45%); | 
 |  |  |                                             font-size: 12px; | 
 |  |  |                                             font-family: PingFangSC-Regular, PingFang SC; | 
 |  |  |                                             font-weight: 400; | 
 |  |  |                                             color: #FFFFFF; | 
 |  |  |                                         } | 
 |  |  |                                         .scroll_item_row_item_x { | 
 |  |  |                                             position: absolute; | 
 |  |  | 
 |  |  |                                 .scroll_item_row { | 
 |  |  |                                     flex: 1; | 
 |  |  |                                     height: 100%; | 
 |  |  |                                     overflow: hidden; | 
 |  |  |                                     text-overflow: ellipsis; | 
 |  |  |                                     white-space: nowrap; | 
 |  |  |                                     display: flex; | 
 |  |  |                                     align-items: center; | 
 |  |  |                                     font-size: 13px; | 
 |  |  |                                     justify-content: center; | 
 |  |  |                                     color: #FFFFFF; | 
 |  |  |                                     .scroll_item_row_item { | 
 |  |  | 
 |  |  |                                 .scroll_item_row { | 
 |  |  |                                     flex: 1; | 
 |  |  |                                     height: 100%; | 
 |  |  |                                     overflow: hidden; | 
 |  |  |                                     text-overflow: ellipsis; | 
 |  |  |                                     white-space: nowrap; | 
 |  |  |                                     display: flex; | 
 |  |  |                                     font-size: 13px; | 
 |  |  |                                     align-items: center; | 
 |  |  |                                     justify-content: center; | 
 |  |  |                                     color: #FFFFFF; | 
 |  |  | 
 |  |  |                                 .scroll_item_row { | 
 |  |  |                                     flex: 1; | 
 |  |  |                                     height: 100%; | 
 |  |  |                                     overflow: hidden; | 
 |  |  |                                     text-overflow: ellipsis; | 
 |  |  |                                     white-space: nowrap; | 
 |  |  |                                     font-size: 13px; | 
 |  |  |                                     display: flex; | 
 |  |  |                                     align-items: center; | 
 |  |  |                                     justify-content: center; |