You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
56 lines
1.5 KiB
56 lines
1.5 KiB
<template> |
|
<div class="bouts"> |
|
<div v-for="bout, idx in bouts" class="bout"> |
|
<span class="seq">{{ t('bout.0') + (idx + 1) }}:</span> |
|
<span class="dmg">{{ replace(t('bout.1'), [t('skill.' + bout.action + '.0')]) }},</span> |
|
<span class="crit" v-if="bout.crit">{{ t('bout.2') }},</span> |
|
<span class="dmg" v-if="bout.dmg > 0">{{ replace(t('bout.3'), [bout.dmg]) }},</span> |
|
<span v-if="bout.sneak > 0" class="dmg">{{ replace(t('bout.8'), [bout.sneak]) }},</span> |
|
<span class="take-dmg" v-if="bout.takeDmg">{{ replace(t('bout.4'), [bout.takeDmg]) }},</span> |
|
<span class="dmg" v-if="bout.reflectedDmg">{{ replace(t('bout.9'), [bout.reflectedDmg]) }},</span> |
|
<span v-if="idx == bouts.length - 1"> |
|
{{ t('bout.5') }}{{ bout.takeDmg ? t('bout.7') : t('bout.6') }}. |
|
</span> |
|
</div> |
|
</div> |
|
</template> |
|
|
|
<script lang="ts" setup> |
|
import { useStore } from "vuex"; |
|
import { reactive, onMounted, ref } from "vue"; |
|
import { useI18n } from "vue3-i18n"; |
|
import { Bout, replace } from "@/tool"; |
|
|
|
const { t } = useI18n(); |
|
const { state, commit, dispatch } = useStore(); |
|
|
|
defineProps({ |
|
bouts: { |
|
type: Array as () => Bout[], |
|
default: [] |
|
} |
|
}) |
|
|
|
onMounted(() => { }); |
|
</script> |
|
<style lang="scss" scoped> |
|
.bout { |
|
text-align: left; |
|
|
|
.seq { |
|
font-size: 1.1rem; |
|
} |
|
|
|
.crit { |
|
color: red; |
|
} |
|
|
|
.dmg { |
|
color: #2fe20f; |
|
} |
|
|
|
.take-dmg { |
|
color: #de8618; |
|
} |
|
} |
|
</style> |