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-03 09:06:38 +07:00
parent e59785e06b
commit ee10a7e480
1 changed files with 24 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
public/js/app.js
View File

@@ -596,6 +596,17 @@ 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 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">
<span class="material-symbols-outlined text-lg">info</span>
</button>
<button class="p-1.5 text-slate-400 transition-colors edit-account hover:text-primary" data-account-id="${acc.AccountId}" title="Edit">
<span class="material-symbols-outlined text-lg">edit</span>
</button>
<button class="p-1.5 text-slate-400 transition-colors delete-account hover:text-error" data-account-id="${acc.AccountId}" title="Delete">
<span class="material-symbols-outlined text-lg">delete</span>
</button>`
: '<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 font-medium text-slate-900">${acc.Username || acc.FullName || '-'}</td>
@@ -605,15 +616,7 @@ class AccountManager {
<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>
<td class="px-4 py-3 text-right"> <td class="px-4 py-3 text-right">
<button class="p-1.5 text-slate-400 transition-colors view-account ${isOwnAccount ? 'hover:text-slate-600' : 'opacity-50 cursor-not-allowed'}" data-account-id="${acc.AccountId}" ${isOwnAccount ? '' : 'disabled'} title="${isOwnAccount ? 'View Details' : 'Can only view own accounts'}"> ${actionContent}
<span class="material-symbols-outlined text-lg">info</span>
</button>
<button class="p-1.5 text-slate-400 transition-colors edit-account ${isOwnAccount ? 'hover:text-primary' : 'opacity-50 cursor-not-allowed'}" data-account-id="${acc.AccountId}" ${isOwnAccount ? '' : 'disabled'} title="${isOwnAccount ? 'Edit' : 'Can only edit own accounts'}">
<span class="material-symbols-outlined text-lg">edit</span>
</button>
<button class="p-1.5 text-slate-400 transition-colors delete-account ${isOwnAccount ? 'hover:text-error' : 'opacity-50 cursor-not-allowed'}" data-account-id="${acc.AccountId}" ${isOwnAccount ? '' : 'disabled'} title="${isOwnAccount ? 'Delete' : 'Can only delete own accounts'}">
<span class="material-symbols-outlined text-lg">delete</span>
</button>
</td> </td>
</tr> </tr>
`; `;
@@ -775,6 +778,17 @@ 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 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">
<span class="material-symbols-outlined text-lg">info</span>
</button>
<button class="p-1.5 text-slate-400 transition-colors edit-account hover:text-primary" data-account-id="${acc.AccountId}" title="Edit">
<span class="material-symbols-outlined text-lg">edit</span>
</button>
<button class="p-1.5 text-slate-400 transition-colors delete-account hover:text-error" data-account-id="${acc.AccountId}" title="Delete">
<span class="material-symbols-outlined text-lg">delete</span>
</button>`
: '<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 font-medium text-slate-900">${acc.Username || acc.FullName || '-'}</td>
@@ -784,15 +798,7 @@ class AccountManager {
<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>
<td class="px-4 py-3 text-right"> <td class="px-4 py-3 text-right">
<button class="p-1.5 text-slate-400 transition-colors view-account ${isOwnAccount ? 'hover:text-slate-600' : 'opacity-50 cursor-not-allowed'}" data-account-id="${acc.AccountId}" ${isOwnAccount ? '' : 'disabled'} title="${isOwnAccount ? 'View Details' : 'Can only view own accounts'}"> ${actionContent}
<span class="material-symbols-outlined text-lg">info</span>
</button>
<button class="p-1.5 text-slate-400 transition-colors edit-account ${isOwnAccount ? 'hover:text-primary' : 'opacity-50 cursor-not-allowed'}" data-account-id="${acc.AccountId}" ${isOwnAccount ? '' : 'disabled'} title="${isOwnAccount ? 'Edit' : 'Can only edit own accounts'}">
<span class="material-symbols-outlined text-lg">edit</span>
</button>
<button class="p-1.5 text-slate-400 transition-colors delete-account ${isOwnAccount ? 'hover:text-error' : 'opacity-50 cursor-not-allowed'}" data-account-id="${acc.AccountId}" ${isOwnAccount ? '' : 'disabled'} title="${isOwnAccount ? 'Delete' : 'Can only delete own accounts'}">
<span class="material-symbols-outlined text-lg">delete</span>
</button>
</td> </td>
</tr> </tr>
`; `;