@zgfe/modules-whole 1.0.10-zhongyuan.0

package/es/components/searchPanel/index.js

@@ -0,0 +1,164 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+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 { BizDatePickerV2, BizGlobalDataContext, BizSelect, IconFont, ajax } from '@zgfe/business-lib';
+import React, { useContext, useEffect, useState } from 'react';
+import { Apis, chartTypeOptions, getInitDate } from '../../constants';
+import { WholeContext } from '../../types';
+import './styles/index.less';
+import { Button, message } from 'antd';
+import base64 from '../../utils/base64';
+var classPrefix = 'search-panel';
+var SearchPanel = function SearchPanel(props) {
+  var _useContext = useContext(WholeContext),
+    includeToday = _useContext.includeToday,
+    refreshLoading = _useContext.refreshLoading,
+    searchData = _useContext.searchData,
+    currentApp = _useContext.currentApp,
+    disableItemList = _useContext.disableItemList,
+    setSearchData = _useContext.setSearchData;
+  var _useContext2 = useContext(BizGlobalDataContext),
+    authority = _useContext2.authority;
+  var _useState = useState(props.time || getInitDate(includeToday)),
+    _useState2 = _slicedToArray(_useState, 2),
+    time = _useState2[0],
+    setTime = _useState2[1];
+  var _useState3 = useState(chartTypeOptions[0]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    chart = _useState4[0],
+    setChart = _useState4[1];
+  useEffect(function () {
+    var val = getInitDate(includeToday);
+    setTime(val);
+  }, [includeToday]);
+  useEffect(function () {
+    if (searchData.chartType && searchData.chartType !== chart.value) {
+      if (searchData.chartType.indexOf(',') !== -1) {
+        setChart({
+          value: searchData.chartType.split(',')[0]
+        });
+      } else {
+        setChart({
+          value: searchData.chartType
+        });
+      }
+    }
+  }, [searchData]);
+  useEffect(function () {
+    var currentChart = chartTypeOptions.filter(function (item) {
+      return !disableItemList.some(function (it) {
+        return it == item.value;
+      });
+    })[0];
+    if (searchData.chartType && disableItemList.some(function (it) {
+      return it == searchData.chartType;
+    }) && searchData.chartType !== currentChart.value) {
+      setSearchData(_objectSpread(_objectSpread({}, searchData), {}, {
+        chartType: currentChart.value
+      }));
+      setChart(currentChart);
+      props.onChange && props.onChange({
+        chartType: currentChart.value
+      });
+    }
+  }, [disableItemList]);
+  var onChangeTime = function onChangeTime(val) {
+    setTime(val);
+    props.onChange && props.onChange({
+      time: val
+    });
+  };
+  var onChange = function onChange(val) {
+    setChart(val);
+    props.onChange && props.onChange({
+      chartType: val.value
+    });
+  };
+  var download = function download() {
+    var _searchData$userGroup;
+    var seriesNames = [];
+    if (((_searchData$userGroup = searchData.userGroup) === null || _searchData$userGroup === void 0 ? void 0 : _searchData$userGroup.length) && searchData.userGroup[0] !== 0) {
+      seriesNames.push(base64.encode('用户群'));
+    }
+    if (searchData.dimension) {
+      var _searchData$dimension;
+      seriesNames.push(base64.encode((_searchData$dimension = searchData.dimension) === null || _searchData$dimension === void 0 ? void 0 : _searchData$dimension.label));
+    }
+    if (searchData.id && !searchData.dimension || !searchData.id) {
+      seriesNames.push(base64.encode('指标'));
+    }
+    var fname = "\u6574\u4F53\u5206\u6790_".concat(searchData.time.begin, "_").concat(searchData.time.end);
+    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,
+      analysisIndex: 'number'
+    }, searchData), {}, {
+      down: {
+        fname: base64.encode(fname),
+        titles: seriesNames
+      }
+    });
+    ajax(Apis.downloadReport, {
+      method: 'post',
+      data: params,
+      responseType: 'blob',
+      fileName: fname,
+      getResponse: true
+    }).then(function () {
+      message.success('下载成功！');
+    });
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: classPrefix
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex'
+    }
+  }, /*#__PURE__*/React.createElement(BizDatePickerV2, {
+    key: searchData.id,
+    includeToday: includeToday,
+    defaultValue: time,
+    onChange: onChangeTime,
+    selectRange: 365,
+    selectRangeUnit: "days"
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(classPrefix, "-search-right")
+  }, /*#__PURE__*/React.createElement(Button, {
+    className: "".concat(classPrefix, "-search-right-refresh"),
+    icon: /*#__PURE__*/React.createElement(IconFont, {
+      type: "zhongxinjiazai"
+    }),
+    loading: refreshLoading,
+    onClick: function onClick() {
+      return props.refreshHandle();
+    }
+  }, "\u5237\u65B0"), /*#__PURE__*/React.createElement(BizSelect, {
+    className: "".concat(classPrefix, "-select"),
+    options: chartTypeOptions,
+    value: chart,
+    labelField: "label",
+    keyField: "value",
+    theme: "secondary",
+    onChange: onChange,
+    disableItemList: disableItemList.map(function (item) {
+      return chartTypeOptions.find(function (it) {
+        return it.value == item;
+      });
+    })
+  }), /*#__PURE__*/React.createElement(Button, {
+    disabled: !authority[100042],
+    onClick: download
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    type: "xiazai1"
+  }), "\u4E0B\u8F7D")));
+};
+export default SearchPanel;

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

