Implemented rough outside click handler for the dropdown

ref #84
This commit is contained in:
Nicolai Ort 2021-02-28 17:39:21 +01:00
parent 9fec315910
commit c2bd696bfe
6 changed files with 116 additions and 51 deletions

View File

@ -55,6 +55,14 @@
});
let modal_open = false;
let delete_org = {};
document.addEventListener("click", function (e) {
if (
e.target.parentNode.parentNode.id != "sponsoring:dropdown" &&
e.target.parentNode.parentNode.id != "sponsoring:dropdown:menu"
) {
sponsoring_contracts_download_open = false;
}
});
function deleteOrganization() {
RunnerOrganizationService.runnerOrganizationControllerRemove(
original_object.id,
@ -185,7 +193,8 @@
</div>
{#if sponsoring_contracts_download_open}
<div
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5">
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
id="sponsoring:dropdown:menu">
<div
class="py-1"
role="menu"

View File

@ -18,6 +18,15 @@
}
);
document.addEventListener("click", function (e) {
if (
e.target.parentNode.parentNode.id != "sponsoring:dropdown" &&
e.target.parentNode.parentNode.id != "sponsoring:dropdown:menu"
) {
sponsoring_contracts_download_open = false;
}
});
async function generateSponsoringContract(locale) {
sponsoring_contracts_download_open = false;
const orgs = current_organizations.filter((r) => r.is_selected === true);
@ -120,7 +129,8 @@
</div>
{#if sponsoring_contracts_download_open}
<div
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5">
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
id="sponsoring:dropdown:menu">
<div
class="py-1"
role="menu"

View File

@ -33,6 +33,14 @@
original_data.group = original_data.group.id;
editable = Object.assign(editable, original_data);
});
document.addEventListener("click", function (e) {
if (
e.target.parentNode.parentNode.id != "sponsoring:dropdown" &&
e.target.parentNode.parentNode.id != "sponsoring:dropdown:menu"
) {
sponsoring_contracts_download_open = false;
}
});
let orgs = [];
RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
orgs = val;
@ -203,7 +211,8 @@
</div>
{#if sponsoring_contracts_download_open}
<div
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5">
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
id="sponsoring:dropdown:menu">
<div
class="py-1"
role="menu"

View File

@ -31,6 +31,14 @@
return { value: g.id, label: g.name };
})
.concat(mappedteams);
document.addEventListener("click", function (e) {
if (
e.target.parentNode.parentNode.id != "sponsoring:dropdown" &&
e.target.parentNode.parentNode.id != "sponsoring:dropdown:menu"
) {
sponsoring_contracts_download_open = false;
}
});
RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
teams = val;
});
@ -141,12 +149,23 @@
aria-haspopup="true"
aria-expanded="true">
{$_('generate-sponsoring-contracts')}
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" class="-mr-1 ml-2 h-5 w-5"><path fill="none" d="M0 0h24v24H0z"/><path fill="currentColor" d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z"/></svg>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
class="-mr-1 ml-2 h-5 w-5"><path
fill="none"
d="M0 0h24v24H0z" />
<path
fill="currentColor"
d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
</button>
</div>
{#if sponsoring_contracts_download_open}
<div
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5">
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
id="sponsoring:dropdown:menu">
<div
class="py-1"
role="menu"

View File

@ -44,6 +44,14 @@
GroupContactService.groupContactControllerGetAll().then((val) => {
contacts = val;
});
document.addEventListener("click", function (e) {
if (
e.target.parentNode.parentNode.id != "sponsoring:dropdown" &&
e.target.parentNode.parentNode.id != "sponsoring:dropdown:menu"
) {
sponsoring_contracts_download_open = false;
}
});
function deleteTeam() {
RunnerTeamService.runnerTeamControllerRemove(original.id, false)
.then((resp) => {
@ -167,7 +175,8 @@
</div>
{#if sponsoring_contracts_download_open}
<div
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5">
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
id="sponsoring:dropdown:menu">
<div
class="py-1"
role="menu"

View File

@ -18,6 +18,14 @@
teams_promise.then((data) => {
usersstore.set(data);
});
document.addEventListener("click", function (e) {
if (
e.target.parentNode.parentNode.id != "sponsoring:dropdown" &&
e.target.parentNode.parentNode.id != "sponsoring:dropdown:menu"
) {
sponsoring_contracts_download_open = false;
}
});
async function generateSponsoringContract(locale) {
sponsoring_contracts_download_open = false;
const teams = current_teams.filter((r) => r.is_selected === true);
@ -120,7 +128,8 @@
</div>
{#if sponsoring_contracts_download_open}
<div
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5">
class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
id="sponsoring:dropdown:menu">
<div
class="py-1"
role="menu"