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

WIP on filter

Browse Source 
ref #52
This commit is contained in:
Philipp Dormann 2021-02-12 18:04:10 +01:00
parent e415258787
commit e23821a7cb
1 changed files with 29 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/RunnersOverview.svelte
View File

@ -16,6 +16,7 @@
$: filter__teams = selectedFilter_teams||[]; $: filter__teams = selectedFilter_teams||[];
$: filter__orgs = selectedFilter_orgs||[]; $: filter__orgs = selectedFilter_orgs||[];
$:filterGroupIDs=filter__teams.concat(filter__orgs).map(i=>i.value) $:filterGroupIDs=filter__teams.concat(filter__orgs).map(i=>i.value)
$: allteams = [];
$: teams = []; $: teams = [];
$: orgs = []; $: orgs = [];
$:selectgroups=orgs.map(function(g){ $:selectgroups=orgs.map(function(g){
@ -25,14 +26,26 @@
return {value:g.id,label:g.name} return {value:g.id,label:g.name}
}) })
RunnerTeamService.runnerTeamControllerGetAll().then((val) => { RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
teams = val; allteams = val;
});
RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => { RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
orgs = val; orgs = val;
teams = allteams;
const org_ids=orgs.map(o=>o.id)
for (const i of org_ids) {
teams=teams.filter(t=>t.parentGroup.id!==i)
}
});
}); });
</script> </script>
<hr>
<h4>DEBUG</h4>
{JSON.stringify(filterGroupIDs)} {JSON.stringify(filterGroupIDs)}
<hr>
{JSON.stringify(teams)}
<hr>
{JSON.stringify(orgs)}
<hr>
{#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')} {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')}
{#await runners_promise} {#await runners_promise}
<div <div
@ -54,14 +67,22 @@
<div class="block mb-1"> <div class="block mb-1">
<label for="country" class="text-sm font-medium text-gray-700">Filter by Organization</label> <label for="country" class="text-sm font-medium text-gray-700">Filter by Organization</label>
<Select on:select={(event)=>{ <Select on:select={(event)=>{
console.log(event.detail); console.log("change!");
selectedFilter_orgs=event.detail selectedFilter_orgs=event.detail
}} selectedValue={selectedFilter_orgs} placeholder={$_('datatable.search')} containerClasses="mt-1 py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" items={selectgroups} isMulti={true}></Select> selectedFilter_teams=null;
teams = allteams;
console.log(teams);
const org_ids=orgs.map(o=>o.id)
console.log(org_ids);
for (const i of org_ids) {
teams=teams.filter(t=>t.parentGroup.id!==i)
}
console.log(teams);
}} selectedValue={selectedFilter_orgs} placeholder="Filter by Organization" containerClasses="mt-1 py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" items={selectgroups} isMulti={true}></Select>
<label for="country" class="text-sm font-medium text-gray-700">Filter by Team</label> <label for="country" class="text-sm font-medium text-gray-700">Filter by Team</label>
<Select on:select={(event)=>{ <Select on:select={(event)=>{
console.log(event.detail);
selectedFilter_teams=event.detail selectedFilter_teams=event.detail
}} selectedValue={selectedFilter_teams} placeholder={$_('datatable.search')} containerClasses="mt-1 py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" items={selectteams} isMulti={true}></Select> }} selectedValue={selectedFilter_teams} placeholder="Filter by Team" containerClasses="mt-1 py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" items={selectteams} isMulti={true}></Select>
</div> </div>
<div <div
class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll"> class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">