mirror of
https://github.com/vkaelin/LeagueStats.git
synced 2026-03-25 21:07:27 +00:00
fix(front): display old items icons
This commit is contained in:
parent
ec9930296d
commit
44f10b6c35
1 changed files with 30 additions and 6 deletions
|
|
@ -1,26 +1,37 @@
|
||||||
<template>
|
<template>
|
||||||
<div :class="oneRow ? 'ml-2 items-center' : 'items-2-rows flex-wrap'" class="flex">
|
<div
|
||||||
|
:class="oneRow ? 'ml-2 items-center' : 'items-2-rows flex-wrap'"
|
||||||
|
class="flex"
|
||||||
|
>
|
||||||
<Tooltip v-for="(item, index) in items" :key="index">
|
<Tooltip v-for="(item, index) in items" :key="index">
|
||||||
<template v-slot:trigger>
|
<template v-slot:trigger>
|
||||||
<div
|
<div
|
||||||
:style="{backgroundImage: item ? `url('${item.image}')` : null}"
|
:style="{ backgroundImage: itemLink(item) }"
|
||||||
:class="[oneRow ? 'ml-2px w-6 h-6' : 'ml-1 w-8 h-8', {'cursor-pointer': item !== null}]"
|
:class="[
|
||||||
|
oneRow ? 'ml-2px w-6 h-6' : 'ml-1 w-8 h-8',
|
||||||
|
{ 'cursor-pointer': item !== null },
|
||||||
|
]"
|
||||||
class="bg-center bg-cover rounded-md bg-blue-1000"
|
class="bg-center bg-cover rounded-md bg-blue-1000"
|
||||||
></div>
|
></div>
|
||||||
</template>
|
</template>
|
||||||
<template v-if="item !== null" v-slot:default>
|
<template v-if="item !== null" v-slot:default>
|
||||||
<div class="flex max-w-md p-2 text-xs text-left text-white select-none">
|
<div class="flex max-w-md p-2 text-xs text-left text-white select-none">
|
||||||
<div
|
<div
|
||||||
:style="{backgroundImage: item ? `url('${item.image}')` : null}"
|
:style="{ backgroundImage: itemLink(item) }"
|
||||||
class="flex-shrink-0 w-12 h-12 ml-1 bg-center bg-cover rounded-md bg-blue-1000"
|
class="flex-shrink-0 w-12 h-12 ml-1 bg-center bg-cover rounded-md bg-blue-1000"
|
||||||
></div>
|
></div>
|
||||||
<div class="ml-2 leading-none">
|
<div class="ml-2 leading-none">
|
||||||
<div class="text-base">{{ item.name }}</div>
|
<div class="text-base">{{ item.name }}</div>
|
||||||
<div class="mt-1">
|
<div class="mt-1">
|
||||||
<span class="text-blue-200">Price:</span>
|
<span class="text-blue-200">Price:</span>
|
||||||
<span class="ml-1 text-sm font-semibold text-yellow-500">{{ item.price }}</span>
|
<span class="ml-1 text-sm font-semibold text-yellow-500">{{
|
||||||
|
item.price
|
||||||
|
}}</span>
|
||||||
</div>
|
</div>
|
||||||
<div v-html="item.description" class="mt-1 font-light text-blue-200 item-description"></div>
|
<div
|
||||||
|
v-html="item.description"
|
||||||
|
class="mt-1 font-light text-blue-200 item-description"
|
||||||
|
></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -45,6 +56,19 @@ export default {
|
||||||
type: Array,
|
type: Array,
|
||||||
required: true
|
required: true
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
itemLink(item) {
|
||||||
|
if (!item) {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
// Fix to still make work the old items links (before season 11)
|
||||||
|
const originalUrl = item.image
|
||||||
|
const newUrl = originalUrl.includes('/global/default/assets/items/') ? originalUrl : originalUrl.replace('latest', '10.22')
|
||||||
|
return `url('${newUrl}')`
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue