Compare commits

...

4 Commits

16 changed files with 805 additions and 294 deletions

Binary file not shown.

BIN
db.sqlite3 Normal file

Binary file not shown.

View File

@ -10,7 +10,7 @@ Function views
Class-based views Class-based views
1. Add an import: from other_app.views import Home 1. Add an import: from other_app.views import Home
2. Add a URL to urlpatterns: path('', Home.as_view(), name='home') 2. Add a URL to urlpatterns: path('', Home.as_view(), name='home')
Including another URLconf Including another URLconftesting test
1. Import the include() function: from django.urls import include, path 1. Import the include() function: from django.urls import include, path
2. Add a URL to urlpatterns: path('blog/', include('blog.urls')) 2. Add a URL to urlpatterns: path('blog/', include('blog.urls'))
""" """

View File

@ -1,5 +1,6 @@
# Generated by Django 5.1.3 on 2024-12-04 13:22 # Generated by Django 5.1.5 on 2025-04-15 10:13
import django.db.models.deletion
from django.db import migrations, models from django.db import migrations, models
@ -12,10 +13,31 @@ class Migration(migrations.Migration):
operations = [ operations = [
migrations.CreateModel( migrations.CreateModel(
name='Sheet', name='Client',
fields=[ fields=[
('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')), ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('name', models.CharField(max_length=100)), ('name', models.CharField(max_length=100)),
('address', models.TextField()),
],
),
migrations.CreateModel(
name='ExcelEntry',
fields=[
('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('age', models.IntegerField()),
('email', models.EmailField(max_length=254)),
('date_joined', models.DateField(auto_now_add=True)),
('client', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, to='sheets.client')),
],
),
migrations.CreateModel(
name='SecondTableEntry',
fields=[
('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('age', models.IntegerField()),
('email', models.EmailField(max_length=254)),
('date_joined', models.DateField(auto_now_add=True)),
('client', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, to='sheets.client')),
], ],
), ),
] ]

View File

@ -1,46 +0,0 @@
# Generated by Django 5.1.3 on 2024-12-04 14:19
import django.db.models.deletion
from django.db import migrations, models
class Migration(migrations.Migration):
dependencies = [
('sheets', '0001_initial'),
]
operations = [
migrations.CreateModel(
name='MainColumn',
fields=[
('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('name', models.CharField(max_length=100)),
('sheet', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='main_columns', to='sheets.sheet')),
],
),
migrations.CreateModel(
name='Row',
fields=[
('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('sheet', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='rows', to='sheets.sheet')),
],
),
migrations.CreateModel(
name='SubColumn',
fields=[
('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('name', models.CharField(max_length=100)),
('main_column', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='sub_columns', to='sheets.maincolumn')),
],
),
migrations.CreateModel(
name='Cell',
fields=[
('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('value', models.CharField(blank=True, max_length=255, null=True)),
('row', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='cells', to='sheets.row')),
('sub_column', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='cells', to='sheets.subcolumn')),
],
),
]

View File

@ -1,50 +0,0 @@
# Generated by Django 5.1.4 on 2024-12-10 07:27
import django.db.models.deletion
from django.db import migrations, models
class Migration(migrations.Migration):
dependencies = [
('sheets', '0002_maincolumn_row_subcolumn_cell'),
]
operations = [
migrations.RemoveField(
model_name='maincolumn',
name='sheet',
),
migrations.RemoveField(
model_name='subcolumn',
name='main_column',
),
migrations.RemoveField(
model_name='row',
name='sheet',
),
migrations.RenameModel(
old_name='Sheet',
new_name='Parent',
),
migrations.CreateModel(
name='Child',
fields=[
('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('description', models.CharField(max_length=200)),
('parent', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='children', to='sheets.parent')),
],
),
migrations.DeleteModel(
name='Cell',
),
migrations.DeleteModel(
name='MainColumn',
),
migrations.DeleteModel(
name='SubColumn',
),
migrations.DeleteModel(
name='Row',
),
]

View File

