语言配置回显

This commit is contained in:
北枳 2025-09-16 14:55:44 +08:00
parent a00aa3d46a
commit 7230a7e061
2 changed files with 24 additions and 16 deletions

View File

@ -251,3 +251,8 @@ body {
.ant-switch.ant-switch-checked:hover { .ant-switch.ant-switch-checked:hover {
background: rgb(146 78 173) !important; background: rgb(146 78 173) !important;
} }
.language-dropdown li {
padding: unset !important;
margin: 0.25rem !important;
}

View File

@ -51,15 +51,15 @@ import { PcPhotoStoryModal } from "./PcPhotoStoryModal";
import { H5PhotoStoryDrawer } from "./H5PhotoStoryDrawer"; import { H5PhotoStoryDrawer } from "./H5PhotoStoryDrawer";
const LauguageOptions = [ const LauguageOptions = [
{ value: "english", label: "English", isVip: false, code:'en' }, { value: "english", label: "English", isVip: false, code:'EN' },
{ value: "chinese", label: "Chinese", isVip: false, code:'zh' }, { value: "chinese", label: "Chinese", isVip: false, code:'ZH' },
{ value: "japanese", label: "Japanese", isVip: false, code:'ja' }, { value: "japanese", label: "Japanese", isVip: false, code:'JA' },
{ value: "spanish", label: "Spanish", isVip: false, code:'es' }, { value: "spanish", label: "Spanish", isVip: false, code:'ES' },
{ value: "portuguese", label: "Portuguese", isVip: false, code:'pt' }, { value: "portuguese", label: "Portuguese", isVip: false, code:'PT' },
{ value: "hindi", label: "Hindi", isVip: false, code:'hi' }, { value: "hindi", label: "Hindi", isVip: false, code:'HI' },
{ value: "korean", label: "Korean", isVip: false, code:'ko' }, { value: "korean", label: "Korean", isVip: false, code:'KO' },
{ value: "arabic", label: "Arabic", isVip: false, code:'ar' }, { value: "arabic", label: "Arabic", isVip: false, code:'AR' },
{ value: "russian", label: "Russian", isVip: false, code:'ru' }, { value: "russian", label: "Russian", isVip: false, code:'RU' },
] ]
/**模板故事模式弹窗组件 */ /**模板故事模式弹窗组件 */
@ -343,11 +343,16 @@ export function ChatInputBox({ noData }: { noData: boolean }) {
{/* 语言配置 */} {/* 语言配置 */}
<Dropdown <Dropdown
overlayClassName="language-dropdown"
menu={{ menu={{
items: LauguageOptions.map((option) => ({ items: LauguageOptions.map((option) => ({
key: option.value, key: option.value,
label: ( label: (
<div className="flex items-center justify-between px-2 py-2"> <div className={`flex items-center justify-between px-2 py-2 ${
option.value === configOptions.language
? "bg-white/[0.12] rounded-md"
: ""
}`}>
<span className="text-sm text-white">{option.label}</span> <span className="text-sm text-white">{option.label}</span>
{option.isVip && ( {option.isVip && (
<Crown className="w-4 h-4 text-yellow-500" /> <Crown className="w-4 h-4 text-yellow-500" />
@ -358,16 +363,14 @@ export function ChatInputBox({ noData }: { noData: boolean }) {
onClick: ({ key }) => onConfigChange('language', key), onClick: ({ key }) => onConfigChange('language', key),
}} }}
trigger={["click"]} trigger={["click"]}
placement="topRight" placement="top"
> >
<button <button
data-alt={`config-language`} data-alt={`config-language`}
className={`flex items-center gap-2 text-white/80 transition-all duration-200 px-2 py-2`} className={`flex items-center gap-1 text-white/80 transition-all duration-200 px-2 py-2`}
> >
<Globe className={"w-4 h-4"} /> <Globe className={"w-4 h-4"} />
{LauguageOptions.find((option) => option.value === configOptions.language)?.isVip && ( <span className="text-sm">{LauguageOptions.find((option) => option.value === configOptions.language)?.code}</span>
<Crown className={`w-2 h-2 text-yellow-500`} />
)}
</button> </button>
</Dropdown> </Dropdown>
</div> </div>