Added fetch request in react for projects
This commit is contained in:
parent
4ef64237de
commit
c34e1b0725
@ -0,0 +1,28 @@
|
||||
# Generated by Django 4.1.4 on 2022-12-28 18:57
|
||||
|
||||
from django.db import migrations, models
|
||||
|
||||
|
||||
class Migration(migrations.Migration):
|
||||
|
||||
dependencies = [
|
||||
('project', '0001_initial'),
|
||||
]
|
||||
|
||||
operations = [
|
||||
migrations.AlterField(
|
||||
model_name='project',
|
||||
name='image',
|
||||
field=models.ImageField(blank=True, null=True, upload_to=''),
|
||||
),
|
||||
migrations.AlterField(
|
||||
model_name='project',
|
||||
name='rtd_url',
|
||||
field=models.CharField(blank=True, max_length=200, null=True),
|
||||
),
|
||||
migrations.AlterField(
|
||||
model_name='project',
|
||||
name='url',
|
||||
field=models.CharField(blank=True, max_length=200, null=True),
|
||||
),
|
||||
]
|
@ -5,9 +5,9 @@ class Project(models.Model):
|
||||
title = models.CharField(max_length=100)
|
||||
description = models.TextField(default="No description added")
|
||||
status = models.IntegerField(default=ProjectStatus.RUNNING)
|
||||
image = models.ImageField(null=True)
|
||||
rtd_url = models.CharField(max_length=200, null=True)
|
||||
url = models.CharField(max_length=200, null=True)
|
||||
image = models.ImageField(null=True, blank=True)
|
||||
rtd_url = models.CharField(max_length=200, null=True, blank=True)
|
||||
url = models.CharField(max_length=200, null=True, blank=True)
|
||||
visible = models.BooleanField(default=False)
|
||||
|
||||
def _str_(self):
|
||||
|
@ -4,4 +4,4 @@ from .models import Project
|
||||
class ProjectSerializer(serializers.ModelSerializer):
|
||||
class Meta:
|
||||
model = Project
|
||||
fields = ('id' ,'title', 'description', 'status')
|
||||
fields = ('id' ,'title', 'description', 'status', 'image', 'rtd_url', 'url')
|
@ -5,4 +5,4 @@ from .models import Project
|
||||
|
||||
class ProjectView(viewsets.ModelViewSet):
|
||||
serializer_class = ProjectSerializer
|
||||
queryset = Project.objects.all()
|
||||
queryset = Project.objects.all()
|
@ -1,26 +1,7 @@
|
||||
import React, { Component } from "react"
|
||||
import '../static/Projects.css';
|
||||
|
||||
const projectItems = [
|
||||
{
|
||||
id: 1,
|
||||
title: "Thelendar",
|
||||
description: "Stronghold Kingdoms",
|
||||
completed: 1
|
||||
},
|
||||
|
||||
{
|
||||
id: 2,
|
||||
title: "Ghidra Assistant",
|
||||
description: "Reversing tools for Ghidra",
|
||||
completed: 0
|
||||
},
|
||||
|
||||
{
|
||||
id: 3,
|
||||
title: "Kerk Tallies",
|
||||
description: "Creating Tally lights for Church",
|
||||
completed: 0
|
||||
},
|
||||
];
|
||||
|
||||
class Projects extends Component {
|
||||
@ -43,21 +24,33 @@ class Projects extends Component {
|
||||
render() {
|
||||
return (
|
||||
<main className="content">
|
||||
<div className="row">
|
||||
<div className="col-md-6 col-sm-10 mx-auto p-0">
|
||||
<div className="card p-3">
|
||||
<ul className="list-group list-group-flush">
|
||||
{this.state.projectItems.map(item => (
|
||||
<div>
|
||||
<h1>{item.title}</h1>
|
||||
<span>{item.description}</span>
|
||||
</div>
|
||||
))}
|
||||
</ul>
|
||||
<div className="projects-grid-container">
|
||||
{this.state.projectItems.map(item => (
|
||||
<div className="projects-grid-item">
|
||||
<h1>{item.title}</h1>
|
||||
<span>{item.description}</span>
|
||||
<span>{item.rtd_url}</span>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</main>
|
||||
// <main className="content">
|
||||
// <div className="row">
|
||||
// <div className="col-md-6 col-sm-10 mx-auto p-0">
|
||||
// <div className="card p-3">
|
||||
// <ul className="list-group list-group-flush">
|
||||
// {this.state.projectItems.map(item => (
|
||||
// <div>
|
||||
// <h1>{item.title}</h1>
|
||||
// <span>{item.description}</span>
|
||||
// <span>{item.rtd_url}</span>
|
||||
// </div>
|
||||
// ))}
|
||||
// </ul>
|
||||
// </div>
|
||||
// </div>
|
||||
// </div>
|
||||
// </main>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
@ -0,0 +1,14 @@
|
||||
.projects-grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: auto;
|
||||
gap: 1%;
|
||||
padding: 1%;
|
||||
margin-top: 70px;
|
||||
}
|
||||
|
||||
.projects-grid-item {
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
margin: 1%;
|
||||
border: 1px solid black;
|
||||
text-align: center;
|
||||
}
|
Loading…
Reference in New Issue
Block a user