@include('dashboard.layouts.header')

<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
  <!-- Content Header (Page header) -->
  <section class="content-header">
    <div class="container-fluid">
      <div class="row mb-2">
        <div class="col-sm-6">
          <h1>Engagement Letter Service(s) Agreement</h1>
        </div>
        <div class="col-sm-6">
          <ol class="breadcrumb float-sm-right">
            <li class="breadcrumb-item"><a href="/dashboard">Home</a></li>
            <li class="breadcrumb-item active">Engagement Letter Service(s) Agreement</li>
          </ol>
        </div>
      </div>
    </div><!-- /.container-fluid -->
  </section>

  <!-- Main content -->
  <section class="content">
    <div class="container-fluid">
      <div class="row">
        <!-- left column -->
        <div class="col-md-12">
          <!-- general form elements -->
          <div class="card card-primary">
            <div class="card-header">
              <h3 class="card-title">Engagement Letter Service(s) Agreement</h3>
            </div>
            </br>
            @if (session('success'))
            <div class="alert alert-success">
              {{ session('success') }}
            </div>
            @endif
            @if(isset($report))
            <form action="{{ route('engagement-letter-submit-form.update', $report->id) }}" method="POST" onsubmit="disableButton()">
              @csrf
              @method('PUT')
              @else
              <form action="{{ route('engagement-letter-submit-form') }}" method="POST" onsubmit="disableButton()">
                @csrf
                @endif
                <div class="card-body">
                  <div class="row">
                    <div class="col-md-6 col-print-6">
                      <div class="form-group">
                        <label for="effectiveDate">Effective Date</label>
                        <input type="date" value="{{ old('effective_date', isset($report->effective_date) ? $report->effective_date->format('Y-m-d') : '') }}" class="form-control" name="effective_date" id="effectiveDate">
                        @error('effective_date')
                        <span class="text-danger">{{ $message }}</span>
                        @enderror
                      </div>
                      @php
                      $services = is_array($report->services)
                      ? $report->services
                      : json_decode($report->services ?? '[]', true);
                      @endphp
                      <label>Service(s) Selected</label><br>
                      <div class="form-check">
                        <input type="checkbox" class="form-check-input" id="monthlyRetainer" name="services[]" value="Monthly Retainer"
                          {{ in_array('Monthly Retainer', (array) old('services', $services ?? [])) ? 'checked' : '' }}>
                        <label class="form-check-label" for="monthlyRetainer">Monthly Retainer</label>
                      </div>
                      </br>
                      <h5>Notices/Audit</h5>
                      <div class="form-check">
                        <input type="checkbox" class="form-check-input" id="taxNotices" name="services[]" value="Tax related Notices"
                          {{ in_array('Tax related Notices', (array) old('services', $services ?? [])) ? 'checked' : '' }}>
                        <label class="form-check-label" for="taxNotices">Tax related Notices</label>
                      </div>
                      <div class="form-check">
                        <input type="checkbox" class="form-check-input" id="workerCompAudit" name="services[]" value="Worker Compensation Audit"
                          {{ in_array('Worker Compensation Audit', (array) old('services', $services ?? [])) ? 'checked' : '' }}>
                        <label class="form-check-label" for="workerCompAudit">Worker Compensation Audit</label>
                      </div>
                      <div class="form-check">
                        <input type="checkbox" class="form-check-input" id="unemploymentAudit" name="services[]" value="Unemployment Audit"
                          {{ in_array('Unemployment Audit', (array) old('services', $services ?? [])) ? 'checked' : '' }}>
                        <label class="form-check-label" for="unemploymentAudit">Unemployment Audit</label>
                      </div>

                      </br>
                      <label>If not monthly, please fill out below:</label>
                      <div class="form-group">
                        <label for="taxReportingFee">Tax Reporting Fee (Quarterly/Annual)</label>
                        <input type="number" step="0.01" value="{{ old('tax_reporting_fee', $report->tax_reporting_fee ?? '') }}" class="form-control" name="tax_reporting_fee" id="taxReportingFee" placeholder="Enter Fee">
                      </div>


                    </div>

                    <div class="col-md-6 col-print-6">
                      <div class="form-group">
                        <label for="businessName">Business Name</label>
                        <input type="text" value="{{ old('business_name', $report->business_name ?? '') }}" class="form-control" name="business_name" id="businessName" placeholder="Enter Business Name">
                        @error('business_name')
                        <span class="text-danger">{{ $message }}</span>
                        @enderror
                      </div>
                      <div class="form-group">
                        <label for="monthlyFee">Monthly Fee</label>
                        <input type="number" step="0.01" value="{{ old('monthly_fee', $report->monthly_fee ?? '') }}" class="form-control" name="monthly_fee" id="monthlyFee" placeholder="Enter Monthly Fee">
                      </div>


                      <h5>Included Services</h5>
                      <div class="form-check">
                        <input type="checkbox" class="form-check-input" id="quarterlySalesTax" name="services[]" value="Quarterly Sales Tax"
                          {{ in_array('Quarterly Sales Tax', (array) old('services', $services ?? [])) ? 'checked' : '' }}>
                        <label class="form-check-label" for="quarterlySalesTax">Quarterly Sales Tax</label>
                      </div>
                      <div class="form-check">
                        <input type="checkbox" class="form-check-input" id="quarterlyPayroll" name="services[]" value="Quarterly Payroll Reporting"
                          {{ in_array('Quarterly Payroll Reporting', (array) old('services', $services ?? [])) ? 'checked' : '' }}>
                        <label class="form-check-label" for="quarterlyPayroll">Quarterly Payroll Reporting</label>
                      </div>
                      <div class="form-check">
                        <input type="checkbox" class="form-check-input" id="annualCorporate" name="services[]" value="Annual Corporate Tax Reporting"
                          {{ in_array('Annual Corporate Tax Reporting', (array) old('services', $services ?? [])) ? 'checked' : '' }}>
                        <label class="form-check-label" for="annualCorporate">Annual Corporate Tax Reporting</label>
                      </div>


                    </div>
                  </div>

                  </br>
                  <h4>Additional Services (Billed Separately)</h4>
                  <div class="row">
                    <div class="col-md-6 col-print-6">
                      <div class="form-group">
                        <label for="payrollProcessingFee">Payroll Processing Fee (per cycle, up to 4 employees)</label>
                        <input type="number" step="0.01" value="{{ old('payroll_processing_fee', $report->payroll_processing_fee ?? '') }}" class="form-control" name="payroll_processing_fee" id="payrollProcessingFee" placeholder="Enter Fee">
                      </div>

                      <div class="form-group">
                        <label for="accountingFee">Accounting & Bookkeeping Flat Fee</label>
                        <input type="number" step="0.01" value="{{ old('accounting_fee', $report->accounting_fee ?? '') }}" class="form-control" name="accounting_fee" id="accountingFee" placeholder="Enter Fee">
                      </div>

                    </div>

                    <div class="col-md-6 col-print-6">
                      <div class="form-group">
                        <label for="auditRate">Corporate & Sales Tax Audits Hourly Rate</label>
                        <input type="number" step="0.01" value="{{ old('audit_rate', $report->audit_rate ?? '') }}" class="form-control" name="audit_rate" id="auditRate" placeholder="Enter Rate">
                      </div>



                    </div>
                  </div>




                  <h5>Acknowledgment</h5>
                  <p>
                    - As an authorized officer of the company, I agree to receive above services provided by ITAXEXPERTS.COM <br>
                    - I authorize ITAXEXPERTS.COM to be an authorized reporting agent for all tax reporting including Sales, Payroll, Corporate <br>
                    - I authorize ITAXEXPERTS.COM to electronically submit all tax liabilities for Federal, State and Local utilizing our Company bank account <br>
                    - I authorize ITAXEXPERTS.COM to debit company bank account for payroll processing fee every pay cycle & their tax reporting & Accounting Services fee <br>
                    - I authorize ITAXEXPERTS.COM to receive all correspondence with IRS and other tax authorities to their office address
                  </p>

                  <div class="row">
                    <div class="col-md-6 col-print-6">
                      <div class="form-group">
                        <label for="signature">Signature</label>
                        <input type="text" value="{{ old('signature', $report->signature ?? '') }}" class="form-control" name="signature" id="signature" placeholder="Enter Signature">
                      </div>
                      <div class="form-group">
                        <label for="signedBy">Signed By</label>
                        <input type="text" value="{{ old('signed_by', $report->signed_by ?? '') }}" class="form-control" name="signed_by" id="signedBy" placeholder="Enter Name">
                      </div>
                    </div>
                    <div class="col-md-6 col-print-6">
                      <div class="form-group">
                        <label for="title">Title</label>
                        <input type="text" value="{{ old('title', $report->title ?? '') }}" class="form-control" name="title" id="title" placeholder="Enter Title">
                      </div>
                      <div class="form-group">
                        <label for="agreementDate">Date</label>
                        <input type="date" value="{{ old('agreement_date', isset($report->agreement_date) ? $report->agreement_date->format('Y-m-d') : '') }}" class="form-control" name="agreement_date" id="agreementDate">
                      </div>
                    </div>
                  </div>

                  <div class="card-footer">
                    <button type="submit" class="btn btn-primary" id="submitButton">Submit</button>
                  </div>
              </form>

          </div>
        </div>
      </div>
    </div>
  </section>
