From 4a800a8fc83c6bd1f86a8e847b079a51a7532c09 Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@smartai.com> Date: 星期三, 20 七月 2022 15:05:58 +0800 Subject: [PATCH] 修复国标配置的bug --- src/pages/internetEquipment/components/helemetHead.vue | 79 +++++++++++++++++++++++---------------- 1 files changed, 46 insertions(+), 33 deletions(-) diff --git a/src/pages/internetEquipment/components/helemetHead.vue b/src/pages/internetEquipment/components/helemetHead.vue index ee54200..b81f365 100644 --- a/src/pages/internetEquipment/components/helemetHead.vue +++ b/src/pages/internetEquipment/components/helemetHead.vue @@ -1,54 +1,67 @@ <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" - :icon="item.icon" :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:"璁惧鎬婚噺",icon:"\ue743",color:"#4E94FF"}, - {number:34,info:"鏈湀鏂板",icon:"\ue743",color:"#FFAA44"}, - {number:45,info:"浠婃棩棰勮",icon:"\ue743",color:"#FF6464"}, - ] - } - }, - components :{ - headCard, - helemetEchart - } - -} + async created() { + const res = await getBanner(); + this.cardData[0].number = res.data.deviceAmount; + this.cardData[1].number = res.data.newDevice; + this.cardData[2].number = res.data.todayAdded; + }, + data() { + return { + cardData: [ + { number: 0, info: "璁惧鎬婚噺", color: "#4E94FF" }, + { number: 0, info: "鏈湀鏂板", color: "#FFAA44" }, + { number: 0, 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 { + flex: 1; + 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 { + flex: 4; + 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