Leisuretimedock/blessing-skin-server
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tweak UI state

Browse Source
This commit is contained in:
Pig Fang 2020-07-04 17:12:26 +08:00
parent 5a5c255f77
commit 9856157cec
No known key found for this signature in database
GPG Key ID: A8198F548DADA9E2
12 changed files with 25 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
resources/assets/src/views/admin/PlayersManagement/LoadingCard.tsx
View File

@ -15,22 +15,16 @@ const LoadingCard: React.FC = () => (
<div className="info-box-content">
<div className="row">
<div className="col-10">
<ShrinkedSkeleton width="150px" />
</div>
<div className="col-2">
<div className="float-right dropdown">
<span className="text-gray">
<i className="fas fa-cog"></i>
</span>
</div>
<ShrinkedSkeleton width="120px" />
</div>
<div className="col-2"></div>
</div>
<div>
<div>
<ShrinkedSkeleton width="200px" />
<ShrinkedSkeleton width="150px" />
</div>
<div>
<ShrinkedSkeleton width="240px" />
<ShrinkedSkeleton width="180px" />
</div>
</div>
</div>

4
resources/assets/src/views/admin/PlayersManagement/index.tsx
View File

@ -1,4 +1,4 @@
import React, { useState, useEffect } from 'react'
import React, { useState, useEffect, useLayoutEffect } from 'react'
import { hot } from 'react-hot-loader/root'
import { useImmer } from 'use-immer'
import useIsLargeScreen from '@/scripts/hooks/useIsLargeScreen'
@ -25,7 +25,7 @@ const PlayersManagement: React.FC = () => {
const [query, setQuery] = useState('')
const [textureUpdating, setTextureUpdating] = useState(-1)
useEffect(() => {
useLayoutEffect(() => {
if (isLargeScreen) {
setIsTableMode(true)
}

8
resources/assets/src/views/admin/PluginsManagement/index.tsx
View File

@ -10,7 +10,7 @@ import InfoBox from './InfoBox'
import { Plugin } from './types'
const PluginsManagement: React.FC = () => {
const [loading, setLoading] = useState(false)
const [isLoading, setIsLoading] = useState(true)
const [plugins, setPlugins] = useImmer<Plugin[]>([])
const [file, setFile] = useState<File | null>(null)
const [isUploading, setIsUploading] = useState(false)
@ -19,10 +19,10 @@ const PluginsManagement: React.FC = () => {
useEffect(() => {
const getPlugins = async () => {
setLoading(true)
setIsLoading(true)
const plugins = await fetch.get<Plugin[]>('/admin/plugins/data')
setPlugins(() => plugins)
setLoading(false)
setIsLoading(false)
}
getPlugins()
}, [])
@ -166,7 +166,7 @@ const PluginsManagement: React.FC = () => {
return (
<div className="row">
<div className="col-lg-8">
{loading ? (
{isLoading ? (
<Loading />
) : plugins.length === 0 ? (
t('general.noResult')

2
resources/assets/src/views/admin/PluginsMarket/index.tsx
View File

@ -14,7 +14,7 @@ enableMapSet()
const PluginsMarket: React.FC = () => {
const [plugins, setPlugins] = useImmer<Plugin[]>([])
const [isLoading, setIsLoading] = useState(false)
const [isLoading, setIsLoading] = useState(true)
const [search, setSearch] = useState('')
const [page, setPage] = useState(1)
const [totalPages, setTotalPages] = useState(1)

2
resources/assets/src/views/admin/ReportsManagement/index.tsx
View File

@ -17,7 +17,7 @@ const ReportsManagement: React.FC = () => {
const [reports, setReports] = useImmer<Report[]>([])
const [page, setPage] = useState(1)
const [totalPages, setTotalPages] = useState(1)
const [isLoading, setIsLoading] = useState(false)
const [isLoading, setIsLoading] = useState(true)
const [query, setQuery] = useState('status:0 sort:-report_at')
const [viewingTexture, setViewingTexture] = useState<Texture | null>(null)

2
resources/assets/src/views/admin/Translations/index.tsx
View File

@ -12,7 +12,7 @@ import Row from './Row'
const Translations: React.FC = () => {
const [lines, setLines] = useImmer<Line[]>([])
const [isLoading, setIsLoading] = useState(false)
const [isLoading, setIsLoading] = useState(true)
const [page, setPage] = useState(1)
const [totalPages, setTotalPages] = useState(1)

14
resources/assets/src/views/admin/UsersManagement/LoadingCard.tsx
View File

@ -16,20 +16,16 @@ const LoadingCard: React.FC = () => (
<div className="info-box-content">
<div className="row">
<div className="col-10">
<Skeleton width="200px" />
</div>
<div className="col-2">
<span className="text-gray">
<i className="fas fa-cog"></i>
</span>
<Skeleton width="140px" />
</div>
<div className="col-2"></div>
</div>
<div>
<div>
<Skeleton width="200px" />
<Skeleton width="140px" />
</div>
<div>
<Skeleton width="200px" />
<Skeleton width="140px" />
</div>
<InfoTable className="row m-2 border-top border-bottom">
<div className="col-sm-4 py-1 text-center">
@ -52,7 +48,7 @@ const LoadingCard: React.FC = () => (
</div>
</InfoTable>
<div>
<Skeleton width="240px" />
<Skeleton width="180px" />
</div>
</div>
</div>

4
resources/assets/src/views/admin/UsersManagement/index.tsx
View File

@ -1,4 +1,4 @@
import React, { useState, useEffect } from 'react'
import React, { useState, useEffect, useLayoutEffect } from 'react'
import { hot } from 'react-hot-loader/root'
import { useImmer } from 'use-immer'
import useBlessingExtra from '@/scripts/hooks/useBlessingExtra'
@ -29,7 +29,7 @@ const UsersManagement: React.FC = () => {
permission: UserPermission.Admin,
} as User)
useEffect(() => {
useLayoutEffect(() => {
if (isLargeScreen) {
setIsTableMode(true)
}

4
resources/assets/src/views/skinlib/SkinLibrary/index.tsx
View File

@ -17,7 +17,7 @@ import Item from './Item'
import { Filter, LibraryItem } from './types'
const SkinLibrary: React.FC = () => {
const [isLoading, setIsLoading] = useState(false)
const [isLoading, setIsLoading] = useState(true)
const [items, setItems] = useState<LibraryItem[]>([])
const [closet, setCloset] = useState<number[]>([])
const [filter, setFilter] = useState<Filter>('skin')
@ -253,7 +253,7 @@ const SkinLibrary: React.FC = () => {
)}
</div>
<div className="card-footer">
<div className="float-right">
<div className="d-flex justify-content-center">
<Pagination
page={page}
totalPages={totalPages}

2
resources/assets/src/views/user/Closet/index.tsx
View File

@ -30,7 +30,7 @@ const updater = debounce(
)
const Closet: React.FC = () => {
const [isLoading, setIsLoading] = useState(false)
const [isLoading, setIsLoading] = useState(true)
const [category, setCategory] = useState<Category>('skin')
const [search, setSearch] = useState('')
const [query, setQuery] = useState('')

2
resources/assets/src/views/user/OAuth/index.tsx
View File

@ -14,7 +14,7 @@ type Exception = {
const OAuth: React.FC = () => {
const [apps, setApps] = useState<App[]>([])
const [isLoading, setIsLoading] = useState(false)
const [isLoading, setIsLoading] = useState(true)
const [showModalCreate, setShowModalCreate] = useState(false)
useEffect(() => {

2
resources/assets/src/views/user/Players/index.tsx
View File

@ -16,7 +16,7 @@ import ModalReset from './ModalReset'
const Players: React.FC = () => {
const [players, setPlayers] = useState<Player[]>([])
const [isLoading, setIsLoading] = useState(false)
const [isLoading, setIsLoading] = useState(true)
const [selected, setSelected] = useState(0)
const [skin, setSkin] = useTexture()
const [cape, setCape] = useTexture()