Compare commits
2 Commits
07caa7c53c
...
3b13d78cdc
Author | SHA1 | Date | |
---|---|---|---|
3b13d78cdc | |||
d38faccf6f |
@ -183,13 +183,13 @@ export default function PlayerInventory({
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box sx={{ mt: 4 }}>
|
<Box sx={{ mt: '1vw' }}>
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
justifyContent: 'space-between',
|
gap: '1vw',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
mb: 2,
|
mb: '2vw',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Typography variant="h5" color="white">
|
<Typography variant="h5" color="white">
|
||||||
@ -199,6 +199,18 @@ export default function PlayerInventory({
|
|||||||
variant="outlined"
|
variant="outlined"
|
||||||
onClick={fetchPlayerInventory}
|
onClick={fetchPlayerInventory}
|
||||||
disabled={loading}
|
disabled={loading}
|
||||||
|
sx={{
|
||||||
|
borderRadius: '20px',
|
||||||
|
p: '10px 25px',
|
||||||
|
color: 'white',
|
||||||
|
borderColor: 'rgba(255, 77, 77, 1)',
|
||||||
|
'&:hover': {
|
||||||
|
backgroundColor: 'rgba(255, 77, 77, 1)',
|
||||||
|
borderColor: 'rgba(255, 77, 77, 1)',
|
||||||
|
},
|
||||||
|
fontFamily: 'Benzin-Bold',
|
||||||
|
fontSize: '1vw',
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
Обновить
|
Обновить
|
||||||
</Button>
|
</Button>
|
||||||
@ -235,28 +247,33 @@ export default function PlayerInventory({
|
|||||||
cursor: 'pointer',
|
cursor: 'pointer',
|
||||||
transition: 'transform 0.2s',
|
transition: 'transform 0.2s',
|
||||||
'&:hover': { transform: 'scale(1.03)' },
|
'&:hover': { transform: 'scale(1.03)' },
|
||||||
|
borderRadius: '1vw',
|
||||||
}}
|
}}
|
||||||
onClick={() => handleOpenSellDialog(item)}
|
onClick={() => handleOpenSellDialog(item)}
|
||||||
>
|
>
|
||||||
<CardMedia
|
<CardMedia
|
||||||
component="img"
|
component="img"
|
||||||
sx={{
|
sx={{
|
||||||
height: 100,
|
minWidth: '10vw',
|
||||||
|
minHeight: '10vw',
|
||||||
|
maxHeight: '10vw',
|
||||||
objectFit: 'contain',
|
objectFit: 'contain',
|
||||||
bgcolor: 'rgba(0, 0, 0, 0.2)',
|
bgcolor: 'white',
|
||||||
p: 1,
|
p: '1vw',
|
||||||
imageRendering: 'pixelated',
|
imageRendering: 'pixelated',
|
||||||
}}
|
}}
|
||||||
image={`/minecraft/${item.material.toLowerCase()}.png`}
|
image={`/minecraft/${item.material.toLowerCase()}.png`}
|
||||||
alt={item.material}
|
alt={item.material}
|
||||||
/>
|
/>
|
||||||
<CardContent sx={{ p: 1 }}>
|
<CardContent sx={{ p: 1 }}>
|
||||||
<Typography variant="body2" color="white" noWrap>
|
<Box sx={{ display: 'flex', gap: '1vw', justifyContent: 'space-between' }}>
|
||||||
{getItemDisplayName(item.material)}
|
<Typography variant="body2" color="white" noWrap>
|
||||||
</Typography>
|
{getItemDisplayName(item.material)}
|
||||||
<Typography variant="body2" color="white">
|
</Typography>
|
||||||
x{item.amount}
|
<Typography variant="body2" color="white">
|
||||||
</Typography>
|
{item.amount > 1 ? `x${item.amount}` : ''}
|
||||||
|
</Typography>
|
||||||
|
</Box>
|
||||||
{Object.keys(item.enchants || {}).length > 0 && (
|
{Object.keys(item.enchants || {}).length > 0 && (
|
||||||
<Typography
|
<Typography
|
||||||
variant="caption"
|
variant="caption"
|
||||||
|
@ -178,7 +178,7 @@ export default function TopBar({ onRegister, username }: TopBarProps) {
|
|||||||
color: 'rgba(255, 77, 77, 1)',
|
color: 'rgba(255, 77, 77, 1)',
|
||||||
},
|
},
|
||||||
'&:hover': {
|
'&:hover': {
|
||||||
color: 'rgb(199, 199, 199)',
|
color: 'rgb(177, 52, 52)',
|
||||||
},
|
},
|
||||||
transition: 'all 0.3s ease',
|
transition: 'all 0.3s ease',
|
||||||
}}
|
}}
|
||||||
@ -197,7 +197,7 @@ export default function TopBar({ onRegister, username }: TopBarProps) {
|
|||||||
color: 'rgba(255, 77, 77, 1)',
|
color: 'rgba(255, 77, 77, 1)',
|
||||||
},
|
},
|
||||||
'&:hover': {
|
'&:hover': {
|
||||||
color: 'rgb(199, 199, 199)',
|
color: 'rgb(177, 52, 52)',
|
||||||
},
|
},
|
||||||
transition: 'all 0.3s ease',
|
transition: 'all 0.3s ease',
|
||||||
}}
|
}}
|
||||||
@ -216,7 +216,7 @@ export default function TopBar({ onRegister, username }: TopBarProps) {
|
|||||||
color: 'rgba(255, 77, 77, 1)',
|
color: 'rgba(255, 77, 77, 1)',
|
||||||
},
|
},
|
||||||
'&:hover': {
|
'&:hover': {
|
||||||
color: 'rgb(199, 199, 199)',
|
color: 'rgb(177, 52, 52)',
|
||||||
},
|
},
|
||||||
transition: 'all 0.3s ease',
|
transition: 'all 0.3s ease',
|
||||||
}}
|
}}
|
||||||
@ -235,7 +235,7 @@ export default function TopBar({ onRegister, username }: TopBarProps) {
|
|||||||
color: 'rgba(255, 77, 77, 1)',
|
color: 'rgba(255, 77, 77, 1)',
|
||||||
},
|
},
|
||||||
'&:hover': {
|
'&:hover': {
|
||||||
color: 'rgb(199, 199, 199)',
|
color: 'rgb(177, 52, 52)',
|
||||||
},
|
},
|
||||||
transition: 'all 0.3s ease',
|
transition: 'all 0.3s ease',
|
||||||
}}
|
}}
|
||||||
|
@ -63,6 +63,19 @@ export default function Marketplace() {
|
|||||||
type: 'success',
|
type: 'success',
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const translateServer = (server: Server) => {
|
||||||
|
switch (server.name) {
|
||||||
|
case 'Server minecraft.hub.popa-popa.ru':
|
||||||
|
return 'Хаб';
|
||||||
|
case 'Server survival.hub.popa-popa.ru':
|
||||||
|
return 'Выживание';
|
||||||
|
case 'Server minecraft.minigames.popa-popa.ru':
|
||||||
|
return 'Миниигры';
|
||||||
|
default:
|
||||||
|
return server.name;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
// Функция для проверки онлайн-статуса игрока и определения сервера
|
// Функция для проверки онлайн-статуса игрока и определения сервера
|
||||||
const checkPlayerStatus = async () => {
|
const checkPlayerStatus = async () => {
|
||||||
if (!username) return;
|
if (!username) return;
|
||||||
@ -241,32 +254,81 @@ export default function Marketplace() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box sx={{ padding: 3 }}>
|
<Box sx={{ padding: 3, width: '95%', height: '80%' }}>
|
||||||
<Typography variant="h4" color="white" gutterBottom>
|
<Box sx={{ display: 'flex', alignItems: 'center', gap: '1vw' }}>
|
||||||
Рынок сервера {playerServer?.name || ''}
|
<Typography variant="h4" color="white" gutterBottom>
|
||||||
</Typography>
|
Рынок сервера{' '}
|
||||||
|
</Typography>
|
||||||
|
<Typography
|
||||||
|
style={{
|
||||||
|
color: 'white',
|
||||||
|
backgroundColor: 'rgba(255, 77, 77, 1)',
|
||||||
|
padding: '0vw 2vw',
|
||||||
|
borderRadius: '5vw',
|
||||||
|
fontFamily: 'Benzin-Bold',
|
||||||
|
textAlign: 'center',
|
||||||
|
fontSize: '2vw',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{translateServer(playerServer || { name: '' })}
|
||||||
|
</Typography>
|
||||||
|
</Box>
|
||||||
|
|
||||||
{/* Вкладки */}
|
{/* Вкладки */}
|
||||||
<Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
|
<Box sx={{ borderBottom: 1, borderColor: 'transparent' }}>
|
||||||
<Tabs
|
<Tabs
|
||||||
value={tabValue}
|
value={tabValue}
|
||||||
onChange={handleTabChange}
|
onChange={handleTabChange}
|
||||||
aria-label="marketplace tabs"
|
aria-label="marketplace tabs"
|
||||||
|
disableRipple={true}
|
||||||
|
sx={{
|
||||||
|
'& .MuiTabs-indicator': {
|
||||||
|
backgroundColor: 'rgba(255, 77, 77, 1)',
|
||||||
|
},
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<Tab label="Товары" />
|
<Tab
|
||||||
<Tab label="Мой инвентарь" />
|
label="Товары"
|
||||||
|
disableRipple={true}
|
||||||
|
sx={{
|
||||||
|
fontFamily: 'Benzin-Bold',
|
||||||
|
color: 'white',
|
||||||
|
'&.Mui-selected': {
|
||||||
|
color: 'rgba(255, 77, 77, 1)',
|
||||||
|
},
|
||||||
|
'&:hover': {
|
||||||
|
color: 'rgba(255, 77, 77, 1)',
|
||||||
|
},
|
||||||
|
transition: 'all 0.3s ease',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<Tab
|
||||||
|
label="Мой инвентарь"
|
||||||
|
disableRipple={true}
|
||||||
|
sx={{
|
||||||
|
fontFamily: 'Benzin-Bold',
|
||||||
|
color: 'white',
|
||||||
|
'&.Mui-selected': {
|
||||||
|
color: 'rgba(255, 77, 77, 1)',
|
||||||
|
},
|
||||||
|
'&:hover': {
|
||||||
|
color: 'rgba(255, 77, 77, 1)',
|
||||||
|
},
|
||||||
|
transition: 'all 0.3s ease',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
</Tabs>
|
</Tabs>
|
||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
{/* Содержимое вкладки "Товары" */}
|
{/* Содержимое вкладки "Товары" */}
|
||||||
<TabPanel value={tabValue} index={0}>
|
<TabPanel value={tabValue} index={0}>
|
||||||
{marketLoading ? (
|
{marketLoading ? (
|
||||||
<Box sx={{ display: 'flex', justifyContent: 'center', mt: 4 }}>
|
<Box sx={{ display: 'flex', justifyContent: 'center', mt: '50vw' }}>
|
||||||
<CircularProgress />
|
<CircularProgress />
|
||||||
</Box>
|
</Box>
|
||||||
) : !marketItems || marketItems.items.length === 0 ? (
|
) : !marketItems || marketItems.items.length === 0 ? (
|
||||||
<Box sx={{ mt: 4, textAlign: 'center' }}>
|
<Box sx={{ mt: 4, textAlign: 'center' }}>
|
||||||
<Typography variant="h6" color="white">
|
<Typography variant="h6" color="white" sx={{ mt: '10vw' }}>
|
||||||
На данный момент на рынке нет предметов.
|
На данный момент на рынке нет предметов.
|
||||||
</Typography>
|
</Typography>
|
||||||
<Button
|
<Button
|
||||||
@ -275,7 +337,18 @@ export default function Marketplace() {
|
|||||||
onClick={() =>
|
onClick={() =>
|
||||||
playerServer && loadMarketItems(playerServer.ip, 1)
|
playerServer && loadMarketItems(playerServer.ip, 1)
|
||||||
}
|
}
|
||||||
sx={{ mt: 2 }}
|
sx={{
|
||||||
|
mt: 2,
|
||||||
|
borderRadius: '20px',
|
||||||
|
p: '10px 25px',
|
||||||
|
color: 'white',
|
||||||
|
backgroundColor: 'rgb(255, 77, 77)',
|
||||||
|
'&:hover': {
|
||||||
|
backgroundColor: 'rgba(255, 77, 77, 0.5)',
|
||||||
|
},
|
||||||
|
fontFamily: 'Benzin-Bold',
|
||||||
|
fontSize: '1vw',
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
Обновить
|
Обновить
|
||||||
</Button>
|
</Button>
|
||||||
@ -285,14 +358,21 @@ export default function Marketplace() {
|
|||||||
<Grid container spacing={2} sx={{ mt: 2 }}>
|
<Grid container spacing={2} sx={{ mt: 2 }}>
|
||||||
{marketItems.items.map((item) => (
|
{marketItems.items.map((item) => (
|
||||||
<Grid item xs={12} sm={6} md={4} lg={3} key={item.id}>
|
<Grid item xs={12} sm={6} md={4} lg={3} key={item.id}>
|
||||||
<Card sx={{ bgcolor: 'rgba(255, 255, 255, 0.05)' }}>
|
<Card
|
||||||
|
sx={{
|
||||||
|
bgcolor: 'rgba(255, 255, 255, 0.05)',
|
||||||
|
borderRadius: '1vw',
|
||||||
|
}}
|
||||||
|
>
|
||||||
<CardMedia
|
<CardMedia
|
||||||
component="img"
|
component="img"
|
||||||
sx={{
|
sx={{
|
||||||
height: 140,
|
minWidth: '10vw',
|
||||||
|
minHeight: '10vw',
|
||||||
|
maxHeight: '10vw',
|
||||||
objectFit: 'contain',
|
objectFit: 'contain',
|
||||||
bgcolor: 'rgba(0, 0, 0, 0.2)',
|
bgcolor: 'white',
|
||||||
p: 1,
|
p: '1vw',
|
||||||
imageRendering: 'pixelated',
|
imageRendering: 'pixelated',
|
||||||
}}
|
}}
|
||||||
image={`/minecraft/${item.material.toLowerCase()}.png`}
|
image={`/minecraft/${item.material.toLowerCase()}.png`}
|
||||||
@ -323,7 +403,18 @@ export default function Marketplace() {
|
|||||||
variant="contained"
|
variant="contained"
|
||||||
color="primary"
|
color="primary"
|
||||||
fullWidth
|
fullWidth
|
||||||
sx={{ mt: 2 }}
|
sx={{
|
||||||
|
mt: '1vw',
|
||||||
|
borderRadius: '20px',
|
||||||
|
p: '0.3vw 0vw',
|
||||||
|
color: 'white',
|
||||||
|
backgroundColor: 'rgb(255, 77, 77)',
|
||||||
|
'&:hover': {
|
||||||
|
backgroundColor: 'rgba(255, 77, 77, 0.5)',
|
||||||
|
},
|
||||||
|
fontFamily: 'Benzin-Bold',
|
||||||
|
fontSize: '1vw',
|
||||||
|
}}
|
||||||
onClick={() => handleBuyItem(item.id)}
|
onClick={() => handleBuyItem(item.id)}
|
||||||
>
|
>
|
||||||
Купить
|
Купить
|
||||||
|
Reference in New Issue
Block a user