57 lines
1.2 KiB
Vue
57 lines
1.2 KiB
Vue
<!--
|
|
filename: ContainerIcon.vue
|
|
author: liubin
|
|
date: 2024-04-09 16:41:36
|
|
description:
|
|
-->
|
|
|
|
<template>
|
|
<div class="container-icon" :style="bgStyle"></div>
|
|
</template>
|
|
|
|
<script>
|
|
import prod from "@/assets/images/companyData/prod-minor.png";
|
|
import store from "@/assets/images/companyData/store.png";
|
|
import energy from "@/assets/images/companyData/energy.png";
|
|
import order from "@/assets/images/companyData/order.png";
|
|
|
|
export default {
|
|
name: "ContainerIcon",
|
|
components: {},
|
|
props: {
|
|
icon: {
|
|
type: String,
|
|
default: "prod",
|
|
},
|
|
},
|
|
data() {
|
|
return {};
|
|
},
|
|
computed: {
|
|
bgStyle() {
|
|
return {
|
|
prod:
|
|
"background: url(" + prod + ") no-repeat center center / 100% 100%",
|
|
store:
|
|
"background: url(" + store + ") no-repeat center center / 100% 100%",
|
|
energy:
|
|
"background: url(" + energy + ") no-repeat center center / 100% 100%",
|
|
order:
|
|
"background: url(" + order + ") no-repeat center center / 100% 100%",
|
|
}[this.icon];
|
|
},
|
|
},
|
|
methods: {},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.container-icon {
|
|
// width: 32px;
|
|
// height: 32px;
|
|
width: 1.701vw;
|
|
height: 1.701vw;
|
|
background: #ccc2;
|
|
}
|
|
</style>
|