Przeglądaj źródła

changed page services

Nastya 11 miesięcy temu
rodzic
commit
a3a77e147e

+ 74 - 4
SharixAdmin/static/drf-yasg/service_type.css

@@ -34,7 +34,9 @@ table.table thead th.desc {
 }
 
 .delete_col {
-    background: url('service_type/delete.svg') no-repeat center right;
+    background-image: url('service_type/delete.svg');
+    background-position: center right;
+    background-repeat: no-repeat;
 }
 .delete_col a {
     color: transparent;
@@ -81,8 +83,76 @@ table.table thead th {
 }
 
 table.table {
-    border-collapse: collapse;
+    border-spacing: 0;
 }
-table tr {
-    
+/* table tr {
+    border-top: 1px #95C0F6;
+} */
+table.table tbody tr:hover {
+    border-bottom: 1.5px solid #95C0F6;
+    border-top: 1.5px solid #95C0F6;
+    border-left: 1.5px solid #95C0F6;
+    border-right: 1.5px solid #95C0F6;
+}
+
+/* test */
+
+.modal {
+    display: none;
+    position: fixed;
+    z-index: 1;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    background-color: rgba(0,0,0,0.4);
+    animation-name: fadeIn;
+    animation-duration: 0.4s;
+}
+
+.modal-content {
+    position: relative;
+    background-color: #fefefe;
+    margin: 15% auto;
+    padding: 20px;
+    border: 1px solid #888;
+    width: 80%;
+    animation-name: slideIn;
+    animation-duration: 0.4s;
+}
+
+.close {
+    color: #aaa;
+    float: right;
+    font-size: 28px;
+    font-weight: bold;
+}
+
+.close:hover,
+.close:focus {
+    color: black;
+    text-decoration: none;
+    cursor: pointer;
+}
+
+@keyframes slideIn {
+    from {bottom: -300px; opacity: 0} 
+    to {bottom: 0; opacity: 1}
+}
+
+@keyframes fadeIn {
+    from {opacity: 0} 
+    to {opacity: 1}
+}
+/* Добавить в конец файла style.css */
+
+@keyframes fadeOut {
+    from {opacity: 1} 
+    to {opacity: 0}
+}
+
+.modal.fadeOut {
+    animation-name: fadeOut;
+    animation-duration: 0.4s;
 }

+ 3 - 3
SharixAdmin/templates/SharixAdmin/index.html

@@ -109,7 +109,7 @@ style="cursor: pointer; position: fixed; align-items: center;">
   hideCheck = document.getElementById('hideMenuCheckBox')
   rowBarMenu = document.getElementById('row-bar-menu')
 
-  function show(){
+  function showmenu(){
     rowBarMenu.style.transform = 'rotate(0deg)';
     shMenuRow.style.display = "inline"
       usNameExit.style.display = "inline"
@@ -141,11 +141,11 @@ style="cursor: pointer; position: fixed; align-items: center;">
       hide()
     } else {
       hideCheck.checked = true
-      show()
+      showmenu()
     }
   }
   if(hideCheck.checked == true){
-      show()
+      showmenu()
     } else {
       hide()
     }

+ 23 - 2
SharixAdmin/templates/SharixAdmin/overlay.html

@@ -1,3 +1,5 @@
+{% load i18n %}
+
 <!DOCTYPE html>
 <html lang="en">
 <head>
@@ -6,6 +8,25 @@
     <title>Document</title>
 </head>
 <body>
-    
+    <h1 class="mb-4">{{ title }}</h1>
+    <form method="post" style="overflow: auto">
+        {% csrf_token %}
+        <div class="container m-2">
+            {% for field in form %}
+            {{field.errors}}
+            <div class="row">
+                {{field.label_tag}}
+                {{field}}
+                <p class="fs-6 fst-italic">{{field.help_text|truncatewords:20}}</p>
+            </div>
+            {% endfor %}
+        </div>
+        <div class="text-center mt-2 mb-5">
+            <input class="btn btn-primary center" type="Submit" name="submit" value="{% trans 'Submit' %}"/>
+        </div>
+    </form>
 </body>
-</html>
+</html>
+
+
+

+ 40 - 17
SharixAdmin/templates/SharixAdmin/service_type.html

@@ -21,10 +21,9 @@
       <p class="description_service">Это система управления государством, источником власти в которой является сам народ. Именно народ решает, какие законы и нормы необходимы для гармоничного существования и развития государства. Таким образом, каждый человек в демократическом обществе 
         Получает определенный набор свобод и обязательств сформированных с учетом интересов всего сообщества. Исходя из вышесказанного, можно заключить, что демократия – это возможность для каждого человека свободно участвовать в непосредственном управлении своим государством, обществом и личной судьбой в конечном счете.</p>
       <div class="row justify-content-start">
-        <div class="smalldesc" id="maintable">
-          {% render_table table %}
-        </div>
-        
+          <div class="maintable" id="maintable">
+            {% render_table table %}
+          </div>     
 
 
         <!-- {% comment %} {% if table.page %}
@@ -68,24 +67,48 @@
   <div class="container text-end mt-2">
     <a class="btn btn-primary" id="bord" href="/service_type/add">{% trans 'Add' %}</a>
   </div>
+  
+  <button id="openModalBtn">Открыть окно</button>
+
+  <div id="myModal" class="modal">
+      <div class="modal-content">
+          <span id="closeModalBtn" class="close">&times;</span>
+          <div class="fields">
+            
+          </div>
       </div>
+  </div>
 
 <script>
-  // var colors = document.getElementById("test1"); 
-  // var changeBorder =  
-  //     document.getElementById("test1"); 
-  // changeBorder.addEventListener("click", function () { 
-  //   test1.style.border = "3px solid green"; 
-  //   test1.style.borderRadius = "10px"; 
-  // }); 
-
-  var rows = document.getElementsByTagName("tr");
-  changeBorder.addEventListener("click", function () { 
-    row.style.border = "3px solid green"; 
-    row.style.borderRadius = "10px"; 
-  }); 
+document.getElementById('openModalBtn').onclick = function() {
+    var modal = document.getElementById('myModal');
+    modal.classList.remove('fadeOut');
+    modal.style.display = "block";
+}
+
+document.getElementById('closeModalBtn').onclick = function() {
+    var modal = document.getElementById('myModal');
+    modal.classList.add('fadeOut');
+    setTimeout(function() {
+        modal.style.display = "none";
+    }, 400); // 400ms - длительность анимации
+}
+
+window.onclick = function(event) {
+    var modal = document.getElementById('myModal');
+    if (event.target == modal) {
+        modal.classList.add('fadeOut');
+        setTimeout(function() {
+            modal.style.display = "none";
+        }, 400); // 400ms - длительность анимации
+    }
+}
+
+
 </script>
 
 
 
+
+
 {% endblock contenthome %}

+ 30 - 23
SharixAdmin/templates/SharixAdmin/service_type_form.html

@@ -1,27 +1,34 @@
-{% extends 'SharixAdmin/index.html' %}
+
 {% load i18n %}
 
-{% block contenthome %}
-<h1 class="mb-4">{{ title }}</h1>
-<form method="post" style="overflow: auto">
-    {% csrf_token %}
-    <div class="container m-2">
-        {% for field in form %}
-        {{field.errors}}
-        <div class="row">
-            {{field.label_tag}}
-            {{field}}
-            <p class="fs-6 fst-italic">{{field.help_text|truncatewords:20}}</p>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title></title>
+</head>
+<body>
+    <h1 class="mb-4">{{ title }}</h1>
+    <form method="post" style="overflow: auto">
+        {% csrf_token %}
+        <div class="container m-2">
+            {% for field in form %}
+            {{field.errors}}
+            <div class="row">
+                {{field.label_tag}}
+                {{field}}
+                <p class="fs-6 fst-italic">{{field.help_text|truncatewords:20}}</p>
+            </div>
+            {% endfor %}
+        </div>
+        <div class="text-center mt-2 mb-5">
+            <input class="btn btn-primary center" type="Submit" name="submit" value="{% trans 'Submit' %}"/>
         </div>
-        {% endfor %}
-    </div>
-    <div class="text-center mt-2 mb-5">
-        <input class="btn btn-primary center" type="Submit" name="submit" value="{% trans 'Submit' %}"/>
-    </div>
-</form>
-{% endblock %}
+    </form>
+</body>
+</html>
+
+
+
 
-<script>
-document.querySelector(".description_col").addEventListener("click", ({ target }) =>
-target.closest('.description_col')?.classList.toggle('description_col-active'));
-</script>

+ 5 - 0
SharixAdmin/views/service_type.py

@@ -31,6 +31,11 @@ class ServiceTypeCreate(UserPassesTestMixin, CreateView):
         return False
     
 
+    
+    
+
+    
+
 class ServiceTypeListView(UserPassesTestMixin, SingleTableView):
     table_class = ServiceTypeTable
     queryset = ServiceType.objects.all()