0f3696eef3
- Add SettingsAnnouncements component with full CRUD operations for system announcements * Support multiple announcement types (default, ongoing, success, warning, error) * Include publish date, content, type classification and additional notes * Implement batch operations and pagination for better data management * Add real-time preview with relative time display and date formatting - Add SettingsFAQ component for comprehensive FAQ management * Support question-answer pairs with rich text content * Include full editing, deletion and creation capabilities * Implement batch delete operations and paginated display * Add validation for complete Q&A information - Integrate announcement and FAQ modules into DashboardSetting * Add unified configuration interface in admin console * Implement auto-refresh functionality for real-time updates * Add loading states and error handling for better UX - Enhance backend API support in controller and setting modules * Add validation functions for console settings * Include time and sorting utilities for announcement management * Extend API endpoints for announcement and FAQ data persistence - Improve frontend infrastructure * Add new translation keys for internationalization support * Update utility functions for date/time formatting * Enhance CSS styles for better component presentation * Add icons and visual improvements for announcements and FAQ sections This implementation provides administrators with comprehensive tools to manage system-wide announcements and user FAQ content through an intuitive console interface.
71 lines
1.8 KiB
JavaScript
71 lines
1.8 KiB
JavaScript
import React, { useEffect, useState } from 'react';
|
|
import { Card, Spin } from '@douyinfe/semi-ui';
|
|
import { API, showError } from '../../helpers';
|
|
import SettingsAPIInfo from '../../pages/Setting/Dashboard/SettingsAPIInfo.js';
|
|
import SettingsAnnouncements from '../../pages/Setting/Dashboard/SettingsAnnouncements.js';
|
|
import SettingsFAQ from '../../pages/Setting/Dashboard/SettingsFAQ.js';
|
|
|
|
const DashboardSetting = () => {
|
|
let [inputs, setInputs] = useState({
|
|
ApiInfo: '',
|
|
Announcements: '',
|
|
FAQ: '',
|
|
});
|
|
|
|
let [loading, setLoading] = useState(false);
|
|
|
|
const getOptions = async () => {
|
|
const res = await API.get('/api/option/');
|
|
const { success, message, data } = res.data;
|
|
if (success) {
|
|
let newInputs = {};
|
|
data.forEach((item) => {
|
|
if (item.key in inputs) {
|
|
newInputs[item.key] = item.value;
|
|
}
|
|
});
|
|
setInputs(newInputs);
|
|
} else {
|
|
showError(message);
|
|
}
|
|
};
|
|
|
|
async function onRefresh() {
|
|
try {
|
|
setLoading(true);
|
|
await getOptions();
|
|
} catch (error) {
|
|
showError('刷新失败');
|
|
console.error(error);
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
}
|
|
|
|
useEffect(() => {
|
|
onRefresh();
|
|
}, []);
|
|
|
|
return (
|
|
<>
|
|
<Spin spinning={loading} size='large'>
|
|
{/* API信息管理 */}
|
|
<Card style={{ marginTop: '10px' }}>
|
|
<SettingsAPIInfo options={inputs} refresh={onRefresh} />
|
|
</Card>
|
|
|
|
{/* 系统公告管理 */}
|
|
<Card style={{ marginTop: '10px' }}>
|
|
<SettingsAnnouncements options={inputs} refresh={onRefresh} />
|
|
</Card>
|
|
|
|
{/* 常见问答管理 */}
|
|
<Card style={{ marginTop: '10px' }}>
|
|
<SettingsFAQ options={inputs} refresh={onRefresh} />
|
|
</Card>
|
|
</Spin>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default DashboardSetting;
|