Search Component - Copy this React, Tailwind Component to your project
@model-List<Ql_KhoHang.Dtos.LoaiSanPhamWebDtos>-@{-ViewData["Title"]-=-"LoaiSanPham";-Layout-=-"~/Views/Shared/_LayoutAdmin.cshtml";-}-<div-class="main-wrapper">-<div-class="page-wrapper">-<div-class="content-container-fluid-px-3-my-3">-<div-class="row">-<div>-<p>Chào,-@ViewBag.Username!-Vai-trò-của-bạn:-@ViewBag.Role</p>-</div>-<!---Form-tìm-kiếm--->-<div-class="mb-3">-<form-asp-action="Search"-method="get"-class="form-inline">-<input-type="text"-name="keyword"-class="form-control-mr-2"-placeholder="Nhập-từ-khóa-tìm-kiếm..."-/>-<button-type="submit"-class="btn-btn-primary">Tìm-kiếm</button>-</form>-</div>-<table-class="table-table-striped">-<thead>-<tr>-<th>STT</th>-<th>Tên-Loại-Sản-Phẩm</th>-<th>Thao-Tác</th>-</tr>-</thead>-<tbody>-@if-(Model-!=-null-&&-Model.Any())-{-int-index-=-1;-foreach-(var-category-in-Model)-{-<tr>-<td>@index</td>-<td>@category.TenLoaiSanPham</td>-<td>-<a-asp-action="Details"-asp-route-id="@category.MaLoaiSanPham"-class="btn-btn-info">Chi-tiết</a>-<a-asp-action="Edit"-asp-route-id="@category.MaLoaiSanPham"-class="btn-btn-warning">Chỉnh-sửa</a>-<form-asp-action="Delete"-asp-route-id="@category.MaLoaiSanPham"-method="post"-style="display:inline;">-<button-type="submit"-class="btn-btn-danger"-onclick="return-confirm('Bạn-có-chắc-chắn-muốn-xóa?')">Xóa</button>-</form>-</td>-</tr>-index++;-}-}-else-{-<tr>-<td-colspan="3"-class="text-center">Không-có-loại-sản-phẩm-nào.</td>-</tr>-}-</tbody>-</table>-<a-asp-action="Create"-asp-controller="LoaiSanPhamWeb"-class="btn-btn-success">Thêm-mới-Loại-Sản-Phẩm</a>-</div>-</div>-</div>-</div>-I-have-an-existing-interface-page-but-it's-too-ugly,-please-make-it-more-beautiful-and-professional.
