You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
|
|
"use client";
|
|
|
|
|
import React from "react";
|
|
|
|
|
|
|
|
|
|
interface LangSwitchProps {
|
|
|
|
|
basePath?: string;
|
|
|
|
|
locale?: string;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export function LangSwitch({ basePath = "", locale = "zh-CN" }: LangSwitchProps) {
|
|
|
|
|
const onSwitch = () => {
|
|
|
|
|
const current = window.location.pathname;
|
|
|
|
|
const parts = current.split("/").filter(Boolean);
|
|
|
|
|
const currentLocale = parts[0] === "en" ? "en" : parts[0] === "zh-CN" ? "zh-CN" : null;
|
|
|
|
|
const nextLocale = currentLocale === "en" ? "zh-CN" : "en";
|
|
|
|
|
if (currentLocale) {
|
|
|
|
|
parts[0] = nextLocale;
|
|
|
|
|
} else {
|
|
|
|
|
parts.unshift(nextLocale);
|
|
|
|
|
}
|
|
|
|
|
const nextPath = "/" + parts.join("/");
|
|
|
|
|
window.location.assign(nextPath);
|
|
|
|
|
};
|
|
|
|
|
const buttonText = locale === "en" ? "CN" : "EN";
|
|
|
|
|
return (
|
|
|
|
|
<button
|
|
|
|
|
onClick={onSwitch}
|
|
|
|
|
className="bg-white border border-[#ccd5e4] text-[#0f3c88] px-2.5 py-1.5 rounded-[6px] text-xs md:text-sm tracking-[0.14em] uppercase cursor-pointer hover:bg-[#0f3c88] hover:text-white active:scale-95 transition-all duration-150 touch-manipulation"
|
|
|
|
|
>
|
|
|
|
|
{buttonText}
|
|
|
|
|
</button>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|