|
|
@@ -77,7 +77,7 @@
|
|
|
<v-col :cols="(listview && $vuetify.breakpoint.mdAndUp) ? 8 : 12">
|
|
|
<v-row class="filters">
|
|
|
<v-col lg="3" :md="listview ? 3 : 6" sm="6" cols="12" class="py-2 px-1">
|
|
|
- <v-select
|
|
|
+ <v-autocomplete
|
|
|
v-model="practicesFilter"
|
|
|
:label="$t('type')"
|
|
|
:items="translatedPractices"
|
|
|
@@ -85,11 +85,12 @@
|
|
|
item-text="label"
|
|
|
filled
|
|
|
hide-details
|
|
|
+ hide-no-data
|
|
|
@change="search"
|
|
|
/>
|
|
|
</v-col>
|
|
|
<v-col lg="3" :md="listview ? 3 : 6" sm="6" cols="12" class="py-2 px-1">
|
|
|
- <v-select
|
|
|
+ <v-autocomplete
|
|
|
v-model="departmentFilter"
|
|
|
:items="departments"
|
|
|
item-value="code"
|
|
|
@@ -97,11 +98,12 @@
|
|
|
:label="$t('department')"
|
|
|
filled
|
|
|
hide-details
|
|
|
+ hide-no-data
|
|
|
@change="search"
|
|
|
/>
|
|
|
</v-col>
|
|
|
<v-col lg="3" :md="listview ? 3 : 6" sm="6" cols="12" class="py-2 px-1">
|
|
|
- <v-select
|
|
|
+ <v-autocomplete
|
|
|
v-model="federationFilter"
|
|
|
:items="federations"
|
|
|
item-value="id"
|
|
|
@@ -109,6 +111,7 @@
|
|
|
:label="$t('federation')"
|
|
|
filled
|
|
|
hide-details
|
|
|
+ hide-no-data
|
|
|
@change="search"
|
|
|
/>
|
|
|
</v-col>
|
|
|
@@ -189,25 +192,21 @@
|
|
|
outlined
|
|
|
:class="'structure-card pa-3 d-flex ' + ((mapview || $vuetify.breakpoint.smAndDown) ? 'flex-column' : 'flex-row align-items-center')"
|
|
|
>
|
|
|
- <div class="d-flex justify-center">
|
|
|
+ <div class="d-flex justify-center max-w100">
|
|
|
<v-img
|
|
|
- :src="structure.logoId ? ('https://api.opentalent.fr/app.php/_internal/secure/files/' + structure.logoId) : '/images/default.jpg'"
|
|
|
+ v-if="structure.logoId"
|
|
|
+ :src="'https://api.opentalent.fr/app.php/_internal/secure/files/' + structure.logoId"
|
|
|
alt="poster"
|
|
|
height="80px"
|
|
|
- min-width="160px"
|
|
|
- max-width="80%"
|
|
|
+ width="240px"
|
|
|
max-height="100%"
|
|
|
:contain="true"
|
|
|
style="margin: 12px;"
|
|
|
/>
|
|
|
+ <div v-else style="height: 104px; width: 264px"></div>
|
|
|
</div>
|
|
|
|
|
|
<div class="d-flex flex-column">
|
|
|
- <v-chip-group v-if="structure.practices" active-class="primary--text">
|
|
|
- <v-chip v-for="practice in structure.practices" :key="practice" outlined small pill>
|
|
|
- {{ $t(practice) }}
|
|
|
- </v-chip>
|
|
|
- </v-chip-group>
|
|
|
|
|
|
<v-card-title class="title">
|
|
|
{{ structure.name }}
|
|
|
@@ -216,26 +215,41 @@
|
|
|
<v-card-text class="infos">
|
|
|
<table>
|
|
|
<tr>
|
|
|
- <td class="py-1 pr-2">
|
|
|
+ <td>
|
|
|
<font-awesome-icon class="icon" :icon="['fas', 'map-marker-alt']" />
|
|
|
</td>
|
|
|
- <td class="py-1">
|
|
|
+ <td>
|
|
|
<span v-if="structure.streetAddress">{{ structure.streetAddress }}<br></span>
|
|
|
<span v-if="structure.postalCode" class="postalCode">{{ structure.postalCode }} </span>
|
|
|
{{ structure.addressCity }}
|
|
|
</td>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
- <td class="py-1 pr-2">
|
|
|
+ <td>
|
|
|
<font-awesome-icon class="icon" :icon="['fas', 'project-diagram']" />
|
|
|
</td>
|
|
|
- <td class="py-1">
|
|
|
- {{ structure.n1Name }}
|
|
|
+ <td>
|
|
|
+ <NuxtLink
|
|
|
+ v-if="structure.n1Id !== parent"
|
|
|
+ class="neutral"
|
|
|
+ :to="{path: '/structures/' + structure.n1Id, query: { parent: parent, view: view, theme: theme }}"
|
|
|
+ nuxt
|
|
|
+ >
|
|
|
+ {{ structure.n1Name }}
|
|
|
+ </NuxtLink>
|
|
|
+ <div v-else>
|
|
|
+ {{ structure.n1Name }}
|
|
|
+ </div>
|
|
|
</td>
|
|
|
</tr>
|
|
|
</table>
|
|
|
</v-card-text>
|
|
|
</div>
|
|
|
+ <v-chip-group v-if="structure.practices" column active-class="primary--text">
|
|
|
+ <v-chip v-for="practice in structure.practices" :key="practice" outlined small pill>
|
|
|
+ {{ $t(practice) }}
|
|
|
+ </v-chip>
|
|
|
+ </v-chip-group>
|
|
|
<span class="flex-fill" />
|
|
|
|
|
|
<v-card-actions :class="listview ? 'align-self-end' : ''">
|
|
|
@@ -276,6 +290,8 @@ import practices from '@/enums/practices'
|
|
|
import sphericDistance from '@/services/utils/geo'
|
|
|
import StructuresProvider from '~/services/data/StructuresProvider'
|
|
|
|
|
|
+const CMF_ID = 12097
|
|
|
+
|
|
|
export default Vue.extend({
|
|
|
validate ({ query }) {
|
|
|
if (!/^\d+$/.test(query.parent as string ?? '')) {
|
|
|
@@ -329,11 +345,16 @@ export default Vue.extend({
|
|
|
this.federations.push(f)
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ // zoom on map markers (except if the parent structure is the CMF)
|
|
|
+ if (this.parent !== CMF_ID) {
|
|
|
+ this.fitMapToResults()
|
|
|
+ }
|
|
|
})
|
|
|
},
|
|
|
computed: {
|
|
|
onMapFilteredStructures (): Array<Structure> {
|
|
|
- if (this.mapBoundsFilterStarted) {
|
|
|
+ if (this.mapview && this.mapBoundsFilterStarted) {
|
|
|
return this.filteredStructures.filter((s) => {
|
|
|
return this.matchMapBounds(s)
|
|
|
})
|
|
|
@@ -364,6 +385,9 @@ export default Vue.extend({
|
|
|
methods: {
|
|
|
viewChanged (e: number) {
|
|
|
this.view = (e === 0) ? 'map' : 'list'
|
|
|
+ if (this.mapview) {
|
|
|
+ this.fitMapToResults()
|
|
|
+ }
|
|
|
},
|
|
|
textFilterChanged (newVal: string) {
|
|
|
this.textFilter = newVal
|
|
|
@@ -375,6 +399,14 @@ export default Vue.extend({
|
|
|
}
|
|
|
this.search()
|
|
|
},
|
|
|
+ resetMap (): void {
|
|
|
+ const map = this.$refs.map as any
|
|
|
+ map.resetBounds()
|
|
|
+ if (this.parent !== CMF_ID) {
|
|
|
+ this.fitMapToResults()
|
|
|
+ }
|
|
|
+ this.mapBoundsFilterStarted = false
|
|
|
+ },
|
|
|
fitMapToResults (): void {
|
|
|
(this.$refs.map as any).zoomOnResults()
|
|
|
},
|
|
|
@@ -392,8 +424,7 @@ export default Vue.extend({
|
|
|
this.mapBoundsFilter = null
|
|
|
const addressSearch = this.$refs.addressSearch as any
|
|
|
addressSearch.clear()
|
|
|
- const map = this.$refs.map as any
|
|
|
- map.resetBounds()
|
|
|
+ this.resetMap()
|
|
|
this.filteredStructures = this.structures
|
|
|
},
|
|
|
/**
|
|
|
@@ -437,7 +468,11 @@ export default Vue.extend({
|
|
|
*/
|
|
|
matchDepartmentFilter (structure: Structure): boolean {
|
|
|
if (!this.departmentFilter) { return true }
|
|
|
- return structure.postalCode !== null && structure.postalCode.startsWith(this.departmentFilter)
|
|
|
+ return structure.postalCode !== null &&
|
|
|
+ (
|
|
|
+ structure.postalCode.startsWith(this.departmentFilter) ||
|
|
|
+ (['2A', '2B'].includes(this.departmentFilter) && structure.postalCode.startsWith('20'))
|
|
|
+ )
|
|
|
},
|
|
|
/**
|
|
|
* Does the structure match the current federationFilter
|
|
|
@@ -472,7 +507,6 @@ export default Vue.extend({
|
|
|
this.matchPracticesFilter(structure) &&
|
|
|
this.matchDepartmentFilter(structure) &&
|
|
|
this.matchFederationFilter(structure)
|
|
|
- // this.matchMapBounds(structure)
|
|
|
},
|
|
|
/**
|
|
|
* Update the filteredStructures array
|
|
|
@@ -501,6 +535,15 @@ export default Vue.extend({
|
|
|
padding: 6px 12px;
|
|
|
}
|
|
|
|
|
|
+ .infos td {
|
|
|
+ padding: 4px;
|
|
|
+ vertical-align: top;
|
|
|
+ }
|
|
|
+ .infos td:first-child {
|
|
|
+ padding-top: 6px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
.title {
|
|
|
word-break: normal;
|
|
|
color: var(--v-primary-base);
|
Olivier Massot