Jelajahi Sumber

图表数据量控制

zhuth 6 tahun lalu
induk
melakukan
47d32ee5b8

+ 8 - 1
src/components/chartDesigner/sections/barConfigForm.jsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { Form, Select, Tag, Cascader, Dropdown, Menu } from 'antd'
+import { Form, Select, Tag, Cascader, Dropdown, Menu, InputNumber } from 'antd'
 import { connect } from 'dva'
 import GAUGE from './gauge.json'
 import GRANULARITY from './granularity.json'
@@ -181,6 +181,13 @@ const BarConfigForm = ({ autoRefresh, chartDesigner, dispatch, formItemLayout })
 					})}
 				</Select>
 			</FormItem>
+			<FormItem label='阈值' {...formItemLayout}>
+				<InputNumber min={0} defaultValue={chartDesigner.barConfig.threshold} onBlur={(e) => {
+					if(chartDesigner.barConfig.threshold !== e.target.value) {
+						dispatch({ type: 'chartDesigner/changeField', name: 'barConfig', value: { ...chartDesigner.barConfig, threshold: e.target.value }, autoRefresh });
+					}
+				}}/>
+			</FormItem>
 		</Form>
 	);
 }

+ 8 - 1
src/components/chartDesigner/sections/lineConfigForm.jsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { Form, Select, Tag, Cascader, Dropdown, Menu } from 'antd'
+import { Form, Select, Tag, Cascader, Dropdown, Menu, InputNumber  } from 'antd'
 import { connect } from 'dva'
 import '../../../models/chartDesigner'
 import GAUGE from './gauge.json'
@@ -180,6 +180,13 @@ const LineConfigForm = ({ autoRefresh, chartDesigner, dispatch, formItemLayout }
 					})}
 				</Select>
 			</FormItem>
+			<FormItem label='阈值' {...formItemLayout}>
+				<InputNumber min={0} defaultValue={chartDesigner.lineConfig.threshold} onBlur={(e) => {
+					if(chartDesigner.lineConfig.threshold !== e.target.value) {
+						dispatch({ type: 'chartDesigner/changeField', name: 'lineConfig', value: { ...chartDesigner.lineConfig, threshold: e.target.value }, autoRefresh });
+					}
+				}}/>
+			</FormItem>
 		</Form>
 	);
 }

+ 8 - 1
src/components/chartDesigner/sections/pieConfigForm.jsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { Form, Tag, Cascader, Dropdown, Menu } from 'antd'
+import { Form, Tag, Cascader, Dropdown, Menu, InputNumber } from 'antd'
 import { connect } from 'dva'
 import '../../../models/chartDesigner'
 import GAUGE from './gauge.json'
@@ -162,6 +162,13 @@ const PieConfigForm = ({ autoRefresh, chartDesigner, dispatch, formItemLayout })
 				>
 				</Cascader>
 			</FormItem>
+			<FormItem label='阈值' {...formItemLayout}>
+				<InputNumber min={0} defaultValue={chartDesigner.pieConfig.threshold} onBlur={(e) => {
+					if(chartDesigner.pieConfig.threshold !== e.target.value) {
+						dispatch({ type: 'chartDesigner/changeField', name: 'pieConfig', value: { ...chartDesigner.pieConfig, threshold: e.target.value }, autoRefresh });
+					}
+				}}/>
+			</FormItem>
 		</Form>
 	);
 }

+ 8 - 1
src/components/chartDesigner/sections/scatterConfigForm.jsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { Form, Select, Tag, Cascader, Dropdown, Menu } from 'antd'
+import { Form, Select, Tag, Cascader, Dropdown, Menu, InputNumber } from 'antd'
 import { connect } from 'dva'
 import GAUGE from './gauge.json'
 const FormItem = Form.Item
@@ -181,6 +181,13 @@ const ScatterConfigForm = ({ autoRefresh, chartDesigner, dispatch, formItemLayou
 					})}
 				</Select>
 			</FormItem>
+			<FormItem label='阈值' {...formItemLayout}>
+				<InputNumber min={0} defaultValue={chartDesigner.scatterConfig.threshold} onBlur={(e) => {
+					if(chartDesigner.scatterConfig.threshold !== e.target.value) {
+						dispatch({ type: 'chartDesigner/changeField', name: 'scatterConfig', value: { ...chartDesigner.scatterConfig, threshold: e.target.value }, autoRefresh });
+					}
+				}}/>
+			</FormItem>
 		</Form>
 	);
 }