@@ -0,0 +1,22 @@
+@import '~@zgfe/business-lib/es/assets/styles/variable.less';
+
+.search-panel {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 32px;
+  margin-bottom: 16px;
+
+  &-search-right {
+    display: flex;
+    gap: 16px;
+    &-refresh {
+      display: flex !important;
+      gap: 4px;
+    }
+  }
+
+  &-select {
+    width: 112px;
+  }
+}

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

@@ -0,0 +1,23 @@
+import { DatePickerTypes } from '@zgfe/business-lib/es/datePicker/types';
+import { WholeChartTypes } from '../../types';
+import { ReactNode } from 'react';
+import { TargetConditionTypes } from '@zgfe/business-lib';
+export interface AnalysisSubject {
+    subjectId?: number;
+    id?: number;
+    name?: string;
+    unit?: string;
+    subjectAlias?: string;
+    subjectName?: string;
+}
+export interface SearchPanelProps {
+    refreshHandle: Function;
+    time?: DatePickerTypes.Value;
+    eventId?: number;
+    chartType?: WholeChartTypes;
+    optionNode?: ReactNode;
+    onChange?: (data: SearchPanelProps) => void;
+    setIsCity?: Function;
+    dimension?: TargetConditionTypes.DimensionValue;
+    setDimension?: Function;
+}

package/es/components/searchPanel/types.js

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

package/es/components/table/index.d.ts

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

package/es/components/table/index.js

