Shegsdev/Banka

View on GitHub
client/views/staff/users.html

Summary

Maintainability
Test Coverage
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Banka | Admin</title>
        <link rel="icon" type="image/x-icon" href="../../assets/img/logo.png">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" type="text/css" href="../../assets/css/main.css">
        <link rel="stylesheet" type="text/css" href="../../assets/css/responsive.css">
    </head>
    <body>
        <!-- Progress Bar -->
        <span class="progress-bar"></span>
        <div class="ad-modal">
            <button onclick="modalOpen(false)" class="modal-close">&times;</button>
            <div class="modal-content center"></div>
        </div>
        <nav id="ad-nav">
            <div id="logo">
                <a href="../../../index.html">
                    <img src="../../assets/img/logo.png" alt="logo">
                </a>
            </div>
            <div class="ad-nav-right">
                <img id="avatar"
                    onclick="openDropDown(true)" 
                    class="dropbtn"
                    src="../../assets/img/avatar.png" 
                />
                <!-- Dropdown content -->
                <div class="dropdown-content" id="dropdown">
                    <a href="#" onclick="event.preventDefault();return logout();">
                        <i class="fas fa-info-circle"></i>
                        Logout
                    </a>
                </div>
                <!-- Hamburger links -->
                <a href="#" onclick="event.preventDefault();openSlideMenu(this)">
                    <span class="open-slide">
                        <i class="fas fa-align-right fa-2x"></i>
                    </span>
                </a>
                <!-- Toast -->
                <div class="toast success">
                    <img src="../../assets/img/check-mark.gif" alt="check-mark">
                </div>
                <div class="toast error">
                    <img src="../../assets/img/cross-mark.jpg" alt="cross-mark">
                </div>

                <!-- Side nav -->
                <div id="side-menu" class="side-nav">
                    <li><a href="home.html">Dashboard</a></li>
                    <li><a href="users.html">Users</a></li>
                    <li><a href="accounts.html">Accounts</a></li>
                    <li class="accordion">
                        <a href="#">New transaction</a>
                        <i class="fa fa-caret-down right" style="margin-top:1em"></i>
                    </li>
                    <!-- Accordion content -->
                    <div class="panel">
                        <a href="credit.html">Credit</a>
                        <a href="debit.html">Debit</a>
                    </div>
                    <li onclick="event.preventDefault();return logout();"><a href="#">Logout</a></li>
                </div>
            </div>
        </nav>
        <div class="ad-main">
            <section>
                <aside>
                    <ul>
                        <a href="home.html">
                            <li>
                                <i class="fas fa-chart-line"></i>
                                Dashboard
                            </li>
                        </a>
                        <a href="users.html">
                            <li style="background: #076969">
                                <i class="fas fa-users"></i>
                                Users
                            </li>
                        </a>
                        <a href="accounts.html">
                            <li>
                                <i class="fas fa-folder"></i>
                                Accounts
                            </li>
                        </a>
                        <li class="accordion">
                            <i class="fa fa-history"></i>
                            New transaction
                            <i class="fas fa-caret-down right"></i>
                        </li>
                        <!-- Accordion content -->
                        <div class="panel">
                            <a href="credit.html">Credit</a>
                            <a href="debit.html">Debit</a>
                        </div>
                        <a href="#">
                            <li onclick="event.preventDefault();return logout();">
                                <i class="fas fa-info-circle"></i>
                                Logout
                            </li>
                        </a>
                    </ul>
                </aside>
            </section>

            <section class="ad-main-showcase">
                <div class="toast">
                <img src="../../assets/img/check-mark.gif" alt="check-mark">
                    <figcaption>Success!</figcaption>
            </div>
                <header><h3 class="header">Users</h3></header>
                <div class="ad-main-content">
                    <table>
                        <tbody>
                            <tr>
                                <th>S/No</th>
                                <th>First name</th>
                                <th>Last name</th>
                                <th>Email</th>
                            </tr>
                        </tbody>
                    </table>

                    <hr />
                    <br />
                    <div style="text-align:center">
                        <button class="button btn-transparent btn-wide">Load more</button>
                    </div>
                </div>
            </section>
        </div>

        <script src="../../assets/js/middleware.js"></script>
        <script>
            const handleSelectedUser = (id) => {
                sessionStorage.setItem('userId', id);
                location.assign(`${ghPagesUrlRedirect(location.origin)}/client/views/staff/user-single.html`);
            }
        </script>
        <script>
            document.addEventListener("DOMContentLoaded", () => {
                withAuth();
                const token = getAuthToken();
                const url = new URL(env.url());
                const config = {
                    headers: {
                        'Content-Type': 'application/json',
                        'x-access-token': token
                    }
                };

                // Get user type
                fetch(`${url.href}/user/type/`, config)
                .then(response => response.json())
                .then(json => {
                    if (!json.error) {
                        //
                    }
                    return null;
                })
                .catch(error => showToast(false, 'Please log in again.'));

                // Get all users
                getAllUsers(config);
            });
        </script>
        <script src="../../assets/js/utils.js"></script>
        <script src="../../assets/js/main.js"></script>
        <script src="../../assets/js/queries.js"></script>
        <script src="../../assets/js/dashboard.js"></script>
        <script defer src="https://use.fontawesome.com/releases/v5.8.1/js/all.js" integrity="sha384-g5uSoOSBd7KkhAMlnQILrecXvzst9TdC09/VM+pjDTCM+1il8RHz5fKANTFFb+gQ" crossorigin="anonymous"></script>
    </body>
</html>