82 lines
3.3 KiB
JavaScript
Executable File
82 lines
3.3 KiB
JavaScript
Executable File
import { apiAction, toast } from './api.js';
|
|
export function initCreate(){
|
|
const btn=document.getElementById('btn-new'), dlg=document.getElementById('createDialog'), form=document.getElementById('createForm'), fields=document.getElementById('createFields'), hint=document.getElementById('createHint');
|
|
if(!btn||!dlg||!form||!fields) return;
|
|
const normalizeApiName=(v='')=>{
|
|
return String(v)
|
|
.trim()
|
|
.toLowerCase()
|
|
.replace(/\s+/g,'-')
|
|
.replace(/[^a-z0-9_-]+/g,'-')
|
|
.replace(/-+/g,'-')
|
|
.replace(/^-|-$/g,'');
|
|
};
|
|
|
|
btn.onclick = async ()=>{
|
|
const section = window.__activeSection || null;
|
|
if (!section) {
|
|
toast('Bitte zuerst eine Section auswählen', false);
|
|
return;
|
|
}
|
|
const isTemplate = Number(section.is_template) === 1;
|
|
fields.innerHTML='';
|
|
const name=document.createElement('input'); name.type='text'; name.required=true; name.placeholder='Name*'; name.className='w-full border rounded-lg px-3 py-2'; name.id='f-name'; fields.appendChild(name);
|
|
let apiName = null;
|
|
let apiTouched = false;
|
|
const addEditorSelect = () => {
|
|
const editorSelect = document.createElement('select');
|
|
editorSelect.id = 'f-editor-type';
|
|
editorSelect.className = 'w-full border rounded-lg px-3 py-2';
|
|
editorSelect.innerHTML = `
|
|
<option value="grapesjs">GrapesJS</option>
|
|
<option value="craftjs">Craft.js</option>
|
|
`;
|
|
const defaultEditor = (window.__editorDefault || 'grapesjs').toLowerCase();
|
|
editorSelect.value = defaultEditor === 'craftjs' ? 'craftjs' : 'grapesjs';
|
|
fields.appendChild(editorSelect);
|
|
};
|
|
|
|
if(isTemplate){
|
|
apiName=document.createElement('input');
|
|
apiName.type='text';
|
|
apiName.required=true;
|
|
apiName.placeholder='API Name* (ohne Leerzeichen)';
|
|
apiName.className='w-full border rounded-lg px-3 py-2';
|
|
apiName.id='f-api-name';
|
|
fields.appendChild(apiName);
|
|
addEditorSelect();
|
|
apiName.addEventListener('input', ()=>{
|
|
apiTouched = true;
|
|
const next = normalizeApiName(apiName.value);
|
|
if (next !== apiName.value) apiName.value = next;
|
|
});
|
|
name.addEventListener('input', ()=>{
|
|
if (!apiTouched) apiName.value = normalizeApiName(name.value);
|
|
});
|
|
}
|
|
if (!isTemplate) addEditorSelect();
|
|
hint.textContent=`Neues Element in ${section.name}`; dlg.showModal();
|
|
|
|
form.onsubmit=async(e)=>{ e.preventDefault();
|
|
const payload={ name:(document.getElementById('f-name')?.value||'').trim() }; if(!payload.name) return;
|
|
if(isTemplate) {
|
|
payload.api_name=(document.getElementById('f-api-name')?.value||'').trim();
|
|
if(!payload.api_name) return;
|
|
}
|
|
payload.editor_type=(document.getElementById('f-editor-type')?.value||'grapesjs');
|
|
payload.html='';
|
|
payload.section_id = section.id;
|
|
const r=await apiAction('content.create', { method:'POST', data: payload });
|
|
if(r&&r.id){
|
|
dlg.close();
|
|
toast('Erstellt',true);
|
|
window.loadList && window.loadList(section);
|
|
} else {
|
|
toast(r?.error || 'Erstellen fehlgeschlagen',false,{duration:3000});
|
|
console.error('Create failed',r);
|
|
}
|
|
};
|
|
};
|
|
const cancel=document.getElementById('createCancel'); cancel && (cancel.onclick=()=>dlg.close());
|
|
}
|