добавил всего по мелочи, отредактировал urls, добавил файлы библиотеки Chart.js

templates/index.html

@@ -0,0 +1,164 @@
+{% extends 'base.html' %}
+
+{% block styles %}
+    <style>
+
+    </style>
+{% endblock %}
+
+{% block header %}
+<h1 class="page-header"> Мониторинг водозаборного узла </h1>
+{% if user.is_superuser %}
+<a href="/admin">Админка</a>
+{% endif %}
+{% endblock %}
+
+{% block content %}
+    <script>
+        function getAccessToken(new_value) {
+            if (new_value === undefined || new_value === null || new_value === "") {
+                let res = localStorage.getItem("access_token")
+                if (res === null) {
+                    return ""
+                }
+                return res
+            } else {
+                console.log(`Storing ${new_value} as token`)
+                localStorage.setItem("access_token", new_value)
+                document.getElementById('current_access_token').innerText = new_value
+                return new_value
+            }
+        }
+        async function sendRequest(method, params) {
+            let url = `/methods/${method}`
+            if (params !== undefined && params !== null) {
+                url += "?" + new URLSearchParams(params)
+            }
+            return await fetch(url)
+        }
+
+        async function makeRequest(view, method, inputs) {
+            let params = {}
+            for (let k in inputs) {
+                let element = document.getElementById(inputs[k])
+                const name = element.name
+                let val = element.value
+                if (name === "access_token") {
+                    val = getAccessToken(val)
+                }
+                if (val.length > 0)
+                    params[name] = val
+            }
+            let res = await sendRequest(method, params)
+            const text = await res.text()
+            document.getElementById(view).innerText = text
+
+            // чтобы запоминался токен
+            try {
+                let j = JSON.parse(text)
+                getAccessToken(j["response"]["access_token"])
+            } catch (e) {}
+        }
+    </script>
+
+    {% for method in api_methods %}
+        <div class="method-div">
+            <details>
+                <summary>{{ method.name }}</summary>
+
+                <div>
+                    <h3>Описание</h3>
+                    <p>
+                        {{ method.doc | safe }}
+                    </p>
+
+                    <h3>Параметры</h3>
+                    {% if method.params %}
+                        <div class="table-wrapper"><table>
+                            <tr>
+                                <th>Название</th>
+                                <th>Тип</th>
+                                <th>Описание</th>
+                                <th>Обязательный</th>
+                            </tr>
+
+                            {% for param in method.params %}
+                                <tr>
+                                    <td>{{ param.name }}</td>
+                                    <td>{{ param.type }}</td>
+                                    <td>{{ param.description | safe }}</td>
+                                    <td>{{ param.required }}</td>
+                                </tr>
+                            {% endfor %}
+                        </table></div>
+                    {% else %}
+                        <p>
+                            Этот метод не принимает параметров.
+                        </p>
+                    {% endif %}
+
+                    <h3>Результат</h3>
+                    <p>
+                        {{ method.returns | safe }}
+                    </p>
+                    <p>
+                        Ссылка на метод (без параметров): <a href="/methods/{{ method.name }}">{{ method.name }}</a>
+                    </p>
+                    <details>
+                        <summary>Конструктор</summary>
+                        <div class="constructor-wrapper" id="view-{{ method.name }}">
+                            <div class="constructor-fields">
+                                <div style="">
+                                    <h3>Параметры</h3>
+                                    <hr>
+                                </div>
+
+                                {% if method.params %}
+                                    {% for param in method.params %}
+                                        <div class="constructor-param">
+                                            <label for="param-{{ method.name }}-{{ param.name }}">{{ param.name }}</label>
+                                            <input type="text" name="{{ param.name }}" id="param-{{ method.name }}-{{ param.name }}">
+                                        </div>
+                                    {% endfor %}
+                                {% else %}
+                                    <div class="constructor-param">
+                                        <p>
+                                            Этот метод не принимает параметров.
+                                        </p>
+                                    </div>
+                                {% endif %}
+
+                                <div class="constructor-param">
+                                    <button onclick="makeRequest('result-{{ method.name }}', '{{ method.name }}',
+                                            [{% for param in method.params %}'param-{{ method.name }}-{{ param.name }}', {% endfor %}])">Выполнить</button>
+                                </div>
+                            </div>
+                            <div class="constructor-result">
+                                <h3>Результат</h3>
+                                <hr>
+                                <pre id="result-{{ method.name }}"></pre>
+                            </div>
+                        </div>
+                    </details>
+                </div>
+
+            </details>
+        </div>
+    {% endfor %}
+
+    <div style="text-align: center; background: var(--bkg-color2); margin: 0; margin-top: 3em; padding: 2em; overflow-wrap: break-word;">
+        Перейти в <a href="/admin">админку</a>.
+        <div>
+            Текущий токен: <i id="current_access_token"></i><br><a onclick="localStorage.clear(); document.getElementById('current_access_token').innerText = ''">Сбросить</a>
+        </div>
+    </div>
+
+    <script>
+        window.onload = (event) => {
+            const at = localStorage.getItem("access_token")
+            if (at !== null) {
+                document.getElementById('current_access_token').innerText = at
+            }
+        };
+    </script>
+{% endblock %}