parent
45e7f6a0d1
commit
7138ca1f5f
@ -43,14 +43,17 @@
|
||||
$: address_zipcode_value = "";
|
||||
$: address_city_value = "";
|
||||
$: processed_last_submit = true;
|
||||
$: address_checked = true;
|
||||
$: isPhoneValidOrEmpty =
|
||||
phone_input_value.includes("+")&&isMobilePhone(
|
||||
phone_input_value
|
||||
.replaceAll("(", "")
|
||||
.replaceAll(")", "")
|
||||
.replaceAll("-", "")
|
||||
.replaceAll(" ", "")
|
||||
) || phone_input_value === "";
|
||||
(phone_input_value.includes("+") &&
|
||||
isMobilePhone(
|
||||
phone_input_value
|
||||
.replaceAll("(", "")
|
||||
.replaceAll(")", "")
|
||||
.replaceAll("-", "")
|
||||
.replaceAll(" ", "")
|
||||
)) ||
|
||||
phone_input_value === "";
|
||||
$: isEmailValidOrEmpty =
|
||||
isEmail(email_input_value) || email_input_value === "";
|
||||
$: isLastnameValid = lastname_input_value.trim().length !== 0;
|
||||
@ -62,7 +65,9 @@
|
||||
isFirstnameValid &&
|
||||
isLastnameValid &&
|
||||
isEmailValidOrEmpty &&
|
||||
isPhoneValidOrEmpty&&isAddress1Valid&&iszipcodevalid&&iscityvalid;
|
||||
isPhoneValidOrEmpty &&
|
||||
((isAddress1Valid && iszipcodevalid && iscityvalid) ||
|
||||
address_checked === false);
|
||||
(() => {
|
||||
document.onkeydown = (e) => {
|
||||
e = e || window.event;
|
||||
@ -84,18 +89,22 @@
|
||||
text: "Contact is being added...",
|
||||
duration: -1,
|
||||
}).showToast();
|
||||
const groups=teams.concat(orgs).map(g=>g.id)
|
||||
const groups = teams.concat(orgs).map((g) => g.id);
|
||||
let address = {};
|
||||
if (address_checked === true) {
|
||||
address = {
|
||||
address1: address_input1_value,
|
||||
address2: address_input2_value || "",
|
||||
postalcode: address_zipcode_value,
|
||||
city: address_city_value,
|
||||
country: "DE",
|
||||
};
|
||||
}
|
||||
let postdata = {
|
||||
groups: groups,
|
||||
groups,
|
||||
firstname: firstname_input_value,
|
||||
lastname: lastname_input_value,
|
||||
address: {
|
||||
address1:address_input1_value,
|
||||
address2:address_input2_value||"",
|
||||
postalcode:address_zipcode_value,
|
||||
city:address_city_value,
|
||||
country:"DE",
|
||||
}
|
||||
address,
|
||||
};
|
||||
if (middlename_input_value) {
|
||||
postdata.middlename = middlename_input_value;
|
||||
@ -161,8 +170,15 @@
|
||||
<div class="sm:flex sm:items-start">
|
||||
<div
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
|
||||
<svg class="h-6 w-6 text-blue-600"
|
||||
fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M2 22a8 8 0 1 1 16 0H2zm8-9c-3.315 0-6-2.685-6-6s2.685-6 6-6 6 2.685 6 6-2.685 6-6 6zm10 4h4v2h-4v-2zm-3-5h7v2h-7v-2zm2-5h5v2h-5V7z"/></svg>
|
||||
<svg
|
||||
class="h-6 w-6 text-blue-600"
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M2 22a8 8 0 1 1 16 0H2zm8-9c-3.315 0-6-2.685-6-6s2.685-6 6-6 6 2.685 6 6-2.685 6-6 6zm10 4h4v2h-4v-2zm-3-5h7v2h-7v-2zm2-5h5v2h-5V7z" /></svg>
|
||||
</div>
|
||||
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
@ -297,86 +313,104 @@
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<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={address_input1_value}
|
||||
bind:this={address_input1}
|
||||
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={address_input2_value}
|
||||
bind:this={address_input2}
|
||||
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={address_zipcode_value}
|
||||
bind:this={address_zipcode}
|
||||
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={address_city_value}
|
||||
bind:this={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 class="flex items-start">
|
||||
<div class="flex items-center h-5">
|
||||
<input
|
||||
bind:checked={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 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={address_input1_value}
|
||||
bind:this={address_input1}
|
||||
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={address_input2_value}
|
||||
bind:this={address_input2}
|
||||
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={address_zipcode_value}
|
||||
bind:this={address_zipcode}
|
||||
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={address_city_value}
|
||||
bind:this={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}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
Loading…
x
Reference in New Issue
Block a user