|
@@ -14,7 +14,9 @@ import {
|
|
|
Files,
|
|
Files,
|
|
|
Flag,
|
|
Flag,
|
|
|
Histogram,
|
|
Histogram,
|
|
|
|
|
+ Clock,
|
|
|
Opportunity,
|
|
Opportunity,
|
|
|
|
|
+ Odometer,
|
|
|
Postcard,
|
|
Postcard,
|
|
|
Warning
|
|
Warning
|
|
|
} from '@element-plus/icons-vue'
|
|
} from '@element-plus/icons-vue'
|
|
@@ -38,14 +40,6 @@ type PermitStat = {
|
|
|
color: string
|
|
color: string
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-type BottomCard = {
|
|
|
|
|
- title: string
|
|
|
|
|
- icon: any
|
|
|
|
|
- accent: string
|
|
|
|
|
- glow: string
|
|
|
|
|
- lines: string[]
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
type SafeDayMap = Record<string, number>
|
|
type SafeDayMap = Record<string, number>
|
|
|
|
|
|
|
|
const wrapperRef = ref<HTMLDivElement>()
|
|
const wrapperRef = ref<HTMLDivElement>()
|
|
@@ -65,44 +59,53 @@ const pageTitle = 'QHSE管理看板'
|
|
|
|
|
|
|
|
const summaryCards = ref([
|
|
const summaryCards = ref([
|
|
|
{
|
|
{
|
|
|
- title: '风险总数(处)',
|
|
|
|
|
|
|
+ title: '人工时',
|
|
|
|
|
+ value: 671987,
|
|
|
|
|
+ note: '',
|
|
|
|
|
+ accent: '#4f8dff',
|
|
|
|
|
+ glow: 'rgba(79, 141, 255, 0.22)',
|
|
|
|
|
+ icon: Clock
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: '车辆里程',
|
|
|
|
|
+ value: 631128.07,
|
|
|
|
|
+ note: '',
|
|
|
|
|
+ accent: '#4f8dff',
|
|
|
|
|
+ glow: 'rgba(79, 141, 255, 0.22)',
|
|
|
|
|
+ icon: Odometer
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: '重大风险数量',
|
|
|
value: 0,
|
|
value: 0,
|
|
|
note: '',
|
|
note: '',
|
|
|
accent: '#ff5a62',
|
|
accent: '#ff5a62',
|
|
|
glow: 'rgba(255, 90, 98, 0.26)',
|
|
glow: 'rgba(255, 90, 98, 0.26)',
|
|
|
icon: Warning
|
|
icon: Warning
|
|
|
},
|
|
},
|
|
|
|
|
+
|
|
|
{
|
|
{
|
|
|
- title: '本月隐患(条)',
|
|
|
|
|
|
|
+ title: '特种人员持证率',
|
|
|
value: 0,
|
|
value: 0,
|
|
|
- note: '',
|
|
|
|
|
- accent: '#ff9f2f',
|
|
|
|
|
- glow: 'rgba(255, 159, 47, 0.24)',
|
|
|
|
|
- icon: Opportunity
|
|
|
|
|
|
|
+ note: 'Warn:3',
|
|
|
|
|
+ accent: '#f2b800',
|
|
|
|
|
+ glow: 'rgba(242, 184, 0, 0.22)',
|
|
|
|
|
+ icon: Postcard
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
- title: '隐患整改率',
|
|
|
|
|
- value: '0%',
|
|
|
|
|
|
|
+ title: '设备检测合规率',
|
|
|
|
|
+ value: 98,
|
|
|
note: '',
|
|
note: '',
|
|
|
- accent: '#2ac7c9',
|
|
|
|
|
- glow: 'rgba(42, 199, 201, 0.26)',
|
|
|
|
|
|
|
+ accent: '#f2b800',
|
|
|
|
|
+ glow: 'rgba(242, 184, 0, 0.22)',
|
|
|
icon: DataAnalysis
|
|
icon: DataAnalysis
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
- title: '本月作业许可',
|
|
|
|
|
|
|
+ title: '作业许可数量',
|
|
|
value: 0,
|
|
value: 0,
|
|
|
note: '',
|
|
note: '',
|
|
|
accent: '#4f8dff',
|
|
accent: '#4f8dff',
|
|
|
glow: 'rgba(79, 141, 255, 0.22)',
|
|
glow: 'rgba(79, 141, 255, 0.22)',
|
|
|
icon: DocumentChecked
|
|
icon: DocumentChecked
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- title: '人员持证率',
|
|
|
|
|
- value: 0,
|
|
|
|
|
- note: 'Warn:3',
|
|
|
|
|
- accent: '#f2b800',
|
|
|
|
|
- glow: 'rgba(242, 184, 0, 0.22)',
|
|
|
|
|
- icon: Postcard
|
|
|
|
|
}
|
|
}
|
|
|
])
|
|
])
|
|
|
|
|
|
|
@@ -670,19 +673,19 @@ const safeDay = ref<SafeDayMap>({})
|
|
|
onMounted(async () => {
|
|
onMounted(async () => {
|
|
|
summaryPanel.value = await getKanban()
|
|
summaryPanel.value = await getKanban()
|
|
|
|
|
|
|
|
- summaryCards.value[0].value = summaryPanel.value.danger
|
|
|
|
|
- summaryCards.value[1].value = summaryPanel.value.monthHazard
|
|
|
|
|
- summaryCards.value[2].value = formatPercent(
|
|
|
|
|
- summaryPanel.value.totalHazard - summaryPanel.value.todoHazard,
|
|
|
|
|
- summaryPanel.value.totalHazard
|
|
|
|
|
- )
|
|
|
|
|
- summaryCards.value[3].value = summaryPanel.value.ptwCount
|
|
|
|
|
- summaryCards.value[4].value = formatPercent(
|
|
|
|
|
|
|
+ // summaryCards.value[0].value = summaryPanel.value.danger
|
|
|
|
|
+ // summaryCards.value[1].value = summaryPanel.value.monthHazard
|
|
|
|
|
+ // summaryCards.value[2].value = formatPercent(
|
|
|
|
|
+ // summaryPanel.value.totalHazard - summaryPanel.value.todoHazard,
|
|
|
|
|
+ // summaryPanel.value.totalHazard
|
|
|
|
|
+ // )
|
|
|
|
|
+ // summaryCards.value[3].value = summaryPanel.value.ptwCount
|
|
|
|
|
+ summaryCards.value[3].value = formatPercent(
|
|
|
summaryPanel.value.totdalCert - summaryPanel.value.expiredCert,
|
|
summaryPanel.value.totdalCert - summaryPanel.value.expiredCert,
|
|
|
summaryPanel.value.totdalCert
|
|
summaryPanel.value.totdalCert
|
|
|
)
|
|
)
|
|
|
|
|
|
|
|
- summaryCards.value[4].note = `Warn: ${summaryPanel.value.warnCert}`
|
|
|
|
|
|
|
+ summaryCards.value[3].note = `Warn: ${summaryPanel.value.warnCert}`
|
|
|
|
|
|
|
|
hazardBars.value[0].value = summaryPanel.value.totalHazard
|
|
hazardBars.value[0].value = summaryPanel.value.totalHazard
|
|
|
hazardBars.value[1].value = summaryPanel.value.totalHazard - summaryPanel.value.todoHazard
|
|
hazardBars.value[1].value = summaryPanel.value.totalHazard - summaryPanel.value.todoHazard
|
|
@@ -915,7 +918,7 @@ onMounted(async () => {
|
|
|
|
|
|
|
|
.summary-grid {
|
|
.summary-grid {
|
|
|
display: grid;
|
|
display: grid;
|
|
|
- grid-template-columns: repeat(5, minmax(0, 1fr));
|
|
|
|
|
|
|
+ grid-template-columns: repeat(6, minmax(0, 1fr));
|
|
|
gap: 24px;
|
|
gap: 24px;
|
|
|
margin-top: 20px;
|
|
margin-top: 20px;
|
|
|
}
|
|
}
|
|
@@ -945,14 +948,14 @@ onMounted(async () => {
|
|
|
|
|
|
|
|
.summary-tile__value {
|
|
.summary-tile__value {
|
|
|
font-family: YouSheBiaoTiHei, sans-serif;
|
|
font-family: YouSheBiaoTiHei, sans-serif;
|
|
|
- font-size: 40px;
|
|
|
|
|
|
|
+ font-size: 30px;
|
|
|
line-height: 1;
|
|
line-height: 1;
|
|
|
color: #114a9b;
|
|
color: #114a9b;
|
|
|
letter-spacing: 1px;
|
|
letter-spacing: 1px;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.summary-tile__note {
|
|
.summary-tile__note {
|
|
|
- font-size: 18px;
|
|
|
|
|
|
|
+ font-size: 15px;
|
|
|
font-weight: 700;
|
|
font-weight: 700;
|
|
|
}
|
|
}
|
|
|
|
|
|