Fix:1; Refactor:1; Perf:1 #47

Merged
FatttSnake merged 3 commits from FatttSnake into dev 2024-04-22 16:22:28 +08:00
8 changed files with 69 additions and 21 deletions

View File

@@ -603,7 +603,7 @@ const Group = () => {
<AntdForm.Item <AntdForm.Item
name={'name'} name={'name'}
label={'名称'} label={'名称'}
rules={[{ required: true, whitespace: false }]} rules={[{ required: true, whitespace: true }]}
> >
<AntdInput allowClear /> <AntdInput allowClear />
</AntdForm.Item> </AntdForm.Item>

View File

@@ -612,7 +612,7 @@ const Role = () => {
<AntdForm.Item <AntdForm.Item
name={'name'} name={'name'}
label={'名称'} label={'名称'}
rules={[{ required: true, whitespace: false }]} rules={[{ required: true, whitespace: true }]}
> >
<AntdInput allowClear /> <AntdInput allowClear />
</AntdForm.Item> </AntdForm.Item>

View File

@@ -10,7 +10,7 @@ const ActiveInfo = () => {
const activeInfoDivRef = useRef<HTMLDivElement>(null) const activeInfoDivRef = useRef<HTMLDivElement>(null)
const activeInfoEChartsRef = useRef<echarts.EChartsType | null>(null) const activeInfoEChartsRef = useRef<echarts.EChartsType | null>(null)
const [isLoading, setIsLoading] = useState(false) const [isLoading, setIsLoading] = useState(false)
const [scope, setScope] = useState('WEAK') const [scope, setScope] = useState('WEEK')
useEffect(() => { useEffect(() => {
const chartResizeObserver = new ResizeObserver(() => { const chartResizeObserver = new ResizeObserver(() => {
@@ -165,7 +165,7 @@ const ActiveInfo = () => {
disabled={isLoading} disabled={isLoading}
style={{ width: '8em' }} style={{ width: '8em' }}
> >
<AntdSelect.Option key={'WEAK'}>7</AntdSelect.Option> <AntdSelect.Option key={'WEEK'}>7</AntdSelect.Option>
<AntdSelect.Option key={'MONTH'}>30</AntdSelect.Option> <AntdSelect.Option key={'MONTH'}>30</AntdSelect.Option>
<AntdSelect.Option key={'QUARTER'}>3</AntdSelect.Option> <AntdSelect.Option key={'QUARTER'}>3</AntdSelect.Option>
<AntdSelect.Option key={'YEAR'}>12</AntdSelect.Option> <AntdSelect.Option key={'YEAR'}>12</AntdSelect.Option>

View File

@@ -11,7 +11,7 @@ const OnlineInfo = () => {
const onlineInfoEChartsRef = useRef<echarts.EChartsType | null>(null) const onlineInfoEChartsRef = useRef<echarts.EChartsType | null>(null)
const [isLoading, setIsLoading] = useState(false) const [isLoading, setIsLoading] = useState(false)
const [currentOnlineCount, setCurrentOnlineCount] = useState(-1) const [currentOnlineCount, setCurrentOnlineCount] = useState(-1)
const [scope, setScope] = useState('WEAK') const [scope, setScope] = useState('WEEK')
useEffect(() => { useEffect(() => {
const chartResizeObserver = new ResizeObserver(() => { const chartResizeObserver = new ResizeObserver(() => {
@@ -59,13 +59,53 @@ const OnlineInfo = () => {
const dataList = getTimesBetweenTwoTimes( const dataList = getTimesBetweenTwoTimes(
data.history[0].time, data.history[0].time,
data.history[data.history.length - 1].time, data.history[data.history.length - 1].time,
'minute' _scope === 'DAY'
).map((time) => [ ? 'minute'
time, : _scope === 'WEEK'
data.history.find( ? 'minute'
(value) => value.time.substring(0, 16) === time.substring(0, 16) : _scope === 'MONTH'
)?.record ?? 0 ? 'hour'
]) : 'day'
).map((time) => {
const records = data.history
.filter(
(value) =>
value.time.substring(
0,
_scope === 'DAY'
? 16
: _scope === 'WEEK'
? 16
: _scope === 'MONTH'
? 13
: 10
) ===
time.substring(
0,
_scope === 'DAY'
? 16
: _scope === 'WEEK'
? 16
: _scope === 'MONTH'
? 13
: 10
)
)
.map((item) => Number(item.record))
return [
time.substring(
0,
_scope === 'DAY'
? 16
: _scope === 'WEEK'
? 16
: _scope === 'MONTH'
? 13
: 10
),
records.length ? Math.max(...records) : 0
]
})
onlineInfoEChartsRef.current = echarts.init( onlineInfoEChartsRef.current = echarts.init(
onlineInfoDivRef.current, onlineInfoDivRef.current,
@@ -77,7 +117,15 @@ const OnlineInfo = () => {
...lineEChartsBaseOption, ...lineEChartsBaseOption,
tooltip: { tooltip: {
...lineEChartsBaseOption.tooltip, ...lineEChartsBaseOption.tooltip,
formatter: getTooltipTimeFormatter('yyyy-MM-DD HH:mm') formatter: getTooltipTimeFormatter(
_scope === 'DAY'
? 'yyyy-MM-DD HH:mm'
: _scope === 'WEEK'
? 'yyyy-MM-DD HH:mm'
: _scope === 'MONTH'
? 'yyyy-MM-DD HH时'
: 'yyyy-MM-DD'
)
}, },
xAxis: { xAxis: {
...lineEChartsBaseOption.xAxis ...lineEChartsBaseOption.xAxis
@@ -122,7 +170,7 @@ const OnlineInfo = () => {
style={{ width: '8em' }} style={{ width: '8em' }}
> >
<AntdSelect.Option key={'DAY'}>24</AntdSelect.Option> <AntdSelect.Option key={'DAY'}>24</AntdSelect.Option>
<AntdSelect.Option key={'WEAK'}>7</AntdSelect.Option> <AntdSelect.Option key={'WEEK'}>7</AntdSelect.Option>
<AntdSelect.Option key={'MONTH'}>30</AntdSelect.Option> <AntdSelect.Option key={'MONTH'}>30</AntdSelect.Option>
<AntdSelect.Option key={'QUARTER'}>3</AntdSelect.Option> <AntdSelect.Option key={'QUARTER'}>3</AntdSelect.Option>
<AntdSelect.Option key={'YEAR'}>12</AntdSelect.Option> <AntdSelect.Option key={'YEAR'}>12</AntdSelect.Option>

View File

@@ -1046,7 +1046,7 @@ const Base = () => {
<AntdForm.Item <AntdForm.Item
name={'name'} name={'name'}
label={'名称'} label={'名称'}
rules={[{ required: true, whitespace: false }]} rules={[{ required: true, whitespace: true }]}
> >
<AntdInput allowClear /> <AntdInput allowClear />
</AntdForm.Item> </AntdForm.Item>

View File

@@ -272,7 +272,7 @@ const Category = () => {
<AntdForm.Item <AntdForm.Item
name={'name'} name={'name'}
label={'名称'} label={'名称'}
rules={[{ required: true, whitespace: false }]} rules={[{ required: true, whitespace: true }]}
> >
<AntdInput allowClear /> <AntdInput allowClear />
</AntdForm.Item> </AntdForm.Item>

View File

@@ -985,7 +985,7 @@ const Template = () => {
<AntdForm.Item <AntdForm.Item
name={'name'} name={'name'}
label={'名称'} label={'名称'}
rules={[{ required: true, whitespace: false }]} rules={[{ required: true, whitespace: true }]}
> >
<AntdInput allowClear /> <AntdInput allowClear />
</AntdForm.Item> </AntdForm.Item>

View File

@@ -806,7 +806,7 @@ const User = () => {
<AntdForm.Item <AntdForm.Item
name={'username'} name={'username'}
label={'用户名'} label={'用户名'}
rules={[{ required: true, whitespace: false }]} rules={[{ required: true, whitespace: true }]}
> >
<AntdInput allowClear /> <AntdInput allowClear />
</AntdForm.Item> </AntdForm.Item>
@@ -815,7 +815,7 @@ const User = () => {
<AntdForm.Item <AntdForm.Item
name={'password'} name={'password'}
label={'密码'} label={'密码'}
rules={[{ required: true, whitespace: false }]} rules={[{ required: true, whitespace: true }]}
> >
<AntdInput.Password allowClear /> <AntdInput.Password allowClear />
</AntdForm.Item> </AntdForm.Item>
@@ -824,14 +824,14 @@ const User = () => {
<AntdForm.Item <AntdForm.Item
name={'nickname'} name={'nickname'}
label={'昵称'} label={'昵称'}
rules={[{ required: true, whitespace: false }]} rules={[{ required: true, whitespace: true }]}
> >
<AntdInput allowClear /> <AntdInput allowClear />
</AntdForm.Item> </AntdForm.Item>
<AntdForm.Item <AntdForm.Item
name={'email'} name={'email'}
label={'邮箱'} label={'邮箱'}
rules={[{ required: true, whitespace: false, type: 'email' }]} rules={[{ required: true, whitespace: true, type: 'email' }]}
> >
<AntdInput type={'email'} allowClear /> <AntdInput type={'email'} allowClear />
</AntdForm.Item> </AntdForm.Item>