|  |  |  | 
|---|
|  |  |  | src="@/assets/images/ic_up.webp" alt="" /> | 
|---|
|  |  |  | <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" /> | 
|---|
|  |  |  | <span class="val" | 
|---|
|  |  |  | v-if="data1.electricityQuantity.totalNum && data1.electricityQuantity.totalNum != 0">{{ | 
|---|
|  |  |  | v-if="data1.electricityQuantity.sameNum && data1.electricityQuantity.sameNum != 0">{{ | 
|---|
|  |  |  | Math.abs(((data1.electricityQuantity.totalNum - | 
|---|
|  |  |  | data1.electricityQuantity.sameNum) / data1.electricityQuantity.totalNum * 100).toFixed(1)) | 
|---|
|  |  |  | data1.electricityQuantity.sameNum) / data1.electricityQuantity.sameNum * 100).toFixed(1)) | 
|---|
|  |  |  | }}%</span> | 
|---|
|  |  |  | <span class="val" v-else style="margin-left: 4px;"> -</span> | 
|---|
|  |  |  | <span class="lab">环比</span> | 
|---|
|  |  |  | 
|---|
|  |  |  | src="@/assets/images/ic_up.webp" alt="" /> | 
|---|
|  |  |  | <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" /> | 
|---|
|  |  |  | <span class="val" | 
|---|
|  |  |  | v-if="data1.electricityQuantity.totalNum && data1.electricityQuantity.totalNum != 0">{{ | 
|---|
|  |  |  | v-if="data1.electricityQuantity.ringNum && data1.electricityQuantity.ringNum != 0">{{ | 
|---|
|  |  |  | Math.abs(((data1.electricityQuantity.totalNum - | 
|---|
|  |  |  | data1.electricityQuantity.ringNum) / data1.electricityQuantity.totalNum * 100).toFixed(1)) | 
|---|
|  |  |  | data1.electricityQuantity.ringNum) / data1.electricityQuantity.ringNum * 100).toFixed(1)) | 
|---|
|  |  |  | }}%</span> | 
|---|
|  |  |  | <span class="val" v-else style="margin-left: 4px;"> -</span> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | <img v-if="data1.gasQuantity.totalNum > data1.gasQuantity.sameNum" class="icon" | 
|---|
|  |  |  | src="@/assets/images/ic_up.webp" alt="" /> | 
|---|
|  |  |  | <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" /> | 
|---|
|  |  |  | <span class="val" v-if="data1.gasQuantity.totalNum && data1.gasQuantity.totalNum != 0">{{ | 
|---|
|  |  |  | Math.abs(((data1.gasQuantity.totalNum - data1.gasQuantity.sameNum) / data1.gasQuantity.totalNum | 
|---|
|  |  |  | <span class="val" v-if="data1.gasQuantity.sameNum && data1.gasQuantity.sameNum != 0">{{ | 
|---|
|  |  |  | Math.abs(((data1.gasQuantity.totalNum - data1.gasQuantity.sameNum) / data1.gasQuantity.sameNum | 
|---|
|  |  |  | * 100).toFixed(1)) | 
|---|
|  |  |  | }}%</span> | 
|---|
|  |  |  | <span class="val" v-else style="margin-left: 4px;">-</span> | 
|---|
|  |  |  | 
|---|
|  |  |  | <img v-if="data1.gasQuantity.totalNum > data1.gasQuantity.ringNum" class="icon" | 
|---|
|  |  |  | src="@/assets/images/ic_up.webp" alt="" /> | 
|---|
|  |  |  | <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" /> | 
|---|
|  |  |  | <span class="val" v-if="data1.gasQuantity.totalNum && data1.gasQuantity.totalNum != 0">{{ | 
|---|
|  |  |  | Math.abs(((data1.gasQuantity.totalNum - data1.gasQuantity.ringNum) / data1.gasQuantity.totalNum | 
|---|
|  |  |  | <span class="val" v-if="data1.gasQuantity.ringNum && data1.gasQuantity.ringNum != 0">{{ | 
|---|
|  |  |  | Math.abs(((data1.gasQuantity.totalNum - data1.gasQuantity.ringNum) / data1.gasQuantity.ringNum | 
|---|
|  |  |  | * 100).toFixed(1)) | 
|---|
|  |  |  | }}%</span> | 
|---|
|  |  |  | <span class="val" v-else style="margin-left: 4px;">-</span> | 
|---|
|  |  |  | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | <div class="bottom_wrap" v-if="data1.yesterdayElectricity"> | 
|---|
|  |  |  | <div class="bottom bottom1" @click="changeacDay(3)"> | 
|---|
|  |  |  | <div :class="{ active: activeDays == 3 }" class="num fs_linear">{{ data1.yesterdayElectricity.total || 0 | 
|---|
|  |  |  | <div :class="{ active: activeDays == 3 }" class="num fs_linear">{{ dataObj6.obj1.total || 0 | 
|---|
|  |  |  | }}</div> | 
|---|
|  |  |  | <div class="name">昨日用电</div> | 
|---|
|  |  |  | <div class="unit">kw·h</div> | 
|---|
|  |  |  | 
|---|
|  |  |  | <img v-else src="@/assets/images/ic_dianliang_b@2x.png" class="bg" alt="" /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="bottom bottom2" @click="changeacDay(1)"> | 
|---|
|  |  |  | <div :class="{ active: activeDays == 1 }" class="num">{{ data1.todayElectricity.total || 0 }}</div> | 
|---|
|  |  |  | <div :class="{ active: activeDays == 1 }" class="num">{{ dataObj6.obj2.total || 0 }}</div> | 
|---|
|  |  |  | <div class="name">今日用电</div> | 
|---|
|  |  |  | <div class="unit">kw·h</div> | 
|---|
|  |  |  | <img v-if="activeDays == 1" src="@/assets/images/ic_dianliang@2x.png" class="bg" alt="" /> | 
|---|
|  |  |  | <img v-else src="@/assets/images/ic_dianliang_b@2x.png" class="bg" alt="" /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="bottom bottom3" @click="changeacDay(2)"> | 
|---|
|  |  |  | <div :class="{ active: activeDays == 2 }" class="num fs_linear">{{ data1.monthElectricity.total || 0 }} | 
|---|
|  |  |  | <div :class="{ active: activeDays == 2 }" class="num fs_linear">{{ dataObj6.obj3.total || 0 }} | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="name">本月用电</div> | 
|---|
|  |  |  | <div class="unit">kw·h</div> | 
|---|
|  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | const activeDays = ref('1') | 
|---|
|  |  |  | const data6 = ref({}) | 
|---|
|  |  |  | const data6 = ref([]) | 
|---|
|  |  |  | const dataObj6 = ref({ | 
|---|
|  |  |  | obj1: { total: 0 }, | 
|---|
|  |  |  | obj2: { total: 0 }, | 
|---|
|  |  |  | obj3: { total: 0 }, | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | const changeacDay = (val) => { | 
|---|
|  |  |  | activeDays.value = val | 
|---|
|  |  |  | getData6() | 
|---|
|  |  |  | if (val == 3) { | 
|---|
|  |  |  | data6.value = dataObj6.value.obj1.list | 
|---|
|  |  |  | } else if (val == 1) { | 
|---|
|  |  |  | data6.value = dataObj6.value.obj2.list | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | data6.value = dataObj6.value.obj3.list | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const getData6 = () => { | 
|---|
|  |  |  | regionDataRanking({ type: activeDays.value }).then(res => { | 
|---|
|  |  |  | const result = res.data || {} | 
|---|
|  |  |  | data6.value = result | 
|---|
|  |  |  | let obj = { | 
|---|
|  |  |  | obj1: { list: [], total: 0 }, | 
|---|
|  |  |  | obj2: { list: [], total: 0 }, | 
|---|
|  |  |  | obj3: { list: [], total: 0 }, | 
|---|
|  |  |  | } | 
|---|
|  |  |  | regionDataRanking({ type: 3 }).then(res => { | 
|---|
|  |  |  | let arr = res.data || [] | 
|---|
|  |  |  | obj.obj1.list = arr | 
|---|
|  |  |  | arr.forEach(i => { | 
|---|
|  |  |  | obj.obj1.total += Number(i.value) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | obj.obj1.total = obj.obj1.total.toFixed(1) | 
|---|
|  |  |  | dataObj6.value = obj | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | regionDataRanking({ type: 1 }).then(res => { | 
|---|
|  |  |  | let arr = res.data || [] | 
|---|
|  |  |  | obj.obj2.list = arr | 
|---|
|  |  |  | arr.forEach(i => { | 
|---|
|  |  |  | obj.obj2.total += Number(i.value) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | obj.obj2.total = obj.obj2.total.toFixed(1) | 
|---|
|  |  |  | dataObj6.value = obj | 
|---|
|  |  |  | changeacDay(1) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | regionDataRanking({ type: 2 }).then(res => { | 
|---|
|  |  |  | let arr = res.data || [] | 
|---|
|  |  |  | obj.obj3.list = arr | 
|---|
|  |  |  | arr.forEach(i => { | 
|---|
|  |  |  | obj.obj3.total += Number(i.value) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | obj.obj3.total = obj.obj3.total.toFixed(1) | 
|---|
|  |  |  | dataObj6.value = obj | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|