@props([

    'label' , 'name' , 'id'=> '' , 'value' , 'col' => ''
])



<div class="col-md-{{ $col ? $col : '6' }} col-12 mb-3">
    <label class="form-label mb-2">{{ $label }}</label>

    <div class="upload-box">
        <input class="form-control image" type="file" id="{{ $name .'formFile' }}" name="{{ $name }}">
        <i class="fas fa-cloud-upload-alt upload-icon"></i>
        <span class="upload-text">{{ __('dashboard.click_to_upload') }}</span>
    </div>

    @if($value)
    <div class="preview-box form-group prev" style="position: relative;">
        <img src="{{ viewImage($value) }}" class="img-thumbnail preview-{{ $name .'formFile' }}" alt="Preview">
        <button type="button" class="btn-close remove-image" data-id="{{ $name .'formFile' }}" style="position: absolute; top: 10px; right: 10px;"></button>
    </div>
    @else
    <div class="preview-box form-group prev" style="display: none; position: relative;">
        <img src="" class="img-thumbnail preview-{{ $name .'formFile' }}" alt="Preview">
        <button type="button" class="btn-close remove-image" data-id="{{ $name .'formFile' }}" style="position: absolute; top: 10px; right: 10px;"></button>
    </div>
    @endif

    @error($name)
        <span class="text-danger d-block mt-2">
            <small class="errorTxt">{{ $message }}</small>
        </span>
    @enderror
</div>