哥伦比亚展会大屏 添加西班牙语国际化内容

接口调试

src/http/Exhibition/Colombia/index.ts

@@ -8,5 +8,5 @@ export function columbiaDeviceList(){
 
 //获取设备在线状态、设备列表
 export function columbiaDeviceProduction(){
-    return get('/creen/cisma/columbiaDeviceProduction')
+    return get('/screen/cisma/columbiaDeviceProduction')
 }

src/locales/index.ts

@@ -11,11 +11,13 @@
 import { createI18n } from 'vue-i18n'
 import enLocale from './lang/en';
 import zhLocale from './lang/zh';
+import SpanishLocale from './lang/Spanish'
 import { getStoredLanguage, saveStoredLanguage } from "../utils/languageStorage";
  
 const messages = {
     简体中文: zhLocale,
     'English/USD': enLocale,
+    'Spanish/USD': SpanishLocale,
 }
  
 const defaultLocale = "简体中文";

src/locales/lang/Spanish.ts

@@ -0,0 +1,319 @@
+
+export default {
+    messages: {
+        'energyConsume': 'Energy Consumption Real-time Monitoring System',
+        'ECHistoryData' :'Energy Historical data detection System',
+        'generalEnvironment': 'Environment-Convention Real-time Monitoring System',
+        'InPlantProducts': 'Iot System Products in Factory',
+        'Mechanics': 'Machinery Factory Equipment Monitor and Control Center',
+        'MicrofactoryDev': 'Micro-Factory Equipment IoT',
+        'Offsite': 'Iot System of Products in Factory',
+
+        'realtimeSecurity': 'security Real-time Monitoring System',
+
+        'FactoryView': '物联传感器分布图3D版本',
+        'PaintShopView': 'Surface Finishing Environment',
+        'stuffView': 'Large-Piece Processing Environment',
+        'machiningView': 'Machining Environment',
+        'finishView': 'Fine Machining Environment',
+        'weldView': 'Welding Environment',
+        'MechanicalView': 'Machinery Factory Sensor distribution',
+        'MechanicalViewDajian': 'Large-Piece Processing Sensor distribution',
+        'MechanicalViewHanjie': 'Welding Sensor distribution',
+        'MechanicalViewJijia': 'Machining Sensor distribution',
+        'MechanicalViewJingjia': 'Fine Machining Sensor distribution',
+        'MechanicalViewJingshi': 'Surface Finishing Sensor distribution',
+        'realtimeSecurityJixie': 'Machinery Factory security Real-time Monitoring System',
+        'energyConsumejixie': 'Machinery Factory Energy Consumption Real-time Monitoring System',
+        'generalEnvironmentjixiefenchang': 'Machinery Factory Environment-Convention Real-time Monitoring System',
+        'electronicControl': 'Electrical Control Factory Equipment Monitor and Control Center',
+        'electronicControlAmbient': 'Electrical Control Factory Real-time Monitoring System',
+        'pmData': 'Dust Sensor Data detection system',
+        'mechanicalPm': '机械分厂粉尘监测走势图',
+        'mechanical_TVOC_CH2O': '机械分厂TVOC_CH2O监测走势图',
+        'mechanical_humidity': '机械分厂温湿度监测走势图',
+        'mechanical_noise': '机械分厂噪声监测走势图',
+        
+        'performanceYOYto2023':'2023 Production Efficiency Year-on-Year\n Ratio(°/CNY10000)',
+        'PowerProductionto2023':'2023 Ratio of EC of Production',
+        'Productionto2023':'2023 Production Volume (CNY)',
+        'Powerto2023':'Electricity Consumption (EC) (°)',
+        'jixiePowerto2023':'2023 Electricity Consumption (EC) (°)',
+        'waterto2023_t':'2023 Water Consumption(Ton)',
+        'waterto2023':'2023 Water Consumption(m³)',
+        'gasto2023':'2023 Air Consumption(m³)',
+        'powerTip':'EC',
+        'powerhi_du':'Electricity Consumption(°)',
+        'Production_yuan':'Production(CNY)',
+        'Production':'Production',
+        'powerhistory':'2018-2022 Electricity Consumption(°)',
+        'waterhistory':'Water Consumption(m³)',
+        'gashistory':'Air Consumption(m³)',
+        'waterTip':'Water Consumption',
+        'gasTip':'Air Consumption',
+        'noise_DB':'Noise(dB)',
+        'pmHanJie':'Welding\n(pm2.5/pm10)',
+        'pmJingShi':'Surface Finishing\n(pm2.5/pm10)',
+        'pmDaJian':'Large-Piece Processing\n(pm2.5/pm10)',
+        'TemperatureHumidity':'Temperture and Humidity',
+        'TemperatureRange':'Temperature',
+        'TemperatureRange_down':'Lower Limit Value',
+        'TemperatureRange_up':'Upper Limit Value',
+        'HumidityRange':'Humidity',
+        'TemperatureHumidityexceeded':'Exceed Limit (when temperature and humidity not at normal value)',
+        'noiseexceeded':'Exceed Limit',
+        'noiseRange':'Within Limit',
+        'fanwei':'Range',
+        'onLine':'Online',
+        'offline':'Offline',
+        'QiCheCommunication':'AIAIM Division Data Communication',
+        'FuZhuangCommunication':'GCCS Division Data Communication',
+        'JiaFangCommunication':'HTCSE Division Data Communication',
+        'YiFangCommunication':'MPE Division Data Communication',
+        'DevNum':'Equipment Quantity',
+        'FuZhuangDevSchedule':'GCCS Division\n Equipment Complete Schedule',
+        'JiaFangDevSchedule':'HTCSE Division\n Equipment Complete Schedule',
+        'YiFangDevSchedule':'MPE Division\n Equipment Complete Schedule',
+        'QiCheDevSchedule':'AIAIM Division\n Equipment Complete Schedule',
+        'InPlantProductsDevList':'Equipment List',
+        'SerialNum':'Serial Number',
+        'RackNum':'Serial',
+        'DevName':'Machine Name',
+        'JiqiName':'Machine Name',
+        'ofLegion':'Affiliated Division',
+        'DevStatus':'Estado maq.',
+        'JiqiStatus':'Machine Status',
+        "RunTime":'Running hours',
+        'finishSchedule':'Complete Schedule',
+        'deliveryDay':'Delivery Date',
+        'LoadMore':'Loading More',
+        'QiCheLegionSystem':'AIAIM Division IoT Management System',
+        'FuZhuangLegionSystem':'GCCS Division IoT Management System',
+        'JiaFangLegionSystem':'HTCSE Division IoT Management System',
+        'YiFangLegionSystem':'MPE Division IoT Management System',
+        'GatewayStatus':'IoT Gateway Status',
+        'QiCheLegion':'AIAIM Division',
+        'YiFangLegion':'MPE Division',
+        'FuZhuangLegion':'GCCS Division',
+        'JiaFangLegion':'HTCSE Division',
+        'TOTAL':'Total Quantity',
+        'OnlineNum':'Online Quantity',
+        'units':'set',
+        'LegionDevList':'Division Equipment List',
+        'DevType':'Equipment Type',
+        'JiqiType':'Machine Type',
+        'model':'Model',
+        'InstallPhase':'Installation',
+        'AssemblyGroup':'Assembly Group',
+        'electronicGroup':'Electrical Assembly Group',
+        'inspector':'Inspector',
+        'DebugProgress':'Adjusting Schedule',
+        'DevInfo':'Equipment Information',
+        'DevDetails':'Machine Details',
+        'DevMotor':'Equipment Motor',
+        'DevSensors':'Equipment Sensor',
+        'SupplierName':'Supplier Name',
+        'SupplierSalesperson':'Machandiser of Supplier',
+        'TradeType':'Trade Type',
+        'ModelNo':'Machine Model',
+        'productName':'Product Name',
+        'OrderNo':'Order Number',
+        'SoldDest':'Delivery Destination',
+        'SoldDest_terminal':'Delivery Destination(Terminal)',
+        'orderManufactureDate':'Order Date',
+        'ClientName':'Customer Name',
+        'ClientSalesman':'Salesman',
+        'expectDeliveryDate':'Estimated Delivery Date',
+        'JingJia_datacom':'Fine Machining-Data Communication',
+        'JiJia_datacom':'Machining-Data Communication',
+        'DaJian_datacom':'Large-Piece Processing-Data Communication',
+        'JingShi_datacom':'Surface Finishing-Data Communication',
+        'HanJie_datacom':'Welding-Data Communication',
+        'JingJiaDevStatus':'Fine Machining Equipment Status',
+        'JiJiaDevStatus':'Machining Equipment Status',
+        'DaJianDevStatus':'Large-Piece Equipment Status',
+        'JingShiDevStatus':'Surface Equipment Status',
+        'HanJieDevStatus':'Welding Equipment Status',
+        'work':'Trabajando',
+        'STOP':'Emergency Stop',
+        'halt':'Parada',
+        'Standby':'Esperando',
+        'firing':'启Start动',
+        'DevDiagram_JiJia':'Machinery Factory Equipment IoT-Machining Workshop',
+        'DevDiagram_JingJia':'Machinery Factory Equipment IoT-Fine Machining Workshop',
+        'DevDiagram_DaJian':'Machinery Factory Equipment IoT-Large-Piece Processing Workshop',
+        'DevDiagram_JingShi':'Machinery Factory Equipment IoT-Painting Workshop',
+        'DevDiagram_HanJie':'Machinery Factory Equipment IoT-Welding Workshop',
+        'machineryDevStatus':'Machinery Factory D-States',
+        'procureDate':'Purchasing Date',
+        'workTime':'Running hours',
+        'StandbyTime':'Standby hours',
+        'haltTime':'Emergency Stop hours',
+        'DevRunComparison':'Running Comparison Diagram',
+        'TimeUtilizationRate':'Time Utilization',
+        'UtilizationRate':'Tiempo utilizado',
+        'MicrofactoriesDevChart':'Micro-Factory Equipment IoT',
+        'MicrofactoriesDevinfo':'Micro-Factory Equipment Information',
+        'DevRunNum':'Running Equipment Quantity',
+        'GatewayOff':'Gateway Offline',
+        'GatewayON':'Gateway Online',
+        'DevOffNum':'Offline Equipment Quantity',
+        'SewingTime':'Sewing Time',
+        'realityPresserFootLiftNum':'Actual Press-foot Lift times',
+        'AvgPresserFootLiftNum':'Average Press-foot Lift times',
+        'ratio':'Ratio',
+        'realityTrimNum':'Actual Thread-trimming times',
+        'AvgTrimNum':'Average Thread-trimming times',
+        'runTime':'Duración trabajo',
+        'datacom':'Data Communication',
+        'OffSiteDevList':'Equipment List outside the factory',
+        'province':'Province',
+        'type':'Type',
+        'OnlineOrNot':'Online or not',
+        'DongGuanAffiliate':'Dongguan Branch',
+        'ZheJiangAffiliate':'Zhejiang Branch',
+        'DevAllNum':'Total Quantity of Equipment ',
+        'OnProduct':'Online Product',
+        'OffProduct':'Offline Product',
+        'DongGuan_GatewayStatus':'Dongguan-IoT Gateway Status',
+        'DevPreviewChart':'Equipment Preview',
+        'JiqiPreviewChart':'Machine Preview',
+        'OffNum':'Offline Quantity',
+        'DongGuanDevList':'Dongguan Branch Devices',
+        'Ex_factoryDate':'EXW Date',
+        'Devsignal':'Equipment Signal',
+        'DevReminder':'Equipment Warning',
+        'JiqiReminder':'Machine Warning',
+        'abnormal':'Abnormal',
+        'NoAbnormal':'No Abnormal',
+        'disconnection':'Disconnect',
+        'TVOCDetection':'TVOC Test',
+        'smokeDetection':'Smoke Test',
+        'gasDetection':'Gas Test',
+        'CH2ODetection':'Alcohol Test',
+        'flameDetection':'Fire Test',
+        'EastPumpPressure_Mpa':'East Pump Room Air Pressure',
+        'WestPumpPressure_Mpa':'West Pump Room Air Pressure',
+        'PipelinePressure_Mpa':'Pipeline Pressure',
+        'normal_Tip':'Normal',
+        'abnormal_Tip':'Abnormal',
+        'abnormal_Tip_yishang':'Above',
+        'position':'Position',
+        'NormalRange':'Normal Range',
+        'CurrentValue':'Current Value',
+        'humitureSensor':'Temperature/Humidity Sensor',
+        'noiseSensor':'Noise Sensor',
+        'powerSensor':'Electricity Sensor',
+        'sparkSensor':'Fire Sensor',
+        'dustSensor':'Dust Sensor',
+        'TVOC_CH2OSensor':'TVOC/Alcohol Sensor',
+        'smokeSensor':'Smoke Sensor',
+        'gasSensor':'Gas Sensor',
+        'waterPressureSensor':'Water Pressure Sensor',
+        'gasPressureSensor':'Air Pressure Sensor',
+        'gateway':'Gateway',
+        'Dev':'Equipment',
+        'productStudyDevelopment':'Richsafty office',
+        'machineDesign':'Mechanical Design and Administrative Office',
+        'ExternalWork':'Domestic/Overseas Sales Office',
+        'BigPeiTao':'Sourcing Center',
+        'twoLou':'Second Floor',
+        'EmployeeApartment':'Staff Apartment',
+        'SecurityRoom':'Security Room',
+        'WaterRoom':'Water Room',
+        'SynthesizeRoom':'Office Building',
+        'store':'Warehouse',
+        'ControllerRoom':'Electrical Control Workshop',
+        'AutomotiveDivision':'汽车部',
+        'JingJiaRoom':'Fine Machining Workshop',
+        'JiJiaRoom':'Machining Workshop',
+        'eastAirPumpRoom':'East Pump Room',
+        'DaJianRoom':'Large-Piece Processing Workshop',
+        'ManualSandblastingRoom':'Manual Sandblasting Room',
+        'DryingRoom':'Drying Room',
+        'GrindingRoom':'Polishing Room',
+        'JingShiRoom':'Painting Workshop',
+        'PowderSprayingRoom':'Powder Coating Room',
+        'DaJianPaintingRoom':'Spraying Room',
+        'boilerRoom':'Boiler Room',
+        'HanJieRoom':'Welding Workshop',
+        'canteen':'Canteen',
+        'Dormitory':'Dormitory',
+        'JingShi_generalEnvironment':'Surface Finishing-Environment Real-time Monitoring System',
+        'DaJian_generalEnvironment':'Large-Piece Processing-Environment Real-time Monitoring System',
+        'JiJia_generalEnvironment':'Machining-Environment Real-time Monitoring System',
+        'JingJia_generalEnvironment':'Fine Machining-Environment Real-time Monitoring System',
+        'HanJie_generalEnvironment':'Welding-Environment Real-time Monitoring System',
+        'noiseDetection':'Noise Test',
+        'NormalValue':'Normal Value',
+        'PowerConsumption_2023':'Electricity Consumption (EC) (°)',
+        'Production_2023':'Production Volume (CNY)',
+        'GasConsumption_2023JiXie':'Mechinery Factory AC (m³)',
+        'DianKongGatewayDtatus':'Electrical Control Factory IoT Gateway Status',
+        'DianKongDevList':'Electrical Control Factory List',
+        'DianKongDetection':'Electrical Control Factory Real-time Monitoring System',
+        //补
+        'AllNum':'Total',
+        'CH2Ojiance':'Alcohol Test',
+        'DevList':'Devices',
+        'JiqiList':'machine',
+        'AlarmTime':'Alarm Time',
+        'duration':'duration',
+        'IoT_System':'IoT Management System',
+        'environment_dust':'Environment-Dust Real-time Monitoring System',
+        '加载更多':'Load More',        
+        '已调试':'Debugged',
+        '未调试':'No Debugged',        
+        '服务器机房':'server room',
+        '料场':'Raw Material Area',
+        '危废暂存间':'dangerous waste temporary storage room',
+        '历史数据':'Historical Data',
+        '环境 实时监测系统':'环境 实时监测系统',
+        '传感器监测走势图':'传感器监测走势图',
+        '机械分厂设备列表':'机械分厂设备列表',        
+        '设备状态总览':'设备状态总览',
+        '产品状态':'产品状态',
+        '产品数量':'产品数量',
+        '产品类型':'产品类型',
+        '产品信息':'产品信息',
+        '产品电机':'产品电机',
+        '产品传感器':'产品传感器',
+        '机器名称':'机器名称',
+        '机器类型':'机器类型',
+        '机器状态':'机器状态',
+        '南门水房物联监测系统':'南门水房物联监测系统',
+        '数据监测':'数据监测',
+        '进水':'进水',
+        '出水':'出水',
+        '消耗':'消耗',        
+        '储水':'储水',
+        '用电':'用电',
+        '总体趋势图':'总体趋势图',
+        '近一周':'Last Week',
+        '近一月':'Last Month',
+        '近三月':'Last Three Months',
+        '最大值':'Max',
+        '最小值':'Min',
+        '平均值':'Avg',
+        '效益&效率':'Benefit&Efficiency',
+        '效益':'Benefit',
+        '效率':'Efficiency',        
+        '微工厂缝纫设备看板':'微工厂缝纫设备看板',
+        '工作时间':'工作时间',
+        '空闲时间':'空闲时间',
+        '智能货架物联管理系统':'智能货架物联管理系统',
+        '微工厂':'微工厂',        
+        '微工厂环境实时监测系统':'微工厂环境实时监测系统',
+        
+        '富怡物联管理平台':'Richpeace Plataforma de Gestión de IoT',
+        '服装模板机':'Máquina de costura automática',
+        '单头混合毛巾绣花机':'Bordadora con chenille',
+        '绘图仪':'Plotter',
+        '日产量':'Prod. diaria',
+        '计划产量':'Prod. planeada',
+        '实际产量':'Prod. real',
+        '年':'Año',
+        '月':'Mes',
+        '日':'Fecha',
+      }
+  }

src/locales/lang/en.ts

@@ -313,5 +313,16 @@ export default {
         '智能货架物联管理系统':'智能货架物联管理系统',
         '微工厂':'微工厂',        
         '微工厂环境实时监测系统':'微工厂环境实时监测系统',
+        
+        '富怡物联管理平台':'富怡物联管理平台',
+        '服装模板机':'服装模板机',
+        '单头混合毛巾绣花机':'单头混合毛巾绣花机',
+        '绘图仪':'绘图仪',
+        '日产量':'日产量',
+        '计划产量':'计划产量',
+        '实际产量':'实际产量',
+        '年':'年',
+        '月':'月',
+        '日':'日',
       }
   }

