Виправлення помилок.

Додан новий метод авторізації в застосунок.
2026-06-16 16:50:01 +03:00
parent 0b38f137bf
commit 9797ff6137
28 changed files with 2756 additions and 493 deletions
@@ -1,17 +1,42 @@
 <div id="page-auth">
-  <form id="page-auth-form">
-    <div>
-      <input
-        type="password"
-        name="uuid"
-        id="auth-forms-uuid"
-        placeholder="UUID"
-        required=""
-      />
+    <form id="page-auth-form">
+        <div>
+            <input
+                type="password"
+                name="uuid"
+                id="auth-forms-uuid"
+                placeholder="UUID"
+                required />
+            <button type="submit">
+                <span>Авторизуватися</span>
+            </button>

-      <button type="submit">
-        <span>Авторизуватися</span>
-      </button>
-    </div>
-  </form>
+            <hr>
+
+            <button type="button" id="open-scanner-btn" class="btn-scan"
+                style="background: var(--ColorThemes3);color: var(--ColorThemes0);">
+                <span>Сканувати QR-код</span>
+            </button>
+        </div>
+    </form>
 </div>
+
+<dialog id="scanner-dialog">
+    <content style="max-width: 300px;max-height: 300px;margin-top: 20px;">
+        <div class="scanner-container">
+            <video id="video" autoplay playsinline></video>
+            <div class="laser-box">
+                <div class="laser-line"></div>
+            </div>
+            <div id="loading-status">Запуск камери...</div>
+        </div>
+    </content>
+
+    <footer>
+        <button class="btn-close" id="close-scanner-btn"
+            aria-label="Закрити">Закрити</button>
+    </footer>
+
+</dialog>
+
+<canvas id="canvas" style="display: none;"></canvas>
@@ -3,80 +3,191 @@ const Auth = {
        let html = await fetch('/lib/pages/auth/index.html').then((response) => response.text());
        app.innerHTML = html;

+        Auth.qr.init();
+
        document.getElementById("page-auth-form").addEventListener("submit", async function (event) {
            event.preventDefault();

-            const uuid = document
-                .getElementById("auth-forms-uuid")
-                .value
-                .replace(/^https?:\/\/sheep-service\.com\/?\?(uuid|hash)=/, "");
-
-            console.log(uuid);
-
-            const URL = `${CONFIG.api}auth`;
-            USER = await fetch(URL, {
-                method: 'GET',
-                headers: {
-                    "Content-Type": "application/json, text/plain, */*",
-                    "Authorization": uuid
-                }
-            }).then(response => {
-                if (response.status === 401) {
-                    localStorage.removeItem("uuid");
-                    Router.navigate(`/auth`);
-                } else {
-                    Cloud.start();
-                    localStorage.setItem("uuid", uuid);
-                    Router.navigate(`/`, false);
-                }
-
-                return response.json();
-            });
-
-            console.log("USER Info: ", USER);
-
-
-            if (USER.possibilities.can_view_stand) {
-                newMenuItems({
-                    id: 'menu-stand',
-                    title: 'Графік стенду',
-                    icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30"><path d="M 6.9707031 4 C 6.8307031 4 6.6807813 4.039375 6.5507812 4.109375 L 2.5507812 6.109375 C 2.0607813 6.349375 1.859375 6.9492188 2.109375 7.4492188 C 2.349375 7.9392188 2.9492187 8.140625 3.4492188 7.890625 L 6.4902344 6.3691406 L 12.5 20.650391 C 12.73 21.180391 13.040156 21.650547 13.410156 22.060547 C 12.040156 22.340547 11 23.56 11 25 C 11 26.65 12.35 28 14 28 C 15.65 28 17 26.65 17 25 C 17 24.52 16.869922 24.070156 16.669922 23.660156 C 17.479922 23.740156 18.319141 23.639062 19.119141 23.289062 L 26.400391 20.099609 C 26.910391 19.889609 27.159219 19.310781 26.949219 18.800781 C 26.749219 18.290781 26.160391 18.040234 25.650391 18.240234 C 25.630391 18.250234 25.619609 18.259531 25.599609 18.269531 L 18.320312 21.460938 C 16.770312 22.130938 14.999609 21.429141 14.349609 19.869141 L 7.9199219 4.609375 C 7.7599219 4.229375 7.3807031 3.99 6.9707031 4 z M 21.359375 8.0605469 C 21.229375 8.0605469 21.100703 8.090625 20.970703 8.140625 L 13.609375 11.269531 C 13.099375 11.479531 12.860078 12.070078 13.080078 12.580078 L 16.029297 19.179688 C 16.249297 19.689688 16.829844 19.930937 17.339844 19.710938 L 24.710938 16.589844 C 25.210938 16.369844 25.450234 15.789297 25.240234 15.279297 L 22.279297 8.6699219 C 22.119297 8.2899219 21.749375 8.0605469 21.359375 8.0605469 z M 14 24 C 14.56 24 15 24.44 15 25 C 15 25.56 14.56 26 14 26 C 13.44 26 13 25.56 13 25 C 13 24.44 13.44 24 14 24 z"/></svg>`,
-                    href: '/stand'
-                });
-            }
-            if (USER.possibilities.can_view_schedule) {
-                newMenuItems({
-                    id: 'menu-schedule',
-                    title: 'Графіки зібрань',
-                    icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path  d="M47 23c3.314 0 6 2.686 6 6v17c0 3.309-2.691 6-6 6H17c-3.309 0-6-2.691-6-6V29c0-3.314 2.686-6 6-6H47zM22 45v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C21.552 46 22 45.552 22 45zM22 38v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C21.552 39 22 38.552 22 38zM30 45v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C29.552 46 30 45.552 30 45zM30 38v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C29.552 39 30 38.552 30 38zM30 31v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C29.552 32 30 31.552 30 31zM38 45v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C37.552 46 38 45.552 38 45zM38 38v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C37.552 39 38 38.552 38 38zM38 31v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C37.552 32 38 31.552 38 31zM46 38v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C45.552 39 46 38.552 46 38zM46 31v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C45.552 32 46 31.552 46 31zM17 20c-2.308 0-4.407.876-6 2.305V18c0-3.309 2.691-6 6-6h30c3.309 0 6 2.691 6 6v4.305C51.407 20.876 49.308 20 47 20H17z"/></svg>`,
-                    href: '/schedule'
-                });
-            }
-            if (USER.possibilities.can_view_sheeps) {
-                newMenuItems({
-                    id: 'menu-sheeps',
-                    title: 'Вісники',
-                    icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M 42.5 14 C 37.813 14 34 18.038 34 23 C 34 27.962 37.813 32 42.5 32 C 47.187 32 51 27.962 51 23 C 51 18.038 47.187 14 42.5 14 z M 21.5 17 C 16.813 17 13 21.038 13 26 C 13 30.962 16.813 35 21.5 35 C 26.187 35 30 30.962 30 26 C 30 21.038 26.187 17 21.5 17 z M 42.5 18 C 44.981 18 47 20.243 47 23 C 47 25.757 44.981 28 42.5 28 C 40.019 28 38 25.757 38 23 C 38 20.243 40.019 18 42.5 18 z M 42.498047 34.136719 C 37.579021 34.136719 33.07724 35.947963 30.054688 38.962891 C 27.67058 37.796576 24.915421 37.136719 22 37.136719 C 14.956 37.136719 8.8129375 40.942422 6.7109375 46.607422 C 5.7409375 49.220422 7.7121406 52 10.494141 52 L 33.505859 52 C 35.43112 52 36.95694 50.674804 37.404297 49 L 53.431641 49 C 56.437641 49 59.121453 45.844281 57.564453 42.613281 C 55.084453 37.463281 49.169047 34.136719 42.498047 34.136719 z M 42.5 38.136719 C 47.565 38.136719 52.171937 40.633609 53.960938 44.349609 C 54.119938 44.687609 53.741687 45 53.429688 45 L 36.544922 45 C 35.777257 43.585465 34.746773 42.317451 33.503906 41.234375 C 35.78496 39.306575 39.034912 38.136719 42.5 38.136719 z" /></svg>`,
-                    href: '/sheeps',
-                    hidden: true
-                });
-                await Sheeps.sheeps_list.loadAPI();
-            }
-            if (USER.possibilities.can_manager_territory) {
-                newMenuItems({
-                    id: 'menu-territory',
-                    title: 'Території',
-                    icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30"><path d="M24 2H14c-.55 0-1 .45-1 1v4l3.6 2.7c.25.19.4.49.4.8V14h8V3C25 2.45 24.55 2 24 2zM15.5 7C15.22 7 15 6.78 15 6.5v-2C15 4.22 15.22 4 15.5 4h2C17.78 4 18 4.22 18 4.5v2C18 6.78 17.78 7 17.5 7h-1.17H15.5zM23 4.5v2C23 6.78 22.78 7 22.5 7h-2C20.22 7 20 6.78 20 6.5v-2C20 4.22 20.22 4 20.5 4h2C22.78 4 23 4.22 23 4.5zM22.5 12h-2c-.28 0-.5-.22-.5-.5v-2C20 9.22 20.22 9 20.5 9h2C22.78 9 23 9.22 23 9.5v2C23 11.78 22.78 12 22.5 12zM1 11.51V27c0 .55.45 1 1 1h12c.55 0 1-.45 1-1V11.51c0-.32-.16-.62-.42-.81l-6-4.28C8.41 6.29 8.2 6.23 8 6.23S7.59 6.29 7.42 6.42l-6 4.28C1.16 10.89 1 11.19 1 11.51zM6.5 20h-2C4.22 20 4 19.78 4 19.5v-2C4 17.22 4.22 17 4.5 17h2C6.78 17 7 17.22 7 17.5v2C7 19.78 6.78 20 6.5 20zM7 22.5v2C7 24.78 6.78 25 6.5 25h-2C4.22 25 4 24.78 4 24.5v-2C4 22.22 4.22 22 4.5 22h2C6.78 22 7 22.22 7 22.5zM6.5 15h-2C4.22 15 4 14.78 4 14.5v-2C4 12.22 4.22 12 4.5 12h2C6.78 12 7 12.22 7 12.5v2C7 14.78 6.78 15 6.5 15zM9.5 17h2c.28 0 .5.22.5.5v2c0 .28-.22.5-.5.5h-2C9.22 20 9 19.78 9 19.5v-2C9 17.22 9.22 17 9.5 17zM9 14.5v-2C9 12.22 9.22 12 9.5 12h2c.28 0 .5.22.5.5v2c0 .28-.22.5-.5.5h-2C9.22 15 9 14.78 9 14.5zM9.5 22h2c.28 0 .5.22.5.5v2c0 .28-.22.5-.5.5h-2C9.22 25 9 24.78 9 24.5v-2C9 22.22 9.22 22 9.5 22zM17 17v10c0 .55.45 1 1 1h10c.55 0 1-.45 1-1V17c0-.55-.45-1-1-1H18C17.45 16 17 16.45 17 17zM19.5 18h2c.28 0 .5.22.5.5v2c0 .28-.22.5-.5.5h-2c-.28 0-.5-.22-.5-.5v-2C19 18.22 19.22 18 19.5 18zM27 18.5v2c0 .28-.22.5-.5.5h-2c-.28 0-.5-.22-.5-.5v-2c0-.28.22-.5.5-.5h2C26.78 18 27 18.22 27 18.5zM26.5 26h-2c-.28 0-.5-.22-.5-.5v-2c0-.28.22-.5.5-.5h2c.28 0 .5.22.5.5v2C27 25.78 26.78 26 26.5 26zM19.5 23h2c.28 0 .5.22.5.5v2c0 .28-.22.5-.5.5h-2c-.28 0-.5-.22-.5-.5v-2C19 23.22 19.22 23 19.5 23z"/></svg>`,
-                    href: '/territory',
-                    hidden: true
-                });
-            }
-            newMenuItems({
-                id: 'menu-options',
-                title: 'Опції',
-                icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 172 172"><path d="M75.18001,14.33333c-3.43283,0 -6.36736,2.42659 -7.02669,5.79492l-2.39355,12.28971c-5.8821,2.22427 -11.32102,5.33176 -16.097,9.25228l-11.78581,-4.05924c-3.2465,-1.118 -6.81841,0.22441 -8.53841,3.19141l-10.80599,18.72852c-1.71283,2.97417 -1.08945,6.74999 1.49772,9.00033l9.44824,8.21647c-0.49137,3.0197 -0.81185,6.09382 -0.81185,9.25228c0,3.15846 0.32048,6.23258 0.81185,9.25228l-9.44824,8.21647c-2.58717,2.25033 -3.21055,6.02616 -1.49772,9.00032l10.80599,18.72852c1.71283,2.97417 5.29191,4.31623 8.53841,3.2054l11.78581,-4.05924c4.77441,3.91806 10.21756,7.01501 16.097,9.23828l2.39355,12.28972c0.65933,3.36833 3.59386,5.79492 7.02669,5.79492h21.63998c3.43283,0 6.36735,-2.42659 7.02669,-5.79492l2.39356,-12.28972c5.88211,-2.22427 11.32102,-5.33176 16.097,-9.25227l11.78581,4.05924c3.2465,1.118 6.81841,-0.21724 8.53841,-3.1914l10.80599,-18.74252c1.71284,-2.97417 1.08945,-6.73599 -1.49772,-8.98633l-9.44824,-8.21647c0.49137,-3.0197 0.81185,-6.09382 0.81185,-9.25228c0,-3.15846 -0.32048,-6.23258 -0.81185,-9.25228l9.44824,-8.21647c2.58717,-2.25033 3.21056,-6.02616 1.49772,-9.00033l-10.80599,-18.72852c-1.71283,-2.97417 -5.29191,-4.31624 -8.53841,-3.2054l-11.78581,4.05924c-4.7744,-3.91806 -10.21755,-7.01501 -16.097,-9.23828l-2.39356,-12.28971c-0.65933,-3.36833 -3.59385,-5.79492 -7.02669,-5.79492zM86,57.33333c15.83117,0 28.66667,12.8355 28.66667,28.66667c0,15.83117 -12.8355,28.66667 -28.66667,28.66667c-15.83117,0 -28.66667,-12.8355 -28.66667,-28.66667c0,-15.83117 12.8355,-28.66667 28.66667,-28.66667z"/></svg>`,
-                href: '/options'
-            });
+            Auth.submit();
        });
+    },
+
+    submit: async () => {
+        const uuid = document
+            .getElementById("auth-forms-uuid")
+            .value
+            .replace(/^https?:\/\/sheep-service\.com\/?\?(uuid|hash)=/, "");
+
+        console.log(uuid);
+
+        const URL = `${CONFIG.api}auth`;
+        USER = await fetch(URL, {
+            method: 'GET',
+            headers: {
+                "Content-Type": "application/json, text/plain, */*",
+                "Authorization": uuid
+            }
+        }).then(response => {
+            if (response.status === 401) {
+                localStorage.removeItem("uuid");
+                Router.navigate(`/auth`);
+            } else {
+                Cloud.start();
+                localStorage.setItem("uuid", uuid);
+                Router.navigate(`/`, false);
+            }
+
+            return response.json();
+        });
+
+        console.log("USER Info: ", USER);
+
+
+        if (USER.possibilities.can_view_stand) {
+            newMenuItems({
+                id: 'menu-stand',
+                title: 'Графік стенду',
+                icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30"><path d="M 6.9707031 4 C 6.8307031 4 6.6807813 4.039375 6.5507812 4.109375 L 2.5507812 6.109375 C 2.0607813 6.349375 1.859375 6.9492188 2.109375 7.4492188 C 2.349375 7.9392188 2.9492187 8.140625 3.4492188 7.890625 L 6.4902344 6.3691406 L 12.5 20.650391 C 12.73 21.180391 13.040156 21.650547 13.410156 22.060547 C 12.040156 22.340547 11 23.56 11 25 C 11 26.65 12.35 28 14 28 C 15.65 28 17 26.65 17 25 C 17 24.52 16.869922 24.070156 16.669922 23.660156 C 17.479922 23.740156 18.319141 23.639062 19.119141 23.289062 L 26.400391 20.099609 C 26.910391 19.889609 27.159219 19.310781 26.949219 18.800781 C 26.749219 18.290781 26.160391 18.040234 25.650391 18.240234 C 25.630391 18.250234 25.619609 18.259531 25.599609 18.269531 L 18.320312 21.460938 C 16.770312 22.130938 14.999609 21.429141 14.349609 19.869141 L 7.9199219 4.609375 C 7.7599219 4.229375 7.3807031 3.99 6.9707031 4 z M 21.359375 8.0605469 C 21.229375 8.0605469 21.100703 8.090625 20.970703 8.140625 L 13.609375 11.269531 C 13.099375 11.479531 12.860078 12.070078 13.080078 12.580078 L 16.029297 19.179688 C 16.249297 19.689688 16.829844 19.930937 17.339844 19.710938 L 24.710938 16.589844 C 25.210938 16.369844 25.450234 15.789297 25.240234 15.279297 L 22.279297 8.6699219 C 22.119297 8.2899219 21.749375 8.0605469 21.359375 8.0605469 z M 14 24 C 14.56 24 15 24.44 15 25 C 15 25.56 14.56 26 14 26 C 13.44 26 13 25.56 13 25 C 13 24.44 13.44 24 14 24 z"/></svg>`,
+                href: '/stand'
+            });
+        }
+        if (USER.possibilities.can_view_schedule) {
+            newMenuItems({
+                id: 'menu-schedule',
+                title: 'Графіки зібрань',
+                icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path  d="M47 23c3.314 0 6 2.686 6 6v17c0 3.309-2.691 6-6 6H17c-3.309 0-6-2.691-6-6V29c0-3.314 2.686-6 6-6H47zM22 45v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C21.552 46 22 45.552 22 45zM22 38v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C21.552 39 22 38.552 22 38zM30 45v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C29.552 46 30 45.552 30 45zM30 38v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C29.552 39 30 38.552 30 38zM30 31v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C29.552 32 30 31.552 30 31zM38 45v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C37.552 46 38 45.552 38 45zM38 38v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C37.552 39 38 38.552 38 38zM38 31v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C37.552 32 38 31.552 38 31zM46 38v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C45.552 39 46 38.552 46 38zM46 31v-2c0-.552-.448-1-1-1h-2c-.552 0-1 .448-1 1v2c0 .552.448 1 1 1h2C45.552 32 46 31.552 46 31zM17 20c-2.308 0-4.407.876-6 2.305V18c0-3.309 2.691-6 6-6h30c3.309 0 6 2.691 6 6v4.305C51.407 20.876 49.308 20 47 20H17z"/></svg>`,
+                href: '/schedule'
+            });
+        }
+        if (USER.possibilities.can_view_sheeps) {
+            newMenuItems({
+                id: 'menu-sheeps',
+                title: 'Вісники',
+                icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M 42.5 14 C 37.813 14 34 18.038 34 23 C 34 27.962 37.813 32 42.5 32 C 47.187 32 51 27.962 51 23 C 51 18.038 47.187 14 42.5 14 z M 21.5 17 C 16.813 17 13 21.038 13 26 C 13 30.962 16.813 35 21.5 35 C 26.187 35 30 30.962 30 26 C 30 21.038 26.187 17 21.5 17 z M 42.5 18 C 44.981 18 47 20.243 47 23 C 47 25.757 44.981 28 42.5 28 C 40.019 28 38 25.757 38 23 C 38 20.243 40.019 18 42.5 18 z M 42.498047 34.136719 C 37.579021 34.136719 33.07724 35.947963 30.054688 38.962891 C 27.67058 37.796576 24.915421 37.136719 22 37.136719 C 14.956 37.136719 8.8129375 40.942422 6.7109375 46.607422 C 5.7409375 49.220422 7.7121406 52 10.494141 52 L 33.505859 52 C 35.43112 52 36.95694 50.674804 37.404297 49 L 53.431641 49 C 56.437641 49 59.121453 45.844281 57.564453 42.613281 C 55.084453 37.463281 49.169047 34.136719 42.498047 34.136719 z M 42.5 38.136719 C 47.565 38.136719 52.171937 40.633609 53.960938 44.349609 C 54.119938 44.687609 53.741687 45 53.429688 45 L 36.544922 45 C 35.777257 43.585465 34.746773 42.317451 33.503906 41.234375 C 35.78496 39.306575 39.034912 38.136719 42.5 38.136719 z" /></svg>`,
+                href: '/sheeps',
+                hidden: true
+            });
+            await Sheeps.sheeps_list.loadAPI();
+        }
+        if (USER.possibilities.can_manager_territory) {
+            newMenuItems({
+                id: 'menu-territory',
+                title: 'Території',
+                icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30"><path d="M24 2H14c-.55 0-1 .45-1 1v4l3.6 2.7c.25.19.4.49.4.8V14h8V3C25 2.45 24.55 2 24 2zM15.5 7C15.22 7 15 6.78 15 6.5v-2C15 4.22 15.22 4 15.5 4h2C17.78 4 18 4.22 18 4.5v2C18 6.78 17.78 7 17.5 7h-1.17H15.5zM23 4.5v2C23 6.78 22.78 7 22.5 7h-2C20.22 7 20 6.78 20 6.5v-2C20 4.22 20.22 4 20.5 4h2C22.78 4 23 4.22 23 4.5zM22.5 12h-2c-.28 0-.5-.22-.5-.5v-2C20 9.22 20.22 9 20.5 9h2C22.78 9 23 9.22 23 9.5v2C23 11.78 22.78 12 22.5 12zM1 11.51V27c0 .55.45 1 1 1h12c.55 0 1-.45 1-1V11.51c0-.32-.16-.62-.42-.81l-6-4.28C8.41 6.29 8.2 6.23 8 6.23S7.59 6.29 7.42 6.42l-6 4.28C1.16 10.89 1 11.19 1 11.51zM6.5 20h-2C4.22 20 4 19.78 4 19.5v-2C4 17.22 4.22 17 4.5 17h2C6.78 17 7 17.22 7 17.5v2C7 19.78 6.78 20 6.5 20zM7 22.5v2C7 24.78 6.78 25 6.5 25h-2C4.22 25 4 24.78 4 24.5v-2C4 22.22 4.22 22 4.5 22h2C6.78 22 7 22.22 7 22.5zM6.5 15h-2C4.22 15 4 14.78 4 14.5v-2C4 12.22 4.22 12 4.5 12h2C6.78 12 7 12.22 7 12.5v2C7 14.78 6.78 15 6.5 15zM9.5 17h2c.28 0 .5.22.5.5v2c0 .28-.22.5-.5.5h-2C9.22 20 9 19.78 9 19.5v-2C9 17.22 9.22 17 9.5 17zM9 14.5v-2C9 12.22 9.22 12 9.5 12h2c.28 0 .5.22.5.5v2c0 .28-.22.5-.5.5h-2C9.22 15 9 14.78 9 14.5zM9.5 22h2c.28 0 .5.22.5.5v2c0 .28-.22.5-.5.5h-2C9.22 25 9 24.78 9 24.5v-2C9 22.22 9.22 22 9.5 22zM17 17v10c0 .55.45 1 1 1h10c.55 0 1-.45 1-1V17c0-.55-.45-1-1-1H18C17.45 16 17 16.45 17 17zM19.5 18h2c.28 0 .5.22.5.5v2c0 .28-.22.5-.5.5h-2c-.28 0-.5-.22-.5-.5v-2C19 18.22 19.22 18 19.5 18zM27 18.5v2c0 .28-.22.5-.5.5h-2c-.28 0-.5-.22-.5-.5v-2c0-.28.22-.5.5-.5h2C26.78 18 27 18.22 27 18.5zM26.5 26h-2c-.28 0-.5-.22-.5-.5v-2c0-.28.22-.5.5-.5h2c.28 0 .5.22.5.5v2C27 25.78 26.78 26 26.5 26zM19.5 23h2c.28 0 .5.22.5.5v2c0 .28-.22.5-.5.5h-2c-.28 0-.5-.22-.5-.5v-2C19 23.22 19.22 23 19.5 23z"/></svg>`,
+                href: '/territory',
+                hidden: true
+            });
+        }
+        newMenuItems({
+            id: 'menu-options',
+            title: 'Опції',
+            icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 172 172"><path d="M75.18001,14.33333c-3.43283,0 -6.36736,2.42659 -7.02669,5.79492l-2.39355,12.28971c-5.8821,2.22427 -11.32102,5.33176 -16.097,9.25228l-11.78581,-4.05924c-3.2465,-1.118 -6.81841,0.22441 -8.53841,3.19141l-10.80599,18.72852c-1.71283,2.97417 -1.08945,6.74999 1.49772,9.00033l9.44824,8.21647c-0.49137,3.0197 -0.81185,6.09382 -0.81185,9.25228c0,3.15846 0.32048,6.23258 0.81185,9.25228l-9.44824,8.21647c-2.58717,2.25033 -3.21055,6.02616 -1.49772,9.00032l10.80599,18.72852c1.71283,2.97417 5.29191,4.31623 8.53841,3.2054l11.78581,-4.05924c4.77441,3.91806 10.21756,7.01501 16.097,9.23828l2.39355,12.28972c0.65933,3.36833 3.59386,5.79492 7.02669,5.79492h21.63998c3.43283,0 6.36735,-2.42659 7.02669,-5.79492l2.39356,-12.28972c5.88211,-2.22427 11.32102,-5.33176 16.097,-9.25227l11.78581,4.05924c3.2465,1.118 6.81841,-0.21724 8.53841,-3.1914l10.80599,-18.74252c1.71284,-2.97417 1.08945,-6.73599 -1.49772,-8.98633l-9.44824,-8.21647c0.49137,-3.0197 0.81185,-6.09382 0.81185,-9.25228c0,-3.15846 -0.32048,-6.23258 -0.81185,-9.25228l9.44824,-8.21647c2.58717,-2.25033 3.21056,-6.02616 1.49772,-9.00033l-10.80599,-18.72852c-1.71283,-2.97417 -5.29191,-4.31624 -8.53841,-3.2054l-11.78581,4.05924c-4.7744,-3.91806 -10.21755,-7.01501 -16.097,-9.23828l-2.39356,-12.28971c-0.65933,-3.36833 -3.59385,-5.79492 -7.02669,-5.79492zM86,57.33333c15.83117,0 28.66667,12.8355 28.66667,28.66667c0,15.83117 -12.8355,28.66667 -28.66667,28.66667c-15.83117,0 -28.66667,-12.8355 -28.66667,-28.66667c0,-15.83117 12.8355,-28.66667 28.66667,-28.66667z"/></svg>`,
+            href: '/options'
+        });
+    },
+
+    qr: {
+        init: () => {
+            const dialog = document.getElementById('scanner-dialog');
+            const openBtn = document.getElementById('open-scanner-btn');
+            const closeBtn = document.getElementById('close-scanner-btn');
+            const uuidInput = document.getElementById('auth-forms-uuid');
+
+            const video = document.getElementById('video');
+            const canvas = document.getElementById('canvas');
+            const ctx = canvas.getContext('2d', { willReadFrequently: true });
+            const loadingStatus = document.getElementById('loading-status');
+
+            let streamRef = null;
+            let isScanning = false;
+
+            // --- Логика управления сканером ---
+
+            async function startCamera() {
+                loadingStatus.style.display = 'block';
+                loadingStatus.innerText = "Запуск камери...";
+                isScanning = true;
+
+                try {
+                    const stream = await navigator.mediaDevices.getUserMedia({
+                        video: { facingMode: { exact: "environment" } }
+                    });
+                    streamRef = stream;
+                    video.srcObject = stream;
+                    video.setAttribute("playsinline", true);
+                    video.play();
+
+                    video.addEventListener('loadedmetadata', () => {
+                        loadingStatus.style.display = 'none';
+                        requestAnimationFrame(tick);
+                    });
+                } catch (err) {
+                    // Фолбек, если основная камера недоступна (например, на ПК)
+                    try {
+                        const fallbackStream = await navigator.mediaDevices.getUserMedia({ video: true });
+                        streamRef = fallbackStream;
+                        video.srcObject = fallbackStream;
+                        video.play();
+                        loadingStatus.style.display = 'none';
+                        requestAnimationFrame(tick);
+                    } catch (fallbackErr) {
+                        loadingStatus.innerText = "Помилка доступу до камери";
+                    }
+                }
+            }
+
+            function stopCamera() {
+                isScanning = false;
+                if (streamRef) {
+                    streamRef.getTracks().forEach(track => track.stop());
+                    streamRef = null;
+                }
+                video.srcObject = null;
+            }
+
+            function tick() {
+                if (!isScanning) return;
+
+                if (video.readyState === video.HAVE_ENOUGH_DATA) {
+                    canvas.height = video.videoHeight;
+                    canvas.width = video.videoWidth;
+                    ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
+
+                    const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
+                    const code = jsQR(imageData.data, imageData.width, imageData.height, {
+                        inversionAttempts: "dontInvert",
+                    });
+
+                    if (code && code.data.trim() !== "") {
+                        // Успешно считали UUID
+                        uuidInput.value = code.data;
+                        Auth.submit();
+
+                        // Закрываем модалку (событие close сработает автоматически)
+                        dialog.close();
+                        return;
+                    }
+                }
+                requestAnimationFrame(tick);
+            }
+
+            // --- Слушатели событий модального окна ---
+
+            // Открыть сканер
+            openBtn.addEventListener('click', () => {
+                dialog.showModal(); // Открывает как модальное окно (с бэкдропом)
+                startCamera();
+            });
+
+            // Закрыть сканер по кнопке крестика
+            closeBtn.addEventListener('click', () => {
+                dialog.close();
+            });
+
+            // Важно: событие 'close' срабатывает всегда (и при клике на крестик, и при нажатии Esc)
+            dialog.addEventListener('close', () => {
+                stopCamera();
+            });
+        },
    }
 }
