|
|
@@ -106,10 +106,10 @@ let safeDayChart: echarts.ECharts | null = null
|
|
|
let qhseTrendChart: echarts.ECharts | null = null
|
|
|
let socChart: echarts.ECharts | null = null
|
|
|
|
|
|
-const summaryTabs: Array<{ label: string; value: SummaryTabValue }> = [
|
|
|
- { label: '首页看板', value: 'home' },
|
|
|
- { label: '证书信息', value: 'certificate' }
|
|
|
-]
|
|
|
+const summaryTabs: Array<{ label: string; value: SummaryTabValue }> = computed(() => [
|
|
|
+ { label: t('qhse.indexvue325112-65'), value: 'home' },
|
|
|
+ { label: t('qhse.indexvue325112-66'), value: 'certificate' }
|
|
|
+])
|
|
|
|
|
|
const activeSummaryTab = ref<SummaryTabValue>('home')
|
|
|
|
|
|
@@ -134,12 +134,14 @@ watch(
|
|
|
)
|
|
|
|
|
|
const pageTitle = computed(() =>
|
|
|
- activeSummaryTab.value === 'certificate' ? '证书信息看板' : 'QHSE管理看板'
|
|
|
+ activeSummaryTab.value === 'certificate'
|
|
|
+ ? t('qhse.indexvue325112-111')
|
|
|
+ : t('qhse.indexvue325112-110')
|
|
|
)
|
|
|
|
|
|
-const summaryCards = ref([
|
|
|
+const summaryCards = computed(() => [
|
|
|
{
|
|
|
- title: '人工时(小时)',
|
|
|
+ title: t('qhse.indexvue325112-69'),
|
|
|
value: 671987,
|
|
|
note: '',
|
|
|
accent: '#4f8dff',
|
|
|
@@ -147,7 +149,7 @@ const summaryCards = ref([
|
|
|
icon: Clock
|
|
|
},
|
|
|
{
|
|
|
- title: '车辆里程(公里)',
|
|
|
+ title: t('qhse.indexvue325112-70'),
|
|
|
value: 631128,
|
|
|
note: '',
|
|
|
accent: '#4f8dff',
|
|
|
@@ -155,7 +157,7 @@ const summaryCards = ref([
|
|
|
icon: Odometer
|
|
|
},
|
|
|
{
|
|
|
- title: '重大风险数量',
|
|
|
+ title: t('qhse.indexvue325112-71'),
|
|
|
value: 0,
|
|
|
note: '',
|
|
|
accent: '#ff5a62',
|
|
|
@@ -163,7 +165,7 @@ const summaryCards = ref([
|
|
|
icon: Warning
|
|
|
},
|
|
|
{
|
|
|
- title: '特种人员持证率',
|
|
|
+ title: t('qhse.indexvue325112-72'),
|
|
|
value: 0,
|
|
|
note: 'Warn: 0',
|
|
|
accent: '#f2b800',
|
|
|
@@ -171,7 +173,7 @@ const summaryCards = ref([
|
|
|
icon: Postcard
|
|
|
},
|
|
|
{
|
|
|
- title: '设备检测合规率',
|
|
|
+ title: t('qhse.indexvue325112-73'),
|
|
|
value: '98%',
|
|
|
note: '',
|
|
|
accent: '#f2b800',
|
|
|
@@ -179,7 +181,7 @@ const summaryCards = ref([
|
|
|
icon: DataAnalysis
|
|
|
},
|
|
|
{
|
|
|
- title: '作业许可证数量',
|
|
|
+ title: t('qhse.indexvue325112-74'),
|
|
|
value: 0,
|
|
|
note: '',
|
|
|
accent: '#4f8dff',
|
|
|
@@ -188,42 +190,83 @@ const summaryCards = ref([
|
|
|
}
|
|
|
])
|
|
|
|
|
|
-const hazardBars = ref([
|
|
|
- { label: '总数', value: 0, color: '#4f8dff' },
|
|
|
- { label: '已整改', value: 0, color: '#43c7ca' },
|
|
|
- { label: '未整改', value: 0, color: '#ff981f' }
|
|
|
+const hazardBars = computed(() => [
|
|
|
+ { label: t('qhse.indexvue325112-76'), value: 0, color: '#4f8dff' },
|
|
|
+ { label: t('qhse.indexvue325112-77'), value: 0, color: '#43c7ca' },
|
|
|
+ { label: t('qhse.indexvue325112-78'), value: 0, color: '#ff981f' }
|
|
|
])
|
|
|
|
|
|
const riskZones = ref([
|
|
|
- { title: '', desc: '办公区 / 展厅 / 主通道', color: '#25b36a', value: 0 },
|
|
|
- { title: '', desc: '物料库 / 维修 / 装卸区', color: '#3d7cff', value: 0 },
|
|
|
- { title: '', desc: '焊接 / 机加 / 吊装区', color: '#ff9827', value: 0 },
|
|
|
- { title: '', desc: '危化库 / 试压区 / 配电房', color: '#ff5b61', value: 0 }
|
|
|
+ {
|
|
|
+ title: '',
|
|
|
+ desc: t('qhse.indexvue325112-80'),
|
|
|
+ color: '#25b36a',
|
|
|
+ value: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '',
|
|
|
+ desc: t('qhse.indexvue325112-81'),
|
|
|
+ color: '#3d7cff',
|
|
|
+ value: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '',
|
|
|
+ desc: t('qhse.indexvue325112-82'),
|
|
|
+ color: '#ff9827',
|
|
|
+ value: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '',
|
|
|
+ desc: t('qhse.indexvue325112-83'),
|
|
|
+ color: '#ff5b61',
|
|
|
+ value: 0
|
|
|
+ }
|
|
|
])
|
|
|
|
|
|
-const permitStats = ref<PermitStat[]>([
|
|
|
- { label: '个人防护', value: 18, color: '#4f8dff' },
|
|
|
- { label: '规范操作', value: 26, color: '#43c7ca' },
|
|
|
- { label: '规范指挥', value: 12, color: '#ffb14a' },
|
|
|
- { label: '人员位置', value: 9, color: '#ff7a7a' },
|
|
|
- { label: '作业场所', value: 15, color: '#8d8cff' }
|
|
|
+const permitStats = computed(() => [
|
|
|
+ { label: t('qhse.indexvue325112-85'), value: 18, color: '#4f8dff' },
|
|
|
+ { label: t('qhse.indexvue325112-86'), value: 26, color: '#43c7ca' },
|
|
|
+ { label: t('qhse.indexvue325112-87'), value: 12, color: '#ffb14a' },
|
|
|
+ { label: t('qhse.indexvue325112-88'), value: 9, color: '#ff7a7a' },
|
|
|
+ { label: t('qhse.indexvue325112-89'), value: 15, color: '#8d8cff' }
|
|
|
])
|
|
|
|
|
|
-const qualificationWarnings = ref([
|
|
|
- { label: '证件过期', value: 0, accent: '#ff7a7a', key: 'expired' },
|
|
|
- { label: '即将到期', value: 0, accent: '#e6ab00', key: 'warn' }
|
|
|
+const qualificationWarnings = computed(() => [
|
|
|
+ { label: t('qhse.indexvue325112-90'), value: 0, accent: '#ff7a7a', key: 'expired' },
|
|
|
+ { label: t('qhse.indexvue325112-91'), value: 0, accent: '#e6ab00', key: 'warn' }
|
|
|
])
|
|
|
|
|
|
-const qhseMetricTabs = [
|
|
|
- { label: 'LTIR(百万工时)', value: 'ltir', accent: '#3d7cff', label2: '百万工时损失工时事故率' },
|
|
|
- { label: 'TRIR(百万工时)', value: 'trir', accent: '#17b6c5', label2: '百万工时总可记录事件率' },
|
|
|
+// const qhseMetricTabs = [
|
|
|
+// { label: 'LTIR(百万工时)', value: 'ltir', accent: '#3d7cff', label2: '百万工时损失工时事故率' },
|
|
|
+// { label: 'TRIR(百万工时)', value: 'trir', accent: '#17b6c5', label2: '百万工时总可记录事件率' },
|
|
|
+// {
|
|
|
+// label: 'PMVA(百万公里)',
|
|
|
+// value: 'pmva',
|
|
|
+// accent: '#f2a93b',
|
|
|
+// label2: '百万公里可预防性交通事故率'
|
|
|
+// }
|
|
|
+// ] as const
|
|
|
+
|
|
|
+const qhseMetricTabs = computed(() => [
|
|
|
+ {
|
|
|
+ label: t('qhse.indexvue325112-112'),
|
|
|
+ value: 'ltir',
|
|
|
+ accent: '#3d7cff',
|
|
|
+ label2: '百万工时损失工时事故率'
|
|
|
+ },
|
|
|
{
|
|
|
- label: 'PMVA(百万公里)',
|
|
|
+ label: t('qhse.indexvue325112-113'),
|
|
|
+ value: 'trir',
|
|
|
+ accent: '#17b6c5',
|
|
|
+ label2: '百万工时总可记录事件率'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: t('qhse.indexvue325112-114'),
|
|
|
value: 'pmva',
|
|
|
accent: '#f2a93b',
|
|
|
label2: '百万公里可预防性交通事故率'
|
|
|
}
|
|
|
-] as const
|
|
|
+])
|
|
|
|
|
|
const activeQhseMetric = ref<QhseMetricValue>('ltir')
|
|
|
const dangerGradeOptions = computed(() => getStrDictOptions(DICT_TYPE.DANGER_GRADE))
|
|
|
@@ -273,41 +316,44 @@ const qhseTrendSeries = ref<Record<QhseMetricValue, Array<{ year: string; value:
|
|
|
]
|
|
|
})
|
|
|
|
|
|
-const bottomCards = ref([
|
|
|
+const bottomCards = computed(() => [
|
|
|
{
|
|
|
- title: '体系合规',
|
|
|
+ title: t('qhse.indexvue325112-93'),
|
|
|
icon: Files,
|
|
|
accent: '#39c6cc',
|
|
|
glow: 'rgba(57, 198, 204, 0.22)',
|
|
|
- lines: ['内审已完成', '外审待安排']
|
|
|
+ lines: [t('qhse.indexvue325112-98'), t('qhse.indexvue325112-99')]
|
|
|
},
|
|
|
{
|
|
|
- title: '安全检测',
|
|
|
+ title: t('qhse.indexvue325112-94'),
|
|
|
icon: Histogram,
|
|
|
accent: '#4f8dff',
|
|
|
glow: 'rgba(79, 141, 255, 0.2)',
|
|
|
- lines: ['在用: 0台', '待检: 0项（重点关注）']
|
|
|
+ lines: [
|
|
|
+ `${t('qhse.indexvue325112-100')}: 0${t('stat.availabili107902-1')}`,
|
|
|
+ `${t('qhse.indexvue325112-101')}: 0${t('qhse.indexvue325112-102')}(${t('qhse.indexvue325112-103')})`
|
|
|
+ ]
|
|
|
},
|
|
|
{
|
|
|
- title: '应急演练',
|
|
|
+ title: t('qhse.indexvue325112-95'),
|
|
|
icon: AlarmClock,
|
|
|
accent: '#ff5b61',
|
|
|
glow: 'rgba(255, 91, 97, 0.22)',
|
|
|
- lines: ['年度应急演练：80次']
|
|
|
+ lines: [`${t('qhse.indexvue325112-104')}：80${t('qhse.indexvue325112-105')}`]
|
|
|
},
|
|
|
{
|
|
|
- title: '职业健康',
|
|
|
+ title: t('qhse.indexvue325112-96'),
|
|
|
icon: Checked,
|
|
|
accent: '#f2c11a',
|
|
|
glow: 'rgba(242, 193, 26, 0.2)',
|
|
|
- lines: ['职业健康体检率', '98.7%（达标）']
|
|
|
+ lines: [`${t('qhse.indexvue325112-106')}`, `98.7%(${t('qhse.indexvue325112-107')})`]
|
|
|
},
|
|
|
{
|
|
|
- title: '危废管控',
|
|
|
+ title: t('qhse.indexvue325112-97'),
|
|
|
icon: Flag,
|
|
|
accent: '#28c98b',
|
|
|
glow: 'rgba(40, 201, 139, 0.2)',
|
|
|
- lines: ['危废暂存合规', '三废处置100%达标']
|
|
|
+ lines: [`${t('qhse.indexvue325112-108')}`, `${t('qhse.indexvue325112-109')}`]
|
|
|
}
|
|
|
])
|
|
|
|
|
|
@@ -382,7 +428,7 @@ async function getStatic() {
|
|
|
const item = staticData.value[index]
|
|
|
if (!item) return
|
|
|
zone.value = item.count || 0
|
|
|
- zone.title = `${item.classify}区`
|
|
|
+ zone.title = `${item.classify}`
|
|
|
})
|
|
|
}
|
|
|
|
|
|
@@ -404,7 +450,7 @@ async function getInstrumentOverview() {
|
|
|
instrumentExpired.value = statData.expired || 0
|
|
|
|
|
|
bottomCards.value[1].lines = [
|
|
|
- `在用: ${total.value}台`,
|
|
|
+ `${t('qhse.indexvue325112-100')}: ${total.value}台`,
|
|
|
`待检: ${instrumentExpired.value}项（重点关注）`
|
|
|
]
|
|
|
}
|
|
|
@@ -450,7 +496,7 @@ function getHazardChartOption(): echarts.EChartsOption {
|
|
|
},
|
|
|
yAxis: {
|
|
|
type: 'value',
|
|
|
- name: '隐患数量',
|
|
|
+ name: t('qhse.indexvue325112-79'),
|
|
|
nameLocation: 'end',
|
|
|
nameGap: 13,
|
|
|
nameTextStyle: {
|
|
|
@@ -560,7 +606,7 @@ function getSafeDayChartOption(): echarts.EChartsOption {
|
|
|
formatter(params: any) {
|
|
|
if (!params || (Array.isArray(params) && params.length === 0)) return ''
|
|
|
const item = Array.isArray(params) ? params[0] : params
|
|
|
- return `${item.name}<br/>安全生产天数：<span style="font-weight:700">${item.value}</span>`
|
|
|
+ return `${item.name}<br/> ${t('qhse.indexvue325112-92')}:<span style="font-weight:700">${item.value}</span>`
|
|
|
}
|
|
|
}),
|
|
|
xAxis: {
|
|
|
@@ -601,7 +647,7 @@ function getSafeDayChartOption(): echarts.EChartsOption {
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
- name: '安全生产天数',
|
|
|
+ name: t('qhse.indexvue325112-92'),
|
|
|
type: 'bar',
|
|
|
data: safeDayBarData.value.map((item) => item.value),
|
|
|
barWidth: 22,
|
|
|
@@ -636,7 +682,7 @@ function getSafeDayChartOption(): echarts.EChartsOption {
|
|
|
left: 'center',
|
|
|
bottom: 0,
|
|
|
style: {
|
|
|
- text: '安全生产天数',
|
|
|
+ text: t('qhse.indexvue325112-92'),
|
|
|
fill: '#5b6f8f',
|
|
|
font: `700 12px ${FONT_FAMILY}`
|
|
|
}
|
|
|
@@ -672,7 +718,7 @@ function destroySafeDayChart() {
|
|
|
|
|
|
function getQhseTrendChartOption(): echarts.EChartsOption {
|
|
|
const activeTab =
|
|
|
- qhseMetricTabs.find((item) => item.value === activeQhseMetric.value) || qhseMetricTabs[0]
|
|
|
+ qhseMetricTabs.value.find((item) => item.value === activeQhseMetric.value) || qhseMetricTabs[0]
|
|
|
const seriesData = qhseTrendSeries.value[activeQhseMetric.value] || []
|
|
|
|
|
|
return {
|
|
|
@@ -1316,7 +1362,7 @@ onUnmounted(() => {
|
|
|
</div>
|
|
|
|
|
|
<div v-if="activeSummaryTab === 'home'" class="summary-toolbar__date">
|
|
|
- <span class="summary-toolbar__date-label">日期:</span>
|
|
|
+ <span class="summary-toolbar__date-label">{{ t('qhse.indexvue325112-75') }}:</span>
|
|
|
|
|
|
<div class="flex items-center gap-2 datepicker">
|
|
|
<el-date-picker
|
|
|
@@ -1357,7 +1403,7 @@ onUnmounted(() => {
|
|
|
<section class="panel summary-panel kb-stage-card kb-stage-card--1">
|
|
|
<div class="panel-title">
|
|
|
<span class="icon-decorator"><span></span><span></span></span>
|
|
|
- QHSE关键数据
|
|
|
+ {{ t('qhse.indexvue325112-67') }}
|
|
|
</div>
|
|
|
<div class="summary-grid">
|
|
|
<article
|
|
|
@@ -1428,7 +1474,7 @@ onUnmounted(() => {
|
|
|
<section class="panel board-panel kb-stage-card kb-stage-card--3">
|
|
|
<div class="panel-title panel-title--center">
|
|
|
<span class="icon-decorator"><span></span><span></span></span>
|
|
|
- QHSE指标
|
|
|
+ {{ t('qhse.indexvue325112-68') }}
|
|
|
</div>
|
|
|
|
|
|
<section class="board-panel kb-stage-card kb-stage-card--5">
|
