From 30407e09dc5fb8a3c5ead7aed5eae3cfe86aaeae Mon Sep 17 00:00:00 2001
From: Yuriy Kulakov <yuriy.kulakov.123@gmail.com>
Date: Sun, 4 Apr 2021 20:03:35 +0300
Subject: [PATCH] Removed django context, now uses only React

---
 main/templates/pages/adm_ruleset.html | 33 ++++++---------------------
 main/views.py                         |  6 +----
 static/main/js/control.js             | 28 +++++++----------------
 3 files changed, 16 insertions(+), 51 deletions(-)

diff --git a/main/templates/pages/adm_ruleset.html b/main/templates/pages/adm_ruleset.html
index c2a354c..1fb9baf 100644
--- a/main/templates/pages/adm_ruleset.html
+++ b/main/templates/pages/adm_ruleset.html
@@ -30,14 +30,6 @@
 
     <div class="row justify-content-center new-section">
 
-      {% block hidden_form %}
-      <div style="display: none">
-        {% for field in form.users %}
-        {{ field.tag }}
-        {% endfor %}
-      </div>
-      {% endblock %}
-
       <div class="col-10">
         <h6 class="table-title">Список сотрудников</h6>
 
@@ -50,25 +42,11 @@
               <th>Role</th>
               <th>Checked</th>
             </thead>
-
-            <tbody id="old_tbody">
-              {% for user in users %}
-              <tr>
-                <td><a href="#">{{ user.name }}</a></td>
-                <td>{{ user.user.email }}</td>
-                <td>{% if user.custom_role_id == ZENDESK_ROLES.engineer %}
-                      engineer
-                    {% elif user.custom_role_id == ZENDESK_ROLES.light_agent %}
-                      light_agent
-                    {% endif %}
-                </td>
-                <td class="checkbox_field"></td>
-              </tr>
-              {% endfor %}
+            <tbody id="tbody">
             </tbody>
-            <tbody id="new_tbody"></tbody>
         </table>
-        {% endblock%}
+        <p id="loading">Данные загружаются...</p>
+        {% endblock %}
 
       </div>
     </div>
@@ -96,7 +74,9 @@
 
         </div>
       </div>
+      {% endblock %}
 
+      {% block buttons %}
       <div class="col-5">
 
         <button type="submit" name="engineer" class="request-acess-button default-button">
@@ -107,8 +87,9 @@
           Назначить выбранных на роль легкого агента
         </button>
       </div>
+      {% endblock %}
+
     </div>
-    {% endblock %}
   </form>
   {% endblock %}
 
diff --git a/main/views.py b/main/views.py
index 18d7e52..c4e981f 100644
--- a/main/views.py
+++ b/main/views.py
@@ -285,13 +285,9 @@ class AdminPageView(LoginRequiredMixin, PermissionRequiredMixin,SuccessMessageMi
         Функция формирования контента страницы администратора (с проверкой прав доступа)
         """
         context = super().get_context_data(**kwargs)
-        users = get_list_or_404(
-            UserProfile, role='agent')
-        context['users'] = users
-        context['ZENDESK_ROLES'] = ZENDESK_ROLES
         context['engineers'], context['light_agents'] = count_users(get_users_list())
         context['licences_remaining'] = max(0, ZENDESK_MAX_AGENTS - context['engineers'])
-        return context  # TODO: need to get profile page url
+        return context
 
 
 class CustomLoginView(LoginView):
diff --git a/static/main/js/control.js b/static/main/js/control.js
index 2da9b56..55d1d1a 100644
--- a/static/main/js/control.js
+++ b/static/main/js/control.js
@@ -1,21 +1,5 @@
 "use strict";
 
-function move_checkboxes() {
-  let checkboxes = document.getElementsByName("users");
-  let fields = document.querySelectorAll(".checkbox_field");
-  if (checkboxes.length == fields.length) {
-    for (let i = 0; i < fields.length; ++i) {
-      let el = checkboxes[i].cloneNode(true);
-      fields[i].appendChild(el);
-    }
-  } else {
-    alert(
-      "Количество пользователей агентов не соответствует количеству полей в форме AdminPageUsers"
-    );
-  }
-}
-move_checkboxes();
-
 // React
 class TableRow extends React.Component {
   render() {
@@ -49,8 +33,8 @@ class TableBody extends React.Component {
     };
   }
 
-  get_users() {
-    axios.get("/api/users").then((response) => {
+  async get_users() {
+    await axios.get("/api/users").then((response) => {
       this.setState({
         users: response.data.users,
         engineers: response.data.engineers,
@@ -62,7 +46,12 @@ class TableBody extends React.Component {
     });
   }
 
+  delete_pretext() {
+    document.getElementById("loading").remove();
+  }
+
   componentDidMount() {
+    this.get_users().then(() => this.delete_pretext());
     this.interval = setInterval(() => {
       this.get_users();
     }, 60000);
@@ -79,5 +68,4 @@ class TableBody extends React.Component {
   }
 }
 
-ReactDOM.render(<TableBody />, document.getElementById("new_tbody"));
-setTimeout(() => document.getElementById("old_tbody").remove(), 60000);
+ReactDOM.render(<TableBody />, document.getElementById("tbody"));