@@ -21,7 +21,7 @@
    display: flex;
    flex-direction: column;
    align-items: center;
-    height: 160px;
+    height: 200px;
    justify-content: center;
    width: 250px;
    padding: 10px 20px;
@@ -51,8 +51,60 @@
    height: 40px;
    margin: 20px 0 0 0;
 }
+
 #page-auth-form>div>button>span {
    font-size: var(--FontSize2);
    font-weight: 400;
    text-transform: uppercase;
+}
+
+.scanner-container {
+    position: relative;
+    width: 100%;
+    height: auto;
+    aspect-ratio: 1 / 1;
+    border-radius: 5px;
+    overflow: hidden;
+    background-color: var(--ColorThemes0);
+}
+
+#video {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.laser-box {
+    position: absolute;
+    top: 15%;
+    left: 15%;
+    width: 70%;
+    height: 70%;
+    border: 2px solid var(--PrimaryColor);
+    border-radius: 12px;
+    pointer-events: none;
+}
+
+.laser-line {
+    position: absolute;
+    width: 100%;
+    height: 2px;
+    background-color: var(--PrimaryColor);
+    /* box-shadow: 0 0 8px var(--PrimaryColor); */
+    top: 0;
+    animation: scan 2s linear infinite;
+}
+
+@keyframes scan {
+    0% {
+        top: 0%;
+    }
+
+    50% {
+        top: 100%;
+    }
+
+    100% {
+        top: 0%;
+    }
 }
@@ -1,22 +1,24 @@
 <div class="page-options">
-  <div class="option checkbox">
-    <input
-      class="custom-checkbox"
-      id="page-options-notifications"
-      type="checkbox"
-      onchange="Options.optionPush.edit(this.checked)"
-    />
-    <label for="page-options-notifications"> Повідомлення: </label>
-  </div>
+    <div class="option checkbox">
+        <input
+            class="custom-checkbox"
+            id="page-options-notifications"
+            type="checkbox"
+            onchange="Options.optionPush.edit(this.checked)" />
+        <label for="page-options-notifications"> Повідомлення: </label>
+    </div>

-  <div class="option inputs">
-    <label for="page-options-fontSize">Розмір шрифту:</label>
-    <select id="page-options-fontSize" onchange="Options.optionFont.edit(this.value)">
-      <option value="small">Маленький</option>
-      <option value="medium">Середній</option>
-      <option value="large">Великий</option>
-    </select>
-  </div>
+    <div class="option inputs">
+        <label for="page-options-fontSize">Розмір шрифту:</label>
+        <select id="page-options-fontSize"
+            onchange="Options.optionFont.edit(this.value)">
+            <option value="small">Маленький</option>
+            <option value="medium">Середній</option>
+            <option value="large">Великий</option>
+        </select>
+    </div>

-  <button onclick="Options.logout()">Вийти з облікового запису</button>
+    <a href="/test.html">Тестова сторінка</a>
+
+    <button onclick="Options.logout()">Вийти з облікового запису</button>
 </div>
@@ -1,365 +1,368 @@
 <div class="page-sheeps">
-  <div id="block-sheeps-list">
-    <div class="header">
-      <h1>Всі вісники</h1>
+    <div id="block-sheeps-list">
+        <div class="header">
+            <h1>Всі вісники</h1>

-      <div>
-        <button title="Пошук" id="block-sheeps-list-search-buttom">
-          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 72 72">
-            <path
-              d="M 31 11 C 19.973 11 11 19.973 11 31 C 11 42.027 19.973 51 31 51 C 34.974166 51 38.672385 49.821569 41.789062 47.814453 L 54.726562 60.751953 C 56.390563 62.415953 59.088953 62.415953 60.751953 60.751953 C 62.415953 59.087953 62.415953 56.390563 60.751953 54.726562 L 47.814453 41.789062 C 49.821569 38.672385 51 34.974166 51 31 C 51 19.973 42.027 11 31 11 z M 31 19 C 37.616 19 43 24.384 43 31 C 43 37.616 37.616 43 31 43 C 24.384 43 19 37.616 19 31 C 19 24.384 24.384 19 31 19 z"
-            />
-          </svg>
-        </button>
-      </div>
+            <div>
+                <button title="Пошук" id="block-sheeps-list-search-buttom">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 72 72">
+                        <path
+                            d="M 31 11 C 19.973 11 11 19.973 11 31 C 11 42.027 19.973 51 31 51 C 34.974166 51 38.672385 49.821569 41.789062 47.814453 L 54.726562 60.751953 C 56.390563 62.415953 59.088953 62.415953 60.751953 60.751953 C 62.415953 59.087953 62.415953 56.390563 60.751953 54.726562 L 47.814453 41.789062 C 49.821569 38.672385 51 34.974166 51 31 C 51 19.973 42.027 11 31 11 z M 31 19 C 37.616 19 43 24.384 43 31 C 43 37.616 37.616 43 31 43 C 24.384 43 19 37.616 19 31 C 19 24.384 24.384 19 31 19 z" />
+                    </svg>
+                </button>
+            </div>
+        </div>
+
+        <div class="search" id="block-sheeps-list-search" data-state="closed">
+            <input
+                type="text"
+                id="block-sheeps-list-search-name"
+                placeholder="Імʼя вісника" />
+        </div>
+
+        <div class="card-profile"></div>
+        <div class="card-profile"></div>
+        <div class="card-profile"></div>
+        <div class="card-profile"></div>
+        <div class="card-profile"></div>
+        <div class="card-profile"></div>
+        <div class="card-profile"></div>
+        <div class="card-profile"></div>
+        <div class="card-profile"></div>
+        <div class="card-profile"></div>
+        <div class="card-profile"></div>
+        <div class="card-profile"></div>
    </div>

