修改样式

This commit is contained in:
linxd
2025-08-06 14:17:38 +08:00
parent 49105505fa
commit c7ae51ebd3
8 changed files with 83 additions and 44 deletions

View File

@ -8,7 +8,7 @@
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
// margin-bottom: 20px;
h2 {
margin-bottom: 0;
@ -34,4 +34,9 @@
}
}
}
.ant-tabs-nav {
&::before {
border: none;
}
}
}

View File

@ -1,32 +1,43 @@
import React, { useState, useEffect } from 'react';
import { Table, Typography, Button } from 'antd';
import { history, useIntl } from 'umi';
import React, { useState, useEffect, useRef } from 'react';
import { Table, Typography, Button, Tabs } from 'antd';
import { history, useIntl, connect } from 'umi';
import type { ConnectProps, Dispatch } from 'umi';
import { PlusOutlined } from '@ant-design/icons';
import { getHelpCenterList } from '@/servers/api/help';
import { getHelpCenterList, qandaGetPage } from '@/servers/api/help';
import type { UserModelState } from '@/models/user';
import { QUESTION_TYPES } from '@/dicts/help';
import './help.less';
import type { UserInfo } from '@/models/user';
const { Title } = Typography;
const HelpPage: React.FC = () => {
interface PageProps extends ConnectProps {
user: UserModelState; // dva model状态
dispatch: Dispatch; // dva dispatch方法
}
const HelpPage: React.FC<PageProps> = ({ user, dispatch }) => {
const intl = useIntl();
const [helpData, setHelpData] = useState<API.HelpCenterRecord[]>([]);
const [loading, setLoading] = useState<boolean>(true);
const userInfo: UserInfo | undefined = user.userInfo;
const [pagination, setPagination] = useState({
current: 1,
pageSize: 10,
total: 0,
});
const tabActiveKey = useRef<string>('helpCenter');
// 获取帮助中心数据
const fetchHelpData = async (current = 1, pageSize = 10) => {
setLoading(true);
console.log(userInfo?.userId);
const request = tabActiveKey.current == 'helpCenter' ? getHelpCenterList : qandaGetPage;
try {
const response = await getHelpCenterList({
const response = await request({
basePageRequest: {
pageNo: current,
pageSize: pageSize,
},
createBy: tabActiveKey.current == 'myQuestion' ? userInfo?.userId : null
});
if (response.success) {
@ -56,7 +67,7 @@ const HelpPage: React.FC = () => {
// 处理点击问题标题
const handleHelpClick = (id: string) => {
history.push(`/help/helpInfo?id=${id}`);
history.push(`/help/helpInfo?id=${id}&tabActiveKey=${tabActiveKey.current}`);
};
// 处理点击提问按钮
@ -66,7 +77,7 @@ const HelpPage: React.FC = () => {
// 获取问题分类名称
const getQuestionTypeName = (type: string) => {
const found = QUESTION_TYPES.find(item => item.value === type);
const found = QUESTION_TYPES.find((item) => item.value === type);
return found ? found.label : type;
};
@ -107,10 +118,19 @@ const HelpPage: React.FC = () => {
},
];
// 处理标签页切换
const tabsOnChange = (key: string) => {
tabActiveKey.current = key;
fetchHelpData();
};
return (
<div className="help-container layout-content-main">
<div className="help-header">
<Title level={2}>{intl.formatMessage({ id: 'help.title' })}</Title>
<Tabs onChange={tabsOnChange} centered>
<Tabs.TabPane tab="帮助中心" key="helpCenter"></Tabs.TabPane>
{user.token && <Tabs.TabPane tab="我的提问" key="myQuestion"></Tabs.TabPane>}
</Tabs>
<Button
type="primary"
icon={<PlusOutlined />}
@ -140,4 +160,4 @@ const HelpPage: React.FC = () => {
);
};
export default HelpPage;
export default connect(({ user }: { user: UserModelState }) => ({ user }))(HelpPage);

View File

@ -1,8 +1,8 @@
import React, { useState, useEffect } from 'react';
import { Typography, Button, Divider, Spin, message } from 'antd';
import { ArrowLeftOutlined } from '@ant-design/icons';
import { Typography, Button, Divider, Spin, message, Tag } from 'antd';
import { ArrowLeftOutlined, CommentOutlined } from '@ant-design/icons';
import { history, useIntl } from 'umi';
import { getHelpCenterDetail } from '@/servers/api/help';
import { getHelpCenterDetail, getQuestionDetail } from '@/servers/api/help';
import { QUESTION_TYPES } from '@/dicts/help';
import styles from './helpInfo.less';
@ -17,6 +17,7 @@ const HelpInfoPage: React.FC = () => {
// 获取URL中的id参数
const query = new URLSearchParams(window.location.search);
const id = query.get('id');
const tabActiveKey = query.get('tabActiveKey') || 'helpCenter';
if (!id) {
message.error(intl.formatMessage({ id: 'help.message.idNotFound' }));
@ -27,11 +28,15 @@ const HelpInfoPage: React.FC = () => {
// 请求详情数据
const fetchHelpDetail = async () => {
try {
const response = await getHelpCenterDetail({ id });
if (response.success) {
setHelpDetail(response.data);
const response =
tabActiveKey == 'helpCenter' ? getHelpCenterDetail({ id }) : getQuestionDetail(id);
const responseData = await response;
if (responseData.success) {
setHelpDetail(responseData.data);
} else {
message.error(response.message || intl.formatMessage({ id: 'help.message.loadFailed' }));
message.error(
responseData.message || intl.formatMessage({ id: 'help.message.loadFailed' }),
);
}
} catch (error) {
console.error('获取帮助中心详情失败:', error);
@ -51,7 +56,7 @@ const HelpInfoPage: React.FC = () => {
// 获取问题分类名称
const getQuestionTypeName = (type: string) => {
const found = QUESTION_TYPES.find(item => item.value === type);
const found = QUESTION_TYPES.find((item) => item.value === type);
return found ? found.label : type;
};
@ -88,30 +93,19 @@ const HelpInfoPage: React.FC = () => {
</div>
<div className={styles.helpInfoContent}>
<div className={styles.titleContainer}>
<Title level={2} className={styles.title}>
{helpDetail.title}
</Title>
</div>
<div className={styles.metaInfo}>
<div className={styles.metaLeft}>
<Text type="secondary">
{intl.formatMessage({ id: 'help.info.publishTime' })}: {helpDetail.createTime}
</Text>
</div>
<div className={styles.metaRight}>
<Text type="secondary">
{intl.formatMessage({ id: 'help.info.questionType' })}: {getQuestionTypeName(helpDetail.type)} |
{intl.formatMessage({ id: 'help.info.publisher' })}: {helpDetail.createBy || '系统管理员'}
</Text>
</div>
</div>
<Title level={2} className={styles.title}>
{/* <QuestionCircleOutlined /> */}
<CommentOutlined />
<span style={{ margin: '0 15px' }}>{helpDetail.title}</span>
<Tag color="success">{helpDetail.isAnswer == '1' ? '已回答' : '未回答'}</Tag>
</Title>
<div dangerouslySetInnerHTML={{ __html: helpDetail.content || '' }} />
<Divider className={styles.divider} />
<div className={styles.contentBody}>
<div dangerouslySetInnerHTML={{ __html: helpDetail.answerContent || helpDetail.content || '暂无内容' }} />
:
<div dangerouslySetInnerHTML={{ __html: helpDetail.answerContent || '暂无内容' }} />
</div>
</div>
</div>

View File

@ -199,7 +199,7 @@ const IndexPage: React.FC<any> = ({ user }) => {
className="cardTitleText"
onClick={() => {
history.push({
pathname: '/announce/announceInfo',
pathname: '/notice/noticeInfo',
search: '?id=' + item.id,
});
}}
@ -361,7 +361,7 @@ const IndexPage: React.FC<any> = ({ user }) => {
<div className="linkTitle"></div>
<Card>
{friendshipConnections.map((item, index) => (
<Card.Grid key={item.id} style={{ width: '16.6667%', height: '130px' }}>
<Card.Grid onClick={() => window.open(item.url)} key={item.id} style={{ width: '16.6667%', height: '130px' }}>
<img src={item.thumbnail} alt="" />
</Card.Grid>
))}

View File

@ -62,6 +62,7 @@
.contentBody {
font-size: 16px;
line-height: 1.8;
word-break: break-all;
p {
margin-bottom: 16px;

View File

@ -79,7 +79,7 @@ const NoticeInfo: React.FC = () => {
};
return (
<div className={styles.noticeInfoContainer}>
<div className={`${styles.noticeInfoContainer} layout-content-main` }>
<div className={styles.noticeInfoHeader}>
<Button
type="link"

View File

@ -249,7 +249,7 @@ const PolicyInfo: React.FC = () => {
}
return (
<div className={styles.policyInfoContainer}>
<div className={`${styles.policyInfoContainer} layout-content-main`}>
<div className={styles.policyInfoHeader}>
<Button
type="link"

View File

@ -35,3 +35,22 @@ export async function addHelpCenterQuestion(params: API.HelpCenterQuestionAddReq
data: params,
});
}
/*
获取我的提问
*/
export async function qandaGetPage(params: API.HelpCenterListRequest) {
return request<API.APIResponse<any>>('/portals/qanda/getPage', {
method: 'POST',
data: params,
});
}
/*
查询我的提问详情
*/
export async function getQuestionDetail(id: string) {
return request<API.APIResponse<any>>(`/portals/qanda/${id}`, {
method: 'GET',
});
}