@@ -0,0 +1,130 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+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, { useContext, useEffect, useMemo, useState } from 'react';
+import { BizGlobalDataContext } from '@zgfe/business-lib';
+import { Table, ConfigProvider, Empty } from 'antd';
+import { formTableData, getColumns } from '../../utils/formData';
+import './styles/index.less';
+import { WholeContext } from '../../types';
+var classPrefix = 'event-mi-table';
+var WholeTable = function WholeTable(props) {
+  var dataSource = props.dataSource,
+    searchData = props.searchData,
+    showList = props.showList,
+    sourcePanel = props.sourcePanel;
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    tableData = _useState2[0],
+    setTableData = _useState2[1];
+  var _useContext = useContext(BizGlobalDataContext),
+    _useContext$eventGrou = _useContext.eventGroupList,
+    eventGroupList = _useContext$eventGrou === void 0 ? [] : _useContext$eventGrou,
+    eventEnvList = _useContext.eventEnvList,
+    userPropList = _useContext.userPropList;
+  var _useContext2 = useContext(WholeContext),
+    onUserDrill = _useContext2.onUserDrill,
+    panelName = _useContext2.panelName,
+    currentApp = _useContext2.currentApp;
+  var _useState3 = useState(1),
+    _useState4 = _slicedToArray(_useState3, 2),
+    current = _useState4[0],
+    setCurrent = _useState4[1];
+  var _useState5 = useState(10),
+    _useState6 = _slicedToArray(_useState5, 2),
+    pageSize = _useState6[0],
+    setPageSize = _useState6[1];
+  var _useState7 = useState(0),
+    _useState8 = _slicedToArray(_useState7, 2),
+    total = _useState8[0],
+    setTotal = _useState8[1];
+  useEffect(function () {
+    var gLen = (searchData === null || searchData === void 0 ? void 0 : searchData.dimension) ? 1 : 0;
+    var _data = formTableData(dataSource, searchData.userGroup || [0], gLen);
+    setTotal(_data.length);
+    setTableData(_data);
+  }, []);
+  var columns = useMemo(function () {
+    var _searchData$userGroup = searchData.userGroup,
+      userGroup = _searchData$userGroup === void 0 ? [0] : _searchData$userGroup;
+    var onShowClick = function onShowClick(nameGroup) {
+      props.changeShowByName(nameGroup);
+    };
+    var onClickToDetail = function onClickToDetail(item, time, count) {
+      var _searchData$time, _searchData$time2, _searchData$filters;
+      if (searchData.module == 'duration' && item.eventName != '活跃用户') return;
+      var _time = searchData.module == 'duration' ? [(_searchData$time = searchData.time) === null || _searchData$time === void 0 ? void 0 : _searchData$time.begin, (_searchData$time2 = searchData.time) === null || _searchData$time2 === void 0 ? void 0 : _searchData$time2.end] : time.split('|');
+      onUserDrill && onUserDrill({
+        appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
+        platform: (searchData === null || searchData === void 0 ? void 0 : searchData.platform) || 0,
+        count: count,
+        params: {
+          module: searchData === null || searchData === void 0 ? void 0 : searchData.module,
+          chartType: searchData === null || searchData === void 0 ? void 0 : searchData.chartType,
+          userGroup: searchData === null || searchData === void 0 ? void 0 : searchData.userGroup,
+          moduleType: 'overall',
+          id: 0,
+          time: _objectSpread(_objectSpread({}, searchData === null || searchData === void 0 ? void 0 : searchData.time), {}, {
+            begin: _time[0],
+            end: _time.length > 1 ? _time[1] : _time[0]
+          }),
+          conditions: (_searchData$filters = searchData.filters) === null || _searchData$filters === void 0 ? void 0 : _searchData$filters.conditions,
+          dataType: searchData.module == 'add' ? 'new' : searchData.module,
+          groupValue: searchData.module == 'duration' ? time : (item === null || item === void 0 ? void 0 : item.dimension) || '',
+          dimension: searchData === null || searchData === void 0 ? void 0 : searchData.dimension
+        },
+        source: 'WHOLE',
+        url: '/zg/web/v2/data/appEventBatch'
+      });
+    };
+    var _getColumns = getColumns(eventGroupList, userPropList, eventEnvList, dataSource.xAxis || [], userGroup, searchData, showList, onShowClick, onClickToDetail);
+    return _getColumns;
+  }, [dataSource.xAxis, showList, panelName, searchData]);
+  var pageChange = function pageChange(page, pageSize) {
+    setCurrent(page);
+    setPageSize(pageSize);
+  };
+  var tableEmptyRender = function tableEmptyRender() {
+    return /*#__PURE__*/React.createElement(Empty, {
+      image: Empty.PRESENTED_IMAGE_SIMPLE,
+      description: "\u6682\u65E0\u6570\u636E"
+    });
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: classPrefix
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "table-area ".concat(sourcePanel ? 'sourcepanel-table-header' : '')
+  }, /*#__PURE__*/React.createElement(ConfigProvider, {
+    renderEmpty: tableEmptyRender
+  }, /*#__PURE__*/React.createElement(Table, {
+    className: "table",
+    rowKey: 'id',
+    columns: columns,
+    dataSource: tableData,
+    scroll: {
+      x: true
+    },
+    pagination: {
+      showQuickJumper: true,
+      total: total,
+      defaultPageSize: 10,
+      defaultCurrent: 1,
+      current: current,
+      pageSize: pageSize,
+      onChange: pageChange,
+      showTotal: function showTotal(total) {
+        return "\u603B\u6761\u6570\uFF1A".concat(total, " ");
+      }
+    }
+  }))));
+};
+export default WholeTable;

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

