@zgfe/business-lib 1.0.0-beta.6 → 1.0.3

package/es/chart/util/formatOption.d.ts

@@ -2,4 +2,5 @@ declare const tooltipFormatterDefault: (params: any) => string;
 declare const yAxisFormatterDefault: (value: number) => string;
 declare const xAxisFormatterDefault: (value: string) => string;
 declare const mapTooltipFormatter: (params: any) => string | undefined;
-export { tooltipFormatterDefault, xAxisFormatterDefault, yAxisFormatterDefault, mapTooltipFormatter, };
+declare const legendFormatterDefault: (label: string) => string;
+export { tooltipFormatterDefault, xAxisFormatterDefault, yAxisFormatterDefault, mapTooltipFormatter, legendFormatterDefault, };

package/es/chart/util/formatOption.js

@@ -1,18 +1,24 @@
 import util from '../../utils/util';
+var maxLength = 20;
 
 var tooltipFormatterDefault = function tooltipFormatterDefault(params) {
   var xDate = params[0].name;
   var xLabel = xDate;
+  var lengthReg = new RegExp('\\S{1,' + maxLength + '}', 'g');
 
   if (/^\d{4}-\d{2}-\d{2}$/.test(xLabel)) {
-    // 处理日期
     xLabel = xLabel.replace(/\d{4}-/, '');
+  } else if (/^\d{4}-\d{2}-\d{2}\|\d{4}-\d{2}-\d{2}$/.test(xLabel)) {
+    var dates = xLabel.match(/\d{4}-\d{2}-\d{2}/g);
+    xLabel = dates[0].replace(/\d{4}-/, '') + '~' + dates[1].replace(/\d{4}-/, '');
+  } else {
+    xLabel = (xLabel.match(lengthReg) || []).join('<br/>');
   }
 
   var htmlArray = [];
 
   if (params.length > 1) {
-    htmlArray.push("<span class=\"biz-chart-tooltip-title\">".concat(xLabel, "</span>"));
+    htmlArray.push("<div class=\"biz-chart-tooltip-title\">".concat(xLabel, "</div>"));
   }
 
   params.forEach(function (item) {
@@ -24,7 +30,8 @@ var tooltipFormatterDefault = function tooltipFormatterDefault(params) {
       lineLabel = util.toThousands(lineLabel);
     }
 
-    htmlArray.push("<div class=\"biz-chart-tooltip-item\"><span class=\"biz-chart-tooltip-content\">".concat(item.marker).concat(params.length > 1 ? item.seriesName : item.name, ":</span> <span class=\"biz-chart-tooltip-value\">").concat(lineLabel, "</span></div>"));
+    var name = (params.length > 1 ? item.seriesName : item.name).trim();
+    htmlArray.push("<div class=\"biz-chart-tooltip-item\">\n          <span class=\"biz-chart-tooltip-content\">\n              <span class=\"biz-tooltip-marker\" style=\"background:".concat(item.color, "\"></span>").concat(name, "\n          </span> \n          <span class=\"biz-chart-tooltip-value\">").concat(lineLabel, "</span>\n        </div>"));
   });
   return htmlArray.join('');
 };
