@zgfe/modules-event 0.0.2-alpha.2 → 0.0.2-alpha.23

package/es/modules/content/index.js

@@ -7,31 +7,29 @@ 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 = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { ajax, BizGlobalDataContext, BizLayout, BizTargetFromPanelContext, BizUserGroupHeader } from '@zgfe/business-lib';
+import { ajax, BizGlobalDataContext, BizLayout, BizTargetFromPanelContext } from '@zgfe/business-lib';
 import React, { useContext, useEffect, useRef, useState } from 'react';
 import Request from 'umi-request';
 import TopBar from '../../components/topBar';
 import { EventContext } from '../../types';
 import './styles/index.less';
 import { Apis } from '../../constants';
-import { judgeIsCity, judgeIsArea } from './utils';
+import { judgeIsCity, judgeIsArea, getValue } from './utils';
 import { ContentPanel, SearchPanel } from '../../components';
 import { getDefaultShow } from '../../utils/formData';
-import { Form, Button } from 'antd';
-import EventFilter from '../../components/eventFilter';
+import TopPanel from '../topPanel';
 var timer = 0;
 var ajaxFlag = true;
 var CancelToken = Request.CancelToken;
 var cancel;
 var classPrefix = 'event-content';
 var EventContent = function EventContent(props) {
-  var _Form$useForm = Form.useForm(),
-    _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
-    form = _Form$useForm2[0];
   var _useState = useState(props.value),
     _useState2 = _slicedToArray(_useState, 2),
     finalSearchData = _useState2[0],
     setFinalSearchData = _useState2[1];
+  var _useContext = useContext(BizGlobalDataContext),
+    currentApp = _useContext.currentApp;
   var _useState3 = useState(),
     _useState4 = _slicedToArray(_useState3, 2),
     eventData = _useState4[0],
@@ -52,26 +50,32 @@ var EventContent = function EventContent(props) {
     _useState12 = _slicedToArray(_useState11, 2),
     isCity = _useState12[0],
     setIsCity = _useState12[1];
-  var _useContext = useContext(BizGlobalDataContext),
-    currentApp = _useContext.currentApp;
+  var _useState13 = useState(-1),
+    _useState14 = _slicedToArray(_useState13, 2),
+    eventId = _useState14[0],
+    setEventId = _useState14[1];
   var _useContext2 = useContext(EventContext),
-    panelId = _useContext2.panelId,
     searchData = _useContext2.searchData,
-    setSearchData = _useContext2.setSearchData;
+    setSearchData = _useContext2.setSearchData,
+    eventGroupList = _useContext2.eventGroupList,
+    eventEnvList = _useContext2.eventEnvList,
+    userPropList = _useContext2.userPropList;
   var _useContext3 = useContext(BizTargetFromPanelContext),
     handleSearch = _useContext3.handleSearch;
-  var chartRef = useRef();
   var collapseRef = useRef();
   useEffect(function () {
-    if (props.value && props.value.filterConditions && props.value.filterConditions[0].id !== -1) {
-      setEventId(props.value.filterConditions[0].id);
+    if (props.defaultValue) {
+      setEventId(props.defaultValue.id);
     }
-  }, []);
+  }, [props.defaultValue]);
   useEffect(function () {
-    if (searchData && searchData.filterConditions && searchData.filterConditions[0].eventAttr) {
-      var _attrName = searchData.filterConditions[0].eventAttr.name;
-      setEnableSelectChart(judgeIsArea(_attrName));
-      setIsCity(judgeIsCity(_attrName));
+    if (searchData && searchData.dimension) {
+      var _getValue;
+      var _attrName = (_getValue = getValue(searchData.dimension, eventGroupList, eventEnvList, userPropList)) === null || _getValue === void 0 ? void 0 : _getValue.name;
+      if (_attrName) {
+        setEnableSelectChart(judgeIsArea(_attrName));
+        setIsCity(judgeIsCity(_attrName));
+      }
     }
     if (timer) clearTimeout(timer);
     var flag = true;
@@ -88,7 +92,8 @@ var EventContent = function EventContent(props) {
   useEffect(function () {
     handleSearch && handleSearch(loading);
   }, [loading]);
-  var fetchRequest = function fetchRequest() {
+  var fetchRequest = function fetchRequest(flag) {
+    if (flag !== undefined) ajaxFlag = flag;
     if (!ajaxFlag) return;
     setLoading(true);
     setEventData(undefined);
@@ -130,98 +135,21 @@ var EventContent = function EventContent(props) {
   var onChangeShow = function onChangeShow(data) {
     setShowList(data);
   };
-  var onFinish = function onFinish(values) {
-    console.log('onFinish', values);
-  };
-  var _useState13 = useState(-1),
-    _useState14 = _slicedToArray(_useState13, 2),
-    eventId = _useState14[0],
-    setEventId = _useState14[1];
-  var onValuesChange = function onValuesChange(data) {
-    console.log('onValuesChange', data);
-    var _data = {};
-    if (data.filterConditions) {
-      if (data.filterConditions.id !== -100) {
-        _data.filterConditions = [data.filterConditions];
-      } else {
-        _data.filterConditions = undefined;
-      }
-      if (finalSearchData && finalSearchData.filterConditions && data.filterConditions.id === finalSearchData.filterConditions[0].id) {
-        ajaxFlag = false;
-      }
-    } else if (data.userGroup) {
-      _data.userGroup = [];
-      data.userGroup.map(function (item) {
-        _data.userGroup.push(item.id);
-      });
-      if (_data.userGroup.length <= 0) _data.userGroup = [0];
-    } else {
-      _data = _objectSpread({}, data);
-    }
-    setSearchData(function (_searchData) {
-      return _objectSpread(_objectSpread({}, _searchData), _data);
-    });
-    if (data.event && data.event.id !== -1) {
-      setEventId(data.event.id);
-    }
-  };
   var platformChange = function platformChange(data) {
     ajaxFlag = true;
     setSearchData(function (_searchData) {
-      return _objectSpread(_objectSpread({}, _searchData), data);
+      return _objectSpread(_objectSpread({}, _searchData), {}, {
+        platform: data
+      });
     });
   };
-  var resetting = function resetting() {
-    form.resetFields();
-    form.setFieldsValue({
-      userGroup: [{
-        id: 0
-      }],
-      filterConditions: null
+  var onChangeSearch = function onChangeSearch(data, flag) {
+    ajaxFlag = flag;
+    data.id ? setEventId(data.id) : setEventId(-1);
+    setSearchData(function (_searchData) {
+      return _objectSpread(_objectSpread({}, _searchData), data);
     });
-    props.initSearch && props.initSearch();
   };
-  var topPanel = /*#__PURE__*/React.createElement(Form, {
-    form: form,
-    component: "div",
-    colon: false,
-    layout: "vertical",
-    onFinish: onFinish,
-    scrollToFirstError: true,
-    initialValues: {
-      userGroup: searchData && searchData.userGroup ? searchData.userGroup.map(function (item) {
-        return {
-          id: item
-        };
-      }) : [{
-        id: 0
-      }],
-      filterConditions: panelId ? searchData === null || searchData === void 0 ? void 0 : searchData.filterConditions : null
-    },
-    onValuesChange: onValuesChange
-  }, /*#__PURE__*/React.createElement(Form.Item, {
-    label: "",
-    name: "userGroup"
-  }, /*#__PURE__*/React.createElement(BizUserGroupHeader, {
-    max: 3
-  })), /*#__PURE__*/React.createElement(Form.Item, {
-    label: "\u4E8B\u4EF6",
-    name: "filterConditions",
-    style: {
-      paddingLeft: '24px'
-    }
-  }, /*#__PURE__*/React.createElement(EventFilter, null)), /*#__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() {
-      ajaxFlag = true;
-      fetchRequest();
-    }
-  }, "\u67E5\u8BE2")));
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TopBar, {
     searchData: searchData,
     platformChange: platformChange
@@ -231,11 +159,17 @@ var EventContent = function EventContent(props) {
     collapseRef: collapseRef,
     topPanel: /*#__PURE__*/React.createElement("div", {
       ref: collapseRef
-    }, topPanel)
+    }, /*#__PURE__*/React.createElement(TopPanel, {
+      onChange: onChangeSearch,
+      defaultValue: searchData,
+      ajaxFlag: ajaxFlag,
+      finalSearchData: finalSearchData,
+      fetchRequest: fetchRequest
+    }))
   }, /*#__PURE__*/React.createElement("div", {
     className: classPrefix
   }, /*#__PURE__*/React.createElement(SearchPanel, {
-    chart: searchData === null || searchData === void 0 ? void 0 : searchData.chartType,
+    chartType: searchData === null || searchData === void 0 ? void 0 : searchData.chartType,
     time: searchData === null || searchData === void 0 ? void 0 : searchData.time,
     analysisAttr: searchData === null || searchData === void 0 ? void 0 : searchData.analysisAttr,
     analysisIndex: searchData === null || searchData === void 0 ? void 0 : searchData.analysisIndex,
@@ -243,7 +177,6 @@ var EventContent = function EventContent(props) {
     enableSelectChart: enableSelectChart,
     onChange: onChangeContent
   }), /*#__PURE__*/React.createElement(ContentPanel, {
-    ref: chartRef,
     loading: loading,
     isCity: isCity,
     eventData: eventData,

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

@@ -4,15 +4,4 @@
     justify-content: flex-end;
     margin-bottom: 16px;
   }
-  &-form-botton-box {
-    display: flex;
-    justify-content: flex-end;
-    margin-top: 24px;
-    > :nth-child(1) {
-      margin-right: 16px;
-      color: #fff;
-      background-color: #29bd52;
-      border-color: #29bd52;
-    }
-  }
 }

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

@@ -1,6 +1,7 @@
 import { SearchValue } from '../../types';
 export declare namespace EventContentProps {
     interface Props {
+        defaultValue?: SearchValue;
         value: SearchValue;
         show?: string[];
         onSearching?: (flag: boolean) => void;

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

@@ -1,2 +1,6 @@
+import { AttributeSelect } from '@zgfe/business-lib';
+import { bizAttributeSelectorValueProp } from '../../types';
+import { EventGroup, UserProp, EnvProp } from '@zgfe/business-lib/es/attributeSelector/types';
 export declare const judgeIsCity: (name: string | undefined) => boolean;
 export declare const judgeIsArea: (name: string | undefined) => boolean;
+export declare const getValue: (param: bizAttributeSelectorValueProp, eventGroupList: EventGroup[] | undefined, eventEnvList: EnvProp[] | undefined, userPropList: UserProp[] | undefined) => AttributeSelect.Value | undefined;

package/es/modules/content/utils.js

@@ -5,4 +5,27 @@ export var judgeIsCity = function judgeIsCity(name) {
 export var judgeIsArea = function judgeIsArea(name) {
   var areaData = ['current_area', 'current_city', 'area', 'city'];
   return name && areaData.indexOf(name) !== -1 ? true : false;
+};
+export var getValue = function getValue(param, eventGroupList, eventEnvList, userPropList) {
+  var res = undefined;
+  var key = param.propCategory === 'eventProp' ? param.value : param.propCategory + '-' + param.value;
+  if ((param === null || param === void 0 ? void 0 : param.propCategory) === 'envProp') {
+    eventEnvList === null || eventEnvList === void 0 ? void 0 : eventEnvList.forEach(function (attr) {
+      if (attr.key === key) res = attr;
+    });
+  } else if ((param === null || param === void 0 ? void 0 : param.propCategory) === 'eventProp') {
+    eventGroupList === null || eventGroupList === void 0 ? void 0 : eventGroupList.forEach(function (group) {
+      group.eventList.forEach(function (event) {
+        event.attrList.forEach(function (attr) {
+          if (attr.key === key) res = attr;
+        });
+      });
+    });
+  } else if ((param === null || param === void 0 ? void 0 : param.propCategory) === 'userProp') {
+    userPropList === null || userPropList === void 0 ? void 0 : userPropList.forEach(function (attr) {
+      if (attr.key === key) res = attr;
+    });
+  }
+  console.log('获取当前属性的全部数据', res);
+  return res;
 };

package/es/modules/home/demo/create.js

@@ -9,7 +9,7 @@ import { DemoWrapper, setGlobalConfig } from '@zgfe/business-lib';
 import { ModuleEvent } from '../../../index';
 import { requestConfig } from '../../../utils/ajaxConfig';
 import { Button } from 'antd';
-var defaultValue = {};
+var defaultValue = null;
 export default (function () {
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),

package/es/modules/home/demo/edit.js

@@ -10,54 +10,43 @@ import { ModuleEvent } from '../../../index';
 import { requestConfig } from '../../../utils/ajaxConfig';
 import { Button } from 'antd';
 var defaultValue = {
-  id: 243217,
-  name: '事件分析1',
+  id: 7565,
+  name: '测试6666',
   type: 0,
   enlarged: 0,
   panelId: 400900,
   panelType: 'edit',
   data: {
-    appId: 204,
     chartType: 'line',
-    platform: 0,
-    userGroup: [959, 962],
-    analysisIndex: 'number',
-    userAttr: '',
+    analysisIndex: 'per',
+    id: 7565,
+    name: '测试6666',
+    appId: 266,
+    platform: 1,
+    userGroup: [933, 935],
     time: {
       unit: 'day',
-      relative: [7, 0],
-      begin: '2023-08-03',
-      end: '2023-08-10'
+      relative: [14, 0],
+      begin: '2023-08-04',
+      end: '2023-08-18'
     },
-    filterConditions: [{
-      type: 'event',
-      alias: '崩溃',
-      id: 6606,
-      name: '崩溃',
-      eventGroupId: -1,
-      marked: false,
-      filters: {
-        relation: 'and',
-        conditions: [{
-          attrId: 142787,
-          propCategory: 'eventProp',
-          type: 1,
-          operator: 'equal',
-          values: ['com.zhuge.demo:main'],
-          dimensionSub: 'event_attr',
-          label: '异常进程名称',
-          attrName: '异常进程名称'
-        }]
-      },
-      eventAttr: {
-        id: 142787,
+    dimension: {
+      propCategory: 'eventProp',
+      value: 151045
+    },
+    filters: {
+      relation: 'and',
+      conditions: [{
+        attrId: 151045,
         propCategory: 'eventProp',
-        type: 2,
+        type: 1,
+        operator: 'equal',
+        values: ['55'],
         dimensionSub: 'event_attr',
-        label: '异常进程名称',
-        name: '异常进程名称'
-      }
-    }]
+        label: '应用名称',
+        attrName: '应用名称'
+      }]
+    }
   }
 };
 export default (function () {
@@ -87,7 +76,7 @@ export default (function () {
   };
   return /*#__PURE__*/React.createElement(DemoWrapper, {
     needMeta: true,
-    defaultApp: 204
+    defaultApp: 266
   }, isDetail ? /*#__PURE__*/React.createElement("div", null, JSON.stringify(detailParams), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Button, {
     onClick: function onClick() {
       return setIsDetail(false);

package/es/modules/home/demo/scene.js

@@ -10,29 +10,41 @@ import { ModuleEvent } from '../../../index';
 import { requestConfig } from '../../../utils/ajaxConfig';
 import { Button } from 'antd';
 var defaultValue = {
-  source: 'SCENE',
   data: {
-    app_id: 177,
-    targets: [{
-      type: 'event',
-      alias: '事件概览',
-      eventId: -100,
-      eventName: '事件概览',
-      eventGroupId: 0,
-      analysisDimension: {
-        analysisIndex: 'number'
-      }
-    }],
-    userGroup: [0],
+    module: 'event',
+    analysisIndex: 'times',
+    chartType: 'line',
+    name: 'wqeqwe',
     time: {
-      unit: 'month',
-      relative: [3, 1],
-      begin: '2022-09-27',
-      end: '2022-12-27'
+      unit: 'day',
+      end: '2023-08-19',
+      begin: '2023-08-05',
+      relative: [14, 0]
+    },
+    id: 7569,
+    filters: {
+      conditions: [{
+        attrId: 151053,
+        propCategory: 'eventProp',
+        values: ['111'],
+        dimensionSub: 'event_attr',
+        label: '应用名称',
+        type: 1,
+        operator: 'equal',
+        attrName: '应用名称'
+      }],
+      relation: 'and'
     },
-    chartType: 'line'
+    appId: 266,
+    userGroup: [0],
+    dimension: {
+      propCategory: 'eventProp',
+      value: 151053
+    }
   },
-  chosen_data: []
+  chosen_data: [],
+  source: 'EVENT',
+  enableAddScene: false
 };
 export default (function () {
   var _useState = useState(false),
@@ -61,7 +73,7 @@ export default (function () {
   };
   return /*#__PURE__*/React.createElement(DemoWrapper, {
     needMeta: true,
-    defaultApp: 254
+    defaultApp: 266
   }, isDetail ? /*#__PURE__*/React.createElement("div", null, JSON.stringify(detailParams), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Button, {
     onClick: function onClick() {
       return setIsDetail(false);

package/es/modules/home/index.js

@@ -17,9 +17,14 @@ import EventContent from '../content';
 import { chartTypes } from '../../constants';
 var classPrefix = 'event-container';
 var ModuleEvent = function ModuleEvent(props) {
+  console.log('ModuleEvent-props', props);
   var _useContext = useContext(BizGlobalDataContext),
-    userGroupList = _useContext.userGroupList,
-    currentApp = _useContext.currentApp;
+    currentApp = _useContext.currentApp,
+    eventGroupList = _useContext.eventGroupList,
+    eventEnvList = _useContext.eventEnvList,
+    userPropList = _useContext.userPropList,
+    userGroupList = _useContext.userGroupList;
+  console.log('BizGlobalDataContext', eventGroupList, eventEnvList, userPropList);
   var _useState = useState(),
     _useState2 = _slicedToArray(_useState, 2),
     searchData = _useState2[0],
@@ -100,16 +105,20 @@ var ModuleEvent = function ModuleEvent(props) {
     value: {
       panelId: panelId,
       elementId: elementId,
+      eventGroupList: eventGroupList,
+      eventEnvList: eventEnvList,
+      userPropList: userPropList,
       searchData: searchData,
       setSearchData: setSearchData,
       panelName: title,
       includeToday: props.includeToday,
-      enableAddScene: props.enableAddScene && (!props.defaultValue || props.defaultValue.source === 'EVENT'),
+      enableAddScene: props.defaultValue && props.defaultValue.enableAddScene === false ? false : true,
       changeLoading: changeLoading,
       afterEditTarget: props.afterEditTarget,
       onUserDrill: props.onUserDrill
     }
   }, /*#__PURE__*/React.createElement(EventContent, {
+    defaultValue: props.defaultValue ? props.defaultValue.data : undefined,
     value: searchData,
     show: showList,
     onChange: setSearchData,

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

@@ -2,7 +2,7 @@
   width: 100%;
   min-width: 1000px;
   height: 100%;
-  overflow: hidden;
+  background: #fafafb;
   &-header-title {
     height: 48px;
     padding: 0px 24px;
@@ -14,7 +14,7 @@
   }
   .biz-layout-top {
     margin-top: 2px;
-    padding: 24px 24px 24px 0;
+    padding-top: 0;
     .biz-user-group-header {
       .ant-space-item {
         color: #5f6085;
@@ -37,4 +37,8 @@
   .biz-select-overlay {
     max-height: 300px;
   }
+
+  .biz-layout-panel-content {
+    height: auto;
+  }
 }

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

@@ -1,11 +1,10 @@
-import { SearchValue } from '../../types';
+import { SearchValue, UserDrillParamsProp } from '../../types';
 export declare namespace EventProps {
     interface Props {
         defaultValue?: Value;
         includeToday?: boolean;
-        enableAddScene?: boolean;
         afterEditTarget?: (type: string, value?: any) => void;
-        onUserDrill: (data: any, searchData: SearchValue) => void;
+        onUserDrill: (data: UserDrillParamsProp, searchData: SearchValue) => void;
     }
     interface Value {
         panelId?: number;
@@ -13,8 +12,18 @@ export declare namespace EventProps {
         source?: string;
         name?: string;
         id?: number;
-        data?: any;
+        data?: SearchValue;
         chosen_data?: string[];
         [props: string]: any;
     }
+    interface ColumnsDataType {
+        color: string;
+        eventName?: string;
+        id: number;
+        dimension?: string;
+        name: string;
+        nameGroup: string;
+        userGroup: string;
+        [x: string]: string | number | undefined;
+    }
 }

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

@@ -0,0 +1,5 @@
+import React from 'react';
+import './styles/index.less';
+import { TopPanelProps } from './types';
+declare const TopPanel: React.FC<TopPanelProps>;
+export default TopPanel;

package/es/modules/topPanel/index.js

@@ -0,0 +1,110 @@
+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 = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React from 'react';
+import { Form, Button } from 'antd';
+import { 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 id = defaultValue.id,
+    name = defaultValue.name,
+    dimension = defaultValue.dimension,
+    filters = defaultValue.filters,
+    userGroup = defaultValue.userGroup;
+  var onValuesChange = function onValuesChange(data, allData) {
+    var _data = {};
+    if (allData.filterConditions) {
+      if (allData.filterConditions.id !== -100) {
+        _data = allData.filterConditions;
+      }
+    }
+    if (allData.userGroup) {
+      _data.userGroup = [];
+      allData.userGroup.map(function (item) {
+        _data.userGroup && _data.userGroup.push(item.id);
+      });
+      if (_data.userGroup.length <= 0) _data.userGroup = [0];
+    }
+    if (data.filterConditions) {
+      if (finalSearchData && finalSearchData.id && data.filterConditions.id === finalSearchData.id) {
+        ajaxFlag = false;
+      } else {
+        ajaxFlag = true;
+      }
+    }
+    props.onChange(_data, ajaxFlag);
+  };
+  var resetting = function resetting() {
+    form.resetFields();
+    form.setFieldsValue({
+      userGroup: [{
+        id: 0
+      }],
+      filterConditions: null
+    });
+    props.onChange({
+      userGroup: [0],
+      id: undefined,
+      name: undefined,
+      filters: undefined,
+      dimension: undefined
+    }, true);
+  };
+  return /*#__PURE__*/React.createElement(Form, {
+    form: form,
+    component: "div",
+    colon: false,
+    layout: "vertical",
+    initialValues: {
+      userGroup: userGroup ? userGroup.map(function (item) {
+        return {
+          id: item
+        };
+      }) : [{
+        id: 0
+      }],
+      filterConditions: {
+        id: id,
+        name: name,
+        dimension: dimension,
+        filters: filters
+      }
+    },
+    scrollToFirstError: true,
+    onValuesChange: onValuesChange
+  }, /*#__PURE__*/React.createElement(Form.Item, {
+    label: "",
+    name: "userGroup"
+  }, /*#__PURE__*/React.createElement(BizUserGroupHeader, {
+    max: 3
+  })), /*#__PURE__*/React.createElement(Form.Item, {
+    label: "\u4E8B\u4EF6",
+    name: "filterConditions",
+    style: {
+      paddingLeft: '24px'
+    }
+  }, /*#__PURE__*/React.createElement(EventFilter, null)), /*#__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;