@@ -0,0 +1,193 @@
+.event-mi-table {
+  margin-top: 16px;
+  &-loading {
+    min-height: 300px;
+  }
+  &-table-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 50px;
+    margin-bottom: -1px;
+    padding: 0 12px;
+    line-height: 50px;
+    background: #fafafb;
+    border: 1px solid #e6e7ea;
+    border-radius: 8px 8px 0 0;
+    > :nth-child(2) {
+      display: flex;
+      > :nth-child(1) {
+        margin-right: 16px;
+      }
+      div {
+        height: 32px;
+        padding: 0 16px;
+        line-height: 32px;
+        background: #fff;
+        border: 1px solid #f2f3f4;
+        border-radius: 4px;
+        cursor: pointer;
+        .xiazai1 {
+          margin-right: 4px;
+          font-size: 18px !important;
+          vertical-align: -2px;
+        }
+      }
+      div:hover {
+        color: #165dff;
+        background: #e8efff;
+        border: 1px solid #165dff;
+      }
+      div:active {
+        color: #1454e5;
+        background: #e8efff;
+        border: 1px solid #1454e5;
+      }
+    }
+  }
+  .ant-table {
+    border-radius: 8px;
+  }
+  .sourcepanel-table-header {
+    overflow: hidden;
+    border-radius: 8px 8px 0 0;
+    .ant-table {
+      max-height: none;
+    }
+  }
+  .ant-pagination {
+    margin-top: 24px !important;
+  }
+  .ant-table
+    .ant-table-thead
+    .ant-table-cell.ant-table-column-has-sorters
+    .ant-table-column-sorters {
+    justify-content: flex-end !important;
+  }
+  .ant-table-cell-with-append {
+    padding-left: 20px;
+    .ant-table-row-expand-icon {
+      position: absolute;
+      left: 0;
+      margin-top: 0;
+    }
+  }
+  .tooltip-name-box {
+    display: flex;
+    &-market {
+      // max-width: calc(100% - 20px);
+      margin-right: 8px;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      cursor: pointer;
+      -webkit-line-clamp: 1;
+      -webkit-box-orient: vertical;
+      .shoucang {
+        color: #fd9f41;
+        font-size: 16px !important;
+      }
+      .notshoucang {
+        opacity: 0;
+      }
+    }
+
+    .fuzhi1 {
+      display: none;
+      font-size: 16px !important;
+    }
+    .fuzhi1:hover {
+      color: #165dff;
+    }
+  }
+  .tooltip-name-box:hover {
+    .fuzhi1 {
+      display: block;
+    }
+  }
+
+  &-table-empty {
+    img {
+      width: 50px !important;
+      height: auto;
+      margin-top: 30px;
+      margin-bottom: 10px;
+    }
+    p {
+      color: rgba(0, 0, 0, 0.25);
+    }
+  }
+
+  &-chart-box {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    &-tooltip {
+      width: 220px;
+      margin-bottom: 8px;
+      color: #67727f;
+      font-size: 12px;
+    }
+  }
+}
+.event-table-sql-modal {
+  .ant-modal {
+    width: 720px !important;
+  }
+  .ant-modal-header {
+    position: relative;
+    z-index: 1;
+    height: 82px;
+    background: transparent;
+  }
+  .ant-modal-body {
+    padding: 0 24px 24px 24px;
+  }
+  .ant-modal-close-x {
+    margin-top: 13px;
+    margin-right: 8px;
+  }
+  img {
+    width: 100%;
+  }
+  .qingchu {
+    font-weight: 500;
+    font-size: 22px !important;
+  }
+  .modal-bg {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: auto;
+  }
+  pre {
+    margin-bottom: 0;
+  }
+  .hljs {
+    height: 400px;
+    padding: 16px;
+    padding-bottom: 0;
+    background: #fafafb;
+    border-radius: 8px;
+  }
+  .copy-box {
+    position: absolute;
+    top: 98px;
+    right: 40px;
+    padding: 0 8px;
+    background: #f2f3f4;
+    border-radius: 4px;
+    .fuzhi1 {
+      margin-right: 8px;
+    }
+  }
+  .copy-box:hover {
+    color: #165dff;
+    background: #e8efff;
+  }
+  .copy-box:active {
+    color: #1454e5;
+    background: #e8efff;
+  }
+}

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

@@ -0,0 +1,9 @@
+import { ResponseDataProps, SearchValue } from '../../types';
+export interface WholeTableProps {
+    dataSource: ResponseDataProps;
+    sourcePanel: boolean;
+    searchData: SearchValue;
+    showList: string[];
+    isOverview?: boolean;
+    changeShowByName: (name: string) => void;
+}

package/es/components/table/types.js

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

package/es/components/topBar/index.d.ts

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