'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var engine = require('@aomao/engine');
var isInteger = require('lodash/isInteger');
var eventemitter2 = require('eventemitter2');
var colord = require('colord');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var isInteger__default = /*#__PURE__*/_interopDefaultLegacy(isInteger);
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 _objectSpread2(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 _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
Object.defineProperty(Constructor, "prototype", {
writable: false
});
return Constructor;
}
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;
}
function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function");
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
writable: true,
configurable: true
}
});
Object.defineProperty(subClass, "prototype", {
writable: false
});
if (superClass) _setPrototypeOf(subClass, superClass);
}
function _getPrototypeOf(o) {
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {
return o.__proto__ || Object.getPrototypeOf(o);
};
return _getPrototypeOf(o);
}
function _setPrototypeOf(o, p) {
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
o.__proto__ = p;
return o;
};
return _setPrototypeOf(o, p);
}
function _isNativeReflectConstruct() {
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
if (Reflect.construct.sham) return false;
if (typeof Proxy === "function") return true;
try {
Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
return true;
} catch (e) {
return false;
}
}
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
function _possibleConstructorReturn(self, call) {
if (call && (typeof call === "object" || typeof call === "function")) {
return call;
} else if (call !== void 0) {
throw new TypeError("Derived constructors may only return object or undefined");
}
return _assertThisInitialized(self);
}
function _createSuper(Derived) {
var hasNativeReflectConstruct = _isNativeReflectConstruct();
return function _createSuperInternal() {
var Super = _getPrototypeOf(Derived),
result;
if (hasNativeReflectConstruct) {
var NewTarget = _getPrototypeOf(this).constructor;
result = Reflect.construct(Super, arguments, NewTarget);
} else {
result = Super.apply(this, arguments);
}
return _possibleConstructorReturn(this, result);
};
}
function _superPropBase(object, property) {
while (!Object.prototype.hasOwnProperty.call(object, property)) {
object = _getPrototypeOf(object);
if (object === null) break;
}
return object;
}
function _get() {
if (typeof Reflect !== "undefined" && Reflect.get) {
_get = Reflect.get.bind();
} else {
_get = function _get(target, property, receiver) {
var base = _superPropBase(target, property);
if (!base) return;
var desc = Object.getOwnPropertyDescriptor(base, property);
if (desc.get) {
return desc.get.call(arguments.length < 3 ? target : receiver);
}
return desc.value;
};
}
return _get.apply(this, arguments);
}
function _slicedToArray(arr, i) {
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
}
function _toConsumableArray(arr) {
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
}
function _arrayWithoutHoles(arr) {
if (Array.isArray(arr)) return _arrayLikeToArray(arr);
}
function _arrayWithHoles(arr) {
if (Array.isArray(arr)) return arr;
}
function _iterableToArray(iter) {
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
}
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 _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 _nonIterableSpread() {
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
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.");
}
var id = 0;
function _classPrivateFieldLooseKey(name) {
return "__private_" + id++ + "_" + name;
}
function _classPrivateFieldLooseBase(receiver, privateKey) {
if (!Object.prototype.hasOwnProperty.call(receiver, privateKey)) {
throw new TypeError("attempted to use private field on non-instance");
}
return receiver;
}
var TABLE_WRAPPER_CLASS_NAME = 'table-wrapper';
var TABLE_OVERFLOW_CLASS_NAME = 'table-overflow';
var TABLE_CLASS_NAME = 'data-table';
var COLS_HEADER_CLASS_NAME = 'table-cols-header';
var COLS_HEADER_ITEM_CLASS_NAME = 'table-cols-header-item';
var COLS_HEADER_TRIGGER_CLASS_NAME = 'cols-trigger';
var COLS_ADDITION_HEADER_CLASS_NAME = 'cols-addition-header';
var ROWS_HEADER_CLASS_NAME = 'table-rows-header';
var ROWS_HEADER_ITEM_CLASS_NAME = 'table-rows-header-item';
var ROWS_HEADER_TRIGGER_CLASS_NAME = 'rows-trigger';
var HEADER_CLASS_NAME = 'table-header';
var MENUBAR_CLASS_NAME = 'table-menubar';
var MENUBAR_ITEM_CLASS_NAME = 'table-menubar-item';
var MENUBAR_ITEM_INPUT_CALSS_NAME = 'table-menubar-item-input';
var VIEWPORT = 'table-viewport';
var VIEWPORT_READER = 'data-table-reader';
var PLACEHOLDER_CLASS_NAME = 'table-placeholder';
var MULTI_ADDITION_CLASS_NAME = 'multi-addition';
var TABLE_HIGHLIGHT = 'table-highlight';
var ROW_DELETE_BUTTON_CLASS_NAME = 'table-row-delete-button';
var COL_DELETE_BUTTON_CLASS_NAME = 'table-col-delete-button';
var ROW_ADD_BUTTON_CLASS_NAME = 'table-row-add-button';
var ROW_ADD_BUTTON_SPLIT_CLASS_NAME = 'table-row-add-split-button';
var COL_ADD_BUTTON_CLASS_NAME = 'table-col-add-button';
var COL_ADD_BUTTON_SPLIT_CLASS_NAME = 'table-col-add-split-button';
var TABLE_TD_CONTENT_CLASS_NAME = 'table-main-content';
var TABLE_TD_BG_CLASS_NAME = 'table-main-bg';
var Template = /*#__PURE__*/function () {
function Template(table) {
_classCallCheck(this, Template);
this.isReadonly = false;
this.table = void 0;
this.table = table;
}
_createClass(Template, [{
key: "getEmptyCell",
value: function getEmptyCell() {
return Template.EmptyCell(this.isReadonly);
}
}, {
key: "renderRowsHeader",
value: function renderRowsHeader(rows) {
return "
";
}
}, {
key: "renderColsHeader",
value: function renderColsHeader(cols) {
return "";
}
/**
* 用于Card渲染
* @param {object} value 参数
* @param {number} value.rows 行数
* @param {number} value.cols 列数
* @param {string} value.html html 字符串
* @return {string} 返回 html 字符串
*/
}, {
key: "htmlEdit",
value: function htmlEdit(_ref, menus) {
var rows = _ref.rows,
cols = _ref.cols,
html = _ref.html,
noBorder = _ref.noBorder,
overflow = _ref.overflow;
cols = cols === -Infinity ? 1 : cols;
rows = rows === -Infinity ? 1 : rows;
cols = cols === Infinity ? 10 : cols;
rows = rows === Infinity ? 10 : rows;
var tds = "").concat(this.getEmptyCell(), " ").repeat(cols);
var trs = "".concat(tds, " ").repeat(rows);
var col = " ".repeat(cols);
var colgroup = "".concat(col, " ");
var tableHighlight = "
");
var tableHeader = "");
var placeholder = "
");
var menuBar = menus.map(function (menu) {
var _menuContent;
if (menu.split) {
return '
';
}
var menuContent = menu.text;
switch (menu.action) {
case 'insertColLeft':
case 'insertColRight':
case 'insertRowUp':
case 'insertRowDown':
menuContent = ((_menuContent = menuContent) === null || _menuContent === void 0 ? void 0 : _menuContent.replace('$data', ""))) || '';
break;
}
return "");
});
menuBar = ["")];
if (html) {
var hasColGroup = html.indexOf(' -1;
html = engine.transformCustomTags(html) || html;
if (!hasColGroup) {
var _html;
html = (_html = html) === null || _html === void 0 ? void 0 : _html.replace(/^(]+>)/, function (match) {
return match + colgroup;
});
}
var normalTable = this.table.helper.normalize(engine.$(html));
var _trs = normalTable.find('tr');
rows = _trs.length;
html = normalTable.get().outerHTML;
}
var table = html || "").concat(colgroup).concat(trs, "
");
return "").concat(tableHeader, "
").concat(this.renderColsHeader(cols)).concat(table).concat(placeholder).concat(tableHighlight, "
").concat(this.renderRowsHeader(rows)).concat(menuBar, "
");
}
}, {
key: "htmlView",
value: function htmlView(_ref2) {
var _html2, _table$get;
var html = _ref2.html,
noBorder = _ref2.noBorder,
overflow = _ref2.overflow;
html = engine.transformCustomTags((_html2 = html) !== null && _html2 !== void 0 ? _html2 : '');
var table = engine.$(html);
table.find('td').attributes(engine.DATA_ELEMENT, engine.EDITABLE);
return "").concat((_table$get = table.get()) === null || _table$get === void 0 ? void 0 : _table$get.outerHTML, "
");
}
}], [{
key: "EmptyCell",
value: function EmptyCell() {
var readonly = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
return "").concat(Template.CellBG);
}
}]);
return Template;
}();
Template.TABLE_WRAPPER_CLASS = ".".concat(TABLE_WRAPPER_CLASS_NAME);
Template.TABLE_OVERFLOW_CLASS = ".".concat(TABLE_OVERFLOW_CLASS_NAME);
Template.TABLE_CLASS = ".".concat(TABLE_CLASS_NAME);
Template.COLS_HEADER_CLASS = ".".concat(COLS_HEADER_CLASS_NAME);
Template.COLS_HEADER_ITEM_CLASS = ".".concat(COLS_HEADER_ITEM_CLASS_NAME);
Template.COLS_HEADER_TRIGGER_CLASS = ".".concat(COLS_HEADER_TRIGGER_CLASS_NAME);
Template.COLS_ADDITION_HEADER_CLASS = ".".concat(COLS_ADDITION_HEADER_CLASS_NAME);
Template.ROWS_HEADER_CLASS = ".".concat(ROWS_HEADER_CLASS_NAME);
Template.ROWS_HEADER_ITEM_CLASS = ".".concat(ROWS_HEADER_ITEM_CLASS_NAME);
Template.ROWS_HEADER_TRIGGER_CLASS = ".".concat(ROWS_HEADER_TRIGGER_CLASS_NAME);
Template.HEADER_CLASS = ".".concat(HEADER_CLASS_NAME);
Template.MENUBAR_CLASS = ".".concat(MENUBAR_CLASS_NAME);
Template.MENUBAR_ITEM_CLASS = ".".concat(MENUBAR_ITEM_CLASS_NAME);
Template.MENUBAR_ITEM_INPUT_CALSS = ".".concat(MENUBAR_ITEM_INPUT_CALSS_NAME);
Template.VIEWPORT = ".".concat(VIEWPORT);
Template.VIEWPORT_READER = ".".concat(VIEWPORT_READER);
Template.PLACEHOLDER_CLASS = ".".concat(PLACEHOLDER_CLASS_NAME);
Template.MULTI_ADDITION_CLASS = ".".concat(MULTI_ADDITION_CLASS_NAME);
Template.TABLE_HIGHLIGHT_CLASS = ".".concat(TABLE_HIGHLIGHT);
Template.ROW_DELETE_BUTTON_CLASS = ".".concat(ROW_DELETE_BUTTON_CLASS_NAME);
Template.COL_DELETE_BUTTON_CLASS = ".".concat(COL_DELETE_BUTTON_CLASS_NAME);
Template.ROW_ADD_BUTTON_CLASS = ".".concat(ROW_ADD_BUTTON_CLASS_NAME);
Template.COL_ADD_BUTTON_CLASS = ".".concat(COL_ADD_BUTTON_CLASS_NAME);
Template.ROW_ADD_BUTTON_SPLIT_CLASS = ".".concat(ROW_ADD_BUTTON_SPLIT_CLASS_NAME);
Template.COL_ADD_BUTTON_SPLIT_CLASS = ".".concat(COL_ADD_BUTTON_SPLIT_CLASS_NAME);
Template.TABLE_TD_CONTENT_CLASS = ".".concat(TABLE_TD_CONTENT_CLASS_NAME);
Template.TABLE_TD_BG_CLASS = ".".concat(TABLE_TD_BG_CLASS_NAME);
Template.CellBG = "");
var convertToPX = function convertToPX(value) {
var match = /([\d\.]+)(pt|px)$/i.exec(value);
if (match && match[2] === 'pt') {
return String(Math.round(parseInt(match[1], 10) * 96 / 72)) + 'px';
}
return value;
};
var _editor = /*#__PURE__*/_classPrivateFieldLooseKey("editor");
var Helper = /*#__PURE__*/function () {
function Helper(editor) {
_classCallCheck(this, Helper);
this.clipboard = void 0;
Object.defineProperty(this, _editor, {
writable: true,
value: void 0
});
_classPrivateFieldLooseBase(this, _editor)[_editor] = editor;
}
_createClass(Helper, [{
key: "isEmptyModelCol",
value: function isEmptyModelCol(model) {
return model && model.isEmpty;
}
/**
* 获取表格数据模型
* @param table
* @returns
*/
}, {
key: "getTableModel",
value: function getTableModel(table) {
var model = [];
var tableElement = table.get();
var rows = tableElement.rows;
var rowCount = (rows === null || rows === void 0 ? void 0 : rows.length) || 0;
for (var r = 0; r < rowCount; r++) {
var tr = rows[r];
var cells = tr.cells;
var cellCount = cells.length;
for (var c = 0; c < cellCount; c++) {
var td = cells[c];
var rowSpan = td.rowSpan,
colSpan = td.colSpan;
rowSpan = rowSpan === void 0 ? 1 : rowSpan;
colSpan = colSpan === void 0 ? 1 : colSpan;
var isMulti = rowSpan > 1 || colSpan > 1;
model[r] = model[r] || []; // 如果当前单元格的 model 已经存在,说明是前面已经有合并单元格覆盖了当前坐标,需要往右推移
var _c = c;
while (model[r][_c]) {
_c++;
}
model[r][_c] = {
rowSpan: rowSpan,
colSpan: colSpan,
isMulti: isMulti,
element: td
};
if (isMulti) {
// 补齐被合并的单元格占位
var _rowCount = rowSpan;
while (_rowCount > 0) {
var colCount = colSpan;
while (colCount > 0) {
if (colCount !== 1 || _rowCount !== 1) {
var rowIndex = r + _rowCount - 1;
var colIndex = _c + colCount - 1;
model[rowIndex] = model[rowIndex] || [];
model[rowIndex][colIndex] = {
isEmpty: true,
parent: {
row: r,
col: _c
},
element: null
};
}
colCount--;
}
_rowCount--;
}
}
}
}
var colCounts = model.map(function (trModel) {
return trModel.length;
});
var MaxColCount = Math.max.apply(Math, _toConsumableArray(colCounts));
model.forEach(function (trModel) {
if (trModel.length < MaxColCount) {
var addCount = MaxColCount - trModel.length;
while (addCount--) {
trModel.push({
rowSpan: 1,
colSpan: 1,
isShadow: true,
element: null
});
}
} // 表格内有空数组项,补齐为 shadow
for (var i = 0; i < MaxColCount; i++) {
if (!trModel[i]) {
trModel[i] = {
rowSpan: 1,
colSpan: 1,
isShadow: true,
element: null
};
}
}
});
var result = {
rows: model.length,
cols: MaxColCount,
width: tableElement.offsetWidth,
height: tableElement.offsetHeight,
table: model
};
return result;
}
/**
* 修复表格,补全丢失的单元格
* @param table
* @returns
*/
}, {
key: "normalize",
value: function normalize(table) {
var _this = this;
this.trimStartTr(table);
this.fixNumberTr(table);
table.addClass('data-table');
table.attributes(engine.DATA_TRANSIENT_ATTRIBUTES, 'class'); // 修正表格宽度为 pt 场景
var width = table.css('width');
if (parseInt(width) === 0) {
table.css('width', 'auto');
}
table.css('background-color', '');
var model = this.getTableModel(table); // 修正列的 span 场景
var cols = table.find('col');
if (cols.length !== 0) {
for (var c = cols.length - 1; c >= 0; c--) {
var _cols$eq;
var colElement = cols[c];
var _width = (_cols$eq = cols.eq(c)) === null || _cols$eq === void 0 ? void 0 : _cols$eq.attributes('width');
if (_width) {
var _cols$eq2;
(_cols$eq2 = cols.eq(c)) === null || _cols$eq2 === void 0 ? void 0 : _cols$eq2.attributes('width', parseInt(_width));
}
if (colElement.span > 1) {
var addCount = colElement.span - 1;
while (addCount--) {
var _ref, _cols$c$parentElement;
(_ref = (_cols$c$parentElement = cols[c].parentElement) !== null && _cols$c$parentElement !== void 0 ? _cols$c$parentElement : cols[c].parentNode) === null || _ref === void 0 ? void 0 : _ref.insertBefore(cols[c].cloneNode(), cols[c]);
}
}
}
cols = table.find('col');
if (cols.length < model.cols) {
var lastCol = cols.length - 1;
var colsAddCount = model.cols - cols.length;
while (colsAddCount--) {
var _ref2, _cols$0$parentElement;
(_ref2 = (_cols$0$parentElement = cols[0].parentElement) !== null && _cols$0$parentElement !== void 0 ? _cols$0$parentElement : cols[0].parentNode) === null || _ref2 === void 0 ? void 0 : _ref2.appendChild(cols[lastCol].cloneNode());
}
}
table.find('col').attributes('span', 1);
} else {
var colgroup = table.find('colgroup')[0];
if (!colgroup) {
colgroup = document.createElement('colgroup');
}
table.prepend(colgroup);
var widths = function (table) {
var tr = table.find('tr')[0];
var tds = engine.$(tr).find('td');
var widthArray = [];
tds.each(function (_, index) {
var $td = tds.eq(index);
if (!$td) return;
var colWidth = $td.attributes('data-colwidth');
var tdWidth = $td.attributes('width');
var tdColSpan = $td[0].colSpan;
if (colWidth) {
colWidth = colWidth.split(',');
} else if (tdWidth) {
tdWidth = parseInt(tdWidth) / tdColSpan;
}
for (var o = 0; tdColSpan > o; o++) {
if (colWidth && colWidth[o]) {
widthArray.push(parseInt(colWidth[o]));
} else if (tdWidth) {
widthArray.push(parseInt(tdWidth.toString()));
} else {
widthArray.push(undefined);
}
}
});
var td = table.find('td');
td.removeAttributes('data-colwidth');
td.removeAttributes('width');
return widthArray;
}(table);
var col = document.createElement('col');
for (var f = 0; model.cols > f; f++) {
var node = col.cloneNode();
if (widths[f]) {
node.setAttribute('width', (widths[f] || '').toString());
}
colgroup.appendChild(node);
}
} // 数据模型和实际 dom 结构的行数不一致,需要寻找并补齐行
var tableElement = table.get();
model.table.forEach(function (tr, r) {
if (!tableElement.rows[r]) {
tableElement.insertRow(r);
}
var shadow = tr.filter(function (td) {
return _this.isEmptyModelCol(td) ? false : td.isShadow;
});
var shadowCount = shadow.length;
while (shadowCount--) {
if (r === 0) {
tableElement.rows[r].insertCell(0);
} else {
tableElement.rows[r].insertCell();
}
}
}); // 修正行高
var trs = table.find('tr');
trs.each(function (_, index) {
var _classPrivateFieldLoo;
var $tr = trs.eq(index);
if (!$tr) return;
var height = parseInt($tr.css('height'));
height = height || ((_classPrivateFieldLoo = _classPrivateFieldLooseBase(_this, _editor)[_editor].plugin.findPlugin('table')) === null || _classPrivateFieldLoo === void 0 ? void 0 : _classPrivateFieldLoo.options.rowMinHeight) || 0;
$tr.css('height', height + 'px');
}); //补充可编辑器区域
var tds = table.find('td');
var emptyTd = engine.$(Template.EmptyCell(!engine.isEngine(_classPrivateFieldLooseBase(this, _editor)[_editor]) || _classPrivateFieldLooseBase(this, _editor)[_editor].readonly));
tds.each(function (_, index) {
var tdNode = tds.eq(index);
if (!tdNode) return;
tdNode.attributes(engine.DATA_TRANSIENT_ATTRIBUTES, 'table-cell-selection');
var editableElement = tdNode.find(engine.EDITABLE_SELECTOR);
if (editableElement.length === 0) {
var children = tdNode.children();
tdNode.append(emptyTd.clone(true));
editableElement = tdNode.find(engine.EDITABLE_SELECTOR);
editableElement.empty();
editableElement.append(children);
}
editableElement.find('p').each(function (pNode) {
if (pNode.childNodes.length === 0) {
pNode.appendChild(document.createElement('br'));
}
});
});
return table;
}
/**
* 过滤 table 中的首行空tr, 当表格尾部有空白单元格时,网页拷贝时头部会莫名其妙的出现一个空的Tr
* @param {nodeModel} table 传入的table
*/
}, {
key: "trimStartTr",
value: function trimStartTr(table) {
var _first$get;
var tr = table.find('tr');
var first = tr.eq(0);
if (first && ((_first$get = first.get()) === null || _first$get === void 0 ? void 0 : _first$get.childNodes.length) === 0) {
first.remove();
}
}
}, {
key: "fixNumberTr",
value: function fixNumberTr(table) {
var tableElement = table.get();
var rows = tableElement.rows;
var rowCount = (rows === null || rows === void 0 ? void 0 : rows.length) || 0;
var colCounts = [];
var firstColCount = 0; // 第一列的单元格个数
var cellCounts = []; // 每行单元格个数
var totalCellCounts = 0; // 总单元格个数
var emptyCounts = 0; // 跨行合并缺损的单元格
// 已经存在一行中的 td 的最大数,最终算出来的最大列数一定要大于等于这个值
var maxCellCounts = 0; // 在不确定是否缺少tr时,先拿到已经存在的td,和一些关键信息
for (var r = 0; r < rowCount; r++) {
var row = rows[r];
var cells = row.cells;
var cellCountThisRow = 0;
for (var c = 0; c < cells.length; c++) {
var _cells$c = cells[c],
rowSpan = _cells$c.rowSpan,
colSpan = _cells$c.colSpan;
totalCellCounts += rowSpan * colSpan;
cellCountThisRow += colSpan;
if (rowSpan > 1) {
emptyCounts += (rowSpan - 1) * colSpan;
}
}
cellCounts[r] = cellCountThisRow;
if (r === 0) {
firstColCount = cellCountThisRow;
}
maxCellCounts = Math.max(cellCountThisRow, maxCellCounts);
} // number拷贝的一定是首行列数能被单元格总数整除
var isNumber1 = isInteger__default['default'](totalCellCounts / firstColCount); // number拷贝的一定是首行列数最大
var isNumber2 = firstColCount === maxCellCounts;
var isNumber = isNumber1 && isNumber2; // 判断是否是 number, 是因为 number 需要考虑先修复省略的 tr,否则后面修复出来就会有问题
if (isNumber) {
var lossCellCounts = 0;
cellCounts.forEach(function (cellCount) {
lossCellCounts += maxCellCounts - cellCount;
});
if (lossCellCounts !== emptyCounts) {
var missCellCounts = emptyCounts - lossCellCounts;
if (isInteger__default['default'](missCellCounts / maxCellCounts)) {
var lossRowIndex = []; // 记录哪一行缺 tr
for (var _r = 0; _r < rowCount; _r++) {
var _row = rows[_r];
var _cells = _row.cells;
var realRow = _r + lossRowIndex.length;
while (colCounts[realRow] === maxCellCounts) {
lossRowIndex.push(realRow);
realRow++;
}
for (var _c2 = 0; _c2 < _cells.length; _c2++) {
var _cells$_c = _cells[_c2],
_rowSpan = _cells$_c.rowSpan,
_colSpan = _cells$_c.colSpan;
if (_rowSpan > 1) {
for (var rr = 1; rr < _rowSpan; rr++) {
colCounts[realRow + rr] = (colCounts[realRow + rr] || 0) + _colSpan;
}
}
}
}
lossRowIndex.forEach(function (row) {
tableElement.insertRow(row);
});
}
}
}
} // firefox 下的拖拽需要这样处理
// clearData 是为了防止新开 tab
// hack: 如果不 setData, firefox 不会触发拖拽事件,但设置 data 之后,又会开新 tab, 这里设置一个 firefox 不识别的 mimetype: aomao
}, {
key: "fixDragEvent",
value: function fixDragEvent(event) {
var _event$dataTransfer, _event$dataTransfer2;
(_event$dataTransfer = event.dataTransfer) === null || _event$dataTransfer === void 0 ? void 0 : _event$dataTransfer.clearData();
(_event$dataTransfer2 = event.dataTransfer) === null || _event$dataTransfer2 === void 0 ? void 0 : _event$dataTransfer2.setData('aomao', '');
if (event.dataTransfer) {
event.dataTransfer.effectAllowed = 'all';
}
}
/**
* 从源节点复制样式到目标节点
* @param from 源节点
* @param to 目标节点
*/
}, {
key: "copyCss",
value: function copyCss(from, to) {
if (engine.isNode(from)) from = engine.$(from);
if (engine.isNode(to)) to = engine.$(to); // to.css('text-align', from.css('text-align'));
to.css('vertical-align', from.css('vertical-align'));
var tdBgColor = from.css('background-color');
tdBgColor = tdBgColor !== 'rgba(0, 0, 0, 0)' ? tdBgColor : '';
to.css('background-color', tdBgColor); // to.css('color', from.css('color'));
// to.css('font-weight', from.css('font-weight'));
}
/**
* 从源节点复制样式和内容到目标节点
* @param from 源节点
* @param to 目标节点
*/
}, {
key: "copyTo",
value: function copyTo(from, to) {
if (engine.isNode(from)) from = engine.$(from);
if (engine.isNode(to)) to = engine.$(to);
var editableElement = to.find(engine.EDITABLE_SELECTOR);
if (editableElement.length === 0) {
to.html(Template.EmptyCell(!engine.isEngine(_classPrivateFieldLooseBase(this, _editor)[_editor]) || _classPrivateFieldLooseBase(this, _editor)[_editor].readonly));
editableElement = to.find(engine.EDITABLE_SELECTOR);
}
editableElement.html(engine.transformCustomTags(from.html()));
if (to.name === 'td' && to.find(Template.TABLE_TD_BG_CLASS).length === 0) {
to.append(engine.$(Template.CellBG));
}
if (to.name === 'td') {
to.attributes('data-transient-attributes', 'table-cell-selection');
}
this.copyCss(from, to);
}
/**
* 复制html
* @param html HTML
*/
}, {
key: "copyHTML",
value: function copyHTML(html) {
var _$$get;
this.clipboard = {
html: html,
text: ((_$$get = engine.$(html).get()) === null || _$$get === void 0 ? void 0 : _$$get.innerText) || ''
};
}
/**
* 获取复制的数据
* @returns
*/
}, {
key: "getCopyData",
value: function getCopyData() {
return this.clipboard;
}
}, {
key: "clearCopyData",
value: function clearCopyData() {
this.clipboard = undefined;
}
}, {
key: "trimBlankSpan",
value: function trimBlankSpan(node) {
var len = node.length;
var nodelist = [];
var i = 0;
var j = len - 1;
while (node[i] && node[i].tagName.toLowerCase() === 'span' && node[i].innerText.trim() === '') {
i++;
}
while (node[j] && node[j].tagName.toLowerCase() === 'span' && node[j].innerText.trim() === '') {
j--;
}
if (i <= j) {
for (var k = i; k <= j; k++) {
nodelist.push(node[k]);
}
}
if (nodelist.length) {
return engine.$(nodelist);
}
return node;
}
/**
* table 结构标准化,补齐丢掉的单元格和行
* 场景1. number 拷贝过来的 html 中,如果这一行没有单元格,就会省掉 tr,渲染的时候会有问题
* 场景2. 从网页中鼠标随意选取表格中的一部分,会丢掉没有选中的单元格,需要补齐单元格
* @param {NodeInterface} table 表格 Dom
* @return {NodeInterface} 修复过的 table dom
*/
}, {
key: "normalizeTable",
value: function normalizeTable(table) {
var _this2 = this;
this.trimStartTr(table);
this.fixNumberTr(table);
table.addClass('data-table'); // 修正表格宽度为 pt 场景
var width = table.css('width');
if (parseInt(width) === 0) {
table.css('width', 'auto');
} else if (!width.endsWith('%')) {
// pt 直接转为 px, 因为 col 的 width 属性是没有单位的,会直接被理解为 px, 这里 table 的 width 也直接换成 px。
table.css('width', parseInt(width, 10) + 'px');
} // 表格 table 标签不允许有背景色,无法设置
table.css('background-color', '');
var model = this.getTableModel(table); // 修正列的 span 场景
var cols = table.find('col');
if (cols.length !== 0) {
for (var c = cols.length - 1; c >= 0; c--) {
var _cols$eq3;
var colElement = cols[c];
var _width = (_cols$eq3 = cols.eq(c)) === null || _cols$eq3 === void 0 ? void 0 : _cols$eq3.attributes('width');
if (_width && !_width.endsWith('%')) {
var _cols$eq4;
var widthValue = parseInt(_width);
if (!Number.isNaN(widthValue)) (_cols$eq4 = cols.eq(c)) === null || _cols$eq4 === void 0 ? void 0 : _cols$eq4.attributes('width', widthValue);
}
if (colElement.span > 1) {
var addCount = colElement.span - 1;
while (addCount--) {
var _ref3, _cols$c$parentElement2;
(_ref3 = (_cols$c$parentElement2 = cols[c].parentElement) !== null && _cols$c$parentElement2 !== void 0 ? _cols$c$parentElement2 : cols[c].parentNode) === null || _ref3 === void 0 ? void 0 : _ref3.insertBefore(cols[c].cloneNode(), cols[c]);
}
}
}
cols = table.find('col');
if (cols.length < model.cols) {
var lastCol = cols.length - 1;
var colsAddCount = model.cols - cols.length;
while (colsAddCount--) {
var _ref4, _cols$0$parentElement2;
(_ref4 = (_cols$0$parentElement2 = cols[0].parentElement) !== null && _cols$0$parentElement2 !== void 0 ? _cols$0$parentElement2 : cols[0].parentNode) === null || _ref4 === void 0 ? void 0 : _ref4.appendChild(cols[lastCol].cloneNode());
}
}
table.find('col').attributes('span', 1);
} else {
var colgroup = table.find('colgroup')[0];
if (!colgroup) {
colgroup = document.createElement('colgroup');
}
table.prepend(colgroup);
var widths = function (table) {
var trs = table.find('tr'); // 找到td最多的那行,不然别的行可能会有合并的单元格
var mainTr = trs[0];
trs.each(function (node) {
var tr = node;
if (tr.cells.length > mainTr.cells.length) {
mainTr = tr;
}
});
var tds = engine.$(mainTr).find('td');
var widthArray = [];
tds.each(function (_, index) {
var tdNode = tds.eq(index);
if (!tdNode) return;
var colWidth = tdNode.attributes('data-colwidth');
var tdWidth = tdNode.attributes('width') || tdNode.css('width');
var tdColSpan = tdNode[0].colSpan;
if (colWidth) {
colWidth = colWidth.split(',');
} else if (tdWidth) {
var w = parseInt(tdWidth);
var borderWidth = tdNode.css('border-width');
var paddingLeft = tdNode.css('padding-left');
var paddingRight = tdNode.css('padding-right');
if (borderWidth) {
w += parseInt(convertToPX(borderWidth));
}
if (paddingLeft) {
w += parseInt(convertToPX(paddingLeft));
}
if (paddingRight) {
w += parseInt(convertToPX(paddingRight));
}
tdWidth = w / tdColSpan;
}
for (var o = 0; tdColSpan > o; o++) {
if (colWidth && colWidth[o]) {
widthArray.push(parseInt(colWidth[o]));
} else if (tdWidth) {
widthArray.push(parseInt(tdWidth.toString()));
} else {
widthArray.push(undefined);
}
}
});
var td = table.find('td');
td.css('width', '');
td.css('border-width', '');
td.css('padding-left', '');
td.css('padding-right', '');
td.removeAttributes('data-colwidth');
td.removeAttributes('width');
return widthArray;
}(table);
var col = document.createElement('col');
for (var f = 0; model.cols > f; f++) {
var node = col.cloneNode();
if (widths[f]) {
node.setAttribute('width', (widths[f] || '').toString());
}
colgroup.appendChild(node);
}
} // 数据模型和实际 dom 结构的行数不一致,需要寻找并补齐行
var tableElement = table.get();
model.table.forEach(function (tr, r) {
if (!tableElement.rows[r]) {
tableElement.insertRow(r);
}
var shadow = tr.filter(function (td) {
return td.isShadow;
});
var shadowCount = shadow.length;
while (shadowCount--) {
// if (r === 0) {
// tableElement.rows[r].insertCell(0);
// } else {
tableElement.rows[r].insertCell(); // }
}
}); // 修正行高
var trs = table.find('tr');
trs.each(function (_, index) {
var _classPrivateFieldLoo2;
var $tr = trs.eq(index);
if (!$tr) return;
var h = $tr.css('height'); // 一般word里面的表格行高是0px就是空行,这里直接删除
if (h === '0px') {
$tr.remove();
return;
}
var height = parseInt(h);
height = height || ((_classPrivateFieldLoo2 = _classPrivateFieldLooseBase(_this2, _editor)[_editor].plugin.findPlugin('table')) === null || _classPrivateFieldLoo2 === void 0 ? void 0 : _classPrivateFieldLoo2.options.rowMinHeight) || 0;
$tr.css('height', height + 'px');
});
return table;
}
}]);
return Helper;
}();
var menuData = (function (locale) {
return [{
action: 'cut',
icon: 'cut',
text: locale.cut
}, {
action: 'copy',
icon: 'copy',
text: locale.copy
}, {
action: 'mockPaste',
icon: 'paste',
text: locale.paste
}, {
split: true
}, {
action: 'insertColLeft',
icon: 'insert-col-left',
text: locale.insertColLeft
}, {
action: 'insertColRight',
icon: 'insert-col-right',
text: locale.insertColRight
}, {
action: 'insertRowUp',
icon: 'insert-row-up',
text: locale.insertRowUp
}, {
action: 'insertRowDown',
icon: 'insert-row-down',
text: locale.insertRowDown
}, {
split: true
}, {
action: 'mergeCell',
icon: 'merge-cell',
text: locale.mergeCell
}, {
action: 'splitCell',
icon: 'split-cell',
text: locale.splitCell
}, {
split: true
}, {
action: 'removeCol',
icon: 'remove-col',
text: locale.removeCol
}, {
action: 'removeRow',
icon: 'remove-row',
text: locale.removeRow
}, {
split: true
}, {
action: 'removeTable',
icon: 'remove-table',
text: locale.removeTable
}, {
split: true
}, {
action: 'clear',
icon: 'clear',
text: locale.clear
}];
});
var ControllBar = /*#__PURE__*/function (_EventEmitter) {
_inherits(ControllBar, _EventEmitter);
var _super = _createSuper(ControllBar);
//行删除按钮
//列删除按钮
//列增加按钮相关
//行增加按钮相关
function ControllBar(editor, table, options) {
var _this;
_classCallCheck(this, ControllBar);
_this = _super.call(this);
_this.editor = void 0;
_this.table = void 0;
_this.COL_MIN_WIDTH = void 0;
_this.ROW_MIN_HEIGHT = void 0;
_this.MAX_INSERT_NUM = void 0;
_this.tableRoot = void 0;
_this.colsHeader = void 0;
_this.rowsHeader = void 0;
_this.tableHeader = void 0;
_this.menuBar = void 0;
_this.dragging = void 0;
_this.draggingHeader = void 0;
_this.changeSize = void 0;
_this.viewport = void 0;
_this.placeholder = void 0;
_this.contextVisible = false;
_this.rowDeleteButton = void 0;
_this.colDeleteButton = void 0;
_this.colAddButton = void 0;
_this.colAddAlign = void 0;
_this.colAddButtonSplit = void 0;
_this.moveColIndex = -1;
_this.hideColAddButtonTimeount = void 0;
_this.rowAddButton = void 0;
_this.rowAddAlign = void 0;
_this.rowAddButtonSplit = void 0;
_this.moveRowIndex = -1;
_this.hideRowAddButtonTimeount = void 0;
_this.onMouseDownColsHeader = function (event) {
var trigger = engine.$(event.target || []).closest(Template.COLS_HEADER_TRIGGER_CLASS); //不可移动状态
if (trigger.length === 0) {
//右键显示菜单
if (event instanceof MouseEvent && event.button === 2) {
_this.showContextMenu(event);
}
return;
} //开始调整列宽度
_this.startChangeCol(trigger, event);
};
_this.onMouseDownRowsHeader = function (event) {
var trigger = engine.$(event.target || []).closest(Template.ROWS_HEADER_TRIGGER_CLASS); //不可移动状态
if (trigger.length === 0) {
//右键显示菜单
if (event instanceof MouseEvent && event.button === 2) {
_this.showContextMenu(event);
}
return;
} //开始调整行高度
_this.startChangeRow(trigger, event);
};
_this.onClickColsHeader = function (event) {
var _this$colsHeader;
var selection = _this.table.selection;
var trigger = engine.$(event.target || []).closest(Template.COLS_HEADER_TRIGGER_CLASS);
if (trigger.length > 0) return;
var colHeader = engine.$(event.target || []).closest(Template.COLS_HEADER_ITEM_CLASS);
if (colHeader.length === 0) return;
var index = (_this$colsHeader = _this.colsHeader) === null || _this$colsHeader === void 0 ? void 0 : _this$colsHeader.find(Template.COLS_HEADER_ITEM_CLASS).toArray().findIndex(function (item) {
return item.equal(colHeader);
});
if (index === undefined) return;
selection.selectCol(index);
};
_this.onClickRowsHeader = function (event) {
var _this$rowsHeader;
var selection = _this.table.selection;
var trigger = engine.$(event.target || []).closest(Template.ROWS_HEADER_TRIGGER_CLASS);
if (trigger.length > 0) return;
var rowHeader = engine.$(event.target || []).closest(Template.ROWS_HEADER_ITEM_CLASS);
if (rowHeader.length === 0) return;
var index = (_this$rowsHeader = _this.rowsHeader) === null || _this$rowsHeader === void 0 ? void 0 : _this$rowsHeader.find(Template.ROWS_HEADER_ITEM_CLASS).toArray().findIndex(function (item) {
return item.equal(rowHeader);
});
if (index === undefined) return;
selection.selectRow(index);
};
_this.onClickTableHeader = function (event) {
var _this$tableHeader;
event.preventDefault();
var selection = _this.table.selection;
if ((_this$tableHeader = _this.tableHeader) === null || _this$tableHeader === void 0 ? void 0 : _this$tableHeader.hasClass('selected')) {
selection.clearSelect();
} else {
var tableModel = selection.tableModel;
if (!tableModel) return;
selection.select({
row: 0,
col: 0
}, {
row: tableModel.rows - 1,
col: tableModel.cols - 1
});
}
};
_this.onChangeSize = function (event) {
if (!_this.dragging) return;
if (_this.dragging.y > -1) {
_this.onChangeRowHeight(event);
} else if (_this.dragging.x > -1) {
_this.onChangeColWidth(event);
}
_this.emit('sizeChanging');
};
_this.onChangeSizeEnd = function (event) {
if (event.type === 'mouseleave' && _this.table.getCenter().contains(event['toElement'])) {
return;
}
if (_this.dragging && _this.changeSize) {
var _this$changeSize$trig = _this.changeSize.trigger,
width = _this$changeSize$trig.width,
height = _this$changeSize$trig.height,
element = _this$changeSize$trig.element;
element.removeClass('dragging');
if (_this.dragging.x > -1) element.css('height', "".concat(height, "px"));
if (_this.dragging.y > -1) element.css('width', "".concat(width, "px"));
_this.dragging = undefined; // 拖完再渲染一次,行高会受内容限制,无法拖到你想要的高度
_this.renderRowBars();
_this.emit('sizeChanged');
}
_this.unbindChangeSizeEvent();
};
_this.onDragStartColsHeader = function (event) {
var _this$colsHeader2, _this$colsHeader3;
event.stopPropagation();
var selection = _this.table.selection;
var selectArea = selection.getSelectArea();
if (!event.target || !selectArea.allRow) return;
var colBar = engine.$(event.target).closest(Template.COLS_HEADER_ITEM_CLASS);
if (colBar.length === 0) return;
var index = (_this$colsHeader2 = _this.colsHeader) === null || _this$colsHeader2 === void 0 ? void 0 : _this$colsHeader2.find(Template.COLS_HEADER_ITEM_CLASS).toArray().findIndex(function (item) {
return item.equal(colBar);
});
if (index === undefined) return;
var drag_col = index;
if (drag_col < selectArea.begin.col || drag_col > selectArea.end.col) return;
_this.draggingHeader = {
element: colBar,
minIndex: selectArea.begin.col,
maxIndex: selectArea.end.col,
count: selectArea.end.col - selectArea.begin.col + 1
};
colBar.addClass('dragging');
colBar.find('.drag-info').html(_this.editor.language.get('table', 'draggingCol').replace('$data', _this.draggingHeader.count.toString()));
(_this$colsHeader3 = _this.colsHeader) === null || _this$colsHeader3 === void 0 ? void 0 : _this$colsHeader3.addClass('dragging');
_this.table.helper.fixDragEvent(event);
_this.bindDragColEvent();
};
_this.onDragStartRowsHeader = function (event) {
var _this$rowsHeader2, _this$rowsHeader3;
event.stopPropagation();
var selection = _this.table.selection;
var selectArea = selection.getSelectArea();
if (!event.target || !selectArea.allCol) return;
var rowBar = engine.$(event.target).closest(Template.ROWS_HEADER_ITEM_CLASS);
if (rowBar.length === 0) return;
var index = (_this$rowsHeader2 = _this.rowsHeader) === null || _this$rowsHeader2 === void 0 ? void 0 : _this$rowsHeader2.find(Template.ROWS_HEADER_ITEM_CLASS).toArray().findIndex(function (item) {
return item.equal(rowBar);
});
if (index === undefined) return;
var drag_row = index;
if (drag_row < selectArea.begin.row || drag_row > selectArea.end.row) return;
_this.draggingHeader = {
element: rowBar,
minIndex: selectArea.begin.row,
maxIndex: selectArea.end.row,
count: selectArea.end.row - selectArea.begin.row + 1
};
rowBar.addClass('dragging');
rowBar.find('.drag-info').html(_this.editor.language.get('table', 'draggingRow').replace('$data', _this.draggingHeader.count.toString()));
(_this$rowsHeader3 = _this.rowsHeader) === null || _this$rowsHeader3 === void 0 ? void 0 : _this$rowsHeader3.addClass('dragging');
_this.table.helper.fixDragEvent(event);
_this.bindDragRowEvent();
};
_this.onDragCol = function (event) {
var _this$colsHeader5;
event.stopPropagation();
if (!_this.draggingHeader || !event.target) return;
if (undefined === _this.dragging) {
_this.dragging = {
x: event.offsetX,
y: event.offsetY
};
}
if (event.dataTransfer) event.dataTransfer.dropEffect = 'move'; // dragover会不断的触发事件,这里做一个截流,鼠标在3像素以内不去计算
if (Math.abs(_this.dragging.x - event.offsetX) < 3) return;
_this.dragging.x = event.offsetX;
_this.draggingHeader.element.removeClass('dragging');
var td = engine.$(event.target).closest('td');
var colBar = engine.$(event.target).closest(Template.COLS_HEADER_ITEM_CLASS);
if (td.length === 0 && colBar.length === 0) return;
if (colBar.length > 0) {
var _this$colsHeader4;
var index = (_this$colsHeader4 = _this.colsHeader) === null || _this$colsHeader4 === void 0 ? void 0 : _this$colsHeader4.find(Template.COLS_HEADER_ITEM_CLASS).toArray().findIndex(function (item) {
return item.equal(colBar);
});
if (index === undefined) return;
var currentCol = index;
var _dropCol = event.offsetX > colBar.get().offsetWidth / 2 ? currentCol + 1 : currentCol;
_this.showPlaceHolder(_dropCol, _dropCol !== currentCol);
return;
}
var colBars = (_this$colsHeader5 = _this.colsHeader) === null || _this$colsHeader5 === void 0 ? void 0 : _this$colsHeader5.find(Template.COLS_HEADER_ITEM_CLASS);
if (!colBars) return;
var tdElement = td.get();
var colSpan = tdElement.colSpan;
var _this$table$selection = _this.table.selection.getCellPoint(td),
_this$table$selection2 = _slicedToArray(_this$table$selection, 2),
row = _this$table$selection2[0],
col = _this$table$selection2[1];
var dropCol = col;
var _passWidth = 0;
for (var i = 0; i < colSpan; i++) {
var colElement = colBars.eq(col + i).get();
if (_passWidth + colElement.offsetWidth / 2 > event.offsetX) {
dropCol = col + i;
break;
}
if (_passWidth + colElement.offsetWidth > event.offsetX) {
dropCol = col + i + 1;
break;
}
_passWidth += colElement.offsetWidth;
}
_this.showPlaceHolder(dropCol, dropCol !== col);
};
_this.onDragColEnd = function () {
var _this$table$wrapper, _this$placeholder;
_this.unbindDragColEvent();
var _ref = _this.draggingHeader || {},
index = _ref.index,
count = _ref.count,
isNext = _ref.isNext;
if (!_this.draggingHeader || index === undefined || count === undefined) return;
var _this$table = _this.table,
command = _this$table.command,
selection = _this$table.selection;
var selectArea = selection.getSelectArea();
var colBars = (_this$table$wrapper = _this.table.wrapper) === null || _this$table$wrapper === void 0 ? void 0 : _this$table$wrapper.find(Template.COLS_HEADER_ITEM_CLASS);
if (!colBars) return;
var widths = [];
for (var c = selectArea.begin.col; c <= selectArea.end.col; c++) {
var _colBars$eq, _colBars$eq$get;
widths.push(((_colBars$eq = colBars.eq(c)) === null || _colBars$eq === void 0 ? void 0 : (_colBars$eq$get = _colBars$eq.get()) === null || _colBars$eq$get === void 0 ? void 0 : _colBars$eq$get.offsetWidth) || 0);
}
command.mockCopy();
if (selectArea.begin.col > index) {
var targetIndex = isNext ? index - 1 : index;
command.removeCol();
command.insertColAt(targetIndex, count, isNext, widths, true);
selection.selectCol(targetIndex, targetIndex + count - 1);
command.mockPaste(true);
} else {
command.removeCol();
var _targetIndex = (isNext ? index - 1 : index) - count;
command.insertColAt(_targetIndex, count, isNext, widths, true);
selection.selectCol(_targetIndex + 1, _targetIndex + count);
command.mockPaste(true);
}
(_this$placeholder = _this.placeholder) === null || _this$placeholder === void 0 ? void 0 : _this$placeholder.css('display', 'none');
_this.draggingHeader = undefined;
_this.dragging = undefined;
};
_this.onDragRow = function (event) {
var _this$rowsHeader5;
event.stopPropagation();
if (!_this.draggingHeader || !event.target) return;
if (undefined === _this.dragging) {
_this.dragging = {
x: event.offsetX,
y: event.offsetY
};
} // dragover会不断的触发事件,这里做一个截流,鼠标在3像素以内不去计算
if (Math.abs(_this.dragging.y - event.offsetY) < 3) return;
_this.dragging.y = event.offsetY;
_this.draggingHeader.element.removeClass('dragging');
var td = engine.$(event.target).closest('td');
var rowBar = engine.$(event.target).closest(Template.ROWS_HEADER_ITEM_CLASS);
if (td.length === 0 && rowBar.length === 0) return;
if (rowBar.length > 0) {
var _this$rowsHeader4;
var index = (_this$rowsHeader4 = _this.rowsHeader) === null || _this$rowsHeader4 === void 0 ? void 0 : _this$rowsHeader4.find(Template.ROWS_HEADER_ITEM_CLASS).toArray().findIndex(function (item) {
return item.equal(rowBar);
});
if (index === undefined) return;
var currentRow = index;
var _dropRow = event.offsetY > rowBar.get().offsetHeight / 2 ? currentRow + 1 : currentRow;
_this.showPlaceHolder(_dropRow, _dropRow !== currentRow);
return;
}
var rowBars = (_this$rowsHeader5 = _this.rowsHeader) === null || _this$rowsHeader5 === void 0 ? void 0 : _this$rowsHeader5.find(Template.ROWS_HEADER_ITEM_CLASS);
if (!rowBars) return;
var rowSpan = td.get().rowSpan;
var _this$table$selection3 = _this.table.selection.getCellPoint(td),
_this$table$selection4 = _slicedToArray(_this$table$selection3, 1),
row = _this$table$selection4[0];
var dropRow = row;
var _passHeight = 0;
for (var i = 0; i < rowSpan; i++) {
var rowElement = rowBars[row + i];
if (_passHeight + rowElement.offsetHeight / 2 > event.offsetY) {
dropRow = row + i;
break;
}
if (_passHeight + rowElement.offsetHeight > event.offsetY) {
dropRow = row + i + 1;
break;
}
_passHeight += rowElement.offsetHeight;
}
_this.showPlaceHolder(dropRow, dropRow !== row);
};
_this.onDragRowEnd = function () {
var _this$placeholder2;
_this.unbindDragRowEvent();
var _ref2 = _this.draggingHeader || {},
index = _ref2.index,
count = _ref2.count,
isNext = _ref2.isNext;
if (!_this.draggingHeader || index === undefined || count === undefined) return;
var _this$table2 = _this.table,
command = _this$table2.command,
selection = _this$table2.selection;
var selectArea = selection.getSelectArea();
var begin = selectArea.begin,
end = selectArea.end;
command.mockCopy();
if (begin.row > index) {
var targetIndex = isNext ? index - 1 : index;
command.removeRow();
command.insertRowAt(targetIndex, count, !isNext, true);
selection.selectRow(index, index + count - 1);
command.mockPaste(true);
} else {
command.removeRow();
var _targetIndex2 = (isNext ? index - 1 : index) - count;
command.insertRowAt(_targetIndex2, count, !isNext, true);
selection.selectRow(_targetIndex2 + 1, _targetIndex2 + count);
command.mockPaste(true);
}
(_this$placeholder2 = _this.placeholder) === null || _this$placeholder2 === void 0 ? void 0 : _this$placeholder2.css('display', 'none');
_this.draggingHeader = undefined;
_this.dragging = undefined;
};
_this.menuSets = new WeakSet();
_this.onMenuInputMousedown = function (event) {
event.stopPropagation();
};
_this.handleHighlightRow = function () {
var selection = _this.table.selection;
var tableModel = selection.tableModel;
if (!tableModel) return;
var selectArea = _objectSpread2({}, selection.getSelectArea());
selectArea.allCol = true;
selectArea.begin = selectArea.begin;
selectArea.end = selectArea.end;
selection.showHighlight(selectArea);
};
_this.handleHighlightCol = function () {
var selection = _this.table.selection;
var tableModel = selection.tableModel;
if (!tableModel) return;
var selectArea = _objectSpread2({}, selection.getSelectArea());
selectArea.allRow = true;
selectArea.begin = selectArea.begin;
selectArea.end = selectArea.end;
selection.showHighlight(selectArea);
};
_this.handleHighlightTable = function () {
var selection = _this.table.selection;
var tableModel = selection.tableModel;
if (!tableModel) return;
var selectArea = _objectSpread2({}, selection.getSelectArea());
selectArea.allRow = true;
selectArea.allCol = true;
selectArea.begin = {
row: 0,
col: 0
};
selectArea.end = {
row: tableModel.rows - 1,
col: tableModel.cols - 1
};
selection.showHighlight(selectArea);
};
_this.table = table;
_this.editor = editor;
_this.COL_MIN_WIDTH = options.col_min_width;
_this.ROW_MIN_HEIGHT = options.row_min_height;
_this.MAX_INSERT_NUM = options.max_insert_num;
return _this;
}
_createClass(ControllBar, [{
key: "init",
value: function init() {
var wrapper = this.table.wrapper;
if (!wrapper) return;
this.tableRoot = wrapper.find(Template.TABLE_CLASS);
this.colsHeader = wrapper.find(Template.COLS_HEADER_CLASS);
this.rowsHeader = wrapper.find(Template.ROWS_HEADER_CLASS);
this.tableHeader = wrapper.find(Template.HEADER_CLASS);
this.viewport = wrapper.find(Template.VIEWPORT);
this.menuBar = wrapper.find(Template.MENUBAR_CLASS);
this.placeholder = wrapper.find(Template.PLACEHOLDER_CLASS);
this.renderRowBars();
this.renderColBars();
this.bindEvents();
}
}, {
key: "renderRowBars",
value: function renderRowBars() {
var _this$tableRoot,
_this$rowDeleteButton,
_this$rowsHeader6,
_this$rowAddButton,
_this$rowsHeader7,
_this$rowAddButton2,
_this$rowDeleteButton2,
_this2 = this,
_this$rowAddButton3;
var refershSize = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
var table = (_this$tableRoot = this.tableRoot) === null || _this$tableRoot === void 0 ? void 0 : _this$tableRoot.get();
if (!table) return; //行删除按钮
(_this$rowDeleteButton = this.rowDeleteButton) === null || _this$rowDeleteButton === void 0 ? void 0 : _this$rowDeleteButton.removeAllEvents();
this.rowDeleteButton = (_this$rowsHeader6 = this.rowsHeader) === null || _this$rowsHeader6 === void 0 ? void 0 : _this$rowsHeader6.find(Template.ROW_DELETE_BUTTON_CLASS); //行增加按钮
(_this$rowAddButton = this.rowAddButton) === null || _this$rowAddButton === void 0 ? void 0 : _this$rowAddButton.removeAllEvents();
this.rowAddButton = (_this$rowsHeader7 = this.rowsHeader) === null || _this$rowsHeader7 === void 0 ? void 0 : _this$rowsHeader7.find(Template.ROW_ADD_BUTTON_CLASS);
this.rowAddButtonSplit = (_this$rowAddButton2 = this.rowAddButton) === null || _this$rowAddButton2 === void 0 ? void 0 : _this$rowAddButton2.find(Template.ROW_ADD_BUTTON_SPLIT_CLASS);
(_this$rowDeleteButton2 = this.rowDeleteButton) === null || _this$rowDeleteButton2 === void 0 ? void 0 : _this$rowDeleteButton2.on('mouseover', function (event) {
return _this2.handleHighlightRow();
}).on('mouseleave', function (event) {
return _this2.hideHighlight(event);
}).on('mousedown', function (event) {
event.preventDefault();
_this2.table.command['removeRow']();
});
(_this$rowAddButton3 = this.rowAddButton) === null || _this$rowAddButton3 === void 0 ? void 0 : _this$rowAddButton3.on('mouseenter', function () {
var _this2$rowsHeader;
if (_this2.hideRowAddButtonTimeount) clearTimeout(_this2.hideRowAddButtonTimeount);
(_this2$rowsHeader = _this2.rowsHeader) === null || _this2$rowsHeader === void 0 ? void 0 : _this2$rowsHeader.css('z-index', 128);
}).on('mouseleave', function () {
_this2.hideRowAddButtonTimeount = setTimeout(function () {
var _this2$rowAddButton, _this2$rowsHeader2;
(_this2$rowAddButton = _this2.rowAddButton) === null || _this2$rowAddButton === void 0 ? void 0 : _this2$rowAddButton.hide();
(_this2$rowsHeader2 = _this2.rowsHeader) === null || _this2$rowsHeader2 === void 0 ? void 0 : _this2$rowsHeader2.css('z-index', 1);
_this2.moveRowIndex = -1;
}, 200);
}).on('mousedown', function (event) {
event.preventDefault();
_this2.table.command.insertRowAt(_this2.moveRowIndex, 1, _this2.rowAddAlign === 'down' ? false : true);
});
if (refershSize) {
var _this$rowsHeader8, _this$rowsHeader9, _this$table$wrapper2, _this$rowsHeader10;
var trs = table.rows;
var end = (trs === null || trs === void 0 ? void 0 : trs.length) || 0;
var rowBars = (_this$rowsHeader8 = this.rowsHeader) === null || _this$rowsHeader8 === void 0 ? void 0 : _this$rowsHeader8.find(Template.ROWS_HEADER_ITEM_CLASS);
if (rowBars) {
for (var i = 0; i < end; i++) {
var newHeight = engine.getComputedStyle(trs[i], 'height');
var bar = rowBars[i];
var oldHeight = bar === null || bar === void 0 ? void 0 : bar.style.height;
if (bar && newHeight !== oldHeight) bar.style.height = newHeight;
}
}
var rowTrigger = (_this$rowsHeader9 = this.rowsHeader) === null || _this$rowsHeader9 === void 0 ? void 0 : _this$rowsHeader9.find(Template.ROWS_HEADER_TRIGGER_CLASS);
var tableWidth = this.tableRoot.width();
var wrapperWidth = ((_this$table$wrapper2 = this.table.wrapper) === null || _this$table$wrapper2 === void 0 ? void 0 : _this$table$wrapper2.width()) || 0;
var width = tableWidth < wrapperWidth ? tableWidth : wrapperWidth;
var newWidth = width + (((_this$rowsHeader10 = this.rowsHeader) === null || _this$rowsHeader10 === void 0 ? void 0 : _this$rowsHeader10.width()) || 0) - 1;
rowTrigger === null || rowTrigger === void 0 ? void 0 : rowTrigger.each(function (row) {
var oldWidth = row.style.width;
if (oldWidth !== newWidth + 'px') {
row.style.width = newWidth + 'px';
}
});
}
}
}, {
key: "renderColBars",
value: function renderColBars() {
var _this$tableRoot2,
_this$colDeleteButton,
_this$table$wrapper3,
_this$colAddButton,
_this$colsHeader6,
_this$colAddButton2,
_this$colDeleteButton2,
_this3 = this,
_this$colAddButton3,
_this$tableRoot3,
_this$colsHeader7;
var refershSize = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
var table = (_this$tableRoot2 = this.tableRoot) === null || _this$tableRoot2 === void 0 ? void 0 : _this$tableRoot2.get();
if (!table) return;
var tableWidth = engine.removeUnit(engine.getComputedStyle(table, 'width')); //列删除按钮
(_this$colDeleteButton = this.colDeleteButton) === null || _this$colDeleteButton === void 0 ? void 0 : _this$colDeleteButton.removeAllEvents();
this.colDeleteButton = (_this$table$wrapper3 = this.table.wrapper) === null || _this$table$wrapper3 === void 0 ? void 0 : _this$table$wrapper3.find(Template.COL_DELETE_BUTTON_CLASS); //列增加按钮
(_this$colAddButton = this.colAddButton) === null || _this$colAddButton === void 0 ? void 0 : _this$colAddButton.removeAllEvents();
this.colAddButton = (_this$colsHeader6 = this.colsHeader) === null || _this$colsHeader6 === void 0 ? void 0 : _this$colsHeader6.find(Template.COL_ADD_BUTTON_CLASS);
this.colAddButtonSplit = (_this$colAddButton2 = this.colAddButton) === null || _this$colAddButton2 === void 0 ? void 0 : _this$colAddButton2.find(Template.COL_ADD_BUTTON_SPLIT_CLASS);
(_this$colDeleteButton2 = this.colDeleteButton) === null || _this$colDeleteButton2 === void 0 ? void 0 : _this$colDeleteButton2.on('mouseover', function (event) {
return _this3.handleHighlightCol();
}).on('mouseleave', function (event) {
return _this3.hideHighlight(event);
}).on('mousedown', function (event) {
event.preventDefault();
_this3.table.command['removeCol']();
});
(_this$colAddButton3 = this.colAddButton) === null || _this$colAddButton3 === void 0 ? void 0 : _this$colAddButton3.on('mouseenter', function () {
if (_this3.hideColAddButtonTimeount) clearTimeout(_this3.hideColAddButtonTimeount);
}).on('mouseleave', function () {
_this3.hideColAddButtonTimeount = setTimeout(function () {
var _this3$colAddButton;
(_this3$colAddButton = _this3.colAddButton) === null || _this3$colAddButton === void 0 ? void 0 : _this3$colAddButton.hide();
_this3.moveColIndex = -1;
}, 200);
}).on('mousedown', function (event) {
event.preventDefault();
if (_this3.moveColIndex > -1) _this3.table.command.insertColAt(_this3.moveColIndex, 1, _this3.colAddAlign === 'right' ? false : true);
});
var containerWidth = this.table.root.width();
var width = !this.table.enableScroll ? Math.min(tableWidth, containerWidth) : tableWidth;
(_this$tableRoot3 = this.tableRoot) === null || _this$tableRoot3 === void 0 ? void 0 : _this$tableRoot3.css('width', "".concat(width, "px"));
(_this$colsHeader7 = this.colsHeader) === null || _this$colsHeader7 === void 0 ? void 0 : _this$colsHeader7.css('width', "".concat(width, "px"));
if (refershSize) this.renderColSize();
}
}, {
key: "renderColSize",
value: function renderColSize() {
var _this$tableRoot4,
_this$tableRoot5,
_this$colsHeader8,
_this4 = this,
_this$colsHeader9,
_this$colsHeader10;
var table = (_this$tableRoot4 = this.tableRoot) === null || _this$tableRoot4 === void 0 ? void 0 : _this$tableRoot4.get();
if (!table) return;
var tableWidth = engine.removeUnit(engine.getComputedStyle(table, 'width'));
if (!this.table.enableScroll) {
tableWidth = Math.min(tableWidth, this.table.root.width());
}
var cols = (_this$tableRoot5 = this.tableRoot) === null || _this$tableRoot5 === void 0 ? void 0 : _this$tableRoot5.find('col');
if (!cols) return;
var isInit = true;
var colWidthArray = {};
var allColWidth = 0;
var colIndex = 0;
cols.each(function (_, i) {
var col = cols[i];
var colWidth = engine.removeUnit(engine.$(col).attributes('width'));
if (colWidth) {
colWidthArray[i] = colWidth;
allColWidth += colWidth;
isInit = false;
} else {
colIndex++;
}
});
var colBars = (_this$colsHeader8 = this.colsHeader) === null || _this$colsHeader8 === void 0 ? void 0 : _this$colsHeader8.find(Template.COLS_HEADER_ITEM_CLASS);
if (!colBars) return; //初始化,col的宽度为0的时候
var tableModel = this.table.selection.tableModel;
if (isInit) {
var _tableModel$table;
var tdWidth = [];
tableModel === null || tableModel === void 0 ? void 0 : (_tableModel$table = tableModel.table) === null || _tableModel$table === void 0 ? void 0 : _tableModel$table.forEach(function (trModel) {
trModel.forEach(function (tdModel, c) {
if (!tdWidth[c] && !_this4.table.helper.isEmptyModelCol(tdModel) && !tdModel.isMulti && tdModel.element) {
tdWidth[c] = engine.removeUnit(engine.getComputedStyle(tdModel.element, 'width'));
}
});
}); // 合并单元格的存在,可能出现某些列全部属于合并单元格,导致无法通过 td 的 offsetWidth 直接获得,需要把剩余的未知行求平均数
var unkownCount = 0;
var knownWidth = 0;
for (var c = 0; c < cols.length; c++) {
if (!tdWidth[c]) {
unkownCount++;
} else {
knownWidth += tdWidth[c];
}
}
var averageWidth = 0;
if (unkownCount > 0) {
averageWidth = Math.round(Math.round((tableWidth - knownWidth) / unkownCount) * 10000) / 10000;
}
for (var i = 0; i < cols.length; i++) {
var _colBars$eq2, _cols$eq;
var width = tdWidth[i] || averageWidth;
(_colBars$eq2 = colBars.eq(i)) === null || _colBars$eq2 === void 0 ? void 0 : _colBars$eq2.css('width', width + 'px');
(_cols$eq = cols.eq(i)) === null || _cols$eq === void 0 ? void 0 : _cols$eq.attributes('width', width);
}
} else if (colIndex) {
var _averageWidth = Math.round((tableWidth - allColWidth) / colIndex * 10000) / 10000;
cols.each(function (_, index) {
var _colBars$eq3, _cols$eq2;
var width = undefined === colWidthArray[index] ? _averageWidth : colWidthArray[index];
(_colBars$eq3 = colBars.eq(index)) === null || _colBars$eq3 === void 0 ? void 0 : _colBars$eq3.css('width', width + 'px');
(_cols$eq2 = cols.eq(index)) === null || _cols$eq2 === void 0 ? void 0 : _cols$eq2.attributes('width', width);
});
} else {
cols.each(function (_, index) {
var newWidth = Math.round(tableWidth * colWidthArray[index] / allColWidth * 10000) / 10000;
var bar = colBars[index];
var oldWidth = bar === null || bar === void 0 ? void 0 : bar.style.width;
if (bar && oldWidth !== newWidth + 'px') bar.style.width = newWidth + 'px';
});
}
var colTrigger = (_this$colsHeader9 = this.colsHeader) === null || _this$colsHeader9 === void 0 ? void 0 : _this$colsHeader9.find(Template.COLS_HEADER_TRIGGER_CLASS);
var newHeight = ((tableModel === null || tableModel === void 0 ? void 0 : tableModel.height) || 0) + (((_this$colsHeader10 = this.colsHeader) === null || _this$colsHeader10 === void 0 ? void 0 : _this$colsHeader10.height()) || 0);
colTrigger === null || colTrigger === void 0 ? void 0 : colTrigger.each(function (col) {
var oldHeight = col.style.height;
if (oldHeight !== newHeight + 'px') {
col.style.height = newHeight + 'px';
}
});
}
/**
* 绑定事件
*/
}, {
key: "bindEvents",
value: function bindEvents() {
var _this$colsHeader11,
_this$rowsHeader11,
_this$tableHeader2,
_this$table$wrapper4,
_this$tableRoot6,
_this$colsHeader12,
_this$rowsHeader12,
_this$tableRoot7,
_this5 = this,
_this$menuBar,
_this$menuBar2,
_this$menuBar3,
_this$viewport,
_this$colsHeader13,
_this$colsHeader14,
_this$colsHeader15,
_this$rowsHeader13,
_this$rowsHeader14,
_this$rowsHeader15;
(_this$colsHeader11 = this.colsHeader) === null || _this$colsHeader11 === void 0 ? void 0 : _this$colsHeader11.on(engine.isMobile ? 'touchstart' : 'mousedown', this.onMouseDownColsHeader).on('mouseup', this.onClickColsHeader).on('dragstart', this.onDragStartColsHeader);
(_this$rowsHeader11 = this.rowsHeader) === null || _this$rowsHeader11 === void 0 ? void 0 : _this$rowsHeader11.on(engine.isMobile ? 'touchstart' : 'mousedown', this.onMouseDownRowsHeader).on('mouseup', this.onClickRowsHeader).on('dragstart', this.onDragStartRowsHeader);
(_this$tableHeader2 = this.tableHeader) === null || _this$tableHeader2 === void 0 ? void 0 : _this$tableHeader2.on('mousedown', this.onClickTableHeader);
(_this$table$wrapper4 = this.table.wrapper) === null || _this$table$wrapper4 === void 0 ? void 0 : _this$table$wrapper4.on('contextmenu', function (event) {
return event.preventDefault();
});
(_this$tableRoot6 = this.tableRoot) === null || _this$tableRoot6 === void 0 ? void 0 : _this$tableRoot6.on('contextmenu', function (event) {
return event.preventDefault();
});
(_this$colsHeader12 = this.colsHeader) === null || _this$colsHeader12 === void 0 ? void 0 : _this$colsHeader12.on('contextmenu', function (event) {
return event.preventDefault();
});
(_this$rowsHeader12 = this.rowsHeader) === null || _this$rowsHeader12 === void 0 ? void 0 : _this$rowsHeader12.on('contextmenu', function (event) {
return event.preventDefault();
});
(_this$tableRoot7 = this.tableRoot) === null || _this$tableRoot7 === void 0 ? void 0 : _this$tableRoot7.on('mousedown', function (event) {
return _this5.onTableMouseDown(event);
});
(_this$menuBar = this.menuBar) === null || _this$menuBar === void 0 ? void 0 : _this$menuBar.on('click', function (event) {
return _this5.handleClickMenu(event);
});
(_this$menuBar2 = this.menuBar) === null || _this$menuBar2 === void 0 ? void 0 : _this$menuBar2.on('mouseover', function (event) {
return _this5.handleHoverMenu(event);
});
(_this$menuBar3 = this.menuBar) === null || _this$menuBar3 === void 0 ? void 0 : _this$menuBar3.on('mouseleave', function (event) {
return _this5.hideHighlight(event);
}); //列头部 padding 区域单击让其选中表格卡片上方的blcok
var editor = this.editor;
(_this$viewport = this.viewport) === null || _this$viewport === void 0 ? void 0 : _this$viewport.on(engine.isMobile ? 'touchstart' : 'mousedown', function (event) {
var _this5$viewport;
if (!event.target) return;
var targetNode = engine.$(event.target);
if (!engine.isEngine(editor) || !event.target || !((_this5$viewport = _this5.viewport) === null || _this5$viewport === void 0 ? void 0 : _this5$viewport.equal(targetNode))) return;
event.preventDefault();
event.stopPropagation();
var change = editor.change;
var range = change.range.get();
editor.card.focusPrevBlock(_this5.table, range, true);
editor.card.activate(range.startNode, engine.CardActiveTrigger.MOUSE_DOWN);
change.range.select(range);
});
var colMoveTimeout = null;
(_this$colsHeader13 = this.colsHeader) === null || _this$colsHeader13 === void 0 ? void 0 : _this$colsHeader13.on('mouseenter', function () {
if (_this5.hideColAddButtonTimeount) clearTimeout(_this5.hideColAddButtonTimeount);
}).on('mousemove', function (event) {
if (colMoveTimeout) clearTimeout(colMoveTimeout);
colMoveTimeout = setTimeout(function () {
_this5.onMouseMoveColsHeader(event);
}, 200);
}).on('mouseleave', function (e) {
if (colMoveTimeout) clearTimeout(colMoveTimeout);
_this5.hideColAddButtonTimeount = setTimeout(function () {
var _this5$colAddButton;
(_this5$colAddButton = _this5.colAddButton) === null || _this5$colAddButton === void 0 ? void 0 : _this5$colAddButton.hide();
}, 200);
});
var colItemTimeout = null;
(_this$colsHeader14 = this.colsHeader) === null || _this$colsHeader14 === void 0 ? void 0 : _this$colsHeader14.find(Template.COLS_HEADER_ITEM_CLASS).on('mouseenter', function (e) {
if (colItemTimeout) clearTimeout(colItemTimeout);
colItemTimeout = setTimeout(function () {
if (e.target) {
engine.$(e.target).closest(Template.COLS_HEADER_ITEM_CLASS).addClass('active');
}
}, 200);
}).on('mouseleave', function (e) {
if (colItemTimeout) clearTimeout(colItemTimeout);
if (e.target) {
engine.$(e.target).closest(Template.COLS_HEADER_ITEM_CLASS).removeClass('active');
}
});
var colTriggerTimeout = null;
(_this$colsHeader15 = this.colsHeader) === null || _this$colsHeader15 === void 0 ? void 0 : _this$colsHeader15.find(Template.COLS_HEADER_TRIGGER_CLASS).on('mouseenter', function (e) {
if (colTriggerTimeout) clearTimeout(colTriggerTimeout);
var target = engine.$(e.target || []);
colTriggerTimeout = setTimeout(function () {
target.addClass('active');
}, 200);
}).on('mouseleave', function (e) {
if (colTriggerTimeout) clearTimeout(colTriggerTimeout);
if (e.target) {
engine.$(e.target).removeClass('active');
}
});
var rowMoveTimeout = null;
(_this$rowsHeader13 = this.rowsHeader) === null || _this$rowsHeader13 === void 0 ? void 0 : _this$rowsHeader13.on('mouseenter', function () {
if (_this5.hideRowAddButtonTimeount) clearTimeout(_this5.hideRowAddButtonTimeount);
}).on('mousemove', function (event) {
if (rowMoveTimeout) clearTimeout(rowMoveTimeout);
rowMoveTimeout = setTimeout(function () {
var _this5$rowsHeader;
_this5.onMouseMoveRowsHeader(event);
(_this5$rowsHeader = _this5.rowsHeader) === null || _this5$rowsHeader === void 0 ? void 0 : _this5$rowsHeader.css('z-index', 128);
}, 200);
}).on('mouseleave', function () {
if (rowMoveTimeout) clearTimeout(rowMoveTimeout);
_this5.hideRowAddButtonTimeount = setTimeout(function () {
var _this5$rowsHeader2, _this5$rowAddButton;
(_this5$rowsHeader2 = _this5.rowsHeader) === null || _this5$rowsHeader2 === void 0 ? void 0 : _this5$rowsHeader2.css('z-index', '');
(_this5$rowAddButton = _this5.rowAddButton) === null || _this5$rowAddButton === void 0 ? void 0 : _this5$rowAddButton.hide();
}, 200);
});
var rowItemTimeout = null;
(_this$rowsHeader14 = this.rowsHeader) === null || _this$rowsHeader14 === void 0 ? void 0 : _this$rowsHeader14.find(Template.ROWS_HEADER_ITEM_CLASS).on('mouseenter', function (e) {
if (rowItemTimeout) clearTimeout(rowItemTimeout);
rowItemTimeout = setTimeout(function () {
if (e.target) {
engine.$(e.target).closest(Template.ROWS_HEADER_ITEM_CLASS).addClass('active');
}
}, 200);
}).on('mouseleave', function (e) {
if (rowItemTimeout) clearTimeout(rowItemTimeout);
if (e.target) {
engine.$(e.target).closest(Template.ROWS_HEADER_ITEM_CLASS).removeClass('active');
}
});
var rowTriggerTimeout = null;
(_this$rowsHeader15 = this.rowsHeader) === null || _this$rowsHeader15 === void 0 ? void 0 : _this$rowsHeader15.find(Template.ROWS_HEADER_TRIGGER_CLASS).on('mouseenter', function (e) {
if (rowTriggerTimeout) clearTimeout(rowTriggerTimeout);
var target = engine.$(e.target || []);
rowTriggerTimeout = setTimeout(function () {
target.addClass('active');
}, 200);
}).on('mouseleave', function (e) {
if (rowTriggerTimeout) clearTimeout(rowTriggerTimeout);
if (e.target) {
engine.$(e.target).removeClass('active');
}
});
}
/**
* 在表格上单击
* @param event
*/
}, {
key: "onTableMouseDown",
value: function onTableMouseDown(event) {
if (!event.target) return;
var td = engine.$(event.target).closest('td');
if (td.length > 0 && event.button === 2 && this.table.activated) {
this.showContextMenu(event);
} else {
this.hideContextMenu();
}
}
/**
* 鼠标在列表头上移动
* @param event
*/
}, {
key: "onMouseMoveColsHeader",
value: function onMouseMoveColsHeader(event) {
var _this$colAddButton4, _this$table$selection5;
if (!event.target || !this.colAddButton || !this.colAddButtonSplit) return;
var targetNode = engine.$(event.target);
var itemNode = targetNode.closest(Template.COLS_HEADER_ITEM_CLASS);
if (itemNode.length === 0) return;
var items = this.colsHeader.find(Template.COLS_HEADER_ITEM_CLASS).toArray();
var width = itemNode.width();
var buttonWidth = this.colAddButton.width();
var left = itemNode.get().offsetLeft;
var index = items.findIndex(function (item) {
return item.equal(itemNode);
});
var isEnd = event.offsetX > width / 2 || targetNode.hasClass('cols-trigger');
var isLast = items[items.length - 1].equal(itemNode);
if (isEnd) {
left += isLast ? width - buttonWidth / 2 : width;
}
this.colAddAlign = isEnd ? 'left' : 'right';
this.moveColIndex = index; //+ (isEnd ? 1 : 0);
(_this$colAddButton4 = this.colAddButton) === null || _this$colAddButton4 === void 0 ? void 0 : _this$colAddButton4.show('flex');
this.colAddButton.css('left', "".concat(left, "px"));
this.colAddButton.css('z-index', 128);
var splitHeight = (((_this$table$selection5 = this.table.selection.tableModel) === null || _this$table$selection5 === void 0 ? void 0 : _this$table$selection5.height) || 0) + itemNode.height() + 4;
this.colAddButtonSplit.css('height', "".concat(splitHeight, "px"));
this.colAddButtonSplit.css('left', "".concat(isLast && isEnd ? buttonWidth - 3 + 'px' : ''));
}
/**
* 鼠标在行表头上移动
* @param event
* @returns
*/
}, {
key: "onMouseMoveRowsHeader",
value: function onMouseMoveRowsHeader(event) {
var _this$viewport2, _this$table$selection6;
if (!event.target || !this.rowAddButton || !this.rowAddButtonSplit) return;
var targetNode = engine.$(event.target);
var itemNode = targetNode.closest(Template.ROWS_HEADER_ITEM_CLASS);
if (itemNode.length === 0) return;
var items = this.rowsHeader.find(Template.ROWS_HEADER_ITEM_CLASS).toArray();
var height = itemNode.height();
var top = itemNode.get().offsetTop;
var index = items.findIndex(function (item) {
return item.equal(itemNode);
});
var isEnd = event.offsetY > height / 2 || targetNode.hasClass('rows-trigger');
if (isEnd) {
top += height;
}
this.moveRowIndex = index; //+ (isEnd ? (index === items.length - 1 ? 0 : 1) : 0);
this.rowAddButton.show('flex');
this.rowAddButton.css('top', "".concat(top, "px"));
this.rowAddAlign = isEnd ? 'down' : 'up';
var viewportElement = (_this$viewport2 = this.viewport) === null || _this$viewport2 === void 0 ? void 0 : _this$viewport2.get();
var splitWidth = (((_this$table$selection6 = this.table.selection.tableModel) === null || _this$table$selection6 === void 0 ? void 0 : _this$table$selection6.width) || 0) + itemNode.width() + 4;
var width = Math.min(viewportElement.offsetWidth + 4, splitWidth);
this.rowAddButtonSplit.css('width', "".concat(width, "px"));
}
/**
* 鼠标在列头部按下
* @param event 事件
* @returns
*/
}, {
key: "activeHeader",
value:
/**
* 激活表头状态
* @returns
*/
function activeHeader() {
var _this$colsHeader16, _this$rowsHeader16, _this$tableHeader3;
var selectArea = this.table.selection.getSelectArea();
this.clearActiveStatus();
var colBars = (_this$colsHeader16 = this.colsHeader) === null || _this$colsHeader16 === void 0 ? void 0 : _this$colsHeader16.find(Template.COLS_HEADER_ITEM_CLASS);
var rowBars = (_this$rowsHeader16 = this.rowsHeader) === null || _this$rowsHeader16 === void 0 ? void 0 : _this$rowsHeader16.find(Template.ROWS_HEADER_ITEM_CLASS);
var begin = selectArea.begin,
end = selectArea.end,
allCol = selectArea.allCol,
allRow = selectArea.allRow;
if (rowBars) {
for (var r = begin.row; r <= end.row; r++) {
if (allCol) {
var bar = rowBars[r];
if (!(bar === null || bar === void 0 ? void 0 : bar.classList.contains('selected'))) {
bar === null || bar === void 0 ? void 0 : bar.classList.add('selected');
}
if (allRow && !(bar === null || bar === void 0 ? void 0 : bar.classList.contains('no-dragger'))) bar === null || bar === void 0 ? void 0 : bar.classList.add('no-dragger');
}
}
}
if (colBars) {
for (var c = begin.col; c <= end.col; c++) {
if (allRow) {
var _bar = colBars[c];
if (!(_bar === null || _bar === void 0 ? void 0 : _bar.classList.contains('selected'))) {
_bar === null || _bar === void 0 ? void 0 : _bar.classList.add('selected');
}
if (allCol && !(_bar === null || _bar === void 0 ? void 0 : _bar.classList.contains('no-dragger'))) _bar === null || _bar === void 0 ? void 0 : _bar.classList.add('no-dragger');
}
}
}
var tableHeaderElement = (_this$tableHeader3 = this.tableHeader) === null || _this$tableHeader3 === void 0 ? void 0 : _this$tableHeader3.get();
if (allCol && allRow) {
if (!(tableHeaderElement === null || tableHeaderElement === void 0 ? void 0 : tableHeaderElement.classList.contains('selected'))) {
tableHeaderElement === null || tableHeaderElement === void 0 ? void 0 : tableHeaderElement.classList.add('selected');
}
} else {
if (tableHeaderElement === null || tableHeaderElement === void 0 ? void 0 : tableHeaderElement.classList.contains('selected')) {
tableHeaderElement === null || tableHeaderElement === void 0 ? void 0 : tableHeaderElement.classList.remove('selected');
}
} //行删除按钮
if (allCol && !allRow) {
var _this$tableRoot8;
var tr = (_this$tableRoot8 = this.tableRoot) === null || _this$tableRoot8 === void 0 ? void 0 : _this$tableRoot8.find('tr').eq(begin.row);
if (tr) {
var _this$rowDeleteButton3, _this$rowDeleteButton4;
var top = tr.get().offsetTop;
(_this$rowDeleteButton3 = this.rowDeleteButton) === null || _this$rowDeleteButton3 === void 0 ? void 0 : _this$rowDeleteButton3.show('flex');
(_this$rowDeleteButton4 = this.rowDeleteButton) === null || _this$rowDeleteButton4 === void 0 ? void 0 : _this$rowDeleteButton4.css('top', "".concat(top - this.rowDeleteButton.height(), "px"));
}
} else {
var _this$rowDeleteButton5;
(_this$rowDeleteButton5 = this.rowDeleteButton) === null || _this$rowDeleteButton5 === void 0 ? void 0 : _this$rowDeleteButton5.hide();
} //列删除按钮
if (!allCol && allRow) {
var _colBars$eq5, _colBars$eq5$get, _this$colDeleteButton3, _this$colDeleteButton4;
var width = 0;
for (var _c = begin.col; _c <= end.col; _c++) {
var _colBars$eq4;
width += (colBars === null || colBars === void 0 ? void 0 : (_colBars$eq4 = colBars.eq(_c)) === null || _colBars$eq4 === void 0 ? void 0 : _colBars$eq4.width()) || 0;
}
var left = (colBars === null || colBars === void 0 ? void 0 : (_colBars$eq5 = colBars.eq(begin.col)) === null || _colBars$eq5 === void 0 ? void 0 : (_colBars$eq5$get = _colBars$eq5.get()) === null || _colBars$eq5$get === void 0 ? void 0 : _colBars$eq5$get.offsetLeft) || 0;
(_this$colDeleteButton3 = this.colDeleteButton) === null || _this$colDeleteButton3 === void 0 ? void 0 : _this$colDeleteButton3.show('flex');
(_this$colDeleteButton4 = this.colDeleteButton) === null || _this$colDeleteButton4 === void 0 ? void 0 : _this$colDeleteButton4.css('left', "".concat(left + width / 2, "px"));
} else {
var _this$colDeleteButton5;
(_this$colDeleteButton5 = this.colDeleteButton) === null || _this$colDeleteButton5 === void 0 ? void 0 : _this$colDeleteButton5.hide();
}
}
/**
* 清楚表头活动状态
*/
}, {
key: "clearActiveStatus",
value: function clearActiveStatus() {
var _this$colsHeader17, _this$rowsHeader17, _this$tableHeader4;
var colBars = (_this$colsHeader17 = this.colsHeader) === null || _this$colsHeader17 === void 0 ? void 0 : _this$colsHeader17.find(Template.COLS_HEADER_ITEM_CLASS);
var rowBars = (_this$rowsHeader17 = this.rowsHeader) === null || _this$rowsHeader17 === void 0 ? void 0 : _this$rowsHeader17.find(Template.ROWS_HEADER_ITEM_CLASS);
colBars === null || colBars === void 0 ? void 0 : colBars.each(function (bar) {
var barElement = bar;
if (barElement.classList.contains('selected')) barElement.classList.remove('selected');
if (barElement.classList.contains('no-dragger')) barElement.classList.remove('no-dragger');
});
rowBars === null || rowBars === void 0 ? void 0 : rowBars.each(function (bar) {
var barElement = bar;
if (barElement.classList.contains('selected')) barElement.classList.remove('selected');
if (barElement.classList.contains('no-dragger')) barElement.classList.remove('no-dragger');
});
var tableHeader = (_this$tableHeader4 = this.tableHeader) === null || _this$tableHeader4 === void 0 ? void 0 : _this$tableHeader4.get();
if (tableHeader === null || tableHeader === void 0 ? void 0 : tableHeader.classList.contains('selected')) tableHeader.classList.remove('selected');
}
/**
* 刷新控制UI
*/
}, {
key: "refresh",
value: function refresh() {
var refershSize = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
this.renderColBars(refershSize);
this.renderRowBars(refershSize);
this.activeHeader();
}
/**
* 开始改变列宽度
* @param col 列节点
* @param event 事件
*/
}, {
key: "startChangeCol",
value: function startChangeCol(trigger, event) {
var _this$table$selection7, _this$table$selection8;
event.stopPropagation();
event.preventDefault();
if (!this.colsHeader) return;
var currentCol = trigger.parent();
var currentColElement = currentCol.get();
this.table.selection.clearSelect();
this.dragging = {
x: event instanceof MouseEvent ? event.clientX : event.touches[0].clientX,
y: -1
};
var cols = this.colsHeader.find(Template.COLS_HEADER_ITEM_CLASS);
var colArray = cols.toArray();
var index = 0;
var colsWidths = [];
for (var i = 0; i < colArray.length; i++) {
var colNode = colArray[i];
if (colNode.equal(currentCol)) {
index = i;
}
colsWidths.push(engine.removeUnit(colNode.css('width')));
}
this.changeSize = {
trigger: {
element: trigger,
height: engine.removeUnit(engine.getComputedStyle(trigger.get(), 'height')),
width: engine.removeUnit(engine.getComputedStyle(trigger.get(), 'width'))
},
element: currentCol,
width: engine.removeUnit(engine.getComputedStyle(currentColElement, 'width')),
height: -1,
index: index,
colsWidths: colsWidths,
table: {
width: ((_this$table$selection7 = this.table.selection.tableModel) === null || _this$table$selection7 === void 0 ? void 0 : _this$table$selection7.width) || 0,
height: ((_this$table$selection8 = this.table.selection.tableModel) === null || _this$table$selection8 === void 0 ? void 0 : _this$table$selection8.height) || 0
}
};
this.bindChangeSizeEvent();
}
/**
* 开始改变行高度
* @param col 列节点
* @param event 事件
*/
}, {
key: "startChangeRow",
value: function startChangeRow(trigger, event) {
var _this$rowsHeader18, _this$table$selection9, _this$table$selection10;
event.stopPropagation();
event.preventDefault();
var row = trigger.parent();
var rowElement = row.get();
this.table.selection.clearSelect();
this.dragging = {
x: -1,
y: event instanceof MouseEvent ? event.clientY : event.touches[0].clientY
};
var index = ((_this$rowsHeader18 = this.rowsHeader) === null || _this$rowsHeader18 === void 0 ? void 0 : _this$rowsHeader18.find(Template.ROWS_HEADER_ITEM_CLASS).toArray().findIndex(function (item) {
return item.equal(row);
})) || 0;
this.changeSize = {
trigger: {
element: trigger,
height: engine.removeUnit(engine.getComputedStyle(trigger.get(), 'height')),
width: engine.removeUnit(engine.getComputedStyle(trigger.get(), 'width'))
},
element: row,
width: -1,
height: engine.removeUnit(engine.getComputedStyle(rowElement, 'height')),
index: index,
table: {
width: ((_this$table$selection9 = this.table.selection.tableModel) === null || _this$table$selection9 === void 0 ? void 0 : _this$table$selection9.width) || 0,
height: ((_this$table$selection10 = this.table.selection.tableModel) === null || _this$table$selection10 === void 0 ? void 0 : _this$table$selection10.height) || 0
}
};
this.bindChangeSizeEvent();
}
/**
* 绑定改变大小事件
*/
}, {
key: "bindChangeSizeEvent",
value: function bindChangeSizeEvent() {
var _this$colsHeader18, _this$rowsHeader19;
//添加鼠标样式
(_this$colsHeader18 = this.colsHeader) === null || _this$colsHeader18 === void 0 ? void 0 : _this$colsHeader18.addClass('resize');
(_this$rowsHeader19 = this.rowsHeader) === null || _this$rowsHeader19 === void 0 ? void 0 : _this$rowsHeader19.addClass('resize');
document.addEventListener(engine.isMobile ? 'touchmove' : 'mousemove', this.onChangeSize);
document.addEventListener(engine.isMobile ? 'touchend' : 'mouseup', this.onChangeSizeEnd);
if (!engine.isMobile) document.addEventListener('mouseleave', this.onChangeSizeEnd);
}
/**
* 移除绑定改变不大小事件
*/
}, {
key: "unbindChangeSizeEvent",
value: function unbindChangeSizeEvent() {
var _this$colsHeader19, _this$rowsHeader20;
//添加鼠标样式
(_this$colsHeader19 = this.colsHeader) === null || _this$colsHeader19 === void 0 ? void 0 : _this$colsHeader19.removeClass('resize');
(_this$rowsHeader20 = this.rowsHeader) === null || _this$rowsHeader20 === void 0 ? void 0 : _this$rowsHeader20.removeClass('resize');
document.removeEventListener(engine.isMobile ? 'touchmove' : 'mousemove', this.onChangeSize);
document.removeEventListener(engine.isMobile ? 'touchend' : 'mouseup', this.onChangeSizeEnd);
if (!engine.isMobile) document.removeEventListener('mouseleave', this.onChangeSizeEnd);
}
}, {
key: "onChangeColWidth",
value:
/**
* 列宽度改变
* @param event 事件
* @returns
*/
function onChangeColWidth(event) {
var _this$tableRoot9, _this$tableRoot10, _this$colsHeader20;
if (!this.dragging || !this.changeSize) return; // 容器宽度
var containerWidth = this.table.root.width(); //鼠标移动宽度
var delta = (event instanceof MouseEvent ? event.clientX : event.touches[0].clientX) - this.dragging.x; //获取合法的宽度
var colWidth = Math.max(this.COL_MIN_WIDTH, this.changeSize.width + delta); //表格变化后的宽度
var tableWidth = this.changeSize.table.width + (colWidth - this.changeSize.width);
var cols = (_this$tableRoot9 = this.tableRoot) === null || _this$tableRoot9 === void 0 ? void 0 : _this$tableRoot9.find('col');
if (!this.table.enableScroll && cols) {
var _this$changeSize$cols, _cols$eq4;
var minColWidth = this.table.colMinWidth;
var colsWidths = ((_this$changeSize$cols = this.changeSize.colsWidths) !== null && _this$changeSize$cols !== void 0 ? _this$changeSize$cols : []).concat();
var start = this.changeSize.index;
if (start < colsWidths.length - 1) {
var _this$changeSize$elem, _cols$eq3;
colWidth = Math.min(colsWidths[start] + colsWidths[start + 1] - minColWidth, colWidth);
var nextW = colsWidths[start + 1] - delta;
nextW = Math.max(nextW, minColWidth);
nextW = Math.min(colsWidths[start] + colsWidths[start + 1] - minColWidth, nextW);
colsWidths[start + 1] = nextW; // 设置列宽度
(_this$changeSize$elem = this.changeSize.element.next()) === null || _this$changeSize$elem === void 0 ? void 0 : _this$changeSize$elem.css('width', nextW + 'px'); //设置列头宽度
cols === null || cols === void 0 ? void 0 : (_cols$eq3 = cols.eq(start + 1)) === null || _cols$eq3 === void 0 ? void 0 : _cols$eq3.attributes('width', nextW);
} else {
var otherWidth = colsWidths.reduce(function (a, b, i) {
if (i !== start) return a + b;
return a;
}, 0);
colWidth = Math.min(containerWidth - otherWidth, colWidth);
}
colsWidths[start] = colWidth; // 设置列宽度
this.changeSize.element.css('width', colWidth + 'px'); //设置列头宽度
cols === null || cols === void 0 ? void 0 : (_cols$eq4 = cols.eq(start)) === null || _cols$eq4 === void 0 ? void 0 : _cols$eq4.attributes('width', colWidth);
tableWidth = Math.min(colsWidths.reduce(function (a, b) {
return a + b;
}, 0), containerWidth);
} else {
var _cols$eq5;
// 设置列宽度
this.changeSize.element.css('width', colWidth + 'px'); //设置列头宽度
cols === null || cols === void 0 ? void 0 : (_cols$eq5 = cols.eq(this.changeSize.index)) === null || _cols$eq5 === void 0 ? void 0 : _cols$eq5.attributes('width', colWidth);
}
if (this.table.enableScroll) {
var _this$viewport3;
var currentElement = this.changeSize.element.get();
var viewportElement = (_this$viewport3 = this.viewport) === null || _this$viewport3 === void 0 ? void 0 : _this$viewport3.get(); // 拖到边界时,需要滚动表格视窗的滚动条
var currentColRightSide = currentElement.offsetLeft + currentElement.offsetWidth;
if (currentColRightSide - viewportElement.scrollLeft + 20 > viewportElement.offsetWidth) {
// 拖宽单元格时,若右侧已经到边,需要滚动左侧的滚动条
viewportElement.scrollLeft = currentColRightSide + 20 - viewportElement.offsetWidth;
} else if (viewportElement.scrollLeft + viewportElement.offsetWidth === viewportElement.scrollWidth) {
// 拖窄单元格时,若右侧已经到边,需要滚动左侧的滚动条
viewportElement.scrollLeft = Math.max(0, tableWidth + 34 - viewportElement.offsetWidth);
}
}
this.clearActiveStatus();
this.hideContextMenu();
this.renderRowBars();
this.renderColSplitBars(this.changeSize.element, this.changeSize.trigger.element); //设置表格宽度
(_this$tableRoot10 = this.tableRoot) === null || _this$tableRoot10 === void 0 ? void 0 : _this$tableRoot10.css('width', "".concat(tableWidth, "px")); // 设置表头宽度
(_this$colsHeader20 = this.colsHeader) === null || _this$colsHeader20 === void 0 ? void 0 : _this$colsHeader20.css('width', "".concat(tableWidth, "px"));
}
}, {
key: "onChangeRowHeight",
value: function onChangeRowHeight(event) {
var _this$tableRoot11, _this$tableRoot11$fin;
if (!this.dragging || !this.changeSize) return;
var height = (event instanceof MouseEvent ? event.clientY : event.touches[0].clientY) - this.dragging.y;
var rowHeight = Math.max(this.ROW_MIN_HEIGHT, this.changeSize.height + height);
height = rowHeight - this.changeSize.height;
this.changeSize.element.css('height', rowHeight + 'px');
this.clearActiveStatus();
this.hideContextMenu();
this.renderRowSplitBars(this.changeSize.element, this.changeSize.trigger.element);
(_this$tableRoot11 = this.tableRoot) === null || _this$tableRoot11 === void 0 ? void 0 : (_this$tableRoot11$fin = _this$tableRoot11.find('tr').eq(this.changeSize.index)) === null || _this$tableRoot11$fin === void 0 ? void 0 : _this$tableRoot11$fin.css('height', "".concat(rowHeight, "px"));
}
}, {
key: "renderColSplitBars",
value: function renderColSplitBars(col, trigger) {
var _this$table$selection11;
var tableHeight = ((_this$table$selection11 = this.table.selection.tableModel) === null || _this$table$selection11 === void 0 ? void 0 : _this$table$selection11.height) || 0;
trigger.addClass('dragging').css('height', "".concat(tableHeight + col.height(), "px"));
}
}, {
key: "renderRowSplitBars",
value: function renderRowSplitBars(row, trigger) {
var _this$viewport4, _this$table$selection12;
var viewportElement = (_this$viewport4 = this.viewport) === null || _this$viewport4 === void 0 ? void 0 : _this$viewport4.get();
var tableWidth = ((_this$table$selection12 = this.table.selection.tableModel) === null || _this$table$selection12 === void 0 ? void 0 : _this$table$selection12.width) || 0; //获取table-viewport 宽度 去除 操作栏宽度
var width = Math.min(viewportElement.offsetWidth - row.width(), tableWidth);
trigger.addClass('dragging').css('width', "".concat(width + row.width(), "px"));
}
}, {
key: "bindDragColEvent",
value: function bindDragColEvent() {
var wrapper = this.table.wrapper;
wrapper === null || wrapper === void 0 ? void 0 : wrapper.on('dragover', this.onDragCol);
wrapper === null || wrapper === void 0 ? void 0 : wrapper.on('drop', this.onDragColEnd);
wrapper === null || wrapper === void 0 ? void 0 : wrapper.on('dragend', this.onDragColEnd);
}
}, {
key: "unbindDragColEvent",
value: function unbindDragColEvent() {
var _this$colsHeader21, _this$colsHeader22;
var wrapper = this.table.wrapper;
var colBars = (_this$colsHeader21 = this.colsHeader) === null || _this$colsHeader21 === void 0 ? void 0 : _this$colsHeader21.find(Template.COLS_HEADER_ITEM_CLASS);
colBars === null || colBars === void 0 ? void 0 : colBars.removeClass('dragging');
(_this$colsHeader22 = this.colsHeader) === null || _this$colsHeader22 === void 0 ? void 0 : _this$colsHeader22.removeClass('dragging');
wrapper === null || wrapper === void 0 ? void 0 : wrapper.off('dragover', this.onDragCol);
wrapper === null || wrapper === void 0 ? void 0 : wrapper.off('drop', this.onDragColEnd);
wrapper === null || wrapper === void 0 ? void 0 : wrapper.off('dragend', this.onDragColEnd);
}
}, {
key: "bindDragRowEvent",
value: function bindDragRowEvent() {
var wrapper = this.table.wrapper;
wrapper === null || wrapper === void 0 ? void 0 : wrapper.on('dragover', this.onDragRow);
wrapper === null || wrapper === void 0 ? void 0 : wrapper.on('drop', this.onDragRowEnd);
wrapper === null || wrapper === void 0 ? void 0 : wrapper.on('dragend', this.onDragRowEnd);
}
}, {
key: "unbindDragRowEvent",
value: function unbindDragRowEvent() {
var _this$rowsHeader21, _this$rowsHeader22;
var wrapper = this.table.wrapper;
var rowBars = (_this$rowsHeader21 = this.rowsHeader) === null || _this$rowsHeader21 === void 0 ? void 0 : _this$rowsHeader21.find(Template.ROWS_HEADER_ITEM_CLASS);
rowBars === null || rowBars === void 0 ? void 0 : rowBars.removeClass('dragging');
(_this$rowsHeader22 = this.rowsHeader) === null || _this$rowsHeader22 === void 0 ? void 0 : _this$rowsHeader22.removeClass('dragging');
wrapper === null || wrapper === void 0 ? void 0 : wrapper.off('dragover', this.onDragRow);
wrapper === null || wrapper === void 0 ? void 0 : wrapper.off('drop', this.onDragRowEnd);
wrapper === null || wrapper === void 0 ? void 0 : wrapper.off('dragend', this.onDragRowEnd);
}
}, {
key: "showPlaceHolder",
value: function showPlaceHolder(dropIndex, isNext) {
if (!this.draggingHeader) return;
var _this$draggingHeader = this.draggingHeader,
element = _this$draggingHeader.element,
minIndex = _this$draggingHeader.minIndex,
maxIndex = _this$draggingHeader.maxIndex;
if (element.closest(Template.COLS_HEADER_CLASS).length > 0) {
var _this$colsHeader23, _this$viewport5, _this$table$selection13, _this$viewport6, _this$viewport7, _this$placeholder4, _this$placeholder5, _this$placeholder6, _this$placeholder7, _this$placeholder8;
if (dropIndex === this.draggingHeader.index) return;
if (minIndex <= dropIndex && dropIndex <= maxIndex + 1) {
var _this$placeholder3;
delete this.draggingHeader.index;
delete this.draggingHeader.isNext;
(_this$placeholder3 = this.placeholder) === null || _this$placeholder3 === void 0 ? void 0 : _this$placeholder3.css('display', 'none');
return;
}
this.draggingHeader.isNext = isNext;
this.draggingHeader.index = dropIndex;
var colBars = (_this$colsHeader23 = this.colsHeader) === null || _this$colsHeader23 === void 0 ? void 0 : _this$colsHeader23.find(Template.COLS_HEADER_ITEM_CLASS);
if (!colBars) return;
var left = this.draggingHeader.index !== colBars.length ? colBars.eq(this.draggingHeader.index).get().offsetLeft + 2 : colBars.eq(this.draggingHeader.index - 1).get().offsetLeft + colBars.eq(this.draggingHeader.index - 1).get().offsetWidth + 2;
var viewportElement = (_this$viewport5 = this.viewport) === null || _this$viewport5 === void 0 ? void 0 : _this$viewport5.get();
var scrollLeft = viewportElement.scrollLeft,
offsetWidth = viewportElement.offsetWidth;
if (left < scrollLeft) {
viewportElement.scrollLeft = left - 5;
}
if (left > scrollLeft + offsetWidth) {
viewportElement.scrollLeft = left - offsetWidth + 5;
}
var height = (((_this$table$selection13 = this.table.selection.tableModel) === null || _this$table$selection13 === void 0 ? void 0 : _this$table$selection13.height) || 0) + colBars.height();
var paddingTop = (_this$viewport6 = this.viewport) === null || _this$viewport6 === void 0 ? void 0 : _this$viewport6.css('padding-top');
var paddingLeft = ((_this$viewport7 = this.viewport) === null || _this$viewport7 === void 0 ? void 0 : _this$viewport7.css('padding-left')) || '0';
(_this$placeholder4 = this.placeholder) === null || _this$placeholder4 === void 0 ? void 0 : _this$placeholder4.css('width', '2px');
(_this$placeholder5 = this.placeholder) === null || _this$placeholder5 === void 0 ? void 0 : _this$placeholder5.css('height', "".concat(height, "px"));
(_this$placeholder6 = this.placeholder) === null || _this$placeholder6 === void 0 ? void 0 : _this$placeholder6.css('left', left - 4 + engine.removeUnit(paddingLeft) + 'px');
(_this$placeholder7 = this.placeholder) === null || _this$placeholder7 === void 0 ? void 0 : _this$placeholder7.css('top', paddingTop);
(_this$placeholder8 = this.placeholder) === null || _this$placeholder8 === void 0 ? void 0 : _this$placeholder8.css('display', 'block');
} else if (element.closest(Template.ROWS_HEADER_CLASS).length > 0) {
var _this$rowsHeader23, _this$table$selection14, _this$viewport8, _this$viewport9, _this$colsHeader24, _this$placeholder10, _this$placeholder11, _this$placeholder12, _this$placeholder13, _this$placeholder14;
if (dropIndex === this.draggingHeader.index) return;
if (minIndex <= dropIndex && dropIndex <= maxIndex + 1) {
var _this$placeholder9;
delete this.draggingHeader.index;
delete this.draggingHeader.isNext;
(_this$placeholder9 = this.placeholder) === null || _this$placeholder9 === void 0 ? void 0 : _this$placeholder9.css('display', 'none');
return;
}
this.draggingHeader.index = dropIndex;
this.draggingHeader.isNext = isNext;
var rowBars = (_this$rowsHeader23 = this.rowsHeader) === null || _this$rowsHeader23 === void 0 ? void 0 : _this$rowsHeader23.find(Template.ROWS_HEADER_ITEM_CLASS);
if (!rowBars) return;
var top = this.draggingHeader.index !== rowBars.length ? rowBars.eq(this.draggingHeader.index).get().offsetTop + 2 : rowBars.eq(this.draggingHeader.index - 1).get().offsetTop + rowBars.eq(this.draggingHeader.index - 1).get().offsetHeight - 2;
var width = ((_this$table$selection14 = this.table.selection.tableModel) === null || _this$table$selection14 === void 0 ? void 0 : _this$table$selection14.width) || 0;
var _paddingTop = (_this$viewport8 = this.viewport) === null || _this$viewport8 === void 0 ? void 0 : _this$viewport8.css('padding-top');
var _paddingLeft = ((_this$viewport9 = this.viewport) === null || _this$viewport9 === void 0 ? void 0 : _this$viewport9.css('padding-left')) || '0';
var _colBars = (_this$colsHeader24 = this.colsHeader) === null || _this$colsHeader24 === void 0 ? void 0 : _this$colsHeader24.find(Template.COLS_HEADER_ITEM_CLASS);
(_this$placeholder10 = this.placeholder) === null || _this$placeholder10 === void 0 ? void 0 : _this$placeholder10.css('height', '2px');
(_this$placeholder11 = this.placeholder) === null || _this$placeholder11 === void 0 ? void 0 : _this$placeholder11.css('width', "".concat(width, "px"));
(_this$placeholder12 = this.placeholder) === null || _this$placeholder12 === void 0 ? void 0 : _this$placeholder12.css('left', _paddingLeft);
(_this$placeholder13 = this.placeholder) === null || _this$placeholder13 === void 0 ? void 0 : _this$placeholder13.css('top', top + engine.removeUnit(_paddingTop || '0') + ((_colBars === null || _colBars === void 0 ? void 0 : _colBars.height()) || 0) - 2 + 'px');
(_this$placeholder14 = this.placeholder) === null || _this$placeholder14 === void 0 ? void 0 : _this$placeholder14.css('display', 'block');
}
}
}, {
key: "removeRow",
value: function removeRow(index) {
var _this$rowsHeader24, _rowsHeaderItem$eq, _this$rowsHeader25, _this$rowsHeader25$ge;
var rowsHeaderItem = (_this$rowsHeader24 = this.rowsHeader) === null || _this$rowsHeader24 === void 0 ? void 0 : _this$rowsHeader24.find(Template.ROWS_HEADER_ITEM_CLASS);
var item = rowsHeaderItem === null || rowsHeaderItem === void 0 ? void 0 : (_rowsHeaderItem$eq = rowsHeaderItem.eq(index)) === null || _rowsHeaderItem$eq === void 0 ? void 0 : _rowsHeaderItem$eq.get();
if (item) (_this$rowsHeader25 = this.rowsHeader) === null || _this$rowsHeader25 === void 0 ? void 0 : (_this$rowsHeader25$ge = _this$rowsHeader25.get()) === null || _this$rowsHeader25$ge === void 0 ? void 0 : _this$rowsHeader25$ge.removeChild(item);
}
}, {
key: "removeCol",
value: function removeCol(index) {
var _this$colsHeader25, _this$colsHeader26, _colsHeaderItem$eq, _this$colsHeader27, _this$tableRoot12, _this$colsHeader28;
var colsHeaderItem = (_this$colsHeader25 = this.colsHeader) === null || _this$colsHeader25 === void 0 ? void 0 : _this$colsHeader25.find(Template.COLS_HEADER_ITEM_CLASS);
var headerElement = (_this$colsHeader26 = this.colsHeader) === null || _this$colsHeader26 === void 0 ? void 0 : _this$colsHeader26.get();
var item = colsHeaderItem === null || colsHeaderItem === void 0 ? void 0 : (_colsHeaderItem$eq = colsHeaderItem.eq(index)) === null || _colsHeaderItem$eq === void 0 ? void 0 : _colsHeaderItem$eq.get();
if (!headerElement || !item) return;
(_this$colsHeader27 = this.colsHeader) === null || _this$colsHeader27 === void 0 ? void 0 : _this$colsHeader27.css('width', headerElement.offsetWidth - item.offsetWidth + 'px');
headerElement.removeChild(item);
(_this$tableRoot12 = this.tableRoot) === null || _this$tableRoot12 === void 0 ? void 0 : _this$tableRoot12.css('width', (_this$colsHeader28 = this.colsHeader) === null || _this$colsHeader28 === void 0 ? void 0 : _this$colsHeader28.css('width'));
}
}, {
key: "showContextMenu",
value: function showContextMenu(event) {
var _this6 = this;
var editor = this.editor;
if (!this.menuBar || !event.target || !this.table.wrapper || !editor.scrollNode) return;
event.preventDefault();
var selection = this.table.selection;
var menuItems = this.menuBar.find(Template.MENUBAR_ITEM_CLASS);
menuItems.removeClass('disabled');
menuItems.each(function (menu) {
var menuNode = engine.$(menu);
var action = menuNode.attributes('data-action');
if (_this6.getMenuDisabled(action)) {
menuNode.addClass('disabled');
} else {
var inputNode = menuNode.find("input".concat(Template.MENUBAR_ITEM_INPUT_CALSS));
if (inputNode.length === 0) return;
var inputElement = inputNode.get();
if (!_this6.menuSets.has(menu)) {
_this6.menuSets.add(menu);
inputNode.on('blur', function () {
inputElement.value = Math.min(parseInt(inputElement.value, 10) || 1, _this6.MAX_INSERT_NUM).toString();
}).on('keydown', function (event) {
if (engine.isHotkey('enter', event)) {
_this6.handleTriggerMenu(menuNode);
}
});
inputNode.on('mousedown', _this6.onMenuInputMousedown);
}
var selectArea = selection.getSelectArea();
var isInsertCol = ['insertColLeft', 'insertColRight'].indexOf(action) > -1;
var isInsertRow = ['insertRowUp', 'insertRowDown'].indexOf(action) > -1;
if (isInsertCol) {
inputElement.value = "".concat(selectArea.end.col - selectArea.begin.col + 1);
}
if (isInsertRow) {
inputElement.value = "".concat(selectArea.end.row - selectArea.begin.row + 1);
}
}
});
var splits = this.menuBar.find('div.split');
splits.each(function (splitNode) {
var split = engine.$(splitNode);
var prev = split.prev();
while (prev) {
if (prev.hasClass('split')) {
split.remove();
break;
}
if (!prev.hasClass('disabled')) break;
prev = prev.prev();
}
if (!prev) split.remove();
});
var tartgetNode = engine.$(event.target);
var prevRect = tartgetNode.getBoundingClientRect() || {
top: 0,
left: 0
};
var parentNode = tartgetNode.parent();
var top = 0,
left = 0;
while (parentNode && parentNode.closest(Template.TABLE_WRAPPER_CLASS).length > 0) {
var rect = parentNode.getBoundingClientRect() || {
top: 0,
left: 0
};
top += prevRect.top - rect.top;
left += prevRect.left - rect.left;
prevRect = rect;
parentNode = parentNode.parent();
}
var wrapperRect = this.table.wrapper.get().getBoundingClientRect();
var viewport = editor.scrollNode.getViewport();
top += event.offsetY;
var menuHeight = this.menuBar.height(); // 底部溢出
var allTop = wrapperRect.top + top + menuHeight + 4;
if (allTop > viewport.bottom) {
var diff = allTop - viewport.bottom; // 如果 top 溢出上边界,则调整 top 到最高 top
if (top - diff < 0 && wrapperRect.top + top - diff < viewport.top) {
diff = wrapperRect.top + top - viewport.top;
}
top -= diff;
}
this.menuBar.css('left', left + event.offsetX + 'px');
this.menuBar.css('top', top + 'px'); //绑定input事件
this.contextVisible = true;
}
}, {
key: "hideContextMenu",
value: function hideContextMenu() {
var _this$menuBar4, _this$menuBar5;
if (!this.contextVisible) {
return;
}
var menuItems = (_this$menuBar4 = this.menuBar) === null || _this$menuBar4 === void 0 ? void 0 : _this$menuBar4.find(Template.MENUBAR_ITEM_CLASS);
menuItems === null || menuItems === void 0 ? void 0 : menuItems.removeClass('disabled');
this.contextVisible = false;
(_this$menuBar5 = this.menuBar) === null || _this$menuBar5 === void 0 ? void 0 : _this$menuBar5.css({
top: '-99999px',
left: '-99999px'
});
}
}, {
key: "getMenuDisabled",
value: function getMenuDisabled(action) {
var _this$table3 = this.table,
selection = _this$table3.selection,
command = _this$table3.command;
switch (action) {
case 'cut':
case 'copy':
return !selection.selectArea || selection.selectArea.count <= 1;
case 'splitCell':
return !selection.hasMergeCell();
case 'mergeCell':
return !selection.selectArea;
case 'mockPaste':
return !command.hasCopyData();
case 'removeCol':
case 'insertColLeft':
case 'insertColRight':
return selection.isColSelected();
case 'removeRow':
case 'insertRowUp':
case 'insertRowDown':
return selection.isRowSelected();
default:
return false;
}
}
}, {
key: "handleClickMenu",
value: function handleClickMenu(event) {
if (!event.target) return;
var targetNode = engine.$(event.target);
var menu = targetNode.closest('.table-menubar-item');
if (menu.length === 0 || targetNode.name === 'input') return;
event.stopPropagation();
this.handleTriggerMenu(menu);
}
}, {
key: "handleTriggerMenu",
value: function handleTriggerMenu(menu) {
if (!menu.hasClass('disabled')) {
var action = menu.attributes('data-action');
var inputNode = menu.find("input".concat(Template.MENUBAR_ITEM_INPUT_CALSS));
var args = undefined;
if (inputNode.length > 0) {
var _inputNode$get;
args = Math.min(parseInt(((_inputNode$get = inputNode.get()) === null || _inputNode$get === void 0 ? void 0 : _inputNode$get.value) || '1', 10), this.MAX_INSERT_NUM);
}
this.table.command[action](args);
}
this.hideContextMenu();
}
}, {
key: "handleHoverMenu",
value: function handleHoverMenu(event) {
if (!event.target) return;
var menu = engine.$(event.target).closest('.table-menubar-item');
if (menu.length === 0) return;
event.stopPropagation();
var selection = this.table.selection;
if (!menu.hasClass('disabled')) {
var action = menu.attributes('data-action');
switch (action) {
case 'removeCol':
this.handleHighlightCol();
break;
case 'removeRow':
this.handleHighlightRow();
break;
case 'removeTable':
this.handleHighlightTable();
break;
default:
selection.hideHighlight();
}
}
}
}, {
key: "hideHighlight",
value: function hideHighlight(event) {
event.stopPropagation();
this.table.selection.hideHighlight();
}
}, {
key: "drawBackgroundColor",
value: function drawBackgroundColor(color) {
var _this$table4 = this.table,
selection = _this$table4.selection,
helper = _this$table4.helper;
selection.each(function (cell) {
if (!helper.isEmptyModelCol(cell) && cell.element) {
if (!color || color === 'transparent') cell.element.style.removeProperty('background-color');else cell.element.style.backgroundColor = color;
}
});
}
}, {
key: "setAlign",
value: function setAlign(align) {
var _this$table5 = this.table,
selection = _this$table5.selection,
helper = _this$table5.helper;
selection.each(function (cell) {
if (!helper.isEmptyModelCol(cell) && cell.element) {
if (!align || align === 'top') cell.element.style.removeProperty('vertical-align');else cell.element.style.verticalAlign = align;
}
});
}
}, {
key: "destroy",
value: function destroy() {
var _this$colsHeader29, _this$rowsHeader26, _this$tableHeader5, _this$table$wrapper5, _this$tableRoot13, _this$menuBar6, _this$viewport10, _this$rowDeleteButton6, _this$colDeleteButton6, _this$colAddButton5, _this$colsHeader30, _this$rowAddButton4, _this$rowsHeader27;
(_this$colsHeader29 = this.colsHeader) === null || _this$colsHeader29 === void 0 ? void 0 : _this$colsHeader29.removeAllEvents();
(_this$rowsHeader26 = this.rowsHeader) === null || _this$rowsHeader26 === void 0 ? void 0 : _this$rowsHeader26.removeAllEvents();
(_this$tableHeader5 = this.tableHeader) === null || _this$tableHeader5 === void 0 ? void 0 : _this$tableHeader5.removeAllEvents();
(_this$table$wrapper5 = this.table.wrapper) === null || _this$table$wrapper5 === void 0 ? void 0 : _this$table$wrapper5.removeAllEvents();
(_this$tableRoot13 = this.tableRoot) === null || _this$tableRoot13 === void 0 ? void 0 : _this$tableRoot13.removeAllEvents();
(_this$menuBar6 = this.menuBar) === null || _this$menuBar6 === void 0 ? void 0 : _this$menuBar6.removeAllEvents(); //列头部 padding 区域单击让其选中表格卡片上方的blcok
(_this$viewport10 = this.viewport) === null || _this$viewport10 === void 0 ? void 0 : _this$viewport10.removeAllEvents(); //行删除按钮
(_this$rowDeleteButton6 = this.rowDeleteButton) === null || _this$rowDeleteButton6 === void 0 ? void 0 : _this$rowDeleteButton6.removeAllEvents(); //列删除按钮
(_this$colDeleteButton6 = this.colDeleteButton) === null || _this$colDeleteButton6 === void 0 ? void 0 : _this$colDeleteButton6.removeAllEvents(); //列增加按钮
(_this$colAddButton5 = this.colAddButton) === null || _this$colAddButton5 === void 0 ? void 0 : _this$colAddButton5.removeAllEvents();
(_this$colsHeader30 = this.colsHeader) === null || _this$colsHeader30 === void 0 ? void 0 : _this$colsHeader30.removeAllEvents(); //行增加按钮
(_this$rowAddButton4 = this.rowAddButton) === null || _this$rowAddButton4 === void 0 ? void 0 : _this$rowAddButton4.removeAllEvents();
(_this$rowsHeader27 = this.rowsHeader) === null || _this$rowsHeader27 === void 0 ? void 0 : _this$rowsHeader27.removeAllEvents();
}
}]);
return ControllBar;
}(eventemitter2.EventEmitter2);
var TableSelection = /*#__PURE__*/function (_EventEmitter) {
_inherits(TableSelection, _EventEmitter);
var _super = _createSuper(TableSelection);
// 第一次选中一行的行号
// 第一次选中一列的列号
function TableSelection(_editor, table) {
var _this;
_classCallCheck(this, TableSelection);
_this = _super.call(this);
_this.editor = void 0;
_this.table = void 0;
_this.tableRoot = void 0;
_this.colsHeader = void 0;
_this.rowsHeader = void 0;
_this.tableHeader = void 0;
_this.tableModel = void 0;
_this.selectArea = void 0;
_this.selectRange = void 0;
_this.dragging = void 0;
_this.isShift = false;
_this.prevMouseDownTd = void 0;
_this.prevOverTd = void 0;
_this.highlight = void 0;
_this.beginAllRow = void 0;
_this.beginAllCol = void 0;
_this.onTdMouseDown = function (event) {
_this.selectRange = undefined;
var editor = _this.editor;
if (!event.target || !engine.isEngine(editor)) return;
var change = editor.change;
var target = engine.$(event.target);
var td = target.closest('td');
if (td.length === 0 || !td.inEditor()) return;
var range = change.range.get();
var _this$getCellPoint = _this.getCellPoint(td),
_this$getCellPoint2 = _slicedToArray(_this$getCellPoint, 2),
row = _this$getCellPoint2[0],
col = _this$getCellPoint2[1];
var isSelection = !!td.attributes('table-cell-selection'); //shift 多选
if (_this.isShift) {
var begin = {
row: 0,
col: 0
};
if (_this.prevMouseDownTd) {
var _this$getCellPoint3 = _this.getCellPoint(_this.prevMouseDownTd),
_this$getCellPoint4 = _slicedToArray(_this$getCellPoint3, 2),
_row = _this$getCellPoint4[0],
_col = _this$getCellPoint4[1];
begin = {
row: _row,
col: _col
};
} else if (_this.selectArea) {
begin = _this.selectArea.begin;
if (_this.tableModel) {
var tdModel = _this.tableModel.table[begin.row][begin.col];
if (!_this.table.helper.isEmptyModelCol(tdModel) && tdModel.element) _this.prevMouseDownTd = engine.$(tdModel.element);
}
}
_this.select(begin, {
row: row,
col: col
});
return;
} else {
_this.prevMouseDownTd = td;
if (event instanceof MouseEvent && event.button !== 2) _this.select({
row: row,
col: col
}, {
row: row,
col: col
});
} //点击单元格空白处,聚焦内部编辑区域
if (target.name === 'td' && (isSelection || !range.startNode.closest('td').equal(td) || !range.endNode.closest('td').equal(td))) {
if (event instanceof MouseEvent && event.button === 2 && !!target.attributes('table-cell-selection')) {
return;
}
event.preventDefault();
_this.focusCell(td);
} else if (target.name === 'td') {
event.preventDefault();
}
var next = function next() {
_this.select({
row: row,
col: col
}, {
row: row,
col: col
});
_this.dragging = {
trigger: {
element: td
}
};
_this.addDragEvent();
}; // 右键不触发拖选
if (event instanceof MouseEvent && event.button === 2) {
if (!!target.attributes('table-cell-selection')) {
event.preventDefault();
}
return;
} else if (target.name === 'td') {
var editableElement = td.find(engine.EDITABLE_SELECTOR);
if (editableElement.length > 0) {
//获取到编辑器内最后一个子节点
var block = editableElement.last();
if (block) {
var _block$get, _block$get2;
// 不是块级卡片不处理
if (!block.isBlockCard()) return next(); //节点不可见不处理
if ((((_block$get = block.get()) === null || _block$get === void 0 ? void 0 : _block$get.offsetTop) || 0) + (((_block$get2 = block.get()) === null || _block$get2 === void 0 ? void 0 : _block$get2.clientHeight) || 0) > (event instanceof MouseEvent ? event : event.touches[0]).clientY) return next();
var node = engine.$('
');
editableElement.append(node);
var _range = editor.change.range.get();
_range.select(node, true).collapse(false);
editor.change.apply(_range);
}
}
}
next();
};
_this.removeDragEvent = function () {
var _this$tableRoot, _this$table$wrapper;
(_this$tableRoot = _this.tableRoot) === null || _this$tableRoot === void 0 ? void 0 : _this$tableRoot.removeClass('drag-select');
(_this$table$wrapper = _this.table.wrapper) === null || _this$table$wrapper === void 0 ? void 0 : _this$table$wrapper.removeClass('drag-selecting');
document.removeEventListener(engine.isMobile ? 'touchend' : 'mouseup', _this.removeDragEvent);
document.removeEventListener(engine.isMobile ? 'touchmove' : 'mousemove', _this.onDragMove);
_this.dragging = undefined;
};
_this.onDragMove = function (event) {
if (!_this.dragging || !event.target) return;
var dragoverTd = engine.$(event.target).closest('td');
if (dragoverTd.length === 0 || !dragoverTd.inEditor() || _this.prevOverTd && dragoverTd.equal(_this.prevOverTd)) return;
_this.prevOverTd = dragoverTd;
if (!_this.dragging.trigger.element.equal(dragoverTd)) {
var _this$table$wrapper2;
(_this$table$wrapper2 = _this.table.wrapper) === null || _this$table$wrapper2 === void 0 ? void 0 : _this$table$wrapper2.addClass('drag-selecting');
_this.selectCell(_this.dragging.trigger.element, dragoverTd);
} else {
var _this$table$wrapper3;
(_this$table$wrapper3 = _this.table.wrapper) === null || _this$table$wrapper3 === void 0 ? void 0 : _this$table$wrapper3.removeClass('drag-selecting');
_this.clearSelect();
}
};
_this.onShiftKeydown = function (event) {
if (!event.target || !_this.tableModel || !engine.isEngine(_this.editor)) return;
if (engine.isHotkey('shift', event)) {
_this.isShift = true;
}
};
_this.onKeydown = function (event) {
if (!event.target || !_this.tableModel || !engine.isEngine(_this.editor)) return; //获取单元格节点
var td = engine.$(event.target).closest('td');
if (td.length === 0 || !td.inEditor()) {
return;
} //获取单元格位置
var _this$getCellPoint5 = _this.getCellPoint(td),
_this$getCellPoint6 = _slicedToArray(_this$getCellPoint5, 2),
row = _this$getCellPoint6[0],
col = _this$getCellPoint6[1];
if (row < 0 || col < 0) return;
if (engine.isHotkey('shift+left', event)) {
_this.selectLeft(event, td);
} else if (engine.isHotkey('shift+right', event)) {
_this.selectRigth(event, td);
} else if (engine.isHotkey('shift+up', event)) {
_this.selectUp(event, td);
} else if (engine.isHotkey('shift+down', event)) {
_this.selectDown(event, td);
}
if (engine.isHotkey('shift', event)) {
_this.isShift = true;
} else {
if (_this.selectRange) {
_this.isShift = false;
_this.selectRange = undefined;
}
if (engine.isHotkey('tab', event) || engine.isHotkey('mod', event) || engine.isHotkey('opt', event) || engine.isHotkey('shift', event) || event.ctrlKey || event.metaKey || event.shiftKey || event.altKey) return; // 等待删除键删除后再清除选择
setTimeout(function () {
_this.clearSelect();
}, 50);
}
};
_this.onShiftKeyup = function (event) {
if (_this.isShift === false && _this.selectRange) {
_this.selectRange = undefined;
_this.clearSelect();
}
_this.isShift = false;
};
_this.table = table;
_this.editor = _editor;
return _this;
}
_createClass(TableSelection, [{
key: "init",
value: function init() {
var wrapper = this.table.wrapper;
if (!wrapper) return;
this.tableRoot = wrapper.find(Template.TABLE_CLASS);
this.colsHeader = wrapper.find(Template.COLS_HEADER_CLASS);
this.rowsHeader = wrapper.find(Template.ROWS_HEADER_CLASS);
this.tableHeader = wrapper.find(Template.HEADER_CLASS);
this.highlight = wrapper.find(Template.TABLE_HIGHLIGHT_CLASS);
this.render('init');
this.bindEvents();
}
}, {
key: "render",
value: function render(action) {
this.refreshModel();
var tableModel = this.tableModel;
if (!tableModel) {
return;
}
var _this$getSelectArea = this.getSelectArea(),
begin = _this$getSelectArea.begin,
end = _this$getSelectArea.end;
if (action === 'mergeCell' || action === 'splitCell') {
var row = begin.row < 0 ? 0 : Math.min(begin.row, tableModel.rows - 1);
var col = begin.col < 0 ? 0 : Math.min(begin.col, tableModel.cols - 1);
var cell = tableModel.table[row][col];
if (this.table.helper.isEmptyModelCol(cell)) {
cell = tableModel.table[cell.parent.row][cell.parent.col];
}
if (!this.table.helper.isEmptyModelCol(cell) && cell.element) {
if (action === 'mergeCell') {
this.clearSelect();
this.selectCellRange(cell.element);
}
}
} else if (action === 'removeRow') {
var _row2 = begin.row < 0 ? 0 : Math.min(begin.row, tableModel.rows - 1);
var _cell = tableModel.table[_row2][0];
if (!this.table.helper.isEmptyModelCol(_cell) && _cell.element) {
this.focusCell(_cell.element);
}
} else if (action === 'removeCol') {
var _col2 = begin.col < 0 ? 0 : Math.min(begin.col, tableModel.cols - 1);
var _cell2 = tableModel.table[0][_col2];
if (!this.table.helper.isEmptyModelCol(_cell2) && _cell2.element) {
this.focusCell(_cell2.element);
}
} else {
this.select(begin, end);
}
this.renderBorder();
}
}, {
key: "renderBorder",
value: function renderBorder() {
var _this2 = this;
var tableModel = this.tableModel;
if (!tableModel) return; //this.tableRoot?.find('td.table-last-column').removeClass('table-last-column');
//this.tableRoot?.find('td.table-last-row').removeClass('table-last-row');
tableModel.table.forEach(function (cols, row) {
cols.forEach(function (cell, col) {
if (!_this2.table.helper.isEmptyModelCol(cell)) {
if (!cell.element) return;
var isLastCol = row === tableModel.rows - 1;
var isLastRow = col === tableModel.cols - 1;
if (cell.isMulti) {
if (col + cell.colSpan === tableModel.cols) isLastRow = true;
if (row + cell.rowSpan === tableModel.rows) isLastCol = true;
}
if (isLastCol) {
if (!cell.element.classList.contains('table-last-column')) cell.element.classList.add('table-last-column');
} else {
if (cell.element.classList.contains('table-last-column')) cell.element.classList.remove('table-last-column');
}
if (isLastRow) {
if (!cell.element.classList.contains('table-last-row')) cell.element.classList.add('table-last-row');
} else {
if (cell.element.classList.contains('table-last-row')) cell.element.classList.remove('table-last-row');
}
}
});
});
}
}, {
key: "bindEvents",
value: function bindEvents() {
var _this$table$wrapper4;
document.addEventListener('keydown', this.onShiftKeydown);
document.addEventListener('keyup', this.onShiftKeyup);
(_this$table$wrapper4 = this.table.wrapper) === null || _this$table$wrapper4 === void 0 ? void 0 : _this$table$wrapper4.on('mousedown', this.onTdMouseDown).on('keydown', this.onKeydown);
}
}, {
key: "unbindEvents",
value: function unbindEvents() {
var _this$table$wrapper5;
document.removeEventListener('keydown', this.onShiftKeydown);
document.removeEventListener('keyup', this.onShiftKeyup);
(_this$table$wrapper5 = this.table.wrapper) === null || _this$table$wrapper5 === void 0 ? void 0 : _this$table$wrapper5.off('mousedown', this.onTdMouseDown).off('keydown', this.onKeydown);
}
}, {
key: "refreshModel",
value: function refreshModel() {
if (!this.tableRoot || this.tableRoot.length === 0) return;
this.tableModel = this.table.helper.getTableModel(this.tableRoot);
}
}, {
key: "each",
value: function each(fn) {
var reverse = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var tableModel = this.tableModel;
if (!tableModel) return;
var _this$getSelectArea2 = this.getSelectArea(),
begin = _this$getSelectArea2.begin,
end = _this$getSelectArea2.end;
if (begin.row < 0 || begin.col < 0) return;
if (reverse) {
for (var r = end.row; r > -1 && r >= begin.row; r--) {
for (var c = end.col; c > -1 && c >= begin.col; c--) {
var tdModel = tableModel.table[r][c];
fn(tdModel, r, c);
}
}
} else {
for (var _r = begin.row; _r > -1 && _r <= end.row; _r++) {
for (var _c = begin.col; _c > -1 && _c <= end.col; _c++) {
var _tdModel = tableModel.table[_r][_c];
fn(_tdModel, _r, _c);
}
}
}
}
}, {
key: "getCellPoint",
value: function getCellPoint(td) {
var _td$parent,
_this$tableModel,
_this$tableModel$tabl,
_this3 = this;
if (td.name !== 'td') return [-1, -1];
var row = (_td$parent = td.parent()) === null || _td$parent === void 0 ? void 0 : _td$parent.index();
if (row === undefined || row < 0) return [-1, -1];
var col = (_this$tableModel = this.tableModel) === null || _this$tableModel === void 0 ? void 0 : (_this$tableModel$tabl = _this$tableModel.table[row]) === null || _this$tableModel$tabl === void 0 ? void 0 : _this$tableModel$tabl.findIndex(function (cell) {
var _this3$tableModel;
return td.equal((_this3.table.helper.isEmptyModelCol(cell) ? (_this3$tableModel = _this3.tableModel) === null || _this3$tableModel === void 0 ? void 0 : _this3$tableModel.table[cell.parent.row][cell.parent.col] : cell).element);
});
if (col === undefined || col < 0) return [-1, -1];
return [row, col];
}
}, {
key: "getCellIndex",
value: function getCellIndex(row, col) {
if (!this.tableModel) return 0;
var trModel = this.tableModel.table[row];
var index = 0;
for (var i = 0; i < col; i++) {
var tdModel = trModel[i];
if (!this.table.helper.isEmptyModelCol(tdModel) && tdModel.element) {
index++;
}
}
return index;
}
}, {
key: "getSingleCell",
value: function getSingleCell() {
if (!this.prevMouseDownTd) return null;
return this.prevMouseDownTd;
}
}, {
key: "getSingleCellPoint",
value: function getSingleCellPoint() {
var td = this.getSingleCell();
if (!td) return [-1, -1];
return this.getCellPoint(td);
}
}, {
key: "getSelectArea",
value: function getSelectArea() {
if (this.selectArea) return this.selectArea;
var curPoint = this.getSingleCellPoint();
if (!this.tableModel || curPoint[0] === -1) return {
begin: {
row: -1,
col: -1
},
end: {
row: -1,
col: -1
},
count: 0,
allCol: false,
allRow: false
};
var _this$tableModel2 = this.tableModel,
cols = _this$tableModel2.cols,
rows = _this$tableModel2.rows,
table = _this$tableModel2.table;
var cell = table[curPoint[0]][curPoint[1]];
if (this.table.helper.isEmptyModelCol(cell)) {
cell = table[cell.parent.row][cell.parent.col];
if (cell.element) curPoint = this.getCellPoint(engine.$(cell.element));
}
return {
begin: {
row: curPoint[0],
col: curPoint[1]
},
end: {
row: curPoint[0],
col: curPoint[1]
},
count: curPoint[0] === -1 ? 0 : 1,
allCol: cols === 1,
allRow: rows === 1
};
}
}, {
key: "selectCol",
value: function selectCol(begin) {
var end = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : begin;
if (!this.tableModel) return;
if (this.isShift) {
// 有全选的列
if (this.beginAllCol) {
if (begin < this.beginAllCol) {
end = this.beginAllCol;
} else {
begin = this.beginAllCol;
}
} else if (this.prevMouseDownTd) {
var _this$getCellPoint7 = this.getCellPoint(this.prevMouseDownTd),
_this$getCellPoint8 = _slicedToArray(_this$getCellPoint7, 2),
row = _this$getCellPoint8[0],
col = _this$getCellPoint8[1];
begin = col;
this.beginAllCol = col;
} else if (this.selectArea) {
begin = this.selectArea.begin.col;
if (this.tableModel) {
var tdModel = this.tableModel.table[this.selectArea.begin.row][this.selectArea.begin.col];
if (!this.table.helper.isEmptyModelCol(tdModel) && tdModel.element) this.focusCell(tdModel.element);
}
}
}
this.select({
row: 0,
col: begin
}, {
row: this.tableModel.rows - 1,
col: end
});
}
}, {
key: "selectRow",
value: function selectRow(begin) {
var end = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : begin;
if (!this.tableModel) return;
if (this.isShift) {
// 有全选的行
if (this.beginAllRow) {
if (begin < this.beginAllRow) {
end = this.beginAllRow;
} else {
begin = this.beginAllRow;
}
} else if (this.prevMouseDownTd) {
var _this$getCellPoint9 = this.getCellPoint(this.prevMouseDownTd),
_this$getCellPoint10 = _slicedToArray(_this$getCellPoint9, 2),
row = _this$getCellPoint10[0],
col = _this$getCellPoint10[1];
begin = row;
this.beginAllRow = row;
} else if (this.selectArea) {
begin = this.selectArea.begin.row;
if (this.tableModel) {
var tdModel = this.tableModel.table[this.selectArea.begin.row][this.selectArea.begin.col];
if (!this.table.helper.isEmptyModelCol(tdModel) && tdModel.element) this.focusCell(tdModel.element);
}
}
}
this.select({
row: begin,
col: 0
}, {
row: end,
col: this.tableModel.cols - 1
});
}
}, {
key: "selectCell",
value: function selectCell(begin, end) {
if (begin.name !== 'td' || end.name !== 'td') {
return;
}
var beginPoint = this.getCellPoint(begin);
var endPoint = this.getCellPoint(end);
this.select({
row: beginPoint[0],
col: beginPoint[1]
}, {
row: endPoint[0],
col: endPoint[1]
});
}
}, {
key: "clearSelect",
value: function clearSelect() {
this.select({
row: -1,
col: -1
}, {
row: -1,
col: -1
});
}
}, {
key: "calcEdge",
value: function calcEdge(begin, end) {
var _this4 = this;
var beginRow = Math.min(begin.row, end.row);
var endRow = Math.max(begin.row, end.row);
var beginCol = Math.min(begin.col, end.col);
var endCol = Math.max(begin.col, end.col);
var calc = function calc() {
if (!_this4.tableModel) return {
beginCol: beginCol,
beginRow: beginRow,
endCol: endCol,
endRow: endRow
};
for (var r = beginRow; r <= endRow; r++) {
var row = _this4.tableModel.table[r];
if (!row) continue;
for (var c = beginCol; c <= endCol; c++) {
var cell = row[c];
if (!cell) continue;
if (!_this4.table.helper.isEmptyModelCol(cell)) {
if (c !== beginCol && cell.colSpan + c - 1 === beginCol) {
beginCol = c;
return calc();
}
if (r !== beginRow && cell.rowSpan + r - 1 === beginRow) {
beginRow = r;
return calc();
}
if (cell.rowSpan > 1 && endRow < cell.rowSpan - 1 + r) {
endRow = cell.rowSpan - 1 + r;
return calc();
}
if (cell.colSpan > 1 && endCol < cell.colSpan - 1 + c) {
endCol = cell.colSpan - 1 + c;
return calc();
}
} else {
var parent = _this4.tableModel.table[cell.parent.row][cell.parent.col];
if (_this4.table.helper.isEmptyModelCol(parent)) continue;
if (parent.colSpan + cell.parent.col - 1 === beginCol && cell.parent.col < beginCol) {
beginCol = cell.parent.col;
return calc();
}
if (parent.rowSpan + cell.parent.row - 1 === beginRow && cell.parent.row < beginRow) {
beginRow = cell.parent.row;
return calc();
}
if (parent.rowSpan > 1 && endRow < parent.rowSpan - 1 + cell.parent.row) {
endRow = parent.rowSpan - 1 + cell.parent.row;
return calc();
}
if (parent.colSpan > 1 && endCol < parent.colSpan - 1 + cell.parent.col) {
endCol = parent.colSpan - 1 + cell.parent.col;
return calc();
}
}
}
}
return {
beginCol: beginCol,
beginRow: beginRow,
endCol: endCol,
endRow: endRow
};
};
return calc();
}
}, {
key: "select",
value: function select(begin, end) {
var _this$tableRoot2;
if (!this.tableModel) return;
var isSame = begin.row === end.row && begin.col === end.col;
(_this$tableRoot2 = this.tableRoot) === null || _this$tableRoot2 === void 0 ? void 0 : _this$tableRoot2.find('td[table-cell-selection]').removeAttributes('table-cell-selection');
var _this$calcEdge = this.calcEdge(begin, end),
beginRow = _this$calcEdge.beginRow,
endRow = _this$calcEdge.endRow,
beginCol = _this$calcEdge.beginCol,
endCol = _this$calcEdge.endCol;
var count = 0;
if (beginRow >= 0 && beginCol >= 0 && endRow < this.tableModel.rows && endCol < this.tableModel.cols) {
for (var r = beginRow; r <= endRow; r++) {
for (var c = beginCol; c <= endCol; c++) {
var row = this.tableModel.table[r];
if (!row) continue;
var col = row[c];
if (!col) continue;
if (!this.table.helper.isEmptyModelCol(col)) {
if (!isSame && col.element) {
engine.$(col.element).attributes('table-cell-selection', 'true');
}
count++;
}
}
}
}
if (isSame && begin.row > -1 && begin.col > -1) {
var _this$prevMouseDownTd;
var cell = this.tableModel.table[begin.row][begin.col];
if (cell && !this.table.helper.isEmptyModelCol(cell) && cell.element && !((_this$prevMouseDownTd = this.prevMouseDownTd) === null || _this$prevMouseDownTd === void 0 ? void 0 : _this$prevMouseDownTd.equal(cell.element))) {
this.focusCell(cell.element);
}
}
var allCol = beginCol === 0 && endCol === this.tableModel.cols - 1;
var allRow = beginRow === 0 && endRow === this.tableModel.rows - 1;
if (allCol && !this.beginAllRow) {
this.beginAllRow = beginRow;
} else if (!allCol && this.beginAllRow) {
this.beginAllRow = undefined;
}
if (allRow && !this.beginAllCol) {
this.beginAllCol = beginCol;
} else if (!allRow && this.beginAllCol) {
this.beginAllCol = undefined;
}
this.selectArea = count === 0 || isSame ? undefined : {
begin: {
row: beginRow,
col: beginCol
},
end: {
row: endRow,
col: endCol
},
count: count,
allCol: allCol,
allRow: allRow
};
this.emit('select', this.selectArea);
}
}, {
key: "focusCell",
value: function focusCell(cell) {
var start = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var editor = this.editor;
if (!engine.isEngine(editor)) return;
var change = editor.change;
if (engine.isNode(cell)) cell = engine.$(cell);
var range = change.range.get();
var editableElement = cell.find(engine.EDITABLE_SELECTOR);
if (editableElement.length > 0) {
var _editableElement$get;
range.select(editableElement, true).shrinkToElementNode().shrinkToTextNode().collapse(start);
setTimeout(function () {
change.range.select(range);
}, 20);
(_editableElement$get = editableElement.get()) === null || _editableElement$get === void 0 ? void 0 : _editableElement$get.focus();
this.prevMouseDownTd = cell;
this.selectCell(cell, cell);
}
}
}, {
key: "selectCellRange",
value: function selectCellRange(cell) {
var _firstChildren$first;
var editor = this.editor;
if (!engine.isEngine(editor)) return;
var change = editor.change;
if (engine.isNode(cell)) cell = engine.$(cell);
var range = change.range.get();
var editableElement = cell.find(engine.EDITABLE_SELECTOR);
if (editableElement.length === 0) return;
range.select(editableElement, true).shrinkToElementNode();
var children = editableElement.children();
var firstChildren = children.eq(0);
if (children.length === 1 && (firstChildren === null || firstChildren === void 0 ? void 0 : (_firstChildren$first = firstChildren.first()) === null || _firstChildren$first === void 0 ? void 0 : _firstChildren$first.name) === 'br') {
var _editableElement$get2;
range.collapse(false);
change.range.select(range);
(_editableElement$get2 = editableElement.get()) === null || _editableElement$get2 === void 0 ? void 0 : _editableElement$get2.focus();
} else {
change.range.select(range);
}
this.prevMouseDownTd = cell;
this.selectCell(cell, cell);
}
}, {
key: "addDragEvent",
value: function addDragEvent() {
var _this$tableRoot3;
(_this$tableRoot3 = this.tableRoot) === null || _this$tableRoot3 === void 0 ? void 0 : _this$tableRoot3.addClass('drag-select');
document.addEventListener(engine.isMobile ? 'touchend' : 'mouseup', this.removeDragEvent, {
passive: true
});
document.addEventListener(engine.isMobile ? 'touchmove' : 'mousemove', this.onDragMove, {
passive: true
});
}
}, {
key: "selectLeft",
value: function selectLeft(event, td) {
var _this$selectArea, _this$selectArea2, _this$selectArea3;
var editor = this.editor;
if (!engine.isEngine(editor)) return; //获取单元格位置
var _this$getCellPoint11 = this.getCellPoint(td),
_this$getCellPoint12 = _slicedToArray(_this$getCellPoint11, 2),
row = _this$getCellPoint12[0],
col = _this$getCellPoint12[1];
if (row < 0 || col < 0) return;
var count = ((_this$selectArea = this.selectArea) === null || _this$selectArea === void 0 ? void 0 : _this$selectArea.count) || 0; //查看当前光标是否处于单元格可编辑节点的开始位置
var range = editor.change.range.get();
if (count === 0) {
if (this.selectRange && this.selectRange.type === 'right') {
if (range.endOffset !== this.selectRange.startOffset) {
return;
}
}
this.selectRange = {
type: 'left',
startOffset: range.startOffset,
endOffset: range.endOffset
};
var startNode = range.startNode; //光标不在开始位置,不执行操作
if (range.startOffset !== 0) {
return;
} //如果还有上一级不执行操作
if (startNode.prev()) return; //循环父级节点,要求父级节点在其开始位置
var currentParent = startNode.parent();
while (currentParent && !currentParent.isEditable()) {
if (currentParent.prev()) return;
currentParent = currentParent.parent();
}
} //总行数和列数
var begin = ((_this$selectArea2 = this.selectArea) === null || _this$selectArea2 === void 0 ? void 0 : _this$selectArea2.begin) || {
row: row,
col: col
};
var end = ((_this$selectArea3 = this.selectArea) === null || _this$selectArea3 === void 0 ? void 0 : _this$selectArea3.end) || {
row: row,
col: col
};
var isLeft = begin.col !== col;
var triggerCol = isLeft ? begin.col - 1 : end.col - 1;
if (triggerCol < 0) return;
event.preventDefault();
if (triggerCol === col && count === 2) {
triggerCol = -1;
}
if (isLeft) {
this.select(_objectSpread2(_objectSpread2({}, begin), {}, {
col: triggerCol
}), end);
} else {
this.select(begin, _objectSpread2(_objectSpread2({}, end), {}, {
col: triggerCol
}));
}
}
}, {
key: "selectRigth",
value: function selectRigth(event, td) {
var _this$selectArea4, _this$selectArea5, _this$selectArea6;
var editor = this.editor;
if (!engine.isEngine(editor) || !this.tableModel) return;
event.stopPropagation(); //获取单元格位置
var _this$getCellPoint13 = this.getCellPoint(td),
_this$getCellPoint14 = _slicedToArray(_this$getCellPoint13, 2),
row = _this$getCellPoint14[0],
col = _this$getCellPoint14[1];
if (row < 0 || col < 0) return;
var count = ((_this$selectArea4 = this.selectArea) === null || _this$selectArea4 === void 0 ? void 0 : _this$selectArea4.count) || 0; //当前没有选择任何单元格的时候判断光标位置
var range = editor.change.range.get();
if (count === 0) {
var _endNode$last;
if (this.selectRange && this.selectRange.type === 'left') {
if (range.startOffset !== this.selectRange.endOffset) {
return;
}
}
this.selectRange = {
type: 'right',
startOffset: range.startOffset,
endOffset: range.endOffset
}; //查看当前光标是否处于单元格可编辑节点的最后位置
var endNode = range.endNode; //文本节点,光标不在最后位置,不执行操作
if (endNode.isText() && range.endOffset !== endNode.text().length) {
return;
} //其它节点,光标不在最后位置,不执行操作
var children = endNode.children();
if (endNode.isElement() && range.endOffset !== children.length && ((_endNode$last = endNode.last()) === null || _endNode$last === void 0 ? void 0 : _endNode$last.name) !== 'br') {
return;
} //如果还有下一级不执行操作
if (endNode.next()) return; //循环父级节点,要求父级节点在其末尾
var currentParent = endNode.parent();
while (currentParent && !currentParent.isEditable()) {
if (currentParent.next()) return;
currentParent = currentParent.parent();
}
}
var cols = this.tableModel.cols;
var begin = ((_this$selectArea5 = this.selectArea) === null || _this$selectArea5 === void 0 ? void 0 : _this$selectArea5.begin) || {
row: row,
col: col
};
var end = ((_this$selectArea6 = this.selectArea) === null || _this$selectArea6 === void 0 ? void 0 : _this$selectArea6.end) || {
row: row,
col: col
};
var isLeft = begin.col !== col;
var triggerCol = isLeft ? begin.col + 1 : end.col + 1;
if (triggerCol > cols - 1) return;
event.preventDefault();
if (triggerCol === col && count === 2) {
triggerCol = -1;
}
if (isLeft) {
this.select(_objectSpread2(_objectSpread2({}, begin), {}, {
col: triggerCol
}), end);
} else this.select(begin, _objectSpread2(_objectSpread2({}, end), {}, {
col: triggerCol
}));
}
}, {
key: "selectUp",
value: function selectUp(event, td) {
var _this$selectArea7, _this$selectArea8, _this$selectArea9;
var editor = this.editor;
if (!engine.isEngine(editor) || !this.tableModel) return; //获取单元格位置
var _this$getCellPoint15 = this.getCellPoint(td),
_this$getCellPoint16 = _slicedToArray(_this$getCellPoint15, 2),
row = _this$getCellPoint16[0],
col = _this$getCellPoint16[1];
if (row < 0 || col < 0) return;
var count = ((_this$selectArea7 = this.selectArea) === null || _this$selectArea7 === void 0 ? void 0 : _this$selectArea7.count) || 0; //当前没有选择任何单元格的时候判断光标位置
var range = editor.change.range.get();
if (count === 0) {
if (this.selectRange && this.selectRange.type === 'bottom') {
if (range.endOffset !== this.selectRange.startOffset) {
return;
}
}
this.selectRange = {
type: 'top',
startOffset: range.startOffset,
endOffset: range.endOffset
}; //查看当前光标是否处于单元格可编辑节点的开始位置
var rangeRect = range.getBoundingClientRect();
var tdRect = td.find(engine.EDITABLE_SELECTOR).getBoundingClientRect();
if (rangeRect.width !== 0 && rangeRect.height === 0 && rangeRect.top - ((tdRect === null || tdRect === void 0 ? void 0 : tdRect.top) || 0) > 10) return;
}
var begin = ((_this$selectArea8 = this.selectArea) === null || _this$selectArea8 === void 0 ? void 0 : _this$selectArea8.begin) || {
row: row,
col: col
};
var end = ((_this$selectArea9 = this.selectArea) === null || _this$selectArea9 === void 0 ? void 0 : _this$selectArea9.end) || {
row: row,
col: col
};
var isUp = begin.row !== row;
var triggerRow = isUp ? begin.row - 1 : end.row - 1;
event.preventDefault();
if (triggerRow < 0) return;
if (triggerRow === row && count === 2) {
triggerRow = -1;
}
if (isUp) {
this.select(_objectSpread2(_objectSpread2({}, begin), {}, {
row: triggerRow
}), end);
} else this.select(begin, _objectSpread2(_objectSpread2({}, end), {}, {
row: triggerRow
}));
}
}, {
key: "selectDown",
value: function selectDown(event, td) {
var _this$selectArea10, _this$selectArea11, _this$selectArea12;
var editor = this.editor;
if (!engine.isEngine(editor) || !this.tableModel) return; //获取单元格位置
var _this$getCellPoint17 = this.getCellPoint(td),
_this$getCellPoint18 = _slicedToArray(_this$getCellPoint17, 2),
row = _this$getCellPoint18[0],
col = _this$getCellPoint18[1];
if (row < 0 || col < 0) return;
var count = ((_this$selectArea10 = this.selectArea) === null || _this$selectArea10 === void 0 ? void 0 : _this$selectArea10.count) || 0; //当前没有选择任何单元格的时候判断光标位置
var range = editor.change.range.get();
range.shrinkToElementNode();
if (count === 0) {
if (this.selectRange && this.selectRange.type === 'top') {
if (range.startOffset !== this.selectRange.endOffset) {
return;
}
}
this.selectRange = {
type: 'bottom',
startOffset: range.startOffset,
endOffset: range.endOffset
}; //查看当前光标是否处于单元格可编辑节点的开始位置
var rangeRect = range.getBoundingClientRect();
var tdRect = td.find(engine.EDITABLE_SELECTOR).getBoundingClientRect();
if (rangeRect.width !== 0 && rangeRect.height === 0 && ((tdRect === null || tdRect === void 0 ? void 0 : tdRect.bottom) || 0) - rangeRect.bottom > 10) return;
}
var rows = this.tableModel.rows;
var begin = ((_this$selectArea11 = this.selectArea) === null || _this$selectArea11 === void 0 ? void 0 : _this$selectArea11.begin) || {
row: row,
col: col
};
var end = ((_this$selectArea12 = this.selectArea) === null || _this$selectArea12 === void 0 ? void 0 : _this$selectArea12.end) || {
row: row,
col: col
};
var isUp = begin.row !== row;
var triggerRow = isUp ? begin.row + 1 : end.row + 1;
if (triggerRow > rows - 1) return;
event.preventDefault();
if (triggerRow === row && count === 2) {
triggerRow = -1;
}
if (isUp) {
this.select(_objectSpread2(_objectSpread2({}, begin), {}, {
row: triggerRow
}), end);
} else this.select(begin, _objectSpread2(_objectSpread2({}, end), {}, {
row: triggerRow
}));
}
}, {
key: "getSelectionHtml",
value: function getSelectionHtml() {
var all = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var tableModel = this.tableModel;
var helper = this.table.helper;
if (!tableModel || !this.tableRoot) return null;
var begin = {
row: 0,
col: 0
};
var end = {
row: tableModel.rows - 1,
col: tableModel.cols - 1
};
if (!all) {
var area = this.getSelectArea();
begin = area.begin;
end = area.end;
}
var colsEl = this.tableRoot.find('col');
var cols = [];
var tableWidth = 0;
for (var c = begin.col; c <= end.col; c++) {
var _colsEl$eq;
var colElement = (_colsEl$eq = colsEl.eq(c)) === null || _colsEl$eq === void 0 ? void 0 : _colsEl$eq.get();
if (!colElement) continue;
cols.push(' '));
tableWidth += parseInt(colElement.width);
}
var colgroup = ''.concat(cols.join(''), ' ');
var trHtml = [];
for (var r = begin.row; r <= end.row; r++) {
var tdHtml = [];
var trHeight = undefined;
for (var _c2 = begin.col; _c2 <= end.col; _c2++) {
var tdModel = tableModel.table[r][_c2];
var rowRemain = undefined;
var colRemain = undefined;
var tdClone = undefined;
if (!helper.isEmptyModelCol(tdModel) && tdModel.element) {
tdClone = tdModel.element.cloneNode(true);
if (tdModel.element.parentElement) trHeight = engine.$(tdModel.element.parentElement).css('height');
}
if (!helper.isEmptyModelCol(tdModel) && tdModel.isMulti) {
// 合并单元格尾部被选区切断的情况,需要重新计算合并单元格的跨度
rowRemain = Math.min(r + tdModel.rowSpan - 1, end.row) - r + 1;
colRemain = Math.min(_c2 + tdModel.colSpan - 1, end.col) - _c2 + 1;
}
if (helper.isEmptyModelCol(tdModel)) {
var parentTd = tableModel.table[tdModel.parent.row][tdModel.parent.col]; // 选区中含有合并单元格的一部分时,需要补充这一部分的dom结构,这种情况只会出现在行列选择时
// 列选择时,切断合并单元格后,第一个和父单元格同行,并在选取左测第一个列的位置,补充此单元格
if (tdModel.parent.row === r && tdModel.parent.col < begin.col && _c2 === begin.col) {
var colCut = begin.col - tdModel.parent.col;
if (!helper.isEmptyModelCol(parentTd)) {
var _parentTd$element;
colRemain = Math.min(parentTd.colSpan - colCut, end.col - begin.col + 1);
rowRemain = parentTd.rowSpan;
tdClone = (_parentTd$element = parentTd.element) === null || _parentTd$element === void 0 ? void 0 : _parentTd$element.cloneNode(true);
}
} // 行选择时,切断合并单元格后,第一个和父单元格同列,并在选取上测第一个行的位置,补充此单元格
if (tdModel.parent.col === _c2 && tdModel.parent.row < begin.row && r === begin.row) {
var rowCut = begin.row - tdModel.parent.row;
if (!helper.isEmptyModelCol(parentTd)) {
var _parentTd$element2;
rowRemain = Math.min(parentTd.rowSpan - rowCut, end.row - begin.row + 1);
colRemain = parentTd.colSpan;
tdClone = (_parentTd$element2 = parentTd.element) === null || _parentTd$element2 === void 0 ? void 0 : _parentTd$element2.cloneNode(true);
}
}
}
if (tdClone) {
tdClone = tdClone;
if (rowRemain) tdClone.setAttribute('rowspan', "".concat(rowRemain));
if (colRemain) tdClone.setAttribute('colspan', "".concat(colRemain));
var editoableElement = tdClone.firstChild;
if (editoableElement.classList.contains('table-main-content')) {
var copyNode = tdClone.cloneNode(false);
copyNode.innerHTML = editoableElement.innerHTML;
tdHtml.push(copyNode.outerHTML);
} else {
tdHtml.push(tdClone.outerHTML);
}
}
}
var trElement = engine.$("".concat(tdHtml.join(''), " "));
if (trHeight) trElement.css('height', trHeight);
trHtml.push(trElement.get().outerHTML);
}
return "").concat(colgroup).concat(trHtml.join(''), "
");
}
}, {
key: "hasMergeCell",
value: function hasMergeCell() {
var table = this.table,
tableModel = this.tableModel;
if (!tableModel) return false;
var _this$getSelectArea3 = this.getSelectArea(),
begin = _this$getSelectArea3.begin,
end = _this$getSelectArea3.end,
count = _this$getSelectArea3.count;
if (count !== 1) return false;
var cell = tableModel.table[begin.row][begin.col];
return !table.helper.isEmptyModelCol(cell) && cell.isMulti === true;
}
}, {
key: "isRowSelected",
value: function isRowSelected() {
return !!this.selectArea && this.selectArea.allRow;
}
}, {
key: "isColSelected",
value: function isColSelected() {
return !!this.selectArea && this.selectArea.allCol;
}
}, {
key: "isTableSelected",
value: function isTableSelected() {
return !!this.selectArea && this.selectArea.allCol && this.selectArea.allRow;
}
}, {
key: "showHighlight",
value: function showHighlight(area) {
var _this$colsHeader, _this$rowsHeader, _this$table$wrapper6, _this$table$wrapper6$, _this$table$wrapper7, _this$colsHeader2, _this$colsHeader2$fin;
var helper = this.table.helper;
var tableModel = this.tableModel;
if (!tableModel) return;
var begin = area.begin,
end = area.end,
allCol = area.allCol,
allRow = area.allRow;
if (begin.row < 0 || begin.col < 0) return;
var beginRow = begin.row;
var endRow = end.row;
if (allCol && !allRow) {
for (var r = begin.row; r <= end.row; r++) {
var cell = tableModel.table[r][begin.col];
if (helper.isEmptyModelCol(cell)) {
var parentTd = tableModel.table[cell.parent.row][cell.parent.col];
if (helper.isEmptyModelCol(parentTd)) continue;
beginRow = Math.min(cell.parent.row, beginRow);
} else {
endRow = Math.max(r + cell.rowSpan - 1, endRow);
}
}
}
var beginCol = begin.col;
var endCol = end.col;
if (allRow && !allCol) {
for (var c = begin.col; c <= end.col; c++) {
var _cell3 = tableModel.table[begin.row][c];
if (helper.isEmptyModelCol(_cell3)) {
var _parentTd = tableModel.table[_cell3.parent.row][_cell3.parent.col];
if (helper.isEmptyModelCol(_parentTd)) continue;
beginCol = Math.min(_cell3.parent.col, beginCol);
} else {
endCol = Math.max(c + _cell3.colSpan - 1, endCol);
}
}
} // const { beginRow, endRow, beginCol, endCol } = this.calcEdge(
// begin,
// end,
// );
this.hideHighlight();
var colsHeader = (_this$colsHeader = this.colsHeader) === null || _this$colsHeader === void 0 ? void 0 : _this$colsHeader.find(Template.COLS_HEADER_ITEM_CLASS);
var rowsHeader = (_this$rowsHeader = this.rowsHeader) === null || _this$rowsHeader === void 0 ? void 0 : _this$rowsHeader.find(Template.ROWS_HEADER_ITEM_CLASS);
var height = 0;
var width = 0;
for (var _r2 = allRow ? 0 : beginRow; _r2 <= (allRow ? tableModel.rows - 1 : endRow); _r2++) {
var _cell4 = tableModel.table[_r2][beginCol];
if (!helper.isEmptyModelCol(_cell4)) {
var _rowsHeader$eq;
if (_cell4.element) height += _cell4.element.offsetHeight;
rowsHeader === null || rowsHeader === void 0 ? void 0 : (_rowsHeader$eq = rowsHeader.eq(_r2)) === null || _rowsHeader$eq === void 0 ? void 0 : _rowsHeader$eq.addClass('active');
} else {
var _rowsHeader$eq2;
var _parentTd2 = tableModel.table[_cell4.parent.row][_cell4.parent.col];
if (helper.isEmptyModelCol(_parentTd2)) continue;
if (_parentTd2.element && allRow) height += _parentTd2.element.offsetHeight;
rowsHeader === null || rowsHeader === void 0 ? void 0 : (_rowsHeader$eq2 = rowsHeader.eq(_r2)) === null || _rowsHeader$eq2 === void 0 ? void 0 : _rowsHeader$eq2.addClass('active');
}
}
for (var _c3 = allCol ? 0 : beginCol; _c3 <= (allCol ? tableModel.cols - 1 : endCol); _c3++) {
var _cell5 = tableModel.table[beginRow][_c3];
if (!helper.isEmptyModelCol(_cell5)) {
var _colsHeader$eq;
if (_cell5.element) width += _cell5.element.offsetWidth;
colsHeader === null || colsHeader === void 0 ? void 0 : (_colsHeader$eq = colsHeader.eq(_c3)) === null || _colsHeader$eq === void 0 ? void 0 : _colsHeader$eq.addClass('active');
} else {
var _colsHeader$eq2;
var _parentTd3 = tableModel.table[_cell5.parent.row][_cell5.parent.col];
if (helper.isEmptyModelCol(_parentTd3)) continue;
if (_parentTd3.element && allCol) width += _parentTd3.element.offsetWidth;
colsHeader === null || colsHeader === void 0 ? void 0 : (_colsHeader$eq2 = colsHeader.eq(_c3)) === null || _colsHeader$eq2 === void 0 ? void 0 : _colsHeader$eq2.addClass('active');
}
}
if (endRow === tableModel.rows - 1 && endCol === tableModel.cols - 1) {
var _this$tableHeader;
(_this$tableHeader = this.tableHeader) === null || _this$tableHeader === void 0 ? void 0 : _this$tableHeader.addClass('active');
}
var firstCell = tableModel.table[allRow ? 0 : beginRow][allCol ? 0 : beginCol];
var top = 0;
var left = 0;
if (!helper.isEmptyModelCol(firstCell) && firstCell.element) {
var _this$tableRoot4;
var viewport = (_this$tableRoot4 = this.tableRoot) === null || _this$tableRoot4 === void 0 ? void 0 : _this$tableRoot4.parent();
var vRect = viewport === null || viewport === void 0 ? void 0 : viewport.getBoundingClientRect();
var rect = firstCell.element.getBoundingClientRect();
top += rect.top - ((vRect === null || vRect === void 0 ? void 0 : vRect.top) || 0) - 13;
left += rect.left - ((vRect === null || vRect === void 0 ? void 0 : vRect.left) || 0);
}
var sLeft = engine.removeUnit(((_this$table$wrapper6 = this.table.wrapper) === null || _this$table$wrapper6 === void 0 ? void 0 : (_this$table$wrapper6$ = _this$table$wrapper6.find('.data-scrollbar')) === null || _this$table$wrapper6$ === void 0 ? void 0 : _this$table$wrapper6$.css('left')) || '0') + engine.removeUnit(((_this$table$wrapper7 = this.table.wrapper) === null || _this$table$wrapper7 === void 0 ? void 0 : _this$table$wrapper7.css('margin-left')) || '0');
left += sLeft;
var headerHeight = ((_this$colsHeader2 = this.colsHeader) === null || _this$colsHeader2 === void 0 ? void 0 : (_this$colsHeader2$fin = _this$colsHeader2.find(Template.COLS_HEADER_ITEM_CLASS).get()) === null || _this$colsHeader2$fin === void 0 ? void 0 : _this$colsHeader2$fin.offsetHeight) || 0;
top += headerHeight;
if (height > 0 && width > 0) {
var _this$highlight, _this$highlight2, _this$highlight3, _this$highlight4, _this$highlight5, _this$table$wrapper8;
(_this$highlight = this.highlight) === null || _this$highlight === void 0 ? void 0 : _this$highlight.css('width', "".concat(width, "px"));
(_this$highlight2 = this.highlight) === null || _this$highlight2 === void 0 ? void 0 : _this$highlight2.css('height', "".concat(height, "px"));
(_this$highlight3 = this.highlight) === null || _this$highlight3 === void 0 ? void 0 : _this$highlight3.css('top', "".concat(top, "px"));
(_this$highlight4 = this.highlight) === null || _this$highlight4 === void 0 ? void 0 : _this$highlight4.css('left', "".concat(left, "px"));
(_this$highlight5 = this.highlight) === null || _this$highlight5 === void 0 ? void 0 : _this$highlight5.show('block');
(_this$table$wrapper8 = this.table.wrapper) === null || _this$table$wrapper8 === void 0 ? void 0 : _this$table$wrapper8.addClass('data-table-highlight');
if (allCol) {
var _this$table$wrapper9;
(_this$table$wrapper9 = this.table.wrapper) === null || _this$table$wrapper9 === void 0 ? void 0 : _this$table$wrapper9.addClass('data-table-highlight-row');
}
if (allRow) {
var _this$table$wrapper10;
(_this$table$wrapper10 = this.table.wrapper) === null || _this$table$wrapper10 === void 0 ? void 0 : _this$table$wrapper10.addClass('data-table-highlight-col');
}
if (allCol && allRow) {
var _this$table$wrapper11;
(_this$table$wrapper11 = this.table.wrapper) === null || _this$table$wrapper11 === void 0 ? void 0 : _this$table$wrapper11.addClass('data-table-highlight-all');
}
}
}
}, {
key: "hideHighlight",
value: function hideHighlight() {
var _this$highlight6, _this$colsHeader3, _this$rowsHeader2, _this$tableHeader2, _this$table$wrapper12, _this$table$wrapper13, _this$table$wrapper14, _this$table$wrapper15;
(_this$highlight6 = this.highlight) === null || _this$highlight6 === void 0 ? void 0 : _this$highlight6.hide();
(_this$colsHeader3 = this.colsHeader) === null || _this$colsHeader3 === void 0 ? void 0 : _this$colsHeader3.find('.active').removeClass('active');
(_this$rowsHeader2 = this.rowsHeader) === null || _this$rowsHeader2 === void 0 ? void 0 : _this$rowsHeader2.find('.active').removeClass('active');
(_this$tableHeader2 = this.tableHeader) === null || _this$tableHeader2 === void 0 ? void 0 : _this$tableHeader2.removeClass('active');
(_this$table$wrapper12 = this.table.wrapper) === null || _this$table$wrapper12 === void 0 ? void 0 : _this$table$wrapper12.removeClass('data-table-highlight');
(_this$table$wrapper13 = this.table.wrapper) === null || _this$table$wrapper13 === void 0 ? void 0 : _this$table$wrapper13.removeClass('data-table-highlight-row');
(_this$table$wrapper14 = this.table.wrapper) === null || _this$table$wrapper14 === void 0 ? void 0 : _this$table$wrapper14.removeClass('data-table-highlight-col');
(_this$table$wrapper15 = this.table.wrapper) === null || _this$table$wrapper15 === void 0 ? void 0 : _this$table$wrapper15.removeClass('data-table-highlight-all');
}
}, {
key: "destroy",
value: function destroy() {
this.unbindEvents();
}
}]);
return TableSelection;
}(eventemitter2.EventEmitter2);
var TableCommand = /*#__PURE__*/function (_EventEmitter) {
_inherits(TableCommand, _EventEmitter);
var _super = _createSuper(TableCommand);
function TableCommand(editor, table) {
var _this;
_classCallCheck(this, TableCommand);
_this = _super.call(this);
_this.editor = void 0;
_this.table = void 0;
_this.tableCleared = false;
_this.rowCleared = false;
_this.colCleared = false;
_this.tableRoot = void 0;
_this.colsHeader = void 0;
_this.rowsHeader = void 0;
_this.tableHeader = void 0;
_this.viewport = void 0;
_this.clearFormat = function () {
var _this$table = _this.table,
selection = _this$table.selection,
helper = _this$table.helper;
var selectArea = selection.getSelectArea();
selection.each(function (tdModel) {
if (!helper.isEmptyModelCol(tdModel) && tdModel.element) {
tdModel.element.removeAttribute('style');
}
});
_this.emit('actioned', 'clearFormat');
};
_this.hasCopyData = function () {
return !!_this.table.helper.getCopyData();
};
_this.clearCopyData = function () {
_this.table.helper.clearCopyData();
};
_this.editor = editor;
_this.table = table;
return _this;
}
_createClass(TableCommand, [{
key: "init",
value: function init() {
var wrapper = this.table.wrapper;
if (!wrapper) return;
this.tableRoot = wrapper.find(Template.TABLE_CLASS);
this.colsHeader = wrapper.find(Template.COLS_HEADER_CLASS);
this.rowsHeader = wrapper.find(Template.ROWS_HEADER_CLASS);
this.tableHeader = wrapper.find(Template.HEADER_CLASS);
this.viewport = wrapper.find(Template.VIEWPORT);
}
}, {
key: "insertColAt",
value: function insertColAt(index, count, isLeft, widths) {
var _colsHeader$eq,
_cols$eq,
_this2 = this;
var _this$table2 = this.table,
selection = _this$table2.selection,
wrapper = _this$table2.wrapper;
var tableModel = selection.tableModel;
if (!wrapper || !tableModel || !this.tableRoot) return; // 第一行插在前面,其他行插在后面
var colBase = index;
var insertMethod = isLeft ? 'after' : 'before';
var colsHeader = wrapper.find(Template.COLS_HEADER_ITEM_CLASS);
var baseColHeader = (_colsHeader$eq = colsHeader.eq(colBase)) === null || _colsHeader$eq === void 0 ? void 0 : _colsHeader$eq.get();
var insertCol = isLeft ? colBase + 1 : colBase;
var head = wrapper.find(Template.COLS_HEADER_CLASS);
var table = wrapper.find(Template.TABLE_CLASS);
if (!widths) {
widths = baseColHeader.offsetWidth;
}
var containerWidth = this.table.root.width();
var minWidth = this.table.colMinWidth;
var colsWidths = [];
colsHeader.each(function (_, index) {
var col = colsHeader.eq(index);
if (col) colsWidths.push(engine.removeUnit(col.css('width')));
});
if (Array.isArray(widths)) {
for (var i = 0; i < widths.length; i++) {
colsWidths.splice(insertCol + i, 0, widths[i]);
}
} else if (typeof widths === 'number') {
for (var _i = 0; _i < count; _i++) {
colsWidths.splice(insertCol, 0, widths);
}
}
var gridWidth = colsWidths.reduce(function (a, b) {
return a + b;
}, 0);
while (!this.table.enableScroll && gridWidth > containerWidth) {
var minCount = 0;
for (var _i2 = 0; _i2 < colsWidths.length; _i2++) {
var w = colsWidths[_i2];
if (w > minWidth) {
colsWidths[_i2] = w - 1;
gridWidth--;
if (gridWidth <= containerWidth) break;
} else {
minCount++;
}
}
if (minCount === colsWidths.length) break;
}
head.css('width', gridWidth + 'px');
table.css('width', gridWidth + 'px');
var colgroup = this.tableRoot.find('colgroup');
var trs = wrapper.find('tr');
var cols = this.tableRoot.find('col');
var cloneNode = (_cols$eq = cols.eq(colBase)) === null || _cols$eq === void 0 ? void 0 : _cols$eq.clone();
if (!cloneNode) return;
var counter = count;
var nodeId = this.editor.nodeId;
while (counter > 0) {
// 插入头 和 col
var cloneColHeader = engine.$(baseColHeader.outerHTML);
engine.$(baseColHeader)[insertMethod](cloneColHeader); // const width = Array.isArray(widths)
// ? widths[count - counter]
// : widths;
// cloneColHeader.css({ width: `${width}px` });
var insertCloneCol = cloneNode === null || cloneNode === void 0 ? void 0 : cloneNode.clone();
insertCloneCol.removeAttributes(engine.DATA_ID); // insertCloneCol.attributes('width', width);
nodeId.create(insertCloneCol);
var baseCol = cols[index];
if (insertMethod === 'after') engine.$(baseCol).after(insertCloneCol);else colgroup[0].insertBefore(insertCloneCol[0], baseCol);
counter--;
} // 插入了新列,需要重新获取
colsHeader = wrapper.find(Template.COLS_HEADER_ITEM_CLASS);
cols = this.tableRoot.find('col'); // 设置宽度
for (var _i3 = 0; _i3 < colsWidths.length; _i3++) {
var _colsHeader$eq2, _cols$eq2;
var width = colsWidths[_i3];
(_colsHeader$eq2 = colsHeader.eq(_i3)) === null || _colsHeader$eq2 === void 0 ? void 0 : _colsHeader$eq2.css({
width: "".concat(width, "px")
});
(_cols$eq2 = cols.eq(_i3)) === null || _cols$eq2 === void 0 ? void 0 : _cols$eq2.attributes('width', width);
} // 插入 td
trs.each(function (tr, r) {
var insertIndex = selection.getCellIndex(r, insertCol);
for (var _r = 0; _r < count; _r++) {
var td = tr.insertCell(insertIndex);
td.innerHTML = _this2.table.template.getEmptyCell();
engine.$(td).attributes(engine.DATA_TRANSIENT_ATTRIBUTES, 'table-cell-selection');
nodeId.generate(td);
}
});
for (var _len = arguments.length, args = new Array(_len > 4 ? _len - 4 : 0), _key = 4; _key < _len; _key++) {
args[_key - 4] = arguments[_key];
}
this.emit.apply(this, ['actioned', 'insertCol'].concat(args)); // 必须等插入完在选择,否则 tableModel 没更新
if (selection.selectArea) {
selection.selectCol(index, index + count - 1);
}
}
}, {
key: "insertCol",
value: function insertCol(position) {
var _colBars$eq;
var count = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
var _this$table3 = this.table,
selection = _this$table3.selection,
wrapper = _this$table3.wrapper;
var tableModel = selection.tableModel;
if (!wrapper || !tableModel) return;
var selectArea = selection.getSelectArea();
var isLeft = position === 'left';
var isEnd = position === 'end' || !position;
var colBars = wrapper.find(Template.COLS_HEADER_ITEM_CLASS);
var colBase = tableModel.cols - 1;
if (!isEnd) {
colBase = isLeft ? selectArea.begin.col : selectArea.end.col;
}
var insertCol = isLeft ? colBase - 1 : colBase + 1; // 插入的列索引小于0,
if (insertCol < 0) {
insertCol = 0;
isLeft = false;
} else if (!isLeft && colBase === tableModel.cols - 1) {
insertCol--;
isLeft = true;
}
var width = (_colBars$eq = colBars.eq(colBase)) === null || _colBars$eq === void 0 ? void 0 : _colBars$eq.get().offsetWidth;
for (var _len2 = arguments.length, args = new Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) {
args[_key2 - 2] = arguments[_key2];
}
this.insertColAt.apply(this, [insertCol, count, isLeft, width].concat(args));
if (isEnd && this.table.enableScroll) {
var _this$viewport;
var viewPort = (_this$viewport = this.viewport) === null || _this$viewport === void 0 ? void 0 : _this$viewport.get();
if (!viewPort) return;
viewPort.scrollLeft = viewPort.scrollWidth - viewPort.offsetWidth;
}
}
}, {
key: "removeCol",
value: function removeCol() {
var _this3 = this;
var _this$table4 = this.table,
selection = _this$table4.selection,
conltrollBar = _this$table4.conltrollBar,
helper = _this$table4.helper;
var tableModel = selection.tableModel;
if (!tableModel || !this.tableRoot) return;
var table = tableModel.table;
var selectArea = _objectSpread2({}, selection.getSelectArea());
if (selectArea.end.col - selectArea.begin.col === 0) {
selection.each(function (cell) {
if (!helper.isEmptyModelCol(cell)) {
selectArea.end.col += cell.colSpan - 1;
}
});
}
var count = selectArea.end.col - selectArea.begin.col + 1;
var colgroup = this.tableRoot.find('colgroup');
var trs = this.tableRoot.find('tr');
var cols = colgroup.find('col');
if (selectArea.allCol) {
this.removeTable();
return;
}
for (var c = selectArea.end.col; c >= selectArea.begin.col; c--) {
var _cols$eq3;
conltrollBar.removeCol(c);
(_cols$eq3 = cols.eq(c)) === null || _cols$eq3 === void 0 ? void 0 : _cols$eq3.remove();
}
table.forEach(function (trModel, r) {
for (var _c = selectArea.end.col; _c >= selectArea.begin.col; _c--) {
var tdModel = trModel[_c];
if (helper.isEmptyModelCol(tdModel)) {
// 删除列如果在单元格内,修正单元格的 colSpan
var parentTd = table[tdModel.parent.row][tdModel.parent.col];
if (!helper.isEmptyModelCol(parentTd) && tdModel.parent.col < selectArea.begin.col) {
var colRemoved = Math.min(count, tdModel.parent.col + parentTd.colSpan - selectArea.begin.col);
if (parentTd.element) {
parentTd.element.colSpan = parentTd.colSpan - colRemoved;
}
}
continue;
} else {
var _tdModel$element;
if (tdModel.isMulti) {
// 合并单元格的头部被切掉,要生成尾部单元格补充到行内
var cutHeader = _c + tdModel.colSpan - 1 > selectArea.end.col;
var cutCount = selectArea.end.col + 1 - _c;
if (cutHeader) {
var _trs$eq, _trs$eq$get;
var insertIndex = 0;
for (var i = 0; i <= selectArea.end.col; i++) {
if (!helper.isEmptyModelCol(trModel[i])) {
insertIndex++;
}
}
var td = (_trs$eq = trs.eq(r)) === null || _trs$eq === void 0 ? void 0 : (_trs$eq$get = _trs$eq.get()) === null || _trs$eq$get === void 0 ? void 0 : _trs$eq$get.insertCell(insertIndex);
if (!td) return;
td.setAttribute(engine.DATA_TRANSIENT_ATTRIBUTES, 'table-cell-selection');
td.innerHTML = _this3.table.template.getEmptyCell();
td.colSpan = tdModel.colSpan - cutCount;
td.rowSpan = tdModel.rowSpan;
_this3.editor.nodeId.generate(td); //if(tdModel.element)
// helper.copyCss(tdModel.element, td)
}
}
(_tdModel$element = tdModel.element) === null || _tdModel$element === void 0 ? void 0 : _tdModel$element.remove();
}
}
});
for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
args[_key3] = arguments[_key3];
}
this.emit.apply(this, ['actioned', 'removeCol'].concat(args));
}
}, {
key: "insertColLeft",
value: function insertColLeft() {
var count = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
this.insertCol('left', count);
}
}, {
key: "insertColRight",
value: function insertColRight() {
var count = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
this.insertCol('right', count);
}
}, {
key: "insertRowAt",
value: function insertRowAt(index, count, isUp) {
var _this4 = this;
var _this$table5 = this.table,
wrapper = _this$table5.wrapper,
selection = _this$table5.selection,
helper = _this$table5.helper;
var tableModel = selection.tableModel;
if (!wrapper || !tableModel) return;
var insertMethod = isUp ? 'after' : 'before';
var baseRow = index;
var rowBars = wrapper.find(Template.ROWS_HEADER_ITEM_CLASS);
var baseRowBar = rowBars[baseRow];
var insertRow = isUp ? baseRow : baseRow + 1;
var insertTdProps = [];
var trModel = tableModel.table[baseRow];
trModel.forEach(function (tdModel, c) {
if (!helper.isEmptyModelCol(tdModel) && tdModel.isMulti) {
if (!isUp && tdModel.rowSpan > 1 && insertRow <= baseRow + tdModel.rowSpan - 1) {
tdModel.element.rowSpan = tdModel.rowSpan + count;
} else {
insertTdProps.push({
tdBase: tdModel.element
});
}
return;
}
if (helper.isEmptyModelCol(tdModel)) {
var parentTd = tableModel.table[tdModel.parent.row][tdModel.parent.col];
if (!helper.isEmptyModelCol(parentTd) && tdModel.parent.row < insertRow && tdModel.parent.row + parentTd.rowSpan - 1 >= insertRow) {
parentTd.element.rowSpan = parentTd.rowSpan + count;
} else {
if (!helper.isEmptyModelCol(parentTd) && tdModel.parent.row < baseRow && tdModel.parent.col === c) {
insertTdProps.push({
tdBase: parentTd.element
});
}
}
return;
}
insertTdProps.push({
tdBase: tdModel.element
});
});
var _count = count;
var nodeId = this.editor.nodeId;
var _loop = function _loop() {
var _this4$tableRoot, _this4$tableRoot$get;
var tr = (_this4$tableRoot = _this4.tableRoot) === null || _this4$tableRoot === void 0 ? void 0 : (_this4$tableRoot$get = _this4$tableRoot.get()) === null || _this4$tableRoot$get === void 0 ? void 0 : _this4$tableRoot$get.insertRow(insertRow);
if (!tr) return;
insertTdProps.forEach(function (props) {
var td = tr.insertCell();
td.setAttribute(engine.DATA_TRANSIENT_ATTRIBUTES, 'table-cell-selection');
td.innerHTML = _this4.table.template.getEmptyCell();
td.colSpan = props.tdBase.colSpan;
});
engine.$(baseRowBar)[insertMethod](engine.$(baseRowBar.outerHTML));
nodeId.generate(tr);
nodeId.generateAll(tr);
_count--;
};
while (_count > 0) {
_loop();
}
for (var _len4 = arguments.length, args = new Array(_len4 > 3 ? _len4 - 3 : 0), _key4 = 3; _key4 < _len4; _key4++) {
args[_key4 - 3] = arguments[_key4];
}
this.emit.apply(this, ['actioned', 'insertRow'].concat(args)); // 必须等插入完在选择,否则 tableModel 没更新
if (selection.selectArea) {
selection.selectRow(index, index + count - 1);
}
}
}, {
key: "insertRow",
value: function insertRow(position) {
var count = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
var _this$table6 = this.table,
selection = _this$table6.selection,
helper = _this$table6.helper;
var tableModel = selection.tableModel;
if (!tableModel) return;
var selectArea = selection.getSelectArea();
var isUp = position === 'up';
var isEnd = position === 'end' || !position;
var baseRow = tableModel.rows - 1;
if (!isEnd) {
var rows = selectArea.end.row;
selection.each(function (cell) {
if (!helper.isEmptyModelCol(cell)) {
rows += cell.rowSpan - 1;
}
});
baseRow = isUp ? selectArea.begin.row : rows;
}
var insertRow = isUp ? baseRow : baseRow;
for (var _len5 = arguments.length, args = new Array(_len5 > 2 ? _len5 - 2 : 0), _key5 = 2; _key5 < _len5; _key5++) {
args[_key5 - 2] = arguments[_key5];
}
this.insertRowAt.apply(this, [insertRow, count, isUp].concat(args));
}
}, {
key: "insertRowUp",
value: function insertRowUp() {
var count = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
this.insertRow('up', count);
}
}, {
key: "insertRowDown",
value: function insertRowDown() {
var count = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
this.insertRow('down', count);
}
}, {
key: "removeRow",
value: function removeRow() {
var _this5 = this;
var _this$table7 = this.table,
selection = _this$table7.selection,
conltrollBar = _this$table7.conltrollBar,
helper = _this$table7.helper;
var tableModel = selection.tableModel;
if (!tableModel || !this.tableRoot) return;
var table = tableModel.table;
var selectArea = _objectSpread2({}, selection.getSelectArea());
var begin = selectArea.begin,
end = selectArea.end; // 单独选中一行,就计算是否有合并的单元格
if (end.row - begin.row === 0) {
selection.each(function (cell) {
if (!helper.isEmptyModelCol(cell)) {
end.row += cell.rowSpan - 1;
}
});
}
var count = end.row - begin.row + 1;
var trs = this.tableRoot.find('tr');
if (selectArea.allRow) {
this.removeTable();
return;
} // 修正 rowSpan 和 补充单元格
var _loop = function _loop(r) {
var trModel = table[r];
trModel.forEach(function (tdModel, c) {
if (!helper.isEmptyModelCol(tdModel) && tdModel.isMulti && tdModel.rowSpan > 1) {
// 合并单元格头部被切掉,需要补充 td
if (r + tdModel.rowSpan - 1 > end.row) {
var insertIndex = selection.getCellIndex(end.row + 1, c);
var td = trs[end.row + 1].insertCell(insertIndex);
var cutCount = end.row - r + 1;
td.setAttribute(engine.DATA_TRANSIENT_ATTRIBUTES, 'table-cell-selection');
td.innerHTML = _this5.table.template.getEmptyCell();
td.colSpan = tdModel.colSpan;
td.rowSpan = tdModel.rowSpan - cutCount;
_this5.editor.nodeId.generate(td);
}
}
if (helper.isEmptyModelCol(tdModel)) {
var parentTd = table[tdModel.parent.row][tdModel.parent.col]; // 合并单元格尾部或中部被切掉,修正 rowSpan
if (!helper.isEmptyModelCol(parentTd) && tdModel.parent.row < begin.row) {
var _cutCount = Math.min(count, tdModel.parent.row + parentTd.rowSpan - begin.row);
parentTd.element.rowSpan = parentTd.rowSpan - _cutCount;
}
}
});
};
for (var r = begin.row; r <= end.row; r++) {
_loop(r);
}
for (var _r2 = end.row; _r2 >= begin.row; _r2--) {
var _this$tableRoot$get;
(_this$tableRoot$get = this.tableRoot.get()) === null || _this$tableRoot$get === void 0 ? void 0 : _this$tableRoot$get.deleteRow(_r2);
conltrollBar.removeRow(_r2);
}
for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
args[_key6] = arguments[_key6];
}
this.emit.apply(this, ['actioned', 'removeRow'].concat(args));
}
}, {
key: "removeTable",
value: function removeTable() {
var editor = this.editor;
if (!engine.isEngine(editor)) this.emit('tableRemoved');
editor.card.remove(this.table.id);
}
}, {
key: "copy",
value: function copy() {
var all = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var _this$table8 = this.table,
selection = _this$table8.selection,
helper = _this$table8.helper;
var areaHtml = selection.getSelectionHtml(all);
if (!areaHtml) return;
this.editor.clipboard.copy(areaHtml);
helper.copyHTML(areaHtml);
}
}, {
key: "mockCopy",
value: function mockCopy() {
var _this$table9 = this.table,
selection = _this$table9.selection,
helper = _this$table9.helper;
var areaHtml = selection.getSelectionHtml();
if (!areaHtml) return;
helper.copyHTML(areaHtml);
}
}, {
key: "shortcutCopy",
value: function shortcutCopy(event) {
var _event$clipboardData, _event$clipboardData2, _event$clipboardData3;
var _this$table10 = this.table,
selection = _this$table10.selection,
helper = _this$table10.helper;
var areaHtml = selection.getSelectionHtml();
if (!areaHtml) return;
(_event$clipboardData = event.clipboardData) === null || _event$clipboardData === void 0 ? void 0 : _event$clipboardData.clearData();
(_event$clipboardData2 = event.clipboardData) === null || _event$clipboardData2 === void 0 ? void 0 : _event$clipboardData2.setData('text/plain', engine.$(areaHtml).html());
(_event$clipboardData3 = event.clipboardData) === null || _event$clipboardData3 === void 0 ? void 0 : _event$clipboardData3.setData('text/html', areaHtml);
helper.copyHTML(areaHtml);
event.preventDefault();
}
}, {
key: "cut",
value: function cut() {
this.copy();
this.clear();
}
}, {
key: "shortcutCut",
value: function shortcutCut(event) {
this.shortcutCopy(event);
this.clear();
}
}, {
key: "clear",
value: function clear() {
var _this6 = this;
var _this$table11 = this.table,
selection = _this$table11.selection,
helper = _this$table11.helper;
var selectArea = selection.getSelectArea();
if (selectArea.allCol && selectArea.allRow) {
if (this.tableCleared) {
this.removeTable();
this.tableCleared = false;
return;
}
this.tableCleared = true;
}
if (selectArea.allRow) {
if (this.rowCleared) {
this.removeRow();
this.rowCleared = false;
return;
}
this.rowCleared = true;
}
if (selectArea.allCol) {
if (this.colCleared) {
this.removeCol();
this.colCleared = false;
return;
}
this.colCleared = true;
}
selection.each(function (tdModel) {
if (!helper.isEmptyModelCol(tdModel) && tdModel.element) {
tdModel.element.innerHTML = _this6.table.template.getEmptyCell();
}
});
this.emit('actioned', 'clear');
}
}, {
key: "mockPaste",
value: function mockPaste() {
var data = this.table.helper.getCopyData();
if (!data) return;
for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) {
args[_key7] = arguments[_key7];
}
this.paste.apply(this, [data].concat(args));
}
}, {
key: "shortcutPaste",
value: function shortcutPaste(event) {
event.preventDefault();
event.stopPropagation();
var data = this.editor.clipboard.getData(event);
this.paste(data);
}
}, {
key: "paste",
value: function paste(data) {
var _this$table12 = this.table,
selection = _this$table12.selection,
helper = _this$table12.helper;
var tableModel = selection.tableModel;
if (!tableModel) return;
var selectArea = selection.getSelectArea();
var begin = selectArea.begin,
end = selectArea.end;
var isSingleTd = begin.row === end.row && begin.col === end.col;
var html = data.html,
text = data.text;
if (!html) return;
var editor = this.editor;
var schema = editor.schema,
conversion = editor.conversion;
var pasteHTML = new engine.Parser(html, editor).toValue(schema, conversion);
var element = helper.trimBlankSpan(engine.$(pasteHTML));
editor.nodeId.generateAll(element, true);
for (var _len8 = arguments.length, args = new Array(_len8 > 1 ? _len8 - 1 : 0), _key8 = 1; _key8 < _len8; _key8++) {
args[_key8 - 1] = arguments[_key8];
}
if (element.name === 'table') {
helper.normalizeTable(element);
var pasteTableModel = helper.getTableModel(element);
var rowCount = pasteTableModel.rows;
var colCount = pasteTableModel.cols;
var startCell = pasteTableModel.table[0][0];
var row = tableModel.table[begin.row];
if (!row) return;
var cell = row[begin.col];
if (!cell || helper.isEmptyModelCol(startCell) || helper.isEmptyModelCol(cell)) return;
var rowSpan = startCell.rowSpan,
colSpan = startCell.colSpan;
var isPasteSingle = rowSpan === rowCount && colSpan === colCount;
if (isPasteSingle && !selectArea && startCell.element) {
helper.copyTo(startCell.element, cell.element);
this.emit.apply(this, ['actioned', 'paste'].concat(args));
return;
} // 只在选中一个非合并单元格的时候才会延伸平铺,遇到表格边界会自动增加行列
// 若选中的是一个区域或合并单元格,则只要将区域中的单元格填充上数据即可
if (isSingleTd) {
if (colCount + begin.col > tableModel.cols) {
var insertColCount = colCount + begin.col - tableModel.cols;
this.insertCol('end', insertColCount, true);
}
if (rowCount + begin.row > tableModel.rows) {
var insertRowCount = rowCount + begin.row - tableModel.rows;
this.insertRow('end', insertRowCount, true);
} // 选中和将要粘贴表格等大的区域
selection.select(begin, {
row: begin.row + rowCount - 1,
col: begin.col + colCount - 1
});
}
var newArea = selection.getSelectArea(); // 先拆分单元格,拷贝的表格中可能有合并单元格,需要重新复制合并单元格情况
if (!args[0]) this.splitCell(true);
selection.each(function (tdModel, r, c) {
var paste_r = (r - newArea.begin.row) % rowCount;
var paste_c = (c - newArea.begin.col) % colCount;
var paste_td = pasteTableModel.table[paste_r][paste_c];
if (!paste_td) {
return;
}
if (!helper.isEmptyModelCol(paste_td) && paste_td.isMulti && !helper.isEmptyModelCol(tdModel)) {
var _element = tdModel.element;
_element.rowSpan = Math.min(paste_td.rowSpan, newArea.end.row - r + 1);
_element.colSpan = Math.min(paste_td.colSpan, newArea.end.col - c + 1);
helper.copyTo(paste_td.element, _element);
return;
}
if (helper.isEmptyModelCol(paste_td)) {
if (!helper.isEmptyModelCol(tdModel)) {
var _tdModel$element2;
(_tdModel$element2 = tdModel.element) === null || _tdModel$element2 === void 0 ? void 0 : _tdModel$element2.remove();
}
return;
}
if (paste_td.element) {
if (!helper.isEmptyModelCol(tdModel) && tdModel.element) helper.copyTo(paste_td.element, tdModel.element);
}
});
} else {
this.mergeCell(true);
}
this.emit.apply(this, ['actioned', 'paste'].concat(args));
}
}, {
key: "mergeCell",
value: function mergeCell() {
var _this$table13 = this.table,
selection = _this$table13.selection,
helper = _this$table13.helper;
var selectArea = selection.selectArea,
tableModel = selection.tableModel;
if (!selectArea || !tableModel) return;
var begin = selectArea.begin,
end = selectArea.end;
var row_count = end.row - begin.row + 1;
var col_count = end.col - begin.col + 1;
var content = [];
var mergeTd = null;
this.splitCell();
selection.select(begin, end);
selection.each(function (tdModel, r, c) {
if (helper.isEmptyModelCol(tdModel)) return;
if (c === begin.col && r === begin.row) {
mergeTd = tdModel.element;
mergeTd.rowSpan = row_count;
mergeTd.colSpan = col_count;
return;
}
if (tdModel.element) {
// 空单元格里面也有 html,只有在有实际内容时才会在合并的时候将内容合并
if (tdModel.element.innerText.trim() !== '') {
content.unshift(engine.$(tdModel.element).find(Template.TABLE_TD_CONTENT_CLASS).html());
}
tdModel.element.remove();
}
});
if (mergeTd) {
var tdNode = engine.$(mergeTd);
var contentNode = tdNode.find(Template.TABLE_TD_CONTENT_CLASS);
contentNode.html(contentNode.html() + content.join(''));
for (var _len9 = arguments.length, args = new Array(_len9), _key9 = 0; _key9 < _len9; _key9++) {
args[_key9] = arguments[_key9];
}
this.emit.apply(this, ['actioned', 'mergeCell'].concat(args));
}
}
}, {
key: "splitCell",
value: function splitCell() {
var _this7 = this;
var _this$table14 = this.table,
selection = _this$table14.selection,
helper = _this$table14.helper;
var tableModel = selection.tableModel;
if (!tableModel || !this.tableRoot) return;
var trs = this.tableRoot.find('tr');
selection.each(function (cell, row, col) {
if (helper.isEmptyModelCol(cell)) return;
var rows = row + cell.rowSpan;
var cols = col + cell.colSpan; // 注意这里用倒序,见 selection.each 方法的最后一个参数传的时 true
// 因为是倒序,所有空位一定先转换为 td, 这样在补齐切断的单元格时,需要考虑插入时的偏移量
for (var r = rows - 1; r >= row; r--) {
if (r >= trs.length) {
_this7.insertRowAt(row, 1);
}
var tr = r >= trs.length ? _this7.tableRoot.find('tr')[r] : trs[r];
for (var c = cols - 1; c >= col; c--) {
var tdModel = tableModel.table[r][c];
if (!helper.isEmptyModelCol(tdModel) && tdModel.isMulti) {
tdModel.element = tdModel.element;
tdModel.element.colSpan = 1;
tdModel.element.rowSpan = 1;
} else if (helper.isEmptyModelCol(tdModel)) {
var _insertIndex2 = selection.getCellIndex(r, c);
var _td2 = tr.insertCell(_insertIndex2);
_this7.editor.nodeId.generate(_td2);
_td2.setAttribute(engine.DATA_TRANSIENT_ATTRIBUTES, 'table-cell-selection');
_td2.innerHTML = _this7.table.template.getEmptyCell();
}
}
}
});
for (var _len10 = arguments.length, args = new Array(_len10), _key10 = 0; _key10 < _len10; _key10++) {
args[_key10] = arguments[_key10];
}
this.emit.apply(this, ['actioned', 'splitCell'].concat(args));
}
}]);
return TableCommand;
}(eventemitter2.EventEmitter2);
var Palette = /*#__PURE__*/_createClass(function Palette() {
_classCallCheck(this, Palette);
});
Palette.colors = void 0;
Palette._map = void 0;
Palette.getStroke = void 0;
Palette.getColors = void 0;
Palette.colors = [['#000000', '#262626', '#595959', '#8C8C8C', '#BFBFBF', '#D9D9D9', '#E9E9E9', '#F5F5F5', '#FAFAFA', '#FFFFFF'], ['#F5222D', '#FA541C', '#FA8C16', '#FADB14', '#52C41A', '#13C2C2', '#1890FF', '#2F54EB', '#722ED1', '#EB2F96'], ['#FFE8E6', '#FFECE0', '#FFEFD1', '#FCFCCA', '#E4F7D2', '#D3F5F0', '#D4EEFC', '#DEE8FC', '#EFE1FA', '#FAE1EB'], ['#FFA39E', '#FFBB96', '#FFD591', '#FFFB8F', '#B7EB8F', '#87E8DE', '#91D5FF', '#ADC6FF', '#D3ADF7', '#FFADD2'], ['#FF4D4F', '#FF7A45', '#FFA940', '#FFEC3D', '#73D13D', '#36CFC9', '#40A9FF', '#597EF7', '#9254DE', '#F759AB'], ['#CF1322', '#D4380D', '#D46B08', '#D4B106', '#389E0D', '#08979C', '#096DD9', '#1D39C4', '#531DAB', '#C41D7F'], ['#820014', '#871400', '#873800', '#614700', '#135200', '#00474F', '#003A8C', '#061178', '#22075E', '#780650']];
Palette._map = function () {
var map = {};
var colors = Palette.colors;
for (var i = 0, l1 = colors.length; i < l1; i++) {
var group = colors[i];
for (var k = 0, l2 = group.length; k < l2; k++) {
var color = colors[i][k];
map[color] = {
y: i,
x: k
};
}
}
return map;
}();
/**
* 获取描边颜色
* 默认为当前 color,浅色不明显区域:第 3 组、第 4 组的第 3、4 个用第 5 组的颜色描边
*
* @param {string} color 颜色
* @return {string} 描边颜色
*/
Palette.getStroke = function (color) {
var pos = Palette._map[color];
if (!pos) return color;
if (pos.y === 2 || pos.y === 3 && pos.x > 2 && pos.x < 5) {
return this.colors[4][pos.x];
}
return color;
};
Palette.getColors = function () {
return this.colors;
};
var _editor$1 = /*#__PURE__*/_classPrivateFieldLooseKey("editor");
var _options = /*#__PURE__*/_classPrivateFieldLooseKey("options");
var _color = /*#__PURE__*/_classPrivateFieldLooseKey("color");
var _button = /*#__PURE__*/_classPrivateFieldLooseKey("button");
var _cardId = /*#__PURE__*/_classPrivateFieldLooseKey("cardId");
var _container = /*#__PURE__*/_classPrivateFieldLooseKey("container");
var _position = /*#__PURE__*/_classPrivateFieldLooseKey("position");
var Color = /*#__PURE__*/function () {
function Color(editor, cardId, options) {
var _this = this;
_classCallCheck(this, Color);
Object.defineProperty(this, _editor$1, {
writable: true,
value: void 0
});
Object.defineProperty(this, _options, {
writable: true,
value: void 0
});
Object.defineProperty(this, _color, {
writable: true,
value: void 0
});
Object.defineProperty(this, _button, {
writable: true,
value: void 0
});
Object.defineProperty(this, _cardId, {
writable: true,
value: void 0
});
Object.defineProperty(this, _container, {
writable: true,
value: void 0
});
Object.defineProperty(this, _position, {
writable: true,
value: void 0
});
this.windowClick = function (event) {
var target = event.target;
if (!target) return;
if (engine.$(target).closest('.data-table-color-tool,.table-color-dropdown-arrow').length === 0) _this.remove();
};
_classPrivateFieldLooseBase(this, _editor$1)[_editor$1] = editor;
_classPrivateFieldLooseBase(this, _cardId)[_cardId] = cardId;
_classPrivateFieldLooseBase(this, _options)[_options] = options;
_classPrivateFieldLooseBase(this, _position)[_position] = new engine.Position(_classPrivateFieldLooseBase(this, _editor$1)[_editor$1]);
_classPrivateFieldLooseBase(this, _color)[_color] = options.defaultColor || 'transparent';
_classPrivateFieldLooseBase(this, _button)[_button] = engine.$("\n
\n \n \n \n \n \n \n \n
\n \n \n \n
"));
_classPrivateFieldLooseBase(this, _button)[_button].find('.table-color-dropdown-arrow').on('mousedown', function (event) {
event.preventDefault();
if (_classPrivateFieldLooseBase(_this, _container)[_container] !== undefined && _classPrivateFieldLooseBase(_this, _container)[_container].length > 0) {
_this.remove();
} else _this.render();
});
_classPrivateFieldLooseBase(this, _button)[_button].find('.table-color-dropdown-button-text').on('mousedown', function (event) {
event.preventDefault();
var onChange = _classPrivateFieldLooseBase(_this, _options)[_options].onChange;
if (onChange) onChange(_classPrivateFieldLooseBase(_this, _color)[_color]);
});
}
_createClass(Color, [{
key: "getButton",
value: function getButton() {
return _classPrivateFieldLooseBase(this, _button)[_button];
}
}, {
key: "select",
value: function select(color) {
var stroke = Palette.getStroke(color);
var rectElement = _classPrivateFieldLooseBase(this, _button)[_button].find('rect');
rectElement.attributes('stroke', stroke);
rectElement.attributes('fill', color);
_classPrivateFieldLooseBase(this, _button)[_button].find('svg').css('margin-bottom', color === 'transparent' ? -5 : -3);
}
}, {
key: "change",
value: function change(color) {
_classPrivateFieldLooseBase(this, _color)[_color] = color;
this.select(color);
var onChange = _classPrivateFieldLooseBase(this, _options)[_options].onChange;
if (onChange) onChange(color);
}
}, {
key: "toState",
value: function toState(color, oldHue) {
var _color$hex;
var c = (_color$hex = color.hex) !== null && _color$hex !== void 0 ? _color$hex : color;
if (c === 'transparent') {
c = 'rgba(0,0,0,0)';
}
var tinyColor = colord.colord(c);
var hsl = tinyColor.toHsl();
var hsv = tinyColor.toHsv();
var rgb = tinyColor.toRgb();
var hex = tinyColor.toHex();
if (hsl.s === 0) {
hsl.h = oldHue || 0;
hsv.h = oldHue || 0;
}
var transparent = hex === '000000' && rgb.a === 0;
return {
hsl: hsl,
hex: transparent ? 'transparent' : '#'.concat(hex),
rgb: rgb,
hsv: hsv,
oldHue: color['h'] || oldHue || hsl.h,
source: color['source']
};
}
}, {
key: "render",
value: function render() {
var _this2 = this,
_classPrivateFieldLoo;
_classPrivateFieldLooseBase(this, _container)[_container] = engine.$("
"));
var colorPanle = engine.$("
");
var colors = _classPrivateFieldLooseBase(this, _options)[_options].colors;
var getItem = function getItem(color, display) {
//接近白色的颜色,需要添加一个边框。不然看不见
var state = _this2.toState(color.color || '#FFFFFF');
var needBorder = ['#ffffff', '#fafafa', 'transparent'].indexOf(state.hex) >= 0;
var item = engine.$(" "));
item.on('mousedown', function (event) {
event.preventDefault();
event.stopPropagation();
colorPanle.find('svg').each(function (svg) {
svg.style.display = 'none';
});
if (display !== false) item.find('svg').css('display', 'block');
_this2.change(color.color);
});
return item;
};
var defaultItem = engine.$("
");
var item = getItem({
color: 'transparent'
}, false);
defaultItem.append(item);
defaultItem.on('mousedown', function (event) {
event.preventDefault();
colorPanle.find('svg').each(function (svg) {
svg.style.display = 'none';
});
_this2.change('transparent');
});
var nofillText = _classPrivateFieldLooseBase(this, _editor$1)[_editor$1].language.get('table', 'color', 'nonFillText');
defaultItem.append(engine.$("".concat(nofillText, " ")));
_classPrivateFieldLooseBase(this, _container)[_container].append(defaultItem);
colors.forEach(function (group) {
var groupElement = engine.$("
");
group.forEach(function (color) {
var item = getItem(color);
groupElement.append(item);
});
colorPanle.append(groupElement);
});
_classPrivateFieldLooseBase(this, _container)[_container].append(colorPanle);
(_classPrivateFieldLoo = _classPrivateFieldLooseBase(this, _position)[_position]) === null || _classPrivateFieldLoo === void 0 ? void 0 : _classPrivateFieldLoo.bind(_classPrivateFieldLooseBase(this, _container)[_container], _classPrivateFieldLooseBase(this, _button)[_button]);
document.addEventListener('mousedown', this.windowClick, true);
}
}, {
key: "remove",
value: function remove() {
var _classPrivateFieldLoo2, _classPrivateFieldLoo3;
(_classPrivateFieldLoo2 = _classPrivateFieldLooseBase(this, _container)[_container]) === null || _classPrivateFieldLoo2 === void 0 ? void 0 : _classPrivateFieldLoo2.remove();
(_classPrivateFieldLoo3 = _classPrivateFieldLooseBase(this, _position)[_position]) === null || _classPrivateFieldLoo3 === void 0 ? void 0 : _classPrivateFieldLoo3.destroy();
document.removeEventListener('mousedown', this.windowClick, true);
_classPrivateFieldLooseBase(this, _container)[_container] = undefined;
}
}, {
key: "destroy",
value: function destroy() {
this.remove();
var onDestroy = _classPrivateFieldLooseBase(this, _options)[_options].onDestroy;
if (onDestroy) onDestroy();
}
}]);
return Color;
}();
function styleInject(css, ref) {
if ( ref === void 0 ) ref = {};
var insertAt = ref.insertAt;
if (!css || typeof document === 'undefined') { return; }
var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');
style.type = 'text/css';
if (insertAt === 'top') {
if (head.firstChild) {
head.insertBefore(style, head.firstChild);
} else {
head.appendChild(style);
}
} else {
head.appendChild(style);
}
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
}
var css_248z = ".table-color-dropdown-trigger {\r\n display: flex;\r\n}\r\n\r\n.table-color-dropdown-trigger:hover {\r\n background: transparent !important;\r\n}\r\n\r\n.table-color-dropdown-trigger .table-color-dropdown-button-text, .table-color-dropdown-trigger .table-color-dropdown-arrow {\r\n display: inline-block;\r\n width: auto;\r\n margin: 0;\r\n text-align: center;\r\n background-color: transparent;\r\n border: 1px solid transparent;\r\n border-radius: 3px 3px;\r\n font-size: 16px;\r\n cursor: pointer;\r\n color: #595959;\r\n outline: none;\r\n margin-right: 0;\r\n min-width: 26px;\r\n border-radius: 3px 0 0 3px;\r\n padding: 0 4px;\r\n}\r\n\r\n.table-color-dropdown-trigger:hover .table-color-dropdown-button-text, .table-color-dropdown-trigger:hover .table-color-dropdown-arrow\r\n{\r\n border: 1px solid #e8e8e8;\r\n}\r\n\r\n.table-color-dropdown-trigger .table-color-dropdown-button-text:hover, .table-color-dropdown-trigger .table-color-dropdown-arrow:hover {\r\n background-color: #f5f5f5;\r\n}\r\n\r\n.table-color-dropdown-trigger .table-color-dropdown-arrow {\r\n margin-left: -1px;\r\n min-width: 17px;\r\n text-align: center;\r\n border-radius: 0 3px 3px 0;\r\n}\r\n\r\n.table-color-dropdown-trigger .table-color-dropdown-arrow .table-color-dropdown-empty {\r\n display: inline-block;\r\n}\r\n\r\n.table-color-dropdown-trigger .table-color-dropdown-arrow .data-icon-arrow {\r\n position: absolute;\r\n right: 5px;\r\n top: 12px;\r\n width: 8px;\r\n height: 8px;\r\n background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgd2lkdGg9IjhweCIgaGVpZ2h0PSI1cHgiIHZpZXdCb3g9IjAgMCA4IDUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+DQogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCA1Mi41ICg2NzQ2OSkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+DQogICAgPHRpdGxlPkdyb3VwIENvcHkgNjwvdGl0bGU+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGcgaWQ9IlN5bWJvbHMiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIG9wYWNpdHk9IjAuNDUiPg0KICAgICAgICA8ZyBpZD0idG9vbGJhciIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTMyOC4wMDAwMDAsIC0xOC4wMDAwMDApIj4NCiAgICAgICAgICAgIDxnIGlkPSJwYXJhZ3JhcGgtc3R5bGUiPg0KICAgICAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIyNi4wMDAwMDAsIDQuMDAwMDAwKSI+DQogICAgICAgICAgICAgICAgICAgIDxnIGlkPSJHcm91cC1Db3B5LTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMi4wMDAwMDAsIDEyLjAwMDAwMCkiPg0KICAgICAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IlJlY3RhbmdsZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjgiIGhlaWdodD0iOCI+PC9yZWN0Pg0KICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTAuNTk2MDkzNzUsMi41NTcwMzEyNSBMMy43NDUzMTI1LDYuMzc4MTI1IEMzLjg3NzM0Mzc1LDYuNTI1NzgxMjUgNC4xMDg1OTM3NSw2LjUyNTc4MTI1IDQuMjQwNjI1LDYuMzc4MTI1IEw3LjQwNTQ2ODc1LDIuNTU3MDMxMjUgQzcuNTk2MDkzNzUsMi4zNDI5Njg3NSA3LjQ0NDUzMTI1LDIuMDAzOTA2MjUgNy4xNTc4MTI1LDIuMDAzOTA2MjUgTDAuODQ0NTMxMjUsMi4wMDM5MDYyNSBDMC41NTcwMzEyNSwyLjAwMzkwNjI1IDAuNDA0Njg3NSwyLjM0Mjk2ODc1IDAuNTk2MDkzNzUsMi41NTcwMzEyNSBaIiBpZD0iU2hhcGUiIGZpbGw9IiMwMDAwMDAiIGZpbGwtcnVsZT0ibm9uemVybyI+PC9wYXRoPg0KICAgICAgICAgICAgICAgICAgICA8L2c+DQogICAgICAgICAgICAgICAgPC9nPg0KICAgICAgICAgICAgPC9nPg0KICAgICAgICA8L2c+DQogICAgPC9nPg0KPC9zdmc+);\r\n background-repeat: no-repeat;\r\n transition: all 0.25s cubic-bezier(0.3, 1.2, 0.2, 1);\r\n}\r\n\r\n.data-table-color-tool {\r\n outline: none;\r\n width: auto;\r\n border-radius: 3px 3px;\r\n position: absolute;\r\n border: 1px solid #e8e8e8;\r\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);\r\n z-index: 130;\r\n text-indent: 0;\r\n top:0;\r\n padding: 8px 0;\r\n background: #fff;\r\n}\r\n\r\n.data-table-color-tool-mobile {\r\n width: calc(100vw - 20px);\r\n}\r\n\r\n.data-table-color-tool .data-table-color-tool-panle {\r\n position: relative;\r\n text-align: left;\r\n text-indent: 0;\r\n width: 100%;\r\n height: auto;\r\n margin-top: 8px;\r\n padding: 0 8px;\r\n}\r\n\r\n.data-table-color-tool .data-table-color-tool-group\r\n{\r\n display: flex;\r\n}\r\n\r\n.data-table-color-tool .data-table-color-tool-group > span {\r\n width: 24px;\r\n height: 24px;\r\n display: inline-block;\r\n cursor: pointer;\r\n background-color: rgb(255, 255, 255);\r\n padding: 2px;\r\n border-radius: 3px;\r\n border-width: 1px;\r\n border-style: solid;\r\n border-color: transparent;\r\n -o-border-image: initial;\r\n border-image: initial;\r\n flex: 0 0 auto;\r\n position: relative;\r\n}\r\n\r\n.data-table-color-tool span.data-table-color-tool-border > span {\r\n border: 1px solid #e8e8e8 !important;\r\n}\r\n\r\n.data-table-color-tool .data-table-color-tool-group > span > span\r\n{\r\n position: relative;\r\n width: 18px;\r\n height: 18px;\r\n display: block;\r\n border-radius: 2px;\r\n border-width: 1px;\r\n border-style: solid;\r\n border-color: transparent;\r\n -o-border-image: initial;\r\n border-image: initial;\r\n}\r\n\r\n.data-table-color-tool .data-table-color-tool-group > span > span > svg {\r\n position: absolute;\r\n top: -1px;\r\n left: 1px;\r\n width: 12px;\r\n height: 12px;\r\n}\r\n\r\n.data-table-color-tool .data-table-color-tool-default {\r\n display: flex;\r\n align-items: center;\r\n margin: 2px 0 8px;\r\n border-radius: 2px;\r\n cursor: pointer;\r\n padding: 2px 8px;\r\n} \r\n\r\n.data-table-color-tool .data-table-color-tool-default:hover {\r\n background: #f5f5f5;\r\n}\r\n\r\n.data-table-color-tool .data-table-color-tool-default > span:first-child::after {\r\n content: \"\";\r\n display: block;\r\n position: absolute;\r\n top: 10px;\r\n left: 0px;\r\n width: 22px;\r\n height: 0;\r\n border-bottom: 2px solid #ff5151;\r\n transform: rotate(45deg);\r\n}\r\n\r\n.data-table-color-tool .data-table-color-tool-default .data-table-color-tool-default-text {\r\n width: auto;\r\n margin-left: 8px;\r\n height: auto;\r\n background: transparent;\r\n}";
styleInject(css_248z);
var _changeTimeout = /*#__PURE__*/_classPrivateFieldLooseKey("changeTimeout");
var TableComponent = /*#__PURE__*/function (_Card) {
_inherits(TableComponent, _Card);
var _super = _createSuper(TableComponent);
function TableComponent(options) {
var _thisSuper, _this;
_classCallCheck(this, TableComponent);
_this = _super.call(this, options);
_this.contenteditable = ["div".concat(Template.TABLE_TD_CONTENT_CLASS)];
_this.colMinWidth = void 0;
_this.rowMinHeight = void 0;
_this.maxInsertNum = void 0;
_this.wrapper = void 0;
_this.helper = void 0;
_this.template = void 0;
_this.selection = void 0;
_this.conltrollBar = void 0;
_this.command = void 0;
_this.scrollbar = void 0;
_this.viewport = void 0;
_this.colorTool = void 0;
_this.noBorderToolButton = void 0;
_this.alignToolButton = void 0;
_this.enableScroll = void 0;
Object.defineProperty(_assertThisInitialized(_this), _changeTimeout, {
writable: true,
value: void 0
});
_this.getOptions = function () {
var _this$editor$plugin$f;
return (_this$editor$plugin$f = _this.editor.plugin.findPlugin('table')) === null || _this$editor$plugin$f === void 0 ? void 0 : _this$editor$plugin$f.options;
};
_this.doChange = function () {
_this.remoteRefresh();
_this.handleChange('local');
};
_this.handleChange = function () {
var _this$noBorderToolBut2;
var trigger = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'local';
var editor = _this.editor;
_this.conltrollBar.refresh();
_this.selection.render('change');
var oldValue = _get((_thisSuper = _assertThisInitialized(_this), _getPrototypeOf(TableComponent.prototype)), "getValue", _thisSuper).call(_thisSuper);
if (oldValue === null || oldValue === void 0 ? void 0 : oldValue.noBorder) {
var _this$noBorderToolBut;
(_this$noBorderToolBut = _this.noBorderToolButton) === null || _this$noBorderToolBut === void 0 ? void 0 : _this$noBorderToolBut.addClass('active');
} else (_this$noBorderToolBut2 = _this.noBorderToolButton) === null || _this$noBorderToolBut2 === void 0 ? void 0 : _this$noBorderToolBut2.removeClass('active');
if (trigger === 'local' && engine.isEngine(editor)) {
var value = _this.getValue();
if (value) _this.setValue(value);
}
};
_this.onChange = function () {
var trigger = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'local';
var editor = _this.editor;
if (engine.isEngine(editor) && trigger === 'local' && editor.model.mutation.isStopped) return;
if (_classPrivateFieldLooseBase(_assertThisInitialized(_this), _changeTimeout)[_changeTimeout]) clearTimeout(_classPrivateFieldLooseBase(_assertThisInitialized(_this), _changeTimeout)[_changeTimeout]);
_classPrivateFieldLooseBase(_assertThisInitialized(_this), _changeTimeout)[_changeTimeout] = setTimeout(function () {
_this.handleChange(trigger);
if (trigger === 'remote') {
_this.remoteRefresh();
}
}, 50);
};
_this.updateScrollbar = function () {
var _this$wrapper, _this$wrapper$getBoun, _this$wrapper2, _this$wrapper3;
if (!_this.scrollbar || !_this.enableScroll) return;
var hideHeight = (((_this$wrapper = _this.wrapper) === null || _this$wrapper === void 0 ? void 0 : (_this$wrapper$getBoun = _this$wrapper.getBoundingClientRect()) === null || _this$wrapper$getBoun === void 0 ? void 0 : _this$wrapper$getBoun.bottom) || 0) - (((_this$wrapper2 = _this.wrapper) === null || _this$wrapper2 === void 0 ? void 0 : _this$wrapper2.getViewport().bottom) || 0);
(_this$wrapper3 = _this.wrapper) === null || _this$wrapper3 === void 0 ? void 0 : _this$wrapper3.find('.data-scrollbar-x').css({
bottom: "".concat(hideHeight > 0 ? hideHeight + 2 : 0, "px")
});
};
_this.remoteRefreshTimeout = null;
var pluginOptions = _this.getOptions();
_this.colMinWidth = (pluginOptions === null || pluginOptions === void 0 ? void 0 : pluginOptions.colMinWidth) || 40;
_this.rowMinHeight = (pluginOptions === null || pluginOptions === void 0 ? void 0 : pluginOptions.rowMinHeight) || 35;
_this.maxInsertNum = (pluginOptions === null || pluginOptions === void 0 ? void 0 : pluginOptions.maxInsertNum) || 30;
_this.helper = new Helper(_this.editor);
_this.template = new Template(_assertThisInitialized(_this));
_this.selection = new TableSelection(_this.editor, _assertThisInitialized(_this));
_this.conltrollBar = new ControllBar(_this.editor, _assertThisInitialized(_this), {
col_min_width: _this.colMinWidth,
row_min_height: _this.rowMinHeight,
max_insert_num: _this.maxInsertNum
});
_this.command = new TableCommand(_this.editor, _assertThisInitialized(_this));
_this.enableScroll = (pluginOptions === null || pluginOptions === void 0 ? void 0 : pluginOptions.enableScroll) !== false;
return _this;
}
_createClass(TableComponent, [{
key: "init",
value: function init() {
var _this2 = this,
_get$call;
_get(_getPrototypeOf(TableComponent.prototype), "init", this).call(this);
var editor = this.editor;
if (engine.isEngine(editor)) {
// tab 键选择
if (!editor.event.listeners['keydown:tab']) editor.event.listeners['keydown:tab'] = [];
editor.event.listeners['keydown:tab'].unshift(function (event) {
if (!engine.isEngine(editor) || editor.readonly) return;
var change = editor.change,
block = editor.block,
node = editor.node,
card = editor.card;
var range = change.range.get();
var td = range.endNode.closest('td');
if (td.length === 0 || !td.inEditor()) return;
var component = card.closest(td, true);
if (!(component === null || component === void 0 ? void 0 : component.equal(_this2.root))) return;
var closestBlock = block.closest(range.endNode);
if (td.length > 0 && (block.isLastOffset(range, 'end') || closestBlock.name !== 'li' && node.isEmptyWidthChild(closestBlock))) {
var next = td.next();
if (!next) {
var _td$parent;
var nextRow = (_td$parent = td.parent()) === null || _td$parent === void 0 ? void 0 : _td$parent.next(); // 最后一行,最后一列
if (!nextRow) {
var _td$parent2, _td$parent2$next;
// 新建一行
_this2.command.insertRowDown();
next = ((_td$parent2 = td.parent()) === null || _td$parent2 === void 0 ? void 0 : (_td$parent2$next = _td$parent2.next()) === null || _td$parent2$next === void 0 ? void 0 : _td$parent2$next.find('td:first-child')) || null;
} else {
next = nextRow.find('td:first-child') || null;
}
}
if (next) {
event.preventDefault();
_this2.selection.focusCell(next);
return false;
}
}
if (td.length > 0 && _this2.enableScroll) {
setTimeout(function () {
var _this2$scrollbar;
(_this2$scrollbar = _this2.scrollbar) === null || _this2$scrollbar === void 0 ? void 0 : _this2$scrollbar.refresh();
}, 0);
}
return;
}); // 下键选择
editor.on('keydown:down', function (event) {
if (!engine.isEngine(editor) || editor.readonly) return;
var change = editor.change,
card = editor.card;
var range = change.range.get();
var td = range.endNode.closest('td');
if (td.length === 0 || !td.inEditor()) return;
var component = card.closest(td, true);
if (!(component === null || component === void 0 ? void 0 : component.equal(_this2.root))) return;
var contentElement = td.find('.table-main-content');
if (!contentElement) return;
var tdRect = contentElement.get().getBoundingClientRect();
var rangeRect = range.getBoundingClientRect();
if (td.length > 0 && (rangeRect.bottom === 0 || tdRect.bottom - rangeRect.bottom < 10)) {
var _td$parent3;
var index = td.index();
var nextRow = (_td$parent3 = td.parent()) === null || _td$parent3 === void 0 ? void 0 : _td$parent3.next();
if (nextRow) {
var _this2$selection$tabl;
var nextIndex = 0;
var nextTd = nextRow.find('td:last-child');
(_this2$selection$tabl = _this2.selection.tableModel) === null || _this2$selection$tabl === void 0 ? void 0 : _this2$selection$tabl.table[nextRow.index()].some(function (cell) {
if (!_this2.helper.isEmptyModelCol(cell) && nextIndex >= index && cell.element) {
nextTd = engine.$(cell.element);
return true;
}
nextIndex++;
return false;
});
if (nextTd) {
event.preventDefault();
_this2.selection.focusCell(nextTd, true);
return false;
}
} else {
event.preventDefault();
var cloneRange = range.cloneRange();
var next = _this2.root.next();
var cardComponent = next ? card.find(next) : undefined;
if (cardComponent === null || cardComponent === void 0 ? void 0 : cardComponent.onSelectDown) {
cardComponent.onSelectDown(event);
} else {
card.focusNextBlock(_this2, cloneRange, false);
change.range.select(cloneRange);
}
return false;
}
}
if (td.length > 0 && _this2.enableScroll) {
setTimeout(function () {
var _this2$scrollbar2;
(_this2$scrollbar2 = _this2.scrollbar) === null || _this2$scrollbar2 === void 0 ? void 0 : _this2$scrollbar2.refresh();
}, 0);
}
return;
}); // 上键选择
editor.on('keydown:up', function (event) {
if (!engine.isEngine(editor) || editor.readonly) return;
var change = editor.change,
card = editor.card;
var range = change.range.get();
var td = range.endNode.closest('td');
if (td.length === 0 || !td.inEditor()) return;
var component = card.closest(td, true);
if (!(component === null || component === void 0 ? void 0 : component.equal(_this2.root))) return;
var contentElement = td.find('.table-main-content');
if (!contentElement) return;
var tdRect = contentElement.get().getBoundingClientRect();
var rangeRect = range.getBoundingClientRect();
if (td.length > 0 && (rangeRect.top === 0 || rangeRect.top - tdRect.top < 10)) {
var _td$parent4;
var index = td.index();
var prevRow = (_td$parent4 = td.parent()) === null || _td$parent4 === void 0 ? void 0 : _td$parent4.prev();
if (prevRow) {
var _this2$selection$tabl2;
var prevIndex = 0;
var prevTd = prevRow.find('td:first-child');
(_this2$selection$tabl2 = _this2.selection.tableModel) === null || _this2$selection$tabl2 === void 0 ? void 0 : _this2$selection$tabl2.table[prevRow.index()].some(function (cell) {
if (!_this2.helper.isEmptyModelCol(cell) && prevIndex >= index && cell.element) {
prevTd = engine.$(cell.element);
return true;
}
prevIndex++;
return false;
});
if (prevTd) {
event.preventDefault();
_this2.selection.focusCell(prevTd);
return false;
}
} else {
event.preventDefault();
var cloneRange = range.cloneRange();
var prev = _this2.root.prev();
var cardComponent = prev ? card.find(prev) : undefined;
if (cardComponent === null || cardComponent === void 0 ? void 0 : cardComponent.onSelectUp) {
cardComponent.onSelectUp(event);
} else {
card.focusPrevBlock(_this2, cloneRange, false);
change.range.select(cloneRange);
}
return false;
}
}
if (td.length > 0 && _this2.enableScroll) {
setTimeout(function () {
var _this2$scrollbar3;
(_this2$scrollbar3 = _this2.scrollbar) === null || _this2$scrollbar3 === void 0 ? void 0 : _this2$scrollbar3.refresh();
}, 0);
}
return;
}); // 左键选择
editor.on('keydown:left', function () {
if (!engine.isEngine(editor) || editor.readonly) return;
var change = editor.change,
card = editor.card;
var range = change.range.get();
var td = range.endNode.closest('td');
if (td.length === 0 || !td.inEditor()) return;
var component = card.closest(td, true);
if (!(component === null || component === void 0 ? void 0 : component.equal(_this2.root))) return;
var contentElement = td.find('.table-main-content');
if (!contentElement) return;
if (td.length > 0 && _this2.enableScroll) {
setTimeout(function () {
var _this2$scrollbar4;
(_this2$scrollbar4 = _this2.scrollbar) === null || _this2$scrollbar4 === void 0 ? void 0 : _this2$scrollbar4.refresh();
}, 0);
}
}); // 右键选择
editor.on('keydown:right', function () {
if (!engine.isEngine(editor) || editor.readonly) return;
var change = editor.change,
card = editor.card;
var range = change.range.get();
var td = range.endNode.closest('td');
if (td.length === 0 || !td.inEditor()) return;
var component = card.closest(td, true);
if (!(component === null || component === void 0 ? void 0 : component.equal(_this2.root))) return;
var contentElement = td.find('.table-main-content');
if (!contentElement) return;
if (td.length > 0 && _this2.enableScroll) {
setTimeout(function () {
var _this2$scrollbar5;
(_this2$scrollbar5 = _this2.scrollbar) === null || _this2$scrollbar5 === void 0 ? void 0 : _this2$scrollbar5.refresh();
}, 0);
}
});
}
if (this.colorTool) return;
this.colorTool = new Color(editor, this.id, {
colors: TableComponent.colors,
defaultColor: (_get$call = _get(_getPrototypeOf(TableComponent.prototype), "getValue", this).call(this)) === null || _get$call === void 0 ? void 0 : _get$call.color,
onChange: function onChange(color) {
_this2.conltrollBar.drawBackgroundColor(color);
var value = _this2.getValue();
_this2.setValue(_objectSpread2(_objectSpread2({}, value), {}, {
color: color
}));
}
});
}
}, {
key: "toolbar",
value: function toolbar() {
var _this3 = this;
var editor = this.editor;
var getItems = function getItems() {
var _get$call2, _this3$wrapper2;
if (!engine.isEngine(editor) || editor.readonly) return [{
key: 'maximize',
type: 'maximize'
}];
var language = editor.language.get('table');
var funBtns = [{
key: 'color',
type: 'node',
title: editor.language.get('table', 'color', 'title'),
node: _this3.colorTool.getButton()
}, {
key: 'border',
type: 'button',
title: ((_get$call2 = _get(_getPrototypeOf(TableComponent.prototype), "getValue", _this3).call(_this3)) === null || _get$call2 === void 0 ? void 0 : _get$call2.noBorder) ? language['showBorder'] : language['noBorder'],
content: ' ',
didMount: function didMount(node) {
var value = _get(_getPrototypeOf(TableComponent.prototype), "getValue", _this3).call(_this3);
if ((value === null || value === void 0 ? void 0 : value.noBorder) === true) {
node.addClass('active');
}
_this3.noBorderToolButton = node;
},
onClick: function onClick(_, node) {
var _this3$wrapper;
var value = _get(_getPrototypeOf(TableComponent.prototype), "getValue", _this3).call(_this3);
_this3.setValue({
noBorder: !(value === null || value === void 0 ? void 0 : value.noBorder)
});
var table = (_this3$wrapper = _this3.wrapper) === null || _this3$wrapper === void 0 ? void 0 : _this3$wrapper.find('.data-table');
if ((value === null || value === void 0 ? void 0 : value.noBorder) === true) {
table === null || table === void 0 ? void 0 : table.removeAttributes('data-table-no-border');
node.removeClass('active');
} else {
table === null || table === void 0 ? void 0 : table.attributes('data-table-no-border', 'true');
node.addClass('active');
}
}
}, {
key: 'align',
type: 'dropdown',
content: ' ',
title: language['verticalAlign']['title'],
didMount: function didMount(node) {
_this3.alignToolButton = node.find('.data-toolbar-btn');
},
items: [{
type: 'button',
content: " ".concat(language['verticalAlign']['top']),
onClick: function onClick(event) {
return _this3.updateAlign(event, 'top');
}
}, {
type: 'button',
content: " ".concat(language['verticalAlign']['middle']),
onClick: function onClick(event) {
return _this3.updateAlign(event, 'middle');
}
}, {
type: 'button',
content: " ".concat(language['verticalAlign']['bottom']),
onClick: function onClick(event) {
return _this3.updateAlign(event, 'bottom');
}
}]
}, {
key: 'merge',
type: 'button',
title: language['mergeCell'],
content: ' ',
disabled: _this3.conltrollBar.getMenuDisabled('mergeCell'),
onClick: function onClick() {
_this3.command.mergeCell();
}
}, {
key: 'split',
type: 'button',
title: language['splitCell'],
content: ' ',
disabled: _this3.conltrollBar.getMenuDisabled('splitCell'),
onClick: function onClick() {
_this3.command.splitCell();
}
}];
if (_this3.isMaximize) return funBtns;
var toolbars = [{
key: 'maximize',
type: 'maximize'
}, {
key: 'copy',
type: 'copy',
onClick: function onClick() {
_this3.command.copy(true);
editor.messageSuccess('copy', editor.language.get('copy', 'success'));
}
}, {
key: 'delete',
type: 'delete'
}, {
key: 'separator',
type: 'separator'
}].concat(funBtns);
if (engine.removeUnit(((_this3$wrapper2 = _this3.wrapper) === null || _this3$wrapper2 === void 0 ? void 0 : _this3$wrapper2.css('margin-left')) || '0') === 0) {
toolbars.unshift({
key: 'dnd',
type: 'dnd'
});
}
return toolbars;
};
var options = this.getOptions();
if (options === null || options === void 0 ? void 0 : options.cardToolbars) {
return options.cardToolbars(getItems(), this.editor);
}
return getItems();
}
}, {
key: "onSelectLeft",
value: function onSelectLeft(event) {
var tableModel = this.selection.tableModel;
if (!tableModel) return;
for (var r = tableModel.rows - 1; r >= 0; r--) {
for (var c = tableModel.cols - 1; c >= 0; c--) {
var cell = tableModel.table[r][c];
if (!this.helper.isEmptyModelCol(cell) && cell.element) {
event.preventDefault();
this.selection.focusCell(cell.element, false);
return false;
}
}
}
return;
}
}, {
key: "onSelectRight",
value: function onSelectRight(event) {
var tableModel = this.selection.tableModel;
if (!tableModel) return;
for (var r = 0; r < tableModel.rows; r++) {
for (var c = 0; c < tableModel.cols; c++) {
var cell = tableModel.table[r][c];
if (!this.helper.isEmptyModelCol(cell) && cell.element) {
event.preventDefault();
this.selection.focusCell(cell.element);
return false;
}
}
}
return;
}
}, {
key: "onSelectUp",
value: function onSelectUp(event) {
var tableModel = this.selection.tableModel;
if (!tableModel) return;
for (var r = tableModel.rows - 1; r >= 0; r--) {
for (var c = 0; c < tableModel.cols; c++) {
var cell = tableModel.table[r][c];
if (!this.helper.isEmptyModelCol(cell) && cell.element) {
event.preventDefault();
this.selection.focusCell(cell.element, false);
return false;
}
}
}
return;
}
}, {
key: "onSelectDown",
value: function onSelectDown(event) {
var tableModel = this.selection.tableModel;
if (!tableModel) return;
for (var r = 0; r < tableModel.rows; r++) {
for (var c = 0; c < tableModel.cols; c++) {
var cell = tableModel.table[r][c];
if (!this.helper.isEmptyModelCol(cell) && cell.element) {
event.preventDefault();
this.selection.focusCell(cell.element);
return false;
}
}
}
return;
}
}, {
key: "updateAlign",
value: function updateAlign(event) {
var align = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'top';
event.preventDefault();
this.conltrollBar.setAlign(align);
this.onChange('local');
this.updateAlignText(align);
}
}, {
key: "updateAlignText",
value: function updateAlignText() {
var _this$alignToolButton;
var align = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'top';
var alignHtml = " ");
(_this$alignToolButton = this.alignToolButton) === null || _this$alignToolButton === void 0 ? void 0 : _this$alignToolButton.html(alignHtml);
}
}, {
key: "getValue",
value: function getValue() {
var value = _get(_getPrototypeOf(TableComponent.prototype), "getValue", this).call(this);
if (!this.wrapper) return value;
var tableRoot = this.wrapper.find(Template.TABLE_CLASS);
if (!tableRoot) return value;
var tableModel = this.selection.tableModel;
if (!tableModel) return value;
var editor = this.editor;
var schema = editor.schema,
conversion = editor.conversion;
var container = engine.$('
');
container.append(tableRoot.clone(true));
var parser = new engine.Parser(container, editor, function (node) {
node.find(Template.TABLE_TD_BG_CLASS).remove();
node.find(engine.EDITABLE_SELECTOR).each(function (root) {
if (root.nodeName === 'TD') {
engine.$(root).removeAttributes(engine.DATA_ELEMENT);
} else editor.node.unwrap(engine.$(root));
});
});
var rows = tableModel.rows,
cols = tableModel.cols,
height = tableModel.height,
width = tableModel.width;
var html = parser.toValue(schema, conversion, false, false);
if (!engine.isEngine(editor)) return _objectSpread2(_objectSpread2({}, value), {}, {
html: html
});
return _objectSpread2(_objectSpread2({}, value), {}, {
rows: rows,
cols: cols,
height: height,
width: width,
html: html
});
}
}, {
key: "drawBackground",
value: function drawBackground(node, range) {
var _this$viewport, _this$editor$root$get;
var backgroundRect = node.get().getBoundingClientRect();
var domRect = new DOMRect(backgroundRect.x, backgroundRect.y, 0, 0);
var startContainer = range.startContainer,
endContainer = range.endContainer;
var startElement = engine.closest(startContainer, 'td');
var endElement = engine.closest(endContainer, 'td');
if (!(startElement instanceof Element) || !(endElement instanceof Element) || startElement.nodeName !== 'TD' || (endElement === null || endElement === void 0 ? void 0 : endElement.nodeName) !== 'TD' || startElement === endElement) return;
var startRect = startElement.getBoundingClientRect();
var endRect = endElement.getBoundingClientRect();
var viewportRect = (_this$viewport = this.viewport) === null || _this$viewport === void 0 ? void 0 : _this$viewport.getBoundingClientRect();
var vLeft = ((viewportRect === null || viewportRect === void 0 ? void 0 : viewportRect.left) || 0) + (this.activated ? 13 : 0);
domRect.x = Math.max(startRect.left - backgroundRect.left, vLeft - (((_this$editor$root$get = this.editor.root.getBoundingClientRect()) === null || _this$editor$root$get === void 0 ? void 0 : _this$editor$root$get.left) || 0));
domRect.y = startRect.top - backgroundRect.top;
domRect.width = (viewportRect ? Math.min(endRect.right, viewportRect.right) : endRect.right) - startRect.left;
domRect.height = startRect.bottom - startRect.top;
if (domRect.width < 0) domRect.width = 0;
domRect.height = endRect.bottom - startRect.top;
return domRect;
}
}, {
key: "activate",
value: function activate(activated) {
var _this$scrollbar;
_get(_getPrototypeOf(TableComponent.prototype), "activate", this).call(this, activated);
if (activated) {
var _this$wrapper4;
this.conltrollBar.refresh();
(_this$wrapper4 = this.wrapper) === null || _this$wrapper4 === void 0 ? void 0 : _this$wrapper4.addClass('active');
} else {
var _this$wrapper5;
this.selection.clearSelect();
this.conltrollBar.hideContextMenu();
(_this$wrapper5 = this.wrapper) === null || _this$wrapper5 === void 0 ? void 0 : _this$wrapper5.removeClass('active');
}
if (this.enableScroll) (_this$scrollbar = this.scrollbar) === null || _this$scrollbar === void 0 ? void 0 : _this$scrollbar.refresh();
}
}, {
key: "maximize",
value: function maximize() {
var _this$scrollbar2;
_get(_getPrototypeOf(TableComponent.prototype), "maximize", this).call(this);
if (this.enableScroll) (_this$scrollbar2 = this.scrollbar) === null || _this$scrollbar2 === void 0 ? void 0 : _this$scrollbar2.refresh();
var editor = this.editor;
if (engine.isEngine(editor) && !engine.isMobile) {
this.getCenter().on('scroll', this.updateScrollbar, {
passive: true
});
}
}
}, {
key: "minimize",
value: function minimize() {
var _this$scrollbar3;
_get(_getPrototypeOf(TableComponent.prototype), "minimize", this).call(this);
if (this.enableScroll) (_this$scrollbar3 = this.scrollbar) === null || _this$scrollbar3 === void 0 ? void 0 : _this$scrollbar3.refresh();
this.getCenter().off('scroll', this.updateScrollbar);
}
}, {
key: "getSelectionNodes",
value: function getSelectionNodes() {
var _this4 = this;
var nodes = [];
this.selection.each(function (cell) {
if (!_this4.helper.isEmptyModelCol(cell) && cell.element) {
nodes.push(engine.$(cell.element).find(engine.EDITABLE_SELECTOR));
}
}); // 如果值选中了一个单元格,并且不是拖蓝方式选中就返回空的
if (nodes.length === 1 && nodes[0].closest('[table-cell-selection=true]').length === 0) return [];
return nodes;
}
}, {
key: "overflow",
value: function overflow(max) {
var _this$wrapper6, _this$wrapper6$find;
if (!this.enableScroll) return; // 表格宽度
var tableWidth = ((_this$wrapper6 = this.wrapper) === null || _this$wrapper6 === void 0 ? void 0 : (_this$wrapper6$find = _this$wrapper6.find('.data-table')) === null || _this$wrapper6$find === void 0 ? void 0 : _this$wrapper6$find.width()) || 0;
var rootWidth = this.getCenter().width(); // 溢出的宽度
var overflowWidth = tableWidth - rootWidth;
if (overflowWidth > 0 && !this.isMaximize) {
var _this$wrapper7;
(_this$wrapper7 = this.wrapper) === null || _this$wrapper7 === void 0 ? void 0 : _this$wrapper7.css('margin-right', "-".concat(overflowWidth > max ? max : overflowWidth, "px"));
} else if (overflowWidth < 0 || this.isMaximize) {
var _this$wrapper8;
(_this$wrapper8 = this.wrapper) === null || _this$wrapper8 === void 0 ? void 0 : _this$wrapper8.css('margin-right', '');
}
}
}, {
key: "initScrollbar",
value: function initScrollbar() {
var _this5 = this,
_this$scrollbar4,
_this$scrollbar5,
_this$scrollbar6;
if (!this.viewport) return;
var editor = this.editor;
var tablePlugin = editor.plugin.findPlugin('table');
var tableOptions = (tablePlugin === null || tablePlugin === void 0 ? void 0 : tablePlugin.options.overflow) || {};
var overflowLeftConfig = tableOptions.maxLeftWidth ? {
onScrollX: function onScrollX(x) {
var _this5$wrapper;
if (_this5.isMaximize) x = 0;
var max = tableOptions.maxLeftWidth();
(_this5$wrapper = _this5.wrapper) === null || _this5$wrapper === void 0 ? void 0 : _this5$wrapper.css('margin-left', "-".concat(x > max ? max : x, "px"));
if (x > 0) {
editor.root.find('.data-card-dnd').hide();
} else {
editor.root.find('.data-card-dnd').show();
}
return x - max;
},
getScrollLeft: function getScrollLeft(left) {
var _this5$wrapper2;
return left - engine.removeUnit(((_this5$wrapper2 = _this5.wrapper) === null || _this5$wrapper2 === void 0 ? void 0 : _this5$wrapper2.css('margin-left')) || '0');
},
getOffsetWidth: function getOffsetWidth(width) {
var _this5$wrapper3;
return width + engine.removeUnit(((_this5$wrapper3 = _this5.wrapper) === null || _this5$wrapper3 === void 0 ? void 0 : _this5$wrapper3.css('margin-left')) || '0');
}
} : undefined;
if (this.enableScroll) {
this.scrollbar = new engine.Scrollbar(this.viewport, true, false, true, overflowLeftConfig);
}
(_this$scrollbar4 = this.scrollbar) === null || _this$scrollbar4 === void 0 ? void 0 : _this$scrollbar4.setContentNode(this.viewport.find('.data-table'));
(_this$scrollbar5 = this.scrollbar) === null || _this$scrollbar5 === void 0 ? void 0 : _this$scrollbar5.on('display', function (display) {
if (display === 'block') {
var _this5$wrapper4;
(_this5$wrapper4 = _this5.wrapper) === null || _this5$wrapper4 === void 0 ? void 0 : _this5$wrapper4.addClass('scrollbar-show');
} else {
var _this5$wrapper5;
(_this5$wrapper5 = _this5.wrapper) === null || _this5$wrapper5 === void 0 ? void 0 : _this5$wrapper5.removeClass('scrollbar-show');
}
}); //this.scrollbar.disableScroll();
var prevScrollData = {
x: 0,
y: 0
};
var handleScrollbarChange = function handleScrollbarChange(_ref) {
var x = _ref.x,
y = _ref.y;
if (tableOptions['maxRightWidth']) _this5.overflow(tableOptions['maxRightWidth']());
if (prevScrollData.x === x && prevScrollData.y === y) return;
prevScrollData = {
x: x,
y: y
};
if (engine.isEngine(editor)) {
editor.trigger('scroll', _this5.root, {
x: x,
y: y
});
_this5.conltrollBar.refresh();
}
};
(_this$scrollbar6 = this.scrollbar) === null || _this$scrollbar6 === void 0 ? void 0 : _this$scrollbar6.on('change', handleScrollbarChange);
if (!engine.isMobile) window.addEventListener('scroll', this.updateScrollbar, {
passive: true
});
window.addEventListener('resize', this.updateScrollbar);
if (engine.isEngine(editor) && !engine.isMobile) {
var _editor$scrollNode;
(_editor$scrollNode = editor.scrollNode) === null || _editor$scrollNode === void 0 ? void 0 : _editor$scrollNode.on('scroll', this.updateScrollbar, {
passive: true
});
}
}
}, {
key: "didRender",
value: function didRender() {
var _this$wrapper9,
_this$wrapper10,
_this$toolbarModel,
_this$toolbarModel2,
_this6 = this,
_this$wrapper11;
_get(_getPrototypeOf(TableComponent.prototype), "didRender", this).call(this);
var editor = this.editor;
editor.on('undo', this.doChange);
editor.on('redo', this.doChange);
this.viewport = engine.isEngine(editor) ? (_this$wrapper9 = this.wrapper) === null || _this$wrapper9 === void 0 ? void 0 : _this$wrapper9.find(Template.VIEWPORT) : (_this$wrapper10 = this.wrapper) === null || _this$wrapper10 === void 0 ? void 0 : _this$wrapper10.find(Template.VIEWPORT_READER);
this.selection.init();
this.conltrollBar.init();
this.command.init();
if (!engine.isEngine(editor) || editor.readonly) (_this$toolbarModel = this.toolbarModel) === null || _this$toolbarModel === void 0 ? void 0 : _this$toolbarModel.setOffset([0, 0]);else (_this$toolbarModel2 = this.toolbarModel) === null || _this$toolbarModel2 === void 0 ? void 0 : _this$toolbarModel2.setOffset([13, -28, 0, -6]);
var options = this.getOptions();
var tableOptions = (options === null || options === void 0 ? void 0 : options.overflow) || {};
if (this.viewport) {
this.selection.refreshModel();
if (this.enableScroll) setTimeout(function () {
_this6.initScrollbar();
}, 0);
}
this.selection.on('select', function () {
var _this6$selection$getS, _this6$toolbarModel;
_this6.conltrollBar.refresh(false);
if (!engine.isEngine(editor)) return;
var align = (_this6$selection$getS = _this6.selection.getSingleCell()) === null || _this6$selection$getS === void 0 ? void 0 : _this6$selection$getS.css('vertical-align');
_this6.updateAlignText(align);
(_this6$toolbarModel = _this6.toolbarModel) === null || _this6$toolbarModel === void 0 ? void 0 : _this6$toolbarModel.update();
});
this.conltrollBar.on('sizeChanged', function () {
var _this6$scrollbar;
_this6.selection.refreshModel();
_this6.onChange();
if (_this6.enableScroll) (_this6$scrollbar = _this6.scrollbar) === null || _this6$scrollbar === void 0 ? void 0 : _this6$scrollbar.refresh();
});
this.conltrollBar.on('sizeChanging', function () {
var _this6$scrollbar2;
if (_this6.enableScroll) (_this6$scrollbar2 = _this6.scrollbar) === null || _this6$scrollbar2 === void 0 ? void 0 : _this6$scrollbar2.refresh();
editor.trigger('editor:resize');
_this6.updateScrollbar();
});
this.command.on('actioned', function (action, silence) {
var _this6$toolbarModel2, _this6$scrollbar3;
if (action === 'paste') {
editor.card.render(_this6.wrapper);
}
if (['splitCell', 'mergeCell', 'insertCol'].includes(action)) {
editor.trigger('editor:resize');
}
_this6.selection.render(action);
(_this6$toolbarModel2 = _this6.toolbarModel) === null || _this6$toolbarModel2 === void 0 ? void 0 : _this6$toolbarModel2.update();
if (!silence) {
_this6.onChange();
}
if (tableOptions.maxRightWidth) _this6.overflow(tableOptions.maxRightWidth());
if (_this6.enableScroll) (_this6$scrollbar3 = _this6.scrollbar) === null || _this6$scrollbar3 === void 0 ? void 0 : _this6$scrollbar3.refresh();
});
var tableRoot = (_this$wrapper11 = this.wrapper) === null || _this$wrapper11 === void 0 ? void 0 : _this$wrapper11.find(Template.TABLE_CLASS);
if (!tableRoot) return;
var value = _get(_getPrototypeOf(TableComponent.prototype), "getValue", this).call(this);
if (!(value === null || value === void 0 ? void 0 : value.html)) {
var tableValue = this.getValue();
if (tableValue && engine.isEngine(editor)) this.setValue(tableValue);
this.onChange();
}
if (tableOptions.maxRightWidth) this.overflow(tableOptions.maxRightWidth());
}
}, {
key: "remoteRefresh",
value: function remoteRefresh() {
var _this$wrapper$0$paren,
_this7 = this,
_this$scrollbar7;
if (!this.wrapper || this.wrapper.length === 0 || !((_this$wrapper$0$paren = this.wrapper[0].parentElement) !== null && _this$wrapper$0$paren !== void 0 ? _this$wrapper$0$paren : this.wrapper[0].parentNode)) return; // 重新绘制列头部和行头部
var colsHeader = this.wrapper.find(Template.COLS_HEADER_CLASS);
var superValue = _get(_getPrototypeOf(TableComponent.prototype), "getValue", this).call(this);
var colItems = colsHeader.find(Template.COLS_HEADER_ITEM_CLASS);
var colCount = colItems.length;
if (superValue.cols > colCount) {
colsHeader.append(engine.$(this.template.renderColsHeader(superValue.cols - colCount)).find(Template.COLS_HEADER_ITEM_CLASS));
colItems = colsHeader.find(Template.COLS_HEADER_ITEM_CLASS);
} else if (superValue.cols < colCount) {
for (var i = colCount; i > superValue.cols; i--) {
var _colItems$eq;
(_colItems$eq = colItems.eq(i - 1)) === null || _colItems$eq === void 0 ? void 0 : _colItems$eq.remove();
}
}
var table = superValue.html ? engine.$(superValue.html) : this.wrapper.find('table');
var colElements = table.find('col').toArray();
colElements.forEach(function (colElement, index) {
var _colItems$eq2;
var width = colElement.attributes('width') || colElement.css('width');
(_colItems$eq2 = colItems.eq(index)) === null || _colItems$eq2 === void 0 ? void 0 : _colItems$eq2.css('width', "".concat(Math.max(parseInt(width), _this7.colMinWidth), "px"));
});
var rowsHeader = this.wrapper.find(Template.ROWS_HEADER_CLASS);
var rowItems = rowsHeader.find(Template.ROWS_HEADER_ITEM_CLASS);
var rowCount = rowItems.length;
if (superValue.rows > rowCount) {
rowsHeader.append(engine.$(this.template.renderRowsHeader(superValue.rows - rowCount)).find(Template.ROWS_HEADER_ITEM_CLASS));
rowItems = rowsHeader.find(Template.ROWS_HEADER_ITEM_CLASS);
} else if (superValue.rows < rowCount) {
for (var _i = rowCount; _i > superValue.rows; _i--) {
var _rowItems$eq;
(_rowItems$eq = rowItems.eq(_i - 1)) === null || _rowItems$eq === void 0 ? void 0 : _rowItems$eq.remove();
}
}
var rowElements = table.find('tr').toArray();
rowElements.forEach(function (rowElement, index) {
var _rowItems$eq2;
(_rowItems$eq2 = rowItems.eq(index)) === null || _rowItems$eq2 === void 0 ? void 0 : _rowItems$eq2.css('height', Math.max(parseInt(rowElement.css('width')), _this7.rowMinHeight));
}); // this.conltrollBar.refresh();
if (this.enableScroll) (_this$scrollbar7 = this.scrollbar) === null || _this$scrollbar7 === void 0 ? void 0 : _this$scrollbar7.refresh();
if (this.remoteRefreshTimeout) clearTimeout(this.remoteRefreshTimeout);
this.remoteRefreshTimeout = setTimeout(function () {
var _this7$wrapper;
// 找到所有可编辑节点,对没有 contenteditable 属性的节点添加contenteditable一下
(_this7$wrapper = _this7.wrapper) === null || _this7$wrapper === void 0 ? void 0 : _this7$wrapper.find(engine.EDITABLE_SELECTOR).each(function (editableNode) {
var editableElement = editableNode;
if (!editableElement.hasAttribute(engine.DATA_CONTENTEDITABLE_KEY)) {
editableElement.setAttribute(engine.DATA_CONTENTEDITABLE_KEY, _this7.template.isReadonly ? 'false' : 'true');
}
});
}, 10);
}
}, {
key: "render",
value: function render() {
var _this$wrapper$0$paren2;
var editor = this.editor;
this.template.isReadonly = !engine.isEngine(editor) || editor.readonly; // 重新渲染
if (this.wrapper && this.wrapper.length > 0 && !!((_this$wrapper$0$paren2 = this.wrapper[0].parentElement) !== null && _this$wrapper$0$paren2 !== void 0 ? _this$wrapper$0$paren2 : this.wrapper[0].parentNode)) {
this.remoteRefresh();
return;
}
var value = this.getValue(); // 第一次渲染
if (!value) return 'Error value';
if (value.html) {
var table = engine.$(value.html);
if (table && table.name !== 'table') {
table = table.toArray().find(function (child) {
return child.name === 'table';
});
if (!table) {
value.html = "");
table = engine.$(value.html);
} else {
value.html = table.get().outerHTML;
}
}
var model = this.helper.getTableModel(table);
value.rows = model.rows;
value.cols = model.cols;
} //渲染卡片
this.wrapper = engine.isEngine(editor) ? engine.$(this.template.htmlEdit(value, menuData(editor.language.get('table')))) : engine.$(this.template.htmlView(value));
if (!engine.isEngine(editor)) {
this.wrapper.find('table').addClass('data-table').addClass('data-table-view');
}
value.rows = this.wrapper.find('tr').length;
if (value.width) {
var containerWidth = this.root.width();
this.wrapper.find('table').css('width', "".concat(!this.enableScroll ? Math.min(value.width, containerWidth) : value.width, "px"));
}
return this.wrapper;
}
}, {
key: "destroy",
value: function destroy() {
var _editor$scrollNode2, _this$scrollbar8;
_get(_getPrototypeOf(TableComponent.prototype), "destroy", this).call(this);
var editor = this.editor;
window.removeEventListener('scroll', this.updateScrollbar);
window.removeEventListener('resize', this.updateScrollbar);
(_editor$scrollNode2 = editor.scrollNode) === null || _editor$scrollNode2 === void 0 ? void 0 : _editor$scrollNode2.off('scroll', this.updateScrollbar);
if (this.enableScroll) (_this$scrollbar8 = this.scrollbar) === null || _this$scrollbar8 === void 0 ? void 0 : _this$scrollbar8.destroy();
this.command.removeAllListeners();
var selection = this.selection;
selection.removeAllListeners();
selection.destroy();
var bar = this.conltrollBar;
bar.removeAllListeners();
bar.destroy();
editor.off('undo', this.doChange);
editor.off('redo', this.doChange);
}
}], [{
key: "cardName",
get: function get() {
return 'table';
}
}, {
key: "cardType",
get: function get() {
return engine.CardType.BLOCK;
}
}, {
key: "selectStyleType",
get: function get() {
return engine.SelectStyleType.BACKGROUND;
}
}, {
key: "autoSelected",
get: function get() {
return false;
}
}, {
key: "lazyRender",
get: function get() {
return true;
}
}]);
return TableComponent;
}(engine.Card);
TableComponent.colors = Palette.getColors().map(function (group) {
return group.map(function (color) {
return {
color: color,
border: Palette.getStroke(color)
};
});
});
var en = {
table: {
insertColLeft: 'Insert column(s) $data left',
insertColRight: 'Insert column(s) $data right',
insertRowUp: 'Insert row(s) $data up',
insertRowDown: 'Insert row(s) $data down',
mergeCell: 'Merge cells',
splitCell: 'Unmerge cells',
removeCol: 'Delete selected column(s)',
removeRow: 'Delete selected row(s)',
removeTable: 'Delete table',
copy: 'Copy',
cut: 'Cut',
paste: 'Paste',
clear: 'Clear',
draggingCol: 'Moving $data column',
draggingRow: 'Moving $data row',
color: {
title: 'Cell background color',
nonFillText: 'No fill color'
},
noBorder: 'Hide border',
showBorder: 'Show border',
verticalAlign: {
title: 'Vertical align',
top: 'Align top',
middle: 'Align middle',
bottom: 'Align bottom'
}
}
};
var cn = {
table: {
insertColLeft: '左边插入 $data 列',
insertColRight: '右边插入 $data 列',
insertRowUp: '上方插入 $data 行',
insertRowDown: '下方插入 $data 行',
mergeCell: '合并单元格',
splitCell: '拆分单元格',
removeCol: '删除选中列',
removeRow: '删除选中行',
removeTable: '删除表格',
copy: '复制',
cut: '剪切',
paste: '粘贴',
clear: '清空内容',
draggingCol: '正在移动 $data 列',
draggingRow: '正在移动 $data 行',
color: {
title: '单元格背景色',
nonFillText: '无填充色'
},
noBorder: '隐藏边框',
showBorder: '显示边框',
verticalAlign: {
title: '垂直对齐',
top: '顶对齐',
middle: '垂直居中',
bottom: '底对齐'
}
}
};
var locales = {
'en-US': en,
'zh-CN': cn
};
var css_248z$1 = "div[dnd-trigger-key=\"table\"], div[toolbar-trigger-key=\"table\"] {\n margin-left: -13px;\n margin-top: -13px;\n}\n\n.data-table {\n border: none;\n position: relative;\n z-index: 1;\n table-layout: fixed;\n white-space: pre-wrap;\n width: 100%;\n border-collapse: collapse;\n background-color: #ffffff;\n}\n\ndiv[data-card-key=\"table\"].card-selected .data-table, div[data-card-key=\"table\"].card-selected-other .data-table {\n background: transparent\n}\n\n.am-engine [data-card-key=\"table\"].card-selected [data-card-element=\"center\"].data-card-background-selected {\n background: transparent;\n}\n\n.am-engine [data-card-key=\"table\"].card-selected [data-card-element=\"center\"].data-card-background-selected .table-wrapper {\n background: rgba(27, 162, 227, 0.2);\n}\n\n.am-engine-mobile div[data-card-key=\"table\"].card-activated {\n margin-left: 20px;\n}\n\n.data-table tr,.data-table td {\n position: relative;\n}\n\n.data-table tr {\n height: 35px;\n}\n\n.data-table tr td {\n border: none;\n vertical-align: top;\n cursor: text;\n}\n\n.data-table tr td[table-cell-selection]:after {\n content: ' ';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(180, 213, 254, 0.5);\n pointer-events: none;\n z-index: 2;\n}\n\n.drag-selecting .data-table, .data-table tr td[table-cell-selection] {\n caret-color:transparent\n}\n\n.data-table tr td[table-cell-selection] ::-moz-selection{\n background: transparent !important;\n}\n\n.data-table tr td[table-cell-selection] ::selection{\n background: transparent !important;\n}\n\n.table-wrapper {\n position: relative;\n cursor: default;\n}\n\n.table-wrapper.active {\n margin-top: -41px;\n width: 100%;\n}\n\n.table-wrapper.scrollbar-show {\n margin-bottom: -10px;\n}\n\n.table-wrapper.data-table-highlight tr td[table-cell-selection]:after {\n background: transparent;\n}\n\n.table-wrapper .table-header {\n position: absolute;\n visibility: hidden;\n left: -13px;\n top: 28px;\n width: 14px;\n height: 14px;\n cursor: pointer;\n z-index: 4;\n background-color: #ffffff;\n}\n\n.table-wrapper .table-header .table-header-item {\n border: 1px solid #dfdfdf;\n background-color: #f2f3f5;\n border-top-left-radius: 50%;\n width: 100%;\n height: 100%;\n}\n\n.table-wrapper .table-header:hover {\n background-color: #ffffff;\n}\n\n.table-wrapper.data-table-highlight-all .table-header .table-header-item {\n background: rgba(255, 77, 79, 0.4) !important;\n}\n\n.table-wrapper .table-header-item:hover{\n background-color: #e2e4e6;\n}\n\n.table-wrapper.active .table-header {\n visibility:visible\n}\n\n.table-wrapper .table-header.selected .table-header-item {\n background: #4daaff;\n border-color: #4daaff;\n}\n\n.table-wrapper .table-cols-header {\n position: relative;\n height: 13px;\n display: none;\n width: 100%;\n cursor: default;\n}\n\n.table-wrapper.active .table-cols-header {\n display: flex;\n}\n\n.table-wrapper .table-cols-header .table-cols-header-item {\n position: relative;\n height: 13px;\n width: auto;\n border: 1px solid #dfdfdf;\n border-bottom: 0 none;\n overflow: visible;\n background: #f2f3f5;\n cursor: pointer;\n border-right: 0 none;\n}\n\n.table-wrapper .table-cols-header .table-cols-header-item.active{\n background-color: #e2e4e6;\n}\n\n.table-wrapper .table-cols-header .table-cols-header-item:first-child {\n border-top-left-radius: 2px;\n border-bottom-left-radius: 2px;\n}\n.table-wrapper .table-cols-header .table-cols-header-item:last-child {\n border-top-right-radius: 2px;\n border-bottom-right-radius: 2px;\n border-right: 1px solid #dfdfdf;\n}\n.table-wrapper.data-table-highlight-col .table-cols-header .table-cols-header-item.active, .table-wrapper.data-table-highlight-all .table-cols-header .table-cols-header-item {\n background: rgba(255, 77, 79, 0.4) !important;\n}\n.table-wrapper .table-cols-header .table-cols-header-item.selected {\n background: #fff;\n z-index: 1;\n border-radius: 0;\n border-bottom: 0;\n cursor: move;\n}\n.table-wrapper .table-cols-header .table-cols-header-item.selected .col-dragger {\n display: flex;\n position: absolute;\n left: -1px;\n top: -1px;\n right: -1px;\n bottom: -1px;\n background: #4daaff;\n border-radius: 0;\n z-index: 1;\n justify-content: center;\n align-items: center;\n}\n\n.table-wrapper.data-table-highlight-col .table-cols-header .table-cols-header-item .col-dragger,.table-wrapper.data-table-highlight-all .table-cols-header .table-cols-header-item .col-dragger {\n background: transparent !important;\n}\n.table-wrapper .table-cols-header .table-cols-header-item.selected .col-dragger .drag-info {\n display: none;\n}\n.table-wrapper .table-cols-header .table-cols-header-item.no-dragger .col-dragger .data-icon {\n display: none;\n}\n.table-wrapper .table-cols-header .table-cols-header-item.dragging .col-dragger {\n height: 50px;\n}\n.table-wrapper .table-cols-header .table-cols-header-item.dragging .col-dragger .drag-info {\n display: block;\n color: #fff;\n}\n.table-wrapper .table-cols-header .table-cols-header-item .cols-trigger {\n position: absolute;\n right: -1px;\n top: -1px;\n width: 2px;\n height: 14px;\n z-index: 10;\n}\n\n.am-engine-mobile .table-wrapper .table-cols-header .table-cols-header-item .cols-trigger {\n right: -3px;\n width: 6px;\n}\n\n.am-engine:not(.am-engine-mobile) .table-wrapper .table-cols-header .table-cols-header-item .cols-trigger.active {\n background: #0589f3;\n cursor: col-resize;\n}\n\n.am-engine:not(.am-engine-mobile) .table-wrapper .table-cols-header .table-cols-header-item .cols-trigger.dragging {\n width: 2px;\n background: #0589f3;\n right: -1px;\n}\n\n.table-wrapper .table-cols-header .table-cols-header-item .col-dragger {\n text-align: center;\n display: none;\n}\n.table-wrapper .table-cols-header .table-cols-header-item .col-dragger .data-icon-drag {\n font-size: 10px;\n color: #fff;\n}\n\n.table-wrapper .table-cols-header .table-cols-header-item .col-dragger .data-icon-drag::before {\n transform: rotate(90deg);\n display: inline-block;\n}\n\n.table-wrapper.data-table-highlight-col .table-cols-header .table-cols-header-item .col-dragger .data-icon-drag,.table-wrapper.data-table-highlight-all .table-cols-header .table-cols-header-item .col-dragger .data-icon-drag{\n display: none;\n}\n.table-wrapper .table-cols-header.dragging .table-cols-header-item .cols-trigger,.table-wrapper.drag-selecting .table-cols-header-item .cols-trigger{\n display: none;\n}\n.table-wrapper .table-cols-header.resize .table-cols-header-item {\n cursor: col-resize;\n}\n.table-wrapper .table-rows-header {\n position: absolute;\n left: -13px;\n top: 41px;\n width: 14px;\n z-index: 128;\n border-right: 0;\n display: none;\n}\n\n.table-wrapper.active .table-rows-header {\n display: block;\n}\n\n.table-wrapper .table-rows-header .table-rows-header-item {\n position: relative;\n width: 100%;\n border: 1px solid #dfdfdf;\n border-bottom: 0;\n background: #f2f3f5;\n cursor: pointer;\n}\n\n.table-wrapper .table-rows-header .table-rows-header-item.active\n{\n background-color: #e2e4e6;\n}\n\n/* .table-wrapper .table-rows-header .table-rows-header-item:nth-child(3) {\n border-top: 0 none;\n} */\n\n.table-wrapper .table-rows-header .table-rows-header-item:last-child{\n border-bottom: 1px solid #dfdfdf;\n}\n\n.table-wrapper.data-table-highlight-row .table-rows-header .table-rows-header-item.active,.table-wrapper.data-table-highlight-all .table-rows-header .table-rows-header-item {\n background: rgba(255, 77, 79, 0.4) !important;\n}\n\n.table-wrapper .table-rows-header .table-rows-header-item.selected {\n width: 14px;\n background: #fff;\n cursor: move;\n}\n.table-wrapper .table-rows-header .table-rows-header-item.selected .row-dragger {\n display: flex;\n position: absolute;\n align-items: center;\n text-align: left;\n white-space: nowrap;\n content: ' ';\n left: -1px;\n top: -1px;\n bottom: -1px;\n right: -1px;\n background: #4daaff;\n border-radius: 0;\n z-index: 1;\n}\n.table-wrapper.data-table-highlight-row .table-rows-header .table-rows-header-item .row-dragger,.table-wrapper.data-table-highlight-all .table-rows-header .table-rows-header-item .row-dragger{\n background: transparent !important;\n}\n.table-wrapper .table-rows-header .table-rows-header-item.selected .row-dragger .drag-info {\n display: none;\n}\n.table-wrapper .table-rows-header .table-rows-header-item.no-dragger .row-dragger .data-icon {\n display: none;\n}\n.table-wrapper .table-rows-header .table-rows-header-item.dragging .row-dragger {\n width: 150px;\n}\n.table-wrapper .table-rows-header .table-rows-header-item.dragging .row-dragger .drag-info {\n margin-left: 5px;\n display: flex;\n padding: 10px;\n color: #fff;\n}\n.table-wrapper .table-rows-header .table-rows-header-item .rows-trigger {\n position: absolute;\n bottom: -1px;\n height: 2px;\n width: 14px;\n left: -1px;\n z-index: 10;\n cursor: row-resize;\n}\n\n.am-engine-mobile .table-wrapper .table-rows-header .table-rows-header-item .rows-trigger {\n bottom: -3px;\n height: 6px;\n}\n\n.am-engine:not(.am-engine-mobile) .table-wrapper .table-rows-header .table-rows-header-item .rows-trigger.active {\n background: #0589f3;\n}\n\n.am-engine:not(.am-engine-mobile) .table-wrapper .table-rows-header .table-rows-header-item .rows-trigger.dragging {\n height: 2px;\n background: #0589f3;\n bottom: -1px;\n}\n\n.table-wrapper .table-rows-header .table-rows-header-item .row-dragger {\n display: none;\n}\n.table-wrapper .table-rows-header .table-rows-header-item .row-dragger .data-icon-drag {\n font-size: 10px;\n color: #fff;\n margin-left: 1px;\n}\n\n.table-wrapper.data-table-highlight-row .table-rows-header .table-rows-header-item .row-dragger .data-icon-drag,.table-wrapper.data-table-highlight-all .table-rows-header .table-rows-header-item .row-dragger .data-icon-drag{\n display: none;\n}\n\n.table-wrapper .table-rows-header .table-rows-header-item .row-dragger .drag-info {\n height: 100%;\n display: flex;\n align-items: center;\n}\n.table-wrapper .table-rows-header.dragging .table-rows-header-item .rows-trigger,.table-wrapper.drag-selecting .table-rows-header-item .rows-trigger {\n display: none;\n}\n.table-wrapper .table-rows-header.resize .table-rows-header-item {\n cursor: row-resize;\n}\n\n.table-wrapper .table-viewport {\n position: relative;\n overflow: hidden;\n overflow-y: hidden;\n cursor: text;\n}\n\n.table-wrapper.active .table-viewport{\n padding-top: 28px;\n padding-left: 13px;\n margin-left: -13px;\n}\n\n.table-wrapper .table-viewport .scrollbar-shadow-left {\n top: 0;\n bottom: 10px;\n}\n\n.table-wrapper.active .table-viewport .scrollbar-shadow-left {\n top: 28px;\n margin-left: 14px;\n}\n\n.table-wrapper .table-viewport .scrollbar-shadow-right {\n top: 0;\n bottom: 10px;\n}\n\n.table-wrapper.active .table-viewport .scrollbar-shadow-right {\n top: 28px;\n}\n\n.table-wrapper .table-placeholder {\n position: absolute;\n border: 1px solid #008dff;\n background: #008dff;\n display: none;\n z-index: 126;\n}\n.table-wrapper .table-menubar {\n position: absolute;\n top: -99999px;\n left: -99999px;\n padding: 4px 0;\n border-radius: 4px;\n border: 1px solid #e9e9e9;\n box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.08);\n background: #fff;\n /* \\u4ee3\\u7801\\u5757\\u7684 codemirror \\u9ed8\\u8ba4\\u7ed9\\u6bcf\\u884c\\u4ee3\\u7801\\u7684 pre \\u8bbe\\u7f6e\\u4e86 z-index 2, \\u5982\\u679c\\u8868\\u683c\\u5728\\u4ee3\\u7801\\u5757\\u524d\\u9762\\uff0c\\u9020\\u6210\\u53f3\\u952e\\u83dc\\u5355\\u65e0\\u6cd5\\u70b9\\u51fb */\n z-index: 130;\n min-width: 240px;\n}\n.table-wrapper .table-menubar .table-menubar-item {\n padding: 6px 16px;\n cursor: default;\n}\n.table-wrapper .table-menubar .table-menubar-item:hover {\n background: #f0f0f0;\n}\n\n.table-wrapper .table-menubar .table-menubar-item.disabled {\n color: #aaa;\n display: none;\n}\n\n.table-wrapper .table-menubar .table-menubar-item .table-menubar-item-input {\n width: 46px;\n line-height: 12px;\n font-size: 12px;\n outline: none;\n border: 1px solid #dadada;\n border-radius: 4px;\n text-align: center;\n}\n\n.table-wrapper .table-menubar .table-menubar-item .table-menubar-item-input::-moz-selection {\n color: inherit;\n background:transparent\n}\n\n.table-wrapper .table-menubar .table-menubar-item .table-menubar-item-input::selection {\n color: inherit;\n background:transparent\n}\n\n.table-wrapper .table-menubar .table-menubar-item .table-menubar-item-input:focus::-moz-selection\n{\n color: #fff;\n background: #1890ff;\n}\n\n.table-wrapper .table-menubar .table-menubar-item .table-menubar-item-input:focus::selection\n{\n color: #fff;\n background: #1890ff;\n}\n\n.table-wrapper .table-menubar .split {\n height: 0;\n border-top: 1px solid #e8e8e8;\n margin: 2px 0;\n}\n\n.table-wrapper .table-main-content {\n margin: 2px 2px;\n padding: 4px 4px;\n position: relative;\n z-index: 3;\n}\n\n.table-wrapper .table-main-content [data-card-key] {\n max-width: 100%;\n}\n\n.table-wrapper .table-main-bg {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1;\n bottom: 0;\n pointer-events: none;\n}\n\n.table-wrapper .table-main-bg .table-main-border-top {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1;\n height: 0;\n border-top: 1px solid rgb(217, 217, 217);\n}\n\n.table-wrapper:not(.active) [data-table-no-border=\"true\"] .table-main-bg .table-main-border-top {\n border-top-color: transparent;\n}\n\n.table-wrapper.active [data-table-no-border=\"true\"] .table-main-bg .table-main-border-top {\n border-top-style: dashed;\n}\n\n.table-wrapper .table-main-bg .table-main-border-right {\n display: none;\n position: absolute;\n top: 0;\n bottom: 0;\n right: -1px;\n z-index: 1;\n width: 0;\n border-right: 1px solid rgb(217, 217, 217);\n}\n\n.table-wrapper:not(.active) [data-table-no-border=\"true\"] .table-main-bg .table-main-border-right {\n border-right-color: transparent;\n}\n\n.table-wrapper.active [data-table-no-border=\"true\"] .table-main-bg .table-main-border-right {\n border-right-style: dashed;\n}\n\n.table-wrapper tr td.table-last-row .table-main-bg .table-main-border-right {\n display: block;\n right: 0;\n}\n\n.table-wrapper .table-main-bg .table-main-border-bottom {\n display: none;\n position: absolute;\n bottom: -1px;\n left: 0;\n right: 0;\n z-index: 1;\n height: 0;\n border-bottom: 1px solid rgb(217, 217, 217);\n}\n\n.table-wrapper:not(.active) [data-table-no-border=\"true\"] .table-main-bg .table-main-border-bottom {\n border-bottom-color: transparent;\n}\n\n.table-wrapper.active [data-table-no-border=\"true\"] .table-main-bg .table-main-border-bottom {\n border-bottom-style: dashed;\n}\n\n.table-wrapper tr td.table-last-column .table-main-bg .table-main-border-bottom{\n display: block;\n bottom: 0;\n}\n\n.table-wrapper .table-main-bg .table-main-border-left {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n z-index: 1;\n width: 0;\n border-left: 1px solid rgb(217, 217, 217);\n}\n\n.table-wrapper:not(.active) [data-table-no-border=\"true\"] .table-main-bg .table-main-border-left {\n border-left-color: transparent;\n}\n\n.table-wrapper.active [data-table-no-border=\"true\"] .table-main-bg .table-main-border-left {\n border-left-style: dashed;\n}\n\n.table-wrapper .table-highlight {\n background: #ff4d4f;\n opacity: 0.08;\n position: absolute;\n z-index: 2;\n pointer-events: none;\n display: none;\n}\n\n.table-wrapper.scrollbar-show .data-scrollable.scroll-x {\n padding-bottom: 10px;\n}\n\n.table-wrapper .data-scrollable.scroll-x {\n padding-bottom: 0;\n}\n\n.table-wrapper .data-scrollable.scroll-x:hover {\n overflow: hidden;\n}\n\n.table-wrapper.scrollbar-show .data-scrollable.scroll-x .data-scrollbar-x{\n margin-bottom: 2px;\n}\n\n.table-wrapper .data-scrollable .data-scrollbar.data-scrollbar-x {\n height: 6px;\n z-index: 5;\n}\n\n.table-wrapper .data-scrollable .data-scrollbar.data-scrollbar-x .data-scrollbar-trigger {\n height: 6px;\n}\n\n.table-wrapper .table-rows-header .table-row-delete-button,.table-wrapper .table-rows-header .table-row-add-button {\n position: absolute;\n right: 100%;\n display: none;\n justify-content: center;\n align-items: center;\n z-index: 2;\n width: 24px;\n height: 24px;\n border: 1px solid #e4e4e4;\n border-radius: 2px;\n cursor: pointer;\n background-color: #fff;\n background-position: center center;\n background-repeat: no-repeat;\n\n left: 14px;\n margin-left: 2px;\n margin-top: -2px;\n}\n\n.table-wrapper .table-rows-header .table-row-delete-button .data-icon,.table-wrapper .table-rows-header .table-row-add-button .data-icon {\n font-size: 12px;\n}\n\n.table-wrapper .table-rows-header .table-row-add-button {\n left: -30px;\n margin-top: -12px;\n}\n\n.table-wrapper .table-rows-header .table-row-delete-button:hover,.table-wrapper .table-col-delete-button:hover {\n color:#ff4d4f;\n}\n\n.table-wrapper .table-col-delete-button, .table-wrapper .table-col-add-button {\n position: absolute;\n bottom: 100%;\n display: none;\n justify-content: center;\n align-items: center;\n z-index: 128;\n margin-bottom: 4px;\n width: 24px;\n height: 24px;\n border: 1px solid #e4e4e4;\n border-radius: 2px;\n cursor: pointer;\n background: #fff;\n background-position: center center;\n background-repeat: no-repeat;\n margin-left: -12px;\n}\n\n.table-wrapper .table-col-delete-button .data-icon, .table-wrapper .table-col-add-button .data-icon {\n font-size: 12px;\n}\n\n.table-wrapper .table-cols-header .table-col-add-button .table-col-add-split-button {\n position: absolute;\n width: 2px;\n left: 10px;\n top: 22px;\n background: #008dff;\n display: none;\n}\n\n.table-wrapper .table-rows-header .table-row-add-button .table-row-add-split-button {\n position: absolute;\n height: 2px;\n left: 22px;\n background: #008dff;\n display: none;\n}\n\n.table-wrapper .table-col-add-button:hover, .table-wrapper .table-row-add-button:hover {\n color: #008dff;\n}\n\n.table-wrapper .table-col-add-button:hover .table-col-add-split-button{\n display: block;\n}\n\n.table-wrapper .table-row-add-button:hover .table-row-add-split-button{\n display: block;\n}\n\n.data-table-reader .data-table tr td {\n border: 1px solid rgb(217, 217, 217);\n cursor: auto;\n padding: 4px 8px;\n}\n\n.data-table-reader .data-table[data-table-no-border=\"true\"] tr td {\n border:0 none\n}\n\n.data-table-reader.data-scrollable.scroll-x {\n padding-bottom: 10px;\n}\n\n.data-table-reader .scrollbar-shadow-left, .data-table-reader .scrollbar-shadow-right {\n bottom: 10px;\n}\n\n.data-table-reader.scrollbar-show.data-scrollable.scroll-x .data-scrollbar-x{\n margin-bottom: 2px;\n}\n\n.data-table-reader.data-scrollable .data-scrollbar.data-scrollbar-x {\n height: 6px;\n}\n\n.data-table-reader.data-scrollable .data-scrollbar.data-scrollbar-x .data-scrollbar-trigger {\n height: 6px;\n}\n\n[data-card-key=\"table\"].data-card-block-max > [data-card-element=\"body\"] > [data-card-element=\"center\"] {\n padding: 48px;\n margin-top: 4px;\n}\n/**\n表格可溢出样式\n**/\n.table-wrapper.table-overflow {\n width: auto;\n}\n";
styleInject(css_248z$1);
var Table = /*#__PURE__*/function (_Plugin) {
_inherits(Table, _Plugin);
var _super = _createSuper(Table);
function Table() {
var _this;
_classCallCheck(this, Table);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _super.call.apply(_super, [this].concat(args));
_this.onCopy = function (event) {
var editor = _this.editor;
if (!engine.isEngine(editor)) return true;
var change = editor.change,
card = editor.card;
var range = change.range.get();
var component = card.find(range.commonAncestorNode, true);
if (component && component.name === TableComponent.cardName && !component.isCursor(range.startNode)) {
var nodes = component.getSelectionNodes();
if (nodes.length > 1) {
event.preventDefault();
component.command.copy();
editor.messageSuccess('copy', editor.language.get('copy', 'success'));
return false;
}
}
return true;
};
_this.onCut = function (event) {
var editor = _this.editor;
if (!engine.isEngine(editor) || editor.readonly) return true;
var change = editor.change,
card = editor.card;
var range = change.range.get();
var component = card.find(range.commonAncestorNode, true);
if (component && component.name === TableComponent.cardName && !component.isCursor(range.startNode)) {
var nodes = component.getSelectionNodes();
if (nodes.length > 1) {
event.preventDefault();
component.command.cut();
return false;
}
}
return true;
};
_this.onPaste = function (event) {
var editor = _this.editor;
if (!engine.isEngine(editor) || editor.readonly) return true;
var change = editor.change,
card = editor.card;
var range = change.range.get();
var component = card.find(range.commonAncestorNode, true);
if (component && component.name === TableComponent.cardName && !component.isCursor(range.startNode)) {
var data = editor.clipboard.getData(event);
if (!data || !/ /gi.test(data.html || '')) {
if (data.html && ~data.html.indexOf(' 1 && arguments[1] !== undefined ? arguments[1] : 'width';
var dataWidth = node.attributes('data-width');
var width = dataWidth ? dataWidth : node.css(type);
if (width.endsWith('%')) node.css(type, '');
if (width.endsWith('pt')) node.css(type, convertToPX(width));
};
var tables = root.find('table');
if (tables.length === 0) return;
var helper = new Helper(editor); // 判断当前是在可编辑卡片内,在可编辑卡片内不嵌套表格
var change = editor.change;
var range = change.range.get();
var clearTable = function clearTable(table) {
var thead = table.find('thead');
var headTds = thead.find('th,td').toArray();
headTds.forEach(function (td) {
table.before(td.children());
});
var trs = table.find('tr').toArray();
trs.forEach(function (tr) {
var tds = tr.find('td').toArray();
tds.forEach(function (td) {
if (!editor.node.isEmpty(td)) table.before(td.children());
});
});
var tfoot = table.find('tfoot');
var footTds = tfoot.find('th,td').toArray();
footTds.forEach(function (td) {
table.after(td.children());
});
table.remove();
};
var isClear = range.startNode.closest(engine.EDITABLE_SELECTOR).length > 0;
tables.each(function (_, index) {
var _node$parent, _node, _node2;
var node = tables.eq(index);
if (!node) return;
if (isClear || ((_node$parent = node.parent()) === null || _node$parent === void 0 ? void 0 : _node$parent.name) === 'td') {
clearTable(node);
return;
}
var trs = node.find('tr');
trs.each(function (child) {
var tr = engine.$(child);
var display = tr.css('display');
if (display === 'none') {
tr.remove();
} else {
tr.css('display', '');
}
clearWH(tr);
clearWH(tr, 'height'); // 不是td就用td标签包裹起来
var childNodes = tr.children();
childNodes.each(function (tdChild) {
var td = engine.$(tdChild);
clearWH(td);
var text = td.text();
var childTable = td.find('table');
if (childTable.length > 0) {
childTable.after(document.createTextNode(childTable.text()));
childTable.remove();
} // 排除空格
if (td.name !== 'td' && ['\n', '\r\n'].includes(text.trim())) {
var newTd = engine.$(" ");
td.before(newTd);
newTd.append(td);
}
});
});
clearWH(node);
clearWH(node, 'height');
node = helper.normalizeTable(node);
var tbody = node.find('tbody');
if (tbody.length > 1) {
for (var i = 1; i < tbody.length; i++) {
var currentTbody = tbody.eq(i);
var _trs = currentTbody === null || currentTbody === void 0 ? void 0 : currentTbody.find('tr');
if (_trs && _trs.length > 0) {
var _tbody$eq;
(_tbody$eq = tbody.eq(0)) === null || _tbody$eq === void 0 ? void 0 : _tbody$eq.append(_trs);
}
currentTbody === null || currentTbody === void 0 ? void 0 : currentTbody.remove();
}
} // 表头放在tbody最前面
var thead = node.find('thead');
if (thead && thead.length > 0) tbody.prepend(thead.children());
thead.remove(); // 表头放在tbody最前面
var tfoot = node.find('tfoot');
if (tfoot && tfoot.length > 0) tbody.append(tfoot.children());
tfoot.remove();
var ths = node.find('th');
ths.each(function (_, index) {
var th = ths.eq(index);
th === null || th === void 0 ? void 0 : th.replaceWith(engine.$("".concat(th.html(), " ")));
});
var tds = node.find('td');
var fragment = engine.getDocument().createDocumentFragment();
tds.each(function (_, index) {
fragment = engine.getDocument().createDocumentFragment();
var element = tds.eq(index);
if (!element) return;
clearWH(element);
clearWH(element, 'height');
var background = element.css('background');
if (background) element.css('background-color', background);
var valign = element.attributes('valign');
if (valign) element.attributes('vertical-align', valign);
var children = element.children();
for (var _i = 0, len = children.length; _i < len; _i++) {
var child = children.eq(_i); // word 粘贴的表格会有一个空的p标签,去除
if ((child === null || child === void 0 ? void 0 : child.name) === 'p' && child.children().length === 0) continue; // 移除单元格第一个和最后一个换行符,word 里面粘贴会存在,导致空行
if ((_i === 0 || _i === len - 1) && (child === null || child === void 0 ? void 0 : child.isText())) {
var text = child.text();
if (/^\n(\s)*$/.test(text)) {
continue;
}
}
if (child) fragment.appendChild(child[0]);
} // 对单元格内的内容标准化
var fragmentNode = engine.$(fragment);
element === null || element === void 0 ? void 0 : element.empty().append(editor.node.normalize(fragmentNode));
});
var background = ((_node = node) === null || _node === void 0 ? void 0 : _node.css('background')) || ((_node2 = node) === null || _node2 === void 0 ? void 0 : _node2.css('background-color'));
if (background) tds.css('background', background);
trs = node.find('tr');
var rowSpan = 1;
trs.each(function (child) {
var tr = engine.$(child);
var tds = tr === null || tr === void 0 ? void 0 : tr.find('td');
if ((tds === null || tds === void 0 ? void 0 : tds.length) === 0 && rowSpan < 2) {
tr === null || tr === void 0 ? void 0 : tr.remove();
}
if (tds && (tds === null || tds === void 0 ? void 0 : tds.length) > 0) {
var spans = tds.toArray().map(function (td) {
return td[0].rowSpan;
});
rowSpan = Math.max.apply(Math, _toConsumableArray(spans));
}
if (tr) {
clearWH(tr);
clearWH(tr, 'height');
}
var background = (tr === null || tr === void 0 ? void 0 : tr.css('background')) || (tr === null || tr === void 0 ? void 0 : tr.css('background-color'));
if (background) tds === null || tds === void 0 ? void 0 : tds.css('background', background);
});
editor.nodeId.generateAll(node, true);
var children = node.allChildren();
children.forEach(function (child) {
if (editor.node.isInline(child)) {
editor.inline.repairCursor(child);
}
});
var html = node.get().outerHTML.replace(/\n|\r\n/g, '').replace(/>\s+<');
editor.card.replaceNode(node, TableComponent.cardName, {
html: html
});
node.remove();
});
};
_this.parseHtml = function (root, callback) {
var editor = _this.editor;
var results = [];
root.find("[".concat(engine.CARD_KEY, "=\"").concat(TableComponent.cardName, "\"],[").concat(engine.READY_CARD_KEY, "=\"").concat(TableComponent.cardName, "\"]")).each(function (tableNode) {
var node = engine.$(tableNode);
var table = node.find('table');
var value = engine.decodeCardValue(node.attributes(engine.CARD_VALUE_KEY));
if (table.length === 0) {
if (!value || !value.html) return; // 表格值里面的卡片都是没有被转换过的,所以需要先把卡片转换过来
table = engine.$(engine.transformCustomTags(value.html));
if (table.length === 0) {
node.remove();
return;
} else {
editor.trigger('parse:html', table);
}
}
var enableScroll = _this.options.enableScroll !== false;
var width = table.attributes('width') || table.css('width');
table.css({
outline: 'none',
'border-collapse': 'collapse',
width: enableScroll ? '100%' : width
});
table.attributes('data-width', width);
var tds = table.find('td');
tds.each(function (_, index) {
var tdElement = tds.eq(index);
tdElement === null || tdElement === void 0 ? void 0 : tdElement.css({
'min-width': 'auto',
'white-space': 'flat',
'word-wrap': 'break-word',
margin: '4px 8px',
border: !!table.attributes('data-table-no-border') ? '0 none' : '1px solid #d9d9d9',
padding: '4px 8px',
cursor: 'default',
'vertical-align': tdElement.css('vertical-align') || 'top'
});
});
table.find(Template.TABLE_TD_BG_CLASS).remove();
table.find(Template.TABLE_TD_CONTENT_CLASS).each(function (content) {
editor.node.unwrap(engine.$(content));
}); // 添加一个空行,为了更好的识别每列的宽度(如果在大部分colspan的情况下,不知道每列的具体宽度)
var colgroup = table.find('colgroup');
var lastEmptyTr = engine.$(" ");
colgroup.find('col').each(function (col) {
var colWidth = engine.$(col).attributes('width');
var td = engine.$(" "));
lastEmptyTr.append(td);
});
table.find('tbody').append(lastEmptyTr);
if (callback) {
table = callback(table, value);
} //添加table的容器id; table 添加外部包裹div;用于table过长导致 文本溢出
var tableId = table.attributes('data-id') + '-table';
table = engine.$("")).append(table);
node.replaceWith(table);
results.push(table);
});
return results;
};
_this.markdownIt = function (mardown) {
if (_this.options.markdown !== false) {
mardown.enable('table');
}
};
return _this;
}
_createClass(Table, [{
key: "init",
value: function init() {
var editor = this.editor;
if (!this.options.colMinWidth) {
this.options.colMinWidth = 40;
}
if (!this.options.rowMinHeight) {
this.options.rowMinHeight = 30;
}
editor.language.add(locales);
editor.schema.add(this.schema());
editor.conversion.add('th', 'td');
editor.on('parse:html', this.parseHtml);
editor.on('paste:each', this.pasteEach);
editor.on('paste:each-after', this.pasteHtml);
editor.on('paste:schema', this.pasteSchema);
if (engine.isEngine(editor)) {
this.editor.on('markdown-it', this.markdownIt);
editor.change.event.onDocument('copy', this.onCopy, 0);
editor.change.event.onDocument('cut', this.onCut, 0);
editor.change.event.onDocument('paste', this.onPaste, 0);
}
}
}, {
key: "hotkey",
value: function hotkey() {
return this.options.hotkey || '';
}
}, {
key: "schema",
value: function schema() {
return [{
name: 'table',
type: 'block',
attributes: {
class: ['data-table'],
'data-table-no-border': '*',
style: {
width: '@length'
}
}
}, {
name: 'colgroup',
type: 'block',
allowIn: ['table']
}, {
name: 'col',
type: 'block',
isVoid: true,
attributes: {
width: '@number',
span: '@number'
},
allowIn: ['colgroup']
}, {
name: 'thead',
type: 'block',
allowIn: ['table']
}, {
name: 'tbody',
type: 'block',
allowIn: ['table']
}, {
name: 'tr',
type: 'block',
attributes: {
style: {
height: '@length'
}
},
allowIn: ['tbody', 'thead', 'tfoot']
}, {
name: 'td',
type: 'block',
attributes: {
colspan: '@number',
rowspan: '@number',
class: ['table-last-column', 'table-last-row', 'table-last-column', 'table-cell-selection'],
style: {
'background-color': '@color',
'vertical-align': ['top', 'middle', 'bottom']
}
},
allowIn: ['tr']
}, {
name: 'th',
type: 'block',
attributes: {
colspan: '@number',
rowspan: '@number'
},
allowIn: ['tr']
}];
}
}, {
key: "execute",
value: function execute(rows, cols) {
var editor = this.editor;
if (!engine.isEngine(editor)) return; //可编辑子区域内不插入表格
var change = editor.change;
var range = change.range.get();
if (range.startNode.closest(engine.EDITABLE_SELECTOR).isCard()) return; //插入表格
editor.card.insert(TableComponent.cardName, {
rows: rows || 3,
cols: cols || 3,
overflow: !!this.options.overflow
});
}
}, {
key: "destroy",
value: function destroy() {
var editor = this.editor;
editor.off('parse:html', this.parseHtml);
editor.off('paste:each-after', this.pasteHtml);
editor.off('paste:schema', this.pasteSchema);
editor.off('markdown-it', this.markdownIt);
}
}], [{
key: "pluginName",
get: function get() {
return 'table';
}
}]);
return Table;
}(engine.Plugin);
exports.TableComponent = TableComponent;
exports.default = Table;