|  |  |  | 
|---|
|  |  |  | 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; | 
|---|
|  |  |  | 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; | 
|---|