FatttSnake/oxygen-ui
1
0
Fork 0
Code Pull Requests Activity

Optimize import. Optimize date convert.

Browse Source
This commit is contained in:
Fat Snake
2023-11-29 11:12:35 +08:00
parent df16af6872
commit 5bcfa2be9c
23 changed files with 100 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/common/LoadingMask.tsx
View File

@@ -1,8 +1,8 @@
import React from 'react'
import Icon from '@ant-design/icons'
import '@/assets/css/components/common/loading-mask.scss'
import FitFullScreen from '@/components/common/FitFullScreen'
import { COLOR_FONT_MAIN } from '@/constants/common.constants'
import FitFullScreen from '@/components/common/FitFullScreen'
const LoadingMask: React.FC = () => {
const loadingIcon = (

5
src/components/common/sidebar/SidebarFooter.tsx
View File

@@ -1,9 +1,8 @@
import React from 'react'
import Icon from '@ant-design/icons'
import { notification } from 'antd'
import { getLoginStatus, getNickname, logout } from '@/utils/auth'
import { getRedirectUrl } from '@/utils/common'
import { COLOR_ERROR } from '@/constants/common.constants'
import { getRedirectUrl } from '@/utils/common'
import { getLoginStatus, getNickname, logout } from '@/utils/auth'
const SidebarFooter: React.FC = () => {
const matches = useMatches()

2
src/components/common/sidebar/index.tsx
View File

@@ -1,9 +1,9 @@
import React from 'react'
import Icon from '@ant-design/icons'
import '@/assets/css/components/common/sidebar.scss'
import { getLocalStorage, setLocalStorage } from '@/utils/common'
import SidebarSeparate from '@/components/common/sidebar/SidebarSeparate'
import SidebarFooter from '@/components/common/sidebar/SidebarFooter'
import { getLocalStorage, setLocalStorage } from '@/utils/common'
interface SidebarProps extends React.PropsWithChildren {
title: string

1
src/components/home/Footer.tsx
View File

@@ -3,7 +3,6 @@ import Icon from '@ant-design/icons'
import '@/assets/css/components/home/footer.scss'
import FitCenter from '@/components/common/FitCenter'
import FitFullScreen from '@/components/common/FitFullScreen'
import { NavLink } from 'react-router-dom'
const Footer: React.FC = () => {
return (

2
src/main.tsx
View File

@@ -3,8 +3,8 @@ import ReactDOM from 'react-dom/client'
import zh_CN from 'antd/locale/zh_CN'
import '@/assets/css/base.scss'
import '@/assets/css/common.scss'
import App from './App'
import { COLOR_MAIN } from '@/constants/common.constants'
import App from './App'
ReactDOM.createRoot(document.getElementById('root')!).render(
<React.StrictMode>

4
src/pages/HomeFramework.tsx
View File

@@ -1,10 +1,10 @@
import React from 'react'
import Icon from '@ant-design/icons'
import router from '@/router'
import '@/assets/css/pages/home-framework.scss'
import { COLOR_FONT_SECONDARY } from '@/constants/common.constants'
import router from '@/router'
import LoadingMask from '@/components/common/LoadingMask'
import HideScrollbar, { HideScrollbarElement } from '@/components/common/HideScrollbar'
import { COLOR_FONT_SECONDARY } from '@/constants/common.constants'
export const HomeFrameworkContext = createContext<{
navbarHiddenState: {

7
src/pages/Login.tsx
View File

@@ -1,14 +1,13 @@
import React from 'react'
import { notification } from 'antd'
import '@/assets/css/pages/login.scss'
import { getLocalTime, setToken } from '@/utils/common'
import { getUserInfo, login } from '@/utils/auth'
import {
PERMISSION_LOGIN_SUCCESS,
PERMISSION_LOGIN_USERNAME_PASSWORD_ERROR,
PERMISSION_USER_DISABLE,
PERMISSION_USERNAME_NOT_FOUND
} from '@/constants/common.constants'
import { utcToLocalTime, setToken } from '@/utils/common'
import { getUserInfo, login } from '@/utils/auth'
const Login: React.FC = () => {
const [messageApi, contextHolder] = message.useMessage()
@@ -44,7 +43,7 @@ const Login: React.FC = () => {
<span>
最近登录：
{user.lastLoginTime
? `${getLocalTime(user.lastLoginTime)}【${
? `${utcToLocalTime(user.lastLoginTime)}【${
user.lastLoginIp
}】`
: '无'}

2
src/pages/SystemFramework.tsx
View File

@@ -1,6 +1,6 @@
import React from 'react'
import system from '@/router/system'
import '@/assets/css/pages/system-framework.scss'
import system from '@/router/system'
import FitFullScreen from '@/components/common/FitFullScreen'
import Sidebar from '@/components/common/sidebar'
import SidebarItemList from '@/components/common/sidebar/SidebarItemList'

2
src/pages/ToolsFramework.tsx
View File

@@ -1,6 +1,6 @@
import React from 'react'
import { tools } from '@/router/tools'
import '@/assets/css/pages/tools-framework.scss'
import { tools } from '@/router/tools'
import FitFullScreen from '@/components/common/FitFullScreen'
import SidebarScroll, { SidebarScrollElement } from '@/components/common/sidebar/SidebarScroll'
import Sidebar from '@/components/common/sidebar'

4
src/pages/UserFramework.tsx
View File

@@ -1,11 +1,11 @@
import React from 'react'
import user from '@/router/user'
import '@/assets/css/pages/tools-framework.scss'
import user from '@/router/user'
import { hasPathPermission } from '@/utils/auth'
import FitFullScreen from '@/components/common/FitFullScreen'
import Sidebar from '@/components/common/sidebar'
import SidebarItemList from '@/components/common/sidebar/SidebarItemList'
import SidebarItem from '@/components/common/sidebar/SidebarItem'
import { hasPathPermission } from '@/utils/auth'
import LoadingMask from '@/components/common/LoadingMask'
const ToolsFramework: React.FC = () => {

2
src/pages/home/index.tsx
View File

@@ -1,7 +1,7 @@
import React from 'react'
import '@/assets/css/components/home/home.scss'
import FitFullScreen from '@/components/common/FitFullScreen'
import { HomeFrameworkContext } from '@/pages/HomeFramework'
import FitFullScreen from '@/components/common/FitFullScreen'
import Slogan from '@/components/home/Slogan'
import OxygenToolbox from '@/components/home/OxygenToolbox'
import Indicator from '@/components/common/Indicator'

16
src/pages/system/Group.tsx
View File

@@ -1,9 +1,5 @@
import React, { useEffect, useState } from 'react'
import React from 'react'
import Icon from '@ant-design/icons'
import FitFullScreen from '@/components/common/FitFullScreen'
import HideScrollbar from '@/components/common/HideScrollbar'
import FlexBox from '@/components/common/FlexBox'
import Card from '@/components/common/Card'
import {
COLOR_ERROR_SECONDARY,
COLOR_FONT_SECONDARY,
@@ -14,7 +10,7 @@ import {
DATABASE_SELECT_SUCCESS,
DATABASE_UPDATE_SUCCESS
} from '@/constants/common.constants'
import { getLocalTime } from '@/utils/common'
import { utcToLocalTime } from '@/utils/common'
import {
r_sys_group_add,
r_sys_group_change_status,
@@ -24,6 +20,10 @@ import {
r_sys_group_update,
r_sys_role_get_list
} from '@/services/system'
import FitFullScreen from '@/components/common/FitFullScreen'
import HideScrollbar from '@/components/common/HideScrollbar'
import FlexBox from '@/components/common/FlexBox'
import Card from '@/components/common/Card'
const Group: React.FC = () => {
const [modal, contextHolder] = AntdModal.useModal()
@@ -75,14 +75,14 @@ const Group: React.FC = () => {
dataIndex: 'createTime',
width: '10%',
align: 'center',
render: (value: string) => getLocalTime(value)
render: (value: string) => utcToLocalTime(value)
},
{
title: '修改时间',
dataIndex: 'updateTime',
width: '10%',
align: 'center',
render: (value: string) => getLocalTime(value)
render: (value: string) => utcToLocalTime(value)
},
{
title: '状态',

24
src/pages/system/Log.tsx
View File

@@ -1,14 +1,15 @@
import React from 'react'
import FitFullScreen from '@/components/common/FitFullScreen'
import Card from '@/components/common/Card'
import { r_sys_log_get } from '@/services/system'
import dayjs from 'dayjs'
import {
COLOR_ERROR_SECONDARY,
COLOR_FONT_SECONDARY,
DATABASE_SELECT_SUCCESS
} from '@/constants/common.constants'
import { dayjsToUtc, utcToLocalTime } from '@/utils/common'
import { r_sys_log_get } from '@/services/system'
import FitFullScreen from '@/components/common/FitFullScreen'
import Card from '@/components/common/Card'
import HideScrollbar from '@/components/common/HideScrollbar'
import { getLocalTime } from '@/utils/common'
import FlexBox from '@/components/common/FlexBox'
const Log: React.FC = () => {
@@ -87,7 +88,7 @@ const Log: React.FC = () => {
{
title: '开始时间',
dataIndex: 'startTime',
render: (value: string) => getLocalTime(value),
render: (value: string) => utcToLocalTime(value),
align: 'center',
sorter: true
},
@@ -96,7 +97,9 @@ const Log: React.FC = () => {
dataIndex: 'executeTime',
render: (value, record) => (
<AntdTooltip
title={`${getLocalTime(record.startTime)} ~ ${getLocalTime(record.endTime)}`}
title={`${utcToLocalTime(record.startTime)} ~ ${utcToLocalTime(
record.endTime
)}`}
>
{`${value}ms`}
</AntdTooltip>
@@ -188,12 +191,9 @@ const Log: React.FC = () => {
}
}
const handleOnDateRangeChange = (_dates: unknown, dateStrings: [string, string]) => {
if (dateStrings[0] && dateStrings[1]) {
setTimeRange([
new Date(dateStrings[0]).toISOString(),
new Date(dateStrings[1]).toISOString()
])
const handleOnDateRangeChange = (dates: [dayjs.Dayjs | null, dayjs.Dayjs | null] | null) => {
if (dates && dates[0] && dates[1]) {
setTimeRange([dayjsToUtc(dates[0]), dayjsToUtc(dates[1])])
} else {
setTimeRange(undefined)
}

36
src/pages/system/Role.tsx
View File

@@ -1,17 +1,5 @@
import React, { useEffect, useState } from 'react'
import FitFullScreen from '@/components/common/FitFullScreen'
import HideScrollbar from '@/components/common/HideScrollbar'
import FlexBox from '@/components/common/FlexBox'
import Card from '@/components/common/Card'
import {
r_sys_role_add,
r_sys_role_change_status,
r_sys_power_get_list,
r_sys_role_get,
r_sys_role_update,
r_sys_role_delete,
r_sys_role_delete_list
} from '@/services/system'
import React from 'react'
import Icon from '@ant-design/icons'
import {
COLOR_ERROR_SECONDARY,
COLOR_FONT_SECONDARY,
@@ -22,8 +10,20 @@ import {
DATABASE_SELECT_SUCCESS,
DATABASE_UPDATE_SUCCESS
} from '@/constants/common.constants'
import Icon from '@ant-design/icons'
import { getLocalTime, powerListToPowerTree } from '@/utils/common'
import { utcToLocalTime, powerListToPowerTree } from '@/utils/common'
import {
r_sys_role_add,
r_sys_role_change_status,
r_sys_power_get_list,
r_sys_role_get,
r_sys_role_update,
r_sys_role_delete,
r_sys_role_delete_list
} from '@/services/system'
import FitFullScreen from '@/components/common/FitFullScreen'
import HideScrollbar from '@/components/common/HideScrollbar'
import FlexBox from '@/components/common/FlexBox'
import Card from '@/components/common/Card'
const Role: React.FC = () => {
const [modal, contextHolder] = AntdModal.useModal()
@@ -67,14 +67,14 @@ const Role: React.FC = () => {
dataIndex: 'createTime',
width: '10%',
align: 'center',
render: (value: string) => getLocalTime(value)
render: (value: string) => utcToLocalTime(value)
},
{
title: '修改时间',
dataIndex: 'updateTime',
width: '10%',
align: 'center',
render: (value: string) => getLocalTime(value)
render: (value: string) => utcToLocalTime(value)
},
{
title: '状态',

45
src/pages/system/User.tsx
View File

@@ -1,4 +1,6 @@
import React, { useEffect, useState } from 'react'
import React from 'react'
import Icon from '@ant-design/icons'
import dayjs from 'dayjs'
import {
COLOR_BACKGROUND,
COLOR_ERROR_SECONDARY,
@@ -10,12 +12,7 @@ import {
DATABASE_SELECT_SUCCESS,
DATABASE_UPDATE_SUCCESS
} from '@/constants/common.constants'
import { ColumnsType } from 'antd/es/table/interface'
import FitFullScreen from '@/components/common/FitFullScreen.tsx'
import HideScrollbar from '@/components/common/HideScrollbar.tsx'
import FlexBox from '@/components/common/FlexBox.tsx'
import Card from '@/components/common/Card.tsx'
import Icon from '@ant-design/icons'
import { utcToLocalTime, isPastTime, localTimeToUtc, dayjsToUtc } from '@/utils/common'
import {
r_sys_group_get_list,
r_sys_role_get_list,
@@ -24,10 +21,12 @@ import {
r_sys_user_delete_list,
r_sys_user_get,
r_sys_user_update
} from '@/services/system.tsx'
import { getLocalTime, isPastTime } from '@/utils/common.tsx'
import { r_api_avatar_random_base64 } from '@/services/api/avatar.ts'
import moment from 'moment'
} from '@/services/system'
import { r_api_avatar_random_base64 } from '@/services/api/avatar'
import FitFullScreen from '@/components/common/FitFullScreen'
import HideScrollbar from '@/components/common/HideScrollbar'
import FlexBox from '@/components/common/FlexBox'
import Card from '@/components/common/Card'
const User: React.FC = () => {
const [modal, contextHolder] = AntdModal.useModal()
@@ -57,7 +56,7 @@ const User: React.FC = () => {
const [tableSelectedItem, setTableSelectedItem] = useState<React.Key[]>([])
const [avatar, setAvatar] = useState('')
const dataColumns: ColumnsType<UserWithRoleInfoVo> = [
const dataColumns: _ColumnsType<UserWithRoleInfoVo> = [
{
dataIndex: 'username',
title: '用户',
@@ -122,7 +121,7 @@ const User: React.FC = () => {
title: '最近登录',
render: (_, record) =>
record.currentLoginTime
? `${getLocalTime(record.currentLoginTime)}【${record.currentLoginIp}】`
? `${utcToLocalTime(record.currentLoginTime)}【${record.currentLoginIp}】`
: '无',
align: 'center'
},
@@ -334,10 +333,10 @@ const User: React.FC = () => {
void r_sys_user_update({
...formValues,
expiration: formValues.expiration
? new Date(formValues.expiration).toISOString()
? localTimeToUtc(formValues.expiration)
: undefined,
credentialsExpiration: formValues.credentialsExpiration
? new Date(formValues.credentialsExpiration).toISOString()
? localTimeToUtc(formValues.credentialsExpiration)
: undefined
})
.then((res) => {
@@ -362,10 +361,10 @@ const User: React.FC = () => {
void r_sys_user_add({
...formValues,
expiration: formValues.expiration
? new Date(formValues.expiration).toISOString()
? localTimeToUtc(formValues.expiration)
: undefined,
credentialsExpiration: formValues.credentialsExpiration
? new Date(formValues.credentialsExpiration).toISOString()
? localTimeToUtc(formValues.credentialsExpiration)
: undefined
})
.then((res) => {
@@ -649,9 +648,9 @@ const User: React.FC = () => {
<AntdForm.Item
name={'expiration'}
label={'过期时间'}
getValueProps={(date: string) => (date ? { value: moment.utc(date) } : {})}
getValueFromEvent={(_, dateString: string) =>
dateString ? moment(dateString).format('yyyy-MM-DD HH:mm:ss') : undefined
getValueProps={(date: string) => (date ? { value: dayjs(date) } : {})}
getValueFromEvent={(date: dayjs.Dayjs | null) =>
date ? dayjsToUtc(date) : undefined
}
>
<AntdDatePicker showTime allowClear changeOnBlur style={{ width: '100%' }} />
@@ -659,9 +658,9 @@ const User: React.FC = () => {
<AntdForm.Item
name={'credentialsExpiration'}
label={'认证过期时间'}
getValueProps={(date: string) => (date ? { value: moment.utc(date) } : {})}
getValueFromEvent={(_, dateString: string) =>
dateString ? moment(dateString).format('yyyy-MM-DD HH:mm:ss') : undefined
getValueProps={(date: string) => (date ? { value: dayjs(date) } : {})}
getValueFromEvent={(date: dayjs.Dayjs | null) =>
date ? dayjsToUtc(date) : undefined
}
>
<AntdDatePicker showTime allowClear changeOnBlur style={{ width: '100%' }} />

4
src/router/index.tsx
View File

@@ -1,8 +1,8 @@
import React from 'react'
import tools from '@/router/tools'
import system from '@/router/system'
import home from '@/router/home'
import user from '@/router/user'
import system from '@/router/system'
import tools from '@/router/tools'
const mapJsonToRoute = (jsonObject: RouteJsonObject[]): RouteObject[] => {
return jsonObject.map((value) => ({

2
src/services/api/avatar.ts
View File

@@ -1,5 +1,5 @@
import request from '@/services'
import { URL_API_V1_AVATAR_RANDOM_BASE64 } from '@/constants/urls.constants'
import request from '@/services'
export const r_api_avatar_random_base64 = () =>
request.get<AvatarBase64Vo>(URL_API_V1_AVATAR_RANDOM_BASE64)

2
src/services/auth.tsx
View File

@@ -1,5 +1,5 @@
import request from '@/services'
import { URL_LOGIN, URL_LOGOUT } from '@/constants/urls.constants'
import request from '@/services'
export const r_auth_login = (username: string, password: string) =>
request.post<TokenVo>(URL_LOGIN, {

3
src/services/index.tsx
View File

@@ -1,7 +1,5 @@
import axios, { type AxiosError, AxiosInstance, AxiosRequestConfig, AxiosResponse } from 'axios'
import { jwtDecode, JwtPayload } from 'jwt-decode'
import { message } from 'antd'
import { getToken, removeToken, setToken } from '@/utils/common'
import {
PERMISSION_ACCESS_DENIED,
PERMISSION_TOKEN_HAS_EXPIRED,
@@ -9,6 +7,7 @@ import {
PERMISSION_TOKEN_RENEW_SUCCESS,
PERMISSION_UNAUTHORIZED
} from '@/constants/common.constants'
import { getToken, removeToken, setToken } from '@/utils/common'
const service: AxiosInstance = axios.create({
baseURL: import.meta.env.VITE_API_URL,

2
src/services/system.tsx
View File

@@ -1,5 +1,4 @@
import React from 'react'
import request from '@/services/index'
import {
URL_SYS_USER_INFO,
URL_SYS_USER,
@@ -10,6 +9,7 @@ import {
URL_SYS_GROUP_LIST,
URL_SYS_LOG
} from '@/constants/urls.constants'
import request from '@/services/index'
export const r_sys_user_info = () => request.get<UserWithPowerInfoVo>(URL_SYS_USER_INFO)

6
src/utils/auth.ts
View File

@@ -1,11 +1,11 @@
import { getCaptcha, getLocalStorage, removeToken, setLocalStorage } from './common'
import { r_auth_login, r_auth_logout } from '@/services/auth'
import { r_sys_user_info } from '@/services/system'
import {
STORAGE_TOKEN_KEY,
STORAGE_USER_INFO_KEY,
DATABASE_SELECT_SUCCESS
} from '@/constants/common.constants'
import { getCaptcha, getLocalStorage, removeToken, setLocalStorage } from './common'
import { r_sys_user_info } from '@/services/system'
import { r_auth_login, r_auth_logout } from '@/services/auth'
let captcha: Captcha

17
src/utils/common.tsx
View File

@@ -1,5 +1,6 @@
import moment from 'moment'
import ReactDOM from 'react-dom/client'
import moment from 'moment'
import dayjs from 'dayjs'
import _ from 'lodash'
import { STORAGE_TOKEN_KEY, STORAGE_USER_INFO_KEY } from '@/constants/common.constants'
import LoadingMask from '@/components/common/LoadingMask'
@@ -144,10 +145,22 @@ export const getRedirectUrl = (path: string, redirectUrl: string): string => {
return `${path}?redirect=${encodeURIComponent(redirectUrl)}`
}
export const getLocalTime = (utcTime: string, format: string = 'yyyy-MM-DD HH:mm:ssZ') => {
export const utcToLocalTime = (utcTime: string, format: string = 'yyyy-MM-DD HH:mm:ssZ') => {
return moment.utc(utcTime).local().format(format)
}
export const dayjsToLocalTime = (date: dayjs.Dayjs, format: string = 'YYYY-MM-DD HH:mm:ssZ') => {
return date.format(format)
}
export const dayjsToUtc = (date: dayjs.Dayjs) => {
return date.toISOString()
}
export const localTimeToUtc = (localTime: string) => {
return moment(localTime).toISOString()
}
export const isPastTime = (utcTime: string) => {
return moment.utc(utcTime).isBefore(moment.now())
}

2
vite.config.ts
View File

@@ -29,7 +29,7 @@ export default defineConfig({
react: ['Suspense', 'createContext'],
'react-router': ['useMatches', 'RouterProvider'],
'react-router-dom': ['createBrowserRouter'],
antd: ['message']
antd: ['message', 'notification']
},
{
from: 'react-router',