Додан пошук територій за назвою вулиці

web/lib/pages/territory/manager/index.html

@@ -95,12 +95,8 @@
       <option value="6">6</option>
       <option value="7">7</option>
     </select>
-    <input
-      id="new-worker-name"
-      type="text"
-      name="new-worker-name"
-      list="list_sheeps"
-    />
+    <div id="new-worker-sheep"></div>
+
     <div>
       <button onclick="Territory_Manager.mess.close()">Закрити</button>
       <button

web/lib/pages/territory/manager/script.js

@@ -42,6 +42,8 @@ const Territory_Manager = {
             });
             card.dataset.listenerAdded = 'true';
         }
+
+        Territory_Manager.mess.init();
     },
     info: {
         list: {},
@@ -281,12 +283,39 @@ const Territory_Manager = {
         L.polygon(data.points, polygonOptions).addTo(map_territory);
     },
     mess: {
+        init: () => {
+            let block_new_sheep = document.getElementById('new-worker-sheep');
+            block_new_sheep.innerHTML = `
+                <smart-select type="number" onchange="Territory_Manager.mess.select_close()" id="new-worker-name" max="1" placeholder="Оберіть вісника..." title="Оберіть вісника, якому хочете призначити цю територію">
+                    ${Sheeps.sheeps_list.list.map(p => {
+                        return `<div 
+                            slot="option" 
+                            data-value="${Number(p.id)}">
+                            ${p.name}
+                        </div>`;
+                    }).join('')}
+                </smart-select>
+            `;
+        },
+
+        select_close: () => {
+            const select = document.getElementById(`new-worker-name`);
+            if (!select) return;
+            console.log(select.getClick);
+
+            if(select.getClick.state == "add"){
+                select.removeAttribute("open")
+            }
+        },
+
         open: ({ type, id, number, mode }) => {
             const block = document.getElementById('territory-new');
             const groupInput = document.getElementById('new-worker-group');
-            const nameInput = document.getElementById('new-worker-name');
+            const nameInput = document.getElementById('new-worker-sheep');
             const button = document.getElementById('new-worker-button');
 
+            button.removeAttribute("disabled")
+
             // Показуємо блок
             block.style.display = "";
             requestAnimationFrame(() => block.style.opacity = "1");
@@ -311,16 +340,21 @@ const Territory_Manager = {
     },
     newWorker: async ({ type, id, number, mode }) => {
         const uuid = localStorage.getItem('uuid');
-        const sheepName = document.getElementById('new-worker-name').value;
+
+        const sheepName = document.getElementById(`new-worker-name`);
         const groupId = Number(document.getElementById('new-worker-group').value);
 
+        if (!sheepName.value[0] && !groupId) return;
+
         const newButton = document.getElementById('new-worker-button');
         const groupButton = document.getElementById('group-working-button');
 
+        newButton.setAttribute("disabled", "");
+
         let territory_id;
         let URL;
 
-        const sheep = Sheeps.sheeps_list.list.find(e => e.name === sheepName);
+        const sheep = Sheeps.sheeps_list.list.find(e => e.id === sheepName.value[0]);
 
         if (type === "house") {
             territory_id = Territory_Manager.entrances.list[number]?.id;
@@ -336,11 +370,14 @@ const Territory_Manager = {
         }
 
         const data = {
-            name: mode ? sheepName : "Групова",
+            name: mode ? sheep?.name : "Групова",
             group_id: mode ? sheep?.group_id : groupId,
             sheep_id: mode ? sheep?.id : null
         };
 
+        console.log(data);
+        
+
         try {
             const response = await fetch(URL, {
                 method: 'POST',

web/lib/pages/territory/manager/style.css

@@ -340,14 +340,14 @@
 #territory-new>.mess {
     display: flex;
     width: 300px;
-    height: 100px;
+    height: 90px;
     border: 1px solid var(--ColorThemes2);
     background: var(--ColorThemes0);
     box-shadow: 0px 2px 3px rgb(0 0 0 / 5%), 0px 5px 15px rgb(0 0 0 / 5%), 0px 4px 8px rgb(0 0 0 / 5%), 0px 0px 1px rgb(0 0 0 / 5%);
     position: absolute;
     top: 50%;
     left: 50%;
-    margin-top: -50px;
+    margin-top: -45px;
     margin-left: -160px;
     flex-direction: column;
     align-items: center;
@@ -401,7 +401,6 @@
     background: var(--ColorThemes3);
     cursor: pointer;
     border: 0;
-    margin-bottom: 5px;
     margin-left: 0;
     width: calc(50% - 5px);
     border-radius: 10px;