+ 12 - 29
src/models/chartDesigner.js

@@ -43,10 +43,10 @@ export default {
             baseConfig: { dataSource: { code: '' }, viewType: '' },
             aggregateTableConfig: { targetColumn: {}, statistics: [], groupBy: [] },
             dataViewConfig: { viewColumns: [], sortColumn: {key: ''}, sortType: 'asc' },
-            barConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} }, groupBy: {key:''} },
-            lineConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} }, groupBy: {key:''} },
-            pieConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} } },
-            scatterConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} }, groupBy: {key:''} },
+            barConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} }, groupBy: {key:''}, threshold: 1000 },
+            lineConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} }, groupBy: {key:''}, threshold: 1000 },
+            pieConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} }, threshold: 1000 },
+            scatterConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} }, groupBy: {key:''}, threshold: 1000 },
             styleConfig: { visibleIndex: true },
             otherConfig:{},
             description: '',
@@ -169,12 +169,10 @@ export default {
                     chartConfig: '{}',
                     chartType: '',
                 };
-                console.log('快速新增图表', body);
                 const res = yield call(service.fetch, {
                     url: URLS.CHART_ADD,
                     body: body
                 })
-                console.log('快速新增图表', body, res);
                 if(!res.err && res.data.data > 0) {
                     yield put({ type: 'chart/fetchList', mandatory: true });
                     yield put({ type: 'main/redirect', path: '/chart/' + res.data.data });
@@ -183,7 +181,6 @@ export default {
                     message.error('新增失败: ' + (res.err || res.data.msg));
                 }
             }catch(e) {
-                console.error(e);
                 message.error('新增失败: ' + e);
             }
         },
@@ -234,7 +231,6 @@ export default {
                     url: URLS.CHART_ADD,
                     body: body
                 })
-                console.log('复制新增', body, res);
                 if(!res.err && res.data.code > 0) {
                     yield put({ type: 'chart/fetchList', mandatory: true });
                     yield put({ type: 'main/redirect', path: '/chart/' + res.data.data , reload: true});
@@ -242,7 +238,6 @@ export default {
                     message.error('创建副本失败: ' + (res.err || res.data.msg));
                 }
             }catch(e) {
-                console.error(e);
                 message.error('创建副本失败: ' + e);
             }
         },
@@ -253,7 +248,6 @@ export default {
                     url: URLS.DATASOURCE_QUERY_DATACOLUMNS,
                     body: code
                 });
