infidel/ocp-wg-frontend
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

MAJOR IMPROVEMENTS:

Browse Source 
* bind value can sync accross components <profileView + wgProfile + wgControl + wgFilter>
* Table select on wgFilter can trigger filtered request to backend
* Table select on wgFilter can trigger filtered request to backend
* Table select on wgFilter can trigger filtered request to backend
* Table select on wgFilter can trigger filtered request to backend
This commit is contained in:
infidel 2022-11-23 12:03:00 +07:00
parent 6e2e9e8e75
commit 29153b4c41
6 changed files with 39 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package-lock.json generated
View File

@ -24,7 +24,7 @@
"@rollup/plugin-node-resolve": "11.2.0",
"autoprefixer": "10.2.5",
"postcss": "8.2.8",
"rollup": "2.41.5",
"rollup": "^2.41.5",
"rollup-plugin-livereload": "2.0.0",
"rollup-plugin-svelte": "7.1.0",
"rollup-plugin-terser": "7.0.2",

2
package.json
View File

@ -18,7 +18,7 @@
"@rollup/plugin-node-resolve": "11.2.0",
"autoprefixer": "10.2.5",
"postcss": "8.2.8",
"rollup": "2.41.5",
"rollup": "^2.41.5",
"rollup-plugin-livereload": "2.0.0",
"rollup-plugin-svelte": "7.1.0",
"rollup-plugin-terser": "7.0.2",

25
src/components/Cards/CardWGControl.svelte
View File

@ -5,16 +5,22 @@
import CardWGFilter from "components/Cards/CardWGFilter.svelte";
import Modal from "components/Modals/Modals.svelte"
import CardWGControl from "components/Cards/CardWGControl.svelte";
export let filter;
let showModal = false;
let showFilter = false;
export let filter = null;
let submitFilter = null;
let submitFilter = "";
filter = submitFilter;
$: submitFilter != ""?
filter = submitFilter : filter = "";
function toggleModal(){
showModal = !showModal;
showFilter = false;
showFilter = false;
console.log("Modal...");
}
@ -24,19 +30,12 @@
function toggleFilter(){
showFilter = !showFilter;
showModal = false;
filter = submitFilter;
showModal = false;
console.log("toggle Filter...");
console.log(filter);
}
function getwgResponse(param) {
const wgResponse = fetch(
'/api2/wgClients?filter='+param
);
return wgResponse;
}
</script>
@ -126,7 +125,7 @@
class="relative flex flex-col min-w-0 break-words w-full mb-6 shadow-lg rounded-lg bg-blueGray-100 border-0"
>
<div class="flex-auto px-4 lg:px-10 py-10 pt-0">
<CardWGFilter bind:submitFilter={submitFilter} on:submit={handleOnSubmit} />
<CardWGFilter bind:submitFilter={submitFilter} on:submit={handleOnSubmit}></CardWGFilter >
</div>
</div>
</div>

33
src/components/Cards/CardWGFilter.svelte
View File

@ -1,10 +1,22 @@
<script>
export let submitFilter = null;
function validate() {
export let submitFilter;
const validate = (e) => {
const formData = new FormData(e.target)
console.log(formData);
const data = {};
for (let field of formData) {
const [key, value] = field;
data[key] = value;
}
console.log(data);
console.log("I'm the tester function");
submitFilter = "meta";
submitFilter = data["org"];
console.log(submitFilter);
}
</script>
<form on:submit|preventDefault={validate}>
@ -18,16 +30,9 @@
class="block uppercase text-blueGray-600 text-xs font-bold mb-2"
for="grid-username"
>
Username
Fuckery
</label>
<select class="border-0 px-3 py-3 placeholder-blueGray-300 text-blueGray-600 bg-white rounded text-sm shadow focus:outline-none focus:ring w-full ease-linear transition-all duration-150" >
<option class="text-blueGray-100" value="" disabled selected>Select the Organization</option>
<option>GCI</option>
<option>META</option>
<option>PH-Training</option>
</select>
<input class="border-0 px-3 py-3 placeholder-blueGray-300 text-blueGray-600 bg-white rounded text-sm shadow focus:outline-none focus:ring w-full ease-linear transition-all duration-150" id="fuckery" type="text" name="Fuckery_name" />
</div>
<div class="relative w-full mb-3">
@ -37,7 +42,7 @@
>
Organization
</label>
<select class="border-0 px-3 py-3 placeholder-blueGray-300 text-blueGray-600 bg-white rounded text-sm shadow focus:outline-none focus:ring w-full ease-linear transition-all duration-150" >
<select name="org" class="border-0 px-3 py-3 placeholder-blueGray-300 text-blueGray-600 bg-white rounded text-sm shadow focus:outline-none focus:ring w-full ease-linear transition-all duration-150" >
<option class="text-blueGray-100" value="" disabled selected>Select the Organization</option>
<option value="gci">GCI</option>
<option value="meta">META</option>
@ -52,7 +57,7 @@
>
Email Domain
</label>
<select class="border-0 px-3 py-3 placeholder-blueGray-300 text-blueGray-600 bg-white rounded text-sm shadow focus:outline-none focus:ring w-full ease-linear transition-all duration-150" >
<select name="email_domain" class="border-0 px-3 py-3 placeholder-blueGray-300 text-blueGray-600 bg-white rounded text-sm shadow focus:outline-none focus:ring w-full ease-linear transition-all duration-150" >
<option class="text-blueGray-100" value="" disabled selected>Select the Organization</option>
<option>GCI</option>
<option>META</option>

7
src/components/Cards/CardWGProfiles.svelte
View File

@ -5,7 +5,7 @@
let promise;
export let wgResponse = null;
export let filter = null;
export let filter = "";
async function getwgResponse(o_filter) {
const wgResponse = await fetch(
@ -16,8 +16,9 @@
}
// let promise = getwgResponse();
$: filter != null ?
promise = getwgResponse(filter) : promise = getwgReseponse("");
$: filter != ""?
promise = getwgResponse(filter) : promise = getwgResponse("");
// core components

4
src/views/admin/wgProfiles.svelte
View File

@ -6,8 +6,8 @@
import CardWGControl from "components/Cards/CardWGControl.svelte";
let wgResponse = null;
let filter = "";
let unique = {};
let filter = "";
let unique = {};
let wgProfileFetch = [];