| | |
| | | <template> |
| | | <el-dialog :destroy-on-close="true" v-model="isShow" draggable :close-on-click-modal="false" :title="chartValues?.title"> |
| | | <RecordSet chartHeight="30rem" ref="recordSetRef" :data="chartValues"> |
| | | <TimeRange class="flex-0 m-1" @change="timeRangeChange" /> |
| | | <TimeRange ref="timeRangeRef" v-model="queryRange" class="flex-0 m-1" @change="timeRangeChange" /> |
| | | <List class="flex-0 m-1" v-model="stepTime" :data="listData" @change="selectStepChange" /> |
| | | </RecordSet> |
| | | </el-dialog> |
| | |
| | | }); |
| | | |
| | | const recordSetRef = useCompRef(RecordSet); |
| | | const timeRangeRef = useCompRef(TimeRange); |
| | | |
| | | const listData = { |
| | | list: [ |
| | |
| | | |
| | | const queryRange = ref<string[]>(null); |
| | | const timeRangeChange = (val) => { |
| | | queryRange.value = val; |
| | | setChartData(queryRange.value); |
| | | setChartData(); |
| | | }; |
| | | |
| | | const selectStepChange = (val) => { |
| | | setChartData(queryRange.value); |
| | | setChartData(); |
| | | }; |
| | | const stepTime = ref('5 minutes'); |
| | | const chartValues = ref(null); |
| | | const setChartData = async (timeRange: string[]) => { |
| | | const setChartData = async () => { |
| | | const res = await queryScadaTimeValues({ |
| | | // 设备类型 |
| | | ptype: props.otype, |
| | | // 设备名称 |
| | | pname: props.oname, |
| | | otype: props.indexName, |
| | | start_time: timeRange[0], |
| | | end_time: timeRange[1], |
| | | start_time: timeRangeRef.value.formatDateValue[0], |
| | | end_time: timeRangeRef.value.formatDateValue[1], |
| | | step_time: stepTime.value, |
| | | }); |
| | | chartValues.value = res.values; |
| | |
| | | return; |
| | | } |
| | | queryRange.value = getRecentDateRange(1).map((item) => formatDate(item)); |
| | | setChartData(queryRange.value); |
| | | nextTick(()=>{ |
| | | setChartData(); |
| | | |
| | | }) |
| | | } |
| | | ); |
| | | </script> |