gasInjection-project/src/views/vent/monitorManager/fanLocalMonitor/components/fanlocal-echart-line.vue

<template>
    <div class="alarm-history">
        <BarAndLine class="echarts-line" xAxisPropType="time" :dataSource="historyLists" height="90%" width="100%"
            :chartsColumns="chartsColumn" :option="echatsOption" chartsType="listMonitor" />
    </div>
</template>
<script setup lang="ts">
import { onBeforeMount, ref, watch, onMounted, nextTick, defineAsyncComponent, reactive, onUnmounted, inject, unref } from 'vue';
import BarAndLine from '../../../../../components/chart/BarAndLine.vue';
import { echatsOption } from '../fanLocal.data';
const props = defineProps({
    devicekide: {
        type: String,
        default: '',
    },
    historyList: {
        type: Array,
        default: () => {
            return []
        }
    },
    chartsColumns: {
        type: Array,
        default: () => {
            return []
        }
    }
});
let scroll = reactive({
    y: 700,
});
let historyLists = ref<any[]>([])
let chartsColumn = ref<any[]>([])

watch(() => props.historyList, (newH, oldH) => {
    historyLists.value = newH
},
    { immediate: true })
watch(() => props.chartsColumns, (newC, oldC) => {
    chartsColumn.value = newC
}, {
    immediate: true
})


</script>
<style lang="less" scoped>
.alarm-history {
    width: 100%;
    height: 730px;
    position: fixed;
    top: 100px;
}
</style>