</div>
@include('dashboard.layouts.footer')

<script>
  function formatUSPhone(input) {

    let value = input.value.replace(/\D/g, ''); // remove non-digits
    if (value.length > 3 && value.length <= 6) {
      input.value = `(${value.slice(0, 3)}) ${value.slice(3)}`;
    } else if (value.length > 6) {
      input.value = `(${value.slice(0, 3)}) ${value.slice(3, 6)}-${value.slice(6, 10)}`;
    } else {
      input.value = value;
    }
  }
  document.addEventListener("DOMContentLoaded", function() {
    document.getElementById('shareholder1Phone').addEventListener('input', function() {
      formatUSPhone(this);
    });
    document.getElementById('shareholder1Fax').addEventListener('input', function() {
      formatUSPhone(this);
    });
    document.getElementById('shareholder2Phone').addEventListener('input', function() {
      formatUSPhone(this);
    });
    document.getElementById('shareholder2Fax').addEventListener('input', function() {
      formatUSPhone(this);
    });
  });

  function formatUSSSN(input) {
    let value = input.value.replace(/\D/g, ''); // remove all non-digits

    if (value.length > 5) {
      // 123-45-6789
      input.value = `${value.slice(0, 3)}-${value.slice(3, 5)}-${value.slice(5, 9)}`;
    } else if (value.length > 3) {
      // 123-45
      input.value = `${value.slice(0, 3)}-${value.slice(3, 5)}`;
    } else {
      // 123
      input.value = value;
    }
  }
  document.addEventListener("DOMContentLoaded", function() {
    document.getElementById('shareholder1SSN').addEventListener('input', function() {
      formatUSSSN(this);
    });
    document.getElementById('shareholder2SSN').addEventListener('input', function() {
      formatUSSSN(this);
    });

  });
</script>

<script>
  $(function() {
    bsCustomFileInput.init();
  });
</script>
<script>
  function disableButton() {
    let btn = document.getElementById('submitButton');
    btn.disabled = true;
    btn.innerText = 'Submitting...'; // Change button text

    // Allow form submission
    return true;
  }
</script>
</body>

</html>