128 lines
3.5 KiB
JavaScript
128 lines
3.5 KiB
JavaScript
export default OakComponent({
|
|
entity: 'article',
|
|
projection: {
|
|
id: 1,
|
|
name: 1,
|
|
content: 1,
|
|
articleMenu: {
|
|
id: 1,
|
|
},
|
|
},
|
|
isList: false,
|
|
formData: function ({ data: article, features }) {
|
|
return {
|
|
id: article?.id,
|
|
content: article?.content,
|
|
name: article?.name,
|
|
articleMenuId: article?.articleMenuId,
|
|
};
|
|
},
|
|
data: {
|
|
editor: null,
|
|
html: '',
|
|
contentTip: false,
|
|
},
|
|
properties: {
|
|
articleMenuId: '',
|
|
changeIsEdit: () => undefined,
|
|
tocPosition: 'none',
|
|
highlightBgColor: 'none',
|
|
onArticlePreview: (content, title) => undefined,
|
|
origin: null,
|
|
scrollId: '',
|
|
height: 600,
|
|
activeColor: undefined,
|
|
},
|
|
listeners: {
|
|
'editor,content'(prev, next) {
|
|
if (next.editor && next.content) {
|
|
next.editor.setHtml(next.content);
|
|
}
|
|
},
|
|
oakId(prev, next) {
|
|
if (prev.oakId !== next.oakId) {
|
|
const { editor } = this.state;
|
|
if (editor == null)
|
|
return;
|
|
editor.destroy();
|
|
this.setEditor(null);
|
|
}
|
|
},
|
|
},
|
|
lifetimes: {
|
|
async ready() {
|
|
const { oakId, articleMenuId } = this.props;
|
|
if (!oakId) {
|
|
if (articleMenuId) {
|
|
this.update({
|
|
articleMenuId,
|
|
});
|
|
const { editor } = this.state;
|
|
editor?.setHtml('');
|
|
this.update({
|
|
content: '',
|
|
});
|
|
}
|
|
}
|
|
},
|
|
detached() {
|
|
const { editor } = this.state;
|
|
if (editor == null)
|
|
return;
|
|
editor.destroy();
|
|
this.setEditor(null);
|
|
},
|
|
},
|
|
methods: {
|
|
async uploadFile(extraFile, file) {
|
|
const result = await this.features.extraFile.autoUpload(extraFile, file);
|
|
return result;
|
|
},
|
|
setEditor(editor) {
|
|
this.setState({
|
|
editor,
|
|
});
|
|
},
|
|
clearContentTip() {
|
|
this.setState({
|
|
contentTip: false,
|
|
});
|
|
},
|
|
async check() {
|
|
if (this.state.name &&
|
|
this.state.name.length > 0 &&
|
|
this.state.html &&
|
|
this.state.html.length > 0 &&
|
|
this.state.html !== '<p><br></p>') {
|
|
await this.execute();
|
|
if (this.props.changeIsEdit) {
|
|
this.props.changeIsEdit();
|
|
}
|
|
}
|
|
else if (this.state.name && this.state.name.length > 0) {
|
|
this.setMessage({
|
|
content: '请填写文章内容!',
|
|
type: 'warning',
|
|
});
|
|
}
|
|
else if (this.state.html &&
|
|
this.state.html.length > 0 &&
|
|
this.state.html !== '<p><br></p>') {
|
|
this.setMessage({
|
|
content: '请填写文章标题!',
|
|
type: 'warning',
|
|
});
|
|
}
|
|
},
|
|
setHtml(html) {
|
|
this.setState({
|
|
html,
|
|
});
|
|
},
|
|
gotoPreview(content, title) {
|
|
const { onArticlePreview } = this.props;
|
|
onArticlePreview && onArticlePreview(content, title);
|
|
},
|
|
},
|
|
});
|