Добавил BLAZORIES.Переписать все на него.

2026-06-23 19:28:04 +03:00
parent 90cbc7c506
commit 7aa990a12b
11 changed files with 410 additions and 124 deletions
@@ -5,7 +5,7 @@
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <base href="/" />
-    <link rel="stylesheet" href="bootstrap/bootstrap.min.css" />
+    <link rel="stylesheet" href="~/bootstrap/css/bootstrap.css" />
    <link rel="stylesheet" href="app.css" />
    <link rel="stylesheet" href="Ministreliy.styles.css" />
    <link rel="icon" type="image/png" href="favicon.png" />
@@ -14,6 +14,7 @@

 <body>
    <Routes @rendermode="InteractiveServer" />
+    <script src="~/bootstrap/js/bootstrap.bundle.min.js"></script>
    <script src="_framework/blazor.web.js"></script>
 </body>

@@ -1,23 +1,72 @@
@page "/database"
+@using Ministreliy.Models
+@using Newtonsoft.Json
+@using System.Text
+@inject IJSRuntime JS
+@inject NavigationManager NavManager

 <PageTitle>База данных</PageTitle>

-<ul class="nav nav-tabs">
-    <li class="nav-item">
-        <a class="nav-link active" aria-current="page" href="database">Сводные данные</a>
-    </li>
-    <li class="nav-item">
-        <a class="nav-link" href="database/type">Типы устройств</a>
-    </li>
+<div>
+    <div class="row justify-content-between">
+        <div class="col-10">
+            <ul class="nav nav-tabs">
+                <li class="nav-item">
+                    <a class="nav-link active" aria-current="page" href="database">Сводные данные</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" href="database/type">Типы устройств</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" href="database/device">Устройства</a>
+                </li>

-</ul>
+            </ul>
+        </div>
+        <div class="col-2">
+            @* <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addtype">
+                Добавить тип
+            </button>
+            <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#deltype">
+                Удалить тип
+            </button> *@
+        </div>
+    </div>
+    <div class="row">
+    </div>
+</div>
+
+
+    @if (listDeviceTypes.Count == 0 || listDeviceItems.Count == 0)
+    {
+        <p>@messageStatus</p>
+    }


@code {
-    private int currentCount = 0;
+    public static List<DeviceType>? listDeviceTypes = new();
+    public static List<DeviceItem>? listDeviceItems = new();
+    public static HttpClient httpClient = new();

-    private void IncrementCount()
+    string? messageStatus = "Получаю данные...";
+
+    protected override async Task OnInitializedAsync()
    {
-        currentCount++;
+        httpClient.BaseAddress = new Uri("http://localhost:5262/api/");
+        var devicetype = await httpClient.GetAsync("Device/GetTypes");
+        var deviceitem = await httpClient.GetAsync("Device/GetDevices");
+        listDeviceTypes = JsonConvert.DeserializeObject<List<DeviceType>>(await devicetype.Content.ReadAsStringAsync());
+        listDeviceItems = JsonConvert.DeserializeObject<List<DeviceItem>>(await deviceitem.Content.ReadAsStringAsync());
+        messageStatus = string.Empty;
+        if (listDeviceTypes.Count == 0)
+        {
+            messageStatus += $"нет типов устройств\r\n";
+        }
+        if (listDeviceItems.Count == 0)
+        {
+            messageStatus += $"нет устройств\r\n";
+        }
+        DataStore.ListDeviceTypesStore = listDeviceTypes;
+        DataStore.ListDeviceItemsStore = listDeviceItems;
    }
 }