@ -1,29 +0,0 @@
# Generated by Django 5.1.5 on 2025-01-22 13:05
from django.db import migrations, models
class Migration(migrations.Migration):
dependencies = [
('sheets', '0003_remove_maincolumn_sheet_remove_subcolumn_main_column_and_more'),
]
operations = [
migrations.CreateModel(
name='ExcelEntry',
fields=[
('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('name', models.CharField(max_length=100)),
('age', models.IntegerField()),
('email', models.EmailField(max_length=254)),
('date_joined', models.DateField(auto_now_add=True)),
],
),
migrations.DeleteModel(
name='Child',
),
migrations.DeleteModel(
name='Parent',
),
]

View File

@ -1,23 +0,0 @@
# Generated by Django 5.1.5 on 2025-02-17 10:24
from django.db import migrations, models
class Migration(migrations.Migration):
dependencies = [
('sheets', '0004_excelentry_delete_child_delete_parent'),
]
operations = [
migrations.CreateModel(
name='SecondTableEntry',
fields=[
('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('name', models.CharField(max_length=100)),
('age', models.IntegerField()),
('email', models.EmailField(max_length=254)),
('date_joined', models.DateField(auto_now_add=True)),
],
),
]

View File

@ -1,19 +1,20 @@
from django.db import models from django.db import models
class ExcelEntry(models.Model): class Client(models.Model):
name = models.CharField(max_length=100) name = models.CharField(max_length=100)
age = models.IntegerField() address = models.TextField()
email = models.EmailField()
date_joined = models.DateField(auto_now_add=True)
def __str__(self): def __str__(self):
return self.name return self.name
class SecondTableEntry(models.Model): class ExcelEntry(models.Model):
name = models.CharField(max_length=100) client = models.ForeignKey(Client, on_delete=models.CASCADE)
age = models.IntegerField() age = models.IntegerField()
email = models.EmailField() email = models.EmailField()
date_joined = models.DateField(auto_now_add=True) date_joined = models.DateField(auto_now_add=True)
def __str__(self): class SecondTableEntry(models.Model):
return self.name client = models.ForeignKey(Client, on_delete=models.CASCADE)
age = models.IntegerField()
email = models.EmailField()
date_joined = models.DateField(auto_now_add=True)

View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{% block title %}My App{% endblock %}</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" />
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 20px;
background-color: #f4f4f9;
}
</style>
</head>
<body>
{% block content %}
{% endblock %}
</body>
</html>

View File

@ -0,0 +1,289 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Clients Table</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" />
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 20px;
background-color: #f4f4f9;
}
.add-row-btn, .btn-go-back {
padding: 10px 20px;
background-color: #007bff;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
margin-bottom: 20px;
}
.add-row-btn:hover,
.btn-go-back:hover {
background-color: #0056b3;
}
.container {
background-color: white;
padding: 20px;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
h2 {
text-align: center;
color: #333;
}
table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
}
th, td {
padding: 12px;
text-align: left;
border-bottom: 1px solid #ddd;
}
th {
background-color: #007bff;
color: white;
font-weight: bold;
}
tr:hover {
background-color: #f1f1f1;
}
.actions button {
margin: 2px;
padding: 5px 10px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
}
.edit-btn {
background-color: #28a745;
color: white;
}
.delete-btn {
background-color: #dc3545;
color: white;
}
.popup {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: white;
padding: 20px;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
z-index: 1000;
}
.popup input {
display: block;
margin-bottom: 10px;
width: 100%;
padding: 8px;
border: 1px solid #ddd;
border-radius: 4px;
}
.popup button {
margin-top: 10px;
padding: 8px 16px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
}
.close-btn {
cursor: pointer;
float: right;
font-size: 18px;
color: #333;
}
</style>
</head>
<body>
<div class="container">
<h2>Clients Table</h2>
<button class="add-row-btn" id="add-client">Add Client</button>
<table>
<thead>
<tr>
<th>#</th> <!-- This is your new sequential number column -->
<th>ID</th>
<th>Name</th>
<th>Address</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
{% for client in clients %}
<tr data-id="{{ client.id }}">
<td>{{ forloop.counter }}</td> <!-- ← this gives you 1, 2, 3... -->
<td>{{ client.id }}</td>
<td>{{ client.name }}</td>
<td>{{ client.address }}</td>
<td class="actions">
<button class="edit-btn">Edit</button>
<button class="delete-btn">Delete</button>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<!-- Add Client Popup -->
<div id="add-popup" class="popup">
<span class="close-btn">&times;</span>
<h3>Add Client</h3>
<input type="text" id="add-name" placeholder="Name">
<input type="text" id="add-address" placeholder="Address">
<button id="save-add">Add</button>
</div>
<!-- Edit Client Popup -->
<div id="edit-popup" class="popup">
<span class="close-btn">&times;</span>
<h3>Edit Client</h3>
<input type="hidden" id="edit-id">
<input type="text" id="edit-name" placeholder="Name">
<input type="text" id="edit-address" placeholder="Address">
<button id="save-edit">Save</button>
</div>
<div style="margin-top: 30px; text-align: center;">
<a href="{% url 'table_one' %}">
<button class="add-row-btn">Go to Helium input</button>
</a>
<a href="{% url 'table_two' %}">
<button class="add-row-btn">Go to Table output</button>
</a>
</div>
<script>
let currentModelName = "Client";
// Open Add Popup
$('#add-client').on('click', function () {
$('#add-popup').fadeIn();
});
// Close Popups
$('.close-btn').on('click', function () {
$('.popup').fadeOut();
});
// Save Add Client
$('#save-add').on('click', function () {
let name = $('#add-name').val();
let address = $('#add-address').val();
$.ajax({
url: `/add-entry/Client/`,
method: 'POST',
data: {
'name': name,
'address': address,
'csrfmiddlewaretoken': '{{ csrf_token }}'
},
success: function (response) {
let rowCount = $('tbody tr').length + 1;
let newRow = `
<tr data-id="${response.id}">
<td>${rowCount}</td>
<td>${response.id}</td>
<td>${response.name}</td>
<td>${response.address}</td>
<td class="actions">
<button class="edit-btn">Edit</button>
<button class="delete-btn">Delete</button>
</td>
</tr>
`;
$('tbody').append(newRow);
$('#add-popup').fadeOut();
},
error: function (xhr) {
alert('Failed to add client: ' + xhr.responseText);
}
});
});
// Open Edit Popup
$(document).on('click', '.edit-btn', function () {
let row = $(this).closest('tr');
$('#edit-id').val(row.data('id'));
$('#edit-name').val(row.find('td:eq(2)').text()); // Name
$('#edit-address').val(row.find('td:eq(3)').text()); // Address
$('#edit-popup').fadeIn();
});
// Save Edit Client
$('#save-edit').on('click', function () {
let id = $('#edit-id').val();
let name = $('#edit-name').val();
let address = $('#edit-address').val();
$.ajax({
url: `/update-entry/${currentModelName}/`,
method: 'POST',
data: {
'id': id,
'name': name,
'address': address,
'age': 0,
'email': 'none@example.com',
'csrfmiddlewaretoken': '{{ csrf_token }}'
},
success: function (response) {
if (response.status === 'success') {
let row = $(`tr[data-id="${id}"]`);
row.find('td:eq(2)').text(name); // Correct column for Name
row.find('td:eq(3)').text(address); // Correct column for Address
$('#edit-popup').fadeOut();
}
}
});
});
// Delete Client
$(document).on('click', '.delete-btn', function () {
let row = $(this).closest('tr');
let id = row.data('id');
if (!confirm('Are you sure you want to delete this client?')) return;
$.ajax({
url: `/delete-entry/${currentModelName}/`,
method: 'POST',
data: {
'id': id,
'csrfmiddlewaretoken': '{{ csrf_token }}'
},
success: function (response) {
if (response.status === 'success') {
row.fadeOut(300, function () { $(this).remove(); });
} else {
alert('Delete failed: ' + response.message);
}
},
error: function (xhr, status, error) {
alert('Delete request failed:\n' + xhr.responseText);
console.log('Error:', error);
console.log('Status:', status);
}
});
});
</script>
</body>
</html>

