@extends('layouts.app')

@section('scripts')
<!-- Make sure jQuery is loaded first -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<!-- Include Summernote CSS and JS -->
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-lite.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-lite.min.js"></script>
<!-- Include AutoNumeric -->
<script src="https://cdn.jsdelivr.net/npm/autonumeric@4.6.0/dist/autoNumeric.min.js"></script>
<script>
$(document).ready(function() {
    // Initialize Summernote
    $('#keterangan').summernote({
        placeholder: 'Tulis hasil kunjungan di sini...',
        tabsize: 2,
        height: 200,
        toolbar: [
            ['style', ['bold', 'italic', 'underline', 'clear']],
            ['font', ['strikethrough']],
            ['para', ['ul', 'ol', 'paragraph']],
            ['insert', ['link']],
            ['view', ['fullscreen', 'codeview']]
        ]
    });

    // Clear note functionality
    $('#clearNote').click(function() {
        $('#keterangan').summernote('code', '');
    });
});</script>

@section('content')
<div class="row">
  <div class="col-12">
    <div class="card mb-4">
       <div style="background-color: #6b81eeff;" class="card-header pb-0">
        <h5>{{$assets->nama_debitur}}</h5>
      </div>
      <div class="card-body px-0 pt-0 pb-2 m-2 ms-2">
        <h6>Report Activity {{ $step }}/7</h6>
        @php
          $totalSteps = 7;
          $progressPercent = ($step / $totalSteps) * 100;
        @endphp
        <div class="progress col-lg-6 col-md-6 col-11 mb-3 m-2">
          <div class="progress-bar" role="progressbar"
            style="width: {{ $progressPercent }}%;"
            aria-valuenow="{{ $progressPercent }}"
            aria-valuemin="0"
            aria-valuemax="100">
          </div>
        </div>

        <form action="{{ route('collection_activities.store_step', [$id, $step]) }}" method="POST">
                @csrf

                <div style="display:none" class="col-lg-6 col-md-6 col-11 mb-3 m-2">
                  <label for="Asset ID">Asset ID</label>
                  <input type="text"
                  value="{{ old('asset_id', $previousData['asset_id'] ?? $id) }}"
                  name="asset_id"
                  class="form-control"
                  placeholder="ID Asset"
                  required
                  readonly>
                  @error('asset_id')
                    <div class="text-danger">{{ $message }}</div>
                  @enderror
                </div>

                <div style="display:none" class="col-lg-6 col-md-6 col-11 mb-3 m-2">
                  <label>Respon Debitur</label>
                  <select name="response" class="form-control" id="response" required>
                    <option value="" disabled {{ empty(old('response', $previousData['response'] ?? '')) ? 'selected' : '' }}>
                      Pilih Respon Debitur
                    </option>
                    @if(!empty($previousData['activity_tipe']) && isset($responseOptions))
                      @foreach($responseOptions as $option)
                        <option value="{{ $option['value'] }}"
                        {{ old('response', $previousData['response'] ?? '') == $option['value'] ? 'selected' : '' }}>
                          {{ $option['text'] }}
                        </option>
                      @endforeach
                    @endif
                  </select>
                  @error('response')
                    <div class="text-danger">{{ $message }}</div>
                  @enderror
                </div>

                <div class="col-lg-6 col-md-6 col-11 mb-3 m-2">
                  <label>Hasil Penagihan</label>
                  <select name="result" class="form-control" id="result" data-response="{{ old('response', $previousData['response'] ?? '') }}" data-selected="{{ old('result', $previousData['result'] ?? '') }}" required>
                    <option value="" disabled {{ empty(old('result', $previousData['result'] ?? '')) ? 'selected' : '' }}>
                      Pilih Hasil Penagihan
                    </option>
                    @if(!empty($previousData['response']) && isset($resultOptions))
                        @foreach($resultOptions as $option)
                          <option value="{{ $option['value'] }}"
                          {{ old('result', $previousData['result'] ?? '') == $option['value'] ? 'selected' : '' }}>
                              {{ $option['text'] }}
                          </option>
                        @endforeach
                    @endif
                  </select>
                  @error('result')
                    <div class="text-danger">{{ $message }}</div>
                  @enderror
                </div>

                <div class="col-lg-6 col-md-6 col-11 mb-3 m-2">
                  <label>Rencana Penyelesaian</label>
                  <select name="plan" class="form-control" id="plan" data-selected="{{ old('plan', $previousData['plan'] ?? '') }}" required>
                    <option value="" disabled {{ empty(old('plan', $previousData['plan'] ?? '')) ? 'selected' : '' }}>
                      Pilih Plan Penyelesaian
                    </option>
                    @if(!empty($previousData['result']) && isset($planOptions))
                        @foreach($planOptions as $option)
                          <option value="{{ $option['value'] }}"
                          {{ old('plan', $previousData['plan'] ?? '') == $option['value'] ? 'selected' : '' }}>
                              {{ $option['text'] }}
                          </option>
                        @endforeach
                    @endif
                  </select>
                  @error('plan')
                    <div class="text-danger">{{ $message }}</div>
                  @enderror
                </div>

                <div style="display: none;" class="col-lg-6 col-md-6 col-11 mb-3 m-2" id="price_group">
                  <label class="m-2">Harga Jual</label>
                  <input type="text" name="price" class="form-control" id="price" value="{{ old('price', $previousData['price'] ?? '0') }}" @if(!in_array(old('result', $previousData['plan'] ?? ''), ['6', '7', '9'])) @else readonly @endif required>
                  <span style="color: red; font-size: 10px;">*Wajib diisi jika ingin Jual Agunan</span>
                  @error('price')
                    <div class="text-danger">{{ $message }}</div>
                  @enderror
                </div>

                <div class="col-lg-6 col-md-6 col-11 mb-3 m-2" id="promise_group">
                  <label class="m-2">Periode Janji Bayar</label>
                  <input type="date" name="plan_date" class="form-control" id="plan_date" placeholder="Pilih Bulan" value="{{ old('plan_date', $previousData['plan_date'] ?? '') }}" min="{{ \Carbon\Carbon::now()->format('Y-m-d') }}" @if(!in_array(old('result', $previousData['result'] ?? ''), ['3', '4', '5', '6', '7'])) @else readonly @endif required>
                  @error('plan_date')
                    <div class="text-danger">{{ $message }}</div>
                  @enderror
                </div>

                <div class="col-lg-6 col-md-6 col-11 mb-3 m-2" id="nominal_group">
                  <label class="m-2">Nominal Janji Bayar</label>
                  <input type="text" name="nominal" class="form-control" id="nominal" value="{{ old('nominal', $previousData['nominal'] ?? '0') }}" @if(!in_array(old('result', $previousData['result'] ?? ''), ['3', '4', '5', '6', '7'])) @else readonly @endif required>
                  @error('nominal')
                    <div class="text-danger">{{ $message }}</div>
                  @enderror
                </div>

                <div class="col-lg-6 col-md-6 col-11 mb-3 m-2">
                    <label for="keterangan" class="form-label">Keterangan Visit</label>
                    <textarea id="keterangan" name="keterangan" class="form-control" required>{{ old('keterangan', $previousData['keterangan'] ?? $note->notes ??'') }}</textarea>
                    <button type="button" class="btn btn-danger mt-2" id="clearNote">Hapus Catatan</button>
                    @error('keterangan')
                      <div class="text-danger">{{ $message }}</div>
                    @enderror
                  </div>
                
                 <a href="{{ route('collection_activities.create_step', [$id, $step - 1]) }}"
                    class="btn btn-secondary m-2">
                        Sebelumnya
                    </a>
                <button type="submit" class="btn btn-primary m-2">Selanjutnya</button>
              </form>
      </div>
    </div>
  </div>
