function PageSource() { let data = { page: null, editor: null, }; function page_get(id) { m.request({ url: '/api', method: "POST", body: { "jsonrpc": "2.0", "method": 'page', "params": { "id": id, "fields": ["id", "title", "typeOf", "content"] }, "id": 1 } }).then( function(result) { if ('result' in result) { data.page = result['result']; } } ); }; function page_update() { m.request({ url: '/api', method: "POST", body: { "jsonrpc": "2.0", "method": 'page.update', "params": { "id": data.page.id, "title": data.page.title, "typeOf": data.page.typeOf, "content": data.page.content }, "id": 1 } }).then( function(result) { if ('result' in result) { m.route.set(`/page/${result['result'].id}`); } } ); }; function editor_init() { let vCode = document.getElementById('page_content'); const {EditorState} = CM["@codemirror/state"]; const {basicSetup, EditorView} = CM["codemirror"];
data.editor = {}; data.editor.state = EditorState.create({ doc: data.page.content, extensions: [ basicSetup, EditorView.updateListener.of(function(e) { data.page.content = e.state.doc.toString(); }) ] }); data.editor.view = new EditorView({ state: data.editor.state, parent: vCode }); }; function editor_remove() { data.editor = null; }; return { oncreate(vnode) { console.log('PageSource.oncreate'); if (data.page!=null) { console.log(data.page); editor_init(); } }, onbeforeremove: function(vnode) { console.log('PageSource.onbeforeremove'); editor_remove(); }, oninit: function(vnode) { console.log('PageSource.oninit'); page_get(vnode.attrs.id); }, onupdate(vnode) { console.log('PageSource.onupdate'); console.log(vnode); if (data.page!=null) { if (data.editor==null) { console.log(data.page); editor_init(); } } }, view: function(vnode) { let result = []; if (data.page!=null) { result.push([ m('div', {class: 'row'}, m('div', {class: 'col h1 py-1'}, [ m(m.route.Link, {class: "btn btn-outline-secondary btn-lg me-2", href: `/page/${data.page.id}`, title: "Список пользователей"}, m('i', {class: 'fa fa-chevron-left'})), 'Редактирование статьи' ]) ), m('hr'), m('div', {class: 'row'}, m('div', {class: 'col py-2'}, [ m('button', {class: 'btn btn-outline-success float-end', type: 'button', onclick: page_update}, [m('i', {class: 'fa fa-save'}), ' Сохранить']), ]) ), m('div', {class: 'form-group mb-2'}, [ m('label', {class: 'form-label'}, 'Текст'), m('div', {id: 'page_content'}) ]), m('div', {class: 'row'}, m('div', {class: 'col py-2'}, [ m('button', {class: 'btn btn-outline-success float-end', type: 'button', onclick: page_update}, [m('i', {class: 'fa fa-save'}), ' Сохранить']), ]) ), ]); }; return result } } };
|