为图表添加是否在图表直接显示具体值的选项

msnetc · Jul 6, 2018 · 5f6cd45 · 5f6cd45
1 parent 1ae713d
commit 5f6cd45
Show file tree

Hide file tree

Showing 15 changed files with 180 additions and 8 deletions.
diff --git a/ureport2-console/src/main/resources/ureport-asserts/js/designer.bundle.js b/ureport2-console/src/main/resources/ureport-asserts/js/designer.bundle.js
diff --git a/ureport2-console/src/main/resources/ureport-asserts/js/preview.bundle.js b/ureport2-console/src/main/resources/ureport-asserts/js/preview.bundle.js
diff --git a/ureport2-console/src/main/resources/ureport-asserts/js/searchform.bundle.js b/ureport2-console/src/main/resources/ureport-asserts/js/searchform.bundle.js
diff --git a/ureport2-console/src/main/resources/ureport-asserts/venderjs/Chart.bundle.min.js b/ureport2-console/src/main/resources/ureport-asserts/venderjs/Chart.bundle.min.js
diff --git a/...ort2-console/src/main/resources/ureport-asserts/venderjs/chartjs-plugin-datalabels.min.js b/...ort2-console/src/main/resources/ureport-asserts/venderjs/chartjs-plugin-datalabels.min.js
diff --git a/ureport2-console/src/main/resources/ureport-html/html-preview.html b/ureport2-console/src/main/resources/ureport-html/html-preview.html
@@ -13,6 +13,8 @@
 </style>
  	<script type="text/javascript" src="${contextPath}/ureport/res/ureport-asserts/venderjs/jquery.min.js"></script>
  	<script type="text/javascript" src="${contextPath}/ureport/res/ureport-asserts/venderjs/bootstrap.min.js"></script>
+ 	<script type="text/javascript" src="${contextPath}/ureport/res/ureport-asserts/venderjs/Chart.bundle.min.js"></script>
+ 	<script type="text/javascript" src="${contextPath}/ureport/res/ureport-asserts/venderjs/chartjs-plugin-datalabels.min.js"></script>
  	<script type="text/javascript" src="${contextPath}/ureport/res/ureport-asserts/venderjs/bootstrap-datetimepicker.js"></script>
  	<script type="text/javascript" src="${contextPath}/ureport/res/ureport-asserts/js/preview.bundle.js"></script>
 </head>

diff --git a/ureport2-core/src/main/java/com/bstek/ureport/chart/Chart.java b/ureport2-core/src/main/java/com/bstek/ureport/chart/Chart.java
@@ -27,17 +27,19 @@
 import com.bstek.ureport.chart.dataset.impl.category.BarDataset;
 import com.bstek.ureport.chart.dataset.impl.category.LineDataset;
 import com.bstek.ureport.chart.option.Option;
