drip-table/es/layouts/calendar/index.js

A tiny and powerful enterprise-class solution for building tables.

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) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

/**
 * This file is part of the drip-table project.
 * @link     : https://drip-table.jd.com/
 * @author   : renwenci (ararakikon@163.com)
 * @modifier : renwenci (ararakikon@163.com)
 * @copyright: Copyright (c) 2021 JD Network Technology Co., Ltd.
 */
import "./index.less";
import moment from 'moment';
import React from 'react';
import DatePicker from "../../components/react-components/date-picker";
import { useTableContext } from "../../hooks";
import { TABLE_LAYOUT_COLUMN_RENDER_GENERATOR_DO_NOT_USE_IN_PRODUCTION as columnRenderGenerator } from "../..";
import { finalizeColumnTitle } from "../table/utils";

function CalendarLayout(props) {
  var _useTableContext = useTableContext(),
      tableProps = _useTableContext.props,
      tableInfo = _useTableContext.info,
      tableState = _useTableContext.state,
      createEvaluator = _useTableContext.createEvaluator,
      evaluate = _useTableContext.evaluate,
      safeEvaluate = _useTableContext.safeEvaluate,
      finalizeString = _useTableContext.finalizeString;

  var dataSource = tableProps.dataSource;

  var _dateRender = function dateRender(date, today, dataSources) {
    var record = dataSources.find(function (o) {
      return moment(o.startDate).isSame(date, 'date');
    });
    var extraProps = {
      components: tableProps.components,
      ext: tableProps.ext,
      onEvent: tableProps.onEvent,
      onDataSourceChange: tableProps.onDataSourceChange,
      createEvaluator: createEvaluator,
      evaluate: evaluate,
      safeEvaluate: safeEvaluate,
      finalizeString: finalizeString,
      schemaFunctionPreprocessor: tableProps.schemaFunctionPreprocessor
    };
    return /*#__PURE__*/React.createElement("div", {
      className: "jfe-drip-table-layout-calendar-container",
      style: {
        borderTopColor: date.isSame(today, 'date') ? 'blue' : '#CCC'
      }
    }, date.date(), record && /*#__PURE__*/React.createElement("div", {
      className: "jfe-drip-table-layout-calendar-record"
    }, tableInfo.schema.columns.filter(function (column) {
      return !column.hidable || tableState.displayColumnKeys.includes(column.key);
    }).map(function (column) {
      return _objectSpread(_objectSpread({}, column), {}, {
        render: columnRenderGenerator(tableInfo, column, extraProps)
      });
    }).map(function (col) {
      var _col$render;

      return /*#__PURE__*/React.createElement("div", {
        key: col.key
      }, /*#__PURE__*/React.createElement("h4", null, finalizeColumnTitle(col)), (_col$render = col.render) === null || _col$render === void 0 ? void 0 : _col$render.call(col, null, {
        record: record,
        index: 0,
        type: 'body',
        key: '0'
      }, 0));
    })));
  };

  return /*#__PURE__*/React.createElement("div", null, props.header, /*#__PURE__*/React.createElement(DatePicker.Calendar, {
    dateRender: function dateRender(date, today) {
      return _dateRender(date, today, dataSource);
    }
  }));
}

export default CalendarLayout;