mirror of
https://github.com/mayswind/ezbookkeeping.git
synced 2026-05-20 01:34:24 +08:00
modify the style of the custom time range
This commit is contained in:
@@ -69,11 +69,12 @@
|
|||||||
<v-list-item :key="dateRange.type" :value="dateRange.type"
|
<v-list-item :key="dateRange.type" :value="dateRange.type"
|
||||||
:append-icon="(queryDateType === dateRange.type ? mdiCheck : undefined)"
|
:append-icon="(queryDateType === dateRange.type ? mdiCheck : undefined)"
|
||||||
v-for="dateRange in allDateRanges">
|
v-for="dateRange in allDateRanges">
|
||||||
<v-list-item-title
|
<v-list-item-title class="cursor-pointer"
|
||||||
class="cursor-pointer"
|
@click="setDateFilter(dateRange.type)">
|
||||||
@click="setDateFilter(dateRange.type)">
|
<div class="d-flex align-center">
|
||||||
{{ dateRange.displayName }}
|
<span>{{ dateRange.displayName }}</span>
|
||||||
<div class="statistics-custom-datetime-range" v-if="dateRange.isUserCustomRange && canShowCustomDateRange(dateRange.type)">
|
</div>
|
||||||
|
<div class="statistics-custom-datetime-range smaller" v-if="dateRange.isUserCustomRange && canShowCustomDateRange(dateRange.type)">
|
||||||
<span>{{ queryStartTime }}</span>
|
<span>{{ queryStartTime }}</span>
|
||||||
<span> - </span>
|
<span> - </span>
|
||||||
<br/>
|
<br/>
|
||||||
@@ -1020,9 +1021,7 @@ init(props);
|
|||||||
|
|
||||||
<style>
|
<style>
|
||||||
.statistics-custom-datetime-range {
|
.statistics-custom-datetime-range {
|
||||||
font-size: 0.7rem;
|
|
||||||
line-height: 1rem;
|
line-height: 1rem;
|
||||||
color: rgba(var(--v-theme-on-background), var(--v-medium-emphasis-opacity)) !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.statistics-overview-title {
|
.statistics-overview-title {
|
||||||
|
|||||||
@@ -208,26 +208,24 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<v-list :selected="[query.dateType]">
|
<v-list :selected="[query.dateType]">
|
||||||
<template :key="dateRange.type"
|
<v-list-item class="text-sm" density="compact"
|
||||||
v-for="dateRange in allDateRanges">
|
:key="dateRange.type" :value="dateRange.type"
|
||||||
<v-list-item class="text-sm" density="compact"
|
:class="{ 'list-item-selected': query.dateType === dateRange.type }"
|
||||||
:value="dateRange.type"
|
:append-icon="(query.dateType === dateRange.type ? mdiCheck : undefined)"
|
||||||
:class="{ 'list-item-selected': query.dateType === dateRange.type }"
|
v-for="dateRange in allDateRanges">
|
||||||
:append-icon="(query.dateType === dateRange.type ? mdiCheck : undefined)">
|
<v-list-item-title class="cursor-pointer"
|
||||||
<v-list-item-title class="cursor-pointer"
|
@click="changeDateFilter(dateRange.type)">
|
||||||
@click="changeDateFilter(dateRange.type)">
|
<div class="d-flex align-center">
|
||||||
<div class="d-flex align-center">
|
<span class="text-sm ms-3">{{ dateRange.displayName }}</span>
|
||||||
<span class="text-sm ms-3">{{ dateRange.displayName }}</span>
|
</div>
|
||||||
</div>
|
<div class="transaction-list-custom-datetime-range ms-3 smaller" v-if="dateRange.isUserCustomRange && query.dateType === dateRange.type && query.minTime && query.maxTime">
|
||||||
</v-list-item-title>
|
|
||||||
<div class="ms-3 smaller" v-if="dateRange.isUserCustomRange && query.dateType === dateRange.type && query.minTime && query.maxTime">
|
|
||||||
<span>{{ queryMinTime }}</span>
|
<span>{{ queryMinTime }}</span>
|
||||||
<span> - </span>
|
<span> - </span>
|
||||||
<br/>
|
<br/>
|
||||||
<span>{{ queryMaxTime }}</span>
|
<span>{{ queryMaxTime }}</span>
|
||||||
</div>
|
</div>
|
||||||
</v-list-item>
|
</v-list-item-title>
|
||||||
</template>
|
</v-list-item>
|
||||||
</v-list>
|
</v-list>
|
||||||
</v-menu>
|
</v-menu>
|
||||||
</th>
|
</th>
|
||||||
@@ -1783,6 +1781,11 @@ init(props);
|
|||||||
row-gap: 1rem;
|
row-gap: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.transaction-list-custom-datetime-range {
|
||||||
|
line-height: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
.transaction-list-datetime-range .transaction-list-datetime-range-text {
|
.transaction-list-datetime-range .transaction-list-datetime-range-text {
|
||||||
color: rgba(var(--v-theme-on-background), var(--v-medium-emphasis-opacity)) !important;
|
color: rgba(var(--v-theme-on-background), var(--v-medium-emphasis-opacity)) !important;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user