@@ -0,0 +1,201 @@
+@page "/database/device"
+@using Ministreliy.Models
+@using System.Text.Json
+@using Newtonsoft.Json
+@using System.Text
+@inject IJSRuntime JS
+@inject NavigationManager NavManager
+
+<PageTitle>База данных</PageTitle>
+
+<ul class="nav nav-tabs">
+    <li class="nav-item">
+        <a class="nav-link" aria-current="page" href="database">Сводные данные</a>
+    </li>
+    <li class="nav-item">
+        <a class="nav-link" href="database/type">Типы устройств</a>
+    </li>
+    <li class="nav-item">
+        <a class="nav-link active" href="database/device">Устройства</a>
+    </li>
+
+</ul>
+
+<div class="modal fade modal1" id="addtype" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="addtypeLabel" aria-hidden="true">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h1 class="modal-title fs-5" id="addtypeLabel">Заголовок</h1>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <div class="mb-3">
+                    <label for="typeID" class="form-label">id типа</label>
+                    <input type="number" class="form-control" id="typeID" @bind="id_type" />
+                </div>
+                <div class="mb-3">
+                    <label for="typeName" class="form-label">Имя типа</label>
+                    <textarea class="form-control" id="typeName" rows="3" @bind="name_type"></textarea>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-primary" @onclick="SaveType">Сохранить</button>
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
+            </div>
+        </div>
+    </div>
+</div>
+
+
+@if (listDT.Count == 0 || listDT == null)
+{
+    <p>@msg</p>
+}
+else
+{
+    @* <ul class="nav nav-tabs">
+        <li class="nav-item" role="presentation">
+            <a class="nav-link" aria-current="page" href="database">Сводные данные</a>
+        </li>
+        <li class="nav-item" role="presentation">
+            <a class="nav-link active"
+               id="addtype-tab"
+               data-bs-toggle="tab"
+               data-bs-target="#addtype"
+               role="tab"
+               aria-controls="addtype"
+               aria-selected="true"
+               href="database/addtype">Добавить Тип</a>
+        </li>
+
+    </ul> *@
+    <br>
+    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addtype">
+        Добавить тип
+    </button>
+    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#deltype">
+        Удалить тип
+    </button>
+
+    <div class="card-body p-0">
+        <div class="tab-content" id="myTabContent">
+            <!-- Панель 1: Главная -->
+            <div class="tab-pane fade show active" id="addtype" role="tabpanel" aria-labelledby="addtype-tab">
+                <table class="table">
+                    <thead>
+                        <tr>
+                            <th scope="col">#</th>
+                            <th scope="col">Название</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        @foreach (var item in listDT)
+                        {
+                            <tr>
+                                <th scope="row">@item.Id</th>
+                                <td>@item.Name</td>
+                            </tr>
+                        }
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+
+
+    
+
+
+
+    <div class="modal fade modal2" id="deltype" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="deltypeLabel" aria-hidden="true">
+        <div class="modal-dialog">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h1 class="modal-title fs-5" id="deltypeLabel">Заголовок</h1>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                </div>
+                <div class="modal-body">
+                    <div class="mb-3">
+                        <select class="form-select" @bind="selected_type" aria-label="Вибрать тип">
+                            @foreach (var item in listDT)
+                            {
+                                <option value="@item.Id">@item.Name</option>
+                            }
+                        </select>
+                    </div>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-primary" @onclick="DelType">Удалить</button>
+                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
+                </div>
+            </div>
+        </div>
+    </div>
+}
+    
+
+@code {
+    //HttpClient http = new();
+
+    private DeviceType dt;
+    private List<DeviceType> listDT = new();
+
+    private string msg = "-= ПОЛУЧАЮ ДАННЫЕ =-", name_type = "";
+    private int id_type = 1, selected_type = 0;
+
+    protected override async Task OnInitializedAsync()
+    {
+        HttpClient http = new();
+        await Task.Delay(1000);
+        http.BaseAddress = new Uri("http://localhost:5262/api/");
+        var t = await http.GetAsync("Device/GetTypes");
+        if (t.StatusCode == System.Net.HttpStatusCode.NoContent)
+        {
+            msg = "-= ДАННЫХ НЕТ =-";
+        }
+        else
+        {
+            listDT = JsonConvert.DeserializeObject<List<DeviceType>>(await t.Content.ReadAsStringAsync());
+            //id_type = listDT.Count + 1;
+            var a = listDT.Select(listDT => listDT.Id).ToList();
+            id_type = Enumerable.Range(1, int.MaxValue).FirstOrDefault(i => !a.Contains(i));
+
+        }
+    }
+    private async Task SaveType()
+    {
+        HttpClient http = new();
+        dt = new();
+        dt.Id = id_type;
+        dt.Name = name_type;
+        http.BaseAddress = new Uri("http://localhost:5262/api/");
+        using StringContent content = new StringContent(
+            JsonConvert.SerializeObject(dt),
+            Encoding.UTF8,
+            "application/json"
+        );
+        var r = await http.PostAsync("Device/AddType", content);
+        if (r.IsSuccessStatusCode)
+        {
+            await JS.InvokeVoidAsync("eval", $"var myModal = bootstrap.Modal.getInstance(document.querySelector('.modal1')); myModal.hide();");
+            await Task.Delay(150);
+            id_type = listDT.Count+1;
+            NavManager.NavigateTo(NavManager.Uri, forceLoad: true);
+        }
+    }
+    private async Task DelType()
+    {
+        HttpClient http = new();
+        http.BaseAddress = new Uri("http://localhost:5262/api/");
+        var r = await http.DeleteAsync($"Device/DelType?id={selected_type}");
+        if (r.IsSuccessStatusCode)
+        {
+            await JS.InvokeVoidAsync("eval", $"var myModal = bootstrap.Modal.getInstance(document.querySelector('.modal2')); myModal.hide();");
+            await Task.Delay(250);
+            id_type = listDT.Count + 1;
+            NavManager.NavigateTo(NavManager.Uri, forceLoad: true);
+        }
+    }
+}
+
+
@@ -7,24 +7,65 @@
@inject NavigationManager NavManager

 <PageTitle>База данных</PageTitle>
