diff --git a/components/admin/Cohorts.vue b/components/admin/Cohorts.vue
index 3c73ec36..c48eb482 100644
--- a/components/admin/Cohorts.vue
+++ b/components/admin/Cohorts.vue
@@ -8,26 +8,31 @@ v-container
single-line hide-details)
v-card-subtitle(v-html="$t('admin.cohort_description')")
- v-btn(color='primary' text @click='dialog = true') {{$t('common.new')}}
+ v-btn(color='primary' text @click='newCohort') {{$t('common.new')}}
v-dialog(v-model='dialog' width='800' destroy-on-close :fullscreen='$vuetify.breakpoint.xsOnly')
v-card(color='secondary')
v-card-title {{$t('admin.edit_cohort')}}
v-card-text
v-form(v-model='valid' ref='form' lazy-validation)
- v-text-field(
- :rules="[$validators.required('common.name')]"
- :label="$t('common.name')"
- v-model='cohort.name'
- :placeholder='$t("common.name")')
-
- v-row
+ v-text-field(
+ v-if='!cohort.id'
+ :rules="[$validators.required('common.name')]"
+ :label="$t('common.name')"
+ v-model='cohort.name'
+ :placeholder='$t("common.name")')
+ template(v-slot:append-outer v-if='!cohort.id')
+ v-btn(text @click='saveCohort' color='primary' :loading='loading'
+ :disabled='!valid || loading || !!cohort.id') {{$t('common.save')}}
+ h3(v-else class='text-h5' v-text='cohort.name')
+ v-row
v-col(cols=5)
v-autocomplete(v-model='filterTags'
:prepend-icon="mdiTagMultiple"
chips small-chips multiple deletable-chips hide-no-data hide-selected persistent-hint
no-filter
+ :disabled="!cohort.id"
placeholder='Tutte'
:search-input.sync="tagName"
:delimiters="[',', ';']"
@@ -40,13 +45,15 @@ v-container
chips small-chips multiple deletable-chips hide-no-data hide-selected persistent-hint
no-filter
item-text='name'
+ return-object
+ :disabled="!cohort.id"
:search-input.sync="placeName"
:delimiters="[',', ';']"
:items="filteredPlaces"
:label="$t('common.places')")
v-col(cols=2)
- v-btn(color='primary' text @click='addFilter') add
+ v-btn(color='primary' text @click='addFilter' :disabled='!cohort.id || !filterPlaces.length && !filterTags.length') add
v-data-table(
@@ -60,15 +67,15 @@ v-container
template(v-slot:item.tags='{item}')
v-chip.ma-1(small v-for='tag in item.tags' v-text='tag' :key='tag')
template(v-slot:item.places='{item}')
- v-chip.ma-1(small v-for='place in item.places' v-text='place.name' :key='place' )
+ v-chip.ma-1(small v-for='place in item.places' v-text='place.name' :key='place.id' )
v-card-actions
v-spacer
- v-btn(text @click='dialog=false' color='warning') {{$t('common.cancel')}}
- v-btn(text @click='saveCohort' color='primary' :loading='loading'
- :disable='!valid || loading') {{$t('common.save')}}
+ v-btn(text @click='dialog=false' color='warning') {{$t('common.close')}}
+ //- v-btn(text @click='saveCohort' color='primary' :loading='loading'
+ //- :disable='!valid || loading') {{$t('common.save')}}
v-card-text
v-data-table(
@@ -77,6 +84,8 @@ v-container
:hide-default-footer='cohorts.length<5'
:footer-props='{ prevIcon: mdiChevronLeft, nextIcon: mdiChevronRight }'
:search='search')
+ template(v-slot:item.filters='{item}')
+ span {{cohortFilters(item)}}
template(v-slot:item.actions='{item}')
v-btn(@click='editCohort(item)' color='primary' icon)
v-icon(v-text='mdiPencil')
@@ -106,7 +115,7 @@ export default {
placeName: '',
cohortHeaders: [
{ value: 'name', text: 'Name' },
- { value: 'description', text: 'Description' },
+ { value: 'filters', text: 'Filters' },
{ value: 'actions', text: 'Actions', align: 'right' }
],
filterHeaders: [
@@ -142,40 +151,50 @@ export default {
return matches
}
},
- async mounted () {
- this.cohorts = await this.$axios.$get('/cohorts')
+ async fetch () {
+ this.cohorts = await this.$axios.$get('/cohorts?withFilters=true')
},
methods: {
...mapActions(['updateMeta']),
+ cohortFilters (cohort) {
+ return cohort.filters.map(f => {
+ return '(' + f.tags?.join(', ') + f.places?.map(p => p.name).join(', ') + ')'
+ }).join(' - ')
+ },
async addFilter () {
this.loading = true
const tags = this.filterTags
const places = this.filterPlaces.map(p => ({ id: p.id, name: p.name }))
const filter = await this.$axios.$post('/filter', { cohortId: this.cohort.id, tags, places })
+ this.$fetch()
this.filters.push(filter)
this.filterTags = []
this.filterPlaces = []
this.loading = false
},
async editCohort (cohort) {
- console.error(cohort)
this.cohort = { ...cohort }
this.filters = await this.$axios.$get(`/filter/${cohort.id}`)
this.dialog = true
},
+ newCohort () {
+ this.cohort = { name: '', id: null },
+ this.filters = []
+ this.dialog = true
+ },
async saveCohort () {
if (!this.$refs.form.validate()) return
this.loading = true
this.cohort = await this.$axios.$post('/cohorts', this.cohort)
- // this.updateMeta()
+ this.$fetch()
this.loading = false
- // this.dialog = false
},
async removeFilter(filter) {
try {
await this.$axios.$delete(`/filter/${filter.id}`)
this.filters = this.filters.filter(f => f.id !== filter.id)
+ this.$fetch()
} catch (e) {
const err = get(e, 'response.data.errors[0].message', e)
this.$root.$message(this.$t(err), { color: 'error' })