add icon&scrollbar
This commit is contained in:
parent
4c2bca6c76
commit
3ca4412f23
@ -8,7 +8,7 @@
|
||||
<template>
|
||||
<chart-container class="chip-invest-chart">
|
||||
<div class="chart-title">chip-invest</div>
|
||||
<div class="chart-body">
|
||||
<div class="chart-body" style="width: 1000px; background: #f024;">
|
||||
<div class="chart-item">chip-invest</div>
|
||||
<div class="chart-item">chip-invest</div>
|
||||
<div class="chart-item">chip-invest</div>
|
||||
|
@ -30,5 +30,31 @@ export default {
|
||||
background: #151516;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button {
|
||||
width: 0;
|
||||
height: 0;
|
||||
// width: 10px;
|
||||
// height: 10px;
|
||||
// background: #14305f;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: #14305f;
|
||||
border: 0 none;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #004798;
|
||||
border: 0 none;
|
||||
border-radius: 6px;
|
||||
}
|
||||
</style>
|
||||
|
@ -6,18 +6,43 @@
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div class="container-icon"></div>
|
||||
<div class="container-icon" :style="bgStyle"></div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import cube from "@/assets/images/homeindex/fto-icon.png";
|
||||
import chip from "@/assets/images/homeindex/chip-icon.png";
|
||||
import chip2 from "@/assets/images/homeindex/chip-icon-2.png";
|
||||
import bipv from "@/assets/images/homeindex/bipv-icon.png";
|
||||
import std from "@/assets/images/homeindex/std-icon.png";
|
||||
|
||||
export default {
|
||||
name: "ContainerIcon",
|
||||
components: {},
|
||||
props: {},
|
||||
props: {
|
||||
icon: {
|
||||
type: String,
|
||||
default: "cube",
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
computed: {},
|
||||
computed: {
|
||||
bgStyle() {
|
||||
return {
|
||||
cube:
|
||||
"background: url(" + cube + ") no-repeat center center / 100% 100%",
|
||||
chip:
|
||||
"background: url(" + chip + ") no-repeat center center / 100% 100%",
|
||||
chip2:
|
||||
"background: url(" + chip2 + ") no-repeat center center / 100% 100%",
|
||||
bipv:
|
||||
"background: url(" + bipv + ") no-repeat center center / 100% 100%",
|
||||
std: "background: url(" + std + ") no-repeat center center / 100% 100%",
|
||||
}[this.icon];
|
||||
},
|
||||
},
|
||||
methods: {},
|
||||
};
|
||||
</script>
|
||||
|
@ -8,14 +8,14 @@
|
||||
<db-container icon="cube" title="FTO投入">
|
||||
<fto-chart />
|
||||
</db-container>
|
||||
<db-container icon="chip" title="芯片投入">
|
||||
<db-container icon="chip2" title="芯片投入">
|
||||
<chip-invest-chart />
|
||||
</db-container>
|
||||
</div>
|
||||
<div class="db-right">
|
||||
<db-container
|
||||
side="right"
|
||||
icon="chip2"
|
||||
icon="chip"
|
||||
title="芯片产出"
|
||||
></db-container>
|
||||
<db-container
|
||||
@ -25,7 +25,7 @@
|
||||
></db-container>
|
||||
<db-container
|
||||
side="right"
|
||||
icon="stack"
|
||||
icon="bipv"
|
||||
title="BIPV产出"
|
||||
></db-container>
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user