[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
[taler-merchant-backoffice] branch master updated: WIP: scrollable table
From: |
gnunet |
Subject: |
[taler-merchant-backoffice] branch master updated: WIP: scrollable table on mobile, fixed error messages |
Date: |
Wed, 10 Mar 2021 21:26:35 +0100 |
This is an automated email from the git hooks/post-receive script.
sebasjm pushed a commit to branch master
in repository merchant-backoffice.
The following commit(s) were added to refs/heads/master by this push:
new 1ed3f01 WIP: scrollable table on mobile, fixed error messages
1ed3f01 is described below
commit 1ed3f01006aca39bf428aa831cc76d73043d2893
Author: Sebastian <sebasjm@gmail.com>
AuthorDate: Wed Mar 10 17:26:06 2021 -0300
WIP: scrollable table on mobile, fixed error messages
---
packages/frontend/src/ApplicationReadyRoutes.tsx | 41 ++++++----------------
.../src/routes/instance/orders/list/Table.tsx | 39 ++++++++++----------
packages/frontend/src/scss/libs/_all.scss | 2 +-
3 files changed, 32 insertions(+), 50 deletions(-)
diff --git a/packages/frontend/src/ApplicationReadyRoutes.tsx
b/packages/frontend/src/ApplicationReadyRoutes.tsx
index 446cd56..64fbb32 100644
--- a/packages/frontend/src/ApplicationReadyRoutes.tsx
+++ b/packages/frontend/src/ApplicationReadyRoutes.tsx
@@ -89,37 +89,18 @@ export function ApplicationReadyRoutes({ pushNotification,
addTokenCleaner, clea
</Fragment>
}
}
- if (!list.error) {
- return <div id="app">
- <section class="section is-title-bar">
-
- <div class="level">
- <div class="level-left">
- <div class="level-item">
- <ul>
- <li>loading s</li>
- </ul>
- </div>
- </div>
- </div>
- </section>
- </div>
+ if (list.error) {
+ return <Fragment>
+ <Menu title="Error" />
+ <LoginPage
+ withMessage={{ message: i18n`Couldnt access the server`,
description: list.error.message, type: 'ERROR', }}
+ onConfirm={updateLoginStatus}
+ />
+ </Fragment>
}
- return <div id="app">
- <section class="section is-title-bar">
-
- <div class="level">
- <div class="level-left">
- <div class="level-item">
- <ul>
- <li>There was an unexpected error</li>
- <li>{JSON.stringify(list.error)}</li>
- </ul>
- </div>
- </div>
- </div>
- </section>
- </div>
+
+ // is loading
+ return <Menu />
}
return <Fragment>
diff --git a/packages/frontend/src/routes/instance/orders/list/Table.tsx
b/packages/frontend/src/routes/instance/orders/list/Table.tsx
index ff2f50e..cb7991f 100644
--- a/packages/frontend/src/routes/instance/orders/list/Table.tsx
+++ b/packages/frontend/src/routes/instance/orders/list/Table.tsx
@@ -14,10 +14,10 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
- /**
- *
- * @author Sebastian Javier Marchano (sebasjm)
- */
+/**
+*
+* @author Sebastian Javier Marchano (sebasjm)
+*/
import { h, VNode } from "preact"
import { Message } from "preact-messages"
@@ -25,7 +25,7 @@ import { StateUpdater, useEffect, useState } from
"preact/hooks"
import { MerchantBackend, WidthId } from "../../../../declaration"
import { Actions, buildActions } from "../../../../utils/table";
-type Entity = MerchantBackend.Orders.OrderHistoryEntry & {id: string}
+type Entity = MerchantBackend.Orders.OrderHistoryEntry & { id: string }
interface Props {
instances: Entity[];
@@ -61,9 +61,9 @@ export function CardTable({ instances, onCreate, onUpdate,
onDelete, selected }:
<div class="card-header-icon" aria-label="more options">
<button class={rowSelection.length > 0 ? "button is-danger" :
"is-hidden"}
- type="button"
- onClick={(): void => actionQueueHandler(buildActions(instances,
rowSelection, 'DELETE'))}
- >
+ type="button"
+ onClick={(): void => actionQueueHandler(buildActions(instances,
rowSelection, 'DELETE'))}
+ >
<span class="icon"><i class="mdi mdi-trash-can" /></span>
</button>
</div>
@@ -99,20 +99,20 @@ function toggleSelected<T>(id: T): (prev: T[]) => T[] {
}
function Table({ rowSelection, rowSelectionHandler, instances, onUpdate,
onDelete }: TableProps): VNode {
- return (
- <table class="table is-fullwidth is-striped is-hoverable is-fullwidth">
+ return <div class="table-container">
+ <table class="table is-striped is-hoverable is-fullwidth">
<thead>
<tr>
- <th class="is-checkbox-cell">
+ <th class="is-checkbox-cell" style={{minWidth: 50}}>
<label class="b-checkbox checkbox">
<input type="checkbox" checked={rowSelection.length ===
instances.length} onClick={(): void => rowSelectionHandler(rowSelection.length
=== instances.length ? [] : instances.map(i => i.id))} />
<span class="check" />
</label>
</th>
- <th><Message id="fields.order.amount.label" /></th>
- <th><Message id="fields.order.summary.label" /></th>
- <th><Message id="fields.order.paid.label" /></th>
- <th />
+ <th style={{minWidth: 100}}><Message id="fields.order.amount.label"
/></th>
+ <th style={{minWidth: 500}}><Message id="fields.order.summary.label"
/></th>
+ <th style={{minWidth: 100}}><Message id="fields.order.paid.label"
/></th>
+ <th style={{minWidth: 50}}/>
</tr>
</thead>
<tbody>
@@ -124,9 +124,9 @@ function Table({ rowSelection, rowSelectionHandler,
instances, onUpdate, onDelet
<span class="check" />
</label>
</td>
- <td onClick={(): void => onUpdate(i.id)} style={{cursor:
'pointer'}} >{i.amount}</td>
- <td onClick={(): void => onUpdate(i.id)} style={{cursor:
'pointer'}} >{i.summary}</td>
- <td onClick={(): void => onUpdate(i.id)} style={{cursor:
'pointer'}} >{i.paid}</td>
+ <td onClick={(): void => onUpdate(i.id)} style={{ cursor:
'pointer' }} >{i.amount}</td>
+ <td onClick={(): void => onUpdate(i.id)} style={{ cursor:
'pointer' }} >{i.summary}</td>
+ <td onClick={(): void => onUpdate(i.id)} style={{ cursor:
'pointer' }} >{i.paid}</td>
<td class="is-actions-cell">
<div class="buttons is-right">
<button class="button is-small is-danger jb-modal"
type="button" onClick={(): void => onDelete(i)}>
@@ -138,7 +138,8 @@ function Table({ rowSelection, rowSelectionHandler,
instances, onUpdate, onDelet
})}
</tbody>
- </table>)
+ </table>
+ </div>
}
function EmptyTable(): VNode {
diff --git a/packages/frontend/src/scss/libs/_all.scss
b/packages/frontend/src/scss/libs/_all.scss
index 1730754..313eb52 100644
--- a/packages/frontend/src/scss/libs/_all.scss
+++ b/packages/frontend/src/scss/libs/_all.scss
@@ -20,7 +20,7 @@
*/
@import "node_modules/bulma-radio/bulma-radio";
-@import "node_modules/bulma-responsive-tables/bulma-responsive-tables";
+// @import "node_modules/bulma-responsive-tables/bulma-responsive-tables";
@import "node_modules/bulma-checkbox/bulma-checkbox";
@import "node_modules/bulma-switch-control/bulma-switch-control";
@import "node_modules/bulma-upload-control/bulma-upload-control";
--
To stop receiving notification emails like this one, please contact
gnunet@gnunet.org.
[Prev in Thread] |
Current Thread |
[Next in Thread] |
- [taler-merchant-backoffice] branch master updated: WIP: scrollable table on mobile, fixed error messages,
gnunet <=