118 lines
2.8 KiB
Vue
118 lines
2.8 KiB
Vue
<!--
|
|
* @FilePath: \code\gitscreenFront\src\views\Mechanics\components\scrollBoard.vue
|
|
* @Author: 王路平
|
|
* @文件版本: V1.0.0
|
|
* @Date: 2023-06-13 08:33:37
|
|
* @Description:
|
|
*
|
|
* 版权信息 : 2023 by ${再登软件}, All Rights Reserved.
|
|
-->
|
|
<template>
|
|
<div class="box-body">
|
|
<ZdScrollBoard ref="devList" @click="dvClick" :config="prop.config" @mouseover="dvMouseover"
|
|
@mouseend="dvmouseleave" :style="{
|
|
width: '100%',
|
|
height: '100%',
|
|
}" />
|
|
<el-tooltip v-model:visible="visible" :content="tipcontent" placement="top" effect="light" trigger="click"
|
|
popper-class="tooltip-class" virtual-triggering :virtual-ref="triggerRef" />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang='ts'>
|
|
import { getCurrentInstance, onMounted, reactive, ref } from "vue";
|
|
import ZdScrollBoard from "@/components/data-view/index.vue";
|
|
import { useRouter } from "vue-router"
|
|
import { useI18n } from 'vue-i18n'
|
|
let { t } = useI18n();
|
|
const prop = defineProps({
|
|
config: Object,
|
|
})
|
|
const router = useRouter()
|
|
//弹窗文本
|
|
let tipcontent = ref(null)
|
|
//弹窗显示与隐藏
|
|
let visible = ref(false)
|
|
//存储弹窗dom
|
|
let triggerRef = ref(null)
|
|
/**
|
|
* @函数功能: 鼠标移入组件方法
|
|
* @param {*} value
|
|
* @出口参数:
|
|
* @函数备注:
|
|
*/
|
|
const dvMouseover = (value) => {
|
|
if (value.toElement && value.toElement.innerHTML && value.toElement.className == 'ceil') {
|
|
triggerRef.value = value.toElement
|
|
tipcontent.value = value.toElement.innerText
|
|
visible.value = true
|
|
}
|
|
|
|
};
|
|
/**
|
|
* 点击表格事件
|
|
*/
|
|
const dvClick = (value) => {
|
|
if (value.row) {
|
|
let id = {
|
|
'精加车间': 1,
|
|
'机加车间': 2,
|
|
'大件车间': 3,
|
|
'精饰车间': 4,
|
|
'焊接车间': 5,
|
|
}
|
|
|
|
prop.config.rawData.forEach((res, index) => {
|
|
|
|
if (index == value.row[0] - 1) {
|
|
router.push({
|
|
name: "Mechanicsson",
|
|
params: {
|
|
id: id[value.row[2]],
|
|
dev: res.id
|
|
},
|
|
});
|
|
}
|
|
});
|
|
}
|
|
|
|
}
|
|
/**
|
|
* @函数功能: 鼠标移出组件方法
|
|
* @出口参数:
|
|
* @函数备注:
|
|
*/
|
|
const dvmouseleave = () => {
|
|
triggerRef.value = null
|
|
tipcontent.value = null
|
|
visible.value = false
|
|
};
|
|
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
.box-body {
|
|
width: 100%;
|
|
height: 100%;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
justify-content: space-around;
|
|
align-items: center;
|
|
}
|
|
|
|
:deep(.dv-scroll-board .rows .ceil) {
|
|
overflow: auto;
|
|
white-space: pre-wrap;
|
|
text-overflow: none
|
|
}
|
|
|
|
:deep(.dv-scroll-board .rows .row-item) {
|
|
font-size: 16px;
|
|
}
|
|
</style>
|
|
<style>
|
|
.el-popper.tooltip-class {
|
|
color: #fff !important;
|
|
}
|
|
</style> |