@zgfe/modules-interval 1.0.0-interval.1

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

@@ -0,0 +1,250 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+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 React, { useState } from 'react';
+import { Form, Button } from 'antd';
+import { BizAttributeSelector, BizUserGroupHeader } from '@zgfe/business-lib';
+import EventFilter from "../../components/eventFilter";
+import "./styles/index.less";
+var classPrefix = 'top-panel';
+var TopPanel = function TopPanel(props) {
+  var defaultValue = props.defaultValue,
+    ajaxFlag = props.ajaxFlag,
+    finalSearchData = props.finalSearchData,
+    fetchRequest = props.fetchRequest;
+  var _Form$useForm = Form.useForm(),
+    _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
+    form = _Form$useForm2[0];
+  var _useState = useState(-100),
+    _useState2 = _slicedToArray(_useState, 2),
+    startId = _useState2[0],
+    setStartId = _useState2[1];
+  var _useState3 = useState(-100),
+    _useState4 = _slicedToArray(_useState3, 2),
+    endId = _useState4[0],
+    setEndId = _useState4[1];
+  // 关联属性
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    relevancy = _useState6[0],
+    setRelevancy = _useState6[1];
+  // 筛选条件值
+  var _ref = defaultValue,
+    id = _ref.id,
+    name = _ref.name,
+    dimension = _ref.dimension,
+    filters = _ref.filters,
+    userGroup = _ref.userGroup;
+  // 细分属性初始值
+  var _useState7 = useState(),
+    _useState8 = _slicedToArray(_useState7, 2),
+    bizAttributeSelectorValue = _useState8[0],
+    setBizAttributeSelectorValue = _useState8[1];
+  // 用户组和事件变更
+  var onValuesChange = function onValuesChange(data, allData) {
+    var _data = {};
+    if (allData.start) {
+      if (allData.start.id !== -100) {
+        _data = allData.start;
+        setStartId(allData.start.id);
+        if (allData.start.relevancy !== undefined) {
+          // form.setFieldsValue({
+          //   associatedPreAttr: undefined,
+          //   associatedNextAttr: undefined,
+          // });
+        }
+        setRelevancy(allData.start.relevancy);
+      }
+    }
+    if (allData.end) {
+      if (allData.end.id !== -100) {
+        _data = allData.end;
+        setEndId(allData.end.id);
+      }
+    }
+    if (allData.userGroup) {
+      _data.userGroup = [];
+      allData.userGroup.map(function (item) {
+        _data.userGroup && _data.userGroup.push(item);
+      });
+      if (_data.userGroup.length <= 0) _data.userGroup = [0];
+    }
+    if (data.start) {
+      // 事件id不变，不自动请求
+      if (finalSearchData && finalSearchData.id && data.start.id === finalSearchData.id) {
+        ajaxFlag = false;
+      } else {
+        ajaxFlag = true;
+      }
+    }
+    if (data.end) {
+      // 事件id不变，不自动请求
+      if (finalSearchData && finalSearchData.id && data.end.id === finalSearchData.id) {
+        ajaxFlag = false;
+      } else {
+        ajaxFlag = true;
+      }
+    }
+    props.onChange(allData, ajaxFlag);
+  };
+
+  // 重置
+  var resetting = function resetting() {
+    form.resetFields();
+    form.setFieldsValue({
+      userGroup: [0],
+      start: {},
+      end: {},
+      dimension: undefined,
+      associatedPreAttr: undefined,
+      associatedNextAttr: undefined
+    });
+    props.onChange({
+      userGroup: [0],
+      id: undefined,
+      name: undefined,
+      filters: undefined,
+      dimension: undefined
+    }, true);
+  };
+  // 细分属性
+  var onChangeAttr = function onChangeAttr(attr) {
+    if (attr === undefined) {
+      // 删除细分属性
+      setBizAttributeSelectorValue(undefined);
+    } else {
+      var _value = attr.propCategory === 'eventProp' ? attr.id : attr.name;
+      setBizAttributeSelectorValue({
+        propCategory: attr.propCategory,
+        category: attr.category,
+        value: _value,
+        key: attr.propCategory === 'eventProp' ? attr.id : attr.propCategory + '-' + _value
+      });
+    }
+  };
+  return /*#__PURE__*/React.createElement(Form, {
+    form: form,
+    component: "div",
+    colon: false,
+    className: "panel-form",
+    layout: "vertical",
+    initialValues: {
+      userGroup: userGroup ? userGroup.map(function (item) {
+        return {
+          id: item
+        };
+      }) : [{
+        id: 0
+      }],
+      start: {
+        id: id,
+        name: name,
+        dimension: dimension,
+        filters: filters
+      },
+      end: {
+        id: id,
+        name: name,
+        dimension: dimension,
+        filters: filters
+      }
+    },
+    scrollToFirstError: true,
+    onValuesChange: onValuesChange
+  }, /*#__PURE__*/React.createElement(Form.Item, {
+    label: "",
+    name: "userGroup",
+    className: "space-item",
+    style: {
+      paddingLeft: 0
+    }
+  }, /*#__PURE__*/React.createElement(BizUserGroupHeader, {
+    max: 1
+  })), /*#__PURE__*/React.createElement(Form.Item, {
+    label: "\u5F00\u59CB\u4E8B\u4EF6",
+    name: "start"
+  }, /*#__PURE__*/React.createElement(EventFilter, {
+    relevancy: true
+  })), relevancy ? /*#__PURE__*/React.createElement(Form.Item, {
+    style: {
+      marginBottom: 0
+    },
+    className: "associated"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "associated-link"
+  }, /*#__PURE__*/React.createElement("i", {
+    style: {
+      color: '#9AA1A9'
+    },
+    className: "zhuge icon-lianjie1"
+  })), /*#__PURE__*/React.createElement("span", {
+    className: "associated-label"
+  }, "\u5C5E\u60271"), /*#__PURE__*/React.createElement(Form.Item, {
+    name: "associatedPreAttr",
+    style: {
+      display: 'inline-block',
+      marginRight: 28
+    }
+  }, /*#__PURE__*/React.createElement(BizAttributeSelector, {
+    enableEventProp: true,
+    enableUserProp: false,
+    enableEnvProp: false,
+    eventIdList: [startId],
+    value: bizAttributeSelectorValue,
+    enableDelete: true,
+    onChange: onChangeAttr,
+    onDelete: function onDelete() {
+      onChangeAttr(undefined);
+    }
+  })), /*#__PURE__*/React.createElement("span", {
+    className: "associated-label"
+  }, "\u5C5E\u60272"), /*#__PURE__*/React.createElement(Form.Item, {
+    name: "associatedNextAttr",
+    style: {
+      display: 'inline-block'
+    }
+  }, /*#__PURE__*/React.createElement(BizAttributeSelector, {
+    enableEventProp: true,
+    enableUserProp: false,
+    enableEnvProp: false,
+    eventIdList: [endId],
+    value: bizAttributeSelectorValue,
+    enableDelete: true,
+    onChange: onChangeAttr,
+    onDelete: function onDelete() {
+      onChangeAttr(undefined);
+    }
+  }))) : '', /*#__PURE__*/React.createElement(Form.Item, {
+    label: "\u7ED3\u675F\u4E8B\u4EF6",
+    name: "end"
+  }, /*#__PURE__*/React.createElement(EventFilter, null)), /*#__PURE__*/React.createElement(Form.Item, {
+    label: "\u6309\u5C5E\u6027\u7EC6\u5206",
+    name: "dimension"
+  }, /*#__PURE__*/React.createElement(BizAttributeSelector, {
+    enableEventProp: true,
+    enableUserProp: true,
+    enableEnvProp: true,
+    eventIdList: startId === endId ? [startId] : [startId, endId],
+    value: bizAttributeSelectorValue,
+    enableDelete: true,
+    onChange: onChangeAttr,
+    onDelete: function onDelete() {
+      onChangeAttr(undefined);
+    }
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(classPrefix, "-form-botton-box")
+  }, /*#__PURE__*/React.createElement(Button, {
+    onClick: resetting
+  }, "\u91CD\u7F6E"), /*#__PURE__*/React.createElement(Button
+  // disabled={ajaxFlag}
+  , {
+    type: "primary",
+    onClick: function onClick() {
+      fetchRequest(true);
+    }
+  }, "\u67E5\u8BE2")));
+};
+export default TopPanel;