-                console.log('获得图表关联数据源列数据', code, res);
                 if(!res.err && res.data.code > 0) {
                     let resData = res.data.data;
 
@@ -349,7 +343,8 @@ export default {
                         columnRename: barConfig.yAxis.column.value,
                         showDataType: barConfig.yAxis.gauge.value
                     },
-                    filters: getBodyFilters(filters)
+                    filters: getBodyFilters(filters),
+                    maxCount: barConfig.threshold
                 };
                 
                 let res = yield call(service.fetch, {
@@ -386,16 +381,15 @@ export default {
                         columnName: pieConfig.yAxis.column.label,
                         showDataType: pieConfig.yAxis.gauge.value
                     },
-                    filters: getBodyFilters(filters)
+                    filters: getBodyFilters(filters),
+                    maxCount: pieConfig.threshold
                 };
 
-                console.log('请求饼图数据', body);
                 let res = yield call(service.fetch, {
                     url: URLS.CHART_PIE_OPTION,
                     body: body,
                     timeout: 30000
                 });
-                console.log('请求饼图数据', body, res);
                 if(!res.err && res.data.code > 0) {
                     let option = parseChartOption('pie', res.data.data, pieConfig);
                     yield put({ type: 'silentSetField', name: 'chartOption', value: option });
@@ -405,7 +399,6 @@ export default {
                 }
                 yield put({ type: 'silentSetField', name: 'fetchConfig', value: body });
             }catch(e) {
-                console.error(e);
                 yield put({ type: 'silentSetField', name: 'chartOption', value: {} });
                 message.error('请求饼图数据失败: ' + e);
             }
@@ -425,7 +418,8 @@ export default {
                         showDataType: lineConfig.yAxis.gauge.value
                     },
                     groups: lineConfig.groupBy && lineConfig.groupBy.key ? [lineConfig.groupBy.key] : [],
-                    filters: getBodyFilters(filters)
+                    filters: getBodyFilters(filters),
+                    maxCount: lineConfig.threshold
                 };
 
                 let res = yield call(service.fetch, {
@@ -461,16 +455,15 @@ export default {
                         showDataType: scatterConfig.yAxis.gauge.value
                     },
                     groups: scatterConfig.groupBy && scatterConfig.groupBy.key ? [scatterConfig.groupBy.key] : [],
-                    filters: getBodyFilters(filters)
+                    filters: getBodyFilters(filters),
+                    maxCount: scatterConfig.threshold
                 };
 
-                console.log('请求散点图数据', body);
                 let res = yield call(service.fetch, {
                     url: URLS.CHART_SCATTER_OPTION,
                     body: body,
                     timeout: 30000
                 });
-                console.log('请求散点图数据', body, res);
                 if(!res.err && res.data.code > 0) {
                     let option = parseChartOption('scatter', res.data.data, scatterConfig);
                     yield put({ type: 'silentSetField', name: 'chartOption', value: option });
@@ -480,7 +473,6 @@ export default {
                 }
                 yield put({ type: 'silentSetField', name: 'fetchConfig', value: body });
             }catch(e) {
-                console.error(e);
                 yield put({ type: 'silentSetField', name: 'chartOption', value: {} });
                 message.error('请求散点图数据失败: ' + e);
             }
@@ -502,13 +494,11 @@ export default {
                     }
                 };
 
-                console.log('请求表格数据', body);
                 let res = yield call(service.fetch, {
                     url: URLS.CHART_DATAVIEW_OPTION,
                     body: body,
                     timeout: 30000
                 });
-                console.log('请求表格数据', body, res);
                 if(!res.err && res.data.code > 0) {
                     let option = parseChartOption('dataView', res.data.data, dataViewConfig);
                     yield put({ type: 'silentSetField', name: 'chartOption', value: option });
@@ -518,7 +508,6 @@ export default {
                 }
                 yield put({ type: 'silentSetField', name: 'fetchConfig', value: body });
             }catch(e) {
-                console.error(e);
                 yield put({ type: 'silentSetField', name: 'chartOption', value: {} });
                 message.error('请求列表数据失败: ' + e);
             }
@@ -541,13 +530,11 @@ export default {
                     }
                 };
 
-                console.log('获得总体统计数据', body);
                 let res = yield call(service.fetch, {
                     url: URLS.CHART_AGGREGATETABLE_OPTION,
                     body: body,
                     timeout: 30000
                 });
-                console.log('获得总体统计数据', body, res);
                 if(!res.err && res.data.code > 0) {
                     let option = parseChartOption('aggregateTable', res.data.data, aggregateTableConfig);
                     yield put({ type: 'silentSetField', name: 'chartOption', value: option });
@@ -557,7 +544,6 @@ export default {
                 }
                 yield put({ type: 'silentSetField', name: 'fetchConfig', value: body });
             }catch(e) {
-                console.error(e);
                 yield put({ type: 'silentSetField', name: 'chartOption', value: {} });
                 message.error('请求统计数据失败: ' + e);
             }
@@ -691,13 +677,11 @@ export default {
                 };
 
                 yield put({ type: 'dataList/setField', name: 'loading', value: true });
-                console.log('请求数据列表', body);
                 let res = yield call(service.fetch, {
                     url: URLS.CHART_DATAVIEW_OPTION,
                     body: body,
                     timeout: 30000
                 });
-                console.log('请求数据列表', body, res);
                 if(!res.err && res.data.code > 0) {
 
                     const { valueList } = res.data.data;
@@ -714,7 +698,6 @@ export default {
                     // yield put({ type: 'silentSetField', name: 'chartOption', value: {} });
                 }
             }catch(e) {
-                console.error(e);
                 message.error('请求数据列表失败: ' + e);
             }finally {
                 yield put({ type: 'dataList/setField', name: 'loading', value: false });