</div>
@endsection
@section('scripts')
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
  const alertData = {
    success: "{{ session('success') }}",
    error: "{{ session('error') }}",
    warning: "{{ session('warning') }}",
    info: "{{ session('info') }}"
  };

  Object.entries(alertData).forEach(([key, value]) => {
    if (value) {
      Swal.fire({
        icon: key,
        title: key.charAt(0).toUpperCase() + key.slice(1),
        text: value
      });
    }
  });
</script>


<script>
  
document.addEventListener('DOMContentLoaded', function () {
  //respon -> Result

  const responToResultOptions = {
    
    "Diangkat": [
      { value: "23", text: "Debitur Minta Waktu" },
      { value: "1", text: "Debitur Tidak Mampu" },
      { value: "3", text: "Janji Bayar Bertahap/Cicilan" },
      { value: "4", text: "Janji Bayar Bantuan Keluarga" }, 
      { value: "5", text: "Janji Bayar Penyelesaian" },
      { value: "6", text: "Janji Bayar Pelunasan/BTC" },
      { value: "7", text: "Janji Bayar Pihak Take Over/Ketiga" },
      { value: "8", text: "Mengaku Sudah Lunas/BTC" }, 
      { value: "9", text: "Mengaku Sudah Restruktur" },
      { value: "10", text: "Mengaku Membeli Lelang" },
      { value: "19", text: "Order Somasi / Pengosongan" },
      { value: "21", text: "Order Surat Pra Lelang" }
    ],
    "Ditutup": [
      { value: "14", text: "Tunggu Respon Somasi" },
      { value: "15", text: "Debitur Mengabaikan Somasi" },
      { value: "19", text: "Order Somasi / Pengosongan" },
      { value: "21", text: "Order Surat Pra Lelang" }

    ],
    "Tidak Diangkat": [
      { value: "13", text: "Dihubungi Tidak Respon" },
      { value: "14", text: "Tunggu Respon Somasi" },
      { value: "15", text: "Debitur Mengabaikan Somasi" },
      { value: "18", text: "Tidak ada info Debitur" },
      { value: "19", text: "Order Somasi / Pengosongan" },
      { value: "21", text: "Order Surat Pra Lelang" }
    ],
    "Bertemu": [
      { value: "23", text: "Debitur Minta Waktu" },
      { value: "1", text: "Debitur Tidak Mampu" },
      { value: "3", text: "Janji Bayar Bertahap/Cicilan" },
      { value: "4", text: "Janji Bayar Bantuan Keluarga" }, 
      { value: "5", text: "Janji Bayar Penyelesaian" },
      { value: "6", text: "Janji Bayar Pelunasan/BTC" },
      { value: "7", text: "Janji Bayar Pihak Take Over/Ketiga" },
      { value: "8", text: "Mengaku Sudah Lunas/BTC" }, 
      { value: "9", text: "Mengaku Sudah Restruktur" },
      { value: "10", text: "Mengaku Membeli Lelang" },
      { value: "11", text: "Melakukan Pembayaran" },
      { value: "14", text: "Tunggu Respon Somasi" },
      { value: "19", text: "Order Somasi / Pengosongan" },
      { value: "21", text: "Order Surat Pra Lelang" }

    ],
    "Tidak Bertemu": [
      { value: "22", text: "Debitur Sedang Tidak Di Rumah" },
      { value: "1", text: "Debitur Meninggal" },
      { value: "13", text: "Dihubungi Tidak Respon" },
      { value: "14", text: "Tunggu Respon Somasi" },
      { value: "15", text: "Debitur Mengabaikan Somasi" },
      { value: "16", text: "Info Sudah di Take Over" },
      { value: "18", text: "Tidak ada info Debitur" },
      { value: "19", text: "Order Somasi / Pengosongan" },
      { value: "21", text: "Order Surat Pra Lelang" }
    ],
    "Pindah Rumah": [
      { value: "12", text: "Ada Peminat Cessie/Lelang" },
      { value: "13", text: "Dihubungi Tidak Respon" },
      { value: "15", text: "Debitur Mengabaikan Somasi" },
      { value: "16", text: "Info Sudah di Take Over" },
      { value: "21", text: "Order Surat Pra Lelang" }
    ],
    "Alamat tidak ditemukan": [
      { value: "17", text: "Lokasi Tidak Ditemukan" },
      { value: "18", text: "Tidak ada info Debitur" }
    ]
  };


  // marketable -> Kondisi
  const resultToPlanOptions = {
    
    1: [
      { value: "6", text: "Jual Cessie/Lelang" },
      { value: "7", text: "Jual Bersama Agunan" },
      { value: "8", text: "Jual Aset Lain" },
      { value: "9", text: "Menyerahkan Agunan" } 
    ],
    2: [
      { value: "15", text: "Fileback" }

    ],
    3: [
      { value: "2", text: "BTC" },
      { value: "3", text: "Pelunasan Partial" },
      { value: "4", text: "BTC Partial" },
      { value: "10", text: "Visit Ulang Agunan Push Lagi" }
    ],
    4: [
      { value: "1", text: "Pelunasan" },
      { value: "2", text: "BTC" },
      { value: "3", text: "Pelunasan Partial" },
      { value: "4", text: "BTC Partial" },
      { value: "10", text: "Visit Ulang Agunan Push Lagi" }
    ],
    5: [
      { value: "1", text: "Pelunasan" },
      { value: "3", text: "Pelunasan Partial" },
      { value: "10", text: "Visit Ulang Agunan Push Lagi" }
    ],
    6: [
      { value: "1", text: "Pelunasan" },
      { value: "2", text: "BTC" },
      { value: "10", text: "Visit Ulang Agunan Push Lagi" }
    ],
    7: [
      { value: "1", text: "Pelunasan" },
      { value: "2", text: "BTC" },
      { value: "3", text: "Pelunasan Partial" },
      { value: "4", text: "BTC Partial" },
      { value: "10", text: "Visit Ulang Agunan Push Lagi" }
    ],
    8: [
      { value: "13", text: "Koordinasi principal" },
      { value: "15", text: "Fileback"}
    ],
    9: [
      { value: "13", text: "Koordinasi principal" },
      { value: "15", text: "Fileback"}
    ],
    10: [
      { value: "13", text: "Koordinasi principal" },
      { value: "15", text: "Visit Ulang Agunan Push Lagi"}
    ],
    11: [
      { value: "5", text: "Kawal Pembayaran" }
    ],
    12: [
      { value: "6", text: "Jual Cessie/Lelang" },
      { value: "7", text: "Jual Bersama Agunan" },
      { value: "8", text: "Jual Aset Lain" },
      { value: "9", text: "Menyerahkan Agunan" }
    ],
    13: [
      { value: "12", text: "Lakukan Visit Awal" },
      { value: "14", text: "Support Divisi Hukum" },
      { value: "16", text: "DC Ulang/FU" }
    ],
    14: [
      { value: "14", text: "Support Divisi Hukum" },
      { value: "16", text: "DC Ulang/FU" }
    ],
    15: [
      { value: "12", text: "Lakukan Visit Awal" },
      { value: "14", text: "Support Divisi Hukum" },
      { value: "16", text: "DC Ulang/FU" }
    ],
    16: [
      { value: "11", text: "Visit Lanjutan KTP/Kerja/Usaha" },
      { value: "13", text: "Koordinasi Principal" }
    ],
    17: [
      { value: "11", text: "Visit Lanjutan KTP/Kerja/Usaha" },
      { value: "13", text: "Koordinasi Principal" },
      { value: "16", text: "Fileback" }
    ],
    18: [
      { value: "6", text: "Jual Cessie/Lelang" },
      { value: "11", text: "Visit Lanjutan KTP/Kerja/Usaha" },
      { value: "13", text: "Koordinasi Principal" },
      { value: "15", text: "Fileback" }
    ],
    19: [
      { value: "14", text: "Support Divisi Hukum" }
    ],
    21: [
      { value: "14", text: "Support Divisi Hukum" }
    ],
    22: [
      { value: "10", text: "Visit Ulang Agunan Push Lagi" },
      { value: "16", text: "DC Ulang/FU" }
    ],
    23: [
      { value: "10", text: "Visit Ulang Agunan Push Lagi" },
      { value: "16", text: "DC Ulang/FU" }
    ]
  };

  

  const resultSelect = document.getElementById('result');
  const planSelect = document.getElementById('plan');
  const storedResponse = resultSelect.dataset.response;
  const selectedResult = resultSelect.dataset.selected;

  // Populate RESULT options dari response
  if (storedResponse && responToResultOptions[storedResponse]) {
    resultSelect.innerHTML = '<option value="" disabled selected>Pilih Hasil Kunjungan</option>';
    responToResultOptions[storedResponse].forEach(function (item) {
      const option = document.createElement('option');
      option.value = item.value;
      option.text = item.text;
      resultSelect.appendChild(option);
    });

    if (selectedResult) {
      resultSelect.value = selectedResult;
    }
  }

  // Populate PLAN options jika result sudah terpilih
  if (selectedResult && resultToPlanOptions[selectedResult]) {
    planSelect.innerHTML = '<option value="" disabled selected>Pilih Plan Penyelesaian</option>';
    resultToPlanOptions[selectedResult].forEach(function (item) {
      const option = document.createElement('option');
      option.value = item.value;
      option.text = item.text;
      planSelect.appendChild(option);
    });

    const oldPlan = planSelect.dataset.selected;
    if (oldPlan) {
      planSelect.value = oldPlan;
    }
  }

  // Event: saat user mengganti result
  resultSelect.addEventListener('change', function () {
    const val = this.value;

    // Update Plan options
    planSelect.innerHTML = '<option value="" disabled selected>Pilih Plan Penyelesaian</option>';
    if (resultToPlanOptions[val]) {
      resultToPlanOptions[val].forEach(function (item) {
        const option = document.createElement('option');
        option.value = item.value;
        option.text = item.text;
        planSelect.appendChild(option);
      });
    }

    // Enable/disable nominal & plan_date
    if (["3", "4", "5", "6", "7"].includes(val)) {
      document.getElementById("plan_date").disabled = false;
      document.getElementById("nominal").disabled = false;
    } else {
      document.getElementById("plan_date").disabled = true;
      document.getElementById("nominal").disabled = true;
    }
  });

  // Saat page load: atur disable/enable nominal & plan_date
  if (["3", "4", "5", "6", "7"].includes(selectedResult)) {
    document.getElementById("plan_date").disabled = false;
    document.getElementById("nominal").disabled = false;
  } else {
    document.getElementById("plan_date").disabled = true;
    document.getElementById("nominal").disabled = true;
  }

  // Initialize AutoNumeric
  AutoNumeric.multiple('#nominal', {
    digitGroupSeparator: '.',
    decimalCharacter: ',',
    decimalPlaces: 0,
    unformatOnSubmit: true,
    currencySymbol: 'Rp. ',
    currencySymbolPlacement: 'p'
  });
});


$("#result").trigger("change", function() {
  const selectedresult = $(this).val();
  if (["3", "4", "5", "6", "7"].includes(selectedresult)) {
    $("#plan_date").prop("disabled", false);
    $("#nominal").prop("disabled", false);
    $('#promise_group').show();
    $('#nominal_group').show();
  } else {
    $("#plan_date").prop("disabled", true);
    $("#nominal").prop("disabled", true);
    $('#promise_group').hide();
    $('#nominal_group').hide();
  }
});

$("#plan").on("change", function() {
  const selectedPlan = $(this).val();
  if (["6", "7", "9"].includes(selectedPlan)) {
    $("#price").prop("readonly", false);
    $('#price_group').show();
    AutoNumeric.multiple('#price', {
    digitGroupSeparator: '.',
    decimalCharacter: ',',
    decimalPlaces: 0,
    unformatOnSubmit: true,
    currencySymbol: 'Rp. ',
    currencySymbolPlacement: 'p'
  });
  } else {
    $("#price").prop("readonly", true);
    $('#price_group').hide();
  }
});


</script>
@endsection
</html>