package/dist/esm/modules/topPanel/styles/index.less

@@ -0,0 +1,67 @@
+@import '../../../assets/icons/iconfont.css';
+@import '../../../assets/business/iconfont.css';
+
+.top-panel {
+  &-form-botton-box {
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 24px;
+    margin-right: 24px;
+
+    > :nth-child(1) {
+      margin-right: 16px;
+      color: #fff;
+      background-color: #29bd52;
+      border-color: #29bd52;
+    }
+  }
+}
+
+.panel-form {
+  .biz-event-select {
+    width: 208px;
+  }
+
+  > .ant-form-item {
+    margin-bottom: 12px;
+    padding-left: 24px;
+  }
+
+  .associated {
+    .associated-link {
+      display: block;
+      line-height: 32px;
+    }
+
+    .ant-form-item-row {
+      flex-direction: inherit;
+    }
+
+    .ant-form-item-control-input-content {
+      display: flex;
+      gap: 12px;
+    }
+
+    .associated-label {
+      color: var(--3, #5f6085);
+      font-weight: 400;
+      font-size: 14px;
+      font-family: PingFang SC;
+      font-style: normal;
+      line-height: 32px;
+      text-align: right;
+    }
+  }
+}
+
+.space-item {
+  .ant-space-item {
+    .biz-user-group {
+      max-width: 208px;
+    }
+  }
+
+  .ant-space-horizontal .ant-space-item:nth-child(2) .tianjia {
+    display: none;
+  }
+}

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

@@ -0,0 +1,54 @@
+import { AttrConditionTypes } from '@zgfe/business-lib';
+import { bizAttributeSelectorValueProp, SearchValue } from '../../types';
+export interface start {
+    id?: number;
+    name?: string;
+    relevancy?: boolean;
+    filters?: AttrConditionTypes.GroupValue;
+}
+export interface FormDataProps {
+    /**
+     * 用户群
+     */
+    userGroup?: number[];
+    /**
+     * 事件、属性、属性细分
+     */
+    start?: start;
+    end?: start;
+    /**
+     * @description  关联属性开关
+     */
+    relevancy?: boolean;
+    dimension?: bizAttributeSelectorValueProp;
+    associatedPreAttr?: bizAttributeSelectorValueProp;
+    associatedNextAttr?: bizAttributeSelectorValueProp;
+}
+export interface FormHandelDataProps extends start {
+    /**
+     * 用户群
+     */
+    userGroup?: number[];
+}
+export interface TopPanelProps {
+    /**
+     * 默认值
+     */
+    defaultValue?: SearchValue;
+    /**
+     * 数据更新
+     */
+    onChange: (data: SearchValue, flag: boolean) => void;
+    /**
+     * 是否请求数据
+     */
+    ajaxFlag: boolean;
+    /**
+     * 请求后的最新查询数据
+     */
+    finalSearchData?: SearchValue;
+    /**
+     * 请求数据方法
+     */
+    fetchRequest: (flag?: boolean) => void;
+}

package/dist/esm/modules/topPanel/types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/style/image/ring.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin: auto; background: rgb(255, 255, 255); display: block; shape-rendering: auto;" width="80px" height="80px" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid">
+<circle cx="50" cy="50" r="32" stroke-width="4" stroke="#165dff" stroke-dasharray="50.26548245743669 50.26548245743669" fill="none" stroke-linecap="round">
+  <animateTransform attributeName="transform" type="rotate" dur="1s" repeatCount="indefinite" keyTimes="0;1" values="0 50 50;360 50 50"></animateTransform>
+</circle>
+<circle cx="50" cy="50" r="27" stroke-width="4" stroke="#85adfc" stroke-dasharray="42.411500823462205 42.411500823462205" stroke-dashoffset="42.411500823462205" fill="none" stroke-linecap="round">
+  <animateTransform attributeName="transform" type="rotate" dur="1s" repeatCount="indefinite" keyTimes="0;1" values="0 50 50;-360 50 50"></animateTransform>
+</circle>
+<!-- [ldio] generated by https://loading.io/ --></svg>

package/dist/esm/style/index.less

@@ -0,0 +1,46 @@
+.event-form-data {
+  &-table-td {
+    padding: 0 !important;
+
+    &-show {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      min-width: 60px;
+      height: 48px;
+      cursor: pointer;
+      span {
+        width: 10px;
+        height: 10px;
+        border-radius: 50%;
+        cursor: pointer;
+      }
+    }
+
+    &-name {
+      display: flex;
+      align-items: center;
+      .bsicon {
+        margin-right: 4px;
+        color: #fd9f41;
+      }
+
+      &-content {
+        display: inline-block;
+        max-width: 300px;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        cursor: pointer;
+      }
+    }
+
+    &-link {
+      cursor: pointer;
+      &:hover {
+        color: #165dff;
+        text-decoration: underline;
+      }
+    }
+  }
+}

package/dist/esm/style/theme.d.ts

@@ -0,0 +1,15 @@
+declare const _default: {
+    'primary-color': string;
+    'border-color-base': string;
+    'background-color-base': string;
+    'text-color': string;
+    'text-color-secondary': string;
+    'tooltip-bg': string;
+    'error-color': string;
+    'shadow-color': string;
+    'box-shadow-base': string;
+    'btn-text-hover-bg': string;
+    'warning-color': string;
+    'border-color-split': string;
+};
+export default _default;

package/dist/esm/style/theme.js

@@ -0,0 +1,16 @@
+export default {
+  'primary-color': '#165dff',
+  'border-color-base': '#ECEDF0',
+  'background-color-base': '#fafafb',
+  'text-color': '#021429',
+  // 正文
+  'text-color-secondary': '#5f6085',
+  // 次要
+  'tooltip-bg': '#242541',
+  'error-color': '#fb5547',
+  'shadow-color': 'rgba(0, 0, 0, 0.1)',
+  'box-shadow-base': '0px 4px 10px rgba(0, 0, 0, 0.1)',
+  'btn-text-hover-bg': '#cacdd4',
+  'warning-color': '#FD9F41',
+  'border-color-split': '#E8EFFF'
+};

package/dist/esm/types.d.ts

@@ -0,0 +1,169 @@
+import { AttrConditionTypes } from '@zgfe/business-lib';
+import { DatePickerTypes } from '@zgfe/business-lib/es/datePicker/types';
+import { ReactNode } from 'react';
+import { FormDataProps } from './modules/topPanel/types';
+/**
+ * 属性选择器 默认值
+ */
+export interface bizAttributeSelectorValueProp {
+    propCategory?: string;
+    category?: string;
+    value?: number | string;
+    key?: number | string;
+}
+export interface eventProps {
+    /**
+     * @description  事件id
+     */
+    id?: number;
+    /**
+     * @description  事件name
+     */
+    name?: string;
+    /**
+     * @description  事件属性筛选
+     */
+    filters?: AttrConditionTypes.GroupValue;
+    /**
+     * @description  事件属性细分
+     */
+    dimension?: bizAttributeSelectorValueProp;
+    /**
+     * @description  关联属性开关
+     */
+    relevancy?: boolean;
+}
+export interface SearchValue {
+    allData?: FormDataProps;
+    /**
+     * @description  事件id
+     */
+    id?: number;
+    /**
+     * @description  事件name
+     */
+    name?: string;
+    /**
+     * @description  平台
+     */
+    platform?: number;
+    /**
+     * @description   图表类型
+     * @default     'line'
+     */
+    chartType?: EventChartTypes;
+    /**
+     * @description   用户群id
+     */
+    userGroup?: number[];
+    /**
+     * 事件、属性、属性细分
+     */
+    /**
+     * @description  维度类型
+     */
+    analysisIndex?: string;
+    /**
+     * @description  维度名称
+     */
+    analysisAttr?: string;
+    /**
+     * @description  显示设置
+     */
+    displaySetup?: string[];
+    /**
+     * @description   日期
+     * @default       最近一天
+     */
+    time?: DatePickerTypes.Value;
+    /**
+     * @description  属性细分
+     */
+    dimension?: bizAttributeSelectorValueProp;
+    /**
+     * @description  事件属性筛选
+     */
+    filters?: AttrConditionTypes.GroupValue;
+    /**
+     * @description  关联属性-开始
+     *
+     */
+    associatedPreAttr?: bizAttributeSelectorValueProp;
+    /**
+     * @description  关联属性-结束
+     */
+    associatedNextAttr?: bizAttributeSelectorValueProp;
+}
+export interface UserDrillParamsProp {
+    /**
+     * @description 应用id
+     */
+    appId: number;
+    /**
+     * @description 平台
+     */
+    platform: number;
+    /**
+     * @description  用户数量
+     */
+    count: number;
+    /**
+     * @description 模型类型 整体|事件|漏斗|留存|获取|粘性|崩溃|微信生态-整体|微信生态-小程序
+     */
+    source: string;
+    /**
+     * @description 查询接口
+     */
+    url: string;
+    /**
+     * @description 查询对象
+     */
+    params?: Record<string, any>;
+    /**
+     * @description 间隔分析，数据格式与其他业务不一致，间隔分析单独提出来了，其他业务在data里面
+     */
+    module?: string;
+}
+export type EventChartTypes = 'line' | 'bar' | 'pie' | 'map';
+/**
+ * 图表选择类型
+ */
+export interface ChartItemProp {
+    label?: string;
+    value: EventChartTypes;
+    icon?: ReactNode;
+    disabled?: boolean;
+}
+export interface ChartData {
+    app_data: {
+        series?: {
+            names: string[];
+            values: number[][];
+            total: number[];
+        }[];
+        x_axis?: string[];
+    };
+}
+export interface ResponseDataProps {
+    app_data: any;
+    xAxis?: string[];
+    x_axis?: string[];
+    series: SeriesProps[];
+    tongbi?: number[];
+    huanbi?: number[];
+    total?: number[];
+    yesterDay?: string[];
+}
+/**
+ * series value
+ */
+export interface SeriesProps {
+    names?: string[];
+    values?: number[][] | number[];
+    total?: number[];
+}
+export interface TableChildrenProps {
+    name: string;
+    values: number[];
+}
+export declare const EventContext: import("react").Context<any>;

package/dist/esm/types.js

@@ -0,0 +1,19 @@
+import { createContext } from 'react';
+
+/**
+ * 属性选择器 默认值
+ */
+
+/**
+ * 图表选择类型
+ */
+
+/**
+ * series value
+ */
+
+var defaultContext = {
+  onUserDrill: null,
+  defaultSearch: {}
+};
+export var EventContext = /*#__PURE__*/createContext(defaultContext);

package/dist/esm/utils/ajaxConfig.d.ts

@@ -0,0 +1,8 @@
+export declare const requestConfig: {
+    request: {
+        optionsWrapper(url: string, options?: any): {
+            url: string;
+            options: any;
+        };
+    };
+};