DungTT/ManagerAccount
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

sercurity

Browse Source
This commit is contained in:
Tran Tien Dung
2026-04-20 15:27:27 +07:00
parent 30e326f92a
commit 3b813a85da
2 changed files with 20 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
public/js/app.js
View File

@@ -456,6 +456,15 @@ class AccountManager {
}; };
} }
maskForeignAccountUsername(username) {
const value = String(username || '').trim();
if (!value) return '-';
if (value.length < 5) {
return `${value.slice(0, 1)}*****`;
}
return `${value.slice(0, 3)}*****`;
}
handleLogout() { handleLogout() {
if (confirm('Are you sure you want to logout?')) { if (confirm('Are you sure you want to logout?')) {
this.saveToStorage('currentUser', null); this.saveToStorage('currentUser', null);
@@ -586,7 +595,6 @@ class AccountManager {
<table class="w-full text-left border-collapse w-full"> <table class="w-full text-left border-collapse w-full">
<thead class="sticky top-0 z-10"> <thead class="sticky top-0 z-10">
<tr class="bg-slate-50 border-b border-slate-200"> <tr class="bg-slate-50 border-b border-slate-200">
<th class="px-4 py-2.5 text-[10px] font-bold uppercase tracking-wider text-slate-500">User</th>
<th class="px-4 py-2.5 text-[10px] font-bold uppercase tracking-wider text-slate-500">Owner</th> <th class="px-4 py-2.5 text-[10px] font-bold uppercase tracking-wider text-slate-500">Owner</th>
<th class="px-4 py-2.5 text-[10px] font-bold uppercase tracking-wider text-slate-500">Username</th> <th class="px-4 py-2.5 text-[10px] font-bold uppercase tracking-wider text-slate-500">Username</th>
<th class="px-4 py-2.5 text-[10px] font-bold uppercase tracking-wider text-slate-500">Service</th> <th class="px-4 py-2.5 text-[10px] font-bold uppercase tracking-wider text-slate-500">Service</th>
@@ -596,6 +604,10 @@ class AccountManager {
<tbody class="divide-y divide-slate-100 accounts-table-body"> <tbody class="divide-y divide-slate-100 accounts-table-body">
${pageInfo.data.map(acc => { ${pageInfo.data.map(acc => {
const isOwnAccount = acc.UserId == currentUserId; const isOwnAccount = acc.UserId == currentUserId;
const accountUsername = acc.AccountUsername || '-';
const displayAccountUsername = isOwnAccount
? accountUsername
: this.maskForeignAccountUsername(accountUsername);
const actionContent = isOwnAccount const actionContent = isOwnAccount
? `<button class="p-1.5 text-slate-400 transition-colors view-account hover:text-slate-600" data-account-id="${acc.AccountId}" title="View Details"> ? `<button class="p-1.5 text-slate-400 transition-colors view-account hover:text-slate-600" data-account-id="${acc.AccountId}" title="View Details">
<span class="material-symbols-outlined text-lg">info</span> <span class="material-symbols-outlined text-lg">info</span>
@@ -609,9 +621,8 @@ class AccountManager {
: '<span class="text-slate-400 text-xs">-</span>'; : '<span class="text-slate-400 text-xs">-</span>';
return ` return `
<tr class="hover:bg-slate-50/80 transition-colors group account-row" data-account-id="${acc.AccountId}" data-user-id="${acc.UserId}"> <tr class="hover:bg-slate-50/80 transition-colors group account-row" data-account-id="${acc.AccountId}" data-user-id="${acc.UserId}">
<td class="px-4 py-3 text-sm font-medium text-slate-900">${acc.Username || acc.FullName || '-'}</td>
<td class="px-4 py-3 text-sm text-slate-600">${acc.Email || '-'}</td> <td class="px-4 py-3 text-sm text-slate-600">${acc.Email || '-'}</td>
<td class="px-4 py-3 text-sm text-slate-600">${acc.AccountUsername || '-'}</td> <td class="px-4 py-3 text-sm text-slate-600">${displayAccountUsername}</td>
<td class="px-4 py-3 text-sm"> <td class="px-4 py-3 text-sm">
<span class="px-2 py-1 bg-blue-100 text-blue-700 rounded text-xs font-semibold">${acc.AppName || '-'}</span> <span class="px-2 py-1 bg-blue-100 text-blue-700 rounded text-xs font-semibold">${acc.AppName || '-'}</span>
</td> </td>
@@ -778,6 +789,10 @@ class AccountManager {
this.accountPage = pageInfo.current; this.accountPage = pageInfo.current;
tbody.innerHTML = pageInfo.data.map(acc => { tbody.innerHTML = pageInfo.data.map(acc => {
const isOwnAccount = acc.UserId == currentUserId; const isOwnAccount = acc.UserId == currentUserId;
const accountUsername = acc.AccountUsername || '-';
const displayAccountUsername = isOwnAccount
? accountUsername
: this.maskForeignAccountUsername(accountUsername);
const actionContent = isOwnAccount const actionContent = isOwnAccount
? `<button class="p-1.5 text-slate-400 transition-colors view-account hover:text-slate-600" data-account-id="${acc.AccountId}" title="View Details"> ? `<button class="p-1.5 text-slate-400 transition-colors view-account hover:text-slate-600" data-account-id="${acc.AccountId}" title="View Details">
<span class="material-symbols-outlined text-lg">info</span> <span class="material-symbols-outlined text-lg">info</span>
@@ -791,9 +806,8 @@ class AccountManager {
: '<span class="text-slate-400 text-xs">-</span>'; : '<span class="text-slate-400 text-xs">-</span>';
return ` return `
<tr class="hover:bg-slate-50/80 transition-colors group account-row" data-account-id="${acc.AccountId}" data-user-id="${acc.UserId}"> <tr class="hover:bg-slate-50/80 transition-colors group account-row" data-account-id="${acc.AccountId}" data-user-id="${acc.UserId}">
<td class="px-4 py-3 text-sm font-medium text-slate-900">${acc.Username || acc.FullName || '-'}</td>
<td class="px-4 py-3 text-sm text-slate-600">${acc.Email || '-'}</td> <td class="px-4 py-3 text-sm text-slate-600">${acc.Email || '-'}</td>
<td class="px-4 py-3 text-sm text-slate-600">${acc.AccountUsername || '-'}</td> <td class="px-4 py-3 text-sm text-slate-600">${displayAccountUsername}</td>
<td class="px-4 py-3 text-sm"> <td class="px-4 py-3 text-sm">
<span class="px-2 py-1 bg-blue-100 text-blue-700 rounded text-xs font-semibold">${acc.AppName || '-'}</span> <span class="px-2 py-1 bg-blue-100 text-blue-700 rounded text-xs font-semibold">${acc.AppName || '-'}</span>
</td> </td>

2
public/pages/login.html
View File

@@ -320,7 +320,7 @@
passwordInput.focus(); passwordInput.focus();
} }
} catch (error) { } catch (error) {
errorMessage.textContent = 'Connection error. Try admin / admin'; errorMessage.textContent = 'Connection error. Try again later.';
errorMessage.classList.remove('hidden'); errorMessage.classList.remove('hidden');
console.error('Login error:', error); console.error('Login error:', error);
} }