Files
CNCEC_APP/pages/index/board/safe/defectTreatmentCard.vue
T
2026-08-17 11:01:21 +08:00

98 lines
2.2 KiB
Vue

<template>
<ChartCard margin="0 0 20rpx 0" title="项目安全检查数据">
<view class="defect">
<!-- <u-subsection :list="list" :current="current" @change="handleChange"></u-subsection> -->
<view class="defect-main u-flex u-row-between" @click="router.push('/pages/index/projectSafety/index')">
<!-- <view class="defect-box gb-all">
<text class="defect-box-lab">安全隐患</text>
<text class="defect-box-num u-margin-top-20">4567</text>
</view> -->
<view class="defect-box gb-rectified">
<text class="defect-box-lab">项目检查数</text>
<text class="defect-box-num u-margin-top-20">{{ hsseProblem?.ProjectProblemNum || 0 }}</text>
</view>
<view class="defect-box gb-rectified">
<text class="defect-box-lab">项目未完成数</text>
<text class="defect-box-num u-margin-top-20">{{ hsseProblem?.ProjectProblemNotCompletedNum || 0 }}</text>
</view>
<!-- <view class="defect-box gb-rectified-rate">
<text class="defect-box-lab">整改率</text>
<text class="defect-box-num u-margin-top-20">99.99%</text>
</view> -->
</view>
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue';
import { ref, watch } from 'vue';
import { router } from '@/utils'
let props = defineProps({
hsseProblem: {
type: Object,
default: () => {}
}
});
const current = ref(0);
const list = ref([
{
name: '集团级'
},
{
name: '公司级'
},
{
name: '项目级'
},
{
name: '分支机构'
}
]);
const handleChange = () => {};
</script>
<style lang="scss">
.defect {
&-main {
height: 120rpx;
}
&-box {
width: 100%;
// width: calc((100% - 40rpx) / 4);
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);
}
.gb-rectified-rate {
background: linear-gradient(to top right, #2ad192, #8df0c9);
}
</style>