+import com.bstek.ureport.chart.plugins.Plugin;
 import com.bstek.ureport.model.Cell;
 
 /**
  * @author Jacky.gao
  * @since 2017年6月8日
  */
 public class Chart {
-	private List<Option> options=new ArrayList<Option>();
 	private Dataset dataset;
 	private XAxes xaxes;
 	private YAxes yaxes;
+	private List<Option> options=new ArrayList<Option>();
+	private List<Plugin> plugins=new ArrayList<Plugin>();
 	public ChartData doCompute(Cell cell, Context context){
 		StringBuilder sb=new StringBuilder();
 		sb.append("{");
@@ -55,6 +57,25 @@ public ChartData doCompute(Cell cell, Context context){
 				withoption=true;
 			}
 		}
+		if(plugins!=null && plugins.size()>0) {
+			if(withoption){				
+				sb.append(",");
+			}
+			withoption=true;
+			sb.append("\"plugins\": {");
+			for(Plugin plugin:plugins) {
+				String pluginJson=plugin.toJson(dataset.getType());
+				if(pluginJson!=null) {
+					sb.append(pluginJson);
+				}
+			}
+			sb.append("}");
+		}else {
+			withoption=true;
+			sb.append("\"plugins\": {");
+			sb.append("\"datalabels\":{\"display\":false}");
+			sb.append("}");
+		}
 		if(xaxes!=null || yaxes!=null){
 			if(withoption){
 				sb.append(",");
@@ -117,6 +138,14 @@ public void setOptions(List<Option> options) {
 		this.options = options;
 	}
 
+	public List<Plugin> getPlugins() {
+		return plugins;
+	}
+
+	public void setPlugins(List<Plugin> plugins) {
+		this.plugins = plugins;
+	}
+
 	public Dataset getDataset() {
 		return dataset;
 	}

diff --git a/ureport2-core/src/main/java/com/bstek/ureport/chart/plugins/DataLabelsPlugin.java b/ureport2-core/src/main/java/com/bstek/ureport/chart/plugins/DataLabelsPlugin.java
@@ -0,0 +1,44 @@
+/*******************************************************************************
+ * Copyright 2017 Bstek
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License.  You may obtain a copy
+ * of the License at
+ * 
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.  See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ ******************************************************************************/
+package com.bstek.ureport.chart.plugins;
+/**
+ * @author Jacky.gao
+ * @since 2018年7月6日
+ */
+public class DataLabelsPlugin implements Plugin {
+	private boolean display;
+	@Override
+	public String getName() {
+		return "dataLabels";
+	}
+	@Override
+	public String toJson(String type) {
+		StringBuilder sb=new StringBuilder();
+		sb.append("\"datalabels\":{\"display\":"+display+",");
+		sb.append("\"font\":{");
+		sb.append("\"size\":14,");
+		sb.append("\"weight\":\"bold\"");
+		sb.append("}");
+		sb.append("}");
+		return sb.toString();
+	}
+	public boolean isDisplay() {
+		return display;
+	}
+	public void setDisplay(boolean display) {
+		this.display = display;
+	}
+}
diff --git a/ureport2-core/src/main/java/com/bstek/ureport/chart/plugins/Plugin.java b/ureport2-core/src/main/java/com/bstek/ureport/chart/plugins/Plugin.java
@@ -0,0 +1,24 @@
+/*******************************************************************************
+ * Copyright 2017 Bstek
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License.  You may obtain a copy
+ * of the License at
+ * 
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.  See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ ******************************************************************************/
+package com.bstek.ureport.chart.plugins;
+/**
+ * @author Jacky.gao
+ * @since 2018年7月6日
+ */
+public interface Plugin {
+	String toJson(String type);
+	String getName();
+}
diff --git a/ureport2-core/src/main/java/com/bstek/ureport/parser/impl/value/ChartValueParser.java b/ureport2-core/src/main/java/com/bstek/ureport/parser/impl/value/ChartValueParser.java
@@ -43,6 +43,7 @@
 import com.bstek.ureport.chart.option.impl.AnimationsOption;
 import com.bstek.ureport.chart.option.impl.LegendOption;
 import com.bstek.ureport.chart.option.impl.TitleOption;
+import com.bstek.ureport.chart.plugins.DataLabelsPlugin;
 import com.bstek.ureport.definition.value.ChartValue;
 import com.bstek.ureport.definition.value.Value;
 import com.bstek.ureport.exception.ReportParseException;
@@ -77,6 +78,13 @@ public Value parse(Element element) {
 				chart.setYaxes(yaxes);
 			}else if(name.equals("option")){
 				chart.getOptions().add(parseOption(ele));
+			}else if(name.equals("plugin")) {
+				String pluginName=ele.attributeValue("name");
+				if(pluginName.equals("data-labels")) {					
+					DataLabelsPlugin plugin=new DataLabelsPlugin();
+					plugin.setDisplay(Boolean.valueOf(ele.attributeValue("display")));
+					chart.getPlugins().add(plugin);
+				}
 			}
 		}
 		return value;

diff --git a/ureport2-js/src/Utils.js b/ureport2-js/src/Utils.js
@@ -332,6 +332,10 @@ export function tableToXml(context){
                         cellXml+=`/>`;
                     }
                 }
+                const dataLabels=chart.dataLabels;
+                if(dataLabels){
+                    cellXml+=`<plugin name="data-labels" display="${dataLabels.display}"/>`;
+                }
                 cellXml+=`</chart-value>`;
             }
             const propertyConditions=cellDef.conditionPropertyItems || [];

