meraproject/lib/js/bws/react/canban/canban.js

var Canban, CanbanCell, CanbanColumn;
export default window.Canban = Canban = class Canban extends React.Component {
  constructor(props) {
    var ref, ref1, ref2;
    super(props);
    this.state = {
      columns: (ref = props.columns) != null ? ref : [],
      data: (ref1 = props.data) != null ? ref1 : {},
      callback: (ref2 = props.callback) != null ? ref2 : null
    };
    this.renderColumn = this.renderColumn.bind(this);
    this.onCellClick = this.onCellClick.bind(this);
  }

  onCellClick(id) {
    var base, x;
    console.log(this.props.onCellClick);

    if (typeof this.props.onCellClick === 'string') {
      x = eval(this.props.onCellClick);
      return x(id);
    } else {
      return typeof (base = this.props).onCellClick === "function" ? base.onCellClick(id) : void 0;
    }
  }

  renderColumn(item) {
    var data;
    ({
      data
    } = this.state);
    return /*#__PURE__*/React.createElement(CanbanColumn, {
      item: item,
      data: data[item.id],
      onClick: this.onCellClick
    });
  }

  componentDidMount() {
    var t;
    t = this;
    return $(".column", this.wrap).sortable({
      distance: 5,
      connectWith: '.column',
      stop: function (x, _cell, _column) {
        var cell, column; //console.log x,y,z

        cell = _cell.data('react');
        column = _column.data('react');

        if (typeof t.props.callback === 'string') {
          x = eval(t.props.callback);
          return x(cell.state.id, column.state.id);
        }
      }
    });
  }

  render() {
    var _this = this;

    var c, columns;
    ({
      columns
    } = this.state);
    c = columns.map(this.renderColumn);
    return /*#__PURE__*/React.createElement("div", {
      className: "canban_wrap",
      ref: function (i) {
        return _this.wrap = i;
      }
    }, /*#__PURE__*/React.createElement("div", {
      className: "canban"
    }, c));
  }

};
CanbanColumn = class CanbanColumn extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      item: props.item,
      data: props.data,
      id: props.item.id
    };
    this.renderCell = this.renderCell.bind(this);
    this.onCellClick = this.onCellClick.bind(this);
    this.column = null;
  }

  onCellClick(id) {
    var base;
    return typeof (base = this.props).onClick === "function" ? base.onClick(id) : void 0;
  }

  renderCell(item) {
    return /*#__PURE__*/React.createElement(CanbanCell, {
      data: item,
      onClick: this.onCellClick
    });
  }

  componentDidMount() {
    return $(this.column).data('react', this);
  }

  render() {
    var _this2 = this;

    var d, data, item;
    ({
      item,
      data
    } = this.state);
    d = null;

    if (Array.isArray(data)) {
      d = data.map(this.renderCell);
    }

    return /*#__PURE__*/React.createElement("div", {
      className: "canban_column"
    }, /*#__PURE__*/React.createElement("div", {
      className: "canban_title"
    }, item.title), /*#__PURE__*/React.createElement("div", {
      className: "column",
      ref: function (i) {
        return _this2.column = i;
      }
    }, d));
  }

};
CanbanCell = class CanbanCell extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: props.data,
      id: props.data.id
    };
    this.wrap = null;
    this.onClick = this.onClick.bind(this);
  }

  onClick(e) {
    var base;
    return typeof (base = this.props).onClick === "function" ? base.onClick(this.state.id) : void 0;
  }

  componentDidMount() {
    return $(this.wrap).data('react', this);
  }

  render() {
    var _this3 = this;

    var data;
    ({
      data
    } = this.state);
    return /*#__PURE__*/React.createElement("div", {
      ref: function (i) {
        return _this3.wrap = i;
      },
      className: "canban_dash",
      onClick: this.onClick
    }, /*#__PURE__*/React.createElement("div", {
      className: "title"
    }, data.title));
  }

};
//# sourceMappingURL=canban.js.map