Hugging Face's logo

Spaces:
Anonymous-EmpathyAI
/
Empathy-Label
Running

App Files Community
Empathy-Label
File size: 4,712 Bytes
a73045d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <title>Admin — ESConv Annotation</title>
  <link rel="preconnect" href="https://fonts.googleapis.com"/>
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin/>
  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet"/>
  <link rel="stylesheet" href="/static/style.css"/>
  <link rel="stylesheet" href="/static/admin.css"/>
</head>
<body>
  <!-- Header -->
  <header class="header">
    <div class="header-inner">
      <div class="header-logo">
        <div class="logo-icon">
          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <path d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
          </svg>
        </div>
        <div>
          <h1>Admin Dashboard</h1>
          <p>Manage files, users & assignments</p>
        </div>
      </div>
      <div class="header-controls">
        <span class="user-badge" id="userBadge">admin</span>
        <button class="logout-btn" id="logoutBtn">
          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <path d="M9 21H5a2 2 0 01-2-2V5a2 2 0 012-2h4M16 17l5-5-5-5M21 12H9"/>
          </svg>
          Logout
        </button>
      </div>
    </div>
  </header>

  <main class="admin-main">
    <!-- Tab Navigation -->
    <div class="tab-nav">
      <button class="tab-btn active" data-tab="files">📁 CSV Files</button>
      <button class="tab-btn" data-tab="users">👥 Users</button>
      <button class="tab-btn" data-tab="assignments">📋 Assignments</button>
    </div>

    <!-- Files Tab -->
    <div class="tab-content active" id="tab-files">
      <div class="section-header">
        <h2>CSV Files</h2>
        <p>Files in <code id="csvFolderPath"></code></p>
      </div>
      <div class="card-grid" id="filesList"></div>
    </div>

    <!-- Users Tab -->
    <div class="tab-content" id="tab-users">
      <div class="section-header">
        <h2>Annotator Accounts</h2>
        <button class="primary-btn" id="addUserBtn">
          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <path d="M12 5v14M5 12h14"/>
          </svg>
          Add User
        </button>
      </div>
      <!-- Create User Form (hidden) -->
      <div class="create-form" id="createUserForm" style="display:none">
        <div class="form-row">
          <input type="text" id="newUsername" placeholder="Username"/>
          <input type="password" id="newPassword" placeholder="Password"/>
          <select id="newRole"><option value="annotator">Annotator</option><option value="admin">Admin</option></select>
          <button class="primary-btn" id="submitUserBtn">Create</button>
          <button class="ghost-btn" id="cancelUserBtn">Cancel</button>
        </div>
        <div class="form-error" id="userFormError"></div>
      </div>
      <div class="table-container">
        <table class="data-table" id="usersTable">
          <thead><tr><th>ID</th><th>Username</th><th>Role</th><th>Created</th><th>Actions</th></tr></thead>
          <tbody id="usersBody"></tbody>
        </table>
      </div>
    </div>

    <!-- Assignments Tab -->
    <div class="tab-content" id="tab-assignments">
      <div class="section-header">
        <h2>File Assignments</h2>
        <button class="primary-btn" id="addAssignBtn">
          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <path d="M12 5v14M5 12h14"/>
          </svg>
          Assign File
        </button>
      </div>
      <!-- Assign Form (hidden) -->
      <div class="create-form" id="createAssignForm" style="display:none">
        <div class="form-row">
          <select id="assignUser"><option value="">Select User...</option></select>
          <select id="assignFile"><option value="">Select File...</option></select>
          <button class="primary-btn" id="submitAssignBtn">Assign</button>
          <button class="ghost-btn" id="cancelAssignBtn">Cancel</button>
        </div>
        <div class="form-error" id="assignFormError"></div>
      </div>
      <div class="table-container">
        <table class="data-table" id="assignTable">
          <thead><tr><th>Annotator</th><th>File</th><th>Progress</th><th>Assigned</th><th>Actions</th></tr></thead>
          <tbody id="assignBody"></tbody>
        </table>
      </div>
    </div>
  </main>
  <script src="/static/admin.js"></script>
</body>
</html>