15308555518/ frontend
1
0
Fork 0
mirror of https://github.com/cloudreve/frontend.git synced 2025-12-25 19:52:48 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

i18n: user setting / webdav

This commit is contained in:
HFO4 2022-05-12 20:41:07 +08:00
parent 2a38829a0c
commit a44d2f375e
9 changed files with 316 additions and 128 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
public/locales/en-US/application.json
View File

@ -348,5 +348,58 @@
"transferring": "Finished, transfer pending in queue",
"deleteRecord": "Delete record",
"createdAt": "Created at: "
},
"setting": {
"avatarUpdated": "The avatar has been updated and will take effect after refreshing.",
"nickChanged": "Nickname changed and will take effect after refreshing.",
"settingSaved": "Setting saved.",
"themeColorChanged": "Theme color changed.",
"profile": "Profile",
"avatar": "Avatar",
"uid": "UID",
"nickname": "Nickname",
"group": "Group",
"regTime": "Sign in date",
"privacyAndSecurity": "Privacy and security",
"profilePage": "Public profile",
"accountPassword": "Password",
"2fa": "2FA authentication",
"enabled": "Enabled",
"disabled": "Disabled",
"appearance": "Appearance",
"themeColor": "Theme color",
"darkMode": "Dark mode",
"syncWithSystem": "Sync with system",
"fileList": "File list",
"timeZone": "Timezone",
"webdavServer": "Server",
"userName": "Username",
"manageAccount": "Manage accounts",
"uploadImage": "Upload from file",
"useGravatar": "Use Gravatar ",
"changeNick": "Change nickname",
"originalPassword": "Original password",
"enable2FA": "Enable 2FA authentication",
"disable2FA": "Disable 2FA authentication",
"2faDescription": "Please use any 2FA mobile app or password management software that supports 2FA to scan the QR code on the left to add this site. After scanning, please fill in the 6-digit verification code given by the 2FA app to enable 2FA.",
"inputCurrent2FACode": "Enter current 2FA verification code.",
"timeZoneCode": "IANA timezone code",
"authenticatorRemoved": "Authenticator removed.",
"authenticatorAdded": "Authenticator added.",
"browserNotSupported": "Not supported by current browser or environment.",
"removedAuthenticator": "Remove authenticator",
"removedAuthenticatorConfirm": "Are you sure to remove this authenticator？",
"addNewAuthenticator": "Add a authenticator",
"hardwareAuthenticator": "Hardware authenticator",
"copied": "Copied to clipboard.",
"pleaseManuallyCopy": "Current browser does not support, please copy manually.",
"webdavAccounts": "WebDAV Accounts",
"webdavHint": "WebDAV server: {{url}}; Username: {{name}} ; The password is the password of the created account below.",
"annotation": "Annotation",
"rootFolder": "Relative root folder",
"createdAt": "Created at",
"action": "Action",
"listEmpty": "No records.",
"createNewAccount": "Create new account"
}
}

61
public/locales/zh-CN/application.json
View File

