dashboard/js/i18no.js

// 同步加载 markers.json 文件
function loadJSONSync(url) {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, false); // false 表示同步请求
    try {
        xhr.send(null);
        if (xhr.status === 200) {
            return JSON.parse(xhr.responseText);
        } else {
            console.error('请求失败，状态码:', xhr.status);
            return null;
        }
    } catch (e) {
        console.error('请求过程中出错:', e);
        return null;
    }
}
 // DOM元素
const elements = {
	htmlElement: document.documentElement,
	bodyElement: document.body
};
var city_data;
function addlist() {
	$('.citylist').liMarquee('destroy');
	let html = ""
	for (i = 0; i < city_data.length; i++) {
		html += `<li class="item" data-item='${JSON.stringify(city_data[i])}'>
			  <p>${city_data[i].brand}</p>
			  <p><span>${city_data[i].vin}</span></p>
			  <p><span>${city_data[i].model}</span> <span class="status">${city_data[i].status}</span></p>
			</li>`
	}
	$(".citylist #nav").html(html)
	$(".citylist").fadeIn()
	listsc()
}
$(".citylist").on('click', '.item', function() {
	var data = $(this).attr('data-item')
	data = JSON.parse(data)
	$('.item').removeClass('liactive')
	
	$(this).addClass('liactive')
	console.log()
	
	$(".cartitle").html(data.brand)
	$(".inner").html('<img src="'+data.img_url+'" alt="" />')
	$(".cartitle").html(data.brand)
	$(".inner").html('<img src="'+data.img_url+'" alt="" />')
	$(".vin").html(data.vin)
	$(".classify").html(data.location.name)
	$(".model").html(data.model)
	$(".destination").html(data.final_location!=null?data.final_location.name:'')
	$(".fbo_destination").html(data.fbo_destination)
	$(".departure_time").html(data.departure_time)
	$(".status").html(data.status)
	$(".arrival_time").html(data.arrival_time)
});
//初始化滚动
function listsc() {
	$('.citylist').liMarquee({
		direction: 'up',
		runshort: false,
		scrollamount: 20 ,//滚动速度
	});
	var $lis = $('.citylist li')
	var index =5; // 当前li的索引
	 var $currentLi = $lis.eq(index); // 获取当前索引的li元素
	 $currentLi.trigger('click'); // 模拟点击事件
	// setInterval(function() {
	// 	var $currentLi = $lis.eq(index); // 获取当前索引的li元素
	// 	$currentLi.trigger('click'); // 模拟点击事件
	//     index++; // 增加索引
	//     if (index >= $lis.length) { // 如果索引超出li的数量，重置为0
	//         index = 0;
	//     }
	// }, 2000); // 每2秒执行一次
	// $('.citylist li').off('click').on('click', function(){
	// 	$(this).addClass('liactive').siblings().removeClass('liactive');
	// }); 
}
var count;
function Vehiclefn(lang){
	$.ajax({
		url:'https://dashboard-server.hesuu.com/Vehicle',
		type:'POST',
		data:{lang:lang},
		success: function(result){
			if(result.code==0){
				city_data= result.data.list
				var i=result.data.count;
				let arr = Array.from(String(i), Number);
				var v=''
				for(var n = 0; n < arr.length; n++) {
					v+='<span>'+arr[n]+'</span>'
				}
				$(".all").html(v)	
				addlist()
			}else{
				alert(result.message)
			}
		}
	});
}
var myChart = echarts.init(document.getElementById('world'));
var lineDatas;
function locationfn(lang){
	$.ajax({
		url:'https://dashboard-server.hesuu.com/location',
		type:'POST',
		data:{lang:lang},
		success: function(result){
			lineDatas = result.data
			Global(chinaGeoCoordMap,nameMap,localStorage.getItem("lang"))
			if(result.code==0){
			}else{
				alert(result.message)
			}
		}
	});
}

			
const i18n = {
  currentLang: 'en', // 默认语言
  init: function() {
	  var that = this
    this.currentLang = localStorage.getItem('lang') || navigator.language.substr(0, 2) || 'en';
    this.loadLanguage(this.currentLang);
	if (this.currentLang === 'ar') {
		elements.htmlElement.lang = 'ar';
		elements.htmlElement.dir = 'rtl';
		elements.bodyElement.setAttribute('dir', 'rtl');
	} else {
		elements.htmlElement.lang = this.currentLang;
		elements.htmlElement.dir = 'ltr';
		elements.bodyElement.removeAttribute('dir');
	}
	Vehiclefn(this.currentLang)
	locationfn(this.currentLang)
	// var selectedText1 = localStorage.getItem('langtext')?localStorage.getItem('langtext'):'中文';
	// $(".select-selected").text(selectedText1);
	// 点击选项时更新选择
	$(".select-items div").click(function() {
		// 更新显示文本
		const selectedText = $(this).text();
		// $(".select-selected").text(selectedText);
		
		// 更新选中状态样式
		$(".select-items div").removeClass("same-as-selected");
		$(this).addClass("same-as-selected");
		
		// 隐藏选项框
		$(".select-selected").removeClass("select-arrow-active");
		$(".select-items").hide();
		
		// 显示当前选择
		localStorage.setItem('langtext', selectedText);
		that.toggleLanguage($(this).attr('data-id'))
		Vehiclefn($(this).attr('data-id'))
		locationfn($(this).attr('data-id'))
		
	});
 //    $('#langSwitch').click(() =>{
	// 	if(this.currentLang === 'en'){
	// 		$(".toggle2-button").removeClass('activebtn')
	// 	}else{
	// 		$(".toggle2-button").addClass('activebtn')
	// 	}
		
	// });
  },
  loadLanguage: function(lang) {
	 var data = loadJSONSync(`./js/lang/${lang}.json`);  
	 console.log(data)
	$('[data-i18n]').each(function() {
	   const key = $(this).data('i18n');
	   $(this).text(data[key]); // 更新文本内容
	 });
	 localStorage.setItem('lang', lang);
  //   $.getJSON(`lang/${lang}.json`, (data) => {
		// console.log(data)
  //     $('[data-i18n]').each(function() {
  //       const key = $(this).data('i18n');
  //       $(this).text(data[key]); // 更新文本内容
  //     });
  //     localStorage.setItem('lang', lang);
  //   });
  },
  toggleLanguage: function(selectedText) {
	console.log(selectedText)
	console.log('111')
	this.currentLang = selectedText;
    this.loadLanguage(this.currentLang);
	
	if (this.currentLang === 'ar') {
		elements.htmlElement.lang = 'ar';
		elements.htmlElement.dir = 'rtl';
		elements.bodyElement.setAttribute('dir', 'rtl');
	} else {
		elements.htmlElement.lang = this.currentLang;
		elements.htmlElement.dir = 'ltr';
		elements.bodyElement.removeAttribute('dir');
	}
	Global(chinaGeoCoordMap,nameMap,this.currentLang)
  }
};
$(document).ready(() => i18n.init());