47 lines
2.9 KiB
JavaScript
47 lines
2.9 KiB
JavaScript
// Neues Ticket anlegen (auch aus dem Rechtsklick-Menü und per Tastenkürzel mit vorbefülltem Text).
|
|
import { h, clear, toast, errText } from '../lib/dom.js';
|
|
import { apiCall, getMeta, plainToHtml } from '../lib/core.js';
|
|
import { spinner, showError } from '../lib/ui.js';
|
|
|
|
export async function renderCreate(host, ctx) {
|
|
host.append(spinner());
|
|
let meta;
|
|
try { meta = await getMeta(); } catch (e) { return showError(ctx, host, e); }
|
|
const { prefill } = await chrome.storage.local.get('prefill');
|
|
if (prefill) chrome.storage.local.remove('prefill');
|
|
clear(host);
|
|
const me = ctx.session.staff?.id;
|
|
const f = {
|
|
name: h('input', { type: 'text', required: true, maxlength: '120', placeholder: 'Name des Anfragers' }),
|
|
mail: h('input', { type: 'email', placeholder: 'optional' }),
|
|
subject: h('input', { type: 'text', value: prefill?.subject || '', required: true, maxlength: '255' }),
|
|
message: h('textarea', { required: true, value: prefill?.message || '' }),
|
|
dept: h('select', { required: true }, meta.departments.map((d) => h('option', { value: d.id }, d.name))),
|
|
prio: h('select', { required: true }, meta.priorities.map((p) => h('option', { value: p.id }, p.name))),
|
|
who: h('select', {}, h('option', { value: '' }, 'Nicht zuweisen'), h('option', { value: me, selected: '' }, 'Mir zuweisen'), meta.agents.filter((a) => a.id !== me).map((a) => h('option', { value: a.id }, a.name))),
|
|
notify: h('input', { type: 'checkbox' }),
|
|
};
|
|
const submit = h('button', { class: 'btn primary', type: 'submit' }, 'Ticket anlegen');
|
|
const out = h('div');
|
|
host.append(h('form', { class: 'stack', onsubmit: async (ev) => {
|
|
ev.preventDefault(); clear(out); submit.disabled = true;
|
|
try {
|
|
const { data } = await apiCall('ticket_create.php', { method: 'POST', body: {
|
|
requesterName: f.name.value.trim(), requesterEmail: f.mail.value.trim(), subject: f.subject.value.trim(), message: plainToHtml(f.message.value.trim()),
|
|
departmentId: Number(f.dept.value), priorityId: Number(f.prio.value), assignedStaffId: f.who.value ? Number(f.who.value) : null, notifyCustomer: f.notify.checked } });
|
|
const number = data.ticket?.number;
|
|
toast(`Ticket #${number} angelegt`);
|
|
if (number) ctx.go('ticket', { number });
|
|
} catch (e) { if (e.status === 401) return ctx.logoutExpired(); out.append(h('div', { class: 'msg err', role: 'alert' }, errText(e))); }
|
|
submit.disabled = false;
|
|
} },
|
|
h('div', { class: 'card stack' },
|
|
h('label', {}, 'Anfrager (Name)', f.name), h('label', {}, 'Anfrager (E-Mail)', f.mail),
|
|
h('label', {}, 'Betreff', f.subject), h('label', {}, 'Beschreibung', f.message),
|
|
h('div', { class: 'row2' }, h('label', {}, 'Abteilung', f.dept), h('label', {}, 'Priorität', f.prio)),
|
|
h('label', {}, 'Bearbeiter', f.who),
|
|
h('label', { class: 'inline' }, f.notify, 'Kunden per E-Mail benachrichtigen')),
|
|
out, submit));
|
|
f.name.focus();
|
|
}
|