-    <div class="search" id="block-sheeps-list-search" data-state="closed">
-      <input
-        type="text"
-        id="block-sheeps-list-search-name"
-        placeholder="Імʼя вісника"
-      />
+    <div id="block-sheep-info">
+        <div id="sheep-mess">
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
+                <path
+                    d="M 25.042969 12 C 20.698969 12 18 15.029297 18 19.904297 C 18 24.104297 20.766812 28.599609 24.882812 28.599609 C 27.167812 28.599609 31 27.369813 31 19.132812 C 31 14.999813 28.494969 12 25.042969 12 z M 39.974609 12 C 35.672609 12 33 14.931437 33 19.648438 C 33 24.104438 34.862391 28.599609 39.025391 28.599609 C 43.603391 28.599609 46 23.922734 46 19.302734 C 46 14.285734 42.876609 12 39.974609 12 z M 25.042969 16 C 26.388969 16 27 17.623812 27 19.132812 C 27 20.776813 26.794812 24.599609 24.882812 24.599609 C 23.428813 24.599609 22 22.274297 22 19.904297 C 22 16.000297 24.132969 16 25.042969 16 z M 39.974609 16 C 41.224609 16 42 17.265734 42 19.302734 C 42 21.906734 40.886391 24.599609 39.025391 24.599609 C 37.594391 24.599609 37 21.375438 37 19.648438 C 37 16.000438 39.084609 16 39.974609 16 z M 13.689453 24 C 9.8134531 24 7 27.465234 7 32.240234 C 7 35.462234 9.0299688 40 13.542969 40 C 17.224969 40 20 36.250297 20 31.279297 C 20 27.061297 17.346453 24 13.689453 24 z M 50.75 24 C 46.94 24 43 27.440219 43 33.199219 C 43 36.541219 45.15 40 48.75 40 C 52.612 40 56 35.477312 56 30.320312 C 56 26.480313 53.939 24 50.75 24 z M 13.689453 28 C 15.514453 28 16 30.061297 16 31.279297 C 16 33.793297 14.852969 36 13.542969 36 C 11.603969 36 11 33.244234 11 32.240234 C 11 29.783234 12.131453 28 13.689453 28 z M 50.75 28 C 51.783 28 52 29.262313 52 30.320312 C 52 33.788312 49.866 36 48.75 36 C 47.514 36 47 34.175219 47 33.199219 C 47 29.652219 49.237 28 50.75 28 z M 31.806641 30.001953 C 29.371641 29.947953 27.296656 31.058937 25.597656 33.335938 C 22.515656 37.450938 21.695953 38.210313 19.376953 39.695312 C 17.528953 40.875312 14.998047 42.492141 14.998047 45.994141 C 14.998047 49.769141 18.164641 52.839844 22.056641 52.839844 C 23.872641 52.839844 25.588266 52.174453 27.697266 51.439453 C 29.071266 52.348453 30.722125 52.839844 32.453125 52.839844 C 34.215125 52.839844 35.869422 52.353125 37.232422 51.453125 C 41.805422 53.496125 44.150719 53.039344 45.636719 52.277344 C 47.314719 51.416344 48.403953 49.800703 48.876953 47.470703 C 49.107953 46.334703 48.997375 45.198781 48.609375 44.175781 C 48.012375 42.602781 46.757453 41.293531 45.064453 40.644531 C 43.137453 39.916531 42.576406 39.753172 41.316406 38.826172 C 39.672406 37.616172 39.015453 35.742422 37.814453 33.607422 C 36.601453 31.449422 34.298641 30.067953 31.806641 30.001953 z M 31.701172 34.001953 C 32.777172 34.029953 33.808125 34.644359 34.328125 35.568359 C 35.480125 37.621359 36.442312 40.205828 38.945312 42.048828 C 40.748312 43.375828 41.894813 43.725812 43.632812 44.382812 C 44.073813 44.550813 44.501812 44.883844 44.757812 45.339844 C 44.966813 45.711844 45.061031 46.164781 44.957031 46.675781 C 44.738031 47.753781 44.3535 48.44175 43.8125 48.71875 C 42.4475 49.41975 39.736125 48.192875 38.578125 47.671875 C 38.187125 47.495875 36.729781 46.582125 35.550781 47.703125 C 34.778781 48.436125 33.679125 48.839844 32.453125 48.839844 C 31.288125 48.839844 30.211922 48.444562 29.419922 47.726562 C 28.893922 47.247562 28.151609 47.085828 27.474609 47.298828 C 25.411609 47.948828 23.441594 48.839844 22.058594 48.839844 C 20.372594 48.839844 19.001953 47.562141 19.001953 45.994141 C 19.001953 44.795141 19.69525 44.240406 21.53125 43.066406 C 24.29525 41.302406 25.514688 40.146469 28.804688 35.730469 C 29.975687 34.161469 30.981172 33.980953 31.701172 34.001953 z" />
+            </svg>
+            <h1>Виберіть вісника для редагування</h1>
+        </div>
+
+        <form id="sheep-editor" style="display: none; opacity: 0">
+            <div class="header">
+                <h1>Інформація про вісника</h1>
+
+                <button onclick="Sheeps.editor.close()" type="button">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26">
+                        <path
+                            d="M 6.65625 4 C 6.367188 4 6.105469 4.113281 5.90625 4.3125 L 4.3125 5.90625 C 3.914063 6.304688 3.914063 7 4.3125 7.5 L 9.8125 13 L 4.3125 18.5 C 3.914063 19 3.914063 19.695313 4.3125 20.09375 L 5.90625 21.6875 C 6.40625 22.085938 7.101563 22.085938 7.5 21.6875 L 13 16.1875 L 18.5 21.6875 C 19 22.085938 19.695313 22.085938 20.09375 21.6875 L 21.6875 20.09375 C 22.085938 19.59375 22.085938 18.898438 21.6875 18.5 L 16.1875 13 L 21.6875 7.5 C 22.085938 7 22.085938 6.304688 21.6875 5.90625 L 20.09375 4.3125 C 19.59375 3.914063 18.898438 3.914063 18.5 4.3125 L 13 9.8125 L 7.5 4.3125 C 7.25 4.113281 6.945313 4 6.65625 4 Z"></path>
+                    </svg>
+                </button>
+            </div>
+            <i id="sheep-editor-icon"></i>
+
+            <div class="editor-blocks-inputs">
+                <label for="sheep-editor-name">Імʼя</label>
+                <input id="sheep-editor-name" type="text" name="name"
+                    required />
+            </div>
+            <div class="editor-blocks-inputs">
+                <label for="sheep-editor-group_id">Група</label>
+                <select id="sheep-editor-group_id" name="group_id">
+                    <option value="1">Група 1</option>
+                    <option value="2" selected>Група 2</option>
+                    <option value="3">Група 3</option>
+                    <option value="4">Група 4</option>
+                    <option value="5">Група 5</option>
+                    <option value="6">Група 6</option>
+                    <option value="7">Група 7</option>
+                    <option value="8">Група 8</option>
+                </select>
+            </div>
+            <div class="editor-blocks-inputs">
+                <label for="sheep-editor-mode">Права</label>
+                <select id="sheep-editor-mode" name="mode">
+                    <option value="0" selected>Користувач</option>
+                    <option value="1">Модератор</option>
+                    <option value="2">Адміністратор</option>
+                </select>
+            </div>
+
+            <button popovertarget="uuid-popover" type="button">Надати доступ</button>
+
+            <div id="uuid-popover" popover>
+                <div class="editor-blocks-inputs"
+                    id="editor-blocks-inputs-uuid">
+                    <label>UUID <span>Натисніть, щоб скопіювати</span></label>
+                    <input
+                        id="sheep-editor-uuid"
+                        type="text"
+                        name="uuid"
+                        value
+                        disabled
+                        style="display: none" />
+                    <p id="sheep-editor-uuid-copy"
+                        style="cursor: copy !important"></p>
+                </div>
+
+                <div
+                    class="editor-blocks-inputs"
+                    id="editor-blocks-inputs-uuid-moder"
+                    style="display: none">
+                    <label>UUID адміністратора/модератора</label>
+                    <p id="sheep-editor-uuid-moder"
+                        style="cursor: copy !important"></p>
+                </div>
+
+                <div id="qr-code"></div>
+
+                <button popovertarget="uuid-popover"
+                    popovertargetaction="hide" type="button">Закрити</button>
+            </div>
+
+            <div
+                class="editor-blocks-checkbox"
+                id="sheep-editor-access-moder"
+                style="display: none">
+                <p for="editor-access">Дозволи модератора</p>
+                <div>
+                    <div class="checkbox">
+                        <input
+                            name="can_view_sheeps"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_view_sheeps"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_view_sheeps"> Перегляд
+                            списку вісників </label>
+                    </div>
+                    <div class="checkbox">
+                        <input
+                            name="can_add_sheeps"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_add_sheeps"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_add_sheeps"> Додавання
+                            вісників </label>
+                    </div>
+                    <div class="checkbox">
+                        <input
+                            name="can_manager_sheeps"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_manager_sheeps"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_manager_sheeps"> Керування
+                            дозволами вісників </label>
+                    </div>
+                    <div class="checkbox">
+                        <input
+                            name="can_add_territory"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_add_territory"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_add_territory">
+                            Створення територій
+                        </label>
+                    </div>
+                    <div class="checkbox">
+                        <input
+                            name="can_manager_territory"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_manager_territory"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_manager_territory">
+                            Керування територіями
+                        </label>
+                    </div>
+                    <div class="checkbox">
+                        <input
+                            name="can_joint_territory"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_joint_territory"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_joint_territory">
+                            Спільний доступ до території
+                        </label>
+                    </div>
+                    <div class="checkbox">
+                        <input
+                            name="can_add_stand"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_add_stand"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_add_stand"> Створення
+                            стендів </label>
+                    </div>
+                    <div class="checkbox">
+                        <input
+                            name="can_manager_stand"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_manager_stand"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_manager_stand"> Керування
+                            стендами </label>
+                    </div>
+                    <div class="checkbox">
+                        <input
+                            name="can_add_schedule"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_add_schedule"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_add_schedule"> Створення
+                            розкладу зібрань </label>
+                    </div>
+                </div>
+            </div>
+
+            <div class="editor-blocks-checkbox">
+                <p for="editor-access">Дозволи вісника</p>
+                <div>
+                    <div class="checkbox">
+                        <input
+                            name="can_view_schedule"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_view_schedule"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_view_schedule"> Перегляд
+                            розкладу зібрань </label>
+                    </div>
+                    <div class="checkbox">
+                        <input
+                            name="can_view_stand"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_view_stand"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_view_stand"> Перегляд
+                            стендів </label>
+                    </div>
+                    <div class="checkbox">
+                        <input
+                            name="can_view_territory"
+                            class="custom-checkbox"
+                            id="sheep-editor-can_view_territory"
+                            type="checkbox" />
+                        <label for="sheep-editor-can_view_territory">
+                            Перегляд територій
+                        </label>
+                    </div>
+                </div>
+            </div>
+
+            <button id="sheep-editor-button" style="display: none"
+                type="submit">
+                Зберегти
+            </button>
+
+            <details id="editor-blocks-territory" style="display: none;">
+                <summary>Території вісника</summary>
+
+                <div>
+                    <div id="title">
+                        <h1>вул. Бродівська 50Б (Під'їзд 1)</h1>
+
+                        <a
+                            href="/territory/card/house/57"
+                            title="Редактор квартир"
+                            data-route>
+                            <svg xmlns="http://www.w3.org/2000/svg"
+                                viewBox="0 0 48 48">
+                                <path
+                                    d="M 12.5 6 C 8.9280619 6 6 8.9280619 6 12.5 L 6 35.5 C 6 39.071938 8.9280619 42 12.5 42 L 35.5 42 C 39.071938 42 42 39.071938 42 35.5 L 42 12.5 C 42 8.9280619 39.071938 6 35.5 6 L 12.5 6 z M 12.5 9 L 14 9 L 14 15 L 9 15 L 9 12.5 C 9 10.549938 10.549938 9 12.5 9 z M 17 9 L 35.5 9 C 37.450062 9 39 10.549938 39 12.5 L 39 15 L 17 15 L 17 9 z M 9 18 L 14 18 L 14 23 L 9 23 L 9 18 z M 17 18 L 39 18 L 39 23 L 17 23 L 17 18 z M 9 26 L 14 26 L 14 31 L 9 31 L 9 26 z M 17 26 L 39 26 L 39 31 L 17 31 L 17 26 z M 9 34 L 14 34 L 14 39 L 12.5 39 C 10.549938 39 9 37.450062 9 35.5 L 9 34 z M 17 34 L 39 34 L 39 35.5 C 39 37.450062 37.450062 39 35.5 39 L 17 39 L 17 34 z"></path>
+                            </svg>
+                        </a>
+                    </div>
+                    <div>
+                        <h1>Територія видана:</h1>
+                        <h2>02.07.2025</h2>
+                    </div>
+                    <div>
+                        <h1>Варто забрати:</h1>
+                        <h2>01.11.2025</h2>
+                    </div>
+                </div>
+
+                <div>
+                    <div id="title">
+                        <h1>вул. Бродівська 50Б (Під'їзд 1)</h1>
+
+                        <a
+                            href="/territory/card/house/57"
+                            title="Редактор квартир"
+                            data-route>
+                            <svg xmlns="http://www.w3.org/2000/svg"
+                                viewBox="0 0 48 48">
+                                <path
+                                    d="M 12.5 6 C 8.9280619 6 6 8.9280619 6 12.5 L 6 35.5 C 6 39.071938 8.9280619 42 12.5 42 L 35.5 42 C 39.071938 42 42 39.071938 42 35.5 L 42 12.5 C 42 8.9280619 39.071938 6 35.5 6 L 12.5 6 z M 12.5 9 L 14 9 L 14 15 L 9 15 L 9 12.5 C 9 10.549938 10.549938 9 12.5 9 z M 17 9 L 35.5 9 C 37.450062 9 39 10.549938 39 12.5 L 39 15 L 17 15 L 17 9 z M 9 18 L 14 18 L 14 23 L 9 23 L 9 18 z M 17 18 L 39 18 L 39 23 L 17 23 L 17 18 z M 9 26 L 14 26 L 14 31 L 9 31 L 9 26 z M 17 26 L 39 26 L 39 31 L 17 31 L 17 26 z M 9 34 L 14 34 L 14 39 L 12.5 39 C 10.549938 39 9 37.450062 9 35.5 L 9 34 z M 17 34 L 39 34 L 39 35.5 C 39 37.450062 37.450062 39 35.5 39 L 17 39 L 17 34 z"></path>
+                            </svg>
+                        </a>
+                    </div>
+                    <div>
+                        <h1>Територія видана:</h1>
+                        <h2>02.07.2025</h2>
+                    </div>
+                    <div>
+                        <h1>Варто забрати:</h1>
+                        <h2>01.11.2025</h2>
+                    </div>
+                </div>
+
+                <div>
+                    <div id="title">
+                        <h1>вул. Бродівська 50Б (Під'їзд 1)</h1>
+
+                        <a
+                            href="/territory/card/house/57"
+                            title="Редактор квартир"
+                            data-route>
+                            <svg xmlns="http://www.w3.org/2000/svg"
+                                viewBox="0 0 48 48">
+                                <path
+                                    d="M 12.5 6 C 8.9280619 6 6 8.9280619 6 12.5 L 6 35.5 C 6 39.071938 8.9280619 42 12.5 42 L 35.5 42 C 39.071938 42 42 39.071938 42 35.5 L 42 12.5 C 42 8.9280619 39.071938 6 35.5 6 L 12.5 6 z M 12.5 9 L 14 9 L 14 15 L 9 15 L 9 12.5 C 9 10.549938 10.549938 9 12.5 9 z M 17 9 L 35.5 9 C 37.450062 9 39 10.549938 39 12.5 L 39 15 L 17 15 L 17 9 z M 9 18 L 14 18 L 14 23 L 9 23 L 9 18 z M 17 18 L 39 18 L 39 23 L 17 23 L 17 18 z M 9 26 L 14 26 L 14 31 L 9 31 L 9 26 z M 17 26 L 39 26 L 39 31 L 17 31 L 17 26 z M 9 34 L 14 34 L 14 39 L 12.5 39 C 10.549938 39 9 37.450062 9 35.5 L 9 34 z M 17 34 L 39 34 L 39 35.5 C 39 37.450062 37.450062 39 35.5 39 L 17 39 L 17 34 z"></path>
+                            </svg>
+                        </a>
+                    </div>
+                    <div>
+                        <h1>Територія видана:</h1>
+                        <h2>02.07.2025</h2>
+                    </div>
+                    <div>
+                        <h1>Варто забрати:</h1>
+                        <h2>01.11.2025</h2>
+                    </div>
+                </div>
+            </details>
+        </form>
    </div>

-    <div class="card-profile"></div>
-    <div class="card-profile"></div>
-    <div class="card-profile"></div>
-    <div class="card-profile"></div>
-    <div class="card-profile"></div>
-    <div class="card-profile"></div>
-    <div class="card-profile"></div>
-    <div class="card-profile"></div>
-    <div class="card-profile"></div>
-    <div class="card-profile"></div>
-    <div class="card-profile"></div>
-    <div class="card-profile"></div>
-  </div>
+    <div id="block-sheep-addeds" style="display: none; opacity: 0">
+        <form id="sheep-addeds">
+            <div class="header">
+                <h1>Додавання нового вісника</h1>
+                <button onclick="Sheeps.addeds.close()" class="close"
+                    type="button">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26">
+                        <path
+                            d="M 6.65625 4 C 6.367188 4 6.105469 4.113281 5.90625 4.3125 L 4.3125 5.90625 C 3.914063 6.304688 3.914063 7 4.3125 7.5 L 9.8125 13 L 4.3125 18.5 C 3.914063 19 3.914063 19.695313 4.3125 20.09375 L 5.90625 21.6875 C 6.40625 22.085938 7.101563 22.085938 7.5 21.6875 L 13 16.1875 L 18.5 21.6875 C 19 22.085938 19.695313 22.085938 20.09375 21.6875 L 21.6875 20.09375 C 22.085938 19.59375 22.085938 18.898438 21.6875 18.5 L 16.1875 13 L 21.6875 7.5 C 22.085938 7 22.085938 6.304688 21.6875 5.90625 L 20.09375 4.3125 C 19.59375 3.914063 18.898438 3.914063 18.5 4.3125 L 13 9.8125 L 7.5 4.3125 C 7.25 4.113281 6.945313 4 6.65625 4 Z"></path>
+                    </svg>
+                </button>
+            </div>

-  <div id="block-sheep-info">
-    <div id="sheep-mess">
-      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
-        <path
-          d="M 25.042969 12 C 20.698969 12 18 15.029297 18 19.904297 C 18 24.104297 20.766812 28.599609 24.882812 28.599609 C 27.167812 28.599609 31 27.369813 31 19.132812 C 31 14.999813 28.494969 12 25.042969 12 z M 39.974609 12 C 35.672609 12 33 14.931437 33 19.648438 C 33 24.104438 34.862391 28.599609 39.025391 28.599609 C 43.603391 28.599609 46 23.922734 46 19.302734 C 46 14.285734 42.876609 12 39.974609 12 z M 25.042969 16 C 26.388969 16 27 17.623812 27 19.132812 C 27 20.776813 26.794812 24.599609 24.882812 24.599609 C 23.428813 24.599609 22 22.274297 22 19.904297 C 22 16.000297 24.132969 16 25.042969 16 z M 39.974609 16 C 41.224609 16 42 17.265734 42 19.302734 C 42 21.906734 40.886391 24.599609 39.025391 24.599609 C 37.594391 24.599609 37 21.375438 37 19.648438 C 37 16.000438 39.084609 16 39.974609 16 z M 13.689453 24 C 9.8134531 24 7 27.465234 7 32.240234 C 7 35.462234 9.0299688 40 13.542969 40 C 17.224969 40 20 36.250297 20 31.279297 C 20 27.061297 17.346453 24 13.689453 24 z M 50.75 24 C 46.94 24 43 27.440219 43 33.199219 C 43 36.541219 45.15 40 48.75 40 C 52.612 40 56 35.477312 56 30.320312 C 56 26.480313 53.939 24 50.75 24 z M 13.689453 28 C 15.514453 28 16 30.061297 16 31.279297 C 16 33.793297 14.852969 36 13.542969 36 C 11.603969 36 11 33.244234 11 32.240234 C 11 29.783234 12.131453 28 13.689453 28 z M 50.75 28 C 51.783 28 52 29.262313 52 30.320312 C 52 33.788312 49.866 36 48.75 36 C 47.514 36 47 34.175219 47 33.199219 C 47 29.652219 49.237 28 50.75 28 z M 31.806641 30.001953 C 29.371641 29.947953 27.296656 31.058937 25.597656 33.335938 C 22.515656 37.450938 21.695953 38.210313 19.376953 39.695312 C 17.528953 40.875312 14.998047 42.492141 14.998047 45.994141 C 14.998047 49.769141 18.164641 52.839844 22.056641 52.839844 C 23.872641 52.839844 25.588266 52.174453 27.697266 51.439453 C 29.071266 52.348453 30.722125 52.839844 32.453125 52.839844 C 34.215125 52.839844 35.869422 52.353125 37.232422 51.453125 C 41.805422 53.496125 44.150719 53.039344 45.636719 52.277344 C 47.314719 51.416344 48.403953 49.800703 48.876953 47.470703 C 49.107953 46.334703 48.997375 45.198781 48.609375 44.175781 C 48.012375 42.602781 46.757453 41.293531 45.064453 40.644531 C 43.137453 39.916531 42.576406 39.753172 41.316406 38.826172 C 39.672406 37.616172 39.015453 35.742422 37.814453 33.607422 C 36.601453 31.449422 34.298641 30.067953 31.806641 30.001953 z M 31.701172 34.001953 C 32.777172 34.029953 33.808125 34.644359 34.328125 35.568359 C 35.480125 37.621359 36.442312 40.205828 38.945312 42.048828 C 40.748312 43.375828 41.894813 43.725812 43.632812 44.382812 C 44.073813 44.550813 44.501812 44.883844 44.757812 45.339844 C 44.966813 45.711844 45.061031 46.164781 44.957031 46.675781 C 44.738031 47.753781 44.3535 48.44175 43.8125 48.71875 C 42.4475 49.41975 39.736125 48.192875 38.578125 47.671875 C 38.187125 47.495875 36.729781 46.582125 35.550781 47.703125 C 34.778781 48.436125 33.679125 48.839844 32.453125 48.839844 C 31.288125 48.839844 30.211922 48.444562 29.419922 47.726562 C 28.893922 47.247562 28.151609 47.085828 27.474609 47.298828 C 25.411609 47.948828 23.441594 48.839844 22.058594 48.839844 C 20.372594 48.839844 19.001953 47.562141 19.001953 45.994141 C 19.001953 44.795141 19.69525 44.240406 21.53125 43.066406 C 24.29525 41.302406 25.514688 40.146469 28.804688 35.730469 C 29.975687 34.161469 30.981172 33.980953 31.701172 34.001953 z"
-        />
-      </svg>
-      <h1>Виберіть вісника для редагування</h1>
+            <i id="sheep-addeds-icon"></i>
+            <div class="addeds-blocks-inputs">
+                <label for="sheep-addeds-name">Імʼя</label>
+                <input id="sheep-addeds-name" type="text" name="name"
+                    required />
+            </div>
+            <div class="addeds-blocks-inputs">
+                <label for="sheep-addeds-group_id">Група</label>
+                <select id="sheep-addeds-group_id" name="group_id" required>
+                    <option value selected disabled>Оберіть...</option>
+                    <option value="1">Група 1</option>
+                    <option value="2">Група 2</option>
+                    <option value="3">Група 3</option>
+                    <option value="4">Група 4</option>
+                    <option value="5">Група 5</option>
+                    <option value="6">Група 6</option>
+                    <option value="7">Група 7</option>
+                    <option value="8">Група 8</option>
+                </select>
+            </div>
+
+            <button id="sheep-addeds-button">Додати</button>
+        </form>
    </div>
-
-    <form id="sheep-editor" style="display: none; opacity: 0">
-      <div class="header">
-        <h1>Інформація про вісника</h1>
-
-        <button onclick="Sheeps.editor.close()" type="button">
-          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26">
-            <path
-              d="M 6.65625 4 C 6.367188 4 6.105469 4.113281 5.90625 4.3125 L 4.3125 5.90625 C 3.914063 6.304688 3.914063 7 4.3125 7.5 L 9.8125 13 L 4.3125 18.5 C 3.914063 19 3.914063 19.695313 4.3125 20.09375 L 5.90625 21.6875 C 6.40625 22.085938 7.101563 22.085938 7.5 21.6875 L 13 16.1875 L 18.5 21.6875 C 19 22.085938 19.695313 22.085938 20.09375 21.6875 L 21.6875 20.09375 C 22.085938 19.59375 22.085938 18.898438 21.6875 18.5 L 16.1875 13 L 21.6875 7.5 C 22.085938 7 22.085938 6.304688 21.6875 5.90625 L 20.09375 4.3125 C 19.59375 3.914063 18.898438 3.914063 18.5 4.3125 L 13 9.8125 L 7.5 4.3125 C 7.25 4.113281 6.945313 4 6.65625 4 Z"
-            ></path>
-          </svg>
-        </button>
-      </div>
-      <i id="sheep-editor-icon"></i>
-      <div class="editor-blocks-inputs" id="editor-blocks-inputs-uuid">
-        <label>UUID <span>Натисніть, щоб скопіювати</span></label>
-        <input
-          id="sheep-editor-uuid"
-          type="text"
-          name="uuid"
-          value=""
-          disabled
-          style="display: none"
-        />
-        <p id="sheep-editor-uuid-copy" style="cursor: copy !important"></p>
-      </div>
-      <div class="editor-blocks-inputs">
-        <label for="sheep-editor-name">Імʼя</label>
-        <input id="sheep-editor-name" type="text" name="name" required="" />
-      </div>
-      <div class="editor-blocks-inputs">
-        <label for="sheep-editor-group_id">Група</label>
-        <select id="sheep-editor-group_id" name="group_id">
-          <option value="1">Група 1</option>
-          <option value="2" selected>Група 2</option>
-          <option value="3">Група 3</option>
-          <option value="4">Група 4</option>
-          <option value="5">Група 5</option>
-          <option value="6">Група 6</option>
-          <option value="7">Група 7</option>
-          <option value="8">Група 8</option>
-        </select>
-      </div>
-      <div class="editor-blocks-inputs">
-        <label for="sheep-editor-mode">Права</label>
-        <select id="sheep-editor-mode" name="mode">
-          <option value="0" selected>Користувач</option>
-          <option value="1">Модератор</option>
-          <option value="2">Адміністратор</option>
-        </select>
-      </div>
-
-      <div
-        class="editor-blocks-inputs"
-        id="editor-blocks-inputs-uuid-moder"
-        style="display: none"
-      >
-        <label>UUID адміністратора/модератора</label>
-        <p id="sheep-editor-uuid-moder" style="cursor: copy !important"></p>
-      </div>
-
-      <div
-        class="editor-blocks-checkbox"
-        id="sheep-editor-access-moder"
-        style="display: none"
-      >
-        <p for="editor-access">Дозволи модератора</p>
-        <div>
-          <div class="checkbox">
-            <input
-              name="can_view_sheeps"
-              class="custom-checkbox"
-              id="sheep-editor-can_view_sheeps"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_view_sheeps"> Перегляд списку вісників </label>
-          </div>
-          <div class="checkbox">
-            <input
-              name="can_add_sheeps"
-              class="custom-checkbox"
-              id="sheep-editor-can_add_sheeps"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_add_sheeps"> Додавання вісників </label>
-          </div>
-          <div class="checkbox">
-            <input
-              name="can_manager_sheeps"
-              class="custom-checkbox"
-              id="sheep-editor-can_manager_sheeps"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_manager_sheeps"> Керування дозволами вісників </label>
-          </div>
-          <div class="checkbox">
-            <input
-              name="can_add_territory"
-              class="custom-checkbox"
-              id="sheep-editor-can_add_territory"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_add_territory">
-              Створення територій
-            </label>
-          </div>
-          <div class="checkbox">
-            <input
-              name="can_manager_territory"
-              class="custom-checkbox"
-              id="sheep-editor-can_manager_territory"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_manager_territory">
-              Керування територіями
-            </label>
-          </div>
-          <div class="checkbox">
-            <input
-              name="can_joint_territory"
-              class="custom-checkbox"
-              id="sheep-editor-can_joint_territory"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_joint_territory">
-              Спільний доступ до території
-            </label>
-          </div>
-          <div class="checkbox">
-            <input
-              name="can_add_stand"
-              class="custom-checkbox"
-              id="sheep-editor-can_add_stand"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_add_stand"> Створення стендів </label>
-          </div>
-          <div class="checkbox">
-            <input
-              name="can_manager_stand"
-              class="custom-checkbox"
-              id="sheep-editor-can_manager_stand"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_manager_stand"> Керування стендами </label>
-          </div>
-          <div class="checkbox">
-            <input
-              name="can_add_schedule"
-              class="custom-checkbox"
-              id="sheep-editor-can_add_schedule"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_add_schedule"> Створення розкладу зібрань </label>
-          </div>
-        </div>
-      </div>
-
-      <div class="editor-blocks-checkbox">
-        <p for="editor-access">Дозволи вісника</p>
-        <div>
-          <div class="checkbox">
-            <input
-              name="can_view_schedule"
-              class="custom-checkbox"
-              id="sheep-editor-can_view_schedule"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_view_schedule"> Перегляд розкладу зібрань </label>
-          </div>
-          <div class="checkbox">
-            <input
-              name="can_view_stand"
-              class="custom-checkbox"
-              id="sheep-editor-can_view_stand"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_view_stand"> Перегляд стендів </label>
-          </div>
-          <div class="checkbox">
-            <input
-              name="can_view_territory"
-              class="custom-checkbox"
-              id="sheep-editor-can_view_territory"
-              type="checkbox"
-            />
-            <label for="sheep-editor-can_view_territory">
-              Перегляд територій
-            </label>
-          </div>
-        </div>
-      </div>
-
-      <button id="sheep-editor-button" style="display: none" type="submit">
-        Зберегти
-      </button>
-
-      <details id="editor-blocks-territory" style="display: none;">
-        <summary>Території вісника</summary>
-
-        <div>
-          <div id="title">
-            <h1>вул. Бродівська 50Б (Під'їзд 1)</h1>
-
-            <a
-              href="/territory/card/house/57"
-              title="Редактор квартир"
-              data-route=""
-            >
-              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
-                <path
-                  d="M 12.5 6 C 8.9280619 6 6 8.9280619 6 12.5 L 6 35.5 C 6 39.071938 8.9280619 42 12.5 42 L 35.5 42 C 39.071938 42 42 39.071938 42 35.5 L 42 12.5 C 42 8.9280619 39.071938 6 35.5 6 L 12.5 6 z M 12.5 9 L 14 9 L 14 15 L 9 15 L 9 12.5 C 9 10.549938 10.549938 9 12.5 9 z M 17 9 L 35.5 9 C 37.450062 9 39 10.549938 39 12.5 L 39 15 L 17 15 L 17 9 z M 9 18 L 14 18 L 14 23 L 9 23 L 9 18 z M 17 18 L 39 18 L 39 23 L 17 23 L 17 18 z M 9 26 L 14 26 L 14 31 L 9 31 L 9 26 z M 17 26 L 39 26 L 39 31 L 17 31 L 17 26 z M 9 34 L 14 34 L 14 39 L 12.5 39 C 10.549938 39 9 37.450062 9 35.5 L 9 34 z M 17 34 L 39 34 L 39 35.5 C 39 37.450062 37.450062 39 35.5 39 L 17 39 L 17 34 z"
-                ></path>
-              </svg>
-            </a>
-          </div>
-          <div>
-            <h1>Територія видана:</h1>
-            <h2>02.07.2025</h2>
-          </div>
-          <div>
-            <h1>Варто забрати:</h1>
-            <h2>01.11.2025</h2>
-          </div>
-        </div>
-
-        <div>
-          <div id="title">
-            <h1>вул. Бродівська 50Б (Під'їзд 1)</h1>
-
-            <a
-              href="/territory/card/house/57"
-              title="Редактор квартир"
-              data-route=""
-            >
-              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
-                <path
-                  d="M 12.5 6 C 8.9280619 6 6 8.9280619 6 12.5 L 6 35.5 C 6 39.071938 8.9280619 42 12.5 42 L 35.5 42 C 39.071938 42 42 39.071938 42 35.5 L 42 12.5 C 42 8.9280619 39.071938 6 35.5 6 L 12.5 6 z M 12.5 9 L 14 9 L 14 15 L 9 15 L 9 12.5 C 9 10.549938 10.549938 9 12.5 9 z M 17 9 L 35.5 9 C 37.450062 9 39 10.549938 39 12.5 L 39 15 L 17 15 L 17 9 z M 9 18 L 14 18 L 14 23 L 9 23 L 9 18 z M 17 18 L 39 18 L 39 23 L 17 23 L 17 18 z M 9 26 L 14 26 L 14 31 L 9 31 L 9 26 z M 17 26 L 39 26 L 39 31 L 17 31 L 17 26 z M 9 34 L 14 34 L 14 39 L 12.5 39 C 10.549938 39 9 37.450062 9 35.5 L 9 34 z M 17 34 L 39 34 L 39 35.5 C 39 37.450062 37.450062 39 35.5 39 L 17 39 L 17 34 z"
-                ></path>
-              </svg>
-            </a>
-          </div>
-          <div>
-            <h1>Територія видана:</h1>
-            <h2>02.07.2025</h2>
-          </div>
-          <div>
-            <h1>Варто забрати:</h1>
-            <h2>01.11.2025</h2>
-          </div>
-        </div>
-
-        <div>
-          <div id="title">
-            <h1>вул. Бродівська 50Б (Під'їзд 1)</h1>
-
-            <a
-              href="/territory/card/house/57"
-              title="Редактор квартир"
-              data-route=""
-            >
-              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
-                <path
-                  d="M 12.5 6 C 8.9280619 6 6 8.9280619 6 12.5 L 6 35.5 C 6 39.071938 8.9280619 42 12.5 42 L 35.5 42 C 39.071938 42 42 39.071938 42 35.5 L 42 12.5 C 42 8.9280619 39.071938 6 35.5 6 L 12.5 6 z M 12.5 9 L 14 9 L 14 15 L 9 15 L 9 12.5 C 9 10.549938 10.549938 9 12.5 9 z M 17 9 L 35.5 9 C 37.450062 9 39 10.549938 39 12.5 L 39 15 L 17 15 L 17 9 z M 9 18 L 14 18 L 14 23 L 9 23 L 9 18 z M 17 18 L 39 18 L 39 23 L 17 23 L 17 18 z M 9 26 L 14 26 L 14 31 L 9 31 L 9 26 z M 17 26 L 39 26 L 39 31 L 17 31 L 17 26 z M 9 34 L 14 34 L 14 39 L 12.5 39 C 10.549938 39 9 37.450062 9 35.5 L 9 34 z M 17 34 L 39 34 L 39 35.5 C 39 37.450062 37.450062 39 35.5 39 L 17 39 L 17 34 z"
-                ></path>
-              </svg>
-            </a>
-          </div>
-          <div>
-            <h1>Територія видана:</h1>
-            <h2>02.07.2025</h2>
-          </div>
-          <div>
-            <h1>Варто забрати:</h1>
-            <h2>01.11.2025</h2>
-          </div>
-        </div>
-      </details>
-    </form>
-  </div>
-
-  <div id="block-sheep-addeds" style="display: none; opacity: 0">
-    <form id="sheep-addeds">
-      <div class="header">
-        <h1>Додавання нового вісника</h1>
-        <button onclick="Sheeps.addeds.close()" class="close" type="button">
-          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26">
-            <path
-              d="M 6.65625 4 C 6.367188 4 6.105469 4.113281 5.90625 4.3125 L 4.3125 5.90625 C 3.914063 6.304688 3.914063 7 4.3125 7.5 L 9.8125 13 L 4.3125 18.5 C 3.914063 19 3.914063 19.695313 4.3125 20.09375 L 5.90625 21.6875 C 6.40625 22.085938 7.101563 22.085938 7.5 21.6875 L 13 16.1875 L 18.5 21.6875 C 19 22.085938 19.695313 22.085938 20.09375 21.6875 L 21.6875 20.09375 C 22.085938 19.59375 22.085938 18.898438 21.6875 18.5 L 16.1875 13 L 21.6875 7.5 C 22.085938 7 22.085938 6.304688 21.6875 5.90625 L 20.09375 4.3125 C 19.59375 3.914063 18.898438 3.914063 18.5 4.3125 L 13 9.8125 L 7.5 4.3125 C 7.25 4.113281 6.945313 4 6.65625 4 Z"
-            ></path>
-          </svg>
-        </button>
-      </div>
-
-      <i id="sheep-addeds-icon"></i>
-      <div class="addeds-blocks-inputs">
-        <label for="sheep-addeds-name">Імʼя</label>
-        <input id="sheep-addeds-name" type="text" name="name" required="" />
-      </div>
-      <div class="addeds-blocks-inputs">
-        <label for="sheep-addeds-group_id">Група</label>
-        <select id="sheep-addeds-group_id" name="group_id" required>
-          <option value="" selected disabled>Оберіть...</option>
-          <option value="1">Група 1</option>
-          <option value="2">Група 2</option>
-          <option value="3">Група 3</option>
-          <option value="4">Група 4</option>
-          <option value="5">Група 5</option>
-          <option value="6">Група 6</option>
-          <option value="7">Група 7</option>
-          <option value="8">Група 8</option>
-        </select>
-      </div>
-
-      <button id="sheep-addeds-button">Додати</button>
-    </form>
-  </div>
 </div>
@@ -41,7 +41,7 @@ const SheepsEvents = {
                const form = event.target;
                const formData = new FormData(form);
                console.log(formData);
-                
+
                const uuidValue = form.elements["uuid"].value;
                const sheep = Sheeps.sheeps_list.list.find(item => item.uuid === uuidValue);

@@ -88,20 +88,20 @@ const SheepsEvents = {

                    if (response.ok) {
                        sheepEditorButton.innerText = "Зберегти";
-                        Notifier.success("Успішно збережено!", {timeout: 2000})
+                        Notifier.success("Успішно збережено!", { timeout: 2000 })
                        const data = await response.json();
                        console.log(data);

                        Sheeps.sheeps_list.list = [];
-                        await Sheeps.sheeps_list.setHTML();
+                        await Sheeps.sheeps_list.setHTML({});
                    } else {
                        sheepEditorButton.innerText = "Зберегти";
                        console.error('Помилка збереження');
-                        Notifier.error("Помилка збереження!", {timeout: 3000});
+                        Notifier.error("Помилка збереження!", { timeout: 3000 });
                    }
                } catch (err) {
                    console.error(err);
-                    Notifier.error("Помилка збереження!", {timeout: 3000});
+                    Notifier.error("Помилка збереження!", { timeout: 3000 });
                }

                return;
@@ -143,11 +143,11 @@ const SheepsEvents = {
                    } else {
                        sheepEditorButton.innerText = "Додати";
                        console.error('Помилка додавання');
-                        Notifier.error("Помилка додавання!", {timeout: 3000});
+                        Notifier.error("Помилка додавання!", { timeout: 3000 });
                    }
                } catch (err) {
                    console.error(err);
-                    Notifier.error("Помилка додавання!", {timeout: 3000});
+                    Notifier.error("Помилка додавання!", { timeout: 3000 });
                }
                return;
            }
@@ -182,7 +182,7 @@ const Sheeps = {

            return Sheeps.sheeps_list.list
        },
-        setHTML: async ({search, filter}) => {
+        setHTML: async ({ search, filter }) => {
            let block_sheep_list = document.getElementById('block-sheeps-list');
            let block_sheep_info = document.getElementById('block-sheep-info');
            block_sheep_list.style.display = "flex";
@@ -270,7 +270,7 @@ const Sheeps = {
                    continue; // пропустити, якщо ім'я не містить рядок пошуку
                }

-                if (filter && element.group_id !== Number(filter) && Number(filter) !== 0) {                    
+                if (filter && element.group_id !== Number(filter) && Number(filter) !== 0) {
                    continue; // пропустити, якщо ім'я не містить рядок пошуку
                }

@@ -354,7 +354,7 @@ const Sheeps = {
            let sheep_editor_can_add_territory = document.getElementById('sheep-editor-can_add_territory');
            let sheep_editor_can_manager_territory = document.getElementById('sheep-editor-can_manager_territory');
            let sheep_editor_can_joint_territory = document.getElementById('sheep-editor-can_joint_territory');
-            
+
            let sheep_editor_can_add_stand = document.getElementById('sheep-editor-can_add_stand');
            let sheep_editor_can_manager_stand = document.getElementById('sheep-editor-can_manager_stand');
            let sheep_editor_can_add_schedule = document.getElementById('sheep-editor-can_add_schedule');
@@ -366,7 +366,7 @@ const Sheeps = {

            sheep_editor_uuid.value = sheep.uuid;
            sheep_editor_uuid_copy.innerText = sheep.uuid;
-            sheep_editor_uuid_copy.setAttribute("onclick", `clipboard('https://sheep-service.com/?uuid=${sheep.uuid}')`);
+            sheep_editor_uuid_copy.setAttribute("onclick", `clipboard('https://sheep-service.com/?uuid=${sheep.uuid}');Sheeps.editor.genQR('${sheep.uuid}');`);

            sheep_editor_mode.value = sheep.mode;

@@ -379,7 +379,7 @@ const Sheeps = {
                sheep_editor_access_moder.style.display = "";
                editor_blocks_inputs_uuid_moder.style.display = "";
                sheep_editor_uuid_moder.innerText = sheep.uuid_manager;
-                sheep_editor_uuid_moder.setAttribute("onclick", `clipboard('https://sheep-service.com/?uuid=${sheep.uuid_manager}')`);
+                sheep_editor_uuid_moder.setAttribute("onclick", `clipboard('https://sheep-service.com/?uuid=${sheep.uuid_manager}');Sheeps.editor.genQR('${sheep.uuid_manager}');`);
            } else if (USER.mode == 2 && (sheep.mode == 0)) {
                sheep_editor_access_moder.style.display = "none";
                editor_blocks_inputs_uuid_moder.style.display = "none";
@@ -405,6 +405,8 @@ const Sheeps = {
            sheep_editor_can_view_stand.checked = sheep.possibilities.can_view_stand;
            sheep_editor_can_view_territory.checked = sheep.possibilities.can_view_territory;

+            Sheeps.editor.genQR(sheep.uuid);
+
            if (USER.possibilities.can_manager_territory) {
                document.getElementById('editor-blocks-territory').style.display = "none";
                document.getElementById(`editor-blocks-territory`).innerHTML = "<summary>Території вісника</summary>";
@@ -437,6 +439,34 @@ const Sheeps = {
            }, 10);

            Router.navigate(`sheeps`);
+        },
+        genQR: (hash) => {          
+            document.getElementById("qr-code").innerHTML = "";
+
+            const qrCode = new QRCodeStyling({
+                width: 250,
+                height: 250,
+                type: "svg",
+                data: `https://sheep-service.com/?uuid=${hash}`,
+                backgroundOptions: {
+                    color: "#fbfbfb",
+                },
+                dotsOptions: {
+                    color: "#313131",
+                    type: "rounded"
+                },
+                cornersSquareOptions: {
+                    color: "#313131",
+                    type: "extra-rounded"
+                },
+                cornersDotOptions: {
+                    color: "#313131",
+                    type: "dot"
+                },
+            });
+
+            // 2. Відмальовуємо QR-код у вибраний контейнер
+            qrCode.append(document.getElementById("qr-code"));
        }
    },
    addeds: {
@@ -479,7 +509,7 @@ const Sheeps = {
            const sheepFilterForm = document.getElementById("block-sheeps-list-filter");
            const current = sheepFilterForm.dataset.state;

-            if(current === 'closed') Sheeps.search.close();
+            if (current === 'closed') Sheeps.search.close();
            sheepFilterForm.dataset.state = current === 'open' ? 'closed' : 'open';
        },
        close: () => {
@@ -490,7 +520,7 @@ const Sheeps = {
            console.log(value);

            filter_value = value || "";
-            Sheeps.sheeps_list.setHTML({filter: filter_value});
+            Sheeps.sheeps_list.setHTML({ filter: filter_value });
        }
    },
    search: {
@@ -498,7 +528,7 @@ const Sheeps = {
            const sheepSearchForm = document.getElementById("block-sheeps-list-search");
            const current = sheepSearchForm.dataset.state;

-            if(current === 'closed') Sheeps.filter.close();
+            if (current === 'closed') Sheeps.filter.close();
            sheepSearchForm.dataset.state = current === 'open' ? 'closed' : 'open';
        },
        close: () => {
@@ -509,7 +539,7 @@ const Sheeps = {
            console.log(value);

            search_value = value?.trim()?.toLowerCase() || "";
-            Sheeps.sheeps_list.setHTML({search: search_value});
+            Sheeps.sheeps_list.setHTML({ search: search_value });
        }
    },
    territory: {
@@ -112,7 +112,7 @@
    border-radius: 0px 0px 10px 10px;
 }

-#block-sheeps-list>.filter>select{
+#block-sheeps-list>.filter>select {
    width: 100%;
    padding: 0 5px;
    border-radius: calc(var(--border-radius) - 5px - 4px);
@@ -297,15 +297,15 @@
    fill: var(--PrimaryColor);
 }

-#block-sheep-info>#sheep-editor>.editor-blocks-inputs {
+#block-sheep-info>#sheep-editor .editor-blocks-inputs {
    width: 100%;
    display: flex;
-    margin: 10px 0;
+    margin: 0 0 10px 0;
    align-items: flex-start;
    flex-direction: column;
 }

-#block-sheep-info>#sheep-editor>.editor-blocks-inputs label {
+#block-sheep-info>#sheep-editor .editor-blocks-inputs label {
    display: flex;
    justify-content: center;
    flex-direction: row;
@@ -314,12 +314,12 @@
    margin-bottom: 5px;
 }

-#block-sheep-info>#sheep-editor>.editor-blocks-inputs label>span {
+#block-sheep-info>#sheep-editor .editor-blocks-inputs label>span {
    opacity: 0.5;
    margin-left: 5px;
 }

-#block-sheep-info>#sheep-editor>.editor-blocks-inputs input {
+#block-sheep-info>#sheep-editor .editor-blocks-inputs input {
    width: calc(100% - 10px);
    min-width: 140px;
    padding: 0 5px;
@@ -330,7 +330,7 @@
    font-size: var(--FontSize2);
 }

-#block-sheep-info>#sheep-editor>.editor-blocks-inputs select {
+#block-sheep-info>#sheep-editor .editor-blocks-inputs select {
    width: 100%;
    min-width: 140px;
    padding: 0 5px;
@@ -340,7 +340,7 @@
    color: var(--ColorThemes3);
 }

-#block-sheep-info>#sheep-editor>.editor-blocks-inputs p {
+#block-sheep-info>#sheep-editor .editor-blocks-inputs p {
    display: flex;
    width: calc(100% - 10px);
    min-width: 140px;
@@ -352,6 +352,7 @@
    color: var(--ColorThemes3);
    align-items: center;
    cursor: copy;
+    margin: 0;
 }

 #block-sheep-info>#sheep-editor>.editor-blocks-checkbox {
@@ -405,6 +406,13 @@
    margin: 10px 0 0 0;
    text-transform: uppercase;
 }
+#block-sheep-info>#sheep-editor>button[type="button"]{
+    background: var(--ColorThemes3);
+    color: var(--ColorThemes0);
+    height: 30px;
+    font-size: var(--FontSize1);
+    font-weight: 400;
+}

 #block-sheep-addeds {
    width: 100%;
@@ -640,6 +648,17 @@
    align-items: flex-start;
 }

+#qr-code {
+    width: 100%;
+    padding: 10px 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: #fbfbfb;
+    border-radius: calc(var(--border-radius) - 5px - 4px);
+    box-shadow: var(--shadow-l1);
+}
+


@media (min-width: 1001px),
@@ -63,6 +63,7 @@
    opacity: 0.9;
    font-weight: 400;
    font-size: var(--FontSize3);
+    margin: 0;
 }

 #stand-info img {
@@ -117,7 +117,7 @@
 }

 .page-stand-list>details>#list {
-    width: 100%;
+    width: calc(100% - 20px);
    margin: 0;
    display: flex;
    flex-wrap: wrap;
@@ -127,6 +127,10 @@
    overflow-y: auto;
    align-items: flex-start;
    transition: .3s ease;
+    gap: 20px;
+    padding: 10px;
+    justify-content: center;
+    flex-wrap: wrap;
 }

 .page-stand-list>details>#list>.mess-list {
@@ -159,7 +163,6 @@
    width: 300px;
    height: 200px;
    background-color: var(--ColorThemes2);
-    margin: 10px;
    overflow: hidden;
    cursor: pointer;
    border-radius: calc(var(--border-radius) - 5px);