src/locales/lang/zh.ts

@@ -313,5 +313,17 @@ export default {
         '智能货架物联管理系统':'智能货架物联管理系统',
         '微工厂':'微工厂',
         '微工厂环境实时监测系统':'微工厂环境实时监测系统',
+        '富怡物联管理平台':'富怡物联管理平台',
+        '服装模板机':'服装模板机',
+        '单头混合毛巾绣花机':'单头混合毛巾绣花机',
+        '绘图仪':'绘图仪',
+        '日产量':'日产量',
+        '计划产量':'计划产量',
+        '实际产量':'实际产量',
+        '年':'年',
+        '月':'月',
+        '日':'日',
+
+
       }
   }

src/router/index.ts

@@ -376,6 +376,7 @@ router.beforeEach(async (to: any, from, next) => {
   // ...
   let address = to.name
   let hash = to.query.hash
+  let lang = to.query?.lang||''
   let arr = [
     'legionProducts', 'devItem', 'tufting', 'Winding', 'Large_Format',
     'GetonAgain', 'OffsiteDevList', 'Mechanicschild', 'Mechanicsson','historyData', 'jixieHistoryData'

src/utils/languageStorage.ts

@@ -7,3 +7,11 @@ export function getStoredLanguage(): string | null {
 export function saveStoredLanguage(language: string): void {
   localStorage.setItem("selectedLanguage", language);
 }
+
+export function languageHash(language: string): string {
+  return {
+    en: "English/USD",
+    zh: "简体中文",
+    es: "Spanish/USD",
+  }[language];
+}

src/views/Exhibition/Colombia/component/BarChart.vue

@@ -4,7 +4,8 @@
 
 <script setup lang='ts'>
 import { ref, getCurrentInstance, onMounted, watch } from 'vue'
-
+import { useI18n } from 'vue-i18n'
+let { t } = useI18n();
 
 const prop = defineProps({
     xData: {
@@ -32,7 +33,7 @@ const setCharts = () => {
 
         },
         grid: {
-            left:'80',
+            left: '45',
             right: '0',
             bottom: '40',
         },
@@ -40,15 +41,22 @@ const setCharts = () => {
         xAxis: {
             type: 'category',
             data: prop.xData,
-            // axisLabel: {
+            axisLine: {
-            //     interval: 0, //控制X轴刻度全部显示
+                show: true,
-            //     rotate: 45, //倾斜角度
+                lineStyle: {
-            // },
+                    // color: "#fff",
+                },
+            },
+            axisLabel: {
+                show: true,
+                interval: 0, //控制X轴刻度全部显示
+                // rotate: 25, //倾斜角度
+            },
         },
         yAxis: [
             {
                 type: 'value',
-                name: '日产量',
+                name: t('messages.日产量'),
                 axisLabel: {
                     fontSize: 14
                 }
@@ -67,21 +75,31 @@ const setCharts = () => {
 
 watch(() => prop.seriesData, (newVal, oldVal) => {
     charts.setOption({
-        series: newVal
+        series: [
+            {
+                data: newVal,
+                type: 'bar'
+            }
+        ]
     });
 }, { deep: true })
 watch(() => prop.xData, (newVal, oldVal) => {
     charts.setOption({
-
-        xAxis: {
             type: 'category',
             data: prop.xData,
-            // axisLabel: {
+            axisLine: {
-            //     interval: 0, //控制X轴刻度全部显示
+                show: true,
-            //     rotate: 45, //倾斜角度
+                lineStyle: {
-            // },
+                    // color: "#fff",
+                },
+            },
+            axisLabel: {
+                show: true,
+                interval: 0, //控制X轴刻度全部显示
+                // rotate: 25, //倾斜角度
             },
         });
+    
 }, { deep: true })
 onMounted(() => {
     setCharts()

src/views/Exhibition/Colombia/component/Border.vue

@@ -53,10 +53,9 @@ let prop = defineProps({
     width: 100%;
     height: 16%;
     text-align: left;
-    font-family: "华文新魏", sans-serif;
     font-weight: 400;
     font-style: normal;
-    font-size: 40px;
+    font-size: 30px;
     color: rgba(0, 255, 255, 0.996078431372549);
     display: flex;
     align-items: center;

src/views/Exhibition/Colombia/component/DevCard.vue

@@ -5,10 +5,10 @@
         </div>
         <div class="dev-right">
             <div class="dev-box">
-                <div class="dev-content dev-title">
+                <div class="dev-content-left dev-title">
                     <div class="key" v-for="item in dev_title">{{ item }}</div>
                 </div>
-                <div class="dev-content" v-for="(items, index) in (dev_value as any)">
+                <div class="dev-content-right" v-for="(items, index) in (dev_value as any)">
                     <div v-for="(item, index) in items" class="dev_value">
                         <div :class="{ status: index == 1 }"
                             :style="{ background: index == 1 ? status_color[item] : '' }">{{ index ==
@@ -79,8 +79,17 @@ const status_color = {
     align-items: center;
 }
 
-.dev-content {
+.dev-content-left {
-    width: 100%;
+    width: 60%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
+    align-items: center;
+    font-weight: bold;
+}
+.dev-content-right {
+    width: 40%;
     height: 100%;
     display: flex;
     flex-direction: column;
@@ -98,11 +107,14 @@ const status_color = {
 .key {
     width: 75px;
     height: 35px;
-    line-height: 35px;
+    /* line-height: 35px; */
     text-align: center;
     font-size: 18px;
     font-weight: 700;
     color: #02C1D7;
+    display: flex;
+    justify-content: center;
+    align-items: center;
     /* background: url(@/assets/img/title_bg.svg) no-repeat center center / 100% 100%; */
 }
 

src/views/Exhibition/Colombia/component/Header.vue

@@ -14,15 +14,15 @@
     <div class="left-tip-type">
             <div class="left-tip-type-item">
                 <div class="yuan green"></div>
-                <div class="left-tip-type-item-text">工作</div>
+                <div class="left-tip-type-item-text">{{t('messages.work')}}</div>
             </div>
             <div class="left-tip-type-item">
                 <div class="yuan yello"></div>
-                <div class="left-tip-type-item-text">待机</div>
+                <div class="left-tip-type-item-text">{{t('messages.Standby')}}</div>
             </div>
             <div class="left-tip-type-item">
                 <div class="yuan red"></div>
-                <div class="left-tip-type-item-text">停机</div>
+                <div class="left-tip-type-item-text">{{t('messages.halt')}}</div>
             </div>
         </div>
   </div>
@@ -31,6 +31,8 @@
 
 <script setup lang='ts'>
 import { onMounted,onUpdated } from "vue";
+import { useI18n } from 'vue-i18n'
+let { t } = useI18n();
 const prop = defineProps({
   title: {
     type: String,
@@ -60,16 +62,15 @@ onMounted(() => {
   align-items: center;
   background: url('./../images/header.png') no-repeat;
   background-size: 100% 100%;
-  font-family: "华文新魏", sans-serif;
 }
 
 .headerbg span {
   position: absolute;
   top: 25px;
-  
+  line-height: 50px;
   font-weight: 400;
   font-style: normal;
-  font-size: 52px;
+  font-size: 30px;
   color: rgba(0, 255, 255, 0.996078431372549);
 }
 
@@ -78,8 +79,8 @@ onMounted(() => {
 .left-tip-type {
     position: absolute;
     top: 40px;
-    left: 462px;
+    left: 400px;
-    width: 160px;
+    width: 256px;
     height: 50px;
     display: flex;
     justify-content: space-between;

src/views/Exhibition/Colombia/index.vue

@@ -12,12 +12,12 @@
     <div class="container">
         <div class="header">
             <div class="title">
-                <Header :title="'富 怡 物 联 管 理 平 台'" :wh="{ width: '100%', height: '100px' }"></Header>
+                <Header :title="t('messages.富怡物联管理平台')" :wh="{ width: '100%', height: '100px' }"></Header>
             </div>
         </div>
         <div class="content">
             <div class="left">
-                <BorderVue :title="'服装模板机'">
+                <BorderVue :title="t('messages.服装模板机')">
                     <div class="box">
                         <img src="./images/fzmbj.png" class="fzmbj-img" alt="">
                         <div class="devcard-container">
@@ -38,7 +38,7 @@
                     </video>
                 </div>
                 <div class="cbottom">
-                    <BorderVue :title="'单头混合毛巾绣花机'">
+                    <BorderVue :title="t('messages.单头混合毛巾绣花机')">
                         <div class="box">
                             <div class="box-top">
                                 <div class="top-item" v-for="(item, index) in mjxhj_data">
@@ -62,7 +62,7 @@
                 </div>
             </div>
             <div class="right">
-                <BorderVue :title="'绘图仪（一代）'">
+                <BorderVue :title="t('messages.绘图仪')">
                     <div class="box">
                         <img src="./images/hty.png" class="fzmbj-img" alt="">
                         <div class="devcard-container">
@@ -91,15 +91,22 @@ import { ref, onMounted, onUnmounted, getCurrentInstance, watch, onUpdated, comp
 
 import {columbiaDeviceList,columbiaDeviceProduction} from '@/http/Exhibition/Colombia'
 import { connectWebsocket, closeWebsocket } from "@/utils/websocket"
-
+import { getStoredLanguage, saveStoredLanguage,languageHash } from "@/utils/languageStorage";
+import { useRoute } from 'vue-router'
 import { useI18n } from 'vue-i18n'
+let route = useRoute()
 let { t } = useI18n();
+let lang = route.query.lang as string
+if (lang &&languageHash(lang) != getStoredLanguage()) {
+    saveStoredLanguage(languageHash(lang))
+    window.location.reload()
+}
 
 let videoUrl = ref('https://d.tufting222.cn/video/yzy/a.mp4')
 const videoElement = ref(null)
 let timer = null
-
+let timers = null
-let dev_title = ref(['机架号', '设备状态', '稼 动 率', '工作时长'])
+let dev_title = ref([t('messages.RackNum'), t('messages.DevStatus'), t('messages.UtilizationRate'), t('messages.RunTime')])
 let mubanji_value = ref([
     [102014422, '0', '40层', '0min']
 ])
@@ -107,10 +114,10 @@ let huituyi_value = ref([
     [102014422, '0', '40层', '0min']
 ])
 let mjxhj_data = reactive([
-    { key: '机 架 号', value: '102014422' },
+    { key: t('messages.RackNum'), value: '102014422' },
-    { key: '设备状态', value: 2 },
+    { key: t('messages.DevStatus'), value: 2 },
-    { key: '稼 动 率', value: '40层' },
+    { key: t('messages.UtilizationRate'), value: '40层' },
-    { key: '工作时长', value: '0min' },
+    { key: t('messages.RunTime'), value: '0min' },
 ])
 const status_color = {
     '0': '#FF6E76',
@@ -141,14 +148,13 @@ async function getcolumbiaDeviceList() {
 }
 
 
-let data_chart = reactive({ mubanji_series: [], xiuhuaji_series: [], huituyi_series: [], xData: ["计划产量","实际产量"] })
+let data_chart = reactive({ mubanji_series: [1,2], xiuhuaji_series: [3,4], huituyi_series: [5,6], xData: [t('messages.计划产量'),t('messages.实际产量')] })
 
 function getcolumbiaDeviceProduction() {
     columbiaDeviceProduction().then((result:any) => {
         
         if (result.code == 200) {
             let {data} = result;
-            console.log(data,'-----');
             
             data_chart.mubanji_series = data.mubanji
             data_chart.xiuhuaji_series = data.xiuhuaji
@@ -166,12 +172,23 @@ function getWebsocket(val) {
         let data = JSON.parse(val)
 
 
-        if (data.type == 'mDeviceStatus') {
+        if (data.type == 'WorkingState') {
-            // changestatus(data.msg)
+            let msg = data.msg
+            //绘图仪
+            if (msg.RackNumber == '104019066') {
+                huituyi_value.value[0][1] = msg.WorkingState
+            }
+            //模板机
+            if (msg.RackNumber == '10102118') {
+                mubanji_value.value[0][1] = msg.WorkingState                
+            }
+            //绣花机
+            if (msg.RackNumber == '1021875') {
+                mjxhj_data[1].value = msg.WorkingState
+            }
+
+
         }
-        // if (data.type == 'WorkingState') {
-        //     store.changestatus(data.msg)
-        // }
 
     } catch (err) {
         console.log(err);
@@ -188,6 +205,10 @@ function errWebsocket(val) {
 onMounted(() => {
     getcolumbiaDeviceList()
     getcolumbiaDeviceProduction()
+    timers = setInterval(() => {
+        getcolumbiaDeviceList()
+        getcolumbiaDeviceProduction()
+    }, 1000 * 60)
     connectWebsocket(null, null, getWebsocket, errWebsocket)
     document.getElementById('app').style.backgroundColor = 'rgba(0, 11, 18, 1)'
 })
@@ -195,6 +216,7 @@ onMounted(() => {
 onUnmounted(() => {
     closeWebsocket()
     clearInterval(timer)
+    clearInterval(timers)
     document.getElementById('app').style.backgroundColor = '#100c2a'
 })
 </script>
@@ -326,9 +348,9 @@ onUnmounted(() => {
 }
 .key-text {
     width: 60%;
-    font-size: 28px;
+    font-size: 22px;
     color: #00FFFFFE;
-    font-family: '华文新魏', sans-serif;
+    /* font-family: '华文新魏', sans-serif; */
 }
 
 .value-text {

src/views/index.vue

@@ -20,9 +20,8 @@
           </span>
           <template #dropdown>
             <el-dropdown-menu>
-              <el-dropdown-item :class="'简体中文' == lang ? 'select' : ''" command="简体中文">简体中文</el-dropdown-item>
+              <el-dropdown-item v-for="item in language" :class="item.name == lang ? 'select' : ''" :command="item.name">{{ item.simple }}</el-dropdown-item>
-              <el-dropdown-item :class="'English/USD' == lang ? 'select' : ''"
+              
-                command="English/USD">English</el-dropdown-item>
             </el-dropdown-menu>
           </template>
         </el-dropdown>
@@ -37,7 +36,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted } from "vue";
+import { ref, reactive, onMounted, onUnmounted } from "vue";
 import list from "@/components/assembly/indexList.vue";
 import { useI18n } from "vue-i18n";
 import { getStoredLanguage, saveStoredLanguage } from "@/utils/languageStorage";
@@ -48,260 +47,23 @@ let langicon = require("@/assets/svg/language.svg")
 let route = useRoute()
 window.document.title = "大屏物联管理系统";
 let { t } = useI18n();
-// let routerList = [
+let language = reactive([
-//   {
-//     id: 1,
-//     isLink: false,
-//     path: "/energyConsume",
-//     title: t("messages.energyConsume"),
-//     url: require("../assets/indexImg/energyConsume.png"),
-//     // url:'../../assets/indexImg/energyConsume.png'
-//   },
-//   {
-//     id: 2,
-//     isLink: false,
-//     path: "/generalEnvironment",
-//     title: t("messages.generalEnvironment"),
-//     url: require("../assets/indexImg/generalEnvironment.png"),
-//   },
-//   {
-//     id: 3,
-//     isLink: false,
-//     path: "/InPlantProducts",
-//     title: t("messages.InPlantProducts"),
-//     url: require("../assets/indexImg/InPlantProducts.png"),
-//   },
-//   {
-//     id: 4,
-//     isLink: false,
-//     path: "/Mechanics",
-//     title: t("messages.Mechanics"),
-//     url: require("../assets/indexImg/Mechanics.png"),
-//   },
-//   {
-//     id: 5,
-//     isLink: false,
-//     path: "/MicrofactoryDev",
-//     title: t("messages.MicrofactoryDev"),
-//     url: require("../assets/indexImg/MicrofactoryDev.png"),
-//   },
-//   {
-//     id: 6,
-//     isLink: false,
-//     path: "/Offsite",
-//     title: t("messages.Offsite"),
-//     url: require("../assets/indexImg/Offsite.png"),
-//   },
-//   {
-//     id: 8,
-//     isLink: false,
-//     path: "/realtimeSecurity",
-//     title: t("messages.realtimeSecurity"),
-//     url: require("../assets/indexImg/realtimeSecurity.png"),
-//   },
-//   {
-//     id: 7,
-//     isLink: false,
-//     path: "/FactoryView",
-//     title: t("messages.FactoryView"),
-//     url: require("../assets/indexImg/FactoryView.png"),
-//   },
-//   // {
-//   //   id:9,
-//   //   path:'/AerialView',
-//   //   title:'物联传感器分布图',
-//   //   url:require('../assets/indexImg/AerialView.png')
-//   // },
-//   {
-//     id: 10,
-//     isLink: false,
-//     path: "/PaintShopView",
-//     title: t("messages.PaintShopView"),
-//     url: require("../assets/indexImg/decorationShop.png"),
-//   },
-//   {
-//     id: 11,
-//     isLink: false,
-//     path: "/stuffView",
-//     title: t("messages.stuffView"),
-//     url: require("../assets/indexImg/PaintShopView.png"),
-//   },
-//   {
-//     id: 12,
-//     isLink: false,
-//     path: "/machiningView",
-//     title: t("messages.machiningView"),
-//     url: require("../assets/indexImg/PaintShopView.png"),
-//   },
-//   {
-//     id: 13,
-//     isLink: false,
-//     path: "/finishView",
-//     title: t("messages.finishView"),
-//     url: require("../assets/indexImg/PaintShopView.png"),
-//   },
-//   {
-//     id: 14,
-//     isLink: false,
-//     path: "/weldView",
-//     title: t("messages.weldView"),
-//     url: require("../assets/indexImg/PaintShopView.png"),
-//   },
-//   {
-//     id: 15,
-//     isLink: false,
-//     path: "/MechanicalView",
-//     title: t("messages.MechanicalView"),
-//     url: require("../assets/indexImg/MechanicalView.png"),
-//   },
-//   {
-//     id: 16,
-//     isLink: false,
-//     path: "/MechanicalViewDajian",
-//     title: t("messages.MechanicalViewDajian"),
-//     url: require("../assets/indexImg/MechanicalView.png"),
-//   },
-//   {
-//     id: 17,
-//     isLink: false,
-//     path: "/MechanicalViewHanjie",
-//     title: t("messages.MechanicalViewHanjie"),
-//     url: require("../assets/indexImg/MechanicalView.png"),
-//   },
-//   {
-//     id: 18,
-//     isLink: false,
-//     path: "/MechanicalViewJijia",
-//     title: t("messages.MechanicalViewJijia"),
-//     url: require("../assets/indexImg/MechanicalView.png"),
-//   },
-//   {
-//     id: 19,
-//     isLink: false,
-//     path: "/MechanicalViewJingjia",
-//     title: t("messages.MechanicalViewJingjia"),
-//     url: require("../assets/indexImg/MechanicalView.png"),
-//   },
-//   {
-//     id: 20,
-//     isLink: false,
-//     path: "/MechanicalViewJingshi",
-//     title: t("messages.MechanicalViewJingshi"),
-//     url: require("../assets/indexImg/MechanicalView.png"),
-//   },
-//   {
-//     id: 21,
-//     isLink: false,
-//     path: "/realtimeSecurityJixie",
-//     title: t("messages.realtimeSecurityJixie"),
-//     url: require("../assets/indexImg/realtimeSecurityJixie.png"),
-//   },
-//   {
-//     id: 22,
-//     isLink: false,
-//     path: "/energyConsumejixie",
-//     title: t("messages.energyConsumejixie"),
-//     url: require("../assets/indexImg/energyConsumeMachinery.png"),
-//   },
-//   {
-//     id: 23,
-//     isLink: false,
-//     path: "/generalEnvironmentjixiefenchang",
-//     title: t("messages.generalEnvironmentjixiefenchang"),
-//     url: require("../assets/indexImg/generalEnvironment.png"),
-//   },
-//   {
-//     id: 31,
-//     isLink: false,
-//     path: "/generalEnvironmentMechanical",
-//     title: t("messages.环境 实时监测系统"),
-//     url: require("../assets/indexImg/generalEnvironmentMechanical.png"),
-//   },
-//   {
-//     id: 24,
-//     isLink: false,
-//     path: "/electronicControl",
-//     title: t("messages.electronicControl"),
-//     url: require("../assets/indexImg/electronicControl.png"),
-//   },
-//   {
-//     id: 25,
-//     isLink: false,
-//     path: "/electronicControlAmbient",
-//     title: t("messages.electronicControlAmbient"),
-//     url: require("../assets/indexImg/electronicControlAmbient.png"),
-//   },
-//   // {
-//   //   id: 2,
-//   //   path:'/legionProducts/3',
-//   //   title: '军团物联管理系统',
-//   //   url: require('../assets/indexImg/legionProducts.png')
-//   // },
-//   {
-//     id: 26,
-//     isLink: false,
-//     path: "/pmData",
-//     title: t("messages.pmData"),
-//     url: require("../assets/indexImg/pmdata.png"),
-//   },
-//   // {
-//   //   id: 27,
-//   //   isLink: true,
-//   //   path: "http://8.130.165.100:8081/dashboard/0e748f30-e0ac-11ed-b217-b1f43b805208?publicId=ee1adcf0-c350-11eb-b8eb-250fadb0e449",
-//   //   title: t("messages.mechanicalPm"),
-//   //   url: require("../assets/indexImg/mechanicalPm.png"),
-//   // },
-//   // {
-//   //   id: 28,
-//   //   isLink: true,
-//   //   path: "http://8.130.165.100:8081/dashboard/6bfc6650-e0b1-11ed-b217-b1f43b805208?publicId=ee1adcf0-c350-11eb-b8eb-250fadb0e449",
-//   //   title: t("messages.mechanical_TVOC_CH2O"),
-//   //   url: require("../assets/indexImg/mechanical_TVOC_CH2O.png"),
-//   // },
-//   // {
-//   //   id: 29,
-//   //   isLink: true,
-//   //   path: "http://8.130.165.100:8081/dashboard/44dac830-e0b3-11ed-b217-b1f43b805208?publicId=ee1adcf0-c350-11eb-b8eb-250fadb0e449",
-//   //   title: t("messages.mechanical_humidity"),
-//   //   url: require("../assets/indexImg/mechanical_humidity.png"),
-//   // },
-//   // {
-//   //   id: 30,
-//   //   isLink: true,
-//   //   path: "http://8.130.165.100:8081/dashboard/0514ffe0-e0b8-11ed-b217-b1f43b805208?publicId=ee1adcf0-c350-11eb-b8eb-250fadb0e449",
-//   //   title: t("messages.mechanical_noise"),
-//   //   url: require("../assets/indexImg/mechanical_noise.png"),
-//   // },
-//   {
-//     id: 31,
-//     path: "/waterhousedata",
-//     title: '南门水房物联大屏',
-//     url: require("../assets/indexImg/waterhouse.png"),
-//   },
-//   {
-//     id: 31,
-//     path: "/MicrofactoryDevOnline",
-//     title: '微工厂缝纫设备看板',
-//     url: require("../assets/indexImg/MicrofactoryDevOnline.png"),
-//   },
-//   {
-//     id: 32,
-//     path: "/intelligentShelves",
-//     title: '智能货架物联管理系统',
-//     url: require("../assets/indexImg/intelligentShelves.png"),
-//   },
-// ];
-
-/*
   {
-    id: 1,
+    name: "简体中文",
-    isLink: false,
+    simple: "简体中文",
-    path: "/energyConsume",
+    value: "zh",
-    title: t("messages.energyConsume"),
+  },
-    url: require("../assets/indexImg/energyConsume.png"),
+  {
-    // url:'../../assets/indexImg/energyConsume.png'
+    name: "English/USD",
+    simple: "English",
+    value: "en",
+  },
+  {
+    name: "Spanish/USD",
+    simple: "Español",
+    value: "es",
   }
-  */
+])
  let routerList = ref()
 let lang = ref(getStoredLanguage() || '简体中文')
 function changelang(val) {