看板中英文

src/locales/en.ts

@@ -26,6 +26,16 @@ export default {
     totalOrder:'totalOrder',
     finishedOrder:'finishedOrder',
     pendingOrder:'pendingOrder',
+    operationCost:'O&M costs',
+    materialConsumption:'MaterialConsumption Top5',
+    gasWater:'Cumulative Gas/Water Injection Volume',
+    dailyGasWater:'Daily Gas/Water Injection Volume',
+    projectDevice:'Project Department Device',
+    safeProduction:'SafeProduction Days',
+    daysToDate:'consecutive safe production days to date',
+    drillingCompletion:'Drilling completion status',
+    drillingWork:'Drilling workload status',
+    wellWorkoverWorkload:'Well workover workload status',
   },
   common: {
     sort:'sort',

src/locales/zh-CN.ts

@@ -26,6 +26,16 @@ export default {
     totalOrder:'总工单数',
     finishedOrder:'已执行工单数',
     pendingOrder:'待执行工单数',
+    operationCost:'运维成本',
+    materialConsumption:'物料消耗Top5',
+    gasWater:'累计注气/注水量统计',
+    dailyGasWater:'当日注气/注水量统计',
+    projectDevice:'项目部设备数量',
+    safeProduction:'安全生产天数',
+    daysToDate:'截至当前连续安全生产天数',
+    drillingCompletion:'钻井完成情况',
+    drillingWork:'钻井工作量情况',
+    wellWorkoverWorkload:'修井工作量情况',
   },
   common: {
     sort:'排序',

src/views/pms/stat/rhkb.vue

@@ -8,7 +8,7 @@
         icon="fa-solid:project-diagram"
         icon-bg-color="text-blue-500"
         icon-color="bg-blue-100"
-        title="设备数"
+        :title="t('stat.deviceCount')"
       />
     </el-col>
     <el-col  :sm="3" :xs="12">
@@ -17,7 +17,7 @@
         icon="fa-solid:list"
         icon-bg-color="text-pink-500"
         icon-color="bg-blue-100"
-        title="维修工单"
+        :title="t('stat.maintenanceOrder')"
       />
     </el-col>
     <el-col  :sm="3" :xs="12">
@@ -26,7 +26,7 @@
         icon="fa-solid:times-circle"
         icon-bg-color="text-purple-500"
         icon-color="bg-purple-100"
-        title="运行未填写"
+        :title="t('stat.operationNotFilled')"
       />
     </el-col>
     <el-col  :sm="3" :xs="12">
@@ -35,7 +35,7 @@
         icon="fa-solid:award"
         icon-bg-color="text-purple-500"
         icon-color="bg-purple-100"
-        title="运行已填写"
+        :title="t('stat.operationFilled')"
       />
     </el-col>
     <el-col  :sm="3" :xs="12">
@@ -44,7 +44,7 @@
         icon="fa-solid:times-circle"
         icon-bg-color="text-green-500"
         icon-color="bg-green-100"
-        title="未执行保养"
+        :title="t('stat.notMaintained')"
       />
     </el-col>
     <el-col  :sm="3" :xs="12">
@@ -53,7 +53,7 @@
         icon="fa-solid:award"
         icon-bg-color="text-green-500"
         icon-color="bg-green-100"
-        title="已执行保养"
+        :title="t('stat.maintained')"
       />
     </el-col>
     <el-col  :sm="3" :xs="12">
@@ -62,7 +62,7 @@
         icon="fa-solid:times-circle"
         icon-bg-color="text-yellow-500"
         icon-color="bg-yellow-100"
-        title="待填写巡检"
+        :title="t('stat.notInspected')"
       />
     </el-col>
     <el-col  :sm="3" :xs="12">
@@ -71,7 +71,7 @@
         icon="fa-solid:award"
         icon-bg-color="text-yellow-500"
         icon-color="bg-yellow-100"
-        title="已填写巡检"
+        :title="t('stat.inspected')"
       />
     </el-col>
     <!-- 其他统计卡片... -->
@@ -82,7 +82,7 @@
       <el-card class="chart-card" shadow="never">
         <template #header>
           <div class="flex items-center">
-            <span class="text-base font-medium " style="color: #b6c8da">设备状态统计</span>
+            <span class="text-base font-medium " style="color: #b6c8da">{{t('stat.deviceStatus')}}</span>
           </div>
         </template>
         <div ref="statusChartRef" class="h-[290px]"></div>
@@ -92,7 +92,7 @@
       <el-card class="chart-card" shadow="never" >
         <template #header>
           <div class="flex items-center">
-            <span class="text-base font-medium " style="color: #b6c8da">设备类别TOP数量</span>
+            <span class="text-base font-medium " style="color: #b6c8da">{{t('stat.deviceClassifyTop5')}}</span>
           </div>
         </template>
         <div ref="topContainer" class="h-[290px]"></div>
@@ -102,7 +102,7 @@
       <el-card class="chart-card" shadow="never">
         <template #header>
           <div class="flex items-center justify-between">
-            <span class="text-base font-medium " style="color: #b6c8da">近七日运维成本</span>
+            <span class="text-base font-medium " style="color: #b6c8da">{{t('stat.operationCost')}}</span>
           </div>
         </template>
         <div ref="chartContainer" class="h-[290px]"></div>
@@ -116,7 +116,7 @@
       <el-card class="chart-card" shadow="never">
         <template #header>
           <div class="flex items-center">
-            <span class="text-base font-medium " style="color: #b6c8da">近7天物料消耗TOP5</span>
+            <span class="text-base font-medium " style="color: #b6c8da">{{t('stat.materialConsumption')}}</span>
           </div>
         </template>
         <div ref="materialChartRef" class="h-[320px]"></div>
@@ -126,7 +126,7 @@
       <el-card class="chart-card" shadow="never">
         <template #header>
           <div class="flex items-center justify-between">
-            <span class="text-base font-medium " style="color: #b6c8da">工单数量情况</span>
+            <span class="text-base font-medium " style="color: #b6c8da">{{t('stat.orderCount')}}</span>
           </div>
         </template>
         <div ref="qxRef" class="h-[320px]"></div>
@@ -138,7 +138,7 @@
       <el-card class="chart-card" shadow="never">
         <template #header>
           <div class="flex items-center justify-between">
-            <span class="text-base font-medium " style="color: #b6c8da">累计注气/注水量统计</span>
+            <span class="text-base font-medium " style="color: #b6c8da">{{t('stat.gasWater')}}</span>
           </div>
         </template>
         <div ref="zqlChartRef" class="h-[300px]"></div>
@@ -148,7 +148,7 @@
       <el-card class="chart-card" shadow="never">
         <template #header>
           <div class="flex items-center justify-between">
-            <span class="text-base font-medium " style="color: #b6c8da">当日注气/注水量统计</span>
+            <span class="text-base font-medium " style="color: #b6c8da">{{t('stat.dailyGasWater')}}</span>
           </div>
         </template>
         <div ref="todayZqlRef" class="h-[300px]"></div>
@@ -174,6 +174,7 @@ import { useElementSize } from '@vueuse/core'
 import { IotStatApi } from '@/api/pms/stat'
 import SummaryCard from '@/components/SummaryCard/index.vue'
 import { reactive, ref } from 'vue'
+import {useLocaleStore} from "@/store/modules/locale";
 
 /** IoT 首页 */
 defineOptions({ name: 'IotRhStat' })
@@ -210,7 +211,7 @@ const statusChartRef = ref() // 设备数量统计的图表
 const materialChartRef = ref() // 设备数量统计的图表
 const zqlChartRef = ref() // 注气量统计的图表
 const todayZqlRef = ref() // 注气量统计的图表
-
+const { t } = useI18n() // 国际化
 const device = ref({
   total: undefined,
   today: undefined
@@ -292,11 +293,24 @@ const getStats = () => {
   })
   IotStatApi.getRhZql('rh').then((res) => {
     zqlData.value = res
-    initZqlChart()
+    const localeStore = useLocaleStore()
+    const lang = localeStore.getCurrentLocale.lang
+    if (lang==='zh-CN') {
+      initZqlChart('累计注气量','累计注水量')
+    } else if (lang==='en') {
+      initZqlChart('cumulative gas injection','cumulative water injection')
+    }
+
   })
   IotStatApi.getRhZqlToday('rh').then((res) => {
     zqlTodayData.value = res
-    initTodayZqlChart()
+    const localeStore = useLocaleStore()
+    const lang = localeStore.getCurrentLocale.lang
+    if (lang==='zh-CN') {
+      initTodayZqlChart('当日注气量','当日注水量')
+    } else if (lang==='en') {
+      initTodayZqlChart('daily gas injection','daily water injection')
+    }
   })
   const fillQueryParams = reactive({
     startTime: Date.now() - 7 * 24 * 60 * 60 * 1000, // 设置默认开始时间为 7 天前
@@ -363,7 +377,7 @@ const initMaterials = () => {
   handleMaterialResize()
 }
 let zqlTodayInstance = null
-const initTodayZqlChart = async () => {
+const initTodayZqlChart = async (gas:any,water:any) => {
   if (!todayZqlRef.value) return
   zqlTodayInstance = echarts.init(todayZqlRef.value)
   const option = {
@@ -406,7 +420,7 @@ const initTodayZqlChart = async () => {
     yAxis: [
       {
         type: 'value',
-        name:'当日注气量(m³)',
+        name:gas+'(m³)',
         axisLabel: {
           color: '#B6C8DA',
           formatter: '{value}'
@@ -429,7 +443,7 @@ const initTodayZqlChart = async () => {
       },
       {
         type: 'value',
-        name:'当日注水量(m³)',
+        name:water+'(m³)',
         axisLabel: {
           color: '#B6C8DA',
           formatter: '{value}'
@@ -561,13 +575,13 @@ const initYwcbChart = async () => {
       //           ${params[0].marker} ${params[0].seriesName}: ${params[0].value}`
       // }
     },
-    legend: {
-      data: ['当日运维成本'],
-      top: 1,
-      textStyle: {
-        color: '#B6C8DA'
-      }
-    },
+    // legend: {
+    //   data: ['当日运维成本'],
+    //   top: 1,
+    //   textStyle: {
+    //     color: '#B6C8DA'
+    //   }
+    // },
     grid: {
       left: '3%',
       right: '4%',
@@ -775,7 +789,7 @@ const qxRef = ref(null)
 let qxInstance;
 let zqlInstance;
 
-const initZqlChart = () => {
+const initZqlChart = (gas:any,water:any) => {
   if (!zqlChartRef.value) return
 
   // 获取数据
@@ -827,7 +841,7 @@ const initZqlChart = () => {
     yAxis: [
       {
         type: 'value',
-        name: '累计注气量(m³)',
+        name: gas+'(m³)',
         axisLabel: {
           color: '#B6C8DA',
           formatter: '{value}'
@@ -850,7 +864,7 @@ const initZqlChart = () => {
       },
       {
         type: 'value',
-        name: '累计注水量(m³)',
+        name: gas+'(m³)',
         axisLabel: {
           color: '#B6C8DA',
           formatter: '{value}'

src/views/pms/stat/rykb.vue

@@ -8,7 +8,7 @@
           icon="fa-solid:project-diagram"
           icon-bg-color="text-blue-500"
           icon-color="bg-blue-100"
-          title="设备数"
+          :title="t('stat.deviceCount')"
         />
       </el-col>
       <el-col :sm="3" :xs="12">
@@ -17,7 +17,7 @@
           icon="fa-solid:list"
           icon-bg-color="text-pink-500"
           icon-color="bg-blue-100"
-          title="维修工单"
+          :title="t('stat.maintenanceOrder')"
         />
       </el-col>
       <el-col :sm="3" :xs="12">
@@ -26,7 +26,7 @@
           icon="fa-solid:times-circle"
           icon-bg-color="text-purple-500"
           icon-color="bg-purple-100"
-          title="运行未填写"
+          :title="t('stat.operationNotFilled')"
         />
       </el-col>
       <el-col :sm="3" :xs="12">
@@ -35,7 +35,7 @@
           icon="fa-solid:award"
           icon-bg-color="text-purple-500"
           icon-color="bg-purple-100"
-          title="运行已填写"
+          :title="t('stat.operationFilled')"
         />
       </el-col>
       <el-col :sm="3" :xs="12">
@@ -44,7 +44,7 @@
           icon="fa-solid:times-circle"
           icon-bg-color="text-green-500"
           icon-color="bg-green-100"
-          title="未执行保养"
+          :title="t('stat.notMaintained')"
         />
       </el-col>
       <el-col :sm="3" :xs="12">
@@ -53,7 +53,7 @@
           icon="fa-solid:award"
           icon-bg-color="text-green-500"
           icon-color="bg-green-100"
-          title="已执行保养"
+          :title="t('stat.maintained')"
         />
       </el-col>
       <el-col :sm="3" :xs="12">
@@ -62,7 +62,7 @@
           icon="fa-solid:times-circle"
           icon-bg-color="text-yellow-500"
           icon-color="bg-yellow-100"
-          title="待填写巡检"
+          :title="t('stat.notInspected')"
         />
       </el-col>
       <el-col :sm="3" :xs="12">
@@ -71,7 +71,7 @@
           icon="fa-solid:award"
           icon-bg-color="text-yellow-500"
           icon-color="bg-yellow-100"
-          title="已填写巡检"
+          :title="t('stat.inspected')"
         />
       </el-col>
       <!-- 其他统计卡片... -->
@@ -82,7 +82,7 @@
         <el-card class="chart-card" shadow="never">
           <template #header>
             <div class="flex items-center">
-              <span class="text-base font-medium" style="color: #b6c8da">设备状态统计</span>
+              <span class="text-base font-medium" style="color: #b6c8da">{{t('stat.deviceStatus')}}</span>
             </div>
           </template>
           <div ref="statusChartRef" class="h-[320px]"></div>
@@ -92,7 +92,7 @@
         <el-card class="chart-card" shadow="never">
           <template #header>
             <div class="flex items-center">
-              <span class="text-base font-medium" style="color: #b6c8da">项目部设备数量统计</span>
+              <span class="text-base font-medium" style="color: #b6c8da">{{t('stat.projectDevice')}}</span>
             </div>
           </template>
           <div ref="topContainer" class="h-[320px]"></div>
@@ -112,7 +112,7 @@
         <el-card class="chart-card" shadow="never">
           <template #header>
             <div class="flex items-center justify-between">
-              <span class="text-base font-medium" style="color: #b6c8da">工单数量情况</span>
+              <span class="text-base font-medium" style="color: #b6c8da">{{t('stat.orderCount')}}</span>
             </div>
           </template>
           <div ref="qxRef" class="h-[320px]"></div>
@@ -127,19 +127,19 @@
           <el-card class="safety-days-card chart-card h-[230px]" shadow="never">
             <template #header>
               <div class="flex items-center">
-                <span class="text-base font-medium" style="color: #b6c8da">安全生产天数</span>
+                <span class="text-base font-medium" style="color: #b6c8da">{{t('stat.safeProduction')}}</span>
               </div>
             </template>
             <div class="safety-days-content">
               <div class="days-number">{{ 165 }}</div>
-              <div class="days-label">天</div>
-              <div class="safety-desc">截至当前连续安全生产天数</div>
+              <div class="days-label">day</div>
+              <div class="safety-desc">{{t('stat.daysToDate')}}</div>
             </div>
           </el-card>
           <el-card class="chart-card mt-1" shadow="never">
             <template #header>
               <div class="flex items-center">
-                <span class="text-base font-medium" style="color: #b6c8da">钻井完成情况</span>
+                <span class="text-base font-medium" style="color: #b6c8da">{{t('stat.drillingCompletion')}}</span>
               </div>
             </template>
             <div ref="drillingWellChartRef" class="h-[170px]"></div>
@@ -150,7 +150,7 @@
         <el-card class="chart-card" shadow="never">
           <template #header>
             <div class="flex items-center">
-              <span class="text-base font-medium" style="color: #b6c8da">钻井工作量情况</span>
+              <span class="text-base font-medium" style="color: #b6c8da">{{t('stat.drillingWork')}}</span>
             </div>
           </template>
           <div ref="drillingWorkloadChartRef" class="h-[405px]"></div>
@@ -160,7 +160,7 @@
         <el-card class="chart-card" shadow="never">
           <template #header>
             <div class="flex items-center">
-              <span class="text-base font-medium" style="color: #b6c8da">修井工作量情况</span>
+              <span class="text-base font-medium" style="color: #b6c8da">{{t('stat.wellWorkoverWorkload')}}</span>
             </div>
           </template>
           <div ref="repairWorkloadChartRef" class="h-[405px]"></div>
@@ -208,7 +208,7 @@ echarts.use([
   GaugeChart,
   BarChart
 ])
-
+const { t } = useI18n() // 国际化
 const dateRange = ref<[Date, Date] | null>(null)
 const by = ref({
   todo: undefined,