diff --git a/ureport2-js/src/panel/property/chart/BarChartValueEditor.js b/ureport2-js/src/panel/property/chart/BarChartValueEditor.js
@@ -46,6 +46,7 @@ export default class BarChartValueEditor extends CategoryChartValueEditor{
         optionContent.append(group);
         this.initTitleOption(group);
         this.initLegendOption(group);
+        this.initDataLabelsOption(group);
         this.initAnimationsOption(group);
     }
     _initAxisTab(axisContent){
@@ -103,7 +104,13 @@ export default class BarChartValueEditor extends CategoryChartValueEditor{
         }else{
             this.hideYTitleRadio.trigger('click');
         }
-
+        this.hideDataLabelsRadio.children('input').attr('checked',true);
+        const plugins=chart.plugins || [];
+        for(let plugin of plugins){
+            if(plugin.name==='dataLabels' && plugin.display){
+                this.showDataLabelsRadio.children('input').attr('checked',true);
+            }
+        }
         const options=chart.options || [];
         for(let option of options){
             switch (option.type){

diff --git a/ureport2-js/src/panel/property/chart/ChartValueEditor.js b/ureport2-js/src/panel/property/chart/ChartValueEditor.js
@@ -174,6 +174,34 @@ export default class ChartValueEditor{
             setDirty();
         });
     }
+
+    initDataLabelsOption(container){
+        const _this=this;
+        const dataLabelsGroup=$(`<fieldset style="padding: 10px;border:solid 1px #dddddd;border-radius: 8px;margin-top:10px;margin-bottom: 15px">
+        <legend style="width: auto;margin-bottom: 1px;border-bottom:none;font-size: inherit;color: #4b4b4b;">数据标签配置</legend></fieldset>`);
+        container.append(dataLabelsGroup);
+        const displayGroup=$(`<div class="form-group" style="margin-bottom: 0"><label style="margin-bottom: 15px">${window.i18n.chart.display}</label></div>`);
+        dataLabelsGroup.append(displayGroup);
+        this.showDataLabelsRadio=$(`<label class="checkbox-inline" style="padding-left: 2px"><input type="radio" name="__show_datalabels_radio_${this.id}" value="asc">${window.i18n.chart.yes}</label>`);
+        displayGroup.append(this.showDataLabelsRadio);
+        this.showDataLabelsRadio.children('input').click(function () {
+            const chart=_this.cellDef.value.chart;
+            chart.dataLabels={
+                name:"data-labels",
+                display:true
+            };
+        });
+        this.hideDataLabelsRadio=$(`<label class="checkbox-inline" style="padding-left: 2px"><input type="radio" name="__show_datalabels_radio_${this.id}" value="asc" checked>${window.i18n.chart.no}</label>`);
+        displayGroup.append(this.hideDataLabelsRadio);
+        this.hideDataLabelsRadio.children('input').click(function () {
+            const chart=_this.cellDef.value.chart;
+            chart.dataLabels={
+                name:"data-labels",
+                display:false
+            };
+        });
+    }
+
     initTitleOption(container){
         const _this=this;
         const legendGroup=$(`<fieldset style="padding: 10px;border:solid 1px #dddddd;border-radius: 8px;margin-top:10px;margin-bottom: 15px">

diff --git a/ureport2-js/src/panel/property/chart/ScatterChartValueEditor.js b/ureport2-js/src/panel/property/chart/ScatterChartValueEditor.js
@@ -112,6 +112,7 @@ export default class ScatterChartValueEditor extends CategoryChartValueEditor{
         optionContent.append(group);
         this.initTitleOption(group);
         this.initLegendOption(group);
+        this.initDataLabelsOption(group);
         this.initAnimationsOption(group);
     }
     _initAxisTab(axisContent){

diff --git a/ureport2-js/src/preview.js b/ureport2-js/src/preview.js
@@ -1,9 +1,8 @@
 /**
  * Created by Jacky.Gao on 2017-03-17.
  */
-import Chart from "chart.js";
 import './form/external/bootstrap-datetimepicker.css';
-import {getParameter,pointToMM,showLoading,hideLoading} from './Utils.js';
+import {pointToMM,showLoading,hideLoading} from './Utils.js';
 import {alert} from './MsgBox.js';
 import PDFPrintDialog from './dialog/PDFPrintDialog.js';
 import defaultI18nJsonData from './i18n/preview.json';
@@ -294,7 +293,12 @@ window._buildChartDatas=function(chartData){
     }
     for(let d of chartData){
         let json=d.json;
-        json=JSON.parse(json);
+        json=JSON.parse(json,function (k, v) {
+            if(v.indexOf && v.indexOf('function') > -1){
+                return eval("(function(){return "+v+" })()")
+            }
+            return v;
+        });
         _buildChart(d.id,json);
     }
 };