From ff58b3c203ab46d41e447ea428138ba31e3362df Mon Sep 17 00:00:00 2001 From: ZZJ <zzjdsg2300@163.com> Date: 星期一, 22 十一月 2021 16:11:31 +0800 Subject: [PATCH] 图标替换 --- src/pages/internetEquipment/components/helemetHead.vue | 77 ++++++++++++++++++++------------------ 1 files changed, 40 insertions(+), 37 deletions(-) diff --git a/src/pages/internetEquipment/components/helemetHead.vue b/src/pages/internetEquipment/components/helemetHead.vue index b340d77..f54029e 100644 --- a/src/pages/internetEquipment/components/helemetHead.vue +++ b/src/pages/internetEquipment/components/helemetHead.vue @@ -1,59 +1,62 @@ <template> <div class="helemetHead"> - <headCard v-for="(item,index) in cardData" + <headCard + v-for="(item, index) in cardData" :key="index" :number="item.number" :info="item.info" :color="item.color" :src="cardImage[index]" - /> + /> - <helemetEchart /> - + <helemetEchart /> </div> </template> <script> -import headCard from '@/pages/internetEquipment/components/headCard' -import helemetEchart from '@/pages/internetEquipment/components/helemetEchart' +import headCard from "@/pages/internetEquipment/components/headCard"; +import helemetEchart from "@/pages/internetEquipment/components/helemetEchart"; +import { getBanner } from "@/api/helemt"; export default { - data (){ - return { - cardData: [ - {number:233,info:"璁惧鎬婚噺",color:"#4E94FF"}, - {number:34,info:"鏈湀鏂板",color:"#FFAA44"}, - {number:45,info:"浠婃棩棰勮",color:"#FF6464"}, - ], - cardImage: [ - '/images/InternetDevice/Group 441.png', - '/images/InternetDevice/Group 367.png', - '/images/InternetDevice/Group 368.png', - ] - } - }, - components :{ - headCard, - helemetEchart - } - -} + async created() { + const res = await getBanner(); + }, + data() { + return { + cardData: [ + { number: 233, info: "璁惧鎬婚噺", color: "#4E94FF" }, + { number: 34, info: "鏈湀鏂板", color: "#FFAA44" }, + { number: 45, info: "浠婃棩棰勮", color: "#FF6464" }, + ], + cardImage: [ + "/images/InternetDevice/Group 441.png", + "/images/InternetDevice/Group 367.png", + "/images/InternetDevice/Group 368.png", + ], + }; + }, + components: { + headCard, + helemetEchart, + }, +}; </script> <style scoped lang="scss"> .helemetHead { - display: flex; + display: flex; - .head-card { - margin-right: 10px; - } + .head-card { + margin-right: 10px; + } - .helemet-echart { - margin-left: 10px; - width: 570px; - height: 90px; - box-shadow: 0px 2px 10px rgba(141, 164, 187, 0.25); - border-radius: 15px; - } + .helemet-echart { + margin-left: 10px; + width: 570px; + height: 90px; + box-shadow: 0px 2px 10px rgba(141, 164, 187, 0.25); + border-radius: 15px; + } } </style> \ No newline at end of file -- Gitblit v1.8.0