modify style

This commit is contained in:
MaysWind
2023-07-16 18:02:58 +08:00
parent 2db0f1a6c8
commit 41034de676
3 changed files with 12 additions and 10 deletions
@@ -46,10 +46,10 @@
</div> </div>
</template> </template>
<v-card-text v-if="loading"> <div v-if="loading">
<v-skeleton-loader type="paragraph" :loading="loading" <v-skeleton-loader type="paragraph" :loading="loading"
:key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]"></v-skeleton-loader> :key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]"></v-skeleton-loader>
</v-card-text> </div>
<v-card-text v-if="!loading && !hasAnyAvailableAccount"> <v-card-text v-if="!loading && !hasAnyAvailableAccount">
<span class="text-subtitle-1">{{ $t('No available account') }}</span> <span class="text-subtitle-1">{{ $t('No available account') }}</span>
@@ -46,10 +46,10 @@
</div> </div>
</template> </template>
<v-card-text v-if="loading"> <div v-if="loading">
<v-skeleton-loader type="paragraph" :loading="loading" <v-skeleton-loader type="paragraph" :loading="loading"
:key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]"></v-skeleton-loader> :key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]"></v-skeleton-loader>
</v-card-text> </div>
<v-card-text v-else-if="!loading"> <v-card-text v-else-if="!loading">
<v-expansion-panels class="category-types" multiple v-model="expandCategoryTypes"> <v-expansion-panels class="category-types" multiple v-model="expandCategoryTypes">
@@ -23,7 +23,8 @@
</v-btn-toggle> </v-btn-toggle>
</div> </div>
<v-divider /> <v-divider />
<v-tabs show-arrows class="my-4" direction="vertical" v-model="query.chartDataType"> <v-tabs show-arrows class="my-4" direction="vertical"
:disabled="loading" v-model="query.chartDataType">
<v-tab :key="dataType.type" :value="dataType.type" <v-tab :key="dataType.type" :value="dataType.type"
v-for="dataType in allChartDataTypes"> v-for="dataType in allChartDataTypes">
{{ $t(dataType.name) }} {{ $t(dataType.name) }}
@@ -119,12 +120,13 @@
</div> </div>
</template> </template>
<v-card-text v-if="initing"> <div v-if="initing">
<v-skeleton-loader type="paragraph" :loading="initing" <v-skeleton-loader type="paragraph" :loading="initing"
:key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]"></v-skeleton-loader> :key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]"></v-skeleton-loader>
</v-card-text> </div>
<v-card-text class="statistics-overview-title pt-0" v-if="!initing"> <v-card-text class="statistics-overview-title pt-0"
:class="{ 'disabled': loading }" v-if="!initing">
<span class="text-subtitle-1">{{ totalAmountName }}</span> <span class="text-subtitle-1">{{ totalAmountName }}</span>
<span class="statistics-overview-amount ml-3" :class="statisticsTextColor" <span class="statistics-overview-amount ml-3" :class="statisticsTextColor"
v-if="statisticsData && statisticsData.items && statisticsData.items.length"> v-if="statisticsData && statisticsData.items && statisticsData.items.length">
@@ -136,7 +138,7 @@
</span> </span>
</v-card-text> </v-card-text>
<v-card-text v-if="!initing && query.chartType === allChartTypes.Pie"> <v-card-text :class="{ 'disabled': loading }" v-if="!initing && query.chartType === allChartTypes.Pie">
<pie-chart <pie-chart
:items="statisticsData && statisticsData.items && statisticsData.items.length ? statisticsData.items : []" :items="statisticsData && statisticsData.items && statisticsData.items.length ? statisticsData.items : []"
:min-valid-percent="0.0001" :min-valid-percent="0.0001"
@@ -153,7 +155,7 @@
/> />
</v-card-text> </v-card-text>
<v-card-text v-if="!initing && query.chartType === allChartTypes.Bar"> <v-card-text :class="{ 'disabled': loading }" v-if="!initing && query.chartType === allChartTypes.Bar">
<v-list rounded lines="two" <v-list rounded lines="two"
v-if="statisticsData && statisticsData.items && statisticsData.items.length"> v-if="statisticsData && statisticsData.items && statisticsData.items.length">
<template :key="idx" <template :key="idx"