Commit 1dd41d16cfc5252647f4165258a80733d156f81b
1 parent
2d6c34c6
feat: report export add not fond data placeholder
Showing
1 changed file
with
19 additions
and
2 deletions
| ... | ... | @@ -39,7 +39,12 @@ |
| 39 | 39 | </Select> |
| 40 | 40 | </div> |
| 41 | 41 | <div> |
| 42 | - <div :id="`chart-${item.device}`" :style="{ height, width }"></div> | |
| 42 | + <Empty v-show="notFoundData" /> | |
| 43 | + <div | |
| 44 | + v-show="!notFoundData" | |
| 45 | + :id="`chart-${item.device}`" | |
| 46 | + :style="{ height, width }" | |
| 47 | + ></div> | |
| 43 | 48 | </div> |
| 44 | 49 | </div> |
| 45 | 50 | </div> |
| ... | ... | @@ -58,7 +63,7 @@ |
| 58 | 63 | import { exportViewChartApi } from '/@/api/export/exportManager'; |
| 59 | 64 | import moment from 'moment'; |
| 60 | 65 | import { ExecuteReportRecord } from '/@/api/export/model/exportModel'; |
| 61 | - import { Select, Spin } from 'ant-design-vue'; | |
| 66 | + import { Select, Spin, Empty } from 'ant-design-vue'; | |
| 62 | 67 | |
| 63 | 68 | interface ResponsData { |
| 64 | 69 | attr: string; |
| ... | ... | @@ -84,6 +89,8 @@ |
| 84 | 89 | { device: string; name: string; attributes: string[]; active?: string }[] |
| 85 | 90 | >([]); |
| 86 | 91 | |
| 92 | + const notFoundData = ref(false); | |
| 93 | + | |
| 87 | 94 | const chartsInstance = shallowReactive<{ [key: string]: echarts.ECharts }>({}); |
| 88 | 95 | //生成随机颜色 |
| 89 | 96 | let getRandomColor = function () { |
| ... | ... | @@ -149,6 +156,7 @@ |
| 149 | 156 | }; |
| 150 | 157 | |
| 151 | 158 | const result = await exportViewChartApi(device, sendParams); |
| 159 | + validateHasData(result); | |
| 152 | 160 | const { xAxisData, series } = getChartsOption(result as unknown as ResponsData); |
| 153 | 161 | |
| 154 | 162 | await nextTick(); |
| ... | ... | @@ -249,6 +257,7 @@ |
| 249 | 257 | try { |
| 250 | 258 | loading.value = true; |
| 251 | 259 | const result = await exportViewChartApi(device, sendParams); |
| 260 | + validateHasData(result); | |
| 252 | 261 | const { xAxisData, series } = getChartsOption(result as unknown as ResponsData); |
| 253 | 262 | |
| 254 | 263 | chartsInstance[device].setOption({ |
| ... | ... | @@ -261,6 +270,14 @@ |
| 261 | 270 | } |
| 262 | 271 | }; |
| 263 | 272 | |
| 273 | + const validateHasData = (record: Recordable) => { | |
| 274 | + notFoundData.value = false; | |
| 275 | + const { val = [], attr } = (record as unknown as ResponsData) || {}; | |
| 276 | + if (!attr || !val.length) { | |
| 277 | + notFoundData.value = true; | |
| 278 | + } | |
| 279 | + }; | |
| 280 | + | |
| 264 | 281 | const handleChangeChars = (value: string, device: string) => { |
| 265 | 282 | renderCharts(device, value); |
| 266 | 283 | }; | ... | ... |