@extends('layouts.user_type.auth')

@section('companyProfile.company')

<div class="row">
    <div class="col-12">

        @include('components.alert')

        @if($showMessageFlag && isset($companyProfile))
            <div class="alert alert-danger alert-dismissible fade show" role="alert" id="error-alert">
                <span>You have to first subscribe a company.</span>
            </div>
        @endif

        <div class="card mb-4 mx-4">
            <div class="card p-3">
                <div class="d-flex justify-content-between align-items-center">
                    <h3>{{ isset($companyProfile) ? $company_name : 'Create Company Profile' }}</h3>
                    <div>
                        <a href="{{ route('companyProfile.company', ['id' => request()->route('id') ? request()->route('id') : null]) }}" class="btn btn-info text-dark me-2">Company</a>
                        @if(isset($companyProfile))
                            <!-- <a href="{{ route('companyProfile.basicInfo', ['id' => request()->route('id') ? request()->route('id') : null]) }}" class="btn btn-primary me-2">Admin Contact</a> -->
                            <a href="{{ route('companyProfile.tenant', ['id' => request()->route('id') ? request()->route('id') : null]) }}" class="btn btn-primary me-2 {{ $showMessageFlag ? 'disabled' : ''}}">Tenant</a>
                            <a href="{{ route('companyProfile.microsoft', ['id' => request()->route('id') ? request()->route('id') : null]) }}" class="btn btn-primary me-2 {{ $showMessageFlag ? 'disabled' : ''}}">Microsoft</a>
                            <a href="{{ route('companyProfile.oneDriveFolder', ['id' => request()->route('id')]) }}" class="btn btn-primary me-2 {{ $showMessageFlag ? 'disabled' : ''}} ">OneDrive Folder</a>
                            <a href="{{ route('companyProfile.config', ['id' => request()->route('id') ? request()->route('id') : null]) }}" class="btn btn-primary me-2 {{ $showMessageFlag ? 'disabled' : ''}}">Config</a>
                            <a href="{{ route('companyProfile.employee', ['id' => request()->route('id')]) }}" class="btn btn-primary me-2 {{ $showMessageFlag ? 'disabled' : ''}}">Employee</a>
                        @endif
                    </div>
                </div>

                <form
                    action="{{ isset($companyProfile->id) ? route('companyProfile.company.storeOrUpdate', $companyProfile->id) : route('companyProfile.company.storeOrUpdate') }}"
                    method="POST" enctype="multipart/form-data">
                    @csrf
                    <div class="row">
                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="company_name">Company Name<span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="company_name" name="company_name"
                                    value="{{ isset($companyProfile) ? $companyProfile->company_name : '' }}"
                                    placeholder="Enter company name" required>
                            </div>
                            <div class="form-group">
                                <label for="company_logo">Company Logo</label>

                                <div class="d-flex mt-2">
                                    
                                    <div class="me-2">
                                        <label for="logoInput" class="btn btn-primary">
                                            <i class="fas fa-upload"></i> Upload
                                        </label>
                                        <input type="file" id="logoInput" name="company_logo_file" accept="image/*" style="display: none;" onchange="handleLogoSelection(this)">
                                    </div>

                                    <input type="hidden" id="savedLogoUrl" name="company_logo" value="{{ $companyProfile->company_logo ?? '' }}">

                                    <button type="button" class="btn btn-primary d-none me-2" id="viewLogoBtn" onclick="viewLogo()">
                                        <i class="fas fa-eye"></i> View
                                    </button>

                                    <button type="button" class="btn btn-danger d-none" id="cancelLogoBtn" onclick="cancelLogoSelection()">
                                        <i class="fas fa-times"></i> Cancel
                                    </button>
                                </div>

                            </div>

                            <div class="form-group">
                                <label for="company_description">Company Description</label>
                                <textarea class="form-control" id="company_description" name="company_description"
                                    rows="5"
                                    placeholder="Enter company description">{{ isset($companyProfile) ? $companyProfile->company_description : '' }}</textarea>
                            </div>

                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="phone">Phone <span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="phone" name="phone"
                                    value="{{ isset($companyProfile) ? $companyProfile->phone : '' }}"
                                    placeholder="Enter phone number" required>
                            </div>
                            <div class="form-group">
                                <label for="email">Email<span class="text-danger">*</span></label>
                                <input type="email" class="form-control" id="email" name="email"
                                    value="{{ isset($companyProfile) ? $companyProfile->email : '' }}"
                                    placeholder="Enter email" required>
                            </div>
                            <div class="form-group">
                                <label for="website">Website</label>
                                <input type="text" class="form-control" id="website" name="website"
                                    value="{{ isset($companyProfile) ? $companyProfile->website : '' }}"
                                    placeholder="Enter website URL">
                            </div>
                            <div class="form-group">
                                <label for="company_representative">Company Representative<span class="text-danger">*</span></label>
                                <select class="form-control select21" id="company_representative" name="company_representative" required>
                                    <option value="">Select Representative</option>
                                    @foreach($users as $user)
                                        <option value="{{ $user->id }}" 
                                            {{ isset($companyProfile) && $companyProfile->company_representative && $companyProfile->company_representative == $user->id ? 'selected' : '' }}>
                                            {{ $user->name }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="address">Address<span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="address" name="address"
                                    value="{{ isset($companyProfile) ? $companyProfile->address : '' }}"
                                    placeholder="Enter address" required>
                            </div>
                            <div class="form-group">
                                <label for="pincode">Pincode<span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="pincode" name="pincode"
                                    value="{{ isset($companyProfile) ? $companyProfile->pincode : '' }}"
                                    placeholder="Enter pincode" required>
                            </div>
                            <div class="form-group">
                                <label for="city">City<span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="city" name="city"
                                    value="{{ isset($companyProfile) ? $companyProfile->city : '' }}"
                                    placeholder="Enter city" required>
                            </div>
                            <div class="form-group">
                                <label for="state">State<span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="state" name="state"
                                    value="{{ isset($companyProfile) ? $companyProfile->state : '' }}"
                                    placeholder="Enter state" required>
                            </div>
                            <div class="form-group">
                                <label for="country">Country<span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="country" name="country"
                                    value="{{ isset($companyProfile) ? $companyProfile->country : '' }}"
                                    placeholder="Enter country" required>
                            </div>
                        </div>
                    </div>

                    <div class="d-flex justify-content-end mt-3">
                        <button type="submit" class="btn btn-success me-2">{{ isset($companyProfile) ? 'Update' : 'Create' }}</button>
                        <a href="{{ route('companyProfile.show') }}" class="btn btn-danger">Close</a>
                    </div>
                </form>

            </div>
        </div>
    </div>
</div>


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>

    $(document).ready(function() {
        $('.select21').select2();
    });

    document.addEventListener("DOMContentLoaded", function () {
        let selectedLogoUrl = '';  

        const logoInput = document.getElementById('logoInput');
        const viewLogoBtn = document.getElementById('viewLogoBtn');
        const cancelLogoBtn = document.getElementById('cancelLogoBtn');
        const uploadLabel = document.querySelector('label[for="logoInput"]');
        const savedLogoUrlInput = document.getElementById('savedLogoUrl');
        
        logoInput.addEventListener('change', function() {
            const file = logoInput.files[0];

            if (file && file.type.startsWith('image/')) {
                selectedLogoUrl = URL.createObjectURL(file); 
                viewLogoBtn.classList.remove('d-none');  
                cancelLogoBtn.classList.remove('d-none');
                uploadLabel.classList.add('d-none');  
            } else {
                selectedLogoUrl = '';  
                viewLogoBtn.classList.add('d-none'); 
                cancelLogoBtn.classList.add('d-none'); 
                uploadLabel.classList.remove('d-none');  
            }
        });

        function viewLogo() {
            const savedLogoUrl = savedLogoUrlInput.value;

            if (selectedLogoUrl) {
                window.open(selectedLogoUrl, '_blank');  
            } else if (savedLogoUrl) {
                window.open('{{ url('storage/') }}' + '/' + savedLogoUrl, '_blank');  
            }
        }

        function cancelLogoSelection() {
            logoInput.value = '';  
            selectedLogoUrl = '';  
            viewLogoBtn.classList.add('d-none');  
            cancelLogoBtn.classList.add('d-none');  
            uploadLabel.classList.remove('d-none');  
        }

        const savedLogoUrl = savedLogoUrlInput.value;

        if (savedLogoUrl) {
            viewLogoBtn.classList.remove('d-none');
            cancelLogoBtn.classList.remove('d-none');
            uploadLabel.classList.add('d-none');
        } else {
            viewLogoBtn.classList.add('d-none');
            cancelLogoBtn.classList.add('d-none');
            uploadLabel.classList.remove('d-none');
        }

        window.viewLogo = viewLogo;
        window.cancelLogoSelection = cancelLogoSelection;
    });

    document.getElementById('disable');

</script>
@endsection