innov
/
am-editor-001
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix: table to html

This commit is contained in:
yanmao 2022-01-05 00:41:46 +08:00
parent c67f1bc250
commit 6a87ef0e30
4 changed files with 48 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/engine/src/range.ts
View File

@ -12,7 +12,6 @@ import {
DATA_ELEMENT, DATA_ELEMENT,
DATA_ID, DATA_ID,
DATA_TRANSIENT_ELEMENT, DATA_TRANSIENT_ELEMENT,
EDITABLE_SELECTOR,
UI, UI,
} from './constants/root'; } from './constants/root';
import Selection from './selection'; import Selection from './selection';

7
packages/engine/src/schema.ts
View File

@ -17,6 +17,7 @@ import { DATA_ID } from './constants';
/** /**
* 标签规则 * 标签规则
*/ */
const SCHEMA_KEYS = ['blocks', 'inlines', 'marks', 'globals'];
class Schema implements SchemaInterface { class Schema implements SchemaInterface {
private _all: Array<SchemaRule> = []; private _all: Array<SchemaRule> = [];
private _typeMap: { private _typeMap: {
@ -150,7 +151,7 @@ class Schema implements SchemaInterface {
*/ */
find(callback: (rule: SchemaRule) => boolean): Array<SchemaRule> { find(callback: (rule: SchemaRule) => boolean): Array<SchemaRule> {
const schemas: Array<SchemaRule> = []; const schemas: Array<SchemaRule> = [];
Object.keys(this.data).forEach((key) => { SCHEMA_KEYS.forEach((key) => {
if (key !== 'globals') { if (key !== 'globals') {
const rules = (this.data[key] as Array<SchemaRule>).filter( const rules = (this.data[key] as Array<SchemaRule>).filter(
callback, callback,
@ -368,9 +369,7 @@ class Schema implements SchemaInterface {
const rule = this.getRule(node); const rule = this.getRule(node);
if (!rule) return; if (!rule) return;
const { globals } = this.data; const { globals } = this.data;
const globalRule = Object.keys(globals).find( const globalRule = globals[rule.type] ? rule.type : undefined;
(dataType) => rule.type === dataType,
);
const allRule = { const allRule = {
...omit(rule, 'attributes'), ...omit(rule, 'attributes'),
attributes: merge( attributes: merge(

4
plugins/table/src/index.css
View File

@ -469,8 +469,8 @@ div[data-card-key="table"].card-selected .data-table, div[data-card-key="table"]
} }
.table-wrapper .table-main-content { .table-wrapper .table-main-content {
margin: 4px 4px; margin: 2px 2px;
padding: 0 2px; padding: 4px 4px;
position: relative; position: relative;
z-index: 3; z-index: 3;
overflow: hidden; overflow: hidden;

88
plugins/table/src/index.ts
View File

@ -377,54 +377,52 @@ class Table<T extends TableOptions = TableOptions> extends Plugin<T> {
`[${CARD_KEY}="${TableComponent.cardName}"],[${READY_CARD_KEY}="${TableComponent.cardName}"]`, `[${CARD_KEY}="${TableComponent.cardName}"],[${READY_CARD_KEY}="${TableComponent.cardName}"]`,
).each((tableNode) => { ).each((tableNode) => {
const node = $(tableNode); const node = $(tableNode);
const value = decodeCardValue<TableValue>( let table = node.find('table');
node.attributes(CARD_VALUE_KEY), if (table.length === 0) {
); const value = decodeCardValue<TableValue>(
if (value && value.html) { node.attributes(CARD_VALUE_KEY),
let table = node.find('table'); );
if (!value || !value.html) return;
// 表格值里面的卡片都是没有被转换过的，所以需要先把卡片转换过来
table = $(value.html);
if (table.length === 0) { if (table.length === 0) {
// 表格值里面的卡片都是没有被转换过的，所以需要先把卡片转换过来 node.remove();
table = $(value.html); return;
if (table.length === 0) { } else {
node.remove(); const cards = table.find(CARD_SELECTOR).toArray();
return; cards.forEach((componentNode) => {
} else { this.editor.trigger('parse:html', componentNode);
const cards = table.find(CARD_SELECTOR).toArray();
cards.forEach((componentNode) => {
this.editor.trigger('parse:html', componentNode);
});
}
}
const width = table.attributes('width') || table.css('width');
table.css({
outline: 'none',
'border-collapse': 'collapse',
width: '100%',
});
table.attributes('data-width', width);
const tds = table.find('td');
tds.each((_, index) => {
const tdElement = tds.eq(index);
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((content) => {
this.editor.node.unwrap($(content));
});
node.replaceWith(table);
} }
const width = table.attributes('width') || table.css('width');
table.css({
outline: 'none',
'border-collapse': 'collapse',
width: '100%',
});
table.attributes('data-width', width);
const tds = table.find('td');
tds.each((_, index) => {
const tdElement = tds.eq(index);
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((content) => {
this.editor.node.unwrap($(content));
});
node.replaceWith(table);
}); });
} }