@zgfe/modules-attribution 1.0.1-alpha.0

package/es/modules/searchPanel/styles/index.less

@@ -0,0 +1,202 @@
+@import '~@zgfe/business-lib/es/assets/styles/inner.less';
+
+.mi-left-form {
+  &-bottom-form-title {
+    margin-top: 34px;
+    margin-bottom: 16px;
+    color: #021429;
+    font-weight: 500;
+  }
+  &-bottom-form {
+    display: flex;
+    min-width: 860px;
+    height: 32px;
+    margin-bottom: 14px;
+    .p {
+      margin: 0;
+      margin-right: 12px;
+      padding: 0;
+      color: #5f6085;
+      line-height: 32px;
+      .tishiicon {
+        margin-left: 8px;
+        color: #9aa1a9;
+      }
+    }
+    .attributionType {
+      margin-right: 24px;
+    }
+    .windowCnt {
+      margin: 0 16px;
+    }
+  }
+  &-otherEvent {
+    color: #021429;
+    font-size: 14px;
+    .tishiicon {
+      margin-left: 1px;
+      color: #9aa1a9;
+    }
+  }
+  &-search-button-box {
+    text-align: right;
+    .ant-btn {
+      border: none;
+    }
+    > :nth-child(1) {
+      margin-right: 16px;
+      background: #29bd52;
+    }
+    .disable,
+    .disable:hover {
+      color: #ffffff;
+      background: #d0dfff;
+    }
+  }
+  &-title.ant-form-item {
+    margin-bottom: 12px;
+    color: #5f6085;
+    font-size: 14px;
+    line-height: 20px;
+    .bsicon {
+      margin-left: 9px;
+      color: #9aa1a9;
+    }
+    .ant-form-item-control-input {
+      min-height: 20px;
+      .ant-form-item-control-input-content {
+        height: 20px;
+      }
+    }
+  }
+
+  &-item.ant-form-item {
+    margin-bottom: 12px;
+  }
+
+  &-add {
+    width: fit-content;
+    height: 20px;
+    margin-top: 8px;
+    color: #165dff;
+    font-size: 14px;
+    line-height: 20px;
+    border-radius: @border-radius-small;
+    cursor: pointer;
+    span {
+      margin-right: 4px;
+    }
+
+    // &:not(.disabled):hover {
+    //   .__default-hover();
+    // }
+
+    &.disabled {
+      color: @disabled-color;
+      cursor: not-allowed;
+    }
+  }
+
+  .biz-condition-item-input {
+    border-color: transparent;
+  }
+
+  .ant-input-affix-wrapper > input.ant-input {
+    height: 100%;
+  }
+  .attributable-events-box {
+    .select-and-attr {
+      display: flex;
+      margin-bottom: 12px;
+      .ant-dropdown-trigger {
+        width: 208px;
+        margin-right: 16px;
+      }
+      .biz-select-handle-input {
+        background: #fafafb;
+      }
+      .biz-attr-select {
+        width: 208px;
+        margin-right: 16px;
+        .biz-attr-select-handle {
+          position: relative;
+          padding: 0;
+          border: none;
+          .qingchu {
+            position: absolute;
+            top: 5px;
+            right: 40px;
+          }
+        }
+        // .biz-attr-select-handle:hover{
+        //   .xiangxia{
+        //     display: none;
+        //   }
+        // }
+      }
+      .button-box {
+        .qingchu,
+        .tianjia2,
+        .shaixuan {
+          margin-top: 2px;
+          margin-right: 20px;
+          // color: #CCD0D4;
+          color: #9aa1a9;
+          font-size: 20px !important;
+          cursor: pointer;
+        }
+        .tianjia2:hover,
+        .shaixuan:hover {
+          color: #165dff;
+        }
+        .qingchu:hover {
+          color: #e96150;
+        }
+        .disable {
+          color: #ccd0d4 !important;
+          cursor: not-allowed !important;
+        }
+      }
+    }
+  }
+  .target-events-box {
+    .selector-content {
+      display: flex;
+      margin-bottom: 12px;
+      .ant-dropdown-trigger {
+        width: 208px;
+        margin-right: 16px;
+      }
+      .biz-select-handle-input {
+        background: #fafafb;
+      }
+      .ant-select-selection-placeholder::after {
+        content: '\e76d' !important;
+      }
+    }
+    .shaixuan {
+      margin: 2px 0 0 20px;
+      color: #9aa1a9;
+      font-size: 20px !important;
+      cursor: pointer;
+    }
+    .shaixuan:hover {
+      color: #165dff;
+    }
+    .shaixuan.disable {
+      color: #ccd0d4;
+      cursor: not-allowed;
+    }
+  }
+
+  .verify-error {
+    .biz-select-handle-input {
+      background-color: #fff;
+      border: 1px solid #fb5547 !important;
+    }
+  }
+  .error-tips {
+    margin-top: -14px;
+    color: #fb5547;
+  }
+}

