feat: allow to search by code INSEE in communes importer (#2188)

Otherwise when searching for a very commun name (like "Saint-Paul"), one
may not find the right one among the x returned results.

![Screenshot from 2024-10-03
16-59-39](https://github.com/user-attachments/assets/662c0d13-2c85-4159-b37e-19247bf838b8)


![Screenshot from 2024-10-03
16-53-49](https://github.com/user-attachments/assets/a19c405c-ea2b-4359-9db1-95101fb6012d)

![Screenshot from 2024-10-03
17-00-55](https://github.com/user-attachments/assets/65705a87-ee24-4e50-acbb-069565a70c75)
This commit is contained in:
Yohan Boniface 2024-10-04 15:47:15 +02:00 committed by GitHub
commit a2d0d14857
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 18 additions and 2 deletions

View file

@ -249,6 +249,10 @@ export class BaseAjax extends BaseAutocomplete {
} }
} }
buildUrl(value) {
return Util.template(this.url, { q: encodeURIComponent(value) })
}
async search() { async search() {
let val = this.input.value let val = this.input.value
if (val.length < this.options.minChar) { if (val.length < this.options.minChar) {
@ -258,7 +262,7 @@ export class BaseAjax extends BaseAutocomplete {
if (val === this.cache) return if (val === this.cache) return
this.cache = val this.cache = val
val = val.toLowerCase() val = val.toLowerCase()
const url = Util.template(this.url, { q: encodeURIComponent(val) }) const url = this.buildUrl(val)
this.handleResults(await this._search(url)) this.handleResults(await this._search(url))
} }

View file

@ -1,5 +1,6 @@
import { DomUtil } from '../../../vendors/leaflet/leaflet-src.esm.js' import { DomUtil } from '../../../vendors/leaflet/leaflet-src.esm.js'
import { BaseAjax, SingleMixin } from '../autocomplete.js' import { BaseAjax, SingleMixin } from '../autocomplete.js'
import * as Util from '../utils.js'
class Autocomplete extends SingleMixin(BaseAjax) { class Autocomplete extends SingleMixin(BaseAjax) {
createResult(item) { createResult(item) {
@ -8,6 +9,17 @@ class Autocomplete extends SingleMixin(BaseAjax) {
label: `${item.nom} (${item.code})`, label: `${item.nom} (${item.code})`,
}) })
} }
buildUrl(value) {
let url = this.url
let options = { q: encodeURIComponent(value) }
const re = /^(0[1-9]|[1-9][ABab\d])\d{3}$/gm
if (re.test(value)) {
url = "https://geo.api.gouv.fr/communes?code={code}&limit=5"
options = { code: encodeURIComponent(value) }
}
return Util.template(url, options)
}
} }
export class Importer { export class Importer {
@ -25,7 +37,7 @@ export class Importer {
textContent: "Importer les contours d'une commune française.", textContent: "Importer les contours d'une commune française.",
}) })
const options = { const options = {
placeholder: 'Commune…', placeholder: 'Nom ou code INSEE…',
url: 'https://geo.api.gouv.fr/communes?nom={q}&limit=5', url: 'https://geo.api.gouv.fr/communes?nom={q}&limit=5',
on_select: (choice) => { on_select: (choice) => {
importer.url = `https://geo.api.gouv.fr/communes?code=${choice.item.value}&format=geojson&geometry=contour` importer.url = `https://geo.api.gouv.fr/communes?code=${choice.item.value}&format=geojson&geometry=contour`