View File

@ -0,0 +1,304 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Helium Input</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" />
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 20px;
background-color: #f4f4f9;
}
.table-container {
width: 48%;
background-color: white;
padding: 20px;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
h2 {
text-align: center;
color: #333;
}
table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
}
th, td {
padding: 12px;
text-align: left;
border-bottom: 1px solid #ddd;
}
th {
background-color: #007bff;
color: white;
font-weight: bold;
}
tr:hover {
background-color: #f1f1f1;
}
.actions button {
margin: 2px;
padding: 5px 10px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
}
.edit-btn-one {
background-color: #28a745;
color: white;
}
.delete-btn-one {
background-color: #dc3545;
color: white;
}
.popup {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: white;
padding: 20px;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
z-index: 1000;
}
.popup input, .popup select {
display: block;
margin-bottom: 10px;
width: 100%;
padding: 8px;
border: 1px solid #ddd;
border-radius: 4px;
}
.popup button {
margin-top: 10px;
padding: 8px 16px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
}
.close-btn {
cursor: pointer;
float: right;
font-size: 18px;
color: #333;
}
.add-row-btn {
padding: 10px 20px;
background-color: #007bff;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
margin-bottom: 20px;
}
.add-row-btn:hover {
background-color: #0056b3;
}
</style>
</head>
<body>
<a href="{% url 'clients_list' %}" class="btn btn-outline-primary">
&#8678; Go to Clients
</a>
<h2>Helium Input</h2>
<div class="table-container">
<button class="add-row-btn" id="add-row-one">Add Row</button>
<table id="table-one">
<thead>
<tr>
<th>#</th>
<th>ID</th>
<th>Client</th>
<th>Entry 1</th>
<th>Entry 2</th>
<th>Date Joined</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
{% for entry in entries_table1 %}
<tr data-id="{{ entry.id }}">
<td>{{ forloop.counter }}</td>
<td>{{ entry.id }}</td>
<td>{{ entry.client.name }}</td>
<td>{{ entry.age }}</td>
<td>{{ entry.email }}</td>
<td>{{ entry.date_joined }}</td>
<td class="actions">
<button class="edit-btn-one">Edit</button>
<button class="delete-btn-one">Delete</button>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<!-- Add Popup -->
<div id="add-popup-one" class="popup">
<span class="close-btn">&times;</span>
<h3>Add Entry</h3>
<select id="add-client-id">
{% for client in clients %}
<option value="{{ client.id }}">{{ client.name }}</option>
{% endfor %}
</select>
<input type="number" id="add-age" placeholder="Age">
<input type="email" id="add-email" placeholder="Email">
<button id="save-add-one">Add</button>
</div>
<!-- Edit Popup -->
<div id="edit-popup-one" class="popup">
<span class="close-btn">&times;</span>
<h3>Edit Entry</h3>
<input type="hidden" id="edit-id">
<select id="edit-client-id">
{% for client in clients %}
<option value="{{ client.id }}">{{ client.name }}</option>
{% endfor %}
</select>
<input type="number" id="edit-age" placeholder="Age">
<input type="email" id="edit-email" placeholder="Email">
<button id="save-edit-one">Save</button>
</div>
<script>
$(document).ready(function () {
let currentTableId = 'table-one';
let currentModelName = 'ExcelEntry';
$('#add-row-one').on('click', function () {
$('#add-popup-one').fadeIn();
});
$('.close-btn').on('click', function () {
$('.popup').fadeOut();
});
// Add
$('#save-add-one').on('click', function () {
let client_id = $('#add-client-id').val();
let age = $('#add-age').val();
let email = $('#add-email').val();
$.ajax({
url: `/add-entry/${currentModelName}/`,
method: 'POST',
data: {
'client_id': client_id,
'age': age,
'email': email,
'csrfmiddlewaretoken': '{{ csrf_token }}'
},
success: function (response) {
let rowCount = $(`#${currentTableId} tbody tr`).length + 1;
let newRow = `
<tr data-id="${response.id}">
<td>${rowCount}</td>
<td>${response.id}</td>
<td>${response.client_name}</td>
<td>${response.age}</td>
<td>${response.email}</td>
<td>${response.date_joined}</td>
<td class="actions">
<button class="edit-btn-one">Edit</button>
<button class="delete-btn-one">Delete</button>
</td>
</tr>
`;
$(`#${currentTableId} tbody`).append(newRow);
$('#add-popup-one').fadeOut();
}
});
});
// Edit
$(document).on('click', '.edit-btn-one', function () {
let row = $(this).closest('tr');
$('#edit-id').val(row.data('id'));
$('#edit-client-id').val(row.find('td:eq(2)').text());
$('#edit-age').val(row.find('td:eq(3)').text());
$('#edit-email').val(row.find('td:eq(4)').text());
$('#edit-popup-one').fadeIn();
});
$('#save-edit-one').on('click', function () {
let id = $('#edit-id').val();
let client_id = $('#edit-client-id').val();
let age = $('#edit-age').val();
let email = $('#edit-email').val();
$.ajax({
url: `/update-entry/${currentModelName}/`,
method: 'POST',
data: {
'id': id,
'client_id': client_id,
'age': age,
'email': email,
'csrfmiddlewaretoken': '{{ csrf_token }}'
},
success: function (response) {
if (response.status === 'success') {
let row = $(`tr[data-id="${response.id}"]`);
row.find('td:eq(2)').text(response.name);
row.find('td:eq(3)').text(response.age);
row.find('td:eq(4)').text(response.email);
$('#edit-popup-one').fadeOut();
} else {
alert('Failed to update entry: ' + response.message);
}
},
error: function () {
alert('Failed to update entry. Please try again.');
}
});
});
// Delete
$(document).on('click', '.delete-btn-one', function () {
let row = $(this).closest('tr');
let id = row.data('id');
if (!confirm('Are you sure you want to delete this entry?')) return;
$.ajax({
url: `/delete-entry/${currentModelName}/`,
method: 'POST',
data: {
'id': id,
'csrfmiddlewaretoken': '{{ csrf_token }}'
},
success: function (response) {
if (response.status === 'success') {
row.fadeOut(300, function () { $(this).remove(); });
} else {
alert('Failed to delete entry: ' + response.message);
}
},
error: function () {
alert('Failed to delete entry. Please try again.');
}
});
});
});
</script>
</body>
</html>

