- pagine RISO
This commit is contained in:
Surya Paolo
@@ -1,25 +1,4 @@
|
||||
// Spacing ridotto 40-50%
|
||||
$s-xs: 4px;
|
||||
$s-sm: 8px;
|
||||
$s-md: 12px;
|
||||
$s-lg: 16px;
|
||||
$s-xl: 20px;
|
||||
|
||||
$r-sm: 8px;
|
||||
$r-md: 12px;
|
||||
$r-lg: 16px;
|
||||
$r-xl: 20px;
|
||||
|
||||
// Gradienti
|
||||
$gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
$gradient-accent: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
|
||||
$gradient-success: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
|
||||
$gradient-info: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);
|
||||
$gradient-orange: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
|
||||
$gradient-indigo: linear-gradient(135deg, #5a67d8 0%, #667eea 100%);
|
||||
$gradient-red: linear-gradient(135deg, #f56565 0%, #ed64a6 100%);
|
||||
$gradient-lime: linear-gradient(135deg, #84cc16 0%, #10b981 100%);
|
||||
$gradient-teal: linear-gradient(135deg, #14b8a6 0%, #06b6d4 100%);
|
||||
@import 'src/css/variables.scss';
|
||||
|
||||
// Container principale
|
||||
.riso-modern-home {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { defineComponent, ref, computed, watch, onMounted } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { CRISBalanceBar } from '@src/components/CRISBalanceBar';
|
||||
import { CRISBalanceBar } from '@/components/CRISBalanceBar';
|
||||
import { tools } from '@tools';
|
||||
import { useUserStore } from 'app/src/store';
|
||||
|
||||
|
||||
@@ -116,7 +116,8 @@
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="wallet-card">
|
||||
<!-- Selettore Circuito -->
|
||||
<div class="circuit-selector">
|
||||
<div class="selector-label">
|
||||
@@ -138,7 +139,6 @@
|
||||
class="circuit-toggle"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- Statistiche transazioni del circuito selezionato -->
|
||||
<div class="wallet-transactions">
|
||||
<div class="transaction-stat total">
|
||||
@@ -174,120 +174,6 @@
|
||||
<span class="stat-label">Ricevute</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Saldi compatti circuito selezionato -->
|
||||
<div class="wallet-balances-compact">
|
||||
<CRISBalanceBar
|
||||
:current-balance="currentCircuitData.realBalance"
|
||||
:min-limit="currentCircuitData.trustLimit"
|
||||
:max-limit="currentCircuitData.maxAccumulation"
|
||||
:label="currentCircuitData.title"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- Ultime 3 transazioni del circuito selezionato -->
|
||||
<!-- SOSTITUISCI la sezione recent-transactions -->
|
||||
|
||||
<div class="recent-transactions">
|
||||
<div class="transactions-header">
|
||||
<h4 class="transactions-title">Ultimi Scambi</h4>
|
||||
<q-btn-toggle
|
||||
v-model="transactionsView"
|
||||
dense
|
||||
no-caps
|
||||
unelevated
|
||||
rounded
|
||||
size="md"
|
||||
toggle-color="primary"
|
||||
:options="[
|
||||
{ label: 'Personali', value: 'mine' },
|
||||
{ label: 'Della Community', value: 'all' },
|
||||
]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- Tue Transazioni -->
|
||||
<div
|
||||
v-if="transactionsView === 'mine'"
|
||||
class="transaction-list"
|
||||
>
|
||||
<div
|
||||
v-for="(tx, idx) in currentCircuitData.recentTransactions.slice(0, 3)"
|
||||
:key="idx"
|
||||
class="transaction-item"
|
||||
@click="openTransaction(tx)"
|
||||
>
|
||||
<q-avatar
|
||||
size="32px"
|
||||
:color="tx.amount > 0 ? 'positive' : 'negative'"
|
||||
text-color="white"
|
||||
>
|
||||
{{ tx.userInitial }}
|
||||
</q-avatar>
|
||||
<div class="transaction-content">
|
||||
<span class="transaction-desc">{{ tx.description }}</span>
|
||||
<span class="transaction-time">{{ tx.time }}</span>
|
||||
</div>
|
||||
<span
|
||||
:class="['transaction-amount', tx.amount > 0 ? 'positive' : 'negative']"
|
||||
>
|
||||
{{ tx.amount > 0 ? '+' : '' }}{{ tx.amount }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Transazioni Community -->
|
||||
<div
|
||||
v-if="transactionsView === 'all'"
|
||||
class="transaction-list"
|
||||
>
|
||||
<div
|
||||
v-for="(tx, idx) in allTransactions.slice(0, 3)"
|
||||
:key="idx"
|
||||
class="transaction-item"
|
||||
@click="openTransaction(tx)"
|
||||
>
|
||||
<div class="transaction-users">
|
||||
<q-avatar
|
||||
size="28px"
|
||||
color="primary"
|
||||
text-color="white"
|
||||
>
|
||||
{{ tx.fromInitial }}
|
||||
</q-avatar>
|
||||
<q-icon
|
||||
name="arrow_forward"
|
||||
size="xs"
|
||||
color="grey-6"
|
||||
/>
|
||||
<q-avatar
|
||||
size="28px"
|
||||
color="secondary"
|
||||
text-color="white"
|
||||
>
|
||||
{{ tx.toInitial }}
|
||||
</q-avatar>
|
||||
</div>
|
||||
<div class="transaction-content">
|
||||
<span class="transaction-desc">{{ tx.fromName }} → {{ tx.toName }}</span>
|
||||
<span class="transaction-time">{{ tx.time }}</span>
|
||||
</div>
|
||||
<span class="transaction-amount community">
|
||||
{{ tx.amount > 0 ? '+' : '' }}{{ tx.amount }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Focus su attività di scambio -->
|
||||
<q-btn
|
||||
unelevated
|
||||
rounded
|
||||
class="wallet-detail-btn"
|
||||
label="Dettaglio Transazioni"
|
||||
icon-right="arrow_forward"
|
||||
@click="goToTransactions"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
v-if="showBannScambio"
|
||||
@@ -502,7 +388,6 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<!-- Attività Community
|
||||
<section class="community-section">
|
||||
<div class="community-card">
|
||||
@@ -596,8 +481,8 @@
|
||||
</div>
|
||||
-->
|
||||
|
||||
<!-- Ultimi Scambi -->
|
||||
<!--<div class="community-card">
|
||||
<!-- Ultimi Scambi -->
|
||||
<!--<div class="community-card">
|
||||
<div class="community-header">
|
||||
<h3 class="community-title">
|
||||
<q-icon name="swap_horiz" />
|
||||
@@ -782,9 +667,7 @@
|
||||
<span class="option-subtitle">Ospitare viaggiatori</span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="annuncio-option gradient-teal"
|
||||
>
|
||||
<div class="annuncio-option gradient-teal">
|
||||
<q-icon
|
||||
name="directions_car"
|
||||
size="2.5rem"
|
||||
|
||||
Reference in New Issue
Block a user