Update weapon stat numbering format
Made Baruna
parent
5730116f2c
commit
25949b2344
|
|
@ -0,0 +1,7 @@
|
|||
export function formatStat(value, type) {
|
||||
if (type !== 'em') {
|
||||
return `${Math.round(value * 100 * 10) / 10}%`;
|
||||
}
|
||||
|
||||
return Math.round(value);
|
||||
}
|
||||
|
|
@ -109,6 +109,7 @@
|
|||
"geoDamageBonus": "Geo DMG Bonus",
|
||||
"sortBy": "Sort by...",
|
||||
"talentBook": "Talent Book",
|
||||
"bossItem": "Boss",
|
||||
"ascensionMaterial": "Ascension Materials",
|
||||
"talentStats": "Talent Stats",
|
||||
"build": "Build",
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@
|
|||
import artifacts from '../../data/artifacts/en.json';
|
||||
import weapons from '../../data/weapons/en.json';
|
||||
import Ad from '../../components/Ad.svelte';
|
||||
import { formatStat } from '../../helper';
|
||||
|
||||
const rarityColor = {
|
||||
1: 'text-white',
|
||||
|
|
@ -94,6 +95,7 @@
|
|||
const bookId = character.material.book[0].id;
|
||||
const book = itemGroup[bookId];
|
||||
const materials = character.ascension[1].items;
|
||||
const bossItem = character.material.boss;
|
||||
|
||||
let chars = {};
|
||||
let constellationCount = -1;
|
||||
|
|
@ -253,13 +255,28 @@
|
|||
</div>
|
||||
<p class="text-gray-200 px-4 md:px-8">{data.description}</p>
|
||||
<div class="flex flex-col md:flex-row mt-4 space-y-4 md:space-y-0 md:space-x-4 px-4 md:px-8">
|
||||
<div class="text-gray-200 rounded-xl border border-gray-200 border-opacity-25 p-4">
|
||||
<p>{$t('characters.talentBook')}</p>
|
||||
<div class="flex items-center mt-2">
|
||||
<div class="mr-2 h-12 w-12 bg-background rounded-xl p-1">
|
||||
<img src="/images/items/{bookId}.png" alt={book.name} class="h-full max-w-full object-contain" />
|
||||
<div class="text-gray-200 rounded-xl border border-gray-200 border-opacity-25 p-4 flex">
|
||||
<div class="mr-4">
|
||||
<p>{$t('characters.talentBook')}</p>
|
||||
<div class="flex items-center mt-2">
|
||||
<div class="mr-2 h-12 w-12 bg-background rounded-xl p-1">
|
||||
<img src="/images/items/{bookId}.png" alt={book.name} class="h-full max-w-full object-contain" />
|
||||
</div>
|
||||
<p class="mb-1 font-semibold">{book.name}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<p>{$t('characters.bossItem')}</p>
|
||||
<div class="flex items-center mt-2">
|
||||
<div class="mr-2 h-12 w-12 bg-background rounded-xl p-1">
|
||||
<img
|
||||
src="/images/items/{bossItem.id}.png"
|
||||
alt={bossItem.name}
|
||||
title={bossItem.name}
|
||||
class="h-full max-w-full object-contain"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<p class="mb-1 font-semibold">{book.name}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-gray-200 rounded-xl border border-gray-200 border-opacity-25 p-4">
|
||||
|
|
@ -454,10 +471,7 @@
|
|||
{$t(`weapon.${weapons[weapon.id].secondary.name}`)}
|
||||
</p>
|
||||
<p class="text-gray-900 text-sm">
|
||||
{Math.round(
|
||||
weapons[weapon.id].secondary.stats[96] *
|
||||
(weapons[weapon.id].secondary.name === 'em' ? 1 : 100),
|
||||
)}{weapons[weapon.id].secondary.name === 'em' ? '' : '%'}
|
||||
{formatStat(weapons[weapon.id].secondary.stats[96], weapons[weapon.id].secondary.name)}
|
||||
</p>
|
||||
</div>
|
||||
{/if}
|
||||
|
|
@ -572,6 +586,7 @@
|
|||
{$t('characters.source')}
|
||||
</a>
|
||||
<Ad class="ml-8 mt-4 mb-2" type="desktop" variant="lb" id="1" />
|
||||
<Ad type="desktop" variant="lb" id="2" />
|
||||
<div class="flex flex-col mt-4 text-white px-4 md:px-8 max-w-screen-xl" bind:this={talentDiv}>
|
||||
<a href="/characters/{id}/#talents" class="font-black font-display text-2xl mt-4">
|
||||
{$t('characters.talents')}
|
||||
|
|
@ -588,6 +603,7 @@
|
|||
</div>
|
||||
<Ad class="ml-8 mt-4 mb-2" type="desktop" variant="lb" id="3" />
|
||||
<Ad class="flex justify-center mt-4 mb-2" type="mobile" variant="mpu" id="1" />
|
||||
<Ad type="mobile" variant="lb" id="1" />
|
||||
<div class="flex flex-col text-white px-4 md:px-8 max-w-screen-xl" id="constellations" bind:this={constellationDiv}>
|
||||
<a href="/characters/{id}/#constellations" class="font-black font-display text-2xl mt-4">
|
||||
{$t('characters.constellations')}
|
||||
|
|
|
|||
|
|
@ -51,6 +51,8 @@
|
|||
import Icon from '../../components/Icon.svelte';
|
||||
import { onMount } from 'svelte';
|
||||
import { characters } from '../../data/characters';
|
||||
import { formatStat } from '../../helper';
|
||||
import Ad from '../../components/Ad.svelte';
|
||||
|
||||
const rarity = {
|
||||
1: 'text-white',
|
||||
|
|
@ -107,6 +109,7 @@
|
|||
<p class="skill-description text-white">{@html weapon.skill.description}</p>
|
||||
</div>
|
||||
{/if}
|
||||
<Ad type="mobile" variant="mpu" id="1" class="flex justify-center mt-4" />
|
||||
{#if recommendedCharacter.length > 0}
|
||||
<div class="mt-4 max-w-screen-lg">
|
||||
<h3 class="font-display font-bold text-2xl text-white">
|
||||
|
|
@ -134,7 +137,7 @@
|
|||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="mt-4 block overflow-x-auto whitespace-no-wrap md:w-auto">
|
||||
<div class="mt-4 flex overflow-x-auto whitespace-no-wrap md:w-auto">
|
||||
<div style="width: min-content;">
|
||||
<div class="table max-w-full rounded-xl border border-gray-200 border-opacity-25">
|
||||
<table class="text-gray-200 w-full">
|
||||
|
|
@ -163,7 +166,7 @@
|
|||
<td class="text-center border-t border-gray-700 px-2">{Math.round(weapon.atk[index])}</td>
|
||||
{#if weapon.secondary.stats}
|
||||
<td class="text-center border-t border-gray-700 px-2">
|
||||
{Math.round(weapon.secondary.stats[index] * multiplier)}{suffix}
|
||||
{formatStat(weapon.secondary.stats[index], weapon.secondary.name)}
|
||||
</td>
|
||||
{/if}
|
||||
</tr>
|
||||
|
|
@ -171,10 +174,15 @@
|
|||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hidden lg:block">
|
||||
<Ad type="desktop" variant="mpu" id="1" class="ml-8" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<img class="w-64 h-64 ml-4 max-w-full" src="/images/weapons/{id}.png" alt={weapon.name} />
|
||||
<img class="h-64 w-auto ml-4 max-w-full" src="/images/weapons/{id}.png" alt={weapon.name} />
|
||||
</div>
|
||||
<Ad type="desktop" variant="lb" id="2" />
|
||||
<Ad type="mobile" variant="lb" id="1" />
|
||||
</div>
|
||||
|
||||
<style>
|
||||
|
|
|
|||
|
|
@ -9,6 +9,8 @@
|
|||
import { onMount } from 'svelte';
|
||||
import { locale, t } from 'svelte-i18n';
|
||||
import TableHeader from '../../components/Table/TableHeader.svelte';
|
||||
import { formatStat } from '../../helper';
|
||||
import Ad from '../../components/Ad.svelte';
|
||||
|
||||
export let data;
|
||||
let weaponList = [];
|
||||
|
|
@ -42,9 +44,10 @@
|
|||
rarity: weapon.rarity,
|
||||
atk: weapon.atk[weapon.atk.length - 1].toFixed(0),
|
||||
secondary: weapon.secondary.name
|
||||
? `${$t(`weapon.${weapon.secondary.name}`)} ${(
|
||||
weapon.secondary.stats[weapon.secondary.stats.length - 1] * (weapon.secondary.name === 'em' ? 1 : 100)
|
||||
).toFixed(0)}${weapon.secondary.name === 'em' ? '' : '%'}`
|
||||
? `${$t(`weapon.${weapon.secondary.name}`)} ${formatStat(
|
||||
weapon.secondary.stats[weapon.secondary.stats.length - 1],
|
||||
weapon.secondary.name,
|
||||
)}`
|
||||
: '-',
|
||||
});
|
||||
}
|
||||
|
|
@ -112,7 +115,8 @@
|
|||
<p class="text-gray-400 px-4 md:px-8 font-medium pb-4" style="margin-top: -1rem;">
|
||||
※ {$t('weapon.subtitle')}
|
||||
</p>
|
||||
<div class="block overflow-x-auto whitespace-no-wrap pb-8">
|
||||
<div class="block overflow-x-auto whitespace-no-wrap pb-8 relative">
|
||||
<Ad type="desktop" variant="mpu" id="1" class="absolute top-0" style="right: 50px;" />
|
||||
<div class="px-4 md:px-8 table max-w-full">
|
||||
<table class="w-full block p-4 bg-item rounded-xl">
|
||||
<thead>
|
||||
|
|
@ -160,4 +164,6 @@
|
|||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<Ad type="desktop" variant="lb" id="2" />
|
||||
<Ad type="mobile" variant="lb" id="1" />
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue