@zgfe/modules-attribution 1.0.1-alpha.0

package/es/components/title/styles/index.less

@@ -0,0 +1,83 @@
+@import '~@zgfe/business-lib/es/assets/styles/inner.less';
+
+.attribution-title {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  height: 64px;
+  padding: 0 16px;
+  background: #fff;
+  border-bottom: 1px solid @border-color-base;
+
+  &-option {
+    display: flex;
+    align-items: center;
+  }
+  &-input-box {
+    white-space: nowrap;
+    .btn-back {
+      margin-right: @margin-xs;
+    }
+    &-container {
+      position: relative;
+      display: inline-block;
+      height: 100%;
+    }
+    &-content {
+      height: @height-base;
+      color: @text-color;
+      font-weight: 600;
+      background: @white !important;
+      border: 1px solid transparent;
+
+      &:hover,
+      &:focus {
+        // border-color: @primary-color;
+      }
+    }
+  }
+  &-error-tip {
+    position: absolute;
+    top: 100%;
+    left: 0;
+    color: @error-color;
+    line-height: 1.2;
+  }
+  &-dropdown {
+    .ant-dropdown-menu-item:hover span {
+      // color: @primary-color;
+    }
+
+    .ant-dropdown-menu-item-icon {
+      font-size: 16px;
+    }
+  }
+  /*更多按钮*/
+  &-pop-btn {
+    width: @height-base;
+    height: @height-base;
+    color: @text-color-secondary;
+    font-size: 16px;
+    line-height: @height-base;
+    text-align: center;
+    border-radius: @border-radius-small;
+    transform: rotate(90deg);
+
+    &:hover {
+      .__default-hover();
+    }
+  }
+}
+
+.attribution-btn {
+  margin-right: 16px;
+  border-radius: @border-radius-small;
+}
+
+.attribution-divider {
+  width: 1px;
+  height: @height-base;
+  margin: 0 32px;
+  background: @border-color-base;
+}

package/es/components/title/styles/search.less

@@ -0,0 +1,27 @@
+@import '~@zgfe/business-lib/es/assets/styles/inner.less';
+
+.search-title {
+  display: flex;
+  align-items: center;
+  height: 24px;
+  transition: all 0.3s;
+
+  &-title {
+    margin-right: 15px;
+  }
+
+  &-input {
+    min-width: 100px;
+    max-width: 200px;
+    height: 24px;
+    background-color: #fff !important;
+    .ant-input {
+      background-color: #fff !important;
+    }
+  }
+
+  &-icon {
+    color: #5f6085;
+    font-size: 12px;
+  }
+}

package/es/components/title/types.d.ts

@@ -0,0 +1,7 @@
+export interface TitleProps {
+    title?: string;
+    type?: string;
+    onSave?: () => void;
+    onSaveAs?: () => void;
+    onEditTitle?: (val: string) => void;
+}

package/es/components/title/types.js

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

package/es/constants/apis.d.ts

@@ -0,0 +1,10 @@
+declare const Apis: {
+    delPanelElement: string;
+    updateElementName: string;
+    eventAnalytics: string;
+    download: string;
+    queryScenesOfGroup: string;
+    updateElemet: string;
+    getAnalyseData: string;
+};
+export default Apis;

package/es/constants/apis.js

@@ -0,0 +1,10 @@
+var Apis = {
+  delPanelElement: '/apppanel/delPanelElement.jsp',
+  updateElementName: '/apppanel/updateElementName.jsp',
+  eventAnalytics: '/zg/web/v2/insight/analysis',
+  download: '/zg/web/v2/insight/download',
+  queryScenesOfGroup: '/scene/queryScenesOfGroup.jsp',
+  updateElemet: '/apppanel/updateElemet.jsp',
+  getAnalyseData: '/zg/web/v2/attribution/getAnalyseData'
+};
+export default Apis;

package/es/constants/chart.d.ts

@@ -0,0 +1,2 @@
+import { ChartItemProp } from '../types';
+export declare const chartTypeOptions: ChartItemProp[];

package/es/constants/chart.js

@@ -0,0 +1,24 @@
+import { IconFont } from '@zgfe/business-lib';
+import React from 'react';
+export var chartTypeOptions = [{
+  label: '趋势图',
+  value: 'line',
+  icon: /*#__PURE__*/React.createElement(IconFont, {
+    type: "qushitu1",
+    size: 16
+  })
+}, {
+  label: '汇总图',
+  value: 'bar',
+  icon: /*#__PURE__*/React.createElement(IconFont, {
+    type: "huizongtu",
+    size: 16
+  })
+}, {
+  label: '地图',
+  value: 'map',
+  icon: /*#__PURE__*/React.createElement(IconFont, {
+    type: "ditu",
+    size: 16
+  })
+}];

package/es/constants/color.d.ts

@@ -0,0 +1 @@
+export declare const chartColors: string[];

package/es/constants/color.js

@@ -0,0 +1 @@
+export var chartColors = ['#165DFF', '#80E1D9', '#65789B', '#F8BC3B', '#6F66ED', '#66AFED', '#9661BC', '#FF7557', '#4DB273', '#F08BB4', '#CDDBFD', '#CDF3F0', '#CED4DE', '#FCE7B9', '#D1CEFD', '#D3E7F9', '#DFCFEA', '#FFD1C7', '#BBDEC8', '#FFE0ED'];

package/es/constants/fields.d.ts

@@ -0,0 +1,146 @@
+import { SearchPanelTypes } from '../modules/searchPanel/types';
+export declare const chartTypes: {
+    label: string;
+    icon: string;
+    value: string;
+}[];
+export declare const addPanelFields: ({
+    label: string;
+    name: string;
+    extendName: string;
+    type: string;
+    options: never[];
+    children: string[];
+    fieldNames: {
+        label: string;
+        value: string;
+    };
+    rules: {
+        required: boolean;
+        message: string;
+    }[];
+    direction?: undefined;
+    dependenceFields?: undefined;
+} | {
+    label: string;
+    name: string;
+    type: string;
+    rules: {
+        required: boolean;
+        message: string;
+    }[];
+    extendName?: undefined;
+    options?: undefined;
+    children?: undefined;
+    fieldNames?: undefined;
+    direction?: undefined;
+    dependenceFields?: undefined;
+} | {
+    label: string;
+    name: string;
+    type: string;
+    options: {
+        label: string;
+        icon: string;
+        value: string;
+    }[];
+    rules: {
+        required: boolean;
+        message: string;
+    }[];
+    extendName?: undefined;
+    children?: undefined;
+    fieldNames?: undefined;
+    direction?: undefined;
+    dependenceFields?: undefined;
+} | {
+    label: string;
+    name: string;
+    type: string;
+    direction: string;
+    dependenceFields: {
+        chart: string;
+    };
+    options: {
+        label: string;
+        value: string;
+    }[];
+    rules: {
+        required: boolean;
+        message: string;
+    }[];
+    extendName?: undefined;
+    children?: undefined;
+    fieldNames?: undefined;
+})[];
+export declare const editPanelFields: ({
+    label: string;
+    name: string;
+    type: string;
+    options: {
+        label: string;
+        icon: string;
+        value: string;
+    }[];
+    rules: {
+        required: boolean;
+        message: string;
+    }[];
+    direction?: undefined;
+    dependenceFields?: undefined;
+} | {
+    label: string;
+    name: string;
+    type: string;
+    direction: string;
+    dependenceFields: {
+        chart: string;
+    };
+    options: {
+        label: string;
+        value: string;
+    }[];
+    rules: {
+        required: boolean;
+        message: string;
+    }[];
+})[];
+export declare const addSceneFields: ({
+    label: string;
+    name: string;
+    type: string;
+    options: never[];
+    fieldNames: {
+        label: string;
+        value: string;
+    };
+    rules: {
+        required: boolean;
+        message: string;
+    }[];
+} | {
+    label: string;
+    name: string;
+    type: string;
+    rules: {
+        required: boolean;
+        message: string;
+    }[];
+    options?: undefined;
+    fieldNames?: undefined;
+})[];
+export declare const searchFields: SearchPanelTypes.FieldProp[];
+export declare const indexObject: {
+    [key: string]: string;
+};
+export declare const BuiltinIndicators: {
+    id: number;
+    name: string;
+    eventList: {
+        name: string;
+        id: number;
+        type: string;
+        isBuiltIn: boolean;
+        attrList: never[];
+    }[];
+};

