Untitled

<script>
</script>

<template>
    <h1 class="text-center mb-4">Danh sách sản phẩm</h1>
    <table class="table table-bordered">
        <thead class="table-dark">
            <tr>
                <th>Index</th>
                <th>Name</th>
                <th>Description</th>
                <th>Price</th>
                <th>Image</th>
                <th>Action</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>id</td>
                <td>Name</td>
                <td>description</td>
                <td>price</td>
                <td><img src="" alt="" style="width: 100px; height: 100px;" /></td>
                <td>
                    <button class="btn btn-danger">Delete</button> | <button class="btn btn-primary">Edit</button>
                </td>
            </tr>
        </tbody>
    </table>

    <div class="form-add mx-auto mb-5 mt-3" style="width: 600px;">
        <h2>Add Product</h2>
        <form>
            <div class="mb-3">
                <label for="name" class="form-label">Name</label>
                <input type="text" class="form-control" id="name" placeholder="Enter name" />
            </div>
            <div class="mb-3">
                <label for="description" class="form-label">Description</label>
                <input type="text" class="form-control" id="description" placeholder="Enter description" />
            </div>
            <div class="mb-3">
                <label for="price" class="form-label">Price</label>
                <input type="text" class="form-control" id="price" placeholder="Enter price" />
            </div>
            <div class="mb-3">
                <label for="image" class="form-label">Image</label>
                <input type="text" class="form-control" id="image" placeholder="Enter image" />
            </div>
            <button type="button" class="btn btn-primary">Submit</button>
        </form>
    </div>
    
    <h2>Danh sách danh mục</h2>
    <table class="table table-bordered">
        <thead class="table-dark">
            <tr>
                <th>Index</th>
                <th>Name</th>
                <th>Action</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>id</td>
                <td>Name</td>
                <td>
                    <button class="btn btn-danger">Delete</button> | <button class="btn btn-primary">Edit</button>
                </td>
            </tr>
        </tbody>
    </table>

    <div class="form-add mx-auto mb-5 mt-3" style="width: 600px;">
        <h2>Add Category</h2>
        <form>
            <div class="mb-3">
                <label for="name" class="form-label">Name</label>
                <input type="text" class="form-control" id="name" placeholder="Enter name" />
            </div>
            <button type="button" class="btn btn-primary">Submit</button>
        </form>
    </div>
</template>