CNCEC_APP/pages/index/board/qms/qualityCard.vue

75 lines
1.3 KiB
Vue

<template>
<ChartCard margin="30rpx 0 0 0" title="项目质量检查数">
<view class="defect">
<!-- <u-subsection :list="list" :current="current" @change="handleChange"></u-subsection> -->
<view class="defect-main u-flex u-row-between">
<view class="defect-box gb-rectified">
<text class="defect-box-lab">项目质量检查数</text>
<text class="defect-box-num u-margin-top-20">20</text>
</view>
</view>
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue';
import { ref, watch } from 'vue';
const current = ref(0);
const list = ref([
{
name: '集团级'
},
{
name: '企业级'
},
{
name: '分支机构'
},
{
name: '项目级'
}
]);
const handleChange = () => {};
</script>
<style lang="scss">
.defect {
&-main {
height: 120rpx;
}
&-box {
width:100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
&-lab {
font-size: 24rpx;
color: #ffffff;
}
&-num {
font-size: 28rpx;
font-weight: 600;
color: #ffffff;
}
}
}
.gb-all {
background: linear-gradient(to top right, #9e9e9e, #dcdcdc);
}
.gb-not-rectified {
background: linear-gradient(to top right, #ffd626, #ff9f7d);
}
.gb-rectified {
background: linear-gradient(to top right, #2488fa, #79baff);
}
</style>