commit
0b91ae22ad
@ -660,10 +660,4 @@ export default {
|
|||||||
to { transform: translate(-50%, -50%) rotate(-360deg); }
|
to { transform: translate(-50%, -50%) rotate(-360deg); }
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 调试用:添加边框查看元素位置(如果需要调试可以取消注释) */
|
|
||||||
/*
|
|
||||||
.bg1, .bg2, .bg3 {
|
|
||||||
border: 1px solid red;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -537,12 +537,12 @@ export default {
|
|||||||
}
|
}
|
||||||
.two{
|
.two{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 1rem;
|
left: 1.1rem;
|
||||||
top: .24rem;
|
top: .24rem;
|
||||||
}
|
}
|
||||||
.three{
|
.three{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 1.7rem;
|
left: 1.9rem;
|
||||||
top: .24rem;
|
top: .24rem;
|
||||||
}
|
}
|
||||||
.top-tit {
|
.top-tit {
|
||||||
|
|||||||
@ -84,6 +84,11 @@ import img2 from '../images/2.png'
|
|||||||
import img3 from '../images/3.png'
|
import img3 from '../images/3.png'
|
||||||
import img4 from '../images/4.png'
|
import img4 from '../images/4.png'
|
||||||
import img5 from '../images/5.png'
|
import img5 from '../images/5.png'
|
||||||
|
import img6 from '../images/6.png'
|
||||||
|
import img7 from '../images/7.png'
|
||||||
|
import img8 from '../images/8.png'
|
||||||
|
import img9 from '../images/9.png'
|
||||||
|
import img10 from '../images/10.png'
|
||||||
import { dataManager } from "@/utils/data-manager.js";
|
import { dataManager } from "@/utils/data-manager.js";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
@ -165,7 +170,13 @@ export default {
|
|||||||
2: img2,
|
2: img2,
|
||||||
3: img3,
|
3: img3,
|
||||||
4: img4,
|
4: img4,
|
||||||
5: img5
|
5: img5,
|
||||||
|
6: img6,
|
||||||
|
7: img7,
|
||||||
|
8: img8,
|
||||||
|
9: img9,
|
||||||
|
10: img10
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// 确保数据至少有5条,不足时用空数据填充
|
// 确保数据至少有5条,不足时用空数据填充
|
||||||
@ -173,13 +184,13 @@ export default {
|
|||||||
for (let i = 0; i < Math.max(5, userData.length); i++) {
|
for (let i = 0; i < Math.max(5, userData.length); i++) {
|
||||||
if (userData[i]) {
|
if (userData[i]) {
|
||||||
tableData.push([
|
tableData.push([
|
||||||
`<div class="rank-img"><img src="${imgMap[i + 1] || img5}" /></div>`,
|
`<div class="rank-img"><img src="${imgMap[i + 1]}" /></div>`,
|
||||||
userData[i].name,
|
userData[i].name,
|
||||||
`¥${userData[i].amount.toLocaleString()}`
|
`¥${userData[i].amount.toLocaleString()}`
|
||||||
]);
|
]);
|
||||||
} else {
|
} else {
|
||||||
tableData.push([
|
tableData.push([
|
||||||
`<div class="rank-img"><img src="${imgMap[i + 1] || img5}" /></div>`,
|
`<div class="rank-img"><img src="${imgMap[i + 1] }" /></div>`,
|
||||||
`用户${i + 1}`,
|
`用户${i + 1}`,
|
||||||
'¥0'
|
'¥0'
|
||||||
]);
|
]);
|
||||||
|
|||||||
BIN
f/web-kboss/src/views/product/bigScreen/Newscreen/images/10.png
Normal file
BIN
f/web-kboss/src/views/product/bigScreen/Newscreen/images/10.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
f/web-kboss/src/views/product/bigScreen/Newscreen/images/6.png
Normal file
BIN
f/web-kboss/src/views/product/bigScreen/Newscreen/images/6.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
f/web-kboss/src/views/product/bigScreen/Newscreen/images/7.png
Normal file
BIN
f/web-kboss/src/views/product/bigScreen/Newscreen/images/7.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
f/web-kboss/src/views/product/bigScreen/Newscreen/images/8.png
Normal file
BIN
f/web-kboss/src/views/product/bigScreen/Newscreen/images/8.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
f/web-kboss/src/views/product/bigScreen/Newscreen/images/9.png
Normal file
BIN
f/web-kboss/src/views/product/bigScreen/Newscreen/images/9.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
@ -111,64 +111,4 @@ img {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 响应式布局适配 */
|
|
||||||
@media (max-width: 1920px) {
|
|
||||||
.center {
|
|
||||||
.left,
|
|
||||||
.right {
|
|
||||||
width: 28%;
|
|
||||||
}
|
|
||||||
.content {
|
|
||||||
width: 44%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 1600px) {
|
|
||||||
.center {
|
|
||||||
.left,
|
|
||||||
.right {
|
|
||||||
width: 25%;
|
|
||||||
}
|
|
||||||
.content {
|
|
||||||
width: 50%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 1366px) {
|
|
||||||
.center {
|
|
||||||
.left,
|
|
||||||
.right {
|
|
||||||
width: 22%;
|
|
||||||
min-width: 250px;
|
|
||||||
}
|
|
||||||
.content {
|
|
||||||
width: 56%;
|
|
||||||
min-width: 350px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.top {
|
|
||||||
min-height: 70px;
|
|
||||||
height: 7vh;
|
|
||||||
max-height: 100px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 1024px) {
|
|
||||||
.center {
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
.left,
|
|
||||||
.content,
|
|
||||||
.right {
|
|
||||||
width: 100%;
|
|
||||||
min-width: unset;
|
|
||||||
max-width: unset;
|
|
||||||
height: 33.33%;
|
|
||||||
min-height: 300px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user