@ -11,7 +11,7 @@
"usePassword": "使用密码登录",
"forgetPassword": "忘记密码",
"2FA": "二步验证",
"input2FACode": "请输入六位二步验证代码",
"input2FACode": "请输入 6 位二步验证代码",
"passwordNotMatch": "两次密码输入不一致",
"findMyPassword": "找回密码",
"passwordReset": "密码已重设",
@ -89,9 +89,9 @@
"newFolder": "创建文件夹",
"newFile": "创建文件",
"showFullPath": "显示路径",
"listView": "列表展示",
"gridViewSmall": "小图标展示",
"gridViewLarge": "大图标展示",
"listView": "列表",
"gridViewSmall": "小图标",
"gridViewLarge": "大图标",
"paginationSize": "分页大小",
"paginationOption": "{{option}} / 页",
"noPagination": "不分页",
@ -338,5 +338,58 @@
"transferring": "已完成，转存排队中",
"deleteRecord": "删除记录",
"createdAt": "创建日期："
},
"setting": {
"avatarUpdated": "头像已更新，刷新后生效",
"nickChanged": "昵称已更改，刷新后生效",
"settingSaved": "设置已保存",
"themeColorChanged": "主题配色已更换",
"profile": "个人资料",
"avatar": "头像",
"uid": "UID",
"nickname": "昵称",
"group": "用户组",
"regTime": "注册时间",
"privacyAndSecurity": "安全隐私",
"profilePage": "个人主页",
"accountPassword": "登录密码",
"2fa": "二步验证",
"enabled": "已开启",
"disabled": "未开启",
"appearance": "个性化",
"themeColor": "主题配色",
"darkMode": "黑暗模式",
"syncWithSystem": "跟随系统",
"fileList": "文件列表",
"timeZone": "时区",
"webdavServer": "连接地址",
"userName": "用户名",
"manageAccount": "账号管理",
"uploadImage": "从文件上传",
"useGravatar": "使用 Gravatar 头像 ",
"changeNick": "修改昵称",
"originalPassword": "原密码",
"enable2FA": "启用二步验证",
"disable2FA": "关闭二步验证",
"2faDescription": "请使用任意二步验证APP或者支持二步验证的密码管理软件扫描左侧二维码添加本站。扫描完成后请填写二步验证APP给出的6位验证码以开启二步验证。",
"inputCurrent2FACode": "请验证当前二步验证代码。",
"timeZoneCode": "IANA 时区名称标识",
"authenticatorRemoved": "凭证已删除",
"authenticatorAdded": "验证器已添加",
"browserNotSupported": "当前浏览器或环境不支持",
"removedAuthenticator": "删除凭证",
"removedAuthenticatorConfirm": "确定要吊销这个凭证吗？",
"addNewAuthenticator": "添加新验证器",
"hardwareAuthenticator": "外部认证器",
"copied": "已复制到剪切板",
"pleaseManuallyCopy": "当前浏览器不支持，请手动复制",
"webdavAccounts": "WebDAV 账号管理",
"webdavHint": "WebDAV的地址为：{{url}}；登录用户名统一为：{{name}} ；密码为所创建账号的密码。",
"annotation": "备注名",
"rootFolder": "相对根目录",
"createdAt": "创建日期",
"action": "操作",
"listEmpty": "没有记录",
"createNewAccount": "创建新账号"
}
}

11
src/App.js
View File