package/es/modules/searchPanel/types.d.ts

@@ -0,0 +1,31 @@
+export declare namespace SearchPanelTypes {
+    interface Props {
+        defaultValue?: any;
+        onChange: (values: any) => void;
+    }
+    interface FieldProp {
+        key: string;
+        type: string;
+        name: string;
+        label: string;
+        max: number;
+        addLabel: string;
+        options?: any[];
+        tips?: string;
+        required?: boolean;
+    }
+    interface PanelProp {
+        type: string;
+        value?: any;
+        allValues?: any;
+        enableDelete: boolean;
+        eventIdList?: number[];
+        showOverview?: boolean;
+        onChange?: (data: any) => void;
+        onDelete?: () => void;
+        attrChange?: (data: any) => void;
+        verify: boolean;
+        setAttrTargetCount: Function;
+        setAttrSourceCount: Function;
+    }
+}

package/es/modules/searchPanel/types.js

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

package/es/modules/searchPanel/utils.d.ts

@@ -0,0 +1,5 @@
+import { SearchData } from '../../types';
+export declare function removeEmptyValue(source: SearchData): any;
+export declare function verifyHandle(data: SearchData): boolean;
+export declare function targetChangeCallback(data: SearchData, eList: number[], eventGroupList: any): SearchData;
+export declare function submitButtonDisableHandle(data: SearchData, attrSourceCount: number, attrTargetCount: number): boolean;

package/es/modules/searchPanel/utils.js

@@ -0,0 +1,139 @@
+import _ from 'lodash';
+export function removeEmptyValue(source) {
+  var data = _.cloneDeep(source);
+  var getValue = function getValue(formData) {
+    if (!formData) return formData;
+    var newData = [];
+    formData.forEach(function (item) {
+      if (item) {
+        if (item.filters) {
+          var conditions = getConditionList(item.filters.conditions);
+          if (conditions) {
+            item.filters.conditions = conditions;
+          } else {
+            item.filters = undefined;
+          }
+        }
+        newData.push(item);
+      }
+    });
+    if (newData.length) return newData.length ? newData : undefined;
+  };
+  data.targetFilters = getValue(data.targetFilters)[0];
+  data.sourceFilters = getValue(data.sourceFilters);
+  if (data.globalFilters) {
+    var conditions = getConditionList(data.globalFilters.conditions);
+    if (conditions) {
+      data.globalFilters.conditions = conditions;
+    } else {
+      data.globalFilters = undefined;
+    }
+  }
+  return data;
+}
+export function verifyHandle(data) {
+  console.log('判断表单校验是否通过', data);
+  var targetFilters = data.targetFilters,
+    sourceFilters = data.sourceFilters;
+  var _verify = true;
+  targetFilters.map(function (item) {
+    if (item.eventId === -100 || item === undefined) _verify = false;
+  });
+  sourceFilters.map(function (item) {
+    if (item.eventId === -100 || item === undefined) _verify = false;
+  });
+  return _verify;
+}
+var OperateTypes;
+(function (OperateTypes) {
+  OperateTypes["IsNull"] = "is null";
+  OperateTypes["IsNotNull"] = "is not null";
+})(OperateTypes || (OperateTypes = {}));
+function getConditionList(condition) {
+  if (!condition) return;
+  var conditionList = [];
+  condition.forEach(function (item) {
+    if (!item.attrId && !item.attrName) return;
+    if (!item.values || !item.values.length) {
+      if (item.operator === OperateTypes.IsNotNull || item.operator === OperateTypes.IsNull) {
+        conditionList.push(item);
+      }
+    } else {
+      conditionList.push(item);
+    }
+  });
+  return conditionList.length ? conditionList : undefined;
+}
+export function targetChangeCallback(data, eList, eventGroupList) {
+  if (eList[0] === -100) {
+    data.globalFilters = undefined;
+  } else {
+    if (data.globalFilters && data.globalFilters.conditions) {
+      var newFilters = [],
+        flag = true;
+      data.globalFilters.conditions.forEach(function (condition) {
+        if (condition) {
+          if (condition.propCategory === 'eventProp' && condition.attrId) {
+            var hasExit = judgeAttrInEvents(eList, condition.attrId, eventGroupList);
+            if (hasExit) {
+              newFilters.push(condition);
+            } else {
+              flag = false;
+            }
+          } else {
+            newFilters.push(condition);
+          }
+        }
+      });
+      if (!flag) {
+        data.globalFilters = undefined;
+      }
+    }
+  }
+  return data;
+}
+var buttonDisable = function buttonDisable(data, type, count) {
+  var flag = false;
+  data[type].map(function (item) {
+    item === undefined ? flag = true : null;
+    if (item !== undefined) {
+      var _item$filters;
+      (item === null || item === void 0 ? void 0 : item.eventId) === -100 ? flag = true : null;
+      item.filters === undefined && count != 0 ? flag = true : null;
+      if ((item === null || item === void 0 ? void 0 : item.filters) && ((_item$filters = item.filters) === null || _item$filters === void 0 ? void 0 : _item$filters.conditions.length) > 0) {
+        var _item$filters2, _item$filters3;
+        (_item$filters2 = item.filters) === null || _item$filters2 === void 0 ? void 0 : _item$filters2.conditions.map(function (_item) {
+          var _item$values;
+          _item.values && ((_item$values = _item.values) === null || _item$values === void 0 ? void 0 : _item$values.length) <= 0 ? flag = true : null;
+        });
+        ((_item$filters3 = item.filters) === null || _item$filters3 === void 0 ? void 0 : _item$filters3.conditions.length) != count ? flag = true : null;
+      }
+    }
+  });
+  return flag;
+};
+export function submitButtonDisableHandle(data, attrSourceCount, attrTargetCount) {
+  var flag = false;
+  data.attributionType === undefined ? flag = true : null;
+  buttonDisable(data, 'sourceFilters', attrSourceCount) ? flag = true : null;
+  buttonDisable(data, 'targetFilters', attrTargetCount) ? flag = true : null;
+  console.log('判断提交按钮是否可点击', attrSourceCount, flag, data);
+  return flag;
+}
+var judgeAttrInEvents = function judgeAttrInEvents(elds, attrId, eventGroupList) {
+  var flag = false;
+  if (!eventGroupList) return false;
+  eventGroupList.forEach(function (group) {
+    group.eventList.forEach(function (event) {
+      if (elds.includes(event.id)) {
+        event.attrList.forEach(function (attr) {
+          if (attr.id === attrId) {
+            flag = true;
+            return;
+          }
+        });
+      }
+    });
+  });
+  return flag;
+};

