|  |  |  | 
|---|
|  |  |  | <span>近7天不良品分布</span> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="content_right_top_nr"> | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div class="content_right_top_nr_top" id="lineChrat"></div> | 
|---|
|  |  |  | <div class="content_right_top_nr_bottom"> | 
|---|
|  |  |  | <div class="content_right_top_nr_bottom_yuan" v-if="data.typeDistribution.length > 0"> | 
|---|
|  |  |  | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div id="pieChart"></div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <!-- 设备巡检记录 --> | 
|---|
|  |  |  | 
|---|
|  |  |  | dayDistribution: [], | 
|---|
|  |  |  | typeDistribution: [], | 
|---|
|  |  |  | num: 0, | 
|---|
|  |  |  | baseNum: 0 | 
|---|
|  |  |  | baseNum: 0, | 
|---|
|  |  |  | bottomAuthHeight: 284 | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | let { baseNum } = toRefs(data) | 
|---|
|  |  |  | let { baseNum, bottomAuthHeight } = toRefs(data) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | let timer = ref(null) | 
|---|
|  |  |  | let timer1 = ref(null) | 
|---|
|  |  |  | 
|---|
|  |  |  | let timer3 = ref(null) | 
|---|
|  |  |  | let timer4 = ref(null) | 
|---|
|  |  |  | let timer5 = ref(null) | 
|---|
|  |  |  | let bottomAuthHeight = 284; | 
|---|
|  |  |  | let scrollContainer = ref(null) | 
|---|
|  |  |  | let scrollContainer1 = ref(null) | 
|---|
|  |  |  | let scrollContainer2 = ref(null) | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // 报工日志 | 
|---|
|  |  |  | getRecordLogPage(companyId.value, departId.value, { | 
|---|
|  |  |  | capacity: 20, | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | function  setBottomHeight(){ | 
|---|
|  |  |  | const pageHeight = window.innerHeight; | 
|---|
|  |  |  | bottomAuthHeight = pageHeight -700; | 
|---|
|  |  |  | // bottom1.style.height=bottomAuthHeight; | 
|---|
|  |  |  | bottomAuthHeight = pageHeight - 700; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | option && myChart.setOption(option); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // onBeforeUnmount(()=>{ | 
|---|
|  |  |  | //     clearTimeout(timer.value) | 
|---|
|  |  |  | //     clearTimeout(timer1.value) | 
|---|
|  |  |  | //     clearTimeout(timer2.value) | 
|---|
|  |  |  | //     clearTimeout(timer3.value) | 
|---|
|  |  |  | //     clearTimeout(timer4.value) | 
|---|
|  |  |  | // }) | 
|---|
|  |  |  | onUnmounted(() => { | 
|---|
|  |  |  | clearTimeout(timer.value) | 
|---|
|  |  |  | clearTimeout(timer1.value) | 
|---|
|  |  |  | 
|---|
|  |  |  | if (scrollDom.offsetHeight == 0) { | 
|---|
|  |  |  | scrollDom = scrollContainer.value | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | let maxLength = scrollDom.clientHeight/34 | 
|---|
|  |  |  | // 如果列表数量过少不进行滚动 | 
|---|
|  |  |  | if (scrollDom.children.length < 6) { | 
|---|
|  |  |  | if (scrollDom.children.length <= maxLength) { | 
|---|
|  |  |  | clearTimeout(timer.value) | 
|---|
|  |  |  | return | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // 组件进行滚动 | 
|---|
|  |  |  | scrollDom.scrollTop += 1 | 
|---|
|  |  |  | scrollDom.scrollTop += 2 | 
|---|
|  |  |  | // 判断是否滚动到底部 | 
|---|
|  |  |  | if (scrollDom.scrollTop >= (scrollDom.scrollHeight - scrollDom.clientHeight)) { | 
|---|
|  |  |  | if (Math.floor(scrollDom.scrollTop) >= (scrollDom.scrollHeight - scrollDom.clientHeight)) { | 
|---|
|  |  |  | // 获取组件第一个节点 | 
|---|
|  |  |  | let first = scrollDom.children[0] | 
|---|
|  |  |  | // 删除节点 | 
|---|
|  |  |  | 
|---|
|  |  |  | scrollDom = scrollContainer1.value | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | // 如果列表数量过少不进行滚动 | 
|---|
|  |  |  | if (scrollDom.children.length < 7) { | 
|---|
|  |  |  | if (scrollDom.children.length < 6) { | 
|---|
|  |  |  | clearTimeout(timer1.value) | 
|---|
|  |  |  | return | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // 组件进行滚动 | 
|---|
|  |  |  | scrollDom.scrollTop += 1 | 
|---|
|  |  |  | scrollDom.scrollTop += 2 | 
|---|
|  |  |  | // 判断是否滚动到底部 | 
|---|
|  |  |  | if (scrollDom.scrollTop >= (scrollDom.scrollHeight - scrollDom.clientHeight)) { | 
|---|
|  |  |  | if (scrollDom.scrollTop+2 >= (scrollDom.scrollHeight - scrollDom.clientHeight)) { | 
|---|
|  |  |  | // 获取组件第一个节点 | 
|---|
|  |  |  | let first = scrollDom.children[0] | 
|---|
|  |  |  | // 删除节点 | 
|---|
|  |  |  | 
|---|
|  |  |  | scrollDom = scrollContainer3.value | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | // 如果列表数量过少不进行滚动 | 
|---|
|  |  |  | if (scrollDom.children.length <= 5) { | 
|---|
|  |  |  | let num = scrollContainer3.value.offsetHeight / 35; | 
|---|
|  |  |  | // alert(scrollDom.children.length  +"---------------"+num) | 
|---|
|  |  |  | // 如果列表数量过少不进行滚动 | 
|---|
|  |  |  | if (scrollDom.children.length <= num) { | 
|---|
|  |  |  | clearTimeout(timer3.value) | 
|---|
|  |  |  | return | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // 组件进行滚动 | 
|---|
|  |  |  | scrollDom.scrollTop += 1 | 
|---|
|  |  |  | scrollDom.scrollTop = scrollDom.scrollTop+2 | 
|---|
|  |  |  | // 判断是否滚动到底部 | 
|---|
|  |  |  | if (scrollDom.scrollTop >= (scrollDom.scrollHeight - scrollDom.clientHeight)) { | 
|---|
|  |  |  | // 获取组件第一个节点 | 
|---|
|  |  |  | 
|---|
|  |  |  | if (scrollDom.offsetHeight == 0) { | 
|---|
|  |  |  | scrollDom = scrollContainer4.value | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | // console.log(bottom1.value.height); | 
|---|
|  |  |  | let num = scrollContainer4.value.offsetHeight / 35; | 
|---|
|  |  |  | // alert(scrollDom.children.length  +"---------------"+num) | 
|---|
|  |  |  | // 如果列表数量过少不进行滚动 | 
|---|
|  |  |  | if (scrollDom.children.length < 5) { | 
|---|
|  |  |  | if (scrollDom.children.length <= num) { | 
|---|
|  |  |  | clearTimeout(timer4.value) | 
|---|
|  |  |  | return | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // 组件进行滚动 | 
|---|
|  |  |  | scrollDom.scrollTop += 1 | 
|---|
|  |  |  | scrollDom.scrollTop += 2 | 
|---|
|  |  |  | // 判断是否滚动到底部 | 
|---|
|  |  |  | if (scrollDom.scrollTop >= (scrollDom.scrollHeight - scrollDom.clientHeight)) { | 
|---|
|  |  |  | if (scrollDom.scrollTop+1 >= (scrollDom.scrollHeight - scrollDom.clientHeight)) { | 
|---|
|  |  |  | // 获取组件第一个节点 | 
|---|
|  |  |  | let first = scrollDom.children[0] | 
|---|
|  |  |  | // 删除节点 | 
|---|
|  |  |  | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style lang="scss" scoped> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | $fixed-height: 690px; | 
|---|
|  |  |  | .content1 { | 
|---|
|  |  |  | flex: 1; | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | 
|---|
|  |  |  | margin-right: 20px; | 
|---|
|  |  |  | .content_left_item1 { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | height:  calc(100vh - 700px); | 
|---|
|  |  |  | height:  calc(100vh - 690px); | 
|---|
|  |  |  | //  height: 284px; | 
|---|
|  |  |  | margin-bottom: 20px; | 
|---|
|  |  |  | .content_left_item1_head { | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .content_left_item1_content { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | height: 246px; | 
|---|
|  |  |  | height: calc(100% - 36px); | 
|---|
|  |  |  | padding: 20px; | 
|---|
|  |  |  | overflow: hidden; | 
|---|
|  |  |  | box-sizing: border-box; | 
|---|
|  |  |  | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | align-items: center; | 
|---|
|  |  |  | justify-content: space-between; | 
|---|
|  |  |  | margin-bottom: 13px; | 
|---|
|  |  |  | // margin-bottom: 13px; | 
|---|
|  |  |  | padding: 7px 0; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | &:last-child { | 
|---|
|  |  |  | margin: 0; | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .main_container { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | height: calc(100% - 35px); | 
|---|
|  |  |  | height: calc(100% - 38px); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .scroll_container { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | &:nth-child(5) { | 
|---|
|  |  |  | flex: 3; | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | .content_center_bottom { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | // height: 284px; | 
|---|
|  |  |  | height:  calc(100vh - 700px); | 
|---|
|  |  |  | height:  calc(100vh - 690px); | 
|---|
|  |  |  | flex: 2; | 
|---|
|  |  |  | .content_center_bottom_head { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | // height: 284px; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | height:  calc(100vh - 700px); | 
|---|
|  |  |  | height:  calc(100vh - 690px); | 
|---|
|  |  |  | .content_right_bottom_head { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | height: 38px; | 
|---|