Ngày đăng: 2023-01-10 16:08:15
Bài trước, chúng ta đã hoàn thiện các chức năng của bài viết. Bài này, chúng ta xây dựng các chức năng của quản lý tài khoản.
1. Khái quát
Chức năng này dùng để quản lý tài khoản của các tác giả. Gồm có các chức năng sau:
- Thêm tài khoản
- Mở/khoá tài khoản
- Xoá tài khoản
Các bạn thắc mắc vì sao không có chức năng chỉnh sửa phải không? Theo mình các chức năng "nhạy cảm" như thế này thì khi nào tác giả quên mật khẩu, cứ liên hệ admin vào database mà lấy.
2. Lưu ý và chỉnh sửa
Ở trong bài 6, chúng ta đã tạo table accounts
, nên trong bài này chúng ta sẽ không cần tạo nữa.
Các bạn để ý bên phần sidebar mình thiếu mất một item của quản lý tài khoản, các bạn mở file admin/templates/sidebar.php
lên và chèn thêm đoạn code này tiếp tục ở dưới các item trong phần sidebar của admin:
< a class = "list-group-item" href = "' . $_DOMAIN . 'accounts" >
< span class = "glyphicon glyphicon-lock" ></ span > Tài khoản
</ a >
|
Reload lại các bạn sẽ được kết quả như thế này:
Tiếp theo các bạn mở file admin/includes/footer.php
lên và thêm đoạn code này tiếp bên dưới phần active item:
else if ( $tab == 'accounts' )
{
echo '<script>$(".sidebar ul a:eq(7)").addClass("active");</script>' ;
}
|
Sau đó, các bạn mở file admin/templates/content.php
và thêm cho mình điều kiện này tiếp bên dưới các điều kiện phân trang:
else if ( $tab == 'accounts' )
{
// Hiển thị template tài khoản
require_once 'templates/accounts.php' ;
}
|
Nếu load trang mà thấy lỗi thì đừng lo lắng nhé, do chúng ta chưa tạo file admin/templates/accounts.php
.
3. Phân trang tài khoản
Ở trong chức năng này, ta sẽ có hai trang:
- Trang hiển thị danh sách tài khoản (http://domain.com/admin/accounts)
- Trang thêm tài khoản (http://domain.com/admin/accounts/add)
Các bạn tạo cho mình file admin/templates/accounts.php
và dán nội dung này vào:
<?php
// Nếu đăng nhập
if ( $user )
{
// Nếu tài khoản là tác giả
if ( $data_user [ 'position' ] == 0)
{
echo '<div class="alert alert-danger">Bạn không có đủ quyền để vào trang này.</div>' ;
}
// Ngược lại tài khoản là admin
else if ( $data_user [ 'position' ] == 1)
{
echo '<h3>Tài khoản</h3>' ;
// Lấy tham số ac
if (isset( $_GET [ 'ac' ]))
{
$ac = trim( addslashes (htmlspecialchars( $_GET [ 'ac' ])));
}
else
{
$ac = '' ;
}
// Lấy tham số id
if (isset( $_GET [ 'id' ]))
{
$id = trim( addslashes (htmlspecialchars( $_GET [ 'id' ])));
}
else
{
$id = '' ;
}
// Nếu có tham số ac
if ( $ac != '' )
{
// Trang thêm tài khoản
if ( $ac == 'add' )
{
// Dãy nút của thêm tài khoản
echo
'
<a href= "' . $_DOMAIN . 'accounts" class = "btn btn-default" >
<span class = "glyphicon glyphicon-arrow-left" ></span> Trở về
</a>
';
// Content thêm tài khoản
}
}
// Ngược lại không có tham số ac
// Trang danh sách tài khoản
else
{
// Dãy nút của danh sách tài khoản
echo
'
<a href= "' . $_DOMAIN . 'accounts/add" class = "btn btn-default" >
<span class = "glyphicon glyphicon-plus" ></span> Thêm
</a>
<a href= "' . $_DOMAIN . 'accounts" class = "btn btn-default" >
<span class = "glyphicon glyphicon-repeat" ></span> Reload
</a>
<a class = "btn btn-warning" id= "lock_acc_list" >
<span class = "glyphicon glyphicon-lock" ></span> khoá
</a>
<a class = "btn btn-success" id= "unlock_acc_list" >
<span class = "glyphicon glyphicon-lock" ></span> Mở khoá
</a>
<a class = "btn btn-danger" id= "del_acc_list" >
<span class = "glyphicon glyphicon-trash" ></span> Xoá
</a>
';
// Content danh sách tài khoản
}
}
}
// Ngược lại chưa đăng nhập
else
{
new Redirect( $_DOMAIN ); // Trở về trang index
}
?>
|
4. Thêm tài khoản
Truy cập đường dẫn http://domain.com/admin/accounts/add để bắt đầu làm nhé!
Xây dựng template
Mở file admin/templates/accounts.php
và dán đoạn code này bên dưới dòng // Content thêm tài khoản
:
echo '
<p class = "form-add-acc" >
<form method= "POST" id= "formAddAcc" onsubmit= "return false;" >
<div class = "form-group" >
<label>Tên đăng nhập</label>
<input type= "text" class = "form-control title" id= "un_add_acc" >
</div>
<div class = "form-group" >
<label>Mật khẩu</label>
<input type= "password" class = "form-control title" id= "pw_add_acc" >
</div>
<div class = "form-group" >
<label>Nhập lại mật khẩu</label>
<input type= "password" class = "form-control title" id= "repw_add_acc" >
</div>
<div class = "form-group" >
<button type= "submit" class = "btn btn-primary" >Thêm</button>
</div>
<div class = "alert alert-danger hidden" ></div>
</form>
</p>
';
|
Viết Ajax gửi dữ liệu
Các bạn mở file admin/js/form.js
và chèn tiếp đoạn code này bên dưới:
// Thêm tài khoản
$( '#formAddAcc button' ).on( 'click' , function () {
$un_add_acc = $( '#un_add_acc' ).val();
$pw_add_acc = $( '#pw_add_acc' ).val();
$repw_add_acc = $( '#repw_add_acc' ).val();
if ($un_add_acc == '' || $pw_add_acc == '' || $repw_add_acc == '' )
{
$( '#formAddAcc .alert' ).removeClass( 'hidden' );
$( '#formAddAcc .alert' ).html( 'Vui lòng điền đầy đủ thông tin.' );
}
else
{
$.ajax({
url : $_DOMAIN + 'accounts.php' ,
type : 'POST' ,
data : {
un_add_acc: $un_add_acc,
pw_add_acc : $pw_add_acc,
repw_add_acc : $repw_add_acc,
action : 'add_acc'
}, success : function (data) {
$( '#formAddAcc .alert' ).html(data);
}, error : function () {
$( '#formAddAcc .alert' ).removeClass( 'hidden' );
$( '#formAddAcc .alert' ).html( 'Đã có lỗi xảy ra, hãy thử lại.' );
}
});
}
});
|
Viết PHP xử lý dữ liệu
Tạo cho mình file admin/accounts.php
và copy nội dung này vào:
<?php
// Kết nối database và thông tin chung
require_once 'core/init.php' ;
// Nếu đăng nhập
if ( $user )
{
// Nếu tồn tại POST action
if (isset( $_POST [ 'action' ]))
{
// Xử lý POST action
$action = trim( addslashes (htmlspecialchars( $_POST [ 'action' ])));
// Thêm tài khoản
if ( $action == 'add_acc' )
{
// Xử lý các giá trị
$un_add_acc = trim(htmlspecialchars( addslashes ( $_POST [ 'un_add_acc' ])));
$pw_add_acc = trim(htmlspecialchars( addslashes ( $_POST [ 'pw_add_acc' ])));
$repw_add_acc = trim(htmlspecialchars( addslashes ( $_POST [ 'repw_add_acc' ])));
// Các biến xử lý thông báo
$show_alert = '<script>$("#formAddAcc .alert").removeClass("hidden");</script>' ;
$hide_alert = '<script>$("#formAddAcc .alert").addClass("hidden");</script>' ;
$success = '<script>$("#formAddAcc .alert").attr("class", "alert alert-success");</script>' ;
// Kiểm tra tên đăng nhập
$sql_check_un_exist = "SELECT username FROM accounts WHERE username = '$un_add_acc'" ;
if ( $un_add_acc == '' || $pw_add_acc == '' || $repw_add_acc == '' ) {
echo $show_alert . 'Vui lòng điền đầy đủ thông tin.' ;
} else if ( strlen ( $un_add_acc ) < 6 || strlen ( $un_add_acc ) > 32) {
echo $show_alert . 'Tên đăng nhập nằm trong khoảng 6-32 ký tự.' ;
} else if (preg_match( '/\W/' , $un_add_acc )) {
echo $show_alert . 'Tên đăng nhập không chứa kí tự đậc biệt và khoảng trắng.' ;
} else if ( $db ->num_rows( $sql_check_un_exist )) {
echo $show_alert . 'Tên đăng nhập đã tồn tại.' ;
} else if ( strlen ( $pw_add_acc ) < 6) {
echo $show_alert . 'Mật khẩu quá ngắn.' ;
} else if ( $pw_add_acc != $repw_add_acc ) {
echo $show_alert . 'Mật khẩu nhập lại không khớp.' ;
} else {
$pw_add_acc = md5( $pw_add_acc );
$sql_add_acc = "INSERT INTO accounts VALUES (
'' ,
'$un_add_acc' ,
'$pw_add_acc' ,
'' ,
'' ,
'0' ,
'0' ,
'$date_current' ,
'' ,
'' ,
'' ,
'' ,
'' ,
''
)";
$db ->query( $sql_add_acc );
$db ->close();
echo $show_alert . $success . 'Thêm tài khoản thành công.' ;
new Redirect( $_DOMAIN . 'accounts' ); // Trở về trang danh sách tài khoản
}
}
// Mở tài khoản
// Khoá tài khoản
// Xoá tài khoản
}
else
{
new Redirect( $_DOMAIN ); // Trở về trang index
}
}
else
{
new Redirect( $_DOMAIN ); // Trở về trang index
}
|
5. Danh sách tài khoản
Các bạn mở file admin/templates/accounts.php
lên và chèn đoạn code này bên dưới dòng // Content danh sách tài khoản
:
$sql_get_list_acc = "SELECT * FROM accounts WHERE position = '1' ORDER BY id_acc DESC" ;
// Nếu có tài khoản
if ( $db ->num_rows( $sql_get_list_acc ))
{
echo
'
<br><br>
<div class = "table-responsive" >
<table class = "table table-striped list" id= "list_acc" >
<tr>
<td><input type= "checkbox" ></td>
<td><strong>ID</strong></td>
<td><strong>Tên đăng nhập</strong></td>
<td><strong>Trạng thái</strong></td>
<td><strong>Tools</strong></td>
</tr>
';
// In danh sách tài khoản
foreach ( $db ->fetch_assoc( $sql_get_list_acc , 0) as $key => $data_acc )
{
// Trạng thái tài khoản
if ( $data_acc [ 'status' ] == 0) {
$stt_acc = '<label class="label label-success">Hoạt động</label>' ;
} else if ( $data_acc [ 'status' ] == 1) {
$stt_acc = '<label class="label label-warning">Khoá</label>' ;
}
echo
'
<tr>
<td><input type= "checkbox" name= "id_acc[]" value= "' . $data_acc['id_acc'] .'" ></td>
<td> ' . $data_acc[' id_acc '] .' </td>
<td> ' . $data_acc[' username '] . ' </td>
<td> ' . $stt_acc . ' </td>
<td>
<a data-id= "' . $data_acc['id_acc'] . '" class = "btn btn-sm btn-warning lock-acc-list" >
<span class = "glyphicon glyphicon-lock" ></span>
</a>
<a data-id= "' . $data_acc['id_acc'] . '" class = "btn btn-sm btn-success unlock-acc-list" >
<span class = "glyphicon glyphicon-lock" ></span>
</a>
<a data-id= "' . $data_acc['id_acc'] . '" class = "btn btn-sm btn-danger del-acc-list" >
<span class = "glyphicon glyphicon-trash" ></span>
</a>
</td>
</tr>
';
}
echo
'
</table>
</div>
';
}
// Nếu không có tài khoản
else
{
echo '<br><br><div class="alert alert-info">Chưa có tài khoản nào.</div>' ;
}
|
Giờ các bạn chạy lại xem thành quả nhé!
6. Lời kết
Bài này chúng ta đã viết xong chức năng thêm tài khoản và hiển thị danh sách của chúng. Bài sau, chúng ta hoàn thành nốt các chức năng còn lại của tài khoản. Cảm ơn các bạn đã theo dõi, chúc các bạn thành công!