Address selection: add store + addressSuggestion

This commit is contained in:
nobohan
2021-05-10 12:12:04 +02:00
parent b934c2eeaf
commit efb9bc938a
6 changed files with 234 additions and 52 deletions

View File

@@ -1,7 +1,6 @@
<template>
<button class="sc-button bt-create centered mt-4" @click="openModal">
<!-- {{ $t('add_addresses.search_add_others_addresses') }} -->
ajoute address
{{ $t('add_an_address') }}
</button>
<teleport to="body">
@@ -10,13 +9,28 @@
@close="modal.showModal = false">
<template v-slot:header>
<h3 class="modal-title">mon titre</h3>
<h3 class="modal-title">{{ $t('add_an_address') }}</h3>
</template>
<!-- <template v-slot:body-fixed>
<div class="search">
<label style="float: right;">
{{ $tc('add_persons.suggested_counter', suggestedCounter) }}
</label>
<input id="search-persons"
name="query"
v-model="query"
:placeholder="$t('add_persons.search_some_persons')"
ref="search" />
<i class="fa fa-search fa-lg"></i>
</div>
</template> -->
<template v-slot:body>
<!--span class="discret">Selection: {{ selected }}</span-->
<div class="results">
<!-- <div class="count">
<div class="count">
<span>
<a v-if="suggestedCounter > 0" href="#">
{{ $t('action.check_all')}}</a>
@@ -28,13 +42,13 @@
</span>
</div>
<person-suggestion
v-for="item in this.selectedAndSuggested.slice().reverse()"
<address-suggestion
v-for="item in this.referenceAddresses.slice().reverse()"
v-bind:item="item"
v-bind:key="item.id">
</person-suggestion>
</address-suggestion>
<button v-if="query.length >= 3" class="sc-button bt-create ml-5 mt-2" name="createPerson">
<!-- <button v-if="query.length >= 3" class="sc-button bt-create ml-5 mt-2" name="createPerson">
{{ $t('action.create') }} "{{ query }}"
</button> -->
</div>
@@ -53,13 +67,13 @@
<script>
import { mapState } from 'vuex';
import Modal from './Modal';
// import PersonSuggestion from 'ChillPersonAssets/vuejs/_components/PersonSuggestion'; //TODO import AddressSuggestions
import AddressSuggestion from './AddressSuggestion';
export default {
name: 'AddAddresses',
components: {
Modal,
// PersonSuggestion,
AddressSuggestion,
},
data() {
return {
@@ -71,6 +85,7 @@ export default {
},
computed: {
...mapState(['add_addresses']),
referenceAddresses() {return this.$store.getters.getReferenceAddresses;}
// query: {
// set(query) {
// this.$store.dispatch('setQuery', { query });
@@ -79,21 +94,21 @@ export default {
// return this.add_persons.query;
// }
// },
// suggested() { //TODO
// return this.add_persons.suggested;
// },
// suggestedCounter() {
// return this.add_persons.suggested.length;
// },
// selected() {
// return this.add_persons.selected;
// },
// selectedCounter() {
// return this.add_persons.selected.length;
// },
// selectedAndSuggested() {
// return this.$store.getters.selectedAndSuggested;
// }
// suggested() { //TODO
// return this.add_persons.suggested;
// },
// suggestedCounter() {
// return this.add_persons.suggested.length;
// },
// selected() {
// return this.add_persons.selected;
// },
// selectedCounter() {
// return this.add_persons.selected.length;
// },
// selectedAndSuggested() {
// return this.$store.getters.selectedAndSuggested;
// }
},
methods: {
openModal() {