lfk/frontend
2
0
Fork 0
Code Issues 4 Pull Requests Actions Projects Releases Wiki Activity

First part of org detail address edit

Browse Source 
ref #72
This commit is contained in:
Nicolai Ort
2021-02-19 16:36:17 +01:00
parent 4f3f7d1edb
commit e5c31c9dd4
1 changed files with 110 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

125
src/components/orgs/OrgDetail.svelte
View File

@@ -10,13 +10,18 @@
import ImportRunnerModal from "../runners/ImportRunnerModal.svelte";
import PromiseError from "../base/PromiseError.svelte";
$: delete_triggered = false;
$: save_enabled = !data_changed;
$: save_enabled = (data_changed && ((isAddress1Valid && iszipcodevalid && iscityvalid) ||
orgdata.address_checked === false));
export let params;
let orgdata = {};
let original = {};
$: orgdata = {};
$: original = {};
let contacts = [];
$: data_loaded = false;
$: data_changed = JSON.stringify(orgdata) === JSON.stringify(original);
$: data_changed = !(JSON.stringify(orgdata) === JSON.stringify(original));
$: isAddress1Valid = orgdata.address?.address1?.trim().length !== 0;
$: iszipcodevalid = orgdata.address?.postalcode?.trim().length !== 0;
$: iscityvalid = orgdata.address?.city?.trim().length !== 0;
const promise = RunnerOrganizationService.runnerOrganizationControllerGetOne(
params.orgid
).then((value) => {
@@ -28,6 +33,8 @@
}
orgdata = Object.assign(orgdata, value);
original = Object.assign(original, value);
orgdata.address_checked = orgdata.address.address1 !== null;
original.address_checked = orgdata.address.address1 !== null;
});
GroupContactService.groupContactControllerGetAll().then((val) => {
contacts = val;
@@ -59,6 +66,9 @@
duration: 2500,
}).showToast();
let postdata = orgdata;
if (postdata.address_checked === false) {
postdata.address = {};
}
postdata.contact = postdata.contact === "null" ? null : postdata.contact;
RunnerOrganizationService.runnerOrganizationControllerPut(
original.id,
@@ -138,6 +148,10 @@
{/if}
</span>
</div>
<p>Displayed: {data_changed}</p>
<p>Target: {!(JSON.stringify(orgdata.address) === JSON.stringify(original.address))}</p>
<p>Edit: {JSON.stringify(orgdata.address)}</p>
<p>Original: {JSON.stringify(original.address)}</p>
<div class="flex flex-row mb-4">
<div class="w-full">
<nav class="w-full flex">
@@ -237,18 +251,99 @@
{/each}
</select>
</div>
<div class="text-sm w-full">
<label
for="address"
class="font-medium text-gray-700">{$_('address')}</label>
<input
autocomplete="off"
placeholder={$_('address')}
type="text"
bind:value={orgdata.address}
name="address"
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
<!-- -->
<div class="flex items-start mt-2">
<div class="flex items-center h-5">
<input
bind:checked={orgdata.address_checked}
id="comments"
name="comments"
type="checkbox"
class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
</div>
<div class="ml-3 text-sm">
<label
for="comments"
class="font-medium text-gray-700">{$_('address')}</label>
</div>
</div>
{#if orgdata.address_checked === true}
<div class="col-span-6">
<label
for="address1"
class="block text-sm font-medium text-gray-700">{$_('address')}</label>
<input
autocomplete="off"
placeholder="Address"
class:border-red-500={!isAddress1Valid}
class:focus:border-red-500={!isAddress1Valid}
class:focus:ring-red-500={!isAddress1Valid}
bind:value={orgdata.address.address1}
type="text"
name="address1"
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
{#if !isAddress1Valid}
<span
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
{$_('address-is-required')}
</span>
{/if}
</div>
<div class="col-span-6">
<label
for="address2"
class="block text-sm font-medium text-gray-700">{$_('apartment-suite-etc')}</label>
<input
autocomplete="off"
placeholder={$_('apartment-suite-etc')}
bind:value={orgdata.address.address2}
type="text"
name="address2"
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
</div>
<div class="col-span-6">
<label
for="zipcode"
class="block text-sm font-medium text-gray-700">{$_('zip-postal-code')}</label>
<input
autocomplete="off"
placeholder={$_('zip-postal-code')}
class:border-red-500={!iszipcodevalid}
class:focus:border-red-500={!iszipcodevalid}
class:focus:ring-red-500={!iszipcodevalid}
bind:value={orgdata.address.postalcode}
type="text"
name="zipcode"
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
{#if !iszipcodevalid}
<span
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
{$_('valid-zipcode-postal-code-is-required')}
</span>
{/if}
</div>
<div class="col-span-6">
<label
for="city"
class="block text-sm font-medium text-gray-700">{$_('city')}</label>
<input
autocomplete="off"
placeholder={$_('city')}
class:border-red-500={!iscityvalid}
class:focus:border-red-500={!iscityvalid}
class:focus:ring-red-500={!iscityvalid}
bind:value={orgdata.address.city}
type="text"
name="city"
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
{#if !iscityvalid}
<span
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
{$_('valid-city-is-required')}
</span>
{/if}
</div>
{/if}
</section>
{:else}
{#await promise}