Edit File: create.blade.php
@extends('admin.layout.master') {{-- extra css files --}} @section('css') <link rel="stylesheet" type="text/css" href="{{ asset('admin/app-assets/vendors/css/extensions/sweetalert2.min.css') }}"> @endsection {{-- extra css files --}} @section('content') <!-- // Basic multiple Column Form section start --> <section id="multiple-column-form"> <div class="row match-height"> <div class="col-12"> <div class="card"> <div class="card-header"> <h4 class="card-title">{{ __('admin.add') }}</h4> </div> <div class="card-content"> <div class="card-body"> <form method="POST" action="{{ route('admin.users.store') }}" class="store form-horizontal parsley" novalidate> @csrf <div class="form-body"> <div class="row"> <div class="col-12"> <div class="imgMontg col-12 text-center"> <div class="dropBox"> <div class="textCenter"> <div class="imagesUploadBlock"> <label class="uploadImg"> <span><i class="feather icon-image"></i></span> <input type="file" accept="image/*" name="image" class="imageUploader"> </label> </div> </div> </div> </div> </div> <div class="col-md-6 col-12"> <div class="form-group"> <label for="first-name-column">{{ __('admin.first_name') }}</label> <div class="controls"> <input type="text" name="first_name" class="form-control" placeholder="{{ __('admin.write_the_name') }}" required data-parsley-required-message="{{ __('admin.this_field_is_required') }}"> </div> </div> </div> <div class="col-md-6 col-12"> <div class="form-group"> <label for="first-name-column">{{ __('admin.last_name') }}</label> <div class="controls"> <input type="text" name="last_name" class="form-control" placeholder="{{ __('admin.write_the_name') }}" required data-parsley-required-message="{{ __('admin.this_field_is_required') }}"> </div> </div> </div> <div class="col-md-10 col-12"> <div class="form-group"> <label for="first-name-column">{{ __('admin.phone_number') }}</label> <div class="controls"> <input type="text" name="phone" class="form-control" placeholder="{{ __('admin.enter_phone_number') }}" required data-parsley-required-message="{{ __('admin.this_field_is_required') }}" data-parsley-pattern="^\d+$" data-parsley-pattern-message="{{ __('admin.must_be_real_positive_numbers') }}"> </div> </div> </div> <div class="col-md-2 col-12"> <div class="form-group"> <label for="first-name-column">{{ __('admin.country_code') }}</label> <div class="controls"> <select name="country_code" class="select2 form-control"> @foreach ($country_codes as $country_code) <option value="{{ $country_code }}">{{ $country_code }} </option> @endforeach </select> </div> </div> </div> <div class="col-md-6 col-12"> <div class="form-group"> <label for="first-name-column">{{ __('admin.email') }}</label> <div class="controls"> <input type="email" name="email" class="form-control" placeholder="{{ __('admin.enter_the_email') }}" data-parsley-type-message="{{ __('admin.email_formula_is_incorrect') }}"> </div> </div> </div> <div class="col-md-6 col-12"> <div class="form-group"> <label for="first-name-column">{{ __('admin.gender') }}</label> <div class="controls"> <select name="gender" class="select2 form-control" required data-parsley-required-message="{{ __('admin.this_field_is_required') }}"> <option value>{{ __('admin.select_the_gender') }}</option> @foreach (App\Enums\GenderEnum::Values() as $gender) <option value="{{ $gender }}"> {{ __('admin.' . $gender) }} </option> @endforeach </select> </div> </div> </div> <div class="col-md-6 col-12"> <div class="form-group"> <label for="first-name-column">{{ __('admin.country') }}</label> <div class="controls"> <select name="country_id" class="select2 form-control"> <option value>{{ __('admin.select_country') }}</option> @foreach ($countries as $country) <option value="{{ $country->id }}">{{ $country->name }} </option> @endforeach </select> </div> </div> </div> <div class="col-md-6 col-12"> <div class="form-group"> <label for="first-name-column">{{ __('admin.city') }}</label> <div class="controls"> <select name="city_id" class="select2 form-control"> @foreach ($cities as $city) <option value="{{ $city->id }}">{{ $city->name }} </option> @endforeach </select> </div> </div> </div> <div class="col-md-6 col-12"> <div class="form-group"> <label for="first-name-column">{{ __('admin.birth_date') }}</label> <div class="controls"> <input type="date" name="birth_date" class="form-control" placeholder="{{ __('admin.enter_the_birth_date') }}" data-parsley-type-message="{{ __('admin.birth_date_formula_is_incorrect') }}"> </div> </div> </div> <div class="col-md-6 col-12"> <div class="form-group"> <label for="first-name-column">{{ __('admin.status') }}</label> <div class="controls"> <select name="is_blocked" class="select2 form-control" required data-parsley-required-message="{{ __('admin.this_field_is_required') }}"> <option value>{{ __('admin.Select_the_blocking_status') }}</option> <option value="1">{{ __('admin.Prohibited') }}</option> <option value="0">{{ __('admin.Unspoken') }}</option> </select> </div> </div> </div> {{-- start map --}} <div class="col-md-12 col-12 mt-3"> <div class="form-group"> <label class="bold font14" for="exampleInputEmail1">{{ __('admin.location') }} </label> <input type="text" name="map_desc" id="address" class="form-control"> <br> <div id="map" style="width: 100%; height: 250px;"></div> <input type="hidden" name="lat" id="lat"> <input type="hidden" name="lng" id="lng"> </div> </div> {{-- end map --}} <div class="col-12 d-flex justify-content-center mt-3"> <button type="submit" class="btn btn-primary mr-1 mb-1 submit_button">{{ __('admin.add') }}</button> <a href="{{ url()->previous() }}" type="reset" class="btn btn-outline-warning mr-1 mb-1">{{ __('admin.back') }}</a> </div> </div> </div> </form> </div> </div> </div> </div> </div> </section> @endsection @section('js') <script src="{{ asset('admin/app-assets/vendors/js/extensions/sweetalert2.all.min.js') }}"></script> <script src="{{ asset('admin/app-assets/js/scripts/extensions/sweet-alerts.js') }}"></script> {{-- show selected image script --}} @include('admin.shared.addImage') {{-- show selected image script --}} {{-- submit add form script --}} @include('admin.shared.submitAddForm') {{-- submit add form script --}} {{-- map --}} <script type="text/javascript" src='https://maps.google.com/maps/api/js?language={{ app()->getLocale() }}&libraries=places&key={{ googleMapKey() }}'> </script> <script> document.addEventListener("DOMContentLoaded", function() { var map; var marker; var lat = document.getElementById('lat'); var lng = document.getElementById('lng'); var address = document.getElementById('address'); var geocoder = new google.maps.Geocoder(); var infowindow = new google.maps.InfoWindow(); function initMap(locationlat, locationlng) { var myLatlng; if (locationlat && locationlng) { myLatlng = new google.maps.LatLng(locationlat, locationlng); } else { myLatlng = new google.maps.LatLng(30, 30); } var mapOptions = { zoom: 15, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById("map"), mapOptions); marker = new google.maps.Marker({ map: map, position: myLatlng, draggable: true }); geocoder.geocode({ 'latLng': myLatlng }, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { if (results[0]) { address.value = results[0].formatted_address; lat.value = marker.getPosition().lat(); lng.value = marker.getPosition().lng(); infowindow.setContent(results[0].formatted_address); infowindow.open(map, marker); } } }); google.maps.event.addListener(marker, 'dragend', function() { geocoder.geocode({ 'latLng': marker.getPosition() }, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { if (results[0]) { address.value = results[0].formatted_address; // map_desc.value = results[0] // .formatted_address; // Set the value of map_desc lat.value = marker.getPosition().lat(); lng.value = marker.getPosition().lng(); infowindow.setContent(results[0].formatted_address); infowindow.open(map, marker); console.log(lat.value, lng.value); } } }); }); } // Get current location using geolocation API navigator.geolocation.getCurrentPosition( function(position) { if (lat.value && lng.value) { initMap(lat.value, lng.value); } else { initMap(position.coords.latitude, position.coords.longitude); } }, function errorCallback(error) { console.log(error); initMap(); // Initialize with default/fallback location if geolocation fails } ); function initialize() { var input = document.getElementById('address'); var autocomplete = new google.maps.places.Autocomplete( input, { types: ['(cities)'], }); google.maps.event.addListener(autocomplete, 'place_changed', function() { var place = autocomplete.getPlace(); if (!place.geometry) { return; } lat.value = place.geometry.location.lat(); lng.value = place.geometry.location.lng(); initMap(place.geometry.location.lat(), place.geometry.location.lng()); }); } initialize(); }); </script> @endsection
Back to File Manager