package/es/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/es/style/index.less

@@ -0,0 +1,47 @@
+@import '~@zgfe/business-lib/es/assets/styles/variable.less';
+.attribution {
+  &-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: @primary-color;
+        text-decoration: underline;
+      }
+    }
+  }
+}

package/es/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/es/style/theme.js

@@ -0,0 +1,14 @@
+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/es/types.d.ts

@@ -0,0 +1,62 @@
+import { TargetConditionTypes, AttrConditionTypes } from '@zgfe/business-lib';
+import { DatePickerTypes } from '@zgfe/business-lib/es/datePicker/types';
+import { ReactNode } from 'react';
+export interface SearchValue {
+    targetFilters?: Array<TargetConditionTypes.Value>;
+    sourceFilters?: Array<TargetConditionTypes.Value>;
+    globalFilters?: AttrConditionTypes.GroupValue;
+    globalDimensions?: Array<AttrConditionTypes.ItemValue>;
+    time?: DatePickerTypes.Value;
+    otherEvent?: boolean;
+}
+export interface SearchData {
+    targetFilters: Array<TargetConditionTypes.Value>;
+    sourceFilters: Array<TargetConditionTypes.Value>;
+    globalFilters?: AttrConditionTypes.GroupValue;
+    time?: DatePickerTypes.Value;
+    attributionType?: number;
+    otherEvent?: boolean;
+}
+export interface ChartItemProp {
+    label?: string;
+    value: 'line' | 'bar' | 'map';
+    icon?: ReactNode;
+    disabled?: boolean;
+}
+export interface ResponseDataProps {
+    x_axis?: string[];
+    series: SeriesProps[];
+    tongbi?: number[];
+    huanbi?: number[];
+    total?: number[];
+    yesterDay?: string[];
+}
+export interface SeriesProps {
+    names?: string[];
+    values: number[];
+    index?: string;
+    duration?: TableChildrenProps[];
+}
+export interface TableChildrenProps {
+    name: string;
+    values: number[];
+}
+export interface TableDataHandleProps {
+    xAxis: string[];
+    series: {
+        values: string[];
+    }[];
+}
+export interface DataSourceProps {
+    [x: string]: string;
+}
+export interface ColumnsProps {
+    key: string;
+    title: string;
+    dataIndex: string;
+}
+export interface TableDataProps {
+    columns?: ColumnsProps[];
+    dataSource?: DataSourceProps[];
+}
+export declare const AttributableContext: import("react").Context<any>;

