@aliretail/react-materials-components/es/MarketingOperationLog/components/DetailTable/index.js

B 端物料组件库

import _extends from "@babel/runtime/helpers/extends";
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _regeneratorRuntime from "@babel/runtime/regenerator";
import * as React from 'react';
import { AliretailTableContainer, AliretailTable, AliretailTablePagination, AliretailTableDefaultPageSizeList } from "../../../Tablex";
import { getListCt, COM_PREFIX } from "../../properties";
import ExpandedTable from "./ExpandedTable";
export default (function (props) {
  var appCode = props.appCode,
      apiCode = props.apiCode,
      url = props.url,
      params = props.params,
      detailApiCode = props.detailApiCode,
      detailAppCode = props.detailAppCode,
      detailUrl = props.detailUrl,
      extTableProps = props.extTableProps; // 获取第一个有 traceId 的 row 的 key

  var getFirstDataSourcePrimaryKey = function getFirstDataSourcePrimaryKey(ds) {
    for (var i = 0; i < ds.length; i++) {
      var item = ds[i];

      if (item !== null && item !== void 0 && item.traceId) {
        return [item[primaryKey]];
      }
    }

    return [];
  };

  var _React$useState = React.useState('id'),
      primaryKey = _React$useState[0];

  var _React$useState2 = React.useState([]),
      dataSource = _React$useState2[0],
      setDataSource = _React$useState2[1];

  var _React$useState3 = React.useState(0),
      start = _React$useState3[0],
      setStart = _React$useState3[1];

  var _React$useState4 = React.useState(0),
      total = _React$useState4[0],
      setTotal = _React$useState4[1];

  var _React$useState5 = React.useState(AliretailTableDefaultPageSizeList[0]),
      limit = _React$useState5[0],
      setLimit = _React$useState5[1];

  var _React$useState6 = React.useState(getFirstDataSourcePrimaryKey(dataSource)),
      openRowKeys = _React$useState6[0],
      setOpenRowKeys = _React$useState6[1];

  var getCt = /*#__PURE__*/function () {
    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
      var res, _dataSource;

      return _regeneratorRuntime.wrap(function _callee$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              _context.next = 2;
              return getListCt({
                appCode: appCode,
                apiCode: apiCode,
                url: url
              }, _extends({
                limit: limit,
                start: start
              }, params));

            case 2:
              res = _context.sent;
              _dataSource = (res === null || res === void 0 ? void 0 : res.result) || [];
              _context.next = 6;
              return setDataSource(_dataSource);

            case 6:
              setStart(start + limit);
              setTotal((res === null || res === void 0 ? void 0 : res.total) || 0);
              return _context.abrupt("return", _dataSource);

            case 9:
            case "end":
              return _context.stop();
          }
        }
      }, _callee);
    }));

    return function getCt() {
      return _ref.apply(this, arguments);
    };
  }();

  React.useEffect(function () {
    getCt().then(function (ds) {
      setOpenRowKeys(getFirstDataSourcePrimaryKey(ds));
    })["catch"](function (e) {
      console.warn(e);
    });
  }, []);

  var onRowOpen = function onRowOpen(_openRowKeys) {
    setOpenRowKeys(_openRowKeys);
  };

  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AliretailTableContainer, _extends({
    dataSource: dataSource,
    primaryKey: primaryKey,
    className: COM_PREFIX + "-table",
    columns: [{
      title: '操作时间',
      dataIndex: 'operateTime'
    }, {
      title: '操作账号',
      dataIndex: 'operatePerson'
    }, {
      title: '操作时机',
      dataIndex: 'eventType'
    }, {
      title: '机器IP',
      dataIndex: 'ip'
    }],
    openRowKeys: openRowKeys,
    onRowOpen: onRowOpen,
    rowExpandable: function rowExpandable(_ref2) {
      var traceId = _ref2.traceId;
      return !!traceId;
    },
    expandedRowRender: function expandedRowRender(record) {
      var id = record[primaryKey],
          traceId = record.traceId;
      return /*#__PURE__*/React.createElement(ExpandedTable, {
        appCode: detailAppCode || appCode,
        apiCode: detailApiCode,
        url: detailUrl,
        traceId: traceId,
        index: id
      });
    },
    paginationProps: {
      current: parseInt(start / limit) + 1,
      pageSize: limit,
      onChange: function onChange(current) {
        setStart(current * limit);
        getCt();
      },
      onPageSizeChange: function onPageSizeChange(pageSize) {
        setLimit(pageSize);
        getCt();
      },
      total: total
    },
    fixedHeader: true,
    maxBodyHeight: 520
  }, extTableProps), /*#__PURE__*/React.createElement(AliretailTable, null), /*#__PURE__*/React.createElement(AliretailTablePagination, null)));
});