Chúng ta sẽ cùng tạo chức năng CRUD (Create, Read, Update, Delete) một danh mục phẳng. Cụ thể là danh mục có liên kết khóa ngoại Sản phẩm
Sơ đồ ER các mối quan hệ liên quan đến table sanpham
- Trong table
sanpham có 3 khóa ngoại (Foreign key) liên kết đến 3 table loaisanpham, nhasanxuat, khuyenmai. Do đó, thông thường trong các chức năng CRUD của table sanpham, chúng ta cũng cần phải lấy dữ liệu của những table cha (loaisanpham, nhasanxuat, khuyenmai).
Step 1: tạo cấu trúc thư mục cho chức năng CRUD Sản phẩm
- Để tiện cho việc quản lý, ta sẽ tạo cấu trúc thư mục tương ứng với tên của từng chức năng
- Tạo thư mục
/backend/functions/sanpham dùng để quản lý các chức năng CRUD của danh mục Nhà cung cấp
Step 2: tạo chức năng index dùng để hiển thị màn hình danh sách các Sản phẩm có trong database
- Tạo file
/backend/functions/sanpham/index.php để xử lý logic/nghiệp vụ
- Workflow của chức năng này:
- Cần phải
JOIN đến các table cha liên quan để lấy thông tin
- Cần phải
định dạng (format) để hiển thị dữ liệu một cách trực quan (như ngày tháng, số tiền, ...)
- Nội dung file:
<!-- Nhúng file cấu hình để xác định được Tên và Tiêu đề của trang hiện tại người dùng đang truy cập -->
<?php include_once(__DIR__ . '/../../layouts/config.php'); ?>
<!DOCTYPE html>
<html>
<head>
<!-- Nhúng file quản lý phần HEAD -->
<?php include_once(__DIR__ . '/../../layouts/head.php'); ?>
</head>
<body class="d-flex flex-column h-100">
<!-- header -->
<?php include_once(__DIR__ . '/../../layouts/partials/header.php'); ?>
<!-- end header -->
<div class="container-fluid">
<div class="row">
<!-- sidebar -->
<?php include_once(__DIR__ . '/../../layouts/partials/sidebar.php'); ?>
<!-- end sidebar -->
<main role="main" class="col-md-10 ml-sm-auto px-4 mb-2">
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
<h1 class="h2">Danh sách</h1>
</div>
<!-- Block content -->
<?php
// Truy vấn database để lấy danh sách
// 1. Include file cấu hình kết nối đến database, khởi tạo kết nối $conn
include_once(__DIR__ . '/../../../dbconnect.php');
// 2. Chuẩn bị câu truy vấn $sql
// Sử dụng HEREDOC của PHP để tạo câu truy vấn SQL với dạng dễ đọc, thân thiện với việc bảo trì code
$sql = <<<EOT
SELECT sp.*
, lsp.lsp_ten
, nsx.nsx_ten
, km.km_ten, km.km_noidung, km.km_tungay, km.km_denngay
FROM `sanpham` sp
JOIN `loaisanpham` lsp ON sp.lsp_ma = lsp.lsp_ma
JOIN `nhasanxuat` nsx ON sp.nsx_ma = nsx.nsx_ma
LEFT JOIN `khuyenmai` km ON sp.km_ma = km.km_ma
ORDER BY sp.sp_ma DESC
EOT;
// 3. Thực thi câu truy vấn SQL để lấy về dữ liệu
$result = mysqli_query($conn, $sql);
// 4. Khi thực thi các truy vấn dạng SELECT, dữ liệu lấy về cần phải phân tích để sử dụng
// Thông thường, chúng ta sẽ sử dụng vòng lặp while để duyệt danh sách các dòng dữ liệu được SELECT
// Ta sẽ tạo 1 mảng array để chứa các dữ liệu được trả về
$formatedData = [];
while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
$km_tomtat = '';
if (!empty($row['km_ten'])) {
// Sử dụng hàm sprintf() để chuẩn bị mẫu câu với các giá trị truyền vào tương ứng từng vị trí placeholder
$km_tomtat = sprintf(
"Khuyến mãi %s, nội dung: %s, thời gian: %s-%s",
$row['km_ten'],
$row['km_noidung'],
// Sử dụng hàm date($format, $timestamp) để chuyển đổi ngày thành định dạng Việt Nam (ngày/tháng/năm)
// Do hàm date() nhận vào là đối tượng thời gian, chúng ta cần sử dụng hàm strtotime()
// để chuyển đổi từ chuỗi có định dạng 'yyyy-mm-dd' trong MYSQL thành đối tượng ngày tháng
date('d/m/Y', strtotime($row['km_tungay'])), //vd: '2019-04-25'
date('d/m/Y', strtotime($row['km_denngay']))
); //vd: '2019-05-10'
}
$formatedData[] = array(
'sp_ma' => $row['sp_ma'],
'sp_ten' => $row['sp_ten'],
// Sử dụng hàm number_format(số tiền, số lẻ thập phân, dấu phân cách số lẻ, dấu phân cách hàng nghìn)
// để định dạng số khi hiển thị trên giao diện.
// Vd: 15800000 -> format thành 15,800,000.66 vnđ
'sp_gia' => number_format($row['sp_gia'], 2, ".", ",") . ' vnđ',
'sp_giacu' => number_format($row['sp_giacu'], 2, ".", ",") . ' vnđ',
'sp_mota_ngan' => $row['sp_mota_ngan'],
'sp_mota_chitiet' => $row['sp_mota_chitiet'],
'sp_ngaycapnhat' => date('d/m/Y H:i:s', strtotime($row['sp_ngaycapnhat'])),
'sp_soluong' => number_format($row['sp_soluong'], 0, ".", ","),
'lsp_ma' => $row['lsp_ma'],
'nsx_ma' => $row['nsx_ma'],
'km_ma' => $row['km_ma'],
// Các cột dữ liệu lấy từ liên kết khóa ngoại
'lsp_ten' => $row['lsp_ten'],
'nsx_ten' => $row['nsx_ten'],
'km_tomtat' => $km_tomtat,
);
}
?>
<!-- Nút thêm mới, bấm vào sẽ hiển thị form nhập thông tin Thêm mới -->
<a href="create.php" class="btn btn-primary">
Thêm mới
</a>
<table class="table table-bordered table-hover mt-2">
<thead class="thead-dark">
<tr>
<th>Mã Sản phẩm</th>
<th>Tên Sản phẩm</th>
<th>Giá</th>
<th>Giá cũ</th>
<th>Mô tả</th>
<th>Ngày cập nhật</th>
<th>Số lượng</th>
<th>Loại sản phẩm</th>
<th>Nhà sản xuất</th>
<th>Khuyến mãi</th>
<th>Hành động</th>
</tr>
</thead>
<tbody>
<?php foreach($formatedData as $sanpham): ?>
<tr>
<td><?= $sanpham['sp_ma'] ?></td>
<td><?= $sanpham['sp_ten'] ?></td>
<td><?= $sanpham['sp_gia'] ?></td>
<td><?= $sanpham['sp_giacu'] ?></td>
<td>
<?= $sanpham['sp_mota_ngan'] ?>
<p>
<?= $sanpham['sp_mota_chitiet'] ?>
</p>
</td>
<td><?= $sanpham['sp_ngaycapnhat'] ?></td>
<td><?= $sanpham['sp_soluong'] ?></td>
<td><?= $sanpham['lsp_ten'] ?></td>
<td><?= $sanpham['nsx_ten'] ?></td>
<td><?= $sanpham['km_tomtat'] ?></td>
<td>
<!-- Nút sửa, bấm vào sẽ hiển thị form hiệu chỉnh thông tin dựa vào khóa chính `sp_ma` -->
<a href="edit.php?sp_ma=<?= $sanpham['sp_ma'] ?>" class="btn btn-warning">
Sửa
</a>
<!-- Nút xóa, bấm vào sẽ xóa thông tin dựa vào khóa chính `sp_ma` -->
<a href="delete.php?sp_ma=<?= $sanpham['sp_ma'] ?>" class="btn btn-danger">
Xóa
</a>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
<!-- End block content -->
</main>
</div>
</div>
<!-- footer -->
<?php include_once(__DIR__ . '/../../layouts/partials/footer.php'); ?>
<!-- end footer -->
<!-- Nhúng file quản lý phần SCRIPT JAVASCRIPT -->
<?php include_once(__DIR__ . '/../../layouts/scripts.php'); ?>
<!-- Các file Javascript sử dụng riêng cho trang này, liên kết tại đây -->
<!-- <script src="..."></script> -->
</body>
</html>
Step 2.2: bổ sung thư viên DataTables để tạo hiệu ứng phân trang
- Download thư viện
DataTable: https://datatables.net/
- Giải nén vào thư mục quản lý thư viện Frontend:
/assets/vendor/DataTables
- Liên kết thư viện vào trang Danh sách, hiệu chỉnh file
/backend/functions/sanpham/index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Danh sách Hình thức thanh toán</title>
<?php include_once(__DIR__ . '/../../layouts/styles.php'); ?>
<!-- DataTable CSS -->
<link href="/duanweb-CP20SCF04/assets/vendor/DataTables/datatables.css" type="text/css" rel="stylesheet" />
<link href="/duanweb-CP20SCF04/assets/vendor/DataTables/Buttons-1.6.3/css/buttons.bootstrap4.min.css" type="text/css" rel="stylesheet" />
</head>
<body>
<!-- header -->
<?php include_once(__DIR__ . '/../../layouts/partials/header.php'); ?>
<!-- end header -->
...
<!-- footer -->
<?php include_once(__DIR__ . '/../../layouts/partials/footer.php'); ?>
<!-- end footer -->
<?php include_once(__DIR__ . '/../../layouts/scripts.php'); ?>
<!-- DataTable JS -->
<script src="/duanweb-CP20SCF04/assets/vendor/DataTables/datatables.min.js"></script>
</body>
</html>
- Viết code áp dụng DataTables vào danh sách của bạn.
- Lưu ý: cần viết theo đúng chuẩn của Table HTML, phải có thẻ
thead, tbody
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Danh sách Hình thức thanh toán</title>
<?php include_once(__DIR__ . '/../../layouts/styles.php'); ?>
<!-- DataTable CSS -->
<link href="/duanweb-CP20SCF04/assets/vendor/DataTables/datatables.css" type="text/css" rel="stylesheet" />
</head>
<body>
<!-- header -->
<?php include_once(__DIR__ . '/../../layouts/partials/header.php'); ?>
<!-- end header -->
<div class="container">
<div class="row">
<div class="col-md-4">
<!-- sidebar -->
<?php include_once(__DIR__ . '/../../layouts/partials/sidebar.php'); ?>
<!-- end sidebar -->
</div>
<div class="col-md-8">
<h1>Danh sách Sản phẩm</h1>
...
<a href="create.php" class="btn btn-primary">Thêm mới</a>
<table id="tblDanhsach" class="table table-bordered">
<thead>
<tr>
<th>Mã sản phẩm</th>
<th>Tên sản phẩm</th>
<th>Giá sản phẩm</th>
<th>Loại sản phẩm</th>
<th>Nhà sản xuất</th>
<th>Khuyến mãi</th>
<th>hành động</th>
</tr>
</thead>
<tbody>
<?php foreach($data as $sp): ?>
<tr>
<td><?php echo $sp['sp_ma'] ?></td>
<td><?= $sp['sp_ten'] ?></td>
<td><?= $sp['sp_gia'] ?></td>
<td><?= $sp['lsp_ten'] ?></td>
<td><?= $sp['nsx_ten'] ?></td>
<td><?= $sp['km_tomtat'] ?></td>
<td>
<a href="edit.php?sp_ma=<?php echo $sp['sp_ma'] ?>" class="btn btn-success">Sửa</a>
<a href="delete.php?sp_ma=<?php echo $sp['sp_ma'] ?>" class="btn btn-danger">Xóa</a>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
</div>
</div>
<!-- footer -->
<?php include_once(__DIR__ . '/../../layouts/partials/footer.php'); ?>
<!-- end footer -->
<?php include_once(__DIR__ . '/../../layouts/scripts.php'); ?>
<!-- DataTable JS -->
<script src="/duanweb-CP20SCF04/assets/vendor/DataTables/datatables.min.js"></script>
<script src="/duanweb-CP20SCF04/assets/vendor/DataTables/Buttons-1.6.3/js/buttons.bootstrap4.min.js"></script>
<script src="/duanweb-CP20SCF04/assets/vendor/DataTables/pdfmake-0.1.36/pdfmake.min.js"></script>
<script src="/duanweb-CP20SCF04/assets/vendor/DataTables/pdfmake-0.1.36/vfs_fonts.js"></script>
<script>
$('#tblDanhsach').DataTable({
dom: 'Blfrtip',
buttons: [
'copy', 'excel', 'pdf'
]
});
</script>
</body>
</html>
Step 3: tạo chức năng create dùng để hiển thị FORM thêm mới Sản phẩm
- Tạo file
/backend/functions/sanpham/create.php để xử lý logic/nghiệp vụ
- Workflow của chức năng này:
- Cần phải
SELECT dữ liệu của các table cha liên quan (loaisanpham, nhasanxuat, khuyenmai)
- Trình diễn các table cha này bằng
SELECT OPTION trong HTML
- Nội dung file:
<!-- Nhúng file cấu hình để xác định được Tên và Tiêu đề của trang hiện tại người dùng đang truy cập -->
<?php include_once(__DIR__ . '/../../layouts/config.php'); ?>
<!DOCTYPE html>
<html>
<head>
<!-- Nhúng file quản lý phần HEAD -->
<?php include_once(__DIR__ . '/../../layouts/head.php'); ?>
</head>
<body class="d-flex flex-column h-100">
<!-- header -->
<?php include_once(__DIR__ . '/../../layouts/partials/header.php'); ?>
<!-- end header -->
<div class="container-fluid">
<div class="row">
<!-- sidebar -->
<?php include_once(__DIR__ . '/../../layouts/partials/sidebar.php'); ?>
<!-- end sidebar -->
<main role="main" class="col-md-10 ml-sm-auto px-4 mb-2">
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
<h1 class="h2">Thêm mới</h1>
</div>
<!-- Block content -->
<?php
// Truy vấn database
// 1. Include file cấu hình kết nối đến database, khởi tạo kết nối $conn
include_once(__DIR__ . '/../../../dbconnect.php');
/* ---
--- 2.Truy vấn dữ liệu Loại sản phẩm
---
*/
// Chuẩn bị câu truy vấn Loại sản phẩm
$sqlLoaiSanPham = "select * from `loaisanpham`";
// Thực thi câu truy vấn SQL để lấy về dữ liệu
$resultLoaiSanPham = mysqli_query($conn, $sqlLoaiSanPham);
// Khi thực thi các truy vấn dạng SELECT, dữ liệu lấy về cần phải phân tích để sử dụng
// Thông thường, chúng ta sẽ sử dụng vòng lặp while để duyệt danh sách các dòng dữ liệu được SELECT
// Ta sẽ tạo 1 mảng array để chứa các dữ liệu được trả về
$dataLoaiSanPham = [];
while ($rowLoaiSanPham = mysqli_fetch_array($resultLoaiSanPham, MYSQLI_ASSOC)) {
$dataLoaiSanPham[] = array(
'lsp_ma' => $rowLoaiSanPham['lsp_ma'],
'lsp_ten' => $rowLoaiSanPham['lsp_ten'],
'lsp_mota' => $rowLoaiSanPham['lsp_mota'],
);
}
/* --- End Truy vấn dữ liệu Loại sản phẩm --- */
/* ---
--- 3. Truy vấn dữ liệu Nhà sản xuất
---
*/
// Chuẩn bị câu truy vấn Nhà sản xuất
$sqlNhaSanXuat = "select * from `nhasanxuat`";
// Thực thi câu truy vấn SQL để lấy về dữ liệu
$resultNhaSanXuat = mysqli_query($conn, $sqlNhaSanXuat);
// Khi thực thi các truy vấn dạng SELECT, dữ liệu lấy về cần phải phân tích để sử dụng
// Thông thường, chúng ta sẽ sử dụng vòng lặp while để duyệt danh sách các dòng dữ liệu được SELECT
// Ta sẽ tạo 1 mảng array để chứa các dữ liệu được trả về
$dataNhaSanXuat = [];
while ($rowNhaSanXuat = mysqli_fetch_array($resultNhaSanXuat, MYSQLI_ASSOC)) {
$dataNhaSanXuat[] = array(
'nsx_ma' => $rowNhaSanXuat['nsx_ma'],
'nsx_ten' => $rowNhaSanXuat['nsx_ten'],
);
}
/* --- End Truy vấn dữ liệu Nhà sản xuất --- */
/* ---
--- 4. Truy vấn dữ liệu Khuyến mãi
---
*/
// Chuẩn bị câu truy vấn Khuyến mãi
$sqlKhuyenMai = "select * from `khuyenmai`";
// Thực thi câu truy vấn SQL để lấy về dữ liệu
$resultKhuyenMai = mysqli_query($conn, $sqlKhuyenMai);
// Khi thực thi các truy vấn dạng SELECT, dữ liệu lấy về cần phải phân tích để sử dụng
// Thông thường, chúng ta sẽ sử dụng vòng lặp while để duyệt danh sách các dòng dữ liệu được SELECT
// Ta sẽ tạo 1 mảng array để chứa các dữ liệu được trả về
$dataKhuyenMai = [];
while ($rowKhuyenMai = mysqli_fetch_array($resultKhuyenMai, MYSQLI_ASSOC)) {
$km_tomtat = '';
if (!empty($rowKhuyenMai['km_ten'])) {
// Sử dụng hàm sprintf() để chuẩn bị mẫu câu với các giá trị truyền vào tương ứng từng vị trí placeholder
$km_tomtat = sprintf(
"Khuyến mãi %s, nội dung: %s, thời gian: %s-%s",
$rowKhuyenMai['km_ten'],
$rowKhuyenMai['km_noidung'],
// Sử dụng hàm date($format, $timestamp) để chuyển đổi ngày thành định dạng Việt Nam (ngày/tháng/năm)
// Do hàm date() nhận vào là đối tượng thời gian, chúng ta cần sử dụng hàm strtotime() để chuyển đổi từ chuỗi có định dạng 'yyyy-mm-dd' trong MYSQL thành đối tượng ngày tháng
date('d/m/Y', strtotime($rowKhuyenMai['km_tungay'])), //vd: '2019-04-25'
date('d/m/Y', strtotime($rowKhuyenMai['km_denngay']))
); //vd: '2019-05-10'
}
$dataKhuyenMai[] = array(
'km_ma' => $rowKhuyenMai['km_ma'],
'km_tomtat' => $km_tomtat,
);
}
/* --- End Truy vấn dữ liệu Khuyến mãi --- */
?>
<form name="frmsanpham" id="frmsanpham" method="post" action="">
<div class="form-group">
<label for="sp_ten">Tên Sản phẩm</label>
<input type="text" class="form-control" id="sp_ten" name="sp_ten" placeholder="Tên Sản phẩm" value="">
</div>
<div class="form-group">
<label for="sp_gia">Giá Sản phẩm</label>
<input type="text" class="form-control" id="sp_gia" name="sp_gia" placeholder="Giá Sản phẩm" value="">
</div>
<div class="form-group">
<label for="sp_giacu">Giá cũ Sản phẩm</label>
<input type="text" class="form-control" id="sp_giacu" name="sp_giacu" placeholder="Giá cũ Sản phẩm" value="">
</div>
<div class="form-group">
<label for="sp_mota_ngan">Mô tả ngắn</label>
<input type="text" class="form-control" id="sp_mota_ngan" name="sp_mota_ngan" placeholder="Mô tả ngắn Sản phẩm" value="">
</div>
<div class="form-group">
<label for="sp_mota_chitiet">Mô tả chi tiết</label>
<input type="text" class="form-control" id="sp_mota_chitiet" name="sp_mota_chitiet" placeholder="Mô tả chi tiết Sản phẩm" value="">
</div>
<div class="form-group">
<label for="sp_ngaycapnhat">Ngày cập nhật</label>
<input type="text" class="form-control" id="sp_ngaycapnhat" name="sp_ngaycapnhat" placeholder="Ngày cập nhật Sản phẩm" value="">
</div>
<div class="form-group">
<label for="sp_soluong">Số lượng</label>
<input type="text" class="form-control" id="sp_soluong" name="sp_soluong" placeholder="Số lượng Sản phẩm" value="">
</div>
<div class="form-group">
<label for="lsp_ma">Loại sản phẩm</label>
<select class="form-control" id="lsp_ma" name="lsp_ma">
<?php foreach ($dataLoaiSanPham as $loaisanpham) : ?>
<option value="<?= $loaisanpham['lsp_ma'] ?>"><?= $loaisanpham['lsp_ten'] ?></option>
<?php endforeach; ?>
</select>
</div>
<div class="form-group">
<label for="nsx_ma">Nhà sản xuất</label>
<select class="form-control" id="nsx_ma" name="nsx_ma">
<?php foreach ($dataNhaSanXuat as $nhasanxuat) : ?>
<option value="<?= $nhasanxuat['nsx_ma'] ?>"><?= $nhasanxuat['nsx_ten'] ?></option>
<?php endforeach; ?>
</select>
</div>
<div class="form-group">
<label for="km_ma">Khuyến mãi</label>
<select class="form-control" id="km_ma" name="km_ma">
<option value="">Không áp dụng khuyến mãi</option>
<?php foreach ($dataKhuyenMai as $khuyenmai) : ?>
<option value="<?= $khuyenmai['km_ma'] ?>"><?= $khuyenmai['km_tomtat'] ?></option>
<?php endforeach; ?>
</select>
</div>
<button class="btn btn-primary" name="btnSave">Lưu dữ liệu</button>
</form>
<?php
// 2. Nếu người dùng có bấm nút Đăng ký thì thực thi câu lệnh UPDATE
if (isset($_POST['btnSave'])) {
// Lấy dữ liệu người dùng hiệu chỉnh gởi từ REQUEST POST
$ten = $_POST['sp_ten'];
$gia = $_POST['sp_gia'];
$giacu = $_POST['sp_giacu'];
$motangan = $_POST['sp_mota_ngan'];
$motachitiet = $_POST['sp_mota_chitiet'];
$ngaycapnhat = $_POST['sp_ngaycapnhat'];
$soluong = $_POST['sp_soluong'];
$lsp_ma = $_POST['lsp_ma'];
$nsx_ma = $_POST['nsx_ma'];
$km_ma = (empty($_POST['km_ma']) ? 'NULL' : $_POST['km_ma']);
// Câu lệnh INSERT
$sql = "INSERT INTO `sanpham` (sp_ten, sp_gia, sp_giacu, sp_mota_ngan, sp_mota_chitiet, sp_ngaycapnhat, sp_soluong, lsp_ma, nsx_ma, km_ma) VALUES ('$ten', $gia, $giacu, '$motangan', '$motachitiet', '$ngaycapnhat', $soluong, $lsp_ma, $nsx_ma, $km_ma);";
// Thực thi INSERT
mysqli_query($conn, $sql);
// Đóng kết nối
mysqli_close($conn);
// Sau khi cập nhật dữ liệu, tự động điều hướng về trang Danh sách
echo "<script>location.href = 'index.php';</script>";
}
?>
<!-- End block content -->
</main>
</div>
</div>
<!-- footer -->
<?php include_once(__DIR__ . '/../../layouts/partials/footer.php'); ?>
<!-- end footer -->
<!-- Nhúng file quản lý phần SCRIPT JAVASCRIPT -->
<?php include_once(__DIR__ . '/../../layouts/scripts.php'); ?>
<!-- Các file Javascript sử dụng riêng cho trang này, liên kết tại đây -->
<!-- <script src="..."></script> -->
</body>
</html>
Step 4: tạo chức năng edit dùng để hiển thị FORM hiệu chỉnh Sản phẩm
- Tạo file
/backend/functions/sanpham/edit.php để xử lý logic/nghiệp vụ
- Workflow của chức năng này:
- Cần phải
SELECT dữ liệu của các table cha liên quan (loaisanpham, nhasanxuat, khuyenmai)
- Trình diễn các table cha này bằng
SELECT OPTION trong HTML
- Cần phải
SELECT dữ liệu của dòng cần hiệu chỉnh (dựa theo ID)
- Lắp đầy các trường
field/control trong FORM bằng dữ liệu cũ
- Nội dung file:
<!-- Nhúng file cấu hình để xác định được Tên và Tiêu đề của trang hiện tại người dùng đang truy cập -->
<?php include_once(__DIR__ . '/../../layouts/config.php'); ?>
<!DOCTYPE html>
<html>
<head>
<!-- Nhúng file quản lý phần HEAD -->
<?php include_once(__DIR__ . '/../../layouts/head.php'); ?>
</head>
<body class="d-flex flex-column h-100">
<!-- header -->
<?php include_once(__DIR__ . '/../../layouts/partials/header.php'); ?>
<!-- end header -->
<div class="container-fluid">
<div class="row">
<!-- sidebar -->
<?php include_once(__DIR__ . '/../../layouts/partials/sidebar.php'); ?>
<!-- end sidebar -->
<main role="main" class="col-md-10 ml-sm-auto px-4 mb-2">
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
<h1 class="h2">Hiệu chỉnh</h1>
</div>
<!-- Block content -->
<?php
// Truy vấn database
// 1. Include file cấu hình kết nối đến database, khởi tạo kết nối $conn
include_once(__DIR__ . '/../../../dbconnect.php');
/* ---
--- 2.Truy vấn dữ liệu Loại sản phẩm
---
*/
// Chuẩn bị câu truy vấn Loại sản phẩm
$sqlLoaiSanPham = "select * from `loaisanpham`";
// Thực thi câu truy vấn SQL để lấy về dữ liệu
$resultLoaiSanPham = mysqli_query($conn, $sqlLoaiSanPham);
// Khi thực thi các truy vấn dạng SELECT, dữ liệu lấy về cần phải phân tích để sử dụng
// Thông thường, chúng ta sẽ sử dụng vòng lặp while để duyệt danh sách các dòng dữ liệu được SELECT
// Ta sẽ tạo 1 mảng array để chứa các dữ liệu được trả về
$dataLoaiSanPham = [];
while ($rowLoaiSanPham = mysqli_fetch_array($resultLoaiSanPham, MYSQLI_ASSOC)) {
$dataLoaiSanPham[] = array(
'lsp_ma' => $rowLoaiSanPham['lsp_ma'],
'lsp_ten' => $rowLoaiSanPham['lsp_ten'],
'lsp_mota' => $rowLoaiSanPham['lsp_mota'],
);
}
/* --- End Truy vấn dữ liệu Loại sản phẩm --- */
/* ---
--- 3. Truy vấn dữ liệu Nhà sản xuất
---
*/
// Chuẩn bị câu truy vấn Nhà sản xuất
$sqlNhaSanXuat = "select * from `nhasanxuat`";
// Thực thi câu truy vấn SQL để lấy về dữ liệu
$resultNhaSanXuat = mysqli_query($conn, $sqlNhaSanXuat);
// Khi thực thi các truy vấn dạng SELECT, dữ liệu lấy về cần phải phân tích để sử dụng
// Thông thường, chúng ta sẽ sử dụng vòng lặp while để duyệt danh sách các dòng dữ liệu được SELECT
// Ta sẽ tạo 1 mảng array để chứa các dữ liệu được trả về
$dataNhaSanXuat = [];
while ($rowNhaSanXuat = mysqli_fetch_array($resultNhaSanXuat, MYSQLI_ASSOC)) {
$dataNhaSanXuat[] = array(
'nsx_ma' => $rowNhaSanXuat['nsx_ma'],
'nsx_ten' => $rowNhaSanXuat['nsx_ten'],
);
}
/* --- End Truy vấn dữ liệu Nhà sản xuất --- */
/* ---
--- 4. Truy vấn dữ liệu Khuyến mãi
---
*/
// Chuẩn bị câu truy vấn Khuyến mãi
$sqlKhuyenMai = "select * from `khuyenmai`";
// Thực thi câu truy vấn SQL để lấy về dữ liệu
$resultKhuyenMai = mysqli_query($conn, $sqlKhuyenMai);
// Khi thực thi các truy vấn dạng SELECT, dữ liệu lấy về cần phải phân tích để sử dụng
// Thông thường, chúng ta sẽ sử dụng vòng lặp while để duyệt danh sách các dòng dữ liệu được SELECT
// Ta sẽ tạo 1 mảng array để chứa các dữ liệu được trả về
$dataKhuyenMai = [];
while ($rowKhuyenMai = mysqli_fetch_array($resultKhuyenMai, MYSQLI_ASSOC)) {
$km_tomtat = '';
if (!empty($rowKhuyenMai['km_ten'])) {
// Sử dụng hàm sprintf() để chuẩn bị mẫu câu với các giá trị truyền vào tương ứng từng vị trí placeholder
$km_tomtat = sprintf(
"Khuyến mãi %s, nội dung: %s, thời gian: %s-%s",
$rowKhuyenMai['km_ten'],
$rowKhuyenMai['km_noidung'],
// Sử dụng hàm date($format, $timestamp) để chuyển đổi ngày thành định dạng Việt Nam (ngày/tháng/năm)
// Do hàm date() nhận vào là đối tượng thời gian, chúng ta cần sử dụng hàm strtotime() để chuyển đổi từ chuỗi có định dạng 'yyyy-mm-dd' trong MYSQL thành đối tượng ngày tháng
date('d/m/Y', strtotime($rowKhuyenMai['km_tungay'])), //vd: '2019-04-25'
date('d/m/Y', strtotime($rowKhuyenMai['km_denngay']))
); //vd: '2019-05-10'
}
$dataKhuyenMai[] = array(
'km_ma' => $rowKhuyenMai['km_ma'],
'km_tomtat' => $km_tomtat,
);
}
/* --- End Truy vấn dữ liệu Khuyến mãi --- */
/* ---
--- 5. Truy vấn dữ liệu Sản phẩm theo khóa chính
---
*/
// Chuẩn bị câu truy vấn $sqlSelect, lấy dữ liệu ban đầu của record cần update
// Lấy giá trị khóa chính được truyền theo dạng QueryString Parameter key1=value1&key2=value2...
$sp_ma = $_GET['sp_ma'];
$sqlSelect = "SELECT * FROM `sanpham` WHERE sp_ma=$sp_ma;";
// Thực thi câu truy vấn SQL để lấy về dữ liệu ban đầu của record cần update
$resultSelect = mysqli_query($conn, $sqlSelect);
$sanphamRow = mysqli_fetch_array($resultSelect, MYSQLI_ASSOC); // 1 record
/* --- End Truy vấn dữ liệu Sản phẩm theo khóa chính --- */
?>
<form name="frmsanpham" id="frmsanpham" method="post" action="edit.php?sp_ma=<?= $sanphamRow['sp_ma'] ?>">
<div class="form-group">
<label for="sp_ma">Mã Sản phẩm</label>
<input type="text" class="form-control" id="sp_ma" name="sp_ma" placeholder="Mã Sản phẩm" readonly value="<?= $sanphamRow['sp_ma'] ?>">
<small id="sp_maHelp" class="form-text text-muted">Mã Sản phẩm không được hiệu chỉnh.</small>
</div>
<div class="form-group">
<label for="sp_ten">Tên Sản phẩm</label>
<input type="text" class="form-control" id="sp_ten" name="sp_ten" placeholder="Tên Sản phẩm" value="<?= $sanphamRow['sp_ten'] ?>">
</div>
<div class="form-group">
<label for="sp_gia">Giá Sản phẩm</label>
<input type="text" class="form-control" id="sp_gia" name="sp_gia" placeholder="Giá Sản phẩm" value="<?= $sanphamRow['sp_gia'] ?>">
</div>
<div class="form-group">
<label for="sp_giacu">Giá cũ Sản phẩm</label>
<input type="text" class="form-control" id="sp_giacu" name="sp_giacu" placeholder="Giá cũ Sản phẩm" value="<?= $sanphamRow['sp_giacu'] ?>">
</div>
<div class="form-group">
<label for="sp_mota_ngan">Mô tả ngắn</label>
<input type="text" class="form-control" id="sp_mota_ngan" name="sp_mota_ngan" placeholder="Mô tả ngắn Sản phẩm" value="<?= $sanphamRow['sp_mota_ngan'] ?>">
</div>
<div class="form-group">
<label for="sp_mota_chitiet">Mô tả chi tiết</label>
<input type="text" class="form-control" id="sp_mota_chitiet" name="sp_mota_chitiet" placeholder="Mô tả chi tiết Sản phẩm" value="<?= $sanphamRow['sp_mota_chitiet'] ?>">
</div>
<div class="form-group">
<label for="sp_ngaycapnhat">Ngày cập nhật</label>
<input type="text" class="form-control" id="sp_ngaycapnhat" name="sp_ngaycapnhat" placeholder="Ngày cập nhật Sản phẩm" value="<?= $sanphamRow['sp_ngaycapnhat'] ?>">
</div>
<div class="form-group">
<label for="sp_soluong">Số lượng</label>
<input type="text" class="form-control" id="sp_soluong" name="sp_soluong" placeholder="Số lượng Sản phẩm" value="<?= $sanphamRow['sp_soluong'] ?>">
</div>
<div class="form-group">
<label for="lsp_ma">Loại sản phẩm</label>
<select class="form-control" id="lsp_ma" name="lsp_ma">
<?php foreach ($dataLoaiSanPham as $loaisanpham) : ?>
<?php if ($loaisanpham['lsp_ma'] == $sanphamRow['lsp_ma']) : ?>
<option value="<?= $loaisanpham['lsp_ma'] ?>" selected><?= $loaisanpham['lsp_ten'] ?></option>
<?php else : ?>
<option value="<?= $loaisanpham['lsp_ma'] ?>"><?= $loaisanpham['lsp_ten'] ?></option>
<?php endif; ?>
<?php endforeach; ?>
</select>
</div>
<div class="form-group">
<label for="nsx_ma">Nhà sản xuất</label>
<select class="form-control" id="nsx_ma" name="nsx_ma">
<?php foreach ($dataNhaSanXuat as $nhasanxuat) : ?>
<?php if ($nhasanxuat['nsx_ma'] == $sanphamRow['nsx_ma']) : ?>
<option value="<?= $nhasanxuat['nsx_ma'] ?>" selected><?= $nhasanxuat['nsx_ten'] ?></option>
<?php else : ?>
<option value="<?= $nhasanxuat['nsx_ma'] ?>"><?= $nhasanxuat['nsx_ten'] ?></option>
<?php endif; ?>
<?php endforeach; ?>
</select>
</div>
<div class="form-group">
<label for="km_ma">Khuyến mãi</label>
<select class="form-control" id="km_ma" name="km_ma">
<option value="">Không áp dụng khuyến mãi</option>
<?php foreach ($dataKhuyenMai as $khuyenmai) : ?>
<?php if ($khuyenmai['km_ma'] == $sanphamRow['km_ma']) : ?>
<option value="<?= $khuyenmai['km_ma'] ?>" selected><?= $khuyenmai['km_tomtat'] ?></option>
<?php else : ?>
<option value="<?= $khuyenmai['km_ma'] ?>"><?= $khuyenmai['km_tomtat'] ?></option>
<?php endif; ?>
<?php endforeach; ?>
</select>
</div>
<button class="btn btn-primary" name="btnSave">Cập nhật</button>
</form>
<?php
// 2. Nếu người dùng có bấm nút Đăng ký thì thực thi câu lệnh UPDATE
if (isset($_POST['btnSave'])) {
// Lấy dữ liệu người dùng hiệu chỉnh gởi từ REQUEST POST
$ten = $_POST['sp_ten'];
$gia = $_POST['sp_gia'];
$giacu = $_POST['sp_giacu'];
$motangan = $_POST['sp_mota_ngan'];
$motachitiet = $_POST['sp_mota_chitiet'];
$ngaycapnhat = $_POST['sp_ngaycapnhat'];
$soluong = $_POST['sp_soluong'];
$lsp_ma = $_POST['lsp_ma'];
$nsx_ma = $_POST['nsx_ma'];
$km_ma = empty($_POST['km_ma']) ? 'NULL' : $_POST['km_ma'];
// Câu lệnh INSERT
$sql = "UPDATE `sanpham` SET sp_ten='$ten', sp_gia=$gia, sp_giacu=$giacu, sp_mota_ngan='$motangan', sp_mota_chitiet='$motachitiet', sp_ngaycapnhat='$ngaycapnhat', sp_soluong=$soluong, lsp_ma=$lsp_ma, nsx_ma=$nsx_ma, km_ma=$km_ma WHERE sp_ma=$sp_ma;";
// Thực thi INSERT
mysqli_query($conn, $sql);
// Đóng kết nối
mysqli_close($conn);
// Sau khi cập nhật dữ liệu, tự động điều hướng về trang Danh sách
echo "<script>location.href = 'index.php';</script>";
}
?>
<!-- End block content -->
</main>
</div>
</div>
<!-- footer -->
<?php include_once(__DIR__ . '/../../layouts/partials/footer.php'); ?>
<!-- end footer -->
<!-- Nhúng file quản lý phần SCRIPT JAVASCRIPT -->
<?php include_once(__DIR__ . '/../../layouts/scripts.php'); ?>
<!-- Các file Javascript sử dụng riêng cho trang này, liên kết tại đây -->
<!-- <script src="..."></script> -->
</body>
</html>
Step 5: tạo chức năng delete dùng để xóa Sản phẩm
- Tạo file
/backend/functions/sanpham/delete.php để xử lý logic/nghiệp vụ
- Workflow của chức năng này:
- Cần lấy
Id theo Request GET được truyền tới từ chức năng Danh sách (index)
- Thực thi câu lệnh
DELETE để xóa dữ liệu
- Nội dung file:
<?php
// Truy vấn database
// 1. Include file cấu hình kết nối đến database, khởi tạo kết nối $conn
include_once(__DIR__.'/../../../dbconnect.php');
// 2. Chuẩn bị câu truy vấn $sql
// Lấy giá trị khóa chính được truyền theo dạng QueryString Parameter key1=value1&key2=value2...
$sp_ma = $_GET['sp_ma'];
$sql = "DELETE FROM `sanpham` WHERE sp_ma=" . $sp_ma;
// 3. Thực thi câu lệnh DELETE
$result = mysqli_query($conn, $sql);
// 4. Đóng kết nối
mysqli_close($conn);
// Sau khi cập nhật dữ liệu, tự động điều hướng về trang Danh sách
header('location:index.php');
Step 5.2: bổ sung popup cảnh báo khi xóa, sử dụng thư viện SweetAlert
- Download thư viện: https://sweetalert.js.org/guides/
- Copy vào thư mục:
/assets/vendor/sweetalert/sweetalert.min.js
- Liên kết Thư viện JS trong chức năng Danh sách. Hiệu chỉnh file
/backend/functions/sanpham/index.php
<!-- SweetAlert -->
<script src="/duanweb-CP20SCF04/assets/vendor/sweetalert/sweetalert.min.js"></script>
Step 5.2: xử lý cảnh báo khi xóa
- Đặt các nút xóa áp dụng chung 1 định dạng class, ví dụ
.btnDelete
- Bổ sung thuộc tính
custom attribute HTML tên là data-sp_ma="gia tri..."
- Đăng ký sự kiện click cho các nút xóa đang áp dụng class
.btnDelete
- Sử dụng SweetAlert để hiển thị popup cảnh báo
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Danh sách Hình thức thanh toán</title>
<?php include_once(__DIR__ . '/../../layouts/styles.php'); ?>
<!-- DataTable CSS -->
<link href="/duanweb-CP20SCF04/assets/vendor/DataTables/datatables.css" type="text/css" rel="stylesheet" />
<link href="/duanweb-CP20SCF04/assets/vendor/DataTables/Buttons-1.6.3/css/buttons.bootstrap4.min.css" type="text/css" rel="stylesheet" />
</head>
<body>
<!-- header -->
<?php include_once(__DIR__ . '/../../layouts/partials/header.php'); ?>
<!-- end header -->
<div class="container-fluid">
<div class="row">
<div class="col-md-4">
<!-- sidebar -->
<?php include_once(__DIR__ . '/../../layouts/partials/sidebar.php'); ?>
<!-- end sidebar -->
</div>
<div class="col-md-8">
<h1>Danh sách Sản phẩm</h1>
<?php
// Truy vấn database để lấy danh sách
// 1. Include file cấu hình kết nối đến database, khởi tạo kết nối $conn
// C:\xampp\htdocs\web02\
include_once(__DIR__ . '/../../../dbconnect.php');
// 2. Chuẩn bị QUERY
// HERE DOC
$sql = <<<EOT
SELECT sp.*
, lsp.lsp_ten
, nsx.nsx_ten
, km.km_ten, km.km_noidung, km.km_tungay, km.km_denngay
FROM `sanpham` sp
JOIN `loaisanpham` lsp ON sp.lsp_ma = lsp.lsp_ma
JOIN `nhasanxuat` nsx ON sp.nsx_ma = nsx.nsx_ma
LEFT JOIN `khuyenmai` km ON sp.km_ma = km.km_ma
ORDER BY sp.sp_ma DESC
EOT;
// 3. Yêu cầu PHP thực thi QUERY
$result = mysqli_query($conn, $sql);
// 4. Khi thực thi các truy vấn dạng SELECT, dữ liệu lấy về cần phải phân tích để sử dụng
// Thông thường, chúng ta sẽ sử dụng vòng lặp while để duyệt danh sách các dòng dữ liệu được SELECT
// Ta sẽ tạo 1 mảng array để chứa các dữ liệu được trả về
$data = [];
while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
$km_ten = $row['km_ten'];
$km_noidung = $row['km_noidung'];
// Sử dụng hàm date($format, $timestamp) để chuyển đổi ngày thành định dạng Việt Nam (ngày/tháng/năm)
// Do hàm date() nhận vào là đối tượng thời gian, chúng ta cần sử dụng hàm strtotime()
// để chuyển đổi từ chuỗi có định dạng 'yyyy-mm-dd' trong MYSQL thành đối tượng ngày tháng
$km_tungay = date('d/m/Y', strtotime($row['km_tungay'])); //vd: '2019-04-25'
$km_denngay = date('d/m/Y', strtotime($row['km_denngay'])); //vd: '2019-04-25'
$km_tomtat = '';
if( !empty($km_ten) ) {
$km_tomtat = sprintf("Khuyến mãi %s, nội dung: %s, thời gian: %s - %s",
$km_ten,
$km_noidung,
$km_tungay,
$km_denngay);
}
$data[] = array(
'sp_ma' => $row['sp_ma'],
'sp_ten' => $row['sp_ten'],
// Sử dụng hàm number_format(số tiền, số lẻ thập phân, dấu phân cách số lẻ, dấu phân cách hàng nghìn)
// để định dạng số khi hiển thị trên giao diện.
// Vd: 15800000 -> format thành 15,800,000.66 vnđ
'sp_gia' => number_format($row['sp_gia'], 0, ".", ",") . ' vnđ',
'lsp_ten' => $row['lsp_ten'],
'nsx_ten' => $row['nsx_ten'],
'km_tomtat' => $km_tomtat
);
}
// print_r($data);
?>
<a href="create.php" class="btn btn-primary">Thêm mới</a>
<table id="tblDanhsach" class="table table-bordered">
<thead>
<tr>
<th>Mã sản phẩm</th>
<th>Tên sản phẩm</th>
<th>Giá sản phẩm</th>
<th>Loại sản phẩm</th>
<th>Nhà sản xuất</th>
<th>Khuyến mãi</th>
<th>hành động</th>
</tr>
</thead>
<tbody>
<?php foreach($data as $sp): ?>
<tr>
<td><?php echo $sp['sp_ma'] ?></td>
<td><?= $sp['sp_ten'] ?></td>
<td><?= $sp['sp_gia'] ?></td>
<td><?= $sp['lsp_ten'] ?></td>
<td><?= $sp['nsx_ten'] ?></td>
<td><?= $sp['km_tomtat'] ?></td>
<td>
<a href="edit.php?sp_ma=<?php echo $sp['sp_ma'] ?>" class="btn btn-success">Sửa</a>
<button class="btn btn-danger btnDelete" data-sp_ma="<?= $sp['sp_ma'] ?>">Xóa</button>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
</div>
</div>
<!-- footer -->
<?php include_once(__DIR__ . '/../../layouts/partials/footer.php'); ?>
<!-- end footer -->
<?php include_once(__DIR__ . '/../../layouts/scripts.php'); ?>
<!-- DataTable JS -->
<script src="/duanweb-CP20SCF04/assets/vendor/DataTables/datatables.min.js"></script>
<script src="/duanweb-CP20SCF04/assets/vendor/DataTables/Buttons-1.6.3/js/buttons.bootstrap4.min.js"></script>
<script src="/duanweb-CP20SCF04/assets/vendor/DataTables/pdfmake-0.1.36/pdfmake.min.js"></script>
<script src="/duanweb-CP20SCF04/assets/vendor/DataTables/pdfmake-0.1.36/vfs_fonts.js"></script>
<!-- SweetAlert -->
<script src="/duanweb-CP20SCF04/assets/vendor/sweetalert/sweetalert.min.js"></script>
<script>
$(document).ready(function() {
// xử lý table danh sách
$('#tblDanhsach').DataTable({
dom: 'Blfrtip',
buttons: [
'copy', 'excel', 'pdf'
]
});
// Cảnh báo khi xóa
// 1. Đăng ký sự kiện click cho các phần tử (element) đang áp dụng class .btnDelete
$('.btnDelete').click(function() {
// Click hanlder
// Hiện cảnh báo khi bấm nút xóa
swal({
title: "Bạn có chắc chắn muốn xóa?",
text: "Một khi đã xóa, không thể phục hồi....",
icon: "warning",
buttons: true,
dangerMode: true,
})
.then((willDelete) => {
debugger;
if (willDelete) { // Nếu đồng ý xóa
// 2. Lấy giá trị của thuộc tính (custom attribute HTML) 'sp_ma'
// var sp_ma = $(this).attr('data-sp_ma');
var sp_ma = $(this).data('sp_ma');
var url = "delete.php?sp_ma=" + sp_ma;
// Điều hướng qua trang xóa với REQUEST GET, có tham số sp_ma=...
location.href = url;
} else {
swal("Cẩn thận hơn nhé!");
}
});
});
});
</script>
</body>
</html>
Step 6: bổ sung menu chức năng Quản lý Sản phẩm bên sidebar
- Hiệu chỉnh file
/backend/layouts/partials/sidebar.php
- Nội dung file:
<nav class="col-md-2 d-none d-md-block sidebar">
<div class="sidebar-sticky">
<ul class="nav flex-column">
<!-- #################### Menu các trang Quản lý #################### -->
<li class="nav-item sidebar-heading"><span>Quản lý</span></li>
<li class="nav-item">
<a href="/backend/pages/dashboard.php">Bảng tin <span class="sr-only">(current)</span></a>
</li>
<hr style="border: 1px solid red; width: 80%;" />
<!-- #################### End Menu các trang Quản lý #################### -->
<!-- #################### Menu chức năng Danh mục #################### -->
<li class="nav-item sidebar-heading">
<span>Danh mục</span>
</li>
<!-- Menu Loại sản phẩm -->
<li class="nav-item">
<a href="#loaisanphamSubMenu" data-toggle="collapse" aria-expanded="false" class="dropdown-toggle">
Loại sản phẩm
</a>
<ul class="collapse" id="loaisanphamSubMenu">
<li class="nav-item">
<a href="/backend/functions/loaisanpham/index.php">Danh sách</a>
</li>
<li class="nav-item">
<a href="/backend/functions/loaisanpham/create.php">Thêm mới</a>
</li>
</ul>
</li>
<!-- End Loại sản phẩm -->
<!-- Menu Sản phẩm -->
<li class="nav-item">
<a href="#sanphamSubMenu" data-toggle="collapse" aria-expanded="false" class="dropdown-toggle">
Sản phẩm
</a>
<ul class="collapse" id="sanphamSubMenu">
<li class="nav-item">
<a href="/backend/functions/sanpham/index.php">Danh sách</a>
</li>
<li class="nav-item">
<a href="/backend/functions/sanpham/create.php">Thêm mới</a>
</li>
</ul>
</li>
<!-- End Sản phẩm -->
<!-- #################### End Menu chức năng Danh mục #################### -->
</ul>
</div>
</nav>
|