<?= $this->extend('admin/layout/default') ?>
<?= $this->section('content') ?>

<section class="content-header">
  <div class="container-fluid">
    <div class="row mb-2">
      <div class="col-sm-6">
        <h1>Edit Subscription</h1>
      </div>
      <div class="col-sm-6">
        <ol class="breadcrumb float-sm-right">
          <li class="breadcrumb-item"><a href="<?php echo url('/') ?>">Home</a></li>
          <li class="breadcrumb-item"><a href="<?php echo url('subscriptions') ?>">Subscriptions</a></li>
          <li class="breadcrumb-item active">Edit</li>
        </ol>
      </div>
    </div>
  </div>
</section>

<section class="content">
<?php echo form_open('subscriptions/update/'.$subscription->id, ['class' => 'form-validate', 'autocomplete' => 'off']); ?>
  <div class="card">
    <div class="card-body">
      <div class="form-group">
        <label>Title</label>
        <input type="text" class="form-control" name="title" value="<?php echo esc($subscription->title) ?>" required autofocus>
      </div>
      <div class="form-group">
        <label>Description</label>
        <textarea class="form-control" name="description" rows="3"><?php echo esc($subscription->description) ?></textarea>
      </div>
      <div class="form-group">
        <label>Plans</label>
        <table class="table table-bordered" id="subscriptionRowsTable">
          <thead>
            <tr>
              <th width="200">Price</th>
              <th width="220">Duration (months)</th>
              <th width="180">Status</th>
              <th width="120">Action</th>
            </tr>
          </thead>
          <tbody>
            <?php $rows = $rows ?? [] ?>
            <?php if (!$rows): ?>
              <?php $rows = [$subscription] ?>
            <?php endif ?>
            <?php foreach ($rows as $r): ?>
              <tr class="sub-row">
                <td>
                  <input type="hidden" name="row_id[]" value="<?php echo (int) ($r->id ?? 0) ?>">
                  <input type="number" step="0.01" class="form-control" name="price[]" value="<?php echo esc($r->price ?? 0) ?>">
                </td>
                <td>
                  <input type="number" class="form-control" name="duration_months[]" value="<?php echo esc($r->duration_months ?? 1) ?>" min="1" required>
                </td>
                <td>
                  <?php $st = (int) ($r->status ?? 0) ?>
                  <select class="form-control" name="status[]">
                    <option value="1" <?php echo $st ? 'selected' : '' ?>>Active</option>
                    <option value="0" <?php echo !$st ? 'selected' : '' ?>>Inactive</option>
                  </select>
                </td>
                <td class="text-nowrap">
                  <button type="button" class="btn btn-sm btn-success btn-add-row"><i class="fa fa-plus"></i></button>
                  <button type="button" class="btn btn-sm btn-danger btn-remove-row"><i class="fa fa-trash"></i></button>
                </td>
              </tr>
            <?php endforeach ?>
          </tbody>
        </table>
      </div>
    </div>
    <div class="card-footer">
      <div class="row">
        <div class="col"><a href="<?php echo url('subscriptions') ?>" class="btn btn-flat btn-danger" onclick="return confirm('Leave without saving?')">Cancel</a></div>
        <div class="col text-right"><button type="submit" class="btn btn-flat btn-primary">Save</button></div>
      </div>
    </div>
  </div>
<?php echo form_close(); ?>
</section>

<?= $this->endSection() ?>
<?= $this->section('js') ?>
<script>
  $(document).ready(function() {
    $('.form-validate').validate();

    function resetRow($row) {
      $row.find('input[name="row_id[]"]').val('');
      $row.find('input[name="price[]"]').val('0');
      $row.find('input[name="duration_months[]"]').val('1');
      $row.find('select[name="status[]"]').val('1');
    }

    $(document).on('click', '.btn-add-row', function() {
      var $row = $(this).closest('tr');
      var $newRow = $row.clone();
      resetRow($newRow);
      $('#subscriptionRowsTable tbody').append($newRow);
    });

    $(document).on('click', '.btn-remove-row', function() {
      var $tbody = $('#subscriptionRowsTable tbody');
      var $rows = $tbody.find('tr');
      if ($rows.length <= 1) {
        resetRow($rows.first());
        return;
      }
      $(this).closest('tr').remove();
    });
  });
</script>
<?= $this->endSection() ?>