@ -69,6 +69,11 @@ export default function App() {
textTransform: "none",
},
},
MuiTab: {
root: {
textTransform: "none",
},
},
},
});
changeThemeColor(
@ -232,11 +237,13 @@ export default function App() {
</Route>
<Route path="*">
<NotFound msg={t("pageNotFound", { ns: "common" })} />
<NotFound
msg={t("pageNotFound", { ns: "common" })}
/>
</Route>
</Switch>
</main>
<MusicPlayer/>
<MusicPlayer />
</div>
</ThemeProvider>
</React.Fragment>

26
src/component/Modals/CreateWebDAVAccount.js
View File

@ -1,12 +1,13 @@
import React, { useState } from "react";
import { makeStyles } from "@material-ui/core";
import { Dialog } from "@material-ui/core";
import { Dialog, makeStyles } from "@material-ui/core";
import DialogTitle from "@material-ui/core/DialogTitle";
import DialogActions from "@material-ui/core/DialogActions";
import Button from "@material-ui/core/Button";
import TextField from "@material-ui/core/TextField";
import { FolderOpenOutlined, LabelOutlined } from "@material-ui/icons";
import PathSelector from "../FileManager/PathSelector";
import { useTranslation } from "react-i18next";
const useStyles = makeStyles((theme) => ({
formGroup: {
display: "flex",
@ -32,6 +33,7 @@ const useStyles = makeStyles((theme) => ({
}));
export default function CreateWebDAVAccount(props) {
const { t } = useTranslation();
const [value, setValue] = useState({
name: "",
path: "/",
@ -77,7 +79,9 @@ export default function CreateWebDAVAccount(props) {
onClose={() => setPathSelectDialog(false)}
aria-labelledby="form-dialog-title"
>
<DialogTitle id="form-dialog-title">选择目录</DialogTitle>
<DialogTitle id="form-dialog-title">
{t("navbar.addTagDialog.selectFolder")}
</DialogTitle>
<PathSelector
presentPath="/"
selected={[]}
@ -86,14 +90,14 @@ export default function CreateWebDAVAccount(props) {
<DialogActions>
<Button onClick={() => setPathSelectDialog(false)}>
取消
{t("cancel", { ns: "common" })}
</Button>
<Button
onClick={selectPath}
color="primary"
disabled={selectedPath === ""}
>
确定
{t("ok", { ns: "common" })}
</Button>
</DialogActions>
</Dialog>
@ -108,7 +112,7 @@ export default function CreateWebDAVAccount(props) {
className={classes.input}
value={value.name}
onChange={handleInputChange("name")}
label="备注名"
label={t("setting.annotation")}
/>
</div>
<div className={classes.formGroup}>
@ -120,7 +124,7 @@ export default function CreateWebDAVAccount(props) {
value={value.path}
onChange={handleInputChange("path")}
className={classes.input}
label="相对根目录"
label={t("setting.rootFolder")}
/>
<br />
<Button
@ -128,20 +132,22 @@ export default function CreateWebDAVAccount(props) {
color="primary"
onClick={() => setPathSelectDialog(true)}
>
选择目录
{t("navbar.addTagDialog.selectFolder")}
</Button>
</div>
</div>
</div>
</div>
<DialogActions>
<Button onClick={props.onClose}>取消</Button>
<Button onClick={props.onClose}>
{t("cancel", { ns: "common" })}
</Button>
<Button
disabled={value.path === "" || value.name === ""}
color="primary"
onClick={() => props.callback(value)}
>
确定
{t("ok", { ns: "common" })}
</Button>
</DialogActions>
</Dialog>

27
src/component/Modals/TimeZone.js
View File

@ -1,20 +1,15 @@
import React, { useState, useCallback, useEffect } from "react";
import { FormLabel, makeStyles } from "@material-ui/core";
import React, { useCallback, useState } from "react";
import {
Button,
CircularProgress,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
DialogContentText,
CircularProgress,
makeStyles,
} from "@material-ui/core";
import PathSelector from "../FileManager/PathSelector";
import { useDispatch } from "react-redux";
import API from "../../middleware/Api";
import TextField from "@material-ui/core/TextField";
import Select from "@material-ui/core/Select";
import MenuItem from "@material-ui/core/MenuItem";
import {
refreshTimeZone,
timeZone,
@ -22,11 +17,13 @@ import {
} from "../../utils/datetime";
import FormControl from "@material-ui/core/FormControl";
import Auth from "../../middleware/Auth";
import { setModalsLoading, toggleSnackbar } from "../../redux/explorer";
import { toggleSnackbar } from "../../redux/explorer";
import { useTranslation } from "react-i18next";
const useStyles = makeStyles((theme) => ({}));
export default function TimeZoneDialog(props) {
const { t } = useTranslation();
const [timeZoneValue, setTimeZoneValue] = useState(timeZone);
const dispatch = useDispatch();
const ToggleSnackbar = useCallback(
@ -53,12 +50,14 @@ export default function TimeZoneDialog(props) {
onClose={props.onClose}
aria-labelledby="form-dialog-title"
>
<DialogTitle id="form-dialog-title">更改时区</DialogTitle>
<DialogTitle id="form-dialog-title">
{t("setting.timeZone")}
</DialogTitle>
<DialogContent>
<FormControl>
<TextField
label={"IANA 时区名称标识"}
label={t("setting.timeZoneCode")}
value={timeZoneValue}
onChange={(e) => setTimeZoneValue(e.target.value)}
/>
@ -66,14 +65,16 @@ export default function TimeZoneDialog(props) {
</DialogContent>
<DialogActions>
<Button onClick={props.onClose}>取消</Button>
<Button onClick={props.onClose}>
{t("cancel", { ns: "common" })}
</Button>
<div className={classes.wrapper}>
<Button
color="primary"
disabled={timeZoneValue === ""}
onClick={() => saveZoneInfo()}
>
确定
{t("ok", { ns: "common" })}
{props.modalsLoading && (
<CircularProgress
size={24}

41
src/component/Setting/Authn.js
View File

@ -1,4 +1,4 @@
import React, { useState, useCallback } from "react";
import React, { useCallback, useState } from "react";
import {
Button,
Dialog,
@ -21,6 +21,7 @@ import { Add, Fingerprint, HighlightOff } from "@material-ui/icons";
import API from "../../middleware/Api";
import { bufferDecode, bufferEncode } from "../../utils";
import { toggleSnackbar } from "../../redux/explorer";
import { useTranslation } from "react-i18next";
const useStyles = makeStyles((theme) => ({
sectionTitle: {
@ -47,6 +48,7 @@ const useStyles = makeStyles((theme) => ({
}));
export default function Authn(props) {
const { t } = useTranslation();
const [selected, setSelected] = useState("");
const [confirm, setConfirm] = useState(false);
const dispatch = useDispatch();
@ -61,7 +63,12 @@ export default function Authn(props) {
id: id,
})
.then(() => {
ToggleSnackbar("top", "right", "凭证已删除", "success");
ToggleSnackbar(
"top",
"right",
t("setting.authenticatorRemoved"),
"success"
);
props.remove(id);
})
.catch((error) => {
@ -76,7 +83,12 @@ export default function Authn(props) {
const addCredential = () => {
if (!navigator.credentials) {
ToggleSnackbar("top", "right", "当前浏览器或环境不支持", "warning");
ToggleSnackbar(
"top",
"right",
t("setting.browserNotSupported"),
"warning"
);
return;
}
@ -129,7 +141,12 @@ export default function Authn(props) {
})
.then((response) => {
props.add(response.data);
ToggleSnackbar("top", "right", "验证器已添加", "success");
ToggleSnackbar(
"top",
"right",
t("setting.authenticatorAdded"),
"success"
);
return;
})
.catch((error) => {
@ -141,23 +158,25 @@ export default function Authn(props) {
return (
<div>
<Dialog open={confirm} onClose={() => setConfirm(false)}>
<DialogTitle>删除凭证</DialogTitle>
<DialogContent>确定要吊销这个凭证吗？</DialogContent>
<DialogTitle>{t("setting.removedAuthenticator")}</DialogTitle>
<DialogContent>
{t("setting.removedAuthenticatorConfirm")}
</DialogContent>
<DialogActions>
<Button onClick={() => setConfirm(false)} color="default">
取消
{t("cancel", { ns: "common" })}
</Button>
<Button
onClick={() => deleteCredential(selected)}
color="primary"
>
确定
{t("ok", { ns: "common" })}
</Button>
</DialogActions>
</Dialog>
<Typography className={classes.sectionTitle} variant="subtitle2">
外部认证器
{t("setting.hardwareAuthenticator")}
</Typography>
<Paper>
<List className={classes.desenList}>
@ -194,7 +213,9 @@ export default function Authn(props) {
<ListItemIcon className={classes.iconFix}>
<Add />
</ListItemIcon>
<ListItemText primary="添加新验证器" />
<ListItemText
primary={t("setting.addNewAuthenticator")}
/>
<ListItemSecondaryAction
className={classes.flexContainer}

167
src/component/Setting/UserSetting.js
View File

@ -59,6 +59,7 @@ import {
toggleDaylightMode,
toggleSnackbar,
} from "../../redux/explorer";
import { Trans, withTranslation } from "react-i18next";
const styles = (theme) => ({
layout: {
@ -94,10 +95,22 @@ const styles = (theme) => ({
},
infoText: {
marginRight: "17px",
[theme.breakpoints.down("xs")]: {
maxWidth: 100,
textOverflow: "ellipsis",
whiteSpace: "nowrap",
overflow: "hidden",
},
},
infoTextWithIcon: {
marginRight: "17px",
marginTop: "1px",
[theme.breakpoints.down("xs")]: {
maxWidth: 100,
textOverflow: "ellipsis",
whiteSpace: "nowrap",
overflow: "hidden",
},
},
rightIconWithText: {
marginTop: "0px",
@ -285,7 +298,7 @@ class UserSettingCompoment extends Component {
this.props.toggleSnackbar(
"top",
"right",
"头像已更新，刷新后生效",
this.props.t("setting.avatarUpdated"),
"success"
);
this.setState({
@ -316,7 +329,7 @@ class UserSettingCompoment extends Component {
this.props.toggleSnackbar(
"top",
"right",
"昵称已更改，刷新后生效",
this.props.t("nickChanged"),
"success"
);
this.setState({
@ -352,7 +365,7 @@ class UserSettingCompoment extends Component {
this.props.toggleSnackbar(
"top",
"right",
"头像已更新，刷新后生效",
this.props.t("setting.avatarUpdated"),
"success"
);
this.setState({
@ -380,7 +393,7 @@ class UserSettingCompoment extends Component {
this.props.toggleSnackbar(
"top",
"right",
"设置已保存",
this.props.t("setting.settingSaved"),
"success"
);
this.setState({
@ -405,7 +418,7 @@ class UserSettingCompoment extends Component {
this.props.toggleSnackbar(
"top",
"right",
"两次密码输入不一致",
this.props.t("login.passwordNotMatch"),
"warning"
);
return;
@ -421,7 +434,7 @@ class UserSettingCompoment extends Component {
this.props.toggleSnackbar(
"top",
"right",
"密码已更新",
this.props.t("login.passwordReset"),
"success"
);
this.setState({
@ -453,7 +466,7 @@ class UserSettingCompoment extends Component {
this.props.toggleSnackbar(
"top",
"right",
"主题配色已更换",
this.props.t("setting.themeColorChanged"),
"success"
);
this.props.applyThemes(this.state.chosenTheme);
@ -552,7 +565,7 @@ class UserSettingCompoment extends Component {
this.props.toggleSnackbar(
"top",
"right",
"设定已保存",
this.props.t("setting.settingSaved"),
"success"
);
this.setState({
@ -591,7 +604,7 @@ class UserSettingCompoment extends Component {
};
render() {
const { classes } = this.props;
const { classes, t } = this.props;
const user = Auth.GetUser();
const dark = Auth.GetPreference("theme_mode");
@ -602,7 +615,7 @@ class UserSettingCompoment extends Component {
className={classes.sectionTitle}
variant="subtitle2"
>
个人资料
{t("setting.profile")}
</Typography>
<Paper>
<List className={classes.desenList}>
@ -621,7 +634,7 @@ class UserSettingCompoment extends Component {
}
/>
</ListItemAvatar>
<ListItemText primary="头像" />
<ListItemText primary={t("setting.avatar")} />
<ListItemSecondaryAction>
<RightIcon className={classes.rightIcon} />
</ListItemSecondaryAction>
@ -631,7 +644,7 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<PermContactCalendar />
</ListItemIcon>
<ListItemText primary="UID" />
<ListItemText primary={t("setting.uid")} />
<ListItemSecondaryAction>
<Typography
@ -652,7 +665,7 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<NickIcon />
</ListItemIcon>
<ListItemText primary="昵称" />
<ListItemText primary={t("setting.nickname")} />
<ListItemSecondaryAction
onClick={() =>
@ -676,7 +689,7 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<EmailIcon />
</ListItemIcon>
<ListItemText primary="Email" />
<ListItemText primary={t("login.email")} />
<ListItemSecondaryAction>
<Typography
@ -692,7 +705,7 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<GroupIcon />
</ListItemIcon>
<ListItemText primary="用户组" />
<ListItemText primary={t("setting.group")} />
<ListItemSecondaryAction>
<Typography
@ -708,7 +721,7 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<DateIcon />
</ListItemIcon>
<ListItemText primary="注册时间" />
<ListItemText primary={t("setting.regTime")} />
<ListItemSecondaryAction>
<Typography
@ -725,7 +738,7 @@ class UserSettingCompoment extends Component {
className={classes.sectionTitle}
variant="subtitle2"
>
安全隐私
{t("setting.privacyAndSecurity")}
</Typography>
<Paper>
<List className={classes.desenList}>
@ -733,7 +746,9 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<HomeIcon />
</ListItemIcon>
<ListItemText primary="个人主页" />
<ListItemText
primary={t("setting.profilePage")}
/>
<ListItemSecondaryAction>
<Switch
@ -752,7 +767,9 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<LockIcon />
</ListItemIcon>
<ListItemText primary="登录密码" />
<ListItemText
primary={t("setting.accountPassword")}
/>
<ListItemSecondaryAction
className={classes.flexContainer}
@ -765,7 +782,7 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<VerifyIcon />
</ListItemIcon>
<ListItemText primary="二步验证" />
<ListItemText primary={t("setting.2fa")} />
<ListItemSecondaryAction
className={classes.flexContainer}
@ -775,8 +792,8 @@ class UserSettingCompoment extends Component {
color="textSecondary"
>
{!this.state.settings.two_factor
? "未开启"
: "已开启"}
? t("setting.disabled")
: t("setting.enabled")}
</Typography>
<RightIcon
className={classes.rightIconWithText}
@ -817,7 +834,7 @@ class UserSettingCompoment extends Component {
className={classes.sectionTitle}
variant="subtitle2"
>
个性化
{t("setting.appearance")}
</Typography>
<Paper>
<List className={classes.desenList}>
@ -830,13 +847,15 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<ColorIcon />
</ListItemIcon>
<ListItemText primary="主题配色" />
<ListItemText
primary={t("setting.themeColor")}
/>
<ListItemSecondaryAction
className={classes.flexContainer}
>
<div className={classes.firstColor}></div>
<div className={classes.secondColor}></div>
<div className={classes.firstColor} />
<div className={classes.secondColor} />
</ListItemSecondaryAction>
</ListItem>
<Divider />
@ -847,7 +866,7 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<Brightness3 />
</ListItemIcon>
<ListItemText primary="黑暗模式" />
<ListItemText primary={t("setting.darkMode")} />
<ListItemSecondaryAction
className={classes.flexContainer}
@ -858,9 +877,10 @@ class UserSettingCompoment extends Component {
>
{dark &&
(dark === "dark"
? "偏好开启"
: "偏好关闭")}
{dark === null && "跟随系统"}
? t("setting.enabled")
: t("setting.disabled"))}
{dark === null &&
t("setting.syncWithSystem")}
</Typography>
<RightIcon
className={classes.rightIconWithText}
@ -875,7 +895,7 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<ListAlt />
</ListItemIcon>
<ListItemText primary="文件列表" />
<ListItemText primary={t("setting.fileList")} />
<ListItemSecondaryAction
className={classes.flexContainer}
@ -885,11 +905,12 @@ class UserSettingCompoment extends Component {
color="textSecondary"
>
{this.props.viewMethod === "icon" &&
"大图标"}
t("fileManager.gridViewLarge")}
{this.props.viewMethod === "list" &&
"列表"}
t("fileManager.listView")}
{this.props.viewMethod ===
"smallIcon" && "小图标"}
"smallIcon" &&
t("fileManager.gridViewSmall")}
</Typography>
<RightIcon
className={classes.rightIconWithText}
@ -906,7 +927,7 @@ class UserSettingCompoment extends Component {
<ListItemIcon className={classes.iconFix}>
<Schedule />
</ListItemIcon>
<ListItemText primary="时区" />
<ListItemText primary={t("setting.timeZone")} />
<ListItemSecondaryAction
className={classes.flexContainer}
@ -947,7 +968,9 @@ class UserSettingCompoment extends Component {
>
<LinkIcon />
</ListItemIcon>
<ListItemText primary="连接地址" />
<ListItemText
primary={t("setting.webdavServer")}
/>
<ListItemSecondaryAction
className={classes.flexContainer}
@ -971,7 +994,9 @@ class UserSettingCompoment extends Component {
>
<InputIcon />
</ListItemIcon>
<ListItemText primary="用户名" />
<ListItemText
primary={t("setting.userName")}
/>
<ListItemSecondaryAction
className={classes.flexContainer}
@ -993,7 +1018,9 @@ class UserSettingCompoment extends Component {
>
<SecurityIcon />
</ListItemIcon>
<ListItemText primary="账号管理" />
<ListItemText
primary={t("setting.manageAccount")}
/>
<ListItemSecondaryAction
className={classes.flexContainer}
@ -1060,7 +1087,7 @@ class UserSettingCompoment extends Component {
</List>
</Paper>
<div className={classes.paddingBottom}></div>
<div className={classes.paddingBottom} />
</div>
<TimeZoneDialog
onClose={() => this.setState({ changeTimeZone: false })}
@ -1070,7 +1097,7 @@ class UserSettingCompoment extends Component {
open={this.state.avatarModal}
onClose={this.handleClose}
>
<DialogTitle>修改头像</DialogTitle>
<DialogTitle>{t("setting.avatar")}</DialogTitle>
<List>
<ListItem
button
@ -1089,7 +1116,7 @@ class UserSettingCompoment extends Component {
<PhotoIcon />
</Avatar>
</ListItemAvatar>
<ListItemText primary="从文件上传" />
<ListItemText primary={t("setting.uploadImage")} />
</ListItem>
<ListItem
button
@ -1103,22 +1130,22 @@ class UserSettingCompoment extends Component {
</ListItemAvatar>
<ListItemText
className={classes.paddingText}
primary="使用 Gravatar 头像 "
primary={t("setting.useGravatar")}
/>
</ListItem>
</List>
<DialogActions>
<Button onClick={this.handleClose} color="primary">
取消
{t("cancel", { ns: "common" })}
</Button>
</DialogActions>
</Dialog>
<Dialog open={this.state.nickModal} onClose={this.handleClose}>
<DialogTitle>修改昵称</DialogTitle>
<DialogTitle>{t("setting.changeNick")}</DialogTitle>
<DialogContent>
<TextField
id="standard-name"
label="昵称"
label={t("setting.nickname")}
className={classes.textField}
value={this.state.nick}
onChange={this.handleChange("nick")}
@ -1128,7 +1155,7 @@ class UserSettingCompoment extends Component {
</DialogContent>
<DialogActions>
<Button onClick={this.handleClose} color="default">
取消
{t("cancel", { ns: "common" })}
</Button>
<Button
onClick={this.changeNick}
@ -1138,7 +1165,7 @@ class UserSettingCompoment extends Component {
this.state.nick === ""
}
>
保存
{t("ok", { ns: "common" })}
</Button>
</DialogActions>
</Dialog>
@ -1146,12 +1173,12 @@ class UserSettingCompoment extends Component {
open={this.state.changePassword}
onClose={this.handleClose}
>
<DialogTitle>修改登录密码</DialogTitle>
<DialogTitle>{t("login.resetPassword")}</DialogTitle>
<DialogContent>
<div>
<TextField
id="standard-name"
label="原密码"
label={t("setting.originalPassword")}
type="password"
className={classes.textField}
value={this.state.oldPwd}
@ -1163,7 +1190,7 @@ class UserSettingCompoment extends Component {
<div>
<TextField
id="standard-name"
label="新密码"
label={t("login.newPassword")}
type="password"
className={classes.textField}
value={this.state.newPwd}
@ -1174,7 +1201,7 @@ class UserSettingCompoment extends Component {
<div>
<TextField
id="standard-name"
label="确认新密码"
label={t("login.repeatNewPassword")}
type="password"
className={classes.textField}
value={this.state.newPwdRepeat}
@ -1185,7 +1212,7 @@ class UserSettingCompoment extends Component {
</DialogContent>
<DialogActions>
<Button onClick={this.handleClose} color="default">
取消
{t("cancel", { ns: "common" })}
</Button>
<Button
onClick={this.changhePwd}
@ -1197,14 +1224,15 @@ class UserSettingCompoment extends Component {
this.state.newPwd === ""
}
>
保存
{t("ok", { ns: "common" })}
</Button>
</DialogActions>
</Dialog>
<Dialog open={this.state.twoFactor} onClose={this.handleClose}>
<DialogTitle>
{this.state.settings.two_factor ? "关闭" : "启用"}
二步验证
{this.state.settings.two_factor
? t("setting.disable2FA")
: t("setting.enable2FA")}
</DialogTitle>
<DialogContent>
<div className={classes.flexContainerResponse}>
@ -1224,17 +1252,17 @@ class UserSettingCompoment extends Component {
<div className={classes.desText}>
{!this.state.settings.two_factor && (
<Typography>
请使用任意二步验证APP或者支持二步验证的密码管理软件扫描左侧二维码添加本站。扫描完成后请填写二步验证APP给出的6位验证码以开启二步验证。
{t("setting.2faDescription")}
</Typography>
)}
{this.state.settings.two_factor && (
<Typography>
请验证当前二步验证代码。
{t("setting.inputCurrent2FACode")}
</Typography>
)}
<TextField
id="standard-name"
label="6位验证码"
label={t("login.input2FACode")}
type="number"
className={classes.textField}
value={this.state.authCode}
@ -1248,7 +1276,7 @@ class UserSettingCompoment extends Component {
</DialogContent>
<DialogActions>
<Button onClick={this.handleClose} color="default">
取消
{t("cancel", { ns: "common" })}
</Button>
<Button
onClick={this.twoFactor}
@ -1258,8 +1286,9 @@ class UserSettingCompoment extends Component {
this.state.authCode === ""
}
>
{this.state.settings.two_factor ? "关闭" : "启用"}
二步验证
{this.state.settings.two_factor
? t("setting.disable2FA")
: t("setting.enable2FA")}
</Button>
</DialogActions>
</Dialog>
@ -1267,7 +1296,7 @@ class UserSettingCompoment extends Component {
open={this.state.changeTheme}
onClose={this.handleClose}
>
<DialogTitle>更改主题配色</DialogTitle>
<DialogTitle>{t("setting.themeColor")}</DialogTitle>
<DialogContent>
<ToggleButtonGroup
value={this.state.chosenTheme}
@ -1288,7 +1317,7 @@ class UserSettingCompoment extends Component {
</DialogContent>
<DialogActions>
<Button onClick={this.handleClose} color="default">
取消
{t("cancel", { ns: "common" })}
</Button>
<Button
onClick={this.changeTheme}
@ -1298,7 +1327,7 @@ class UserSettingCompoment extends Component {
this.state.chosenTheme === null
}
>
保存
{t("ok", { ns: "common" })}
</Button>
</DialogActions>
</Dialog>
@ -1306,7 +1335,7 @@ class UserSettingCompoment extends Component {
open={this.state.showWebDavUrl}
onClose={this.handleClose}
>
<DialogTitle>WebDAV连接地址</DialogTitle>
<DialogTitle>{t("setting.webdavServer")}</DialogTitle>
<DialogContent>
<TextField
id="standard-name"
@ -1318,7 +1347,7 @@ class UserSettingCompoment extends Component {
</DialogContent>
<DialogActions>
<Button onClick={this.handleClose} color="default">
关闭
{t("close", { ns: "common" })}
</Button>
</DialogActions>
</Dialog>
@ -1326,7 +1355,7 @@ class UserSettingCompoment extends Component {
open={this.state.showWebDavUserName}
onClose={this.handleClose}
>
<DialogTitle>WebDAV用户名</DialogTitle>
<DialogTitle>{t("setting.userName")}</DialogTitle>
<DialogContent>
<TextField
id="standard-name"
@ -1338,7 +1367,7 @@ class UserSettingCompoment extends Component {
</DialogContent>
<DialogActions>
<Button onClick={this.handleClose} color="default">
关闭
{t("close", { ns: "common" })}
</Button>
</DialogActions>
</Dialog>
@ -1350,6 +1379,6 @@ class UserSettingCompoment extends Component {
const UserSetting = connect(
mapStateToProps,
mapDispatchToProps
)(withStyles(styles)(withRouter(UserSettingCompoment)));
)(withStyles(styles)(withRouter(withTranslation()(UserSettingCompoment))));
export default UserSetting;

42
src/component/Setting/WebDAV.js
View File

@ -21,6 +21,7 @@ import TimeAgo from "timeago-react";
import Link from "@material-ui/core/Link";
import { toggleSnackbar } from "../../redux/explorer";
import Nothing from "../Placeholder/Nothing";
import { useTranslation } from "react-i18next";
const useStyles = makeStyles((theme) => ({
layout: {
@ -53,6 +54,7 @@ const useStyles = makeStyles((theme) => ({
}));
export default function WebDAV() {
const { t } = useTranslation();
const [tab, setTab] = useState(0);
const [create, setCreate] = useState(false);
const [accounts, setAccounts] = useState([]);
@ -67,12 +69,12 @@ export default function WebDAV() {
const copyToClipboard = (text) => {
if (navigator.clipboard) {
navigator.clipboard.writeText(text);
ToggleSnackbar("top", "center", "已复制到剪切板", "success");
ToggleSnackbar("top", "center", t("setting.copied"), "success");
} else {
ToggleSnackbar(
"top",
"center",
"当前浏览器不支持，请手动复制",
t("setting.pleaseManuallyCopy"),
"warning"
);
}
@ -141,7 +143,7 @@ export default function WebDAV() {
onClose={() => setCreate(false)}
/>
<Typography color="textSecondary" variant="h4">
WebDAV
{t("navbar.connect")}
</Typography>
<Paper elevation={3} className={classes.content}>
<Tabs
@ -151,16 +153,16 @@ export default function WebDAV() {
onChange={(event, newValue) => setTab(newValue)}
aria-label="disabled tabs example"
>
<Tab label="账号管理" />
<Tab label={t("setting.webdavAccounts")} />
</Tabs>
<div className={classes.cardContent}>
{tab === 0 && (
<div>
<Alert severity="info">
WebDAV的地址为：
{window.location.origin + "/dav"}
；登录用户名统一为：{user.user_name}{" "}
；密码为所创建账号的密码。
{t("setting.webdavHint", {
url: window.location.origin + "/dav",
name: user.user_name,
})}
</Alert>
<TableContainer className={classes.tableContainer}>
<Table
@ -169,16 +171,20 @@ export default function WebDAV() {
>
<TableHead>
<TableRow>
<TableCell>备注名</TableCell>
<TableCell>密码</TableCell>
<TableCell align="right">
根目录
<TableCell>
{t("setting.annotation")}
</TableCell>
<TableCell>
{t("login.password")}
</TableCell>
<TableCell align="right">
创建日期
{t("setting.rootFolder")}
</TableCell>
<TableCell align="right">
操作
{t("setting.createdAt")}
</TableCell>
<TableCell align="right">
{t("setting.action")}
</TableCell>
</TableRow>
</TableHead>
@ -202,7 +208,9 @@ export default function WebDAV() {
}
href={"javascript:void"}
>
复制
{t("copy", {
ns: "common",
})}
</Link>
</TableCell>
<TableCell align="right">
@ -229,7 +237,7 @@ export default function WebDAV() {
</TableBody>
</Table>
{accounts.length === 0 && (
<Nothing primary={"没有记录"} />
<Nothing primary={t("setting.listEmpty")} />
)}
</TableContainer>
<Button
@ -238,7 +246,7 @@ export default function WebDAV() {
variant="contained"
color="secondary"
>
创建新账号
{t("setting.createNewAccount")}
</Button>
</div>
)}

16
src/utils/datetime.js
View File

@ -7,13 +7,23 @@ import i18next from "../i18n";
dayjs.extend(utc);
dayjs.extend(timezone);
const defaultTimeZone = "Asia/Shanghai";
let userTimezone = "";
try {
userTimezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
} catch (e) {
console.log(e);
}
if (!userTimezone) {
userTimezone = "Asia/Shanghai";
}
const preferTimeZone = Auth.GetPreference("timeZone");
export let timeZone = preferTimeZone ? preferTimeZone : defaultTimeZone;
export let timeZone = preferTimeZone ? preferTimeZone : userTimezone;
export function refreshTimeZone() {
timeZone = Auth.GetPreference("timeZone");
timeZone = timeZone ? timeZone : defaultTimeZone;
timeZone = timeZone ? timeZone : userTimezone;
}
export function formatLocalTime(time) {