package/es/types.js

@@ -0,0 +1,2 @@
+import { createContext } from 'react';
+export var AttributableContext = /*#__PURE__*/createContext(null);

package/es/utils/ajaxConfig.d.ts

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

package/es/utils/ajaxConfig.js

@@ -0,0 +1,40 @@
+import _ from 'lodash';
+function setOptionWapper(url, options) {
+  var reqOption = _.cloneDeep(options);
+  if (/^\/v1|\.jsp$/.test(url)) {
+    if (reqOption.headers && reqOption.headers['Content-Type'] === 'application/x-www-form-urlencoded') {
+      return reqOption;
+    }
+    reqOption.headers = {
+      'Content-Type': 'application/x-www-form-urlencoded'
+    };
+    var transformRequest = function transformRequest(param) {
+      var arr = [];
+      for (var key in param) {
+        arr.push("".concat(key, "=").concat(encodeURIComponent(param[key])));
+      }
+      return arr.join('&');
+    };
+    reqOption.data = transformRequest(options.data);
+  }
+  return reqOption;
+}
+export var requestConfig = {
+  request: {
+    optionsWrapper: function optionsWrapper(url, options) {
+      var newUrl = url;
+      var reqOption = options;
+      var ajaxUrlReg = '/analysis/api/common/proxy';
+      if (/^\/v1|\.jsp$/.test(url)) {
+        if (ajaxUrlReg && !url.includes(ajaxUrlReg)) {
+          newUrl = ajaxUrlReg + url;
+          reqOption = setOptionWapper(url, options);
+        }
+      }
+      return {
+        url: newUrl,
+        options: reqOption
+      };
+    }
+  }
+};

package/es/utils/request.d.ts

@@ -0,0 +1,3 @@
+import { ajaxConfig } from '@zgfe/business-lib/es/utils/type';
+declare function request<T>(url: string, options: ajaxConfig<T>): Promise<import("@zgfe/business-lib/es/utils/type").InterfaceApiResult<T> | null>;
+export default request;

package/es/utils/request.js

@@ -0,0 +1,5 @@
+import { ajax } from '@zgfe/business-lib';
+function request(url, options) {
+  return ajax(url, options);
+}
+export default request;

package/es/utils/transfer.d.ts

@@ -0,0 +1,65 @@
+import { EnvProp, EventGroup, UserProp } from '@zgfe/business-lib/es/attributeSelector/types';
+interface OldSearchData {
+    app_id: number;
+    platform: number;
+    analysis_index: string;
+    module: 'event';
+    chartType: 'string';
+    event_attr?: string;
+    user_attr?: string;
+    event?: number;
+    time: {
+        dimension_date: string;
+        begin_date: string | number;
+        end_date: string | number;
+    } | string;
+    event_group_id?: number;
+    user_group: string;
+    analysis_attr?: string;
+    dimension_sub?: string;
+    filter_condition?: {
+        eventCondition?: {
+            eventSingleConditions?: [
+                {
+                    attrConditions: OldEventCondition[];
+                    environmentConditions: OldCondition[];
+                    eventId: number;
+                    eventName: string;
+                    extra?: string;
+                    happenTime?: {
+                        name: string;
+                        operator: string;
+                        params: any[];
+                        type: number;
+                    };
+                    isNew?: boolean;
+                }
+            ];
+            operator: 'and';
+        };
+        userCondition: {
+            userSingleConditions: OldUserCondition[];
+            operator: 'and';
+        };
+    } | string;
+}
+interface OldCondition {
+    attrId: number;
+    name: string;
+    type: number;
+    category: 'fixed' | 'custom';
+    operator: string;
+    text: string;
+    params: any[];
+}
+interface OldUserCondition extends OldCondition {
+    isUserProp: boolean;
+    subtype?: number;
+}
+interface OldEventCondition extends OldCondition {
+    isEventProp: boolean;
+    eventId: number;
+    eventName: string;
+}
+export declare function transferEventSearchData(params: OldSearchData, userPropList?: UserProp[], eventGroupList?: EventGroup[], eventEnvList?: EnvProp[]): any;
+export {};