package/es/constants/fields.js

@@ -0,0 +1,179 @@
+export var chartTypes = [{
+  label: '表格',
+  icon: 'biaoge',
+  value: 'grid'
+}];
+export var addPanelFields = [{
+  label: '看板',
+  name: 'panel',
+  extendName: 'range',
+  type: 'selectToInput',
+  options: [],
+  children: ['range'],
+  fieldNames: {
+    label: 'name',
+    value: 'id'
+  },
+  rules: [{
+    required: true,
+    message: '请选择看板'
+  }]
+}, {
+  label: '名称',
+  name: 'name',
+  type: 'input',
+  rules: [{
+    required: true,
+    message: '请输入名称'
+  }]
+}, {
+  label: '样式',
+  name: 'chart',
+  type: 'tab',
+  options: chartTypes,
+  rules: [{
+    required: true,
+    message: '请选择图表'
+  }]
+}, {
+  label: '显示',
+  name: 'show',
+  type: 'radio',
+  direction: 'vertical',
+  dependenceFields: {
+    chart: 'line'
+  },
+  options: [{
+    label: '动态显示数据最多的10个分组',
+    value: 'dynamic'
+  }, {
+    label: '固定显示当前选择的分组',
+    value: 'fix'
+  }],
+  rules: [{
+    required: true,
+    message: '请选择'
+  }]
+}];
+export var editPanelFields = [{
+  label: '样式',
+  name: 'chart',
+  type: 'tab',
+  options: chartTypes,
+  rules: [{
+    required: true,
+    message: '请选择图表'
+  }]
+}, {
+  label: '显示',
+  name: 'show',
+  type: 'radio',
+  direction: 'vertical',
+  dependenceFields: {
+    chart: 'line'
+  },
+  options: [{
+    label: '动态显示数据最多的10个分组',
+    value: 'dynamic'
+  }, {
+    label: '固定显示当前选择的分组',
+    value: 'fix'
+  }],
+  rules: [{
+    required: true,
+    message: '请选择'
+  }]
+}];
+export var addSceneFields = [{
+  label: '场景分类',
+  name: 'class',
+  type: 'selectToInput',
+  options: [],
+  fieldNames: {
+    label: 'groupName',
+    value: 'groupId'
+  },
+  rules: [{
+    required: true,
+    message: '请选择场景分类'
+  }]
+}, {
+  label: '场景名称',
+  name: 'name',
+  type: 'input',
+  rules: [{
+    required: true,
+    message: '请输入场景名称'
+  }]
+}];
+export var searchFields = [{
+  key: 'mi-targetFilters',
+  type: 'targetFilters',
+  name: 'targetFilters',
+  label: '目标事件',
+  max: 1,
+  addLabel: '',
+  tips: '目标事件通常为购买、付费、支付等事件',
+  required: true
+}, {
+  key: 'mi-sourceFilters',
+  type: 'sourceFilters',
+  name: 'sourceFilters',
+  label: '待归因事件',
+  max: 10,
+  addLabel: '待归因事件',
+  tips: '参与归因计算的事件，通常为广告、运营位的点击事件',
+  required: true
+}, {
+  key: 'mi-globalFilters',
+  type: 'globalFilters',
+  name: 'globalFilters',
+  label: '全局属性',
+  max: 5,
+  addLabel: '添加属性',
+  required: false
+}];
+export var indexObject = {
+  number: '人数',
+  times: '次数',
+  per: '人均次数',
+  sum: '总和',
+  avg: '均值',
+  duration_times: '分布',
+  median: '中位数'
+};
+export var BuiltinIndicators = {
+  id: -2,
+  name: '整体',
+  eventList: [{
+    name: '新增用户',
+    id: -201,
+    type: 'add',
+    isBuiltIn: true,
+    attrList: []
+  }, {
+    name: '活跃用户',
+    id: -202,
+    type: 'active',
+    isBuiltIn: true,
+    attrList: []
+  }, {
+    name: '访问次数',
+    id: -203,
+    type: 'times',
+    isBuiltIn: true,
+    attrList: []
+  }, {
+    name: '平均使用时长',
+    id: -204,
+    type: 'duration_avg',
+    isBuiltIn: true,
+    attrList: []
+  }, {
+    name: '使用时长分布',
+    id: -205,
+    type: 'duration',
+    isBuiltIn: true,
+    attrList: []
+  }]
+};

