57 lines
1.2 KiB
Vue
57 lines
1.2 KiB
Vue
<template>
|
|
<div class="damage-site">
|
|
<div class="total-damage">
|
|
<h3 class="text-center mt-2">Total Damage</h3>
|
|
<TotalDamage/>
|
|
</div>
|
|
<div class="hitgroup">
|
|
<!-- <h3 class="text-center">Damage by Hitgroup</h3>-->
|
|
<HitgroupPuppet :equipment_map="data.equipment_map" :stats="data.stats" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import HitgroupPuppet from '@/components/HitgroupPuppet'
|
|
import TotalDamage from "@/components/TotalDamage"
|
|
import {onMounted, reactive} from "vue";
|
|
import {useStore} from "vuex";
|
|
import {GetWeaponDmg} from "@/utils";
|
|
|
|
export default {
|
|
name: "DamageSite.vue",
|
|
components: {HitgroupPuppet, TotalDamage},
|
|
setup() {
|
|
const store = useStore()
|
|
|
|
const data = reactive({
|
|
equipment_map: {},
|
|
stats: [],
|
|
})
|
|
|
|
const getWeaponDamage = async () => {
|
|
const resData = await GetWeaponDmg(store, store.state.matchDetails.match_id)
|
|
if (resData !== null) {
|
|
data.equipment_map = resData.equipment_map
|
|
data.stats = resData.stats
|
|
}
|
|
}
|
|
|
|
onMounted(() => {
|
|
getWeaponDamage()
|
|
})
|
|
|
|
return {data}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.damage-site {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
</style>
|