使用柱状图展示数据分布；历史数据中使用圆点标识，提高散点数据的表达性；修改属性中的单位显示；新增一些样式属性

src/app/OlMap/Controls/Toolbar.tsx

@@ -410,17 +410,18 @@ const Toolbar: React.FC<ToolbarProps> = ({
     const properties = highlightFeature.getProperties();
     // 计算属性字段，增加 key 字段
     const pipeComputedFields = [
-      { key: "flow", label: "流量", unit: "m³/s" },
+      { key: "flow", label: "流量", unit: "m³/h" },
       { key: "friction", label: "摩阻", unit: "" },
       { key: "headloss", label: "水头损失", unit: "m" },
+      { key: "headlossPerKM", label: "单位水头损失", unit: "m/km" },
       { key: "quality", label: "水质", unit: "mg/L" },
-      { key: "reaction", label: "反应", unit: "1/s" },
+      { key: "reaction", label: "反应", unit: "1/d" },
       { key: "setting", label: "设置", unit: "" },
       { key: "status", label: "状态", unit: "" },
       { key: "velocity", label: "流速", unit: "m/s" },
     ];
     const nodeComputedFields = [
-      { key: "actualdemand", label: "实际需水量", unit: "m³/s" },
+      { key: "actualdemand", label: "实际需水量", unit: "m³/h" },
       { key: "head", label: "水头", unit: "m" },
       { key: "pressure", label: "压力", unit: "m" },
       { key: "quality", label: "水质", unit: "mg/L" },