This commit is contained in:
@@ -9,7 +9,6 @@
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans:400,700,300" type="text/css">
|
||||
<link rel='stylesheet' href='/public/css/index.css'/>
|
||||
|
||||
<script src="/public/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
|
||||
|
||||
<script src="https://unpkg.com/vue2-datepicker/index.min.js"></script>
|
||||
@@ -28,8 +27,6 @@
|
||||
|
||||
<script src="https://unpkg.com/vue-multiselect"></script>
|
||||
|
||||
<script src="//cdn.jsdelivr.net/npm/sortablejs/Sortable.min.js"></script>
|
||||
<script src="https://unpkg.com/vuedraggable/dist/vuedraggable.umd.min.js"></script>
|
||||
<script src="https://unpkg.com/vue-textarea-autosize/dist/vue-textarea-autosize.umd.min.js"></script>
|
||||
<link rel="stylesheet" href="https://unpkg.com/vue-multiselect/dist/vue-multiselect.min.css">
|
||||
|
||||
@@ -45,8 +42,9 @@
|
||||
<div class="input input-invis"><input class="small" v-model="journey_data.name" type="text" /></div>
|
||||
|
||||
<ul class="header-nav">
|
||||
<div class="col-sm-5"><button class="button button--primary button--mobileFull" v-on:click="first_step">Main</button></div>
|
||||
<div class="col-sm-5"><button class="button button--primary button--mobileFull" v-on:click="next_step">Next</button></div>
|
||||
<div class="col-sm-4"><button class="button button--small" v-on:click="first_step">Main</button></div>
|
||||
<div class="col-sm-4"><button class="button button--small" v-on:click="prev_step">Prev</button></div>
|
||||
<div class="col-sm-4"><button class="button button--small" v-on:click="next_step">Next</button></div>
|
||||
</ul>
|
||||
</div>
|
||||
</header>
|
||||
@@ -74,7 +72,7 @@
|
||||
|
||||
<l-marker v-if="item.hotel && item.hotel.icon" :lat-lng.sync="item.hotel.latlon">
|
||||
<l-icon>
|
||||
<div v-html="generate_icon(item.hotel,'hotel')"></div>
|
||||
<div v-html="generate_icon(item.hotel,'darkblue')"></div>
|
||||
</l-icon>
|
||||
<l-popup>
|
||||
<div>
|
||||
@@ -90,17 +88,17 @@
|
||||
</l-marker>
|
||||
<l-marker v-for="place in item.places.restaurants" :lat-lng.sync="place.latlon">
|
||||
<l-icon>
|
||||
<div v-html="generate_icon(place,'food')"></div>
|
||||
<div v-html="generate_icon(place,'cadetblue')"></div>
|
||||
</l-icon>
|
||||
<l-popup>
|
||||
<div>
|
||||
Food: {{place.display_name}}
|
||||
Restaurant: {{place.display_name}}
|
||||
</div>
|
||||
</l-popup>
|
||||
</l-marker>
|
||||
<l-marker v-for="place in item.places.activities" :lat-lng.sync="place.latlon">
|
||||
<l-icon>
|
||||
<div v-html="generate_icon(place,'activity')"></div>
|
||||
<div v-html="generate_icon(place)"></div>
|
||||
</l-icon>
|
||||
<l-popup>
|
||||
<div>
|
||||
@@ -119,26 +117,26 @@
|
||||
</div>
|
||||
<div class="row text-center">
|
||||
<div><label>Hotel</label></div>
|
||||
<multiselect v-model="item.hotel" id="ajax" label="display_name" track-by="place_id" placeholder="Type to search" open-direction="bottom" :options="query.nominatim" :searchable="true" :loading="querying.hotel" :internal-search="false" :clear-on-select="false" :allow-empty="false" :options-limit="300" :limit="3" :max-height="600" @search-change="debounceSearch.hotel"></multiselect>
|
||||
<multiselect v-model="item.hotel" id="ajax" label="sname" track-by="place_id" placeholder="Type to search" open-direction="bottom" :options="query.nominatim" :searchable="true" :loading="querying.hotel" :internal-search="false" :clear-on-select="false" :options-limit="50" :limit="1" :max-height="600" @search-change="debounceSearch.hotel"></multiselect>
|
||||
</div>
|
||||
<div class="row text-center">
|
||||
<div><label>Fight</label></div>
|
||||
|
||||
<multiselect v-model="item.flightA" id="ajax" label="label" track-by="id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.flight" :searchable="true" :loading="querying.flight" :internal-search="false" :clear-on-select="false" :allow-empty="false" :options-limit="300" :limit="3" :max-height="600" @search-change="debounceSearch.flight"></multiselect>
|
||||
<multiselect v-model="item.flightB" id="ajax" label="label" track-by="id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.flight" :searchable="true" :loading="querying.flight" :internal-search="false" :clear-on-select="false" :allow-empty="false" :options-limit="300" :limit="3" :max-height="600" @search-change="debounceSearch.flight"></multiselect>
|
||||
<multiselect v-model="item.flightA" id="ajax" label="label" track-by="id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.flight" :searchable="true" :loading="querying.flight" :internal-search="false" :clear-on-select="false" :options-limit="50" :limit="10" :max-height="600" @search-change="debounceSearch.flight"></multiselect>
|
||||
<multiselect v-model="item.flightB" id="ajax" label="label" track-by="id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.flight" :searchable="true" :loading="querying.flight" :internal-search="false" :clear-on-select="false" :options-limit="50" :limit="10" :max-height="600" @search-change="debounceSearch.flight"></multiselect>
|
||||
|
||||
</div>
|
||||
<div class="row text-center">
|
||||
<div><label>Restoration</label></div>
|
||||
|
||||
<multiselect v-model="item.places.restaurants" id="ajax" label="display_name" track-by="place_id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.nominatim" :searchable="true" :loading="querying.food" :internal-search="false" :clear-on-select="false" :allow-empty="false" :options-limit="300" :limit="3" :max-height="600" @search-change="debounceSearch.restaurants"></multiselect>
|
||||
<multiselect v-model="item.places.restaurants" id="ajax" label="sname" track-by="place_id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.nominatim" :searchable="true" :loading="querying.food" :internal-search="false" :clear-on-select="false" :options-limit="50" :limit="10" :max-height="600" @search-change="debounceSearch.restaurants"></multiselect>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="row text-center">
|
||||
<div><label>Activities</label></div>
|
||||
|
||||
<multiselect v-model="item.places.activities" id="ajax" label="display_name" track-by="place_id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.nominatim" :searchable="true" :loading="querying.place" :internal-search="false" :clear-on-select="false" :options-limit="300" :limit="3" :max-height="600" @search-change="debounceSearch.places"></multiselect>
|
||||
<multiselect v-model="item.places.activities" id="ajax" label="sname" track-by="place_id" placeholder="Type to search" open-direction="bottom" :multiple="true" :options="query.nominatim" :searchable="true" :loading="querying.place" :internal-search="false" :clear-on-select="false" :options-limit="50" :limit="10" :max-height="600" @search-change="debounceSearch.places"></multiselect>
|
||||
|
||||
|
||||
</div>
|
||||
@@ -164,7 +162,7 @@
|
||||
<div class="bg-dark text-white" v-cloak>
|
||||
<div class="container section">
|
||||
<div class="row text-center">
|
||||
<div class="input col-sm-4"><input :value="journey_data.main[journey_step_data.section].title + ': Day ' + journey_step_data.day" disabled /></div>
|
||||
<div class="input col-sm-4"><input disabled :value="journey_data.main[journey_step_data.section].title + ': Day ' + journey_step_data.day" /></div>
|
||||
<div class="input col-sm-2"><input placeholder="Day title" v-model="journey_data.step_title[journey_step]" /></div>
|
||||
|
||||
</div>
|
||||
@@ -186,34 +184,91 @@
|
||||
journey_data.main[journey_step_data.section].hotel.icon"
|
||||
:lat-lng="journey_data.main[journey_step_data.section].hotel.latlon">
|
||||
<l-icon>
|
||||
<div v-html="generate_icon(journey_data.main[journey_step_data.section].hotel,'hotel')"></div>
|
||||
<div v-html="generate_icon(journey_data.main[journey_step_data.section].hotel,'darkblue')"></div>
|
||||
</l-icon>
|
||||
<l-popup>
|
||||
<div>
|
||||
Hotel: {{journey_data.main[journey_step_data.section].hotel.display_name}}
|
||||
</div>
|
||||
</l-popup>
|
||||
</l-marker>
|
||||
<!-- <l-marker v-for="place in journey_data.main[journey_step_data.section].places.restaurants" :lat-lng="place.latlon">
|
||||
<l-icon>
|
||||
<div v-html="generate_icon(place,'food')"></div>
|
||||
</l-icon>
|
||||
<l-popup>
|
||||
<div>
|
||||
Food: {{place.display_name}}
|
||||
</div>
|
||||
</l-popup>
|
||||
</l-marker> -->
|
||||
<l-marker v-for="place in filter_selected(journey_data.main[journey_step_data.section].places.activities, true)" :lat-lng="place.latlon">
|
||||
<l-icon>
|
||||
<div v-html="generate_icon(place,'activity')"></div>
|
||||
</l-icon>
|
||||
<l-popup>
|
||||
<div>
|
||||
Activity: {{place.display_name}}
|
||||
<h1 class="row text-medium text-center">{{journey_data.main[journey_step_data.section].hotel.sname}}</h1>
|
||||
<span class="row text-small text-gray">{{journey_data.main[journey_step_data.section].hotel.display_name}}</span>
|
||||
<div class="row">
|
||||
<textarea-autosize
|
||||
class="col-12 col-sm-10"
|
||||
placeholder="Notes"
|
||||
v-model="journey_data.main[journey_step_data.section].hotel.notes"
|
||||
:min-height="30"
|
||||
:max-height="350"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</l-popup>
|
||||
</l-marker>
|
||||
<l-marker v-for="place in journey_data.main[journey_step_data.section].places.activities" :lat-lng="place.latlon">
|
||||
<div v-if="place.step==journey_step">
|
||||
<l-icon>
|
||||
<div v-html="generate_icon(place)"></div>
|
||||
</l-icon>
|
||||
<l-popup>
|
||||
<h1 class="row text-medium text-center">{{place.sname}}</h1>
|
||||
<span class="row text-small text-gray">{{place.display_name}}</span>
|
||||
<div class="row">
|
||||
<textarea-autosize
|
||||
class="col-12 col-sm-10"
|
||||
placeholder="Notes"
|
||||
v-model="place.notes"
|
||||
:min-height="30"
|
||||
:max-height="350"
|
||||
/>
|
||||
</div>
|
||||
<a class="leaflet-popup-close-button text-gray" style="bottom:9px;top:auto; " href="#rm" v-on:click.prevent="place.step=-1">-</a>
|
||||
</l-popup>
|
||||
</div>
|
||||
<div v-else-if="place.step >= 0">
|
||||
<l-icon>
|
||||
<div v-html="generate_icon(place,'orange')"></div>
|
||||
</l-icon>
|
||||
<l-popup>
|
||||
<h1 class="row text-medium text-center">{{place.sname}}</h1>
|
||||
<span class="row text-small text-gray">{{place.display_name}}</span>
|
||||
<div class="row">
|
||||
<textarea-autosize
|
||||
class="col-12 col-sm-10"
|
||||
placeholder="Notes"
|
||||
v-model="place.notes"
|
||||
:min-height="30"
|
||||
:max-height="350"
|
||||
/>
|
||||
</div>
|
||||
<a class="leaflet-popup-close-button text-gray" style="bottom:9px;top:auto; " href="#add" v-on:click.prevent="place.step=journey_step">+</a>
|
||||
</l-popup>
|
||||
</div>
|
||||
<div v-else-if="place.step==undefined || place.step == -1">
|
||||
<l-icon>
|
||||
<div v-html="generate_icon(place,'red')"></div>
|
||||
</l-icon>
|
||||
<l-popup>
|
||||
<h1 class="row text-medium text-center">{{place.sname}}</h1>
|
||||
<span class="row text-small text-gray">{{place.display_name}}</span>
|
||||
<div class="row">
|
||||
<textarea-autosize
|
||||
class="col-12 col-sm-10"
|
||||
placeholder="Notes"
|
||||
v-model="place.notes"
|
||||
:min-height="30"
|
||||
:max-height="350"
|
||||
/>
|
||||
</div>
|
||||
<a class="leaflet-popup-close-button text-gray" style="bottom:9px;top:auto; " href="#add" v-on:click.prevent="place.step=journey_step">+</a>
|
||||
</l-popup>
|
||||
</div>
|
||||
<div v-else>
|
||||
<l-icon>
|
||||
<div v-html="generate_icon()"></div>
|
||||
</l-icon>
|
||||
<l-popup>
|
||||
<h1 class="row text-medium text-center">{{place.sname}}</h1>
|
||||
<span class="row text-small text-gray">{{place.display_name}}</span>
|
||||
|
||||
</l-popup>
|
||||
</div>
|
||||
</l-map>
|
||||
</div>
|
||||
</div>
|
||||
@@ -229,55 +284,6 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="container"></div>
|
||||
<div class="container text-center">
|
||||
<b>Select Daily Activities</b>
|
||||
<div class= "row text-dark container">
|
||||
<div class="col-12 col-sm-6">
|
||||
<l-draggable
|
||||
class="dragArea list-group"
|
||||
:list="filter_unselected(journey_data.main[journey_step_data.section].places.activities)"
|
||||
:group="{ name: 'people', pull: 'clone', put: false }"
|
||||
>
|
||||
<div
|
||||
class="list-group-item"
|
||||
v-for="element in filter_unselected(journey_data.main[journey_step_data.section].places.activities)"
|
||||
:key="element.place_id"
|
||||
>
|
||||
{{ element.display_name.split(",")[0] }}
|
||||
</div>
|
||||
</l-draggable>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<l-draggable
|
||||
class="dragArea list-group"
|
||||
:list="activities_tmp"
|
||||
group="people"
|
||||
>
|
||||
<div
|
||||
class="list-group-item"
|
||||
v-for="(element,idx) in filter_selected(activities_tmp,true)"
|
||||
:key="element.place_id"
|
||||
>
|
||||
<div class="row">
|
||||
<i class="fa fa-times close col-12 col-sm-1" @click="remove_item(activities_tmp,idx)"></i>
|
||||
<div class="text">{{ element.display_name.split(",")[0] }}</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="input col-12 col-sm-12">
|
||||
<textarea-autosize
|
||||
class="small"
|
||||
placeholder="Comments..."
|
||||
v-model="element.text"
|
||||
:min-height="16"
|
||||
:max-height="360"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</l-draggable>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
Reference in New Issue
Block a user