Autosave: 20260518-225855
This commit is contained in:
parent
faacccd59f
commit
bbd26aa303
@ -5,6 +5,10 @@ include 'layout_header.php';
|
||||
|
||||
$db = db();
|
||||
|
||||
// Obtener productos para el select del modal
|
||||
$stmt_products = $db->query("SELECT id, nombre FROM products ORDER BY nombre ASC");
|
||||
$productos_select = $stmt_products->fetchAll(PDO::FETCH_ASSOC);
|
||||
|
||||
// Obtener videos y sus costos asociados
|
||||
$stmt = $db->query("SELECT mv.id, mv.orden, mv.foto_producto, p.nombre as nombre_producto,
|
||||
mc.costo_producto, mc.costo_fijo_film, mc.comision_asesora,
|
||||
@ -43,13 +47,31 @@ $costos = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
background-color: #ffffff;
|
||||
transition: all 0.2s;
|
||||
position: relative;
|
||||
min-width: 80px;
|
||||
pointer-events: auto !important;
|
||||
}
|
||||
.editable:hover {
|
||||
background-color: #f0f7ff !important;
|
||||
cursor: pointer;
|
||||
box-shadow: inset 0 0 0 1px #0d6efd;
|
||||
box-shadow: inset 0 0 0 2px #0d6efd;
|
||||
z-index: 1;
|
||||
}
|
||||
.edit-icon {
|
||||
position: absolute;
|
||||
right: 4px;
|
||||
top: 4px;
|
||||
font-size: 0.7rem;
|
||||
color: #0d6efd;
|
||||
background: rgba(255,255,255,0.9);
|
||||
padding: 2px 4px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid #0d6efd;
|
||||
display: none;
|
||||
z-index: 10;
|
||||
}
|
||||
.editable:hover .edit-icon {
|
||||
display: block;
|
||||
}
|
||||
.recaudo-cell {
|
||||
background-color: #fdfdfd;
|
||||
cursor: default;
|
||||
@ -57,25 +79,63 @@ $costos = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
}
|
||||
.inline-edit-input {
|
||||
width: 100%;
|
||||
padding: 2px 5px;
|
||||
padding: 4px 8px;
|
||||
font-size: 0.85rem;
|
||||
border: 2px solid #0d6efd;
|
||||
border-radius: 3px;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
|
||||
pointer-events: auto !important;
|
||||
}
|
||||
.bg-total {
|
||||
background-color: #f1f3f5;
|
||||
font-weight: bold;
|
||||
}
|
||||
.btn-delete-row {
|
||||
padding: 0.2rem 0.4rem;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.3;
|
||||
transition: opacity 0.2s;
|
||||
pointer-events: auto !important;
|
||||
}
|
||||
tr:hover .btn-delete-row {
|
||||
opacity: 1;
|
||||
}
|
||||
/* Fix for modal selection and backdrop issues */
|
||||
.modal {
|
||||
z-index: 2000 !important;
|
||||
}
|
||||
.modal-backdrop {
|
||||
z-index: 1900 !important;
|
||||
}
|
||||
.modal-content {
|
||||
box-shadow: 0 5px 15px rgba(0,0,0,0.5);
|
||||
pointer-events: auto !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<div>
|
||||
<h2 class="mb-0">Cálculo de Costos</h2>
|
||||
<p class="text-muted small">Gestión de costos por producto de marketing. <span class="badge bg-info text-dark">Doble clic en las celdas blancas para editar</span></p>
|
||||
<p class="text-muted small">Gestión de costos por producto de marketing. <span class="badge bg-info text-dark">Haz clic en las celdas blancas para editar</span></p>
|
||||
</div>
|
||||
<div class="d-flex gap-2">
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" onclick="alert('JavaScript está funcionando correctamente en este navegador.')">
|
||||
<i class="fas fa-bug"></i> Probar JS
|
||||
</button>
|
||||
<button type="button" class="btn btn-primary shadow-sm" onclick="abrirModalNuevo()">
|
||||
<i class="fas fa-plus me-2"></i> Nuevo Producto
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php if (isset($_GET['success'])): ?>
|
||||
<div class="alert alert-success alert-dismissible fade show" role="alert">
|
||||
¡Operación realizada con éxito!
|
||||
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="card shadow-sm border-0">
|
||||
<div class="card-body p-0">
|
||||
<div class="table-responsive">
|
||||
@ -97,12 +157,13 @@ $costos = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
<th class="text-center recaudo-cell">Recaudo 2 (Auto)</th>
|
||||
<th class="text-center">Promo 3</th>
|
||||
<th class="text-center recaudo-cell">Recaudo 3 (Auto)</th>
|
||||
<th class="text-center">Acción</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php if (empty($costos)): ?>
|
||||
<tr>
|
||||
<td colspan="15" class="text-center py-4 text-muted">No hay videos registrados en producción.</td>
|
||||
<td colspan="16" class="text-center py-4 text-muted">No hay videos registrados en producción.</td>
|
||||
</tr>
|
||||
<?php else: ?>
|
||||
<?php foreach ($costos as $c): ?>
|
||||
@ -139,42 +200,55 @@ $costos = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
<span class="text-muted small">Sin foto</span>
|
||||
<?php endif; ?>
|
||||
</td>
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="costo_producto">
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="costo_producto" onclick="startEdit(this)">
|
||||
S/ <?php echo number_format($c['costo_producto'] ?? 0, 2); ?>
|
||||
<span class="edit-icon"><i class="fas fa-pencil-alt"></i></span>
|
||||
</td>
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="costo_fijo_film">
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="costo_fijo_film" onclick="startEdit(this)">
|
||||
S/ <?php echo number_format($c['costo_fijo_film'] ?? 0, 2); ?>
|
||||
<span class="edit-icon"><i class="fas fa-pencil-alt"></i></span>
|
||||
</td>
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="comision_asesora">
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="comision_asesora" onclick="startEdit(this)">
|
||||
S/ <?php echo number_format($c['comision_asesora'] ?? 0, 2); ?>
|
||||
<span class="edit-icon"><i class="fas fa-pencil-alt"></i></span>
|
||||
</td>
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="delivery">
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="delivery" onclick="startEdit(this)">
|
||||
S/ <?php echo number_format($c['delivery'] ?? 0, 2); ?>
|
||||
<span class="edit-icon"><i class="fas fa-pencil-alt"></i></span>
|
||||
</td>
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="costo_publicitario">
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="costo_publicitario" onclick="startEdit(this)">
|
||||
S/ <?php echo number_format($c['costo_publicitario'] ?? 0, 2); ?>
|
||||
<span class="edit-icon"><i class="fas fa-pencil-alt"></i></span>
|
||||
</td>
|
||||
<td class="text-center bg-total inversion-total" id="total-<?php echo $c['id']; ?>">
|
||||
S/ <?php echo number_format($inversion_total, 2); ?>
|
||||
</td>
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="promo_1">
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="promo_1" onclick="startEdit(this)">
|
||||
<?php echo htmlspecialchars($c['promo_1'] ?: '-'); ?>
|
||||
<span class="edit-icon"><i class="fas fa-pencil-alt"></i></span>
|
||||
</td>
|
||||
<td class="text-center recaudo-cell recaudo-1 <?php echo $recaudo1 !== null ? ($recaudo1 >= 0 ? 'text-success fw-bold' : 'text-danger fw-bold') : 'text-muted'; ?>" data-id="<?php echo $c['id']; ?>" title="Calculado automáticamente (Promo - Costos)">
|
||||
<?php echo $recaudo1 !== null ? 'S/ ' . number_format($recaudo1, 2) : '-'; ?>
|
||||
</td>
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="promo_2">
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="promo_2" onclick="startEdit(this)">
|
||||
<?php echo htmlspecialchars($c['promo_2'] ?: '-'); ?>
|
||||
<span class="edit-icon"><i class="fas fa-pencil-alt"></i></span>
|
||||
</td>
|
||||
<td class="text-center recaudo-cell recaudo-2 <?php echo $recaudo2 !== null ? ($recaudo2 >= 0 ? 'text-success fw-bold' : 'text-danger fw-bold') : 'text-muted'; ?>" data-id="<?php echo $c['id']; ?>" title="Calculado automáticamente (Promo - Costos)">
|
||||
<?php echo $recaudo2 !== null ? 'S/ ' . number_format($recaudo2, 2) : '-'; ?>
|
||||
</td>
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="promo_3">
|
||||
<td class="text-center editable" data-id="<?php echo $c['id']; ?>" data-field="promo_3" onclick="startEdit(this)">
|
||||
<?php echo htmlspecialchars($c['promo_3'] ?: '-'); ?>
|
||||
<span class="edit-icon"><i class="fas fa-pencil-alt"></i></span>
|
||||
</td>
|
||||
<td class="text-center recaudo-cell recaudo-3 <?php echo $recaudo3 !== null ? ($recaudo3 >= 0 ? 'text-success fw-bold' : 'text-danger fw-bold') : 'text-muted'; ?>" data-id="<?php echo $c['id']; ?>" title="Calculado automáticamente (Promo - Costos)">
|
||||
<?php echo $recaudo3 !== null ? 'S/ ' . number_format($recaudo3, 2) : '-'; ?>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<button class="btn btn-outline-danger btn-delete-row" onclick="eliminarProducto(<?php echo $c['id']; ?>)" title="Eliminar">
|
||||
<i class="fas fa-trash-alt"></i>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
@ -184,130 +258,219 @@ $costos = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal Nuevo Video -->
|
||||
<div class="modal fade" id="nuevoVideoModal" tabindex="-1" aria-labelledby="nuevoVideoModalLabel" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
|
||||
<div class="modal-dialog modal-lg">
|
||||
<div class="modal-content">
|
||||
<form action="save_marketing_video.php" method="POST" enctype="multipart/form-data">
|
||||
<input type="hidden" name="redirect" value="calculo_costos.php?success=created">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="nuevoVideoModalLabel">Nuevo Producto para Marketing</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="row g-3">
|
||||
<div class="col-md-2">
|
||||
<label class="form-label">Orden</label>
|
||||
<input type="number" name="orden" class="form-control" value="1">
|
||||
</div>
|
||||
<div class="col-md-5">
|
||||
<label class="form-label">Fecha Entrega</label>
|
||||
<input type="date" name="fecha_entrega" class="form-control" value="<?php echo date('Y-m-d'); ?>">
|
||||
</div>
|
||||
<div class="col-md-5">
|
||||
<label class="form-label">Producto</label>
|
||||
<select name="producto_id" class="form-select" required>
|
||||
<option value="">Seleccionar producto...</option>
|
||||
<?php foreach ($productos_select as $p): ?>
|
||||
<option value="<?php echo $p['id']; ?>"><?php echo htmlspecialchars($p['nombre']); ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">Imagen Referencia</label>
|
||||
<input type="file" name="foto_producto" class="form-control" accept="image/*">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label class="form-label">Material</label>
|
||||
<input type="text" name="material" class="form-control" placeholder="Ej: Acero, Plástico, etc.">
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label class="form-label">Instrucciones Adicionales</label>
|
||||
<textarea name="instrucciones" class="form-control" rows="3"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancelar</button>
|
||||
<button type="submit" class="btn btn-primary">Agregar Producto</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const tableBody = document.querySelector('#costosTable tbody');
|
||||
// Funciones globales para asegurar que funcionen incluso si jQuery tarda en cargar
|
||||
function abrirModalNuevo() {
|
||||
try {
|
||||
const modalEl = document.getElementById('nuevoVideoModal');
|
||||
const modal = bootstrap.Modal.getOrCreateInstance(modalEl);
|
||||
modal.show();
|
||||
} catch (e) {
|
||||
console.error("Error al abrir modal:", e);
|
||||
// Fallback manual si bootstrap falla
|
||||
$('#nuevoVideoModal').modal('show');
|
||||
}
|
||||
}
|
||||
|
||||
tableBody.addEventListener('dblclick', function(e) {
|
||||
const cell = e.target.closest('.editable');
|
||||
if (!cell || cell.querySelector('input')) return;
|
||||
function startEdit(element) {
|
||||
const cell = $(element);
|
||||
if (cell.find('input').length > 0) return;
|
||||
|
||||
const id = cell.getAttribute('data-id');
|
||||
const field = cell.getAttribute('data-field');
|
||||
let currentValue = cell.innerText.trim().replace('S/ ', '').replace(',', '');
|
||||
if (currentValue === '-') currentValue = '';
|
||||
// Evitar selección de texto
|
||||
if (window.getSelection) {
|
||||
window.getSelection().removeAllRanges();
|
||||
}
|
||||
|
||||
const id = cell.data('id');
|
||||
const field = cell.data('field');
|
||||
|
||||
// Obtener el valor limpio (sin S/ ni comas)
|
||||
let currentValue = cell.text().trim().replace('S/ ', '').replace(/,/g, '');
|
||||
if (currentValue === '-') currentValue = '';
|
||||
|
||||
const isPromo = field.startsWith('promo_');
|
||||
const input = $('<input>', {
|
||||
type: isPromo ? 'text' : 'number',
|
||||
class: 'form-control form-control-sm inline-edit-input',
|
||||
value: currentValue
|
||||
});
|
||||
|
||||
if (!isPromo) {
|
||||
input.attr('step', '0.01');
|
||||
}
|
||||
|
||||
const originalContent = cell.html();
|
||||
cell.empty().append(input);
|
||||
input.focus().select();
|
||||
|
||||
let isSaving = false;
|
||||
|
||||
const saveChange = () => {
|
||||
if (isSaving) return;
|
||||
const newValue = input.val();
|
||||
|
||||
const input = document.createElement('input');
|
||||
const isPromo = field.startsWith('promo_');
|
||||
input.type = isPromo ? 'text' : 'number';
|
||||
if (input.type === 'number') input.step = '0.01';
|
||||
input.className = 'form-control form-control-sm inline-edit-input';
|
||||
input.value = currentValue;
|
||||
if (newValue === currentValue) {
|
||||
cell.html(originalContent);
|
||||
return;
|
||||
}
|
||||
|
||||
const originalContent = cell.innerHTML;
|
||||
cell.innerHTML = '';
|
||||
cell.appendChild(input);
|
||||
input.focus();
|
||||
input.select();
|
||||
isSaving = true;
|
||||
input.prop('disabled', true);
|
||||
|
||||
const saveChange = () => {
|
||||
const newValue = input.value;
|
||||
if (newValue === currentValue) {
|
||||
cell.innerHTML = originalContent;
|
||||
return;
|
||||
}
|
||||
|
||||
fetch('update_marketing_costos_field.php', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ id, field, value: newValue })
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
$.ajax({
|
||||
url: 'update_marketing_costos_field.php',
|
||||
method: 'POST',
|
||||
contentType: 'application/json',
|
||||
data: JSON.stringify({ id, field, value: newValue }),
|
||||
success: function(data) {
|
||||
if (data.success) {
|
||||
if (isPromo) {
|
||||
cell.innerHTML = newValue || '-';
|
||||
cell.html((newValue || '-') + '<span class="edit-icon"><i class="fas fa-pencil-alt"></i></span>');
|
||||
} else {
|
||||
cell.innerHTML = 'S/ ' + parseFloat(newValue || 0).toFixed(2);
|
||||
const formatted = parseFloat(newValue || 0).toLocaleString('es-PE', {
|
||||
minimumFractionDigits: 2,
|
||||
maximumFractionDigits: 2
|
||||
});
|
||||
cell.html('S/ ' + formatted + '<span class="edit-icon"><i class="fas fa-pencil-alt"></i></span>');
|
||||
}
|
||||
updateTotal(id);
|
||||
} else {
|
||||
alert('Error: ' + data.error);
|
||||
cell.innerHTML = originalContent;
|
||||
cell.html(originalContent);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
cell.innerHTML = originalContent;
|
||||
});
|
||||
};
|
||||
|
||||
input.addEventListener('blur', saveChange);
|
||||
input.addEventListener('keydown', function(e) {
|
||||
if (e.key === 'Enter') {
|
||||
input.blur();
|
||||
} else if (e.key === 'Escape') {
|
||||
input.removeEventListener('blur', saveChange);
|
||||
cell.innerHTML = originalContent;
|
||||
},
|
||||
error: function() {
|
||||
alert('Error de conexión al guardar.');
|
||||
cell.html(originalContent);
|
||||
},
|
||||
complete: function() {
|
||||
isSaving = false;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
input.on('blur', saveChange);
|
||||
input.on('keydown', function(e) {
|
||||
if (e.key === 'Enter') {
|
||||
input.blur();
|
||||
} else if (e.key === 'Escape') {
|
||||
input.off('blur');
|
||||
cell.html(originalContent);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function updateTotal(id) {
|
||||
const row = $(`tr[data-row-id="${id}"]`);
|
||||
if (!row.length) return;
|
||||
|
||||
const costFields = ['costo_fijo_film', 'comision_asesora', 'delivery', 'costo_publicitario'];
|
||||
const allFields = ['costo_producto', ...costFields];
|
||||
|
||||
let totalInversion = 0;
|
||||
let totalCostosOperativos = 0;
|
||||
|
||||
allFields.forEach(field => {
|
||||
const cell = row.find(`[data-field="${field}"]`);
|
||||
if (cell.length) {
|
||||
const val = parseFloat(cell.text().replace('S/ ', '').replace(/,/g, '') || 0);
|
||||
totalInversion += val;
|
||||
if (costFields.includes(field)) {
|
||||
totalCostosOperativos += val;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
function updateTotal(id) {
|
||||
const row = document.querySelector(`tr[data-row-id="${id}"]`);
|
||||
if (!row) return;
|
||||
$(`#total-${id}`).text('S/ ' + totalInversion.toLocaleString('es-PE', {minimumFractionDigits: 2, maximumFractionDigits: 2}));
|
||||
|
||||
const costFields = ['costo_fijo_film', 'comision_asesora', 'delivery', 'costo_publicitario'];
|
||||
const allFields = ['costo_producto', ...costFields];
|
||||
// Update Recaudos
|
||||
[1, 2, 3].forEach(num => {
|
||||
const promoCell = row.find(`[data-field="promo_${num}"]`);
|
||||
const recaudoCell = row.find(`.recaudo-${num}`);
|
||||
|
||||
let totalInversion = 0;
|
||||
let totalCostosOperativos = 0;
|
||||
|
||||
allFields.forEach(field => {
|
||||
const cell = row.querySelector(`[data-field="${field}"]`);
|
||||
if (cell) {
|
||||
const val = parseFloat(cell.innerText.replace('S/ ', '').replace(',', '') || 0);
|
||||
totalInversion += val;
|
||||
if (costFields.includes(field)) {
|
||||
totalCostosOperativos += val;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const totalEl = document.getElementById(`total-${id}`);
|
||||
if (totalEl) totalEl.innerText = 'S/ ' + totalInversion.toFixed(2);
|
||||
|
||||
// Update Recaudos
|
||||
[1, 2, 3].forEach(num => {
|
||||
const promoCell = row.querySelector(`[data-field="promo_${num}"]`);
|
||||
const recaudoCell = row.querySelector(`.recaudo-${num}`);
|
||||
if (promoCell.length && recaudoCell.length) {
|
||||
const promoText = promoCell.text().trim();
|
||||
const promoValMatch = promoText.match(/[\d.]+/);
|
||||
const promoVal = promoValMatch ? parseFloat(promoValMatch[0]) : 0;
|
||||
|
||||
if (promoCell && recaudoCell) {
|
||||
const promoText = promoCell.innerText.trim();
|
||||
const promoValMatch = promoText.match(/[\d.]+/);
|
||||
const promoVal = promoValMatch ? parseFloat(promoValMatch[0]) : 0;
|
||||
|
||||
if (promoVal > 0) {
|
||||
const recaudo = promoVal - totalCostosOperativos;
|
||||
recaudoCell.innerText = 'S/ ' + recaudo.toFixed(2);
|
||||
recaudoCell.classList.remove('text-muted');
|
||||
recaudoCell.classList.add('fw-bold');
|
||||
if (recaudo >= 0) {
|
||||
recaudoCell.classList.add('text-success');
|
||||
recaudoCell.classList.remove('text-danger');
|
||||
} else {
|
||||
recaudoCell.classList.add('text-danger');
|
||||
recaudoCell.classList.remove('text-success');
|
||||
}
|
||||
if (promoVal > 0) {
|
||||
const recaudo = promoVal - totalCostosOperativos;
|
||||
recaudoCell.text('S/ ' + recaudo.toLocaleString('es-PE', {minimumFractionDigits: 2, maximumFractionDigits: 2}));
|
||||
recaudoCell.removeClass('text-muted').addClass('fw-bold');
|
||||
if (recaudo >= 0) {
|
||||
recaudoCell.addClass('text-success').removeClass('text-danger');
|
||||
} else {
|
||||
recaudoCell.innerText = '-';
|
||||
recaudoCell.classList.add('text-muted');
|
||||
recaudoCell.classList.remove('fw-bold', 'text-success', 'text-danger');
|
||||
recaudoCell.addClass('text-danger').removeClass('text-success');
|
||||
}
|
||||
} else {
|
||||
recaudoCell.text('-').addClass('text-muted').removeClass('fw-bold text-success text-danger');
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function eliminarProducto(id) {
|
||||
if (confirm('¿Estás seguro de que deseas eliminar este producto de la lista de costos?')) {
|
||||
window.location.href = 'delete_marketing_video.php?id=' + id + '&redirect=calculo_costos.php';
|
||||
}
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
// Mover el modal al body para evitar problemas de z-index con el backdrop
|
||||
$('#nuevoVideoModal').appendTo('body');
|
||||
});
|
||||
</script>
|
||||
|
||||
<?php include 'layout_footer.php'; ?>
|
||||
<?php include 'layout_footer.php'; ?>
|
||||
321
calculo_costos_v2.php
Normal file
321
calculo_costos_v2.php
Normal file
@ -0,0 +1,321 @@
|
||||
<?php
|
||||
$pageTitle = "Cálculo de Costos V2";
|
||||
include 'db/config.php';
|
||||
include 'layout_header.php';
|
||||
|
||||
$db = db();
|
||||
|
||||
// Obtener productos para el select del modal
|
||||
$stmt_products = $db->query("SELECT id, nombre FROM products ORDER BY nombre ASC");
|
||||
$productos_select = $stmt_products->fetchAll(PDO::FETCH_ASSOC);
|
||||
|
||||
// Obtener videos y sus costos asociados
|
||||
$stmt = $db->query("SELECT mv.id, mv.orden, mv.foto_producto, p.nombre as nombre_producto,
|
||||
mc.costo_producto, mc.costo_fijo_film, mc.comision_asesora,
|
||||
mc.delivery, mc.costo_publicitario, mc.inversion_total,
|
||||
mc.promo_1, mc.promo_2, mc.promo_3
|
||||
FROM marketing_videos mv
|
||||
LEFT JOIN products p ON mv.producto_id = p.id
|
||||
LEFT JOIN marketing_costos mc ON mv.id = mc.video_id
|
||||
ORDER BY mv.orden ASC, mv.fecha_creacion DESC");
|
||||
$costos = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
?>
|
||||
|
||||
<style>
|
||||
.table-v2 {
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.table-v2 th {
|
||||
background-color: #f1f3f5;
|
||||
border-bottom: 2px solid #dee2e6;
|
||||
white-space: nowrap;
|
||||
padding: 12px 8px;
|
||||
}
|
||||
.table-v2 td {
|
||||
vertical-align: middle;
|
||||
padding: 4px;
|
||||
}
|
||||
.input-cell {
|
||||
width: 100%;
|
||||
min-width: 80px;
|
||||
padding: 6px;
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.input-cell:focus {
|
||||
border-color: #0d6efd;
|
||||
box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
|
||||
outline: 0;
|
||||
}
|
||||
.input-cell.saving {
|
||||
background-color: #fff3cd;
|
||||
border-color: #ffc107;
|
||||
}
|
||||
.input-cell.saved {
|
||||
background-color: #d1e7dd;
|
||||
border-color: #198754;
|
||||
}
|
||||
.recaudo-v2 {
|
||||
background-color: #f8f9fa;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
padding: 8px;
|
||||
border-radius: 4px;
|
||||
min-width: 90px;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
.img-v2 {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
object-fit: cover;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.btn-save-row {
|
||||
padding: 6px 12px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<div>
|
||||
<h2 class="mb-0">Cálculo de Costos <span class="badge bg-warning text-dark">Versión 2</span></h2>
|
||||
<p class="text-muted">Edición directa mediante cuadros de texto. Escribe y presiona "Guardar".</p>
|
||||
</div>
|
||||
<div>
|
||||
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#modalNuevoV2">
|
||||
<i class="fas fa-plus me-2"></i> Nuevo Producto
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php if (isset($_GET['success'])): ?>
|
||||
<div class="alert alert-success alert-dismissible fade show" role="alert">
|
||||
¡Cambios guardados correctamente!
|
||||
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body p-0">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-v2 mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-center">Orden</th>
|
||||
<th>Producto</th>
|
||||
<th class="text-center">Imagen</th>
|
||||
<th class="text-center">Costo Prod.</th>
|
||||
<th class="text-center">Film</th>
|
||||
<th class="text-center">Asesora</th>
|
||||
<th class="text-center">Delivery</th>
|
||||
<th class="text-center">Publicidad</th>
|
||||
<th class="text-center bg-light">Inversión Total</th>
|
||||
<th class="text-center">Promo 1</th>
|
||||
<th class="text-center">Recaudo 1</th>
|
||||
<th class="text-center">Promo 2</th>
|
||||
<th class="text-center">Recaudo 2</th>
|
||||
<th class="text-center">Promo 3</th>
|
||||
<th class="text-center">Recaudo 3</th>
|
||||
<th class="text-center">Acción</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($costos as $c): ?>
|
||||
<?php
|
||||
$inversion_total = ($c['costo_producto'] ?? 0) +
|
||||
($c['costo_fijo_film'] ?? 0) +
|
||||
($c['comision_asesora'] ?? 0) +
|
||||
($c['delivery'] ?? 0) +
|
||||
($c['costo_publicitario'] ?? 0);
|
||||
|
||||
function getVal($promo) {
|
||||
preg_match('/[\d.]+/', $promo, $matches);
|
||||
return isset($matches[0]) ? floatval($matches[0]) : 0;
|
||||
}
|
||||
|
||||
$p1 = getVal($c['promo_1']);
|
||||
$p2 = getVal($c['promo_2']);
|
||||
$p3 = getVal($c['promo_3']);
|
||||
|
||||
$r1 = $p1 > 0 ? $p1 - $inversion_total : null;
|
||||
$r2 = $p2 > 0 ? $p2 - $inversion_total : null;
|
||||
$r3 = $p3 > 0 ? $p3 - $inversion_total : null;
|
||||
?>
|
||||
<tr id="row-<?php echo $c['id']; ?>" data-id="<?php echo $c['id']; ?>">
|
||||
<td class="text-center fw-bold"><?php echo $c['orden']; ?></td>
|
||||
<td style="max-width: 150px;" class="text-truncate" title="<?php echo htmlspecialchars($c['nombre_producto']); ?>">
|
||||
<?php echo htmlspecialchars($c['nombre_producto'] ?: 'General'); ?>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<?php if ($c['foto_producto']): ?>
|
||||
<img src="<?php echo $c['foto_producto']; ?>" class="img-v2">
|
||||
<?php endif; ?>
|
||||
</td>
|
||||
<td><input type="number" step="0.01" class="input-cell" data-field="costo_producto" value="<?php echo $c['costo_producto']; ?>" onchange="updateRow(<?php echo $c['id']; ?>, 'costo_producto', this.value)"></td>
|
||||
<td><input type="number" step="0.01" class="input-cell" data-field="costo_fijo_film" value="<?php echo $c['costo_fijo_film']; ?>" onchange="updateRow(<?php echo $c['id']; ?>, 'costo_fijo_film', this.value)"></td>
|
||||
<td><input type="number" step="0.01" class="input-cell" data-field="comision_asesora" value="<?php echo $c['comision_asesora']; ?>" onchange="updateRow(<?php echo $c['id']; ?>, 'comision_asesora', this.value)"></td>
|
||||
<td><input type="number" step="0.01" class="input-cell" data-field="delivery" value="<?php echo $c['delivery']; ?>" onchange="updateRow(<?php echo $c['id']; ?>, 'delivery', this.value)"></td>
|
||||
<td><input type="number" step="0.01" class="input-cell" data-field="costo_publicitario" value="<?php echo $c['costo_publicitario']; ?>" onchange="updateRow(<?php echo $c['id']; ?>, 'costo_publicitario', this.value)"></td>
|
||||
<td class="text-center">
|
||||
<div class="recaudo-v2 bg-light fw-bold" id="total-<?php echo $c['id']; ?>">
|
||||
S/ <?php echo number_format($inversion_total, 2); ?>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
<td><input type="text" class="input-cell" data-field="promo_1" value="<?php echo htmlspecialchars($c['promo_1']); ?>" onchange="updateRow(<?php echo $c['id']; ?>, 'promo_1', this.value)"></td>
|
||||
<td><div class="recaudo-v2 recaudo-1 <?php echo $r1 >= 0 ? 'text-success' : 'text-danger'; ?>" id="r1-<?php echo $c['id']; ?>"><?php echo $r1 !== null ? 'S/ '.number_format($r1, 2) : '-'; ?></div></td>
|
||||
|
||||
<td><input type="text" class="input-cell" data-field="promo_2" value="<?php echo htmlspecialchars($c['promo_2']); ?>" onchange="updateRow(<?php echo $c['id']; ?>, 'promo_2', this.value)"></td>
|
||||
<td><div class="recaudo-v2 recaudo-2 <?php echo $r2 >= 0 ? 'text-success' : 'text-danger'; ?>" id="r2-<?php echo $c['id']; ?>"><?php echo $r2 !== null ? 'S/ '.number_format($r2, 2) : '-'; ?></div></td>
|
||||
|
||||
<td><input type="text" class="input-cell" data-field="promo_3" value="<?php echo htmlspecialchars($c['promo_3']); ?>" onchange="updateRow(<?php echo $c['id']; ?>, 'promo_3', this.value)"></td>
|
||||
<td><div class="recaudo-v2 recaudo-3 <?php echo $r3 >= 0 ? 'text-success' : 'text-danger'; ?>" id="r3-<?php echo $c['id']; ?>"><?php echo $r3 !== null ? 'S/ '.number_format($r3, 2) : '-'; ?></div></td>
|
||||
|
||||
<td class="text-center">
|
||||
<div class="d-flex gap-1">
|
||||
<button class="btn btn-success btn-sm btn-save-row" onclick="location.reload()" title="Refrescar cálculos">
|
||||
<i class="fas fa-sync-alt"></i>
|
||||
</button>
|
||||
<button class="btn btn-danger btn-sm" onclick="eliminarRow(<?php echo $c['id']; ?>)">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal Nuevo -->
|
||||
<div class="modal fade" id="modalNuevoV2" tabindex="-1">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<form action="save_marketing_video.php" method="POST" enctype="multipart/form-data">
|
||||
<input type="hidden" name="redirect" value="calculo_costos_v2.php?success=1">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">Nuevo Producto</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Producto</label>
|
||||
<select name="producto_id" id="select_producto_nuevo" class="form-select" required onchange="fetchProductCost(this.value)">
|
||||
<option value="">Seleccionar...</option>
|
||||
<?php foreach ($productos_select as $p): ?>
|
||||
<option value="<?php echo $p['id']; ?>"><?php echo htmlspecialchars($p['nombre']); ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Costo del Producto (S/)</label>
|
||||
<input type="number" name="costo_producto" id="costo_producto_nuevo" class="form-control" step="0.01" placeholder="0.00">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Orden</label>
|
||||
<input type="number" name="orden" class="form-control" value="1">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Imagen</label>
|
||||
<input type="file" name="foto_producto" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
|
||||
<button type="submit" class="btn btn-primary">Guardar</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function fetchProductCost(productId) {
|
||||
if (!productId) return;
|
||||
|
||||
fetch(`get_product_details.php?id=${productId}`)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.success && data.product.costo) {
|
||||
document.getElementById('costo_producto_nuevo').value = data.product.costo;
|
||||
}
|
||||
})
|
||||
.catch(error => console.error('Error fetching product cost:', error));
|
||||
}
|
||||
|
||||
function updateRow(id, field, value) {
|
||||
const row = document.getElementById(`row-${id}`);
|
||||
const input = row.querySelector(`[data-field="${field}"]`);
|
||||
|
||||
input.classList.add('saving');
|
||||
console.log(`Actualizando ${field} para ID ${id} con valor ${value}`);
|
||||
|
||||
fetch('update_marketing_costos_field.php', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ id, field, value })
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
input.classList.remove('saving');
|
||||
if (data.success) {
|
||||
input.classList.add('saved');
|
||||
setTimeout(() => input.classList.remove('saved'), 1000);
|
||||
|
||||
// Recalcular todo en la fila
|
||||
recalculateRow(id);
|
||||
} else {
|
||||
alert('Error al guardar: ' + data.error);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
input.classList.remove('saving');
|
||||
console.error('Error:', error);
|
||||
alert('Error de conexión');
|
||||
});
|
||||
}
|
||||
|
||||
function recalculateRow(id) {
|
||||
const row = document.getElementById(`row-${id}`);
|
||||
const fields = ['costo_producto', 'costo_fijo_film', 'comision_asesora', 'delivery', 'costo_publicitario'];
|
||||
|
||||
let total = 0;
|
||||
fields.forEach(f => {
|
||||
const val = parseFloat(row.querySelector(`[data-field="${f}"]`).value) || 0;
|
||||
total += val;
|
||||
});
|
||||
|
||||
document.getElementById(`total-${id}`).innerText = 'S/ ' + total.toFixed(2);
|
||||
|
||||
// Recalcular recaudos
|
||||
for (let i = 1; i <= 3; i++) {
|
||||
const promoVal = row.querySelector(`[data-field="promo_${i}"]`).value;
|
||||
const recaudoEl = document.getElementById(`r${i}-${id}`);
|
||||
|
||||
const match = promoVal.match(/[\d.]+/);
|
||||
const pVal = match ? parseFloat(match[0]) : 0;
|
||||
|
||||
if (pVal > 0) {
|
||||
const recaudo = pVal - total;
|
||||
recaudoEl.innerText = 'S/ ' + recaudo.toFixed(2);
|
||||
recaudoEl.className = 'recaudo-v2 ' + (recaudo >= 0 ? 'text-success' : 'text-danger');
|
||||
} else {
|
||||
recaudoEl.innerText = '-';
|
||||
recaudoEl.className = 'recaudo-v2 text-muted';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function eliminarRow(id) {
|
||||
if (confirm('¿Eliminar este producto?')) {
|
||||
window.location.href = 'delete_marketing_video.php?id=' + id + '&redirect=calculo_costos_v2.php';
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<?php include 'layout_footer.php'; ?>
|
||||
@ -20,5 +20,6 @@ if (isset($_GET['id'])) {
|
||||
}
|
||||
}
|
||||
|
||||
header("Location: marketing_produccion.php?success=1");
|
||||
$redirect = $_GET['redirect'] ?? 'marketing_produccion.php?success=1';
|
||||
header("Location: " . $redirect);
|
||||
exit;
|
||||
@ -19,8 +19,8 @@ if (isset($_GET['codigo_barras'])) {
|
||||
if (!empty($sku)) {
|
||||
try {
|
||||
// Search by the 'sku' column
|
||||
$stmt = $pdo->prepare("SELECT id, nombre, sku FROM products WHERE sku = :sku");
|
||||
$stmt->execute(['sku' => $sku]);
|
||||
$stmt = $pdo->prepare("SELECT id, nombre, sku, costo FROM products WHERE sku = :sku OR id = :id");
|
||||
$stmt->execute(['sku' => $sku, 'id' => $sku]);
|
||||
$product = $stmt->fetch(PDO::FETCH_ASSOC);
|
||||
if (!$product) {
|
||||
$response['message'] = 'Producto no encontrado con el SKU proporcionado: ' . htmlspecialchars($sku);
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.7.0.js"></script>
|
||||
<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
|
||||
<script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
||||
|
||||
@ -257,7 +257,7 @@ $navItems = [
|
||||
'roles' => ['Administrador', 'admin']
|
||||
],
|
||||
'calculo_costos' => [
|
||||
'url' => 'calculo_costos.php',
|
||||
'url' => 'calculo_costos_v2.php',
|
||||
'icon' => 'fa-calculator',
|
||||
'text' => 'Cálculo de Costos',
|
||||
'roles' => ['Administrador', 'admin']
|
||||
|
||||
@ -76,7 +76,8 @@ if ($_SERVER['REQUEST_METHOD'] == 'POST') {
|
||||
$link_inspiracion_video,
|
||||
$id
|
||||
]);
|
||||
header('Location: marketing_produccion.php?success=updated');
|
||||
$redirect = $_POST['redirect'] ?? 'marketing_produccion.php?success=updated';
|
||||
header('Location: ' . $redirect);
|
||||
} catch (PDOException $e) {
|
||||
echo "Error: " . $e->getMessage();
|
||||
}
|
||||
@ -165,7 +166,17 @@ if ($_SERVER['REQUEST_METHOD'] == 'POST') {
|
||||
$link_video,
|
||||
$link_landing
|
||||
]);
|
||||
header('Location: marketing_produccion.php?success=created');
|
||||
$video_id = $db->lastInsertId();
|
||||
|
||||
// Guardar costo inicial si se proporcionó
|
||||
if (!empty($_POST['costo_producto'])) {
|
||||
$costo_producto = $_POST['costo_producto'];
|
||||
$stmt_costo = $db->prepare("INSERT INTO marketing_costos (video_id, costo_producto, inversion_total) VALUES (?, ?, ?)");
|
||||
$stmt_costo->execute([$video_id, $costo_producto, $costo_producto]);
|
||||
}
|
||||
|
||||
$redirect = $_POST['redirect'] ?? 'marketing_produccion.php?success=created';
|
||||
header('Location: ' . $redirect);
|
||||
} catch (PDOException $e) {
|
||||
echo "Error: " . $e->getMessage();
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user