add home app

ToDoList/settings.py

@@ -37,6 +37,7 @@
     'django.contrib.sessions',
     'django.contrib.messages',
     'django.contrib.staticfiles',
+    'home',
 ]
 
 MIDDLEWARE = [
@@ -54,7 +55,7 @@
 TEMPLATES = [
     {
         'BACKEND': 'django.template.backends.django.DjangoTemplates',
-        'DIRS': [],
+        'DIRS': [BASE_DIR/'templates'],
         'APP_DIRS': True,
         'OPTIONS': {
             'context_processors': [

ToDoList/urls.py

@@ -14,8 +14,9 @@
     2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
 """
 from django.contrib import admin
-from django.urls import path
+from django.urls import path, include
 
 urlpatterns = [
     path('admin/', admin.site.urls),
+    path('', include('home.urls')),
 ]

home/admin.py

@@ -0,0 +1,5 @@
+from django.contrib import admin
+from .models import Todo
+
+admin.site.register(Todo)
+

home/apps.py

@@ -0,0 +1,6 @@
+from django.apps import AppConfig
+
+
+class HomeConfig(AppConfig):
+    default_auto_field = 'django.db.models.BigAutoField'
+    name = 'home'

home/forms.py

@@ -0,0 +1,15 @@
+from dataclasses import fields
+from tkinter import Label
+from django import forms
+from .models import Todo
+
+class TodoCreateForm(forms.Form):
+    title = forms.CharField(label="عنوان",required=True)
+    body = forms.CharField(label="توضیحات",required=True)
+    done = forms.BooleanField(label="انجام شده",required=False)
+
+class TodoUpdateForm(forms.ModelForm):
+    class Meta:
+        model = Todo
+        fields = ["title","body","done"]
+        labels = {"title":"عنوان","body":"توضیحات","done":"انجام شده"}

home/migrations/0001_initial.py

@@ -0,0 +1,24 @@
+# Generated by Django 4.0.3 on 2022-04-12 06:40
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    initial = True
+
+    dependencies = [
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='Todo',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('title', models.CharField(max_length=128)),
+                ('body', models.TextField()),
+                ('date', models.DateTimeField()),
+                ('done', models.BooleanField(default=False)),
+            ],
+        ),
+    ]

home/migrations/0002_alter_todo_date.py

@@ -0,0 +1,18 @@
+# Generated by Django 4.0.3 on 2022-04-20 12:01
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('home', '0001_initial'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='todo',
+            name='date',
+            field=models.DateTimeField(auto_now_add=True),
+        ),
+    ]

home/models.py

@@ -0,0 +1,8 @@
+from django.db import models
+
+class Todo(models.Model):
+    title = models.CharField(max_length=128)
+    body = models.TextField()
+    date = models.DateTimeField(auto_now_add=True,blank=True)
+    done = models.BooleanField(default=False)
+

home/tests.py

@@ -0,0 +1,3 @@
+from django.test import TestCase
+
+# Create your tests here.

home/urls.py

@@ -0,0 +1,10 @@
+from django.urls import path
+from . import views
+urlpatterns = [
+    path('',views.home,name='home'),
+    path('detail/<todo_id>',views.detail,name='detail'),
+    path('delete/<todo_id>',views.delete,name='delete'),
+    path('create/',views.create,name='create'),
+    path('update/<todo_id>',views.update,name='update'),
+
+]

home/views.py

@@ -0,0 +1,42 @@
+from turtle import title
+from django.shortcuts import render,redirect
+from django.http import HttpResponse
+from .models import Todo
+from django.contrib import messages
+from .forms import TodoCreateForm, TodoUpdateForm
+
+def home(request):
+    all = Todo.objects.all()
+    return render(request,"home.html",{'title':'home','todos':all})
+
+def detail(request,todo_id):
+    todo = Todo.objects.get(id =todo_id)
+    return render(request,"detail.html",{"title":"home","todo":todo})
+
+def delete(request,todo_id):
+    todo = Todo.objects.get(id =todo_id).delete()
+    messages.success(request,"حذف با موفقیت انجام شد","success")
+    return redirect('home')
+
+def update(request,todo_id):
+    todo = Todo.objects.get(id=todo_id)
+    if request.method == 'POST':
+        form = TodoUpdateForm(request.POST,instance=todo)
+        if form.is_valid():
+            form.save()
+            messages.success(request,"با موفقیت بروز رسانی شد","success")
+            return redirect('home')
+    else:
+        form = TodoUpdateForm(instance=todo)
+    return render(request,'update.html',{'form':form})
+
+def create(request):
+    if request.method == 'POST':
+        form = TodoCreateForm(request.POST)
+        if form.is_valid():
+            Todo.objects.create(title=form.cleaned_data['title'],body=form.cleaned_data['body'],done=form.cleaned_data['done'])
+            messages.success(request,"با موفقیت افزوده شد","success")
+            return redirect('home')
+    else:
+        form = TodoCreateForm()
+    return render(request,'create.html',{'form':form})

templates/base.html

@@ -0,0 +1,99 @@
+<!DOCTYPE html>
+<html lang="en,fa" dir="rtl">
+    <head>
+        <meta charset="UTF-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
+              rel="stylesheet"
+              integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
+              crossorigin="anonymous">
+        <link rel="stylesheet"
+              href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.rtl.min.css"
+              integrity="sha384-+qdLaIRZfNu4cVPK/PxJJEy0B0f3Ugv8i482AKY7gwXwhaCroABd086ybrVKTa0q"
+              crossorigin="anonymous">
+        <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
+              rel="stylesheet">
+        {% comment %} <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> {% endcomment %}
+        <link rel="preconnect" href="https://fonts.googleapis.com">
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+        <link href="https://fonts.googleapis.com/css2?family=Vazirmatn:wght@200;500&display=swap"
+              rel="stylesheet">
+        <title>{{ title }}</title>
+        <style>
+            .inner{
+                box-shadow: inset 0 0 5px -1px #E0EBE7;
+            }
+            .text-green {
+                color:#005C38
+            }
+            .text-gray-600{
+                color:#494B4A;
+            }
+            .text-gray-400{
+                color:#696B6A;
+            }
+            .text-gray-500{
+                color: #51596c;
+            }
+            .bg-gray-100{
+                background: #EDEDED;
+            }
+            .bg-lightgreen{
+                background: #F8FAF9;
+            }
+            .bg-green {
+                background: #005C38;
+            }
+            .bg-yellow {
+                background: #fd7e14;
+            }
+            .bg-yellow:hover {
+                background: #f87808;
+            }
+            .bold{
+                font-weight:bolder;
+            }
+            .icon{
+                font-size: 1.4rem;
+            }
+            .plus{
+                font-size: 3rem;
+            }
+            .overflow-y{
+                overflow-x:hidden;
+                overflow-y: auto;
+            }
+            .btn-icon{
+                padding: 0.7rem 0.8rem 0.4rem 0.8rem;
+                {% comment %} height: 80px;
+                width: 80px; {% endcomment %}
+                position: absolute;
+                right: -2rem;
+                bottom: -2rem;
+            }
+            .top-2{
+                top:1rem;
+            }
+            body{
+                font-family: "Vazirmatn"
+            }
+
+
+        </style>
+    </head>
+    <body>
+        <div class="vw-100 vh-100 bg-green position-relative d-flex flex-column justify-content-center align-items-center">
+            {% include "mesage.html" %}
+            {% block home %}
+            {% endblock home %}
+        </div>
+        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
+        <script>
+            var message_ele = document.getElementById("message");
+            setTimeout(function(){ 
+            message_ele.style.display = "none"; 
+            }, 3000);
+        </script>
+    </body>
+</html>

templates/create.html

@@ -0,0 +1,16 @@
+{% extends 'base.html' %}
+{% block home %}
+    <div class="card py-4 col-lg-5 col-10 bg-white shadow-lg rounded">
+        <div class=" d-flex flex-column align-items-center">
+            <form action="" method="post">
+            {% csrf_token %}
+                {{form.as_p}}
+                <input type="submit" value="تایید">
+            </form>
+        </div>
+        <a href="{% url 'home' %}"
+           class="btn btn-icon shadow text-white rounded-pill bg-yellow">
+            <span class="material-icons plus">arrow_back</span>
+        </a>
+    </div>
+{% endblock %}

templates/detail.html

@@ -0,0 +1,21 @@
+{% extends 'base.html' %}
+{% block home %}
+    <div class="card py-4 col-lg-5 col-10 bg-white shadow-lg rounded">
+        <div class=" d-flex flex-column align-items-center">
+            <h5 class="text-gray-600">{{ todo.title }}</h5>
+            <p class="text-gray-500">
+                {{ todo.body }}
+            </p>
+            {% if todo.done %}
+                <span class="material-icons mb-3 bold text-green ">check_circle</span>
+            {% else %}
+                <small class="text-gray-500  mb-3">انجام نشده</small>
+            {% endif %}
+            <small class="text-gray-500">{{ todo.date }}</small>
+        </div>
+        <a href="{% url 'home' %}"
+           class="btn btn-icon shadow text-white rounded-pill bg-yellow">
+            <span class="material-icons plus">arrow_back</span>
+        </a>
+    </div>
+{% endblock %}

templates/home.html

@@ -0,0 +1,46 @@
+
+{% extends 'base.html' %}
+
+{% block home %}
+{% include "navbar.html" %}
+<div class="card h-75 pb-4 col-lg-5 col-10 bg-white shadow-lg rounded">
+    <div class="h-100 overflow-y overflow">
+        {% for todo in todos %}
+        <div class="row px-4 my-2 align-items-center">
+            <div class="col-lg-8 d-flex col-xl-9 col-md-9 col-sm-7 col-6">
+                {% if todo.done %}
+                    <span class="material-icons text-green icon">
+                        check_circle
+                    </span>
+                {% else %}
+                    <span class="material-icons text-gray-500 icon">
+                        radio_button_unchecked
+                    </span>
+                {% endif %}
+                <h6 class="mx-2 text-gray-600">{{todo.title}}</h6>
+            </div>
+            <div class="col-lg-4 col-xl-3 col-md-3 col-sm-4 col-5 d-flex">
+                <a class="btn" type="button" data-bs-toggle="collapse" data-bs-target="#collapse{{ todo.id }}" aria-expanded="false" aria-controls="collapse{{ todo.id }}">
+                    <span class="material-icons text-gray-500 icon">info</span>
+                </a>
+                <a href="{% url 'update' todo.id %}" class="btn">
+                    <span class="material-icons text-gray-500 icon">edit</span>
+                </a>
+                <a href="{% url 'delete' todo.id %}" class="btn">
+                    <span class="material-icons text-gray-500 icon">delete</span>
+                </a>
+            </div>
+            <div class="py-2 collapse bg-lightgreen inner rounded" id="collapse{{ todo.id }}">
+                <div class=" d-flex justify-content-between align-items-center">
+                    <small class="text-gray-400">{{todo.body}}</small>
+                    <a href="{% url 'detail' todo.id %}" class="btn text-white bg-green">جزئیات</a>
+                </div>
+            </div>
+        </div>
+        {% endfor %}  
+    </div>
+    <a href="{% url 'create' %}" align="center" class="btn btn-icon h shadow text-white rounded-pill bg-yellow text-center">
+        <span class="material-icons plus">add</span>
+    </a>
+</div>
+{% endblock home %}

templates/mesage.html

@@ -0,0 +1,8 @@
+{% if messages %}
+    {% for message in messages %}
+        <div id="message" class="position-absolute top-2 alert alert-{{ message.tags }} alert-dismissible fade show"
+             role="alert">
+            {{ message }}
+        </div>
+    {% endfor %}
+{% endif %}

templates/update.html

@@ -0,0 +1,16 @@
+{% extends 'base.html' %}
+{% block home %}
+    <div class="card py-4 col-lg-5 col-10 bg-white shadow-lg rounded">
+        <div class=" d-flex flex-column align-items-center">
+            <form action="" method="post">
+            {% csrf_token %}
+                {{form.as_p}}
+                <input type="submit" value="تایید">
+            </form>
+        </div>
+        <a href="{% url 'home' %}"
+           class="btn btn-icon shadow text-white rounded-pill bg-yellow">
+            <span class="material-icons plus">arrow_back</span>
+        </a>
+    </div>
+{% endblock %}