Initial import
This commit is contained in:
@@ -0,0 +1,111 @@
|
||||
<?php
|
||||
|
||||
use app\models\TourObjects;
|
||||
|
||||
/**
|
||||
* @var $model TourObjects;
|
||||
*/
|
||||
$lat = $model->latitude ?? 42.698334;
|
||||
$lon = $model->longitude ?? 23.319941;
|
||||
?>
|
||||
<link rel="stylesheet" href="/_public/plugins/leafletjs/leaflet.css">
|
||||
<script src="/_public/plugins/leafletjs/leaflet.js"></script>
|
||||
<style>
|
||||
.search-location {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.search-location .result {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
left: 0;
|
||||
background: #FFFFFF;
|
||||
z-index: 10000000;
|
||||
padding: 5px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.search-location .result .row-result {
|
||||
padding: 5px;
|
||||
border: 1px solid #ccc;
|
||||
background: #f1f1f1;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
#map {
|
||||
width: 100%;
|
||||
height: 800px;
|
||||
border: 1px solid var(--base-background-dark);
|
||||
border-radius: 5px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
<div class="search-location c6">
|
||||
<input placeholder="Търси">
|
||||
<div class="result"></div>
|
||||
</div>
|
||||
<div id="map"></div>
|
||||
|
||||
<script>
|
||||
|
||||
|
||||
const inputSearchLocation = document.querySelector('.search-location input');
|
||||
const results = document.querySelector('.search-location .result');
|
||||
|
||||
|
||||
let mapOptions = {
|
||||
center: [<?=$lat ?>, <?= $lon ?>],
|
||||
zoom: 13
|
||||
}
|
||||
let map = new L.map('map', mapOptions);
|
||||
let layer = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
|
||||
map.addLayer(layer);
|
||||
let marker = new L.Marker([<?=$lat?>, <?= $lon?>]);
|
||||
marker.addTo(map);
|
||||
|
||||
map.on('click', function(e){
|
||||
let coord = e.latlng;
|
||||
let lat = coord.lat;
|
||||
let lon = coord.lng;
|
||||
setNewLocation({lat, lon})
|
||||
});
|
||||
|
||||
inputSearchLocation.addEventListener('keyup', () => {
|
||||
request({
|
||||
url: `https://nominatim.openstreetmap.org/search.php?q=${inputSearchLocation.value}&accept-language=bg&countrycodes=bg&limit=10&format=jsonv2`,
|
||||
done: res => {
|
||||
results.innerHTML = '';
|
||||
res = res || [];
|
||||
res.forEach(r => {
|
||||
let row = document.createElement('div')
|
||||
row.className = 'row-result';
|
||||
console.log(r);
|
||||
row.innerHTML = `<span>${r.display_name}</span>`;
|
||||
row.addEventListener('click', function () {
|
||||
if (r.lat && r.lon) {
|
||||
setNewLocation(r)
|
||||
}
|
||||
})
|
||||
results.appendChild(row)
|
||||
})
|
||||
if (res.length > 0) {
|
||||
results.style.display = 'block'
|
||||
} else {
|
||||
results.style.display = 'none'
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
function setNewLocation(r) {
|
||||
document.querySelector('[name="latitude"]').value = r.lat
|
||||
document.querySelector('[name="longitude"]').value = r.lon
|
||||
marker.setLatLng([r.lat, r.lon])
|
||||
let latLon = [marker.getLatLng()];
|
||||
let markerBounds = L.latLngBounds(latLon);
|
||||
map.fitBounds(markerBounds);
|
||||
|
||||
results.innerHTML = ''
|
||||
results.style.display = 'none'
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,66 @@
|
||||
<?php
|
||||
|
||||
use app\widgets\services\Includes;
|
||||
|
||||
$museums = \app\models\register\Partner::find()->where(['deleted' => 0, 'active' => 1])->all();
|
||||
/**
|
||||
* @var \app\models\TourObjects $model
|
||||
*/
|
||||
?>
|
||||
<div class="inner-content p10">
|
||||
<form autocomplete="off">
|
||||
<div class="c10 row">
|
||||
<label>Име на туристическия обект</label>
|
||||
<div class="flex row row-panel">
|
||||
<div class="row c6 right10">
|
||||
<label class="require"><i class="lg lg-bg"></i> Български</label>
|
||||
<input name="name" placeholder="Въведи име на туристическия обект [BG]" value="<?= $model->name ?>"/>
|
||||
</div>
|
||||
<div class="row c6 right10">
|
||||
<label class="require"><i class="lg lg-en"></i> Английски</label>
|
||||
<input name="name_en" placeholder="Въведи име на туристическия обект [EN]"
|
||||
value="<?= $model->name_en ?>"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="c10 row top15">
|
||||
<label>Текст</label>
|
||||
<div class="flex row row-panel">
|
||||
<div class="row c6 right10">
|
||||
<label><i class="lg lg-bg"></i> Български</label>
|
||||
<textarea class="ckEditor" name="text"
|
||||
placeholder="Въведи текст за туристическия обект [BG]"><?= $model->text ?></textarea>
|
||||
</div>
|
||||
<div class="row c6 right10">
|
||||
<label><i class="lg lg-en"></i> Английски</label>
|
||||
<textarea class="ckEditor" name="text_en"
|
||||
placeholder="Въведи текст за туристическия обект [EN]"><?= $model->text_en ?></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="c5 row top15">
|
||||
<label>Асоциация с партньор</label>
|
||||
<select name="partner_id">
|
||||
<option>Без асоцииране</option>
|
||||
<?php foreach ($museums as $museum): ?>
|
||||
<option <?= $model->partner_id == $museum->id ? 'selected' : '' ?>
|
||||
value="<?= $museum->id ?>"><?= $museum->name ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="c10 row top15">
|
||||
<label>Локация</label>
|
||||
<?= $this->render('_object_location_map', ['model' => $model]) ?>
|
||||
</div>
|
||||
<div class="c10 row top15">
|
||||
<label>Географски координати</label>
|
||||
<div class="row-panel flex">
|
||||
<div class="c6 right10"><label>latitude</label><input readonly name="latitude" placeholder="Latitude" value="<?= $model->latitude ?>"></div>
|
||||
<div class="c6 leaflet-right"><label>longitude</label><input readonly name="longitude" placeholder="Longitude" value="<?= $model->longitude ?>"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row c9 top15 flex">
|
||||
<?= Includes::formButtons('tour/tour-objects') ?>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
Reference in New Issue
Block a user