You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
77 lines
2.2 KiB
77 lines
2.2 KiB
<script> |
|
import { useTinyRouter } from 'svelte-tiny-router'; |
|
import { t } from '../../translations.svelte.js'; |
|
|
|
import CompanySelector from '../../Components/CompanySelector.svelte'; |
|
import Settings from './Settings.svelte'; |
|
let showSettings = $state(false); |
|
let ready = $derived(!!project.name.trim()) |
|
let error = $state(null); |
|
const router = useTinyRouter(); |
|
|
|
let project = $state({ |
|
name:'', |
|
description:'', |
|
settings:{ |
|
show_closed:false |
|
} |
|
}); |
|
|
|
async function onsubmit(ev){ |
|
ev.preventDefault(); |
|
const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/project`; |
|
var resp = await fetch(url,{ |
|
credentials: 'include', |
|
method: 'POST', |
|
body: JSON.stringify(project) |
|
}); |
|
if (resp.ok){ |
|
var newProject = await resp.json(); |
|
router.navigate(`/project/${newProject.id}/view`); |
|
} else { |
|
error = await resp.text(); |
|
} |
|
} |
|
|
|
function onselect(company){ |
|
project.company_id = company.id; |
|
console.log(project); |
|
} |
|
</script> |
|
|
|
<style> |
|
label{ display: block } |
|
</style> |
|
|
|
{#if error} |
|
<span class="error">{error}</span> |
|
{/if} |
|
<form {onsubmit}> |
|
<fieldset> |
|
<legend> |
|
{t('create_new_project')} |
|
</legend> |
|
<fieldset> |
|
<legend>{t('basic_data')}</legend> |
|
<label> |
|
<CompanySelector caption={t('no_company')} {onselect} /> |
|
{t('company_optional')} |
|
</label> |
|
<label> |
|
<input type="text" bind:value={project.name}/> |
|
{t('Name')} |
|
</label> |
|
<label> |
|
<textarea bind:value={project.description}></textarea> |
|
{t('description')} |
|
</label> |
|
{#if !showSettings} |
|
<button onclick={() => showSettings = true}>{t('extended_settings')}</button> |
|
{/if} |
|
</fieldset> |
|
{#if showSettings} |
|
<Settings bind:settings={project.settings}/> |
|
{/if} |
|
<button type="submit" disabled={!ready}>{t('create')}</button> |
|
</fieldset> |
|
</form> |