@zgfe/modules-interval 1.0.0-interval.1 → 1.0.0-interval.10

package/dist/esm/components/eventFilter/index.js

@@ -15,7 +15,7 @@ import React, { useEffect, useRef, useState } from 'react';
 import { BizEventSelector, IconFont, BizAttrConditionGroup } from '@zgfe/business-lib';
 import "./styles/index.less";
 import _ from 'lodash';
-var classPrefix = 'eventfilter-box';
+var classPrefix = 'interval-box';
 var EventFilter = function EventFilter(props) {
   // 筛选条件个数
   var _useState = useState(0),
@@ -31,8 +31,8 @@ var EventFilter = function EventFilter(props) {
   var conditionRef = useRef(null);
   // 当前选中的事件
   var _useState5 = useState({
-      id: -100,
-      name: '事件概览'
+      id: null,
+      name: ''
     }),
     _useState6 = _slicedToArray(_useState5, 2),
     event = _useState6[0],
@@ -105,7 +105,7 @@ var EventFilter = function EventFilter(props) {
     }
   };
   var onChangeEvent = function onChangeEvent(event) {
-    if (event && event.event && event.event.id === -100) {
+    if (event && event.event && event.event.id === null) {
       setEventOverview(false);
     } else {
       setEventOverview(true);
@@ -142,7 +142,7 @@ var EventFilter = function EventFilter(props) {
   return /*#__PURE__*/React.createElement("div", {
     className: classPrefix
   }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(BizEventSelector, {
-    showAllEvent: true,
+    showAllEvent: false,
     showBuiltInTarget: false,
     popupContainer: false,
     defaultSelectAble: false,

package/dist/esm/components/eventFilter/styles/index.less

@@ -1,4 +1,4 @@
-.eventfilter-box {
+.interval-box {
   > :nth-child(1) {
     display: flex;
     display: flex;

package/dist/esm/components/renderContent/index.js

@@ -9,9 +9,9 @@ import React, { useEffect, useState } from 'react';
 import { MiNone, MiSpin } from '..';
 import "./styles/index.less";
 import EventChart from "../../modules/chart";
-var classPrefix = 'render-content';
+var classPrefix = 'render-content-interval';
 var ContentPanel = function ContentPanel(props) {
-  var _eventData$xAxis;
+  var _eventData$appData, _eventData$appData$se;
   var loading = props.loading,
     eventData = props.eventData,
     searchData = props.searchData;
@@ -41,18 +41,15 @@ var ContentPanel = function ContentPanel(props) {
     className: classPrefix
   }, /*#__PURE__*/React.createElement("div", {
     className: "".concat(classPrefix, "-chart-container")
-  }, eventData ? /*#__PURE__*/React.createElement(EventChart, {
-    dataSource: eventData,
-    params: searchData,
-    showList: showList
-  }) : /*#__PURE__*/React.createElement(MiNone, {
-    label: "\u6682\u65E0\u6570\u636E"
-  })), eventData && (_eventData$xAxis = eventData.xAxis) !== null && _eventData$xAxis !== void 0 && _eventData$xAxis.length ? /*#__PURE__*/React.createElement(EventChart, {
+  }, eventData && (_eventData$appData = eventData.appData) !== null && _eventData$appData !== void 0 && (_eventData$appData$se = _eventData$appData.series) !== null && _eventData$appData$se !== void 0 && _eventData$appData$se.length ? /*#__PURE__*/React.createElement(EventChart, {
     type: "grid",
     dataSource: eventData,
     params: searchData,
-    showList: showList,
     onChangeShow: onChangeShow
-  }) : null);
+  }) : /*#__PURE__*/React.createElement("div", {
+    className: "".concat(classPrefix, "-MiNone")
+  }, /*#__PURE__*/React.createElement(MiNone, {
+    label: "\u6682\u65E0\u6570\u636E"
+  }))));
 };
 export default ContentPanel;

package/dist/esm/components/renderContent/styles/index.less

@@ -1,5 +1,4 @@
-
-.render-content {
+.render-content-interval {
   &-chart-container {
     display: flex;
     flex-direction: column;
@@ -14,6 +13,17 @@
     }
   }
 
+  &-MiNone {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 368px;
+    padding: 24px 16px;
+    border: 1px solid #ecedf0;
+    border-radius: 8px;
+  }
+
   &-spin-container {
     display: flex;
     align-items: center;

package/dist/esm/components/searchPanel/index.js

@@ -105,10 +105,15 @@ var SearchPanel = function SearchPanel(props) {
       display: 'flex'
     }
   }, /*#__PURE__*/React.createElement(BizDatePicker, {
-    defaultValue: time,
-    onChange: onChangeTime
+    dateTypeList: ['day', 'week', 'month'],
+    value: time,
+    mode: "simple",
+    includeToday: true,
+    onChange: onChangeTime,
+    selectRange: 365
   }), /*#__PURE__*/React.createElement(BizSelect, {
     multiple: true,
+    disable: displaySetupList.length === 0,
     onChange: onDimensionChange,
     className: "".concat(classPrefix, "-select"),
     placeholder: "\u8BF7\u9009\u62E9\u663E\u793A\u8BBE\u7F6E",

package/dist/esm/components/searchPanel/styles/index.less

@@ -1,4 +1,3 @@
-
 .search-panel {
   display: flex;
   align-items: center;

package/dist/esm/components/table/index.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import 'highlight.js/styles/vs.css';
 import { EventTableProps } from './types';
 import './styles/index.less';
 declare const EventTable: React.FC<EventTableProps>;

package/dist/esm/components/table/index.js

@@ -10,19 +10,17 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { ajax, BizGlobalDataContext, BizTable, IconFont } from '@zgfe/business-lib';
+import { ajax, base64, BizGlobalDataContext, BizTable, IconFont } from '@zgfe/business-lib';
 import React, { useContext, useEffect, useMemo, useState } from 'react';
-import 'highlight.js/styles/vs.css';
-import base64 from "../../utils/base64";
 import { Apis } from "../../constants";
 import { message } from 'antd';
 import { formTableData, getColumns } from "../../utils/formData";
 import "./styles/index.less";
-import { getValue } from "../../modules/content/utils";
+import { searchDataParams } from "../../modules/content/utils";
 import { EventContext } from "../../types";
-var classPrefix = 'mi-table';
+var classPrefix = 'mi-interval-table';
 var EventTable = function EventTable(props) {
-  var _dataSource$app_data2;
+  var _dataSource$appData2;
   var dataSource = props.dataSource,
     searchData = props.searchData,
     showList = props.showList;
@@ -63,106 +61,34 @@ var EventTable = function EventTable(props) {
     var sortData = formTableData(dataSource);
     setSearchTable(sortData);
     setSortTable(sortData);
-    setTableData(sortData === null || sortData === void 0 ? void 0 : sortData.slice(0, 10));
+    setTableData(sortData);
   }, [dataSource]);
 
   // 表格column
   var columns = useMemo(function () {
-    var _dataSource$app_data;
+    var _dataSource$appData;
     var _searchData$userGroup = searchData.userGroup,
       userGroup = _searchData$userGroup === void 0 ? [0] : _searchData$userGroup;
-
-    // // 用户钻取
-    // const onClickToDetail = (item: EventProps.ColumnsDataType, time: string, count: number) => {
-    //   let _time = time.split('|');
-    //   let groupValue = '';
-    //   // 有细分属性
-    //   if (searchData.dimension && item.dimension) {
-    //     groupValue = item.dimension;
-    //   } else {
-    //     // 有事件，无细分属性 || 事件概览
-    //     eventGroupList?.forEach((group) => {
-    //       group.eventList?.forEach((event) => {
-    //         if (event.name === item.name) {
-    //           groupValue = event.id.toString();
-    //         }
-    //       });
-    //     });
-    //   }
-
-    //   onUserDrill &&
-    //     onUserDrill(
-    //       {
-    //         appId: currentApp?.appId,
-    //         platform: currentApp?.platform || 0,
-    //         count,
-    //         module: 'event',
-    //         params: {
-    //           groupValue,
-    //           id: searchData.id,
-    //           userGroup: searchData.userGroup,
-    //           chartType: searchData.chartType,
-    //           conditions: searchData.filters?.conditions,
-    //           dimension: searchData.dimension,
-    //           dataType: searchData.id ? 'event' : 'overview',
-    //           time: {
-    //             ...searchData.time,
-    //             begin: _time[0],
-    //             end: _time.length > 1 ? _time[1] : _time[0],
-    //           },
-    //         },
-    //         source: 'EVENT',
-    //         url: '/zg/web/v2/data/appEventBatch',
-    //       },
-    //       {
-    //         source: 'EVENT',
-    //         ...defaultSearch,
-    //         name: panelName,
-    //         data: searchData,
-    //       },
-    //     );
-    // };
-    var _getColumns = getColumns(eventGroupList, userPropList, eventEnvList, (dataSource === null || dataSource === void 0 ? void 0 : (_dataSource$app_data = dataSource.app_data) === null || _dataSource$app_data === void 0 ? void 0 : _dataSource$app_data.x_axis) || [], userGroup, searchData, showList
-    // onClickToDetail,
-    );
-
+    var _getColumns = getColumns(eventGroupList, userPropList, eventEnvList, (dataSource === null || dataSource === void 0 ? void 0 : (_dataSource$appData = dataSource.appData) === null || _dataSource$appData === void 0 ? void 0 : _dataSource$appData.x_axis) || [], dataSource, userGroup, searchData, showList);
     return _getColumns;
-  }, [dataSource === null || dataSource === void 0 ? void 0 : (_dataSource$app_data2 = dataSource.app_data) === null || _dataSource$app_data2 === void 0 ? void 0 : _dataSource$app_data2.x_axis, showList, sortTable, panelName]);
+  }, [dataSource === null || dataSource === void 0 ? void 0 : (_dataSource$appData2 = dataSource.appData) === null || _dataSource$appData2 === void 0 ? void 0 : _dataSource$appData2.x_axis, showList, sortTable, panelName]);
 
   // 监听分页变化，如果页码发生变化则调用合并行方法
   var onChangeTable = function onChangeTable(pagination) {
-    var startNum = (pagination.current - 1) * pagination.pageSize;
-    var endNum = pagination.current * pagination.pageSize;
     setPageData({
       pageSize: pagination.pageSize,
       current: pagination.current
     });
-    setTableData(searchTable === null || searchTable === void 0 ? void 0 : searchTable.slice(startNum, endNum));
   };
 
   // 下载数据
   var download = function download() {
-    var _searchData$userGroup2;
-    var seriesNames = [];
-    // 有用户群
-    if (searchData !== null && searchData !== void 0 && searchData.userGroup && (searchData === null || searchData === void 0 ? void 0 : (_searchData$userGroup2 = searchData.userGroup) === null || _searchData$userGroup2 === void 0 ? void 0 : _searchData$userGroup2.length) > 1) {
-      seriesNames.push(base64.encode('用户群'));
-    }
-    // 有细分属性
-    if (searchData !== null && searchData !== void 0 && searchData.dimension) {
-      seriesNames.push(base64.encode(getValue(searchData === null || searchData === void 0 ? void 0 : searchData.dimension, eventGroupList, eventEnvList, userPropList).label));
-    }
-    // 事件(有事件-无细分属性 || 事件概览)
-    if (searchData.id && !searchData.dimension || !searchData.id) {
-      seriesNames.push(base64.encode('事件'));
-    }
+    var obj = searchDataParams(searchData);
     var params = _objectSpread(_objectSpread({
-      appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
-      platform: (currentApp === null || currentApp === void 0 ? void 0 : currentApp.platform) || 0
-    }, searchData), {}, {
+      appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId
+    }, obj), {}, {
       down: {
-        fname: base64.encode('间隔分析'),
-        titles: seriesNames
+        fname: base64.encode('间隔分析', false)
       }
     });
     ajax(Apis.eventDownloadReport, {
@@ -191,7 +117,7 @@ var EventTable = function EventTable(props) {
     rowKey: "key",
     scroll: {
       x: 800,
-      y: 200
+      y: 550
     },
     onChange: onChangeTable
   }));

package/dist/esm/components/table/styles/index.less

@@ -1,4 +1,4 @@
-.mi-table {
+.mi-interval-table {
   width: 100%;
   margin-top: 16px;
 

package/dist/esm/components/topBar/index.js

@@ -16,9 +16,9 @@ import { BizAddToPanel, BizAddToScene, BizGlobalDataContext } from '@zgfe/busine
 import "./styles/index.less";
 import { EventContext } from "../../types";
 import { chartTypes, platformOption } from "../../constants/fields";
-var classPrefix = 'modules-event-topbar';
+var classPrefix = 'modules-interval-topbar';
 var TopBar = function TopBar(props) {
-  // console.log('TopBar', props);
+  var _props$eventData, _props$eventData$appD, _props$eventData$appD2, _props$eventData2, _props$eventData2$app, _props$eventData2$app2, _props$eventData3, _props$eventData3$app, _props$eventData3$app2;
   var _useContext = useContext(EventContext),
     panelId = _useContext.panelId,
     afterEditTarget = _useContext.afterEditTarget,
@@ -66,6 +66,7 @@ var TopBar = function TopBar(props) {
   }, !panelId && /*#__PURE__*/React.createElement("div", {
     className: "".concat(classPrefix, "-panel")
   }, /*#__PURE__*/React.createElement(Button, {
+    disabled: (props === null || props === void 0 ? void 0 : (_props$eventData = props.eventData) === null || _props$eventData === void 0 ? void 0 : (_props$eventData$appD = _props$eventData.appData) === null || _props$eventData$appD === void 0 ? void 0 : (_props$eventData$appD2 = _props$eventData$appD.series) === null || _props$eventData$appD2 === void 0 ? void 0 : _props$eventData$appD2.length) === 0,
     onClick: function onClick() {
       setShowPanel(true);
     }
@@ -85,6 +86,7 @@ var TopBar = function TopBar(props) {
   })), enableAddScene && /*#__PURE__*/React.createElement("div", {
     className: "".concat(classPrefix, "-scene")
   }, /*#__PURE__*/React.createElement(Button, {
+    disabled: (props === null || props === void 0 ? void 0 : (_props$eventData2 = props.eventData) === null || _props$eventData2 === void 0 ? void 0 : (_props$eventData2$app = _props$eventData2.appData) === null || _props$eventData2$app === void 0 ? void 0 : (_props$eventData2$app2 = _props$eventData2$app.series) === null || _props$eventData2$app2 === void 0 ? void 0 : _props$eventData2$app2.length) === 0,
     onClick: function onClick() {
       setShowScene(true);
     }
@@ -99,13 +101,21 @@ var TopBar = function TopBar(props) {
     onCancel: function onCancel() {
       return closeHandle('scene');
     }
-  })), /*#__PURE__*/React.createElement(Button, {
+  })), (currentApp === null || currentApp === void 0 ? void 0 : currentApp.appVersion) === 1 || (currentApp === null || currentApp === void 0 ? void 0 : currentApp.appVersion) === 2 ? /*#__PURE__*/React.createElement(Button, {
     className: "".concat(classPrefix, "-earlywarning"),
     type: "primary",
+    disabled: (props === null || props === void 0 ? void 0 : (_props$eventData3 = props.eventData) === null || _props$eventData3 === void 0 ? void 0 : (_props$eventData3$app = _props$eventData3.appData) === null || _props$eventData3$app === void 0 ? void 0 : (_props$eventData3$app2 = _props$eventData3$app.series) === null || _props$eventData3$app2 === void 0 ? void 0 : _props$eventData3$app2.length) === 0,
     onClick: function onClick() {
-      return console.log('设置流失预警');
+      props.onUserDrill({
+        appId: Number(currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId),
+        module: 'interval',
+        platform: 0,
+        count: 0,
+        source: '',
+        url: ''
+      }, searchData);
     }
-  }, "\u8BBE\u7F6E\u6D41\u5931\u9884\u8B66"), /*#__PURE__*/React.createElement("div", {
+  }, "\u8BBE\u7F6E\u6D41\u5931\u9884\u8B66") : null, /*#__PURE__*/React.createElement("div", {
     className: "".concat(classPrefix, "-platform")
   }, platformOption.map(function (item) {
     return /*#__PURE__*/React.createElement("div", {

package/dist/esm/components/topBar/styles/index.less

@@ -1,6 +1,6 @@
 @import '~@zgfe/business-lib/es/assets/styles/inner.less';
 
-.modules-event-topbar {
+.modules-interval-topbar {
   display: flex;
   justify-content: flex-end;
   margin: 8px 0;

package/dist/esm/components/topBar/types.d.ts

@@ -1,8 +1,10 @@
-import { SearchValue } from '../../types';
+import { ResponseDataProps, SearchValue, UserDrillParamsProp } from '../../types';
 export interface TopBarProps {
     /**
      * @description   标题
      */
     searchData?: SearchValue;
+    eventData?: ResponseDataProps;
+    onUserDrill: (data: UserDrillParamsProp, searchData: SearchValue) => void;
     platformChange: (data: number) => void;
 }

package/dist/esm/constants/apis.js

@@ -2,6 +2,6 @@ var Apis = {
   // dataList: '/zg/web/v2/data/eventDataList',
   dataList: '/zg/web/v2/interval/intervalData',
   getEventDataSql: '/zg/web/v2/dataSql/getEventDataSql',
-  eventDownloadReport: '/zg/web/v2/data/eventDownloadReport'
+  eventDownloadReport: '/zg/web/v2/interval/downLoadintervalData'
 };
 export default Apis;

package/dist/esm/constants/fields.js

@@ -2,14 +2,14 @@ export var platformOption = [{
   key: 0,
   value: '全部'
 }, {
-  key: 1,
-  value: 'Android'
+  key: 3,
+  value: 'JS'
 }, {
   key: 2,
   value: 'IOS'
 }, {
-  key: 3,
-  value: 'JS'
+  key: 1,
+  value: 'Android'
 }];
 export var chartTypes = [{
   label: '趋势图',

package/dist/esm/index.d.ts

@@ -1,4 +1,4 @@
 /// <reference path="../typings.d.ts" />
 import EventChart from './modules/chart';
-import ModuleEvent from './modules/home';
-export { ModuleEvent, EventChart };
+import ModuleInterval from './modules/home';
+export { ModuleInterval, EventChart };

package/dist/esm/index.js

@@ -1,4 +1,4 @@
 /// <reference path="../typings.d.ts" />
 import EventChart from "./modules/chart";
-import ModuleEvent from "./modules/home";
-export { ModuleEvent, EventChart };
+import ModuleInterval from "./modules/home";
+export { ModuleInterval, EventChart };

package/dist/esm/modules/chart/index.js

@@ -18,7 +18,7 @@ import { Apis } from "../../constants";
 import { Spin } from 'antd';
 import IntervalChart from "./intervalChart";
 var EventChart = function EventChart(props) {
-  var _dataSource$app_data, _dataSource$app_data$, _dataSource$app_data2, _dataSource$app_data3;
+  var _dataSource$appData;
   var params = props.params;
   // 显示内容
   var _useState = useState(),
@@ -81,7 +81,7 @@ var EventChart = function EventChart(props) {
       className: "spin-container"
     });
   }
-  if (!dataSource || !(dataSource !== null && dataSource !== void 0 && (_dataSource$app_data = dataSource.app_data) !== null && _dataSource$app_data !== void 0 && (_dataSource$app_data$ = _dataSource$app_data.x_axis) !== null && _dataSource$app_data$ !== void 0 && _dataSource$app_data$.length || dataSource !== null && dataSource !== void 0 && (_dataSource$app_data2 = dataSource.app_data) !== null && _dataSource$app_data2 !== void 0 && (_dataSource$app_data3 = _dataSource$app_data2.series) !== null && _dataSource$app_data3 !== void 0 && _dataSource$app_data3.length)) {
+  if (!dataSource || !(dataSource !== null && dataSource !== void 0 && (_dataSource$appData = dataSource.appData) !== null && _dataSource$appData !== void 0 && _dataSource$appData.series.length)) {
     return /*#__PURE__*/React.createElement(MiNone, {
       label: "\u6682\u65E0\u6570\u636E"
     });
@@ -89,7 +89,8 @@ var EventChart = function EventChart(props) {
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IntervalChart, {
     dataSource: dataSource,
     showList: showList,
-    dataSourceList: dataSourceList
+    dataSourceList: dataSourceList,
+    params: params
   }), /*#__PURE__*/React.createElement(EventTable, {
     dataSource: dataSource,
     searchData: params,

package/dist/esm/modules/chart/intervalChart.js

@@ -11,6 +11,7 @@ import { renderToString } from 'react-dom/server';
 import CustomTooltip from "./customTooltip";
 import { chartColors } from "../../constants";
 import { getRandomColor } from "../../constants/color";
+import { convertDateArray } from "../../utils/formData";
 var IntervalChart = function IntervalChart(props) {
   var _useState = useState({}),
     _useState2 = _slicedToArray(_useState, 2),
@@ -18,7 +19,8 @@ var IntervalChart = function IntervalChart(props) {
     setOption = _useState2[1];
   useEffect(function () {
     var _props$showList, _seriesData$series;
-    var seriesData = props === null || props === void 0 ? void 0 : (_props$showList = props.showList) === null || _props$showList === void 0 ? void 0 : _props$showList.app_data;
+    var seriesData = props === null || props === void 0 ? void 0 : (_props$showList = props.showList) === null || _props$showList === void 0 ? void 0 : _props$showList.appData;
+    var params = props === null || props === void 0 ? void 0 : props.params;
     var eCharts = {
       tooltip: {
         trigger: 'item',
@@ -41,7 +43,7 @@ var IntervalChart = function IntervalChart(props) {
         type: 'category',
         boundaryGap: true,
         nameGap: 30,
-        data: seriesData === null || seriesData === void 0 ? void 0 : seriesData.x_axis,
+        data: convertDateArray(params, seriesData === null || seriesData === void 0 ? void 0 : seriesData.xAxis),
         splitArea: {
           show: false
         },

package/dist/esm/modules/chart/types.d.ts

@@ -3,7 +3,7 @@ import { SearchValue } from '../../types';
 import { DisplaySetup } from '../../components/searchPanel/types';
 export declare namespace eventChartProps {
     interface ChartTypesProps extends ChartTypes.Value {
-        app_data: any;
+        appData: any;
         xAxis: [];
         x_axis: [];
     }