waw les formations trop belles
This commit is contained in:
parent
6b0129987c
commit
c596846a6c
@ -1,32 +1,50 @@
|
||||
<search>
|
||||
<label>
|
||||
<input oninput={search} type="input" placeholder= {state.formation}>
|
||||
<p class="error"></p>
|
||||
<input oninput={searchF} type="input" placeholder= {state.formation}>
|
||||
<div id="list-formations">
|
||||
<ul>
|
||||
<li each={item in this.state.items}>
|
||||
<a href={item.path} target="_blank">{item.name}</a>
|
||||
<span>{item.count}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<script>
|
||||
import model from '../javascript/modelSearch.js';
|
||||
import Controller from '../javascript/controllerSearch.js';
|
||||
import View from '../javascript/viewSearch.js';
|
||||
|
||||
async function formation(){
|
||||
let result = await fetch("https://data.enseignementsup-recherche.gouv.fr/api/records/1.0/search/?dataset=fr-esr-parcoursup&q=&sort=tri&facet=fili&timezone=Europe%2FBerlin")
|
||||
let resultats = await result.json()
|
||||
let table = resultats["facet_groups"][0]["facets"]
|
||||
return table
|
||||
}
|
||||
|
||||
export default function search(){
|
||||
return {
|
||||
onBeforeMount(props, state) {
|
||||
// initial state
|
||||
this.state = {
|
||||
formation: props.formation
|
||||
formation: props.formation,
|
||||
items: null
|
||||
}
|
||||
formation().then((response) => {
|
||||
this.update({
|
||||
items: response
|
||||
})
|
||||
})
|
||||
console.log(this.state.items)
|
||||
},
|
||||
search(){
|
||||
|
||||
console.log("test1")
|
||||
const view = new View()
|
||||
const app = new Controller(view,model)
|
||||
searchF(){
|
||||
formation().then((response) => {
|
||||
this.update({
|
||||
items: response
|
||||
})
|
||||
})
|
||||
console.log(this.state.items)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
</search>
|
||||
52
components/testformation.riot
Normal file
52
components/testformation.riot
Normal file
@ -0,0 +1,52 @@
|
||||
<formation>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.3/css/bulma.min.css">
|
||||
<table class="table is-fullwidth is-hoverable">
|
||||
<tbody1>
|
||||
<tr >
|
||||
<th></th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</tbody1>
|
||||
</table>
|
||||
|
||||
<script>
|
||||
async function formation (){
|
||||
|
||||
|
||||
|
||||
let result = await fetch("https://data.enseignementsup-recherche.gouv.fr/api/records/1.0/search/?dataset=fr-esr-parcoursup&q=&sort=tri&facet=fili&timezone=Europe%2FBerlin")
|
||||
let resultats = await result.json()
|
||||
console.log(result)
|
||||
console.log(resultats)
|
||||
let base=[]
|
||||
let filieretable=[]
|
||||
let filieredetail=[]
|
||||
|
||||
let table = resultats["facet_groups"][0]["facets"]
|
||||
console.log(table)
|
||||
|
||||
const tableBody = document.querySelector("tbody1")
|
||||
for(tes of table){
|
||||
const tableRow = document.createElement("tr")
|
||||
|
||||
const formationCell = document.createElement("td")
|
||||
let texteformation = document.createTextNode(tes.name)
|
||||
formationCell.appendChild(texteformation)
|
||||
tableRow.appendChild(formationCell)
|
||||
|
||||
const nombredeplaceCell = document.createElement("td")
|
||||
const nombredeplace = document.createTextNode(tes.count)
|
||||
nombredeplaceCell.appendChild(nombredeplace)
|
||||
tableRow.appendChild(nombredeplaceCell)
|
||||
|
||||
tableBody.appendChild(tableRow)
|
||||
}
|
||||
}
|
||||
export default{
|
||||
onMounted(){
|
||||
formation()
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
</formation>
|
||||
@ -4,7 +4,7 @@
|
||||
<title>Parcoursup</title>
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<link rel="stylesheet" href="style/parcoursup.css">
|
||||
<script src="search.riot" type="riot"></script>
|
||||
<script src="components/search.riot" type="riot"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/riot/7.1.0/riot+compiler.min.js" integrity="sha512-sSGKGR9MvL0bUx3CScaBb56crXwspwDkL/JnB0IrLFQfw3uvSUlITQtsTtDZctshhv5wdwIt+qZeN8zThRF4Dw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
</head>
|
||||
|
||||
@ -14,7 +14,9 @@
|
||||
<script>
|
||||
riot.compile().then(() => {
|
||||
riot.mount('search', {
|
||||
formation:'Formation'
|
||||
formation:'Formation',
|
||||
items: null,
|
||||
text: null
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
@ -1,31 +0,0 @@
|
||||
class Controller {
|
||||
constructor(view,model){
|
||||
this.view = view
|
||||
this.model = model
|
||||
|
||||
this.loading = false
|
||||
this.lastSearch = null
|
||||
this.error = null
|
||||
this.results = []
|
||||
|
||||
this.view.setLoading(false)
|
||||
this.view.bindSearch(this.search.bind(this))
|
||||
}
|
||||
reset() {
|
||||
this.loading = false
|
||||
this.error = null
|
||||
this.results = []
|
||||
}
|
||||
|
||||
async search(formation) {
|
||||
this.model.getFormations(formation).then((response) => {
|
||||
let table = response["facet groups"][0]["facets"]
|
||||
this.view.renderList(table)
|
||||
}).catch((error) => {
|
||||
this.view.renderMessage(error)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
export default Controller
|
||||
|
||||
@ -1,21 +0,0 @@
|
||||
let model = {
|
||||
getFormations(search) {
|
||||
return new Promise((resolve, reject) => {
|
||||
let xhr = new XMLHttpRequest()
|
||||
xhr.open("GET", "/api/records/1.0/search/?dataset=fr-esr-parcoursup&q=&sort=tri&facet=fili&timezone=Europe%2FBerlin")
|
||||
xhr.responseType = "json"
|
||||
|
||||
xhr.onload = (ev) => {
|
||||
if (xhr.status == 200)
|
||||
resolve(xhr.response)
|
||||
}
|
||||
xhr.onerror = () => {
|
||||
reject("error")
|
||||
}
|
||||
xhr.send()
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
export default model
|
||||
@ -1,51 +0,0 @@
|
||||
function debounce(fn, wait) {
|
||||
let timeout
|
||||
|
||||
return (...args) => {
|
||||
clearTimeout(timeout)
|
||||
timeout = setTimeout(() => fn(...args), wait)
|
||||
}
|
||||
}
|
||||
|
||||
class View {
|
||||
constructor(){
|
||||
this.listFormations = document.querySelector("#list-formations")
|
||||
this.inputSearch = document.querySelector("input")
|
||||
this.message = document.querySelector("p.error")
|
||||
}
|
||||
|
||||
_getInput(){
|
||||
return this.inputSearch.value
|
||||
}
|
||||
renderMessage(error){
|
||||
this.message.style.display = "block"
|
||||
this.message.textContent = error
|
||||
}
|
||||
|
||||
renderList(formations){
|
||||
let ul = document.createElement("ul")
|
||||
formations.forEach((formation)=>{
|
||||
let li = document.createElement("li")
|
||||
let a = document.createElement("a")
|
||||
let span = document.createElement("span")
|
||||
//a.href = `test`
|
||||
a.target="_blank"
|
||||
a.textContent = formation.name
|
||||
span.textContent = formation.name
|
||||
|
||||
li.appendChild(a)
|
||||
li.appendChild(span)
|
||||
ul.appendChild(li)
|
||||
})
|
||||
|
||||
this.listFormations.replaceChildren(ul)
|
||||
}
|
||||
|
||||
bindSearch(handler){
|
||||
this.inputSearch.addEventListener("input",debounce((e)=>{
|
||||
handler(this._getInput())
|
||||
},500))
|
||||
}
|
||||
}
|
||||
|
||||
export default View
|
||||
Loading…
Reference in New Issue
Block a user