View File

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Excel-like Table</title> <title>Helium Output</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" />
@ -56,11 +56,11 @@
cursor: pointer; cursor: pointer;
font-size: 14px; font-size: 14px;
} }
.edit-btn { .edit-btn-two {
background-color: #28a745; background-color: #28a745;
color: white; color: white;
} }
.delete-btn { .delete-btn-two {
background-color: #dc3545; background-color: #dc3545;
color: white; color: white;
} }
@ -111,72 +111,60 @@
.add-row-btn:hover { .add-row-btn:hover {
background-color: #0056b3; background-color: #0056b3;
} }
.popup select {
display: block;
margin-bottom: 10px;
width: 100%;
padding: 8px;
border: 1px solid #ddd;
border-radius: 4px;
font-family: Arial, sans-serif;
}
</style> </style>
</head> </head>
<body> <body>
<h2>Excel-like Table</h2> <div class="d-flex justify-content-start mb-2">
<!-- "Go to Clients" button at top-left -->
<a href="{% url 'clients_list' %}" class="btn btn-outline-primary">
&#8678; Go to Clients
</a>
</div>
<h2>Helium Output</h2>
<div class="container">
<!-- First Table -->
<div class="table-container">
<button class="add-row-btn" id="add-row-1">Add Row</button>
<table id="table-1">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Age</th>
<th>Email</th>
<th>Date Joined</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
{% for entry in entries_table1 %}
<tr data-id="{{ entry.id }}">
<td>{{ entry.id }}</td>
<td>{{ entry.name }}</td>
<td>{{ entry.age }}</td>
<td>{{ entry.email }}</td>
<td>{{ entry.date_joined }}</td>
<td class="actions">
<button class="edit-btn">Edit</button>
<button class="delete-btn">Delete</button>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<!-- Second Table --> <!-- Second Table -->
<div class="table-container"> <div class="table-container">
<button class="add-row-btn" id="add-row-2">Add Row</button> <button class="add-row-btn" id="add-row-two">Add Row</button>
<table id="table-2"> <table id="table-two">
<thead> <thead>
<tr> <tr>
<th>#</th>
<th>ID</th> <th>ID</th>
<th>Name</th> <th>Client</th>
<th>Age</th> <th>Entry 1</th>
<th>Email</th> <th>Entry 2</th>
<th>Date Joined</th> <th>Date Joined</th>
<th>Actions</th> <th>Actions</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{% for entry in entries_table2 %} {% for entry in entries_table2 %}
<tr data-id="{{ entry.id }}"> <tr data-id="{{ entry.id }}">
<td>{{ entry.id }}</td> <td>{{ forloop.counter }}</td>
<td>{{ entry.name }}</td> <td>{{ entry.id }}</td>
<td>{{ entry.age }}</td> <td>{{ entry.client.name }}</td>
<td>{{ entry.email }}</td> <td>{{ entry.age }}</td>
<td>{{ entry.date_joined }}</td> <td>{{ entry.email }}</td>
<td class="actions"> <td>{{ entry.date_joined }}</td>
<button class="edit-btn">Edit</button> <td class="actions">
<button class="delete-btn">Delete</button> <button class="edit-btn-two">Edit</button>
</td> <button class="delete-btn-two">Delete</button>
</tr> </td>
</tr>
{% endfor %} {% endfor %}
</tbody> </tbody>
</table> </table>
@ -184,24 +172,32 @@
</div> </div>
<!-- Add Entry Popup --> <!-- Add Entry Popup -->
<div id="add-popup" class="popup"> <div id="add-popup-two" class="popup">
<span class="close-btn">&times;</span> <span class="close-btn">&times;</span>
<h3>Add Entry</h3> <h3>Add Entry</h3>
<input type="text" id="add-name" placeholder="Name"> <select id="add-client-id">
{% for client in clients %}
<option value="{{ client.id }}">{{ client.name }}</option>
{% endfor %}
</select>
<input type="number" id="add-age" placeholder="Age"> <input type="number" id="add-age" placeholder="Age">
<input type="email" id="add-email" placeholder="Email"> <input type="email" id="add-email" placeholder="Email">
<button id="save-add">Add</button> <button id="save-add-two">Add</button>
</div> </div>
<!-- Edit Entry Popup --> <!-- Edit Entry Popup -->
<div id="edit-popup" class="popup"> <div id="edit-popup-two" class="popup">
<span class="close-btn">&times;</span> <span class="close-btn">&times;</span>
<h3>Edit Entry</h3> <h3>Edit Entry</h3>
<input type="hidden" id="edit-id"> <input type="hidden" id="edit-id">
<input type="text" id="edit-name" placeholder="Name"> <select id="edit-client-id">
{% for client in clients %}
<option value="{{ client.id }}">{{ client.name }}</option>
{% endfor %}
</select>
<input type="number" id="edit-age" placeholder="Age"> <input type="number" id="edit-age" placeholder="Age">
<input type="email" id="edit-email" placeholder="Email"> <input type="email" id="edit-email" placeholder="Email">
<button id="save-edit">Save</button> <button id="save-edit-two">Save</button>
</div> </div>
<script> <script>
@ -209,18 +205,11 @@
let currentTableId = null; // To track which table is being edited let currentTableId = null; // To track which table is being edited
let currentModelName = null; // To track which model is being used let currentModelName = null; // To track which model is being used
// Open Add Popup for Table 1
$('#add-row-1').on('click', function () {
currentTableId = 'table-1';
currentModelName = 'ExcelEntry'; // Model name for Table 1
$('#add-popup').fadeIn();
});
// Open Add Popup for Table 2 // Open Add Popup for Table 2
$('#add-row-2').on('click', function () { $('#add-row-two').on('click', function () {
currentTableId = 'table-2'; currentTableId = 'table-two';
currentModelName = 'SecondTableEntry'; // Model name for Table 2 currentModelName = 'SecondTableEntry'; // Model name for Table 2
$('#add-popup').fadeIn(); $('#add-popup-two').fadeIn();
}); });
// Close Popups // Close Popups
@ -229,8 +218,8 @@
}); });
// Save Add Entry // Save Add Entry
$('#save-add').on('click', function () { $('#save-add-two').on('click', function () {
let name = $('#add-name').val(); let client_id = $('#add-client-id').val(); // ✅ Correct variable
let age = $('#add-age').val(); let age = $('#add-age').val();
let email = $('#add-email').val(); let email = $('#add-email').val();
@ -238,47 +227,49 @@
url: `/add-entry/${currentModelName}/`, url: `/add-entry/${currentModelName}/`,
method: 'POST', method: 'POST',
data: { data: {
'name': name, 'client_id': client_id, // ✅ REPLACE 'name' with this
'age': age, 'age': age,
'email': email, 'email': email,
'csrfmiddlewaretoken': '{{ csrf_token }}' 'csrfmiddlewaretoken': '{{ csrf_token }}'
}, },
success: function (response) { success: function (response) {
let rowCount = $('#table-two tbody tr').length + 1;
let newRow = ` let newRow = `
<tr data-id="${response.id}"> <tr data-id="${response.id}">
<td>${response.id}</td> <td>${rowCount}</td> <!-- Serial # -->
<td>${response.name}</td> <td>${response.id}</td> <!-- ID -->
<td>${response.age}</td> <td>${response.client_name}</td> <!-- Name -->
<td>${response.email}</td> <td>${response.age}</td> <!-- Age -->
<td>${response.date_joined}</td> <td>${response.email}</td> <!-- Email -->
<td class="actions"> <td>${response.date_joined}</td> <!-- Date Joined -->
<button class="edit-btn">Edit</button> <td class="actions"> <!-- Actions -->
<button class="delete-btn">Delete</button> <button class="edit-btn-two">Edit</button>
<button class="delete-btn-two">Delete</button>
</td> </td>
</tr> </tr>
`; `;
$(`#${currentTableId} tbody`).append(newRow); $(`#${currentTableId} tbody`).append(newRow);
$('#add-popup').fadeOut(); $('#add-popup-two').fadeOut();
} }
}); });
}); });
// Open Edit Popup // Open Edit Popup
$(document).on('click', '.edit-btn', function () { $(document).on('click', '.edit-btn-two', function () {
let row = $(this).closest('tr'); let row = $(this).closest('tr');
currentTableId = row.closest('table').attr('id'); // Set current table ID currentTableId = row.closest('table').attr('id'); // Set current table ID
currentModelName = currentTableId === 'table-1' ? 'ExcelEntry' : 'SecondTableEntry'; // Set model name currentModelName = 'SecondTableEntry'; // Set model name
$('#edit-id').val(row.data('id')); $('#edit-id').val(row.data('id'));
$('#edit-name').val(row.find('td:eq(1)').text()); $('#edit-client-id').val(row.find('td:eq(2)').text()); // Name is now in column 2
$('#edit-age').val(row.find('td:eq(2)').text()); $('#edit-age').val(row.find('td:eq(3)').text()); // Age is now in column 3
$('#edit-email').val(row.find('td:eq(3)').text()); $('#edit-email').val(row.find('td:eq(4)').text()); // Email is now in column 4
$('#edit-popup').fadeIn(); $('#edit-popup-two').fadeIn();
}); });
// Save Edit Entry // Save Edit Entry
$('#save-edit').on('click', function () { $('#save-edit-two').on('click', function () {
let id = $('#edit-id').val(); let id = $('#edit-id').val();
let name = $('#edit-name').val(); let client_id = $('#edit-client-id').val();
let age = $('#edit-age').val(); let age = $('#edit-age').val();
let email = $('#edit-email').val(); let email = $('#edit-email').val();
@ -287,18 +278,18 @@
method: 'POST', method: 'POST',
data: { data: {
'id': id, 'id': id,
'name': name, 'client_id': client_id,
'age': age, 'age': age,
'email': email, 'email': email,
'csrfmiddlewaretoken': '{{ csrf_token }}' 'csrfmiddlewaretoken': '{{ csrf_token }}'
}, },
success: function (response) { success: function (response) {
if (response.status === 'success') { if (response.status === 'success') {
let row = $(`tr[data-id="${id}"]`); let row = $(`tr[data-id="${response.id}"]`);
row.find('td:eq(1)').text(name); row.find('td:eq(2)').text(response.name);
row.find('td:eq(2)').text(age); row.find('td:eq(3)').text(response.age);
row.find('td:eq(3)').text(email); row.find('td:eq(4)').text(response.email);
$('#edit-popup').fadeOut(); $('#edit-popup-two').fadeOut();
} else { } else {
alert('Failed to update entry: ' + response.message); alert('Failed to update entry: ' + response.message);
} }
@ -310,11 +301,11 @@
}); });
// Delete Entry // Delete Entry
$(document).on('click', '.delete-btn', function () { $(document).on('click', '.delete-btn-two', function () {
let row = $(this).closest('tr'); let row = $(this).closest('tr');
let id = row.data('id'); let id = row.data('id');
currentTableId = row.closest('table').attr('id'); // Set current table ID currentTableId = row.closest('table').attr('id'); // Set current table ID
currentModelName = currentTableId === 'table-1' ? 'ExcelEntry' : 'SecondTableEntry'; // Set model name currentModelName = 'SecondTableEntry'; // Set model name
if (!confirm('Are you sure you want to delete this entry?')) return; if (!confirm('Are you sure you want to delete this entry?')) return;

View File

@ -1,9 +1,11 @@
from django.urls import path from django.urls import path
from . import views from . import views
# Create your URLs here.
urlpatterns = [ urlpatterns = [
path('', views.excel_table_view, name='excel_table'), path('', views.clients_list, name='clients_list'), # Main page
path('table-one/', views.table_one_view, name='table_one'), # Table One
path('table-two/', views.table_two_view, name='table_two'), # Table Two
path('add-entry/<str:model_name>/', views.add_entry, name='add_entry'), path('add-entry/<str:model_name>/', views.add_entry, name='add_entry'),
path('update-entry/<str:model_name>/', views.update_entry, name='update_entry'), path('update-entry/<str:model_name>/', views.update_entry, name='update_entry'),
path('delete-entry/<str:model_name>/', views.delete_entry, name='delete_entry'), path('delete-entry/<str:model_name>/', views.delete_entry, name='delete_entry'),
] ]

View File

@ -2,41 +2,68 @@ from django.shortcuts import render
from django.http import JsonResponse from django.http import JsonResponse
from django.apps import apps from django.apps import apps
from datetime import date from datetime import date
from .models import Client
# View to render the table page
def excel_table_view(request): # Clients Page (Main)
# Fetch existing entries from both tables def clients_list(request):
entries_table1 = apps.get_model('sheets', 'ExcelEntry').objects.all() clients = Client.objects.all().order_by('id')
entries_table2 = apps.get_model('sheets', 'SecondTableEntry').objects.all() return render(request, 'clients_table.html', {'clients': clients})
return render(request, 'excel_table.html', {
# Table One View (ExcelEntry)
def table_one_view(request):
ExcelEntry = apps.get_model('sheets', 'ExcelEntry')
entries_table1 = ExcelEntry.objects.all()
clients = Client.objects.all()
return render(request, 'table_one.html', {
'entries_table1': entries_table1, 'entries_table1': entries_table1,
'entries_table2': entries_table2, 'clients': clients,
}) })
# Generic view to add a new row to any table
# Table Two View (SecondTableEntry)
def table_two_view(request):
SecondTableEntry = apps.get_model('sheets', 'SecondTableEntry')
entries_table2 = SecondTableEntry.objects.all()
clients = Client.objects.all()
return render(request, 'table_two.html', {
'entries_table2': entries_table2,
'clients': clients,
})
# Add Entry (Generic)
def add_entry(request, model_name): def add_entry(request, model_name):
if request.method == 'POST': if request.method == 'POST':
try: try:
# Dynamically get the model
model = apps.get_model('sheets', model_name) model = apps.get_model('sheets', model_name)
# Get data from the request if model_name.lower() == 'client':
name = request.POST.get('name', 'New Name') name = request.POST.get('name', 'New Name')
address = request.POST.get('address', '')
entry = model.objects.create(name=name, address=address)
return JsonResponse({
'id': entry.id,
'name': entry.name,
'address': entry.address,
})
client_id = request.POST.get('client_id')
client = Client.objects.get(id=client_id)
age = int(request.POST.get('age', 0)) age = int(request.POST.get('age', 0))
email = request.POST.get('email', 'example@email.com') email = request.POST.get('email', 'example@email.com')
# Create a new entry
entry = model.objects.create( entry = model.objects.create(
name=name, client=client,
age=age, age=age,
email=email, email=email,
date_joined=date.today() date_joined=date.today()
) )
# Return the new entry as JSON response
return JsonResponse({ return JsonResponse({
'id': entry.id, 'id': entry.id,
'name': entry.name, 'client_name': client.name,
'age': entry.age, 'age': entry.age,
'email': entry.email, 'email': entry.email,
'date_joined': entry.date_joined.strftime('%Y-%m-%d'), 'date_joined': entry.date_joined.strftime('%Y-%m-%d'),
@ -47,33 +74,40 @@ def add_entry(request, model_name):
return JsonResponse({'status': 'error', 'message': 'Invalid request'}, status=400) return JsonResponse({'status': 'error', 'message': 'Invalid request'}, status=400)
# Generic view to update an entry in any table
# Update Entry (Generic)
def update_entry(request, model_name): def update_entry(request, model_name):
if request.method == 'POST': if request.method == 'POST':
try: try:
# Dynamically get the model
model = apps.get_model('sheets', model_name) model = apps.get_model('sheets', model_name)
# Get data from the request
entry_id = int(request.POST.get('id')) entry_id = int(request.POST.get('id'))
name = request.POST.get('name') entry = model.objects.get(id=entry_id)
if model_name.lower() == 'client':
entry.name = request.POST.get('name')
entry.address = request.POST.get('address', '')
entry.save()
return JsonResponse({
'status': 'success',
'id': entry.id,
'name': entry.name,
'address': entry.address,
})
client_id = request.POST.get('client_id')
client = Client.objects.get(id=client_id)
age = int(request.POST.get('age')) age = int(request.POST.get('age'))
email = request.POST.get('email') email = request.POST.get('email')
# Fetch the entry to be updated entry.client = client
entry = model.objects.get(id=entry_id)
# Update the entry with new data
entry.name = name
entry.age = age entry.age = age
entry.email = email entry.email = email
entry.save() entry.save()
# Return the updated entry as a JSON response
return JsonResponse({ return JsonResponse({
'status': 'success', 'status': 'success',
'id': entry.id, 'id': entry.id,
'name': entry.name, 'name': client.name,
'age': entry.age, 'age': entry.age,
'email': entry.email, 'email': entry.email,
'date_joined': entry.date_joined.strftime('%Y-%m-%d'), 'date_joined': entry.date_joined.strftime('%Y-%m-%d'),
@ -86,21 +120,15 @@ def update_entry(request, model_name):
return JsonResponse({'status': 'error', 'message': 'Invalid request'}, status=400) return JsonResponse({'status': 'error', 'message': 'Invalid request'}, status=400)
# Generic view to delete an entry from any table
# Delete Entry (Generic)
def delete_entry(request, model_name): def delete_entry(request, model_name):
if request.method == 'POST': if request.method == 'POST':
try: try:
# Dynamically get the model
model = apps.get_model('sheets', model_name) model = apps.get_model('sheets', model_name)
# Get the entry ID from the request
entry_id = request.POST.get('id') entry_id = request.POST.get('id')
# Find the entry by its ID and delete it
entry = model.objects.get(id=entry_id) entry = model.objects.get(id=entry_id)
entry.delete() entry.delete()
# Return success response
return JsonResponse({'status': 'success', 'message': 'Entry deleted'}) return JsonResponse({'status': 'success', 'message': 'Entry deleted'})
except model.DoesNotExist: except model.DoesNotExist:
@ -108,4 +136,4 @@ def delete_entry(request, model_name):
except Exception as e: except Exception as e:
return JsonResponse({'status': 'error', 'message': str(e)}, status=400) return JsonResponse({'status': 'error', 'message': str(e)}, status=400)
return JsonResponse({'status': 'error', 'message': 'Invalid request'}, status=400) return JsonResponse({'status': 'error', 'message': 'Invalid request'}, status=400)

BIN
temperature_data.db Normal file

Binary file not shown.