mirror of
https://github.com/mayswind/ezbookkeeping.git
synced 2026-05-20 09:44:26 +08:00
modify style
This commit is contained in:
@@ -27,15 +27,18 @@
|
|||||||
<div class="mb-4">
|
<div class="mb-4">
|
||||||
<v-tabs class="v-tabs-pill" direction="vertical" :class="{ 'readonly': mode !== 'add' }"
|
<v-tabs class="v-tabs-pill" direction="vertical" :class="{ 'readonly': mode !== 'add' }"
|
||||||
:disabled="loading || submitting" v-model="transaction.type">
|
:disabled="loading || submitting" v-model="transaction.type">
|
||||||
<v-tab :value="allTransactionTypes.Expense">
|
<v-tab :value="allTransactionTypes.Expense" v-if="transaction.type !== allTransactionTypes.ModifyBalance">
|
||||||
<span>{{ $t('Expense') }}</span>
|
<span>{{ $t('Expense') }}</span>
|
||||||
</v-tab>
|
</v-tab>
|
||||||
<v-tab :value="allTransactionTypes.Income">
|
<v-tab :value="allTransactionTypes.Income" v-if="transaction.type !== allTransactionTypes.ModifyBalance">
|
||||||
<span>{{ $t('Income') }}</span>
|
<span>{{ $t('Income') }}</span>
|
||||||
</v-tab>
|
</v-tab>
|
||||||
<v-tab :value="allTransactionTypes.Transfer">
|
<v-tab :value="allTransactionTypes.Transfer" v-if="transaction.type !== allTransactionTypes.ModifyBalance">
|
||||||
<span>{{ $t('Transfer') }}</span>
|
<span>{{ $t('Transfer') }}</span>
|
||||||
</v-tab>
|
</v-tab>
|
||||||
|
<v-tab :value="allTransactionTypes.ModifyBalance" v-if="transaction.type === allTransactionTypes.ModifyBalance">
|
||||||
|
<span>{{ $t('Modify Balance') }}</span>
|
||||||
|
</v-tab>
|
||||||
</v-tabs>
|
</v-tabs>
|
||||||
<v-divider class="my-2"/>
|
<v-divider class="my-2"/>
|
||||||
<v-tabs direction="vertical" :disabled="loading || submitting" v-model="activeTab">
|
<v-tabs direction="vertical" :disabled="loading || submitting" v-model="activeTab">
|
||||||
|
|||||||
@@ -10,9 +10,17 @@
|
|||||||
|
|
||||||
<f7-subnavbar>
|
<f7-subnavbar>
|
||||||
<f7-segmented strong :class="{ 'readonly': mode !== 'add' }">
|
<f7-segmented strong :class="{ 'readonly': mode !== 'add' }">
|
||||||
<f7-button :text="$t('Expense')" :active="transaction.type === allTransactionTypes.Expense" @click="transaction.type = allTransactionTypes.Expense"></f7-button>
|
<f7-button :text="$t('Expense')" :active="transaction.type === allTransactionTypes.Expense"
|
||||||
<f7-button :text="$t('Income')" :active="transaction.type === allTransactionTypes.Income" @click="transaction.type = allTransactionTypes.Income"></f7-button>
|
v-if="transaction.type !== allTransactionTypes.ModifyBalance"
|
||||||
<f7-button :text="$t('Transfer')" :active="transaction.type === allTransactionTypes.Transfer" @click="transaction.type = allTransactionTypes.Transfer"></f7-button>
|
@click="transaction.type = allTransactionTypes.Expense"></f7-button>
|
||||||
|
<f7-button :text="$t('Income')" :active="transaction.type === allTransactionTypes.Income"
|
||||||
|
v-if="transaction.type !== allTransactionTypes.ModifyBalance"
|
||||||
|
@click="transaction.type = allTransactionTypes.Income"></f7-button>
|
||||||
|
<f7-button :text="$t('Transfer')" :active="transaction.type === allTransactionTypes.Transfer"
|
||||||
|
v-if="transaction.type !== allTransactionTypes.ModifyBalance"
|
||||||
|
@click="transaction.type = allTransactionTypes.Transfer"></f7-button>
|
||||||
|
<f7-button :text="$t('Modify Balance')" :active="transaction.type === allTransactionTypes.ModifyBalance"
|
||||||
|
v-if="transaction.type === allTransactionTypes.ModifyBalance"></f7-button>
|
||||||
</f7-segmented>
|
</f7-segmented>
|
||||||
</f7-subnavbar>
|
</f7-subnavbar>
|
||||||
</f7-navbar>
|
</f7-navbar>
|
||||||
@@ -55,7 +63,7 @@
|
|||||||
</f7-list-item>
|
</f7-list-item>
|
||||||
|
|
||||||
<f7-list-item
|
<f7-list-item
|
||||||
class="transaction-edit-amount"
|
class="transaction-edit-amount text-color-primary"
|
||||||
link="#" no-chevron
|
link="#" no-chevron
|
||||||
:class="destinationAmountClass"
|
:class="destinationAmountClass"
|
||||||
:header="$t('Transfer In Amount')"
|
:header="$t('Transfer In Amount')"
|
||||||
@@ -519,8 +527,9 @@ export default {
|
|||||||
sourceAmountClass() {
|
sourceAmountClass() {
|
||||||
const classes = {
|
const classes = {
|
||||||
'readonly': this.mode === 'view',
|
'readonly': this.mode === 'view',
|
||||||
'color-teal': this.transaction.type === this.allTransactionTypes.Expense,
|
'text-color-teal': this.transaction.type === this.allTransactionTypes.Expense,
|
||||||
'color-red': this.transaction.type === this.allTransactionTypes.Income,
|
'text-color-red': this.transaction.type === this.allTransactionTypes.Income,
|
||||||
|
'text-color-primary': this.transaction.type === this.allTransactionTypes.Transfer
|
||||||
};
|
};
|
||||||
|
|
||||||
classes[this.getFontClassByAmount(this.transaction.sourceAmount)] = true;
|
classes[this.getFontClassByAmount(this.transaction.sourceAmount)] = true;
|
||||||
@@ -802,7 +811,6 @@ export default {
|
|||||||
|
|
||||||
.transaction-edit-amount {
|
.transaction-edit-amount {
|
||||||
line-height: 53px;
|
line-height: 53px;
|
||||||
color: var(--f7-theme-color);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.transaction-edit-amount .item-title {
|
.transaction-edit-amount .item-title {
|
||||||
|
|||||||
Reference in New Issue
Block a user