Implement account summary page

6 files changed, 136 insertions, 5 deletions

diff --git a/app/controllers/Account.scala b/app/controllers/Account.scala
index ff1d44d..7557ef1 100644
--- a/app/controllers/Account.scala
+++ b/app/controllers/Account.scala
@@ -14,6 +14,21 @@ import scala.concurrent.Future
 import models._
 
 
-object Account {
+object Account extends Controller {
+
+  def summary = Auth { implicit request =>
+    if (request.account.isEmpty) {
+      Redirect(routes.Authentication.login())
+        .flashing("error" -> "Authentication required")
+    } else {
+
+      DB.withSession { implicit session =>
+        val userUuid = request.account.get.userUuid
+        val transactions = Tables.Transactions.filter(_.userUuid === userUuid).sortBy(_.transactionDate.desc).run
+
+        Ok(views.html.pages.accountSummary(transactions))
+      }
+    }
+  }
 
 }
diff --git a/app/views/fragments/accountInfos.scala.html b/app/views/fragments/accountInfos.scala.html
index 887e485..60c3583 100644
--- a/app/views/fragments/accountInfos.scala.html
+++ b/app/views/fragments/accountInfos.scala.html
@@ -7,7 +7,7 @@
                         Logout
                 </a>
 
-                <a class="pure-button" href="#">
+                <a class="pure-button" href="@routes.Account.summary()">
                         <i class="fa fa-money fa-lg"></i>
                         @account.equity €
                 </a>
diff --git a/app/views/pages/accountSummary.scala.html b/app/views/pages/accountSummary.scala.html
new file mode 100644
index 0000000..3a10d3d
--- /dev/null
+++ b/app/views/pages/accountSummary.scala.html
@@ -0,0 +1,89 @@
+@(transactions: Seq[Tables.Transaction])(implicit request: AuthRequest[AnyContent], flash: Flash, token: play.filters.csrf.CSRF.Token)
+
+@templates.pepal("Account summary")(request.account) {
+
+        <div class="action-buttons pure-g">
+        @fragments.pepalMainActions()
+        </div>
+
+        <br>
+
+        <div class="pure-g">
+                <div class="pure-u-1 pure-u-lg-1-4">
+                        <div class="l-box">
+                                <h2>My wallet</h2>
+
+                                <table class="pure-table pure-table-horizontal">
+                                        <thead>
+                                                <tr>
+                                                        <td colspan="2">Account summary</td>
+                                                </tr>
+                                        </thead>
+
+                                        <tbody>
+                                                <tr class="dark-blue">
+                                                        <td>Balance</td>
+                                                        <td>@request.account.get.balance €</td>
+                                                </tr>
+
+                                                <tr class="light-blue">
+                                                        <td>Available funds</td>
+                                                        <td>@request.account.get.equity €</td>
+                                                </tr>
+                                        </tbody>
+                                </table>
+
+                                <br>
+
+                                <div class="pure-g wallet-actions">
+                                        <div class="pure-u-1 pure-u-lg-1-1">
+                                                <a class="pure-button" href="#">
+                                                        <i class="fa fa-download"></i>
+                                                        Deposit
+                                                </a>
+                                        </div>
+
+                                        <br><br>
+
+                                        <div class="pure-u-1 pure-u-lg-1-1">
+                                                <a class="pure-button" href="#HAHAHAHA">
+                                                        <i class="fa fa-upload"></i>
+                                                        Withdraw
+                                                </a>
+                                        </div>
+                                </div>
+                        </div>
+                </div>
+
+                <div class="pure-u-1 pure-u-lg-3-4">
+                        <div class="l-box">
+                                <h2>Transaction history</h2>
+
+                                <table class="pure-table pure-table-horizontal">
+
+                                        <thead>
+                                                <tr>
+                                                        <td>Date</td>
+                                                        <td>Amount</td>
+                                                        <td>Label</td>
+                                                </tr>
+                                        </thead>
+
+                                        <tbody>
+                                        @for(transaction <- transactions) {
+                                                <tr>
+                                                        <td>@transaction.transactionDate</td>
+                                                        <td class="align-right @if(transaction.amount >= 0) {income} else {outcome}">@transaction.amount
+                                                                €</td>
+                                                        <td>@transaction.label</td>
+                                                </tr>
+                                        }
+                                        </tbody>
+
+
+                                </table>
+                        </div>
+                </div>
+        </div>
+
+}
diff --git a/conf/routes b/conf/routes
index 732fa3f..d9d1cb1 100644
--- a/conf/routes
+++ b/conf/routes
@@ -21,9 +21,7 @@ POST        /signup              controllers.Profile.signupSubmit
 #POST        /profile                controllers.Application.index
 #
 ## Internal wallet and transactions (Pépal)
-#GET         /account                controllers.Application.index
-#
-#GET         /transactions           controllers.Application.index
+GET         /account             controllers.Account.summary
 #
 #GET         /deposit                controllers.Application.index
 #POST        /deposit                controllers.Application.index
diff --git a/public/stylesheets/main.css b/public/stylesheets/main.css
index d96f0e7..22bf120 100644
--- a/public/stylesheets/main.css
+++ b/public/stylesheets/main.css
@@ -23,11 +23,27 @@ p {
     margin-right: auto;
 }
 
+.align-left {
+    text-align: left;
+}
+
+.align-right {
+    text-align: right;
+}
+
+.align-center {
+    text-align: center;
+}
+
 .input-invalid {
     border: 1px solid #a94442 !important;
     box-shadow: inset 0 1px 3px #f79291 !important;
 }
 
+table {
+    width: 100%;
+}
+
 /***** DISCLAIMER BAR *****/
 
 .disclaimer-bar {
diff --git a/public/stylesheets/pepal.css b/public/stylesheets/pepal.css
index 3ca71f3..bad5a08 100644
--- a/public/stylesheets/pepal.css
+++ b/public/stylesheets/pepal.css
@@ -20,3 +20,16 @@
 .light-blue-bg {
     background-color: #029de0;
 }
+
+.income {
+    color: darkgreen;
+}
+
+.outcome {
+    color: darkred;
+}
+
+.wallet-actions a {
+    width: 100%;
+    box-sizing: border-box;
+}