50 lines
1.3 KiB
Vue
50 lines
1.3 KiB
Vue
|
<template>
|
||
|
|
|
||
|
|
<ChartCard margin="30rpx 0 0 0" title="计量器具数据">
|
||
|
|
<view class="measuring u-flex">
|
||
|
|
<view class="measuring-box u-flex u-row-center">
|
||
|
|
<view class="measuring-box-icon"> <u-icon name="jiliangqijujianguan" color="#e28ea3" custom-prefix="custom-icon" size="60" ></u-icon></view>
|
||
|
|
<view class="measuring-box-row u-padding-left-20">
|
||
|
|
<text class="measuring-box-row-num">900台</text>
|
||
|
|
<text class="measuring-box-row-lab">计量器具</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="measuring-box u-flex u-row-center">
|
||
|
|
<view class="measuring-box-icon"> <u-icon name="hege" color="#3bdae2" custom-prefix="custom-icon" size="60" ></u-icon></view>
|
||
|
|
<view class="measuring-box-row u-padding-left-20">
|
||
|
|
<text class="measuring-box-row-num">9000台</text>
|
||
|
|
<text class="measuring-box-row-lab">检验合格</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</ChartCard>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import ChartCard from '@/components/chartCard.vue'
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss">
|
||
|
|
.measuring{
|
||
|
|
padding: 20rpx 0;
|
||
|
|
&-box{
|
||
|
|
flex: 1;
|
||
|
|
&-row{
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: flex-start;
|
||
|
|
&-lab{
|
||
|
|
font-size: 24rpx;
|
||
|
|
color: #999999;
|
||
|
|
margin-top: 12rpx;
|
||
|
|
}
|
||
|
|
&-num{
|
||
|
|
color: #333333;
|
||
|
|
font-size: 28rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|