+<div class="row justify-content-between">
+    <div class="col-10">
+        <ul class="nav nav-tabs">
+            <li class="nav-item">
+                <a class="nav-link" aria-current="page" href="database">Сводные данные</a>
+            </li>
+            <li class="nav-item">
+                <a class="nav-link active" href="database/type">Типы устройств</a>
+            </li>
+            <li class="nav-item">
+                <a class="nav-link" href="database/device">Устройства</a>
+            </li>
+        </ul>
+    </div>
+    <div class="col-2">
+        <button type="button" class="btn btn-primary" @onclick="OpenModal">
+            Добавить тип
+        </button>
+        <button type="button" class="btn btn-primary" @onclick="DelModal">
+            Удалить тип
+        </button>
+    </div>
+</div>
+@if (listDT.Count == 0)
+{
+    <p>@msg</p>
+}
+else
+{
+    <div class="card-body p-0">
+        <div class="tab-content" id="myTabContent">
+            <!-- Панель 1: Главная -->
+            <div class="tab-pane fade show active" id="addtype" role="tabpanel" aria-labelledby="addtype-tab">
+                <table class="table">
+                    <thead>
+                        <tr>
+                            <th scope="col">#</th>
+                            <th scope="col">Название</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        @foreach (var item in Database.listDeviceTypes)
+                        {
+                            <tr>
+                                <th scope="row">@item.Id</th>
+                                <td>@item.Name</td>
+                            </tr>
+                        }
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>

-<ul class="nav nav-tabs">
-    <li class="nav-item">
-        <a class="nav-link" aria-current="page" href="database">Сводные данные</a>
-    </li>
-    <li class="nav-item">
-        <a class="nav-link active" href="database/type">Типы устройств</a>
-    </li>

-</ul>
-
-<div class="modal fade modal1" id="addtype" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="addtypeLabel" aria-hidden="true">
+}
+<div class="modal fade modal1" id="addtype" tabindex="-1" aria-labelledby="addtypeLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
-            <div class="modal-header">
-                <h1 class="modal-title fs-5" id="addtypeLabel">Заголовок</h1>
-                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-            </div>
            <div class="modal-body">
                <div class="mb-3">
                    <label for="typeID" class="form-label">id типа</label>
@@ -42,120 +83,66 @@
        </div>
    </div>
 </div>
-
-
-@if (listDT.Count == 0 || listDT == null)
-{
-    <p>@msg</p>
-}
-else
-{
-    @* <ul class="nav nav-tabs">
-        <li class="nav-item" role="presentation">
-            <a class="nav-link" aria-current="page" href="database">Сводные данные</a>
-        </li>
-        <li class="nav-item" role="presentation">
-            <a class="nav-link active"
-               id="addtype-tab"
-               data-bs-toggle="tab"
-               data-bs-target="#addtype"
-               role="tab"
-               aria-controls="addtype"
-               aria-selected="true"
-               href="database/addtype">Добавить Тип</a>
-        </li>
-
-    </ul> *@
-    <br>
-    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addtype">
-        Добавить тип
-    </button>
-    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#deltype">
-        Удалить тип
-    </button>
-
-    <div class="card-body p-0">
-        <div class="tab-content" id="myTabContent">
-            <!-- Панель 1: Главная -->
-            <div class="tab-pane fade show active" id="addtype" role="tabpanel" aria-labelledby="addtype-tab">
-                <table class="table">
-                    <thead>
-                        <tr>
-                            <th scope="col">#</th>
-                            <th scope="col">Название</th>
-                        </tr>
-                    </thead>
-                    <tbody>
+<div class="modal fade modal2" id="deltype" tabindex="-1" aria-labelledby="deltypeLabel" aria-hidden="true">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h1 class="modal-title fs-5" id="deltypeLabel">Заголовок</h1>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <div class="mb-3">
+                    <select class="form-select" @bind="selected_type" aria-label="Вибрать тип">
                        @foreach (var item in listDT)
                        {
-                            <tr>
-                                <th scope="row">@item.Id</th>
-                                <td>@item.Name</td>
-                            </tr>
+                            <option value="@item.Id">@item.Name</option>
                        }
-                    </tbody>
-                </table>
+                    </select>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-primary" @onclick="DelType">Удалить</button>
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
            </div>
        </div>
    </div>
+</div>

-
-    
-
-
-
-    <div class="modal fade modal2" id="deltype" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="deltypeLabel" aria-hidden="true">
-        <div class="modal-dialog">
-            <div class="modal-content">
-                <div class="modal-header">
-                    <h1 class="modal-title fs-5" id="deltypeLabel">Заголовок</h1>
-                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-                </div>
-                <div class="modal-body">
-                    <div class="mb-3">
-                        <select class="form-select" @bind="selected_type" aria-label="Вибрать тип">
-                            @foreach (var item in listDT)
-                            {
-                                <option value="@item.Id">@item.Name</option>
-                            }
-                        </select>
-                    </div>
-                </div>
-                <div class="modal-footer">
-                    <button type="button" class="btn btn-primary" @onclick="DelType">Удалить</button>
-                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
-                </div>
-            </div>
-        </div>
-    </div>
-}
-    
+<script>
+    // Функции для работы с модальными окнами
+    window.openModal = function (modalId) {
+        const modalElement = document.getElementById(modalId);
+        if (modalElement) {
+            const modal = new bootstrap.Modal(modalElement);
+            modal.show();
+        } else {
+            console.error('Модальное окно с id "' + modalId + '" не найдено');
+        }
+    };
+</script>

