This commit is contained in:
2026-03-25 14:54:15 +08:00
commit ab4646b43a
827 changed files with 123812 additions and 0 deletions
+65
View File
@@ -0,0 +1,65 @@
<template>
<ChartCard margin="0 0 30rpx 0" title="危大工程管控数据">
<view class="big-crisis">
<qiun-data-charts type="column" :opts="opts" :chartData="chartData" @getIndex="handleTap" />
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue'
import {
ref
} from 'vue';
import {
onReady
} from '@dcloudio/uni-app'
const opts = ref({
padding: [15, 15, 0, 5],
enableScroll: false,
legend: {
show: false
},
xAxis: {
disableGrid: true
},
yAxis: {
data: [{
min: 0
}]
},
extra: {
column: {
type: "group",
width: 20,
activeBgColor: "#000000",
activeBgOpacity: 0.08
}
}
})
const chartData = ref({})
const handleTap = (e) => {
console.log(e)
}
onReady(() => {
let res = {
categories: ["未开始", "进行中", "已完成", "培训人次", "作业人次"],
series: [{
data: [35, 36, 31, 33, 13]
}]
};
chartData.value = JSON.parse(JSON.stringify(res));
})
</script>
<style lang="scss">
.big-crisis {
width: 100%;
height: 400rpx;
}
</style>
+36
View File
@@ -0,0 +1,36 @@
<template>
<ChartCard margin="0 0 30rpx 0" title="安全费用" >
<view class="cost u-flex">
<view class="cost-box">
<view class="cost-box-lab">费用提取(亿元)</view>
<view class="cost-box-num u-margin-top-20">800</view>
</view>
<view class="cost-box">
<view class="cost-box-lab">费用使用(亿元)</view>
<view class="cost-box-num u-margin-top-20">800</view>
</view>
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue'
</script>
<style lang="scss">
.cost{
width: 100%;
&-box{
flex: 1;
&-lab{
color: #999999;
font-size: 24rpx;
}
&-num{
color: #333333;
font-size: 28rpx;
}
}
}
</style>
@@ -0,0 +1,94 @@
<template>
<ChartCard margin="0 0 30rpx 0" title="安全隐患排查治理">
<view class="defect">
<u-subsection :list="list" :current="current" @change="handleChange"></u-subsection>
<view class="defect-main u-flex u-row-between u-margin-top-20">
<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">20</text>
</view>
<view class="defect-box gb-not-rectified">
<text class="defect-box-lab">未整改</text>
<text class="defect-box-num u-margin-top-20">6</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';
const current = ref(0)
const list = ref([{
name: '集团级'
},
{
name: '公司级'
},
{
name: '项目级'
}, {
name: '分支机构'
}
])
const handleChange = () => {
}
</script>
<style lang="scss">
.defect {
&-main {
height: 120rpx;
}
&-box {
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>
+72
View File
@@ -0,0 +1,72 @@
<template>
<ChartCard margin="0 0 30rpx 0" title="教育培训">
<view class="charts-box">
<qiun-data-charts type="area" :opts="opts" :chartData="chartData" @getIndex="handleTap" />
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue'
import {
ref
} from 'vue';
import {
onReady
} from '@dcloudio/uni-app'
const opts = ref({
padding: [15, 15, 0, 15],
enableScroll: false,
legend: {
show: false
},
xAxis: {
disableGrid: true,
rotateLabel: true,
rotateAngle: -30,
fontSize: 10
},
yAxis: {
gridType: "dash",
dashLength: 2
},
extra: {
tooltip: {
showBox: false
},
area: {
type: "curve",
opacity: 0.2,
addLine: true,
width: 2,
gradient: true,
activeType: "hollow"
}
}
})
const chartData = ref({})
const handleTap = (e) => {
console.log(e)
}
onReady(() => {
let res = {
categories: ["专项培训", "特种作业\n培训", "三级安全\n教育培训", "安全技术\n交底"],
series: [{
data: [302265, 70770, 399175, 14851]
}]
};
chartData.value = JSON.parse(JSON.stringify(res));
})
</script>
<style scoped>
.charts-box {
width: 100%;
height: 400rpx;
}
</style>
+73
View File
@@ -0,0 +1,73 @@
<template>
<ChartCard margin="0 0 30rpx 0" title="应急管理数据" >
<view class="emergencyCard">
<qiun-data-charts type="column" :opts="opts" :chartData="chartData" @getIndex="handleTap" />
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue'
import {
ref
} from 'vue';
import {
onReady
} from '@dcloudio/uni-app'
const opts = ref({
padding: [15, 15, 0, 5],
enableScroll: false,
legend: {show: false},
xAxis: {
disableGrid: true,
rotateLabel: true,
fontSize: 10,
rotateAngle: -30
},
yAxis: {
data: [{
min: 0
}]
},
extra: {
column: {
type: "group",
width: 20,
activeBgColor: "#000000",
activeBgOpacity: 0.08
}
}
})
const chartData = ref({})
const handleTap = (e) => {
console.log(e)
}
onReady(() => {
let res = {
categories: ["应急预案", "专项预案", "现场处置\n预案", "演练次数", "参演人数"],
series: [{
data: [35, 36, 31, 33, 13],
color: '#eef82f'
}],
formatter: function(value,index,series,opts){
console.log(value)
console.log(index)
console.log(series)
console.log(opts)
}
};
chartData.value = JSON.parse(JSON.stringify(res));
})
</script>
<style lang="scss">
.emergencyCard {
width: 100%;
height: 400rpx;
}
</style>
+89
View File
@@ -0,0 +1,89 @@
<template>
<ChartCard :loading="loading" margin="0 0 30rpx 0" title="组织机构人员">
<view class="organizer">
<view class="row u-flex u-padding-20 u-margin-bottom-20">
<view class="row_li u-flex u-row-center"><text class="organizer-lab">集团总人数</text><text
class="organizer_num">13273</text></view>
<view class="row_li u-flex u-row-center"><text class="organizer-lab">总监</text><text
class="organizer_num">13273</text></view>
<view class="row_li u-flex u-row-center"><text class="organizer-lab">专职</text><text
class="organizer_num">13273</text></view>
<view class="row_li u-flex u-row-center"><text class="organizer-lab">企业</text><text
class="organizer_num">13273</text></view>
</view>
<view class="organizer-tit">分支机构</view>
<view class="row u-flex u-padding-20 u-margin-bottom-20">
<view class="row_li u-flex u-row-center"><text class="organizer-lab">总监</text><text
class="organizer_num">13273</text></view>
<view class="row_li u-flex u-row-center"><text class="organizer-lab">专职</text><text
class="organizer_num">13273</text></view>
</view>
<view class="organizer-tit">注安师</view>
<view class="row u-flex u-padding-20 u-margin-bottom-20">
<view class="row_li u-flex u-row-center"><text class="organizer-lab">在岗职业</text><text
class="organizer_num">13273</text></view>
</view>
<view class="organizer-tit">项目人数</view>
<view class="row u-flex u-padding-20 u-margin-bottom-20">
<view class="row_li u-flex u-row-center"><text class="organizer-lab">总监</text><text
class="organizer_num">13273</text></view>
<view class="row_li u-flex u-row-center"><text class="organizer-lab">专职</text><text
class="organizer_num">13273</text></view>
<view class="row_li u-flex u-row-center"><text class="organizer-lab">安全监护</text><text
class="organizer_num">13273</text></view>
</view>
<view class="organizer-tit">三类人员</view>
<view class="row u-flex u-padding-20">
<view class="row_li u-flex u-row-center"><text class="organizer-lab">A证</text><text
class="organizer_num">13273</text></view>
<view class="row_li u-flex u-row-center"><text class="organizer-lab">B证</text><text
class="organizer_num">13273</text></view>
<view class="row_li u-flex u-row-center"><text class="organizer-lab">C证</text><text
class="organizer_num">13273</text></view>
</view>
</view>
</ChartCard>
</template>
<script setup>
import {ref} from 'vue'
import ChartCard from '@/components/chartCard.vue'
const loading = ref(false)
</script>
<style lang="scss">
.organizer {
&-tit {
color: #2573cb;
width: 100%;
font-size: 28rpx;
background-color: #F7FBFE;
padding: 12rpx 20rpx 0;
}
&-lab {
color: #999999;
font-size: 24rpx;
}
&_num {
color: #333333;
font-size: 28rpx;
margin-top: 16rpx;
}
.row {
background-color: #F7FBFE;
&_li {
flex: 1;
display: flex;
flex-direction: column;
}
}
}
</style>
+65
View File
@@ -0,0 +1,65 @@
<template>
<ChartCard :loading="loading" margin="30rpx 0 0 0" padding="20rpx 10rpx 80rpx 10rpx"
bg-color="linear-gradient(#1e5ca3, #3094ff)">
<view class="project">
<view class="project-col" @click="handleSkip">
<text class="project-col-num">1024</text>
<text class="project-col-lab u-margin-top-10">在建项目</text>
</view>
<view class="project-col">
<text class="project-col-num">1024</text>
<text class="project-col-lab u-margin-top-10">停工项目</text>
</view>
<view class="project-col">
<text class="project-col-num">1024111</text>
<text class="project-col-lab u-margin-top-10">参建人数</text>
</view>
<view class="project-col">
<text class="project-col-num">1024</text>
<text class="project-col-lab u-margin-top-10">在施危大工程</text>
</view>
</view>
</ChartCard>
</template>
<script setup>
import {
ref
} from 'vue';
import ChartCard from '@/components/chartCard.vue'
const loading = ref(false)
const handleSkip = ()=>{
uni.navigateTo({
url: `/pages/penetrate/project`
})
}
</script>
<style lang="scss">
.project {
display: grid;
grid-template-columns: repeat(4, 25%);
&-col {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
&-num {
text-align: center;
overflow-wrap: break-word;
width: 100%;
color: #ffffff;
font-size: 40rpx;
}
&-lab {
color: #ffffff;
font-size: 24rpx;
}
}
}
</style>
@@ -0,0 +1,78 @@
<template>
<ChartCard margin="0 0 30rpx 0" title="风险分级管控" >
<view class="rish-ranking">
<qiun-data-charts type="pie" :opts="opts" :chartData="chartData" />
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue'
import {
ref
} from 'vue';
import {
onReady, onShow
} from '@dcloudio/uni-app'
const opts = ref({
color: ["#EE6666", "#EF893B","#EFCB3B","#3B8CEF"],
padding: [5, 5, 5, 5],
enableScroll: false,
legend: {
lineHeight:20,
fontSize: 10,
itemGap: 20
},
extra: {
pie: {
activeOpacity: 0.5,
activeRadius: 10,
offsetAngle: 0,
labelWidth: 15,
border: true,
borderWidth: 3,
borderColor: "#FFFFFF"
}
}
})
const chartData = ref({})
const handleTap = (e) => {
console.log(e)
}
onReady(() => {
let res = {
series: [{
data: [{
"name": "重大风险",
"value": 50,
"labelText": "重大风险:50"
}, {
"name": "较大风险",
"value": 30,
"labelText": "较大风险:30"
}, {
"name": "一般风险",
"value": 20,
"labelText": "一般风险:20"
}, {
"name": "低风险",
"value": 8,
"labelText": "低风险:8"
}]
}]
};
chartData.value = JSON.parse(JSON.stringify(res));
})
</script>
<style lang="scss">
.rish-ranking {
width: 100%;
height: 480rpx;
}
</style>
+32
View File
@@ -0,0 +1,32 @@
<template>
<ChartCard margin="0 0 30rpx 0" title="安全工时">
<view class="safe-hours">
<text>9024145</text><text></text>
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue'
</script>
<style lang="scss">
.safe-hours {
padding: 0 40rpx 0 120rpx;
width: 100%;
text-align: left;
overflow: hidden;
>text {
font-weight: 700;
font-size: 52rpx;
background: linear-gradient(180deg, #2573cb, #50c2ff);
-webkit-background-clip: text;
/* 兼容Safari浏览器 */
background-clip: text;
color: transparent;
/* 文字透明,显示背景渐变 */
letter-spacing: 10rpx;
}
}
</style>
@@ -0,0 +1,50 @@
<template>
<ChartCard margin="0 0 30rpx 0" title="施工机具设备" >
<view class="special-equip u-flex">
<view class="special-equip-box u-flex u-row-center">
<view class="special-equip-box-icon"> <u-icon name="ziyuanshiyongtongji" color="#e28ea3" custom-prefix="custom-icon" size="60" ></u-icon></view>
<view class="special-equip-box-row u-padding-left-20">
<text class="special-equip-box-row-num">9000</text>
<text class="special-equip-box-row-lab">在用个数</text>
</view>
</view>
<view class="special-equip-box u-flex u-row-center">
<view class="special-equip-box-icon"> <u-icon name="tezhongshebei" color="#3bdae2" custom-prefix="custom-icon" size="60" ></u-icon></view>
<view class="special-equip-box-row u-padding-left-20">
<text class="special-equip-box-row-num">9000</text>
<text class="special-equip-box-row-lab">特种设备</text>
</view>
</view>
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue'
</script>
<style lang="scss">
.special-equip{
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>
+49
View File
@@ -0,0 +1,49 @@
<template>
<ChartCard margin="0 0 30rpx 0" title="高风险作业许可" >
<view class="work u-flex">
<view class="work-box u-flex u-row-center">
<view class="work-box-icon"> <u-icon name="xukezheng" color="#8CEEFF" custom-prefix="custom-icon" size="60" ></u-icon></view>
<view class="work-box-row u-padding-left-20">
<text class="work-box-row-num">9000</text>
<text class="work-box-row-lab">许可</text>
</view>
</view>
<view class="work-box u-flex u-row-center">
<view class="work-box-icon"> <u-icon name="guanbi" color="#FFEB3B" custom-prefix="custom-icon" size="60" ></u-icon></view>
<view class="work-box-row u-padding-left-20">
<text class="work-box-row-num">9000</text>
<text class="work-box-row-lab">关闭</text>
</view>
</view>
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue'
</script>
<style lang="scss">
.work{
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>