80 lines
2.1 KiB
Vue
80 lines
2.1 KiB
Vue
<!-- 今日工单 -->
|
||
<template>
|
||
<div>
|
||
<div class="title">昨日IPQC列表</div>
|
||
<el-table height="300" :data="dataList" v-loading="loading" ref="tableRef" highlight-current-row @mouseover.native="clearScroll" @mouseleave.native="createScroll">
|
||
<el-table-column prop="lineCode" label="产线" :show-overflow-tooltip="true" />
|
||
<el-table-column prop="defectDesciption" label="描述" :show-overflow-tooltip="true" />
|
||
<el-table-column prop="defectQuantity" label="数量" :show-overflow-tooltip="true" />
|
||
</el-table>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
const { proxy } = getCurrentInstance()
|
||
import { getMoudle05 } from '@/api/smartScreen/QualityScreen/index.js'
|
||
const loading = ref(false)
|
||
const dataList = ref([])
|
||
function getList() {
|
||
getMoudle05().then((res) => {
|
||
const { code, data } = res
|
||
if (code == 200) {
|
||
dataList.value = data
|
||
}
|
||
})
|
||
}
|
||
// 查询
|
||
function handleQuery() {
|
||
getList()
|
||
}
|
||
handleQuery()
|
||
// 自动获取数据
|
||
let timer1 = null
|
||
const clearSearchTimer = () => {
|
||
clearInterval(timer1)
|
||
timer1 = null
|
||
}
|
||
const createSearchTimer = () => {
|
||
clearSearchTimer()
|
||
timer1 = setInterval(() => {
|
||
handleQuery()
|
||
}, 1000 * 60 * 5)
|
||
}
|
||
|
||
// 自动滚动
|
||
let timer2 = null
|
||
let tableRef = ref(null)
|
||
|
||
const clearScroll = () => {
|
||
clearInterval(timer2)
|
||
timer2 = null
|
||
}
|
||
const createScroll = () => {
|
||
clearScroll()
|
||
// 拿到 table
|
||
const _table = tableRef.value.layout.table.refs
|
||
// // 拿到可以滚动的元素
|
||
const tableWrapper = _table.bodyWrapper.firstElementChild.firstElementChild
|
||
timer2 = setInterval(() => {
|
||
tableWrapper.scrollTop += 1
|
||
// 判断是否滚动到底部，如果到底部了置为0（可视高度+距离顶部=整个高度）
|
||
if (tableWrapper.clientHeight + tableWrapper.scrollTop >= tableWrapper.scrollHeight) {
|
||
tableWrapper.scrollTop = 0
|
||
}
|
||
}, 100)
|
||
}
|
||
|
||
onMounted(() => {
|
||
createSearchTimer()
|
||
createScroll()
|
||
})
|
||
onUnmounted(() => {
|
||
clearScroll()
|
||
clearSearchTimer()
|
||
})
|
||
</script>
|
||
|
||
<style scoped>
|
||
@import './table.css';
|
||
</style>
|