@code {
    //HttpClient http = new();

    private DeviceType dt;
-    private List<DeviceType> listDT = new();
+    private List<DeviceType> listDT;

    private string msg = "-= ПОЛУЧАЮ ДАННЫЕ =-", name_type = "";
    private int id_type = 1, selected_type = 0;

    protected override async Task OnInitializedAsync()
    {
-        HttpClient http = new();
-        await Task.Delay(1000);
-        http.BaseAddress = new Uri("http://localhost:5262/api/");
-        var t = await http.GetAsync("Device/GetTypes");
-        if (t.StatusCode == System.Net.HttpStatusCode.NoContent)
+        listDT = Database.listDeviceTypes;
+        if (listDT.Count == 0)
        {
            msg = "-= ДАННЫХ НЕТ =-";
        }
        else
        {
-            listDT = JsonConvert.DeserializeObject<List<DeviceType>>(await t.Content.ReadAsStringAsync());
+
            //id_type = listDT.Count + 1;
            var a = listDT.Select(listDT => listDT.Id).ToList();
-            id_type = Enumerable.Range(1, int.MaxValue).FirstOrDefault(i => !a.Contains(i));
+            //id_type = Enumerable.Range(1, int.MaxValue).FirstOrDefault(i => !a.Contains(i));

        }
    }
@@ -167,16 +154,16 @@ else
        dt.Name = name_type;
        http.BaseAddress = new Uri("http://localhost:5262/api/");
        using StringContent content = new StringContent(
-            JsonConvert.SerializeObject(dt),
-            Encoding.UTF8,
-            "application/json"
+        JsonConvert.SerializeObject(dt),
+        Encoding.UTF8,
+        "application/json"
        );
        var r = await http.PostAsync("Device/AddType", content);
        if (r.IsSuccessStatusCode)
        {
            await JS.InvokeVoidAsync("eval", $"var myModal = bootstrap.Modal.getInstance(document.querySelector('.modal1')); myModal.hide();");
            await Task.Delay(150);
-            id_type = listDT.Count+1;
+            id_type = listDT.Count + 1;
            NavManager.NavigateTo(NavManager.Uri, forceLoad: true);
        }
    }
@@ -193,6 +180,9 @@ else
            NavManager.NavigateTo(NavManager.Uri, forceLoad: true);
        }
    }
+
+    private async Task OpenModal() => await JS.InvokeVoidAsync("openModal", "addtype");
+    private async Task DelModal() => await JS.InvokeVoidAsync("openModal", "deltype");
 }


@@ -7,6 +7,8 @@
  </PropertyGroup>

  <ItemGroup>
+    <PackageReference Include="Blazorise.Bootstrap5" Version="2.2.1" />
+    <PackageReference Include="Blazorise.Icons.FontAwesome" Version="2.2.1" />
    <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
  </ItemGroup>

@@ -0,0 +1,8 @@
+namespace Ministreliy.Models
+{
+    public class DataStore
+    {
+        public static List<DeviceType>? ListDeviceTypesStore;
+        public static List<DeviceItem>? ListDeviceItemsStore;
+    }
+}
@@ -0,0 +1,25 @@
+namespace Ministreliy.Models
+{
+    public class DeviceItem
+    {
+        public int Id { get; set; }
+        public string Ip { get; set; }
+        public string Mac { get; set; }
+        public string? Description { get; set; }
+        public string? Name { get; set; }
+        public string? Location { get; set; }
+        public List<DeviceItem> Devises { get; set; }
+        public DeviceType DeviceType { get; set; }
+        public int ConnectedToSwitchId { get; set; }
+        public int ConnectedToPortOnSwitch { get; set; }
+
+    }
+
+    //Unknown = 0,
+    //SwitchCore = 1,
+    //SwitchAccess = 2,
+    //Camera = 3,
+    //Server = 4,
+    //WorkStation = 5,
+    //PDU_AVR = 6,
+}