style: improve code formatting and structure in ChannelsTable and render helpers

This commit is contained in:
JustSong 2025-02-12 01:15:45 +08:00
parent d6284bf6b0
commit 54c38de813
2 changed files with 41 additions and 15 deletions

View File

@ -1,7 +1,17 @@
import React, {useEffect, useState} from 'react';
import {useTranslation} from 'react-i18next';
import {Button, Dropdown, Form, Input, Label, Message, Pagination, Popup, Table,} from 'semantic-ui-react';
import {Link} from 'react-router-dom';
import React, { useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next';
import {
Button,
Dropdown,
Form,
Input,
Label,
Message,
Pagination,
Popup,
Table,
} from 'semantic-ui-react';
import { Link } from 'react-router-dom';
import {
API,
loadChannelModels,
@ -13,8 +23,8 @@ import {
timestamp2string,
} from '../helpers';
import {CHANNEL_OPTIONS, ITEMS_PER_PAGE} from '../constants';
import {renderGroup, renderNumber} from '../helpers/render';
import { CHANNEL_OPTIONS, ITEMS_PER_PAGE } from '../constants';
import { renderGroup, renderNumber } from '../helpers/render';
function renderTimestamp(timestamp) {
return <>{timestamp2string(timestamp)}</>;
@ -108,7 +118,7 @@ const ChannelsTable = () => {
const loadChannels = async (startIdx) => {
const res = await API.get(`/api/channel/?p=${startIdx}`);
const {success, message, data} = res.data;
const { success, message, data } = res.data;
if (success) {
let localChannels = data.map(processChannelData);
if (startIdx === 0) {
@ -588,7 +598,15 @@ const ChannelsTable = () => {
/>
</Table.Cell>
<Table.Cell>
<div>
<div
style={{
display: 'flex',
alignItems: 'center',
flexWrap: 'wrap',
gap: '2px',
rowGap: '6px',
}}
>
<Button
size={'tiny'}
positive

View File

@ -1,5 +1,5 @@
import {Label, Message} from 'semantic-ui-react';
import {getChannelOption} from './helper';
import { Label, Message } from 'semantic-ui-react';
import { getChannelOption } from './helper';
import React from 'react';
export function renderText(text, limit) {
@ -16,7 +16,15 @@ export function renderGroup(group) {
let groups = group.split(',');
groups.sort();
return (
<>
<div
style={{
display: 'flex',
alignItems: 'center',
flexWrap: 'wrap',
gap: '2px',
rowGap: '6px',
}}
>
{groups.map((group) => {
if (group === 'vip' || group === 'pro') {
return <Label color='yellow'>{group}</Label>;
@ -25,7 +33,7 @@ export function renderGroup(group) {
}
return <Label>{group}</Label>;
})}
</>
</div>
);
}
@ -107,7 +115,7 @@ export function renderChannelTip(channelId) {
}
return (
<Message>
<div dangerouslySetInnerHTML={{__html: channel.tip}}></div>
<div dangerouslySetInnerHTML={{ __html: channel.tip }}></div>
</Message>
);
}