@@ -39,10 +46,8 @@ var yAxisFormatterDefault = function yAxisFormatterDefault(value) {
 
 var xAxisFormatterDefault = function xAxisFormatterDefault(value) {
   if (/^\d{4}-\d{2}-\d{2}$/.test(value)) {
-    // 处理日期
     return value.replace(/\d{4}-/, '');
   } else if (/^\d{4}-\d{2}-\d{2}\|\d{4}-\d{2}-\d{2}$/.test(value)) {
-    // 周、月日期
     var dates = value.match(/\d{4}-\d{2}-\d{2}/g);
     return dates ? dates[0].replace(/\d{4}-/, '') + '~' + dates[1].replace(/\d{4}-/, '') : value;
   } else {
@@ -59,7 +64,6 @@ var xAxisFormatterDefault = function xAxisFormatterDefault(value) {
 };
 
 var mapTooltipFormatter = function mapTooltipFormatter(params) {
-  console.log('t00l>>', params);
   if (params.data === null || params.data === undefined) return;
   var data = params.data;
 
@@ -67,7 +71,7 @@ var mapTooltipFormatter = function mapTooltipFormatter(params) {
     var series = [];
     var childrenOptions = data.childrenOptions;
     childrenOptions.forEach(function (option) {
-      var label = option.name || option.names.join('-');
+      var label = option.name || option.names.join(',');
       var value = option.value || option.values;
 
       if (util.isArray(value)) {
@@ -85,7 +89,16 @@ var mapTooltipFormatter = function mapTooltipFormatter(params) {
     dataValue = dataValue[dataValue.length - 1];
   }
 
-  return "<div class=\"biz-chart-tooltip-item\"><span class=\"biz-chart-tooltip-content\">".concat(data.name || data.names.join('-'), ": </span><span style=\"color:#66ccff;\">").concat(util.toThousands(dataValue), "</span></div>");
+  return "<div class=\"biz-chart-tooltip-item\"><span class=\"biz-chart-tooltip-content\">".concat(data.name || data.names.join(','), ": </span><span style=\"color:#66ccff;\">").concat(util.toThousands(dataValue), "</span></div>");
+};
+
+var legendFormatterDefault = function legendFormatterDefault(label) {
+  return util.strMiddleSplit(label, {
+    maxLength: maxLength,
+    beginLength: maxLength / 2 - 2,
+    endLength: maxLength / 2 - 2,
+    replaceStr: '...'
+  });
 };
 
-export { tooltipFormatterDefault, xAxisFormatterDefault, yAxisFormatterDefault, mapTooltipFormatter };
+export { tooltipFormatterDefault, xAxisFormatterDefault, yAxisFormatterDefault, mapTooltipFormatter, legendFormatterDefault };

package/es/chart/util/mapUtil.d.ts

@@ -1,6 +1,6 @@
-import { DataProps, ItemDataProps } from '../type';
-declare const citySeries: (mapStore: DataProps, haveUserGroup: boolean) => ItemDataProps[];
-declare const provinceSeries: (data: DataProps, haveUserGroup?: boolean | undefined) => any;
+import { ChartTypes, ItemDataProps } from '../types';
+declare const citySeries: (data: ChartTypes.Value, haveUserGroup: boolean) => ItemDataProps[];
+declare const provinceSeries: (data: ChartTypes.Value, haveUserGroup?: boolean | undefined) => any;
 declare const maxMinValue: (series: ItemDataProps) => {
     max: number;
     min: number;

package/es/chart/util/mapUtil.js

@@ -22,31 +22,29 @@ import util from '../../utils/util';
 import cityGeoCoord from './data/cityGeoCoord';
 import provinceGeoCoord from './data/provinceGeoCoord';
 
-var citySeries = function citySeries(mapStore, haveUserGroup) {
+var citySeries = function citySeries(data, haveUserGroup) {
   var backGroundMapSeries = {
     type: 'map',
     map: 'china',
     showLegendSymbol: false,
     top: 20,
     bottom: 20,
-    data: [] // 省份着色背景地图数据
-
+    data: []
   };
   var scatterSeries = {
     name: '',
     type: 'scatter',
     coordinateSystem: 'geo',
     symbolSize: 8,
-    data: [] // 城市散点图数据
-
+    data: []
   };
   var provinceMapData = {};
-  mapStore.x_axis.forEach(function (xItem, i) {
+  data.x_axis.forEach(function (xItem, i) {
     scatterSeries.name = xItem;
-    mapStore.series.forEach(function (cityItem) {
+    data.series.forEach(function (cityItem) {
       var cityName = cityItem.names[cityItem.names.length - 1];
       cityName = cityName.replace(/(市|省|自治区)$/, '');
-      var cityCoordObj = cityGeoCoord[cityName]; // 城市坐标对象
+      var cityCoordObj = cityGeoCoord[cityName];
 
       if (cityCoordObj) {
         var cityValue = cityItem.values[i];
@@ -56,10 +54,8 @@ var citySeries = function citySeries(mapStore, haveUserGroup) {
           value: [cityCoordObj.log, cityCoordObj.lat, cityValue],
           childrenOptions: cityItem.userGroupCompareData
         };
-        scatterSeries.data.push(scatterItem); // 计算省份数据，注有用户群对比时，因无法去重，导致省份数据不准，目前省份数据只做颜色区分，不做数据展示，后续产品方案会修改
-
-        var provinceObj = cityCoordObj.province; // 省份坐标对象
-
+        scatterSeries.data.push(scatterItem);
+        var provinceObj = cityCoordObj.province;
         var provinceName = provinceObj ? provinceObj.name.replace(/(省|市)$/, '') : '';
         var currentMapData = provinceMapData[provinceName];
         var currentMapOptions = currentMapData ? currentMapData.childrenOptions : [];
@@ -98,10 +94,7 @@ var provinceSeries = function provinceSeries(data, haveUserGroup) {
       bottom: 20,
       label: {
         show: true,
-        color: '#565656' // formatter: (params: { name: string }) => {
-        //     return params.name.replace(/(市|省|自治区|维吾尔自治区|特别行政区|壮族自治区|回族自治区)$/, '')
-        // }
-
+        color: '#565656'
       },
       showLegendSymbol: false,
       data: []
@@ -115,7 +108,6 @@ var provinceSeries = function provinceSeries(data, haveUserGroup) {
       name = name.replace(/(市|省|自治区)$/, '');
 
       if (provinceCoordObj) {
-        // 过滤json库中不存在的省
         item.data.push({
           name: name,
           isProvince: true,
@@ -160,7 +152,6 @@ var maxMinValue = function maxMinValue(series) {
 
 var formatData = function formatData(seriesData, haveUserGroup) {
   if (haveUserGroup) {
-    // 有用户群时增加userGroupCompareData
     var store = {
       x_axis: seriesData.x_axis,
       series: []
@@ -176,7 +167,6 @@ var formatData = function formatData(seriesData, haveUserGroup) {
           userGroupCompareData: [item]
         };
       } else {
-        // 注：当有用户群对比时，此区域的values粗略计算为各用户群相加之和（此处未去重，因数据不准目前只做颜色展示，后续产品会修改）
         areaObjMap[areaName].values = [areaObjMap[areaName].values[0] + item.values[0]];
         areaObjMap[areaName].userGroupCompareData.push(item);
       }

package/es/commonStyle/icon.less

@@ -76,115 +76,119 @@
   }
 }
 
-.biz-btn,
-.ant-btn {
-  height: auto;
-  padding: 10px 24px;
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 20px;
-  border-radius: 4px;
-  cursor: pointer;
-
-  .anticon {
-    margin-right: 8px;
-    font-size: 24px;
-  }
-}
-
-.biz-btn-primary,
-.ant-btn-primary {
-  color: #fff;
-  background: @themeColor;
-  border: none;
-
-  &:hover,
-  &:active {
-    background: #85adfc;
-  }
-
-  &:focus {
-    background: #1451db;
-  }
-
-  &:disabled {
-    color: @disableColor;
-    background: @grayColor;
-  }
-}
-
-.biz-btn-default,
-.ant-btn-default {
-  color: #242541;
-  background: #f6f6f6;
-  border: none;
-
-  &:hover,
-  &:focus {
-    color: #242541;
-    background: #cacdd4;
-  }
-
-  &:active {
-    color: #242541;
-    background: #94a6ce;
-  }
-
-  &:disabled {
-    color: #cacdd4;
-    background: #f6f6f6;
-  }
-}
-
-.biz-btn-text {
-  color: #021429;
-
-  &:hover {
-    background: #f6f6f6;
-  }
-
-  &:active {
-    background: #cacdd4;
-  }
-
-  &:disabled {
-    color: #cacdd4;
-  }
-}
-
-.biz-btn-line {
-  box-sizing: border-box;
-  color: #5f6085;
-  background: #ffffff;
-  border: 1px solid #ecedf0;
-  border-radius: 4px;
-
-  &:hover {
-    color: #165dff;
-    background: #e8efff;
-    border-color: #165dff;
-  }
-}
-
-.ant-tooltip {
-  .ant-tooltip-inner {
-    border-radius: @boxRadius2;
-  }
-
-  &.biz-tooltip {
-    width: auto;
-
-    .ant-tooltip-inner {
-      padding: 4px;
-      color: @fontColor;
-      background-color: #fff;
-      border-radius: 4px;
-      box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
-    }
-
-    .ant-tooltip-arrow-content {
-      background-color: #fff;
-      --antd-arrow-background-color: #fff;
-    }
-  }
-}
+// .biz-btn,
+// .ant-btn {
+//   height: auto;
+//   padding: 10px 24px;
+//   font-weight: 400;
+//   font-size: 14px;
+//   line-height: 20px;
+//   border-radius: 4px;
+//   cursor: pointer;
+
+//   .anticon {
+//     margin-right: 8px;
+//     font-size: 24px;
+//   }
+
+//   &.small {
+//     padding: 5px 12px;
+//   }
+// }
+
+// .biz-btn-primary,
+// .ant-btn-primary {
+//   color: #fff;
+//   background: @themeColor;
+//   border: none;
+
+//   &:hover,
+//   &:active {
+//     background: #85adfc;
+//   }
+
+//   &:focus {
+//     background: #1451db;
+//   }
+
+//   &:disabled {
+//     color: @disableColor;
+//     background: @grayColor;
+//   }
+// }
+
+// .biz-btn-default,
+// .ant-btn-default {
+//   color: #242541;
+//   background: #f6f6f6;
+//   border: none;
+
+//   &:hover,
+//   &:focus {
+//     color: #242541;
+//     background: #cacdd4;
+//   }
+
+//   &:active {
+//     color: #242541;
+//     background: #94a6ce;
+//   }
+
+//   &:disabled {
+//     color: #cacdd4;
+//     background: #f6f6f6;
+//   }
+// }
+
+// .biz-btn-text {
+//   color: #021429;
+
+//   &:hover {
+//     background: #f6f6f6;
+//   }
+
+//   &:active {
+//     background: #cacdd4;
+//   }
+
+//   &:disabled {
+//     color: #cacdd4;
+//   }
+// }
+
+// .biz-btn-line {
+//   box-sizing: border-box;
+//   color: #5f6085;
+//   background: #ffffff;
+//   border: 1px solid #ecedf0;
+//   border-radius: 4px;
+
+//   &:hover {
+//     color: #165dff;
+//     background: #e8efff;
+//     border-color: #165dff;
+//   }
+// }
+
+// .ant-tooltip {
+//   .ant-tooltip-inner {
+//     border-radius: @boxRadius2;
+//   }
+
+//   &.biz-tooltip {
+//     width: auto;
+
+//     .ant-tooltip-inner {
+//       padding: 4px;
+//       color: @fontColor;
+//       background-color: #fff;
+//       border-radius: 4px;
+//       box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
+//     }
+
+//     .ant-tooltip-arrow-content {
+//       background-color: #fff;
+//       --antd-arrow-background-color: #fff;
+//     }
+//   }
+// }

package/es/commonStyle/select.less

@@ -8,7 +8,7 @@
   flex-wrap: wrap;
   align-items: center;
   box-sizing: border-box;
-  margin-bottom: 12px;
+  margin-bottom: 8px;
   padding: 4px;
   color: #021429;
   border: @boxBorder;