fix: design adjustments
Smaller name, ellipsis for long name, indicator for number of roles/sheets/layers
This commit is contained in:
parent
c5be0b6b04
commit
8ccedbed8a
5 changed files with 43 additions and 33 deletions
|
@ -69,7 +69,7 @@ const createCard = (uuid : string) : Card => ({
|
|||
ppl: 0,
|
||||
})
|
||||
|
||||
const cards = useState('cards', () => [
|
||||
const cards = useState<Card[]>('cards', () => [
|
||||
createCard(crypto.randomUUID()),
|
||||
])
|
||||
|
||||
|
@ -120,7 +120,10 @@ const openDeleteModal = () => {
|
|||
}
|
||||
|
||||
const updateLocalStorage = () => {
|
||||
localStorage.setItem('cards', JSON.stringify(cards.value))
|
||||
localStorage.setItem('cards', JSON.stringify(cards.value.map(card => {
|
||||
const { uuid, name, price, roles, sheets, layers } = card
|
||||
return { uuid, name, price, roles, sheets, layers }
|
||||
})))
|
||||
localStorage.setItem('sort', JSON.stringify(currentSort.value))
|
||||
}
|
||||
|
||||
|
@ -166,14 +169,14 @@ const sort = (index : number) => {
|
|||
|
||||
const calculate = (card : Card) => {
|
||||
const ppr = +replaceComma(card.price) / +card.roles
|
||||
const pps = (ppr / +card.sheets) * 10
|
||||
const ppl = (pps / +card.layers) * 10
|
||||
const pps = (ppr / +card.sheets) * 100
|
||||
const ppl = (pps / +card.layers)
|
||||
|
||||
return { ppr, pps, ppl }
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
const cardsFromStorage = JSON.parse(localStorage.getItem('cards') ?? '[]')
|
||||
const cardsFromStorage = JSON.parse(localStorage.getItem('cards') ?? '[]').map((card : Card) => ({ ...card, ...calculate(card) }))
|
||||
cards.value = cardsFromStorage.length !== 0 ? cardsFromStorage : cards.value
|
||||
const sortFromStorage = +JSON.parse(localStorage.getItem('sort') ?? '0')
|
||||
sort(sortFromStorage)
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue