Your IP : 216.73.217.77
@extends('layouts.main')
@section('title')
{{ __('Update Advertisements') }}
@endsection
@section('page-title')
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h4>@yield('title')</h4>
</div>
<div class="col-12 col-md-6 order-md-2 order-first"></div>
</div>
</div>
@endsection
@section('content')
<section class="section">
<div class="card">
<div class="card-body">
<form method="POST" action="{{ route('advertisement.update', $item->id) }}" enctype="multipart/form-data">
@csrf
@method('PUT')
<input type="hidden" name="id" value="{{ $item->id }}">
<ul class="nav nav-tabs" id="editItemTabs" role="tablist">
<li class="nav-item"><a class="nav-link active" data-bs-toggle="tab" href="#listing">Listing Details</a></li>
<li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#custom">Other Details</a></li>
<li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#images">Product Images</a></li>
<li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#address">Address</a></li>
</ul>
<div class="tab-content pt-3">
{{-- Listing Details --}}
<div class="tab-pane fade show active" id="listing">
<div class="row">
<div class="col-6 mb-3">
<label>Name</label>
<input type="text" name="name" value="{{ $item->name }}" class="form-control">
</div>
<div class="col-6 mb-3">
<label>Slug</label>
<input type="text" name="slug" value="{{ $item->slug }}" class="form-control" disabled>
</div>
<div class="col-6 mb-3">
<label>Category</label>
<select name="category_id" class="form-control" id="category-select">
@if($item->category)
<option value="{{ $item->category->id }}" selected>{{ $item->category->name }}</option>
@else
<option value="">Select Category</option>
@endif
</select>
<button type="button" class="btn btn-primary mt-2" data-bs-toggle="modal" data-bs-target="#subcategory-modal">
Change
</button>
</div>
@php
$isJobCategory = $item->category && $item->category->is_job_category;
$isPriceOptional = $item->category && $item->category->price_optional;
@endphp
<div class="col-6 mb-3" id="price-field" style="{{ ($isJobCategory || $isPriceOptional) ? 'display: none;' : '' }}">
<label>Price</label>
<input type="number" name="price" value="{{ $item->price }}" class="form-control">
</div>
<div class="col-6 mb-3" id="salary-fields" style="{{ ($isJobCategory || $isPriceOptional) ? '' : 'display: none;' }}">
<label>Min Salary</label>
<input type="number" name="min_salary" value="{{ old('min_salary', $item->min_salary ?? '') }}" class="form-control mb-2">
<label>Max Salary</label>
<input type="number" name="max_salary" value="{{ old('max_salary', $item->max_salary ?? '') }}" class="form-control">
</div>
<div class="col-6 mb-3">
<label>Phone Number</label>
<input type="text" name="contact" value="{{ $item->contact }}" class="form-control" readonly>
</div>
<div class="col-12 mb-3">
<label>Description</label>
<textarea name="description" class="form-control">{{ $item->description }}</textarea>
</div>
</div>
</div>
{{-- Other Details - Custom Fields --}}
<div class="tab-pane fade" id="custom">
<div class="row">
@forelse($custom_fields as $field)
<div class="col-md-6 mb-3">
<label>{{ $field->name }} @if($field->required) <span class="text-danger">*</span> @endif</label>
@php
$isRequired = '';
@endphp
@if($field->type === 'textbox')
<input type="text" name="custom_fields[{{ $field->id }}]" class="form-control" value="{{ $field->value ?? '' }}" {{ $isRequired }}>
@elseif($field->type === 'number')
<input type="number" name="custom_fields[{{ $field->id }}]" class="form-control" value="{{ $field->value ?? '' }}" {{ $isRequired }}>
@elseif($field->type === 'fileinput')
<input type="file" name="custom_field_files[{{ $field->id }}]" class="form-control" {{ $isRequired }}>
@if(!empty($field->value))
<img src="{{ $field->value[0] ?? '' }}" alt="" width="100">
@endif
@elseif($field->type === 'dropdown' || $field->type === 'radio')
@php $options = is_array($field->values) ? $field->values : json_decode($field->values, true); @endphp
<select name="custom_fields[{{ $field->id }}]" class="form-select" {{ $isRequired }}>
<option value="">{{ __('Select') }}</option>
@foreach($options as $option)
<option value="{{ $option }}" {{ $field->value == $option ? 'selected' : '' }}>{{ $option }}</option>
@endforeach
</select>
@elseif($field->type === 'checkbox')
@php $options = is_array($field->values) ? $field->values : json_decode($field->values, true); @endphp
@foreach($options as $option)
<div class="form-check">
<input class="form-check-input" type="checkbox" name="custom_fields[{{ $field->id }}][]" value="{{ $option }}"
{{ is_array($field->value) && in_array($option, $field->value) ? 'checked' : '' }} {{ $isRequired }}>
<label class="form-check-label">{{ $option }}</label>
</div>
@endforeach
@endif
</div>
@empty
<p class="text-muted">{{ __('No custom fields for this category.') }}</p>
@endforelse
</div>
</div>
{{-- Product Images --}}
<div class="tab-pane fade" id="images">
<div class="row">
<div class="col-6 mb-3">
<label>Main Image</label>
<input type="file" name="image" class="form-control">
<img src={{$item->image}} width="80" class="mb-2">
</div>
<div class="col-6 mb-3">
<label>Other Images</label>
<input type="file" name="gallery_images[]" class="form-control" multiple>
@foreach ($item->gallery_images as $img)
<div class="mb-2">
<img src={{$img->image}} width="80">
<input type="checkbox" name="delete_item_image_id[]" value="{{ $img->id }}"> Remove
</div>
@endforeach
</div>
<div class="col-12 mb-3">
<label for="video_link">Video Link</label>
<input type="url" name="video_link" id="video_link" class="form-control"
value="{{ old('video_link', $item->video_link ?? '') }}"
placeholder="https://www.youtube.com/watch?v=...">
</div>
</div>
</div>
{{-- Address --}}
<div class="tab-pane fade" id="address">
<div class="row">
<!-- LEFT SIDE: Manual Input -->
<div class="col-md-6">
<div class="form-group mb-3">
<label for="country" class="form-label">Country</label>
<select class="form-control select2" id="country_item" name="country">
<option value="">--Select Country--</option>
@foreach($countries as $country)
<option value="{{ $country->id }}">{{ $country->name }}</option>
@endforeach
</select>
</div>
<div class="form-group mb-3">
<label for="state" class="form-label">State</label>
<select class="form-control select2" id="state_item" name="state">
<option value="">--Select State--</option>
</select>
</div>
<div class="form-group mb-3">
<label for="city" class="form-label">City</label>
<select class="form-control select2" id="city" name="city">
<option value="">--Select City--</option>
</select>
</div>
<div class="form-group mb-3">
<label for="manual_address" class="form-label">Add Address</label>
<input type="text" id="manual_address" name="manual_address" class="form-control" placeholder="Type manual address">
</div>
<input type="hidden" id="latitude-input" name="latitude" />
<input type="hidden" id="longitude-input" name="longitude" />
<input type="hidden" name="country_input" id="country-input">
<input type="hidden" name="state_input" id="state-input">
<input type="hidden" name="city_input" id="city-input">
</div>
<!-- RIGHT SIDE: Map -->
<div class="col-md-6">
<div class="form-group mb-2">
<label class="form-label">Address from Map</label>
<input type="text" class="form-control" id="address-input" readonly>
</div>
<label class="form-label">Select Location on Map</label>
<div id="map" style="height: 400px; border: 1px solid #ddd;"></div>
</div>
</div>
</div>
</div>
</hr>
<div class="row mt-1">
<div class="col-md-12">
<div class="form-group">
<label for="admin_edit_reason">{{ __('Reason for Admin Edit') }} <span class="text-danger">*</span></label>
<textarea
name="admin_edit_reason"
id="admin_edit_reason"
class="form-control"
rows="3"
required
>{{ old('admin_edit_reason', $item->admin_edit_reason ?? '') }}</textarea>
@error('admin_edit_reason')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
</div>
</div>
<div class="mt-3">
<button type="submit" class="btn btn-primary">{{ __('Update Item') }}</button>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade" id="subcategory-modal" tabindex="-1" role="dialog" aria-labelledby="subcategory-modal-label" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="subcategory-modal-label">Select Category or Subcategory</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="current-category mb-3">
<label>Current Category:</label>
<input type="text" class="form-control" value="{{ $item->category->name }}" readonly>
</div>
<div class="categories-list">
@include('items.treeview', ['categories' => $categories, 'selected_category' => $item->category->id])
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" id="save-subcategory">Save changes</button>
</div>
</div>
</div>
</div>
</section>
@endsection
@section('script')
<script>
$(document).ready(function() {
$('#category-select').on('change', function () {
let categoryId = $(this).val();
$.ajax({
url: `/get-custom-fields/${categoryId}`,
type: 'GET',
success: function (response) {
let html = '';
html += `<div class="row">`;
response.fields.forEach(function (field) {
const isRequired = '';
html += `<div class="col-md-6 mb-3">`;
html += `<label>${field.name}${field.required ? ' <span class="text-danger">*</span>' : ''}</label>`;
if (field.type === 'textbox') {
html += `<input type="text" name="custom_fields[${field.id}]" class="form-control" ${isRequired} value="${field.value ?? ''}">`;
} else if (field.type === 'number') {
html += `<input type="number" name="custom_fields[${field.id}]" class="form-control" ${isRequired} value="${field.value ?? ''}">`;
} else if (field.type === 'fileinput') {
if (field.value) {
html += `<img src="${field.value[0] ?? ''}" alt="" width="100">`;
}
html += `<input type="file" name="custom_field_files[${field.id}]" class="form-control" ${isRequired}>`;
} else if (field.type === 'dropdown' || field.type === 'radio') {
const options = Array.isArray(field.values) ? field.values : JSON.parse(field.values ?? '[]');
html += `<select name="custom_fields[${field.id}]" class="form-select" ${isRequired}>`;
html += `<option value="">Select</option>`;
options.forEach(option => {
const selected = (field.value === option) ? 'selected' : '';
html += `<option value="${option}" ${selected}>${option}</option>`;
});
html += `</select>`;
} else if (field.type === 'checkbox') {
const options = Array.isArray(field.values) ? field.values : JSON.parse(field.values ?? '[]');
options.forEach(option => {
const checked = Array.isArray(field.value) && field.value.includes(option) ? 'checked' : '';
html += `
<div class="form-check">
<input class="form-check-input" type="checkbox" name="custom_fields[${field.id}][]" value="${option}" ${checked} ${isRequired}>
<label class="form-check-label">${option}</label>
</div>
`;
});
}
html += `</div>`;
});
if (!html) {
html = `<p class="text-muted">No custom fields for this category.</p>`;
}
html += `</div>`;
$('#custom').html(html);
if (response.is_job_category || response.price_optional) {
$('#price-field').hide();
$('#salary-fields').show();
} else {
$('#price-field').show();
$('#salary-fields').hide();
}
}
});
});
// Toggle subcategories on click
$('.toggle-button').on('click', function() {
$(this).siblings('.subcategories').toggle();
$(this).toggleClass('open');
});
});
</script>
<script>
document.querySelectorAll('input[name="selected_category"]').forEach(radio => {
radio.addEventListener('change', function () {
const selectedName = this.closest('label').innerText.trim();
document.querySelector('.current-category input').value = selectedName;
});
});
</script>
<script>
document.getElementById('save-subcategory').addEventListener('click', function () {
const selectedRadio = document.querySelector('input[name="selected_category"]:checked');
if (selectedRadio) {
const selectedId = selectedRadio.value;
const selectedName = selectedRadio.closest('label').innerText.trim();
const categorySelect = document.getElementById('category-select');
// Clear current options
categorySelect.innerHTML = '';
// Add the newly selected category
const option = document.createElement('option');
option.value = selectedId;
option.text = selectedName;
option.selected = true;
categorySelect.appendChild(option);
$('#category-select').trigger('change');
// Close the modal
const modal = bootstrap.Modal.getInstance(document.getElementById('subcategory-modal'));
modal.hide();
}
});
</script>
<script>
let map, marker;
function initMap() {
const defaultLat = parseFloat('{{ $item->latitude ?? '0' }}') || 20.5937;
const defaultLng = parseFloat('{{ $item->longitude ?? '0' }}') || 78.9629;
map = L.map('map').setView([defaultLat, defaultLng], 6);
// Load tiles
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors',
maxZoom: 19
}).addTo(map);
// Add marker
marker = L.marker([defaultLat, defaultLng], { draggable: true }).addTo(map);
updateLatLngInputs(defaultLat, defaultLng);
fetchAddressFromCoords(defaultLat, defaultLng);
marker.on('dragend', function (e) {
const pos = marker.getLatLng();
updateLatLngInputs(pos.lat, pos.lng);
fetchAddressFromCoords(pos.lat, pos.lng);
});
const provider = new GeoSearch.OpenStreetMapProvider();
const search = new GeoSearch.GeoSearchControl({
provider: provider,
style: 'bar',
autoComplete: true,
searchLabel: 'Enter address',
showMarker: false,
});
map.addControl(search);
map.on('geosearch/showlocation', function (result) {
const { x: lng, y: lat, label } = result.location;
marker.setLatLng([lat, lng]);
map.setView([lat, lng], 15);
updateLatLngInputs(lat, lng);
document.getElementById("address-input").value = label;
fetchAddressFromCoords(lat, lng); // Optional, if label lacks full info
});
}
function updateLatLngInputs(lat, lng) {
document.getElementById("latitude-input").value = lat;
document.getElementById("longitude-input").value = lng;
}
// Reverse geocoding using Nominatim
function fetchAddressFromCoords(lat, lng) {
fetch(`https://nominatim.openstreetmap.org/reverse?lat=${lat}&lon=${lng}&format=json`)
.then(res => res.json())
.then(data => {
const address = data.address;
const fullAddress = data.display_name || '';
document.getElementById("address-input").value = fullAddress;
document.getElementById("country-input").value = address.country || '';
document.getElementById("state-input").value = address.state || '';
document.getElementById("city-input").value = address.city || address.town || address.village || '';
});
}
// Initialize when tab is opened
document.addEventListener("DOMContentLoaded", function () {
const tab = document.querySelector('[href="#address"]');
if (tab) {
tab.addEventListener("click", () => {
setTimeout(() => initMap(), 300); // Delay for hidden tab
});
} else {
// fallback if map is visible by default
initMap();
}
});
</script>
@endsection