<?php
// caracteristicasproducto.php
// Render de características del producto (sin MySQL en PHP): consume Node API

include '../includes/session_control.php';
require_once '../cotizaciones/api/_node.php';

$idProducto = isset($_GET['id']) ? intval($_GET['id']) : 0;
if (!$idProducto) {
    echo "ID de producto inválido.";
    exit;
}

$token = cpn_node_token_or_fail();
$base = cpn_node_api_base();

$r = cpn_node_request('GET', $base . '/api/productos/' . urlencode((string)$idProducto) . '/caracteristicas', $token, null);
if (empty($r['ok'])) {
    echo '<div class="alert alert-danger">No se pudieron cargar las características.</div>';
    exit;
}

$rows = $r['data']['rows'] ?? [];
$opts = $r['data']['opts'] ?? [];

function opcionesCaracteristicas($opts, $selected)
{
    $html = '';
    foreach ($opts as $o) {
        $id = (int)($o['id'] ?? 0);
        $nombre = (string)($o['nombre'] ?? '');
        if (!$id) continue;
        $sel = ($id === (int)$selected) ? 'selected' : '';
        $html .= '<option value="' . htmlspecialchars((string)$id) . '" ' . $sel . '>'
            . htmlspecialchars($nombre) . '</option>';
    }
    return $html;
}
?>

<div id="caracteristicas-contenedor">
    <div class="form-row align-items-end mb-2">
        <div class="col-md-6">
            <label class="field-label">Característica</label>
            <select id="newCaracteristica" class="form-control">
                <option value="">— Seleccionar —</option>
                <?= opcionesCaracteristicas($opts, 0) ?>
            </select>
        </div>
        <div class="col-md-4">
            <label class="field-label">Valor</label>
            <input type="text" id="newValorCaracteristica" class="form-control" placeholder="Valor">
        </div>
        <div class="col-md-2">
            <button type="button" id="addCaracteristica" class="btn btn-primary btn-block">Agregar</button>
        </div>
    </div>

    <div class="table-responsive">
        <table class="table table-bordered table-sm">
            <thead>
                <tr>
                    <th style="width:45%">Característica</th>
                    <th>Valor</th>
                    <th style="width:120px">Eliminar</th>
                </tr>
            </thead>
            <tbody>
                <?php foreach ($rows as $row):
                    $idRow = (int)($row['id'] ?? 0);
                    $idCar = (int)($row['idCaracteristica'] ?? 0);
                    $valor = (string)($row['valor'] ?? '');
                    if (!$idRow) continue;
                ?>
                    <tr data-char-id="<?= $idRow ?>">
                        <td>
                            <select class="form-control form-control-sm selChar">
                                <?= opcionesCaracteristicas($opts, $idCar) ?>
                            </select>
                        </td>
                        <td>
                            <input type="text" class="form-control form-control-sm valChar" value="<?= htmlspecialchars($valor) ?>">
                        </td>
                        <td>
                            <button type="button" class="btn btn-sm btn-danger delete-char">Eliminar</button>
                        </td>
                    </tr>
                <?php endforeach; ?>
            </tbody>
        </table>
    </div>
</div>