package/es/constants/index.d.ts

@@ -0,0 +1,6 @@
+import Apis from './apis';
+import { chartTypeOptions } from './chart';
+import { chartColors } from './color';
+import { chartTypes, addPanelFields, editPanelFields, addSceneFields, searchFields } from './fields';
+import { initTarget, initEvent, getInitDate } from './initData';
+export { Apis, chartTypeOptions, chartColors, chartTypes, addPanelFields, editPanelFields, addSceneFields, searchFields, initTarget, initEvent, getInitDate, };

package/es/constants/index.js

@@ -0,0 +1,6 @@
+import Apis from './apis';
+import { chartTypeOptions } from './chart';
+import { chartColors } from './color';
+import { chartTypes, addPanelFields, editPanelFields, addSceneFields, searchFields } from './fields';
+import { initTarget, initEvent, getInitDate } from './initData';
+export { Apis, chartTypeOptions, chartColors, chartTypes, addPanelFields, editPanelFields, addSceneFields, searchFields, initTarget, initEvent, getInitDate };

package/es/constants/initData.d.ts

@@ -0,0 +1,17 @@
+import { DatePickerTypes } from '@zgfe/business-lib/es/datePicker/types';
+export declare const initTarget: {
+    type: string;
+    alias: string;
+    eventId: number;
+    eventName: string;
+    eventGroupId: number;
+    analysisDimension: {
+        analysisIndex: string;
+    };
+}[];
+export declare const initEvent: {
+    id: number;
+    name: string;
+    attrList: never[];
+};
+export declare function getInitDate(includeToday?: boolean): DatePickerTypes.Value;

package/es/constants/initData.js

@@ -0,0 +1,24 @@
+import moment from 'moment';
+export var initTarget = [{
+  type: 'event',
+  alias: '事件概览',
+  eventId: -100,
+  eventName: '事件概览',
+  eventGroupId: 0,
+  analysisDimension: {
+    analysisIndex: 'number'
+  }
+}];
+export var initEvent = {
+  id: -100,
+  name: '事件概览',
+  attrList: []
+};
+export function getInitDate(includeToday) {
+  return {
+    unit: 'day',
+    relative: [7, 0],
+    begin: moment().subtract(7, 'days').format('YYYY-MM-DD'),
+    end: moment().subtract(includeToday ? 0 : 1, 'days').format('YYYY-MM-DD')
+  };
+}

package/es/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference path="../typings.d.ts" />
+import AttributionHome from './modules/home';
+export { AttributionHome };

package/es/index.js

@@ -0,0 +1,2 @@
+import AttributionHome from './modules/home';
+export { AttributionHome };

package/es/modules/content/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { InsightContentProps } from './types';
+import './styles/index.less';
+declare const InsightContent: React.ForwardRefExoticComponent<InsightContentProps.Props & React.RefAttributes<any>>;
+export default InsightContent;