159 lines
3.6 KiB
Vue
159 lines
3.6 KiB
Vue
<!--
|
|
* @FilePath: \daping\src\views\InPlantProducts\child\bottom.vue
|
|
* @Author: 王路平
|
|
* @文件版本: V1.0.0
|
|
* @Date: 2023-02-16 11:30:31
|
|
* @Description:
|
|
*
|
|
* 版权信息 : 2023 by ${再登软件}, All Rights Reserved.
|
|
-->
|
|
|
|
<template>
|
|
<div class="content-left">
|
|
<el-row>
|
|
<el-col :span="8">
|
|
<remarks ref="remarksRef"></remarks>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<bottomtip ref="bottomtip1"> </bottomtip>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<sensor ref="sensorRef"></sensor>
|
|
</el-col>
|
|
</el-row>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { onMounted, reactive, ref, watch } from "vue";
|
|
import { calcWH } from "@/components/ts/selfAdaption";
|
|
import bottomtip from "./component/bottomtip.vue";
|
|
import remarks from "./component/remarks.vue";
|
|
import sensor from "./component/sensor.vue";
|
|
// import detail1 from './component/Details.vue'
|
|
// import { getnoiseData } from "@/http/environment";
|
|
// import { getnoiseData } from "@/http/generalEnvironment";
|
|
import {gettime} from "@/utils/time"
|
|
import { useInPlantProductsStore } from "@/store/module/InPlantProducts";
|
|
const store = useInPlantProductsStore();
|
|
let props = defineProps<{
|
|
width: number;
|
|
height: number;
|
|
}>();
|
|
|
|
watch(
|
|
() => props,
|
|
(newVal, oldVal) => {
|
|
//监听父组件宽高变化，随时重置本组件尺寸
|
|
reset(newVal);
|
|
},
|
|
{ immediate: true, deep: true, flush: "post" }
|
|
);
|
|
watch(
|
|
() => store.DeviceSensorinfo,
|
|
(newVal, oldVal) => {
|
|
//动态更新echarts
|
|
setdata(newVal);
|
|
},
|
|
{ deep: true, flush: "post" }
|
|
);
|
|
watch(
|
|
() => store.DeviceInfo,
|
|
(newVal, oldVal) => {
|
|
//动态更新echarts
|
|
remarksRef.value.setData(newVal.remarkInformation);
|
|
},
|
|
{ deep: true, flush: "post" }
|
|
);
|
|
|
|
//内容dom-------------------------
|
|
let remarksRef = ref();
|
|
let sensorRef = ref();
|
|
let bottomtip1 = ref();
|
|
|
|
// let originRef=ref()
|
|
// let detailsRef=ref()
|
|
|
|
//---------------------------
|
|
|
|
//---------------------------
|
|
|
|
function reset(val: any) {
|
|
//宽高为0时跳出该方法
|
|
if (!val.width && !val.height) return;
|
|
remarksBox(val.width, val.height);
|
|
// detailsBox(val.width,val.height)
|
|
}
|
|
|
|
const remarksBox = (width: any, height: any) => {
|
|
let a = calcWH(height, width, 1, 3, 0);
|
|
|
|
// a.oHeight=a.oHeight
|
|
//修改高度
|
|
remarksRef.value.setchartWH(a.oWidth, a.oHeight);
|
|
sensorRef.value.setchartWH(a.oWidth, a.oHeight);
|
|
bottomtip1.value.setchartWH(a.oWidth, a.oHeight);
|
|
};
|
|
|
|
function setdata(val: any) {
|
|
|
|
bottomtip1.value.setData(
|
|
reactive({name:val.name,severror:val.severror,Timestamp:val.Timestamp?gettime(val.Timestamp-0):'----.--.--',Alarlmnformation:val.Alarlmnformation})
|
|
)
|
|
sensorRef.value.setData(
|
|
reactive([
|
|
{
|
|
name: "剪刀回位",
|
|
status: val.ScissorsReturn,
|
|
},
|
|
{
|
|
name: "启动按钮",
|
|
status: val.StartButton1,
|
|
},
|
|
{
|
|
name: "暂停按钮",
|
|
status: val.PauseButton1,
|
|
},
|
|
{
|
|
name: "主框架x零位",
|
|
status: val.MFrameX_Z,
|
|
},
|
|
{
|
|
name: "主框架y零位",
|
|
status: val.MFrameY_Z,
|
|
},
|
|
{
|
|
name: "点动按钮",
|
|
status: val.JogButton1,
|
|
},
|
|
{
|
|
name: "主框架x负限位",
|
|
status: val.MFrameX_N,
|
|
},
|
|
{
|
|
name: "主框架y负限位",
|
|
status: val.MFrameY_N,
|
|
},
|
|
{
|
|
name: "主框架x正限位",
|
|
status: val.MFrameX_P,
|
|
},
|
|
{
|
|
name: "主框架y正限位",
|
|
status: val.MFrameY_P,
|
|
},
|
|
])
|
|
);
|
|
}
|
|
onMounted(() => {
|
|
// getnoiseDatafun()
|
|
// setdata()
|
|
});
|
|
</script>
|
|
|
|
<style scope>
|
|
.content-left {
|
|
width: 100%;
|
|
}
|
|
</style>
|