diff options
| author | syuilo <Syuilotan@yahoo.co.jp> | 2021-10-22 05:36:48 +0900 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2021-10-22 05:36:48 +0900 |
| commit | 4e4c559db6964cbf17fcadf38d55fc79c995ca42 (patch) | |
| tree | 0e136ef1bf75c201b5805e667129082db3abcb61 /src/client/components/number-diff.vue | |
| parent | リモートノートで意図せずローカルカスタム絵文字が使... (diff) | |
| download | sharkey-4e4c559db6964cbf17fcadf38d55fc79c995ca42.tar.gz sharkey-4e4c559db6964cbf17fcadf38d55fc79c995ca42.tar.bz2 sharkey-4e4c559db6964cbf17fcadf38d55fc79c995ca42.zip | |
Migrate to Chart.js v3 (#7896)
* wip
* wip
* wip
* wip
* wip
* wip
* wip
* 定期的にresync
* Update overview.vue
* wip
* wip
Diffstat (limited to 'src/client/components/number-diff.vue')
| -rw-r--r-- | src/client/components/number-diff.vue | 47 |
1 files changed, 47 insertions, 0 deletions
diff --git a/src/client/components/number-diff.vue b/src/client/components/number-diff.vue new file mode 100644 index 0000000000..ba7e6964de --- /dev/null +++ b/src/client/components/number-diff.vue @@ -0,0 +1,47 @@ +<template> +<span class="ceaaebcd" :class="{ isPlus, isMinus, isZero }"> + <slot name="before"></slot>{{ isPlus ? '+' : isMinus ? '-' : '' }}{{ number(value) }}<slot name="after"></slot> +</span> +</template> + +<script lang="ts"> +import { computed, defineComponent } from 'vue'; +import number from '@client/filters/number'; + +export default defineComponent({ + props: { + value: { + type: Number, + required: true + }, + }, + + setup(props) { + const isPlus = computed(() => props.value > 0); + const isMinus = computed(() => props.value < 0); + const isZero = computed(() => props.value === 0); + return { + isPlus, + isMinus, + isZero, + number, + }; + } +}); +</script> + +<style lang="scss" scoped> +.ceaaebcd { + &.isPlus { + color: var(--success); + } + + &.isMinus { + color: var(--error); + } + + &.isZero { + opacity: 0.5; + } +} +</style> |