diff --git a/src/locales/en-US.ts b/src/locales/en-US.ts index cada733..c01b0bf 100644 --- a/src/locales/en-US.ts +++ b/src/locales/en-US.ts @@ -5,6 +5,20 @@ export default { 'menu.通知中心': 'Notifications', 'menu.下载中心': 'Download Center', 'menu.关于我们': 'About Us', + + // About page + 'about.title': 'About Us', + 'about.company.title': 'Company Profile', + 'about.advantages.title': 'Platform Advantages', + 'about.history.title': 'Development History', + 'about.contact.title': 'Contact Us', + 'about.address': 'Headquarters Address', + 'about.phone': 'Phone', + 'about.hotline': 'Service Hotline', + 'about.email': 'Email', + 'about.worktime': 'Working Hours', + 'about.copyright': '© 2024 COSCO SHIPPING E-Bidding Platform. All Rights Reserved.', + "查看":"Info", "采购需求公示":"Procurement Demand Announcement", "招标采购公告":"Bidding Procurement Announcement", diff --git a/src/locales/zh-CN.ts b/src/locales/zh-CN.ts index 3ea829d..8f96daa 100644 --- a/src/locales/zh-CN.ts +++ b/src/locales/zh-CN.ts @@ -5,6 +5,20 @@ export default { 'menu.通知中心': '通知中心', 'menu.下载中心': '下载中心', 'menu.关于我们': '关于我们', + + // 关于我们页面 + 'about.title': '关于我们', + 'about.company.title': '公司简介', + 'about.advantages.title': '平台优势', + 'about.history.title': '发展历程', + 'about.contact.title': '联系我们', + 'about.address': '总部地址', + 'about.phone': '联系电话', + 'about.hotline': '服务热线', + 'about.email': '电子邮箱', + 'about.worktime': '工作时间', + 'about.copyright': '© 2024 中远海运电子招投标平台 版权所有', + "查看":"查看", "采购需求公示":"采购需求公示", "招标采购公告":"招标采购公告", diff --git a/src/locales/zh-CN/menu.ts b/src/locales/zh-CN/menu.ts new file mode 100644 index 0000000..930bb51 --- /dev/null +++ b/src/locales/zh-CN/menu.ts @@ -0,0 +1,3 @@ +export default { + 'menu.下载中心': '下载中心', +}; diff --git a/src/pages/about/about.less b/src/pages/about/about.less new file mode 100644 index 0000000..799f4fc --- /dev/null +++ b/src/pages/about/about.less @@ -0,0 +1,78 @@ +@import '~antd/es/style/themes/default.less'; + +.aboutContainer { + padding: 24px; + background-color: #fff; +} + +.aboutContent { + max-width: 1000px; + margin: 0 auto; +} + +.aboutTitle { + text-align: center; + margin-bottom: 40px; +} + +.aboutSection { + margin-bottom: 48px; +} + +.sectionTitle { + position: relative; + margin-bottom: 24px; + padding-left: 12px; + + &::before { + content: ''; + position: absolute; + left: 0; + top: 4px; + height: 20px; + width: 4px; + background-color: #1890ff; + } +} + +.sectionContent { + color: #333; + line-height: 2; + font-size: 15px; +} + +.imageWrapper { + margin: 24px 0; + text-align: center; +} + +.aboutImage { + max-width: 100%; + height: auto; + border-radius: 4px; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); +} + +.companyInfo { + background-color: #f5f5f5; + padding: 24px; + border-radius: 4px; + margin-top: 24px; +} + +.infoItem { + margin-bottom: 12px; + display: flex; + + .label { + font-weight: 500; + margin-right: 8px; + min-width: 80px; + } +} + +.aboutFooter { + text-align: center; + margin-top: 48px; + color: rgba(0, 0, 0, 0.45); +} diff --git a/src/pages/about/about.tsx b/src/pages/about/about.tsx index 512ba1e..a94f45b 100644 --- a/src/pages/about/about.tsx +++ b/src/pages/about/about.tsx @@ -1,5 +1,193 @@ import React from 'react'; +import { Typography, Divider, Row, Col } from 'antd'; +import { useIntl } from 'umi'; +import styles from './about.less'; + +const { Title, Paragraph } = Typography; + const AboutPage: React.FC = () => { - return <>AboutPage; + const intl = useIntl(); + + return ( +
+
+
+ {intl.formatMessage({ id: 'about.title' })} +
+ +
+ + {intl.formatMessage({ id: 'about.company.title' })} + +
+ + 中远海运电子招投标平台是中国远洋海运集团有限公司旗下专业的采购与招标管理平台, + 致力于为集团内外部用户提供高效、透明、规范的电子化招投标服务。平台依托集团强大的资源优势, + 结合现代信息技术,构建了覆盖招标、采购、供应商管理等全流程的电子化解决方案。 + + +
+ 公司总部 +
+ + + 作为国内领先的航运物流企业集团的电子招投标平台,我们秉承“公开、公平、公正”的原则, + 通过标准化、信息化、智能化手段,持续优化招投标流程,提升采购效率,降低采购成本, + 为集团战略实施和业务发展提供有力支撑。 + +
+
+ + + +
+ + {intl.formatMessage({ id: 'about.advantages.title' })} + +
+ + +
+ 全流程电子化 + + 从招标公告发布到开标评标,再到结果公示,全流程在线操作, + 减少纸质文档,提高工作效率,降低运营成本。 + +
+ + +
+ 安全可靠 + + 采用先进的加密技术和安全措施,确保招投标过程的安全性和数据的保密性, + 有效防范信息泄露和网络攻击风险。 + +
+ + +
+ 公开透明 + + 严格遵循国家招投标法律法规,确保招投标过程公开、透明、可追溯, + 有效防范舞弊行为,维护各方合法权益。 + +
+ +
+ +
+ 平台功能展示 +
+ + + +
+ 智能化服务 + + 引入人工智能和大数据分析技术,为招标采购决策提供数据支持, + 实现精准匹配和智能推荐,提升用户体验。 + +
+ + +
+ 供应商管理 + + 建立完善的供应商库和评价体系,实现供应商全生命周期管理, + 促进供应商良性竞争,提升供应链质量。 + +
+ + +
+ 合规监管 + + 内置合规检查机制,确保招投标活动符合国家法律法规和集团规章制度, + 降低合规风险,提升管理水平。 + +
+ +
+
+
+ + + +
+ + {intl.formatMessage({ id: 'about.history.title' })} + +
+ + 2018年 - 中远海运电子招投标平台正式启动建设,完成顶层设计和技术选型。 + + + 2019年 - 平台一期建设完成并上线试运行,实现基础招投标功能。 + + + 2020年 - 平台功能全面升级,增加供应商管理、合同管理等模块,用户规模快速增长。 + + + 2021年 - 平台二期建设完成,引入大数据分析和人工智能技术,提升平台智能化水平。 + + + 2022年 - 平台实现与集团ERP系统的深度集成,构建完整的采购管理生态。 + + + 2023年 - 平台进行全面技术改造,采用微服务架构,提升系统性能和可扩展性。 + + + 2024年 - 平台3.0版本发布,引入区块链技术,进一步提升数据安全性和业务透明度。 + +
+
+ + + +
+ + {intl.formatMessage({ id: 'about.contact.title' })} + +
+
+
+ {intl.formatMessage({ id: 'about.address' })}: + 上海市虹口区东大名路666号中远海运大厦 +
+
+ {intl.formatMessage({ id: 'about.phone' })}: + 021-65966666 +
+
+ {intl.formatMessage({ id: 'about.hotline' })}: + 400-888-9999 +
+
+ {intl.formatMessage({ id: 'about.email' })}: + service@ebidding.cosco.com +
+
+ {intl.formatMessage({ id: 'about.worktime' })}: + 周一至周五 9:00-17:30(法定节假日除外) +
+
+
+
+ +
+ {intl.formatMessage({ id: 'about.copyright' })} +
+
+
+ ); }; + export default AboutPage; diff --git a/src/pages/download/download.less b/src/pages/download/download.less new file mode 100644 index 0000000..6e84d47 --- /dev/null +++ b/src/pages/download/download.less @@ -0,0 +1,68 @@ +@import '~antd/es/style/themes/default.less'; + +.downloadContainer { + padding: 24px; + background-color: #fff; +} + +.downloadRow { + width: 100%; +} + +.menuCol { + margin-bottom: 24px; +} + +.downloadMenu { + border-right: none; +} + +.downloadContent { + width: 100%; +} + +.downloadCardList { + margin-top: 16px; +} + +.downloadCard { + margin-bottom: 24px; + transition: all 0.3s; + display: flex; + flex-direction: column; + + &:hover { + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); + transform: translateY(-2px); + } +} + +.cardTitle { + color: #333; + font-weight: 500; + font-size: 16px; + line-height: 22px; + margin-bottom: 8px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + display: flex; + align-items: center; +} + +.cardDate { + color: rgba(0, 0, 0, 0.45); + margin-bottom: 12px; + font-size: 12px; +} + +.downloadIcon { + font-size: 24px; + margin-right: 8px; + color: #1890ff; +} + +.downloadButton { + margin-top: 12px; + width: 100%; +} diff --git a/src/pages/download/download.tsx b/src/pages/download/download.tsx index 44cf919..f4851f2 100644 --- a/src/pages/download/download.tsx +++ b/src/pages/download/download.tsx @@ -1,5 +1,240 @@ -import React from 'react'; +import React, { useState, useEffect } from 'react'; +import { Card, Menu, Row, Col, Pagination, Button, Typography, Space, message } from 'antd'; +import { FileOutlined, BookOutlined, DownloadOutlined } from '@ant-design/icons'; +import styles from './download.less'; +import { downloadFile } from './service'; + +const { Title, Text } = Typography; + +// 模拟模板文件数据 +const mockTemplateFiles = [ + { + id: '1', + title: '公开招标操作手册', + description: '公开招标各角色操作手册', + publishDate: '2025年2月3日', + type: 'template', + icon: , + fileName: '公开招标操作手册.pdf', + }, + { + id: '2', + title: '询价采购模板', + description: '标准询价采购流程文档模板', + publishDate: '2025年1月15日', + type: 'template', + icon: , + fileName: '询价采购模板.docx', + }, + { + id: '3', + title: '竞争性谈判模板', + description: '竞争性谈判标准文档模板', + publishDate: '2024年12月20日', + type: 'template', + icon: , + fileName: '竞争性谈判模板.docx', + }, + { + id: '4', + title: '单一来源采购模板', + description: '单一来源采购申请及实施模板', + publishDate: '2024年12月5日', + type: 'template', + icon: , + fileName: '单一来源采购模板.docx', + }, + { + id: '5', + title: '供应商评估表格', + description: '供应商资质与能力评估标准表格', + publishDate: '2024年11月18日', + type: 'template', + icon: , + fileName: '供应商评估表格.xlsx', + }, + { + id: '6', + title: '合同范本模板', + description: '标准采购合同范本', + publishDate: '2024年11月1日', + type: 'template', + icon: , + fileName: '合同范本模板.docx', + }, +]; + +// 模拟操作手册数据 +const mockManuals = [ + { + id: '7', + title: '供应商注册指南', + description: '供应商平台注册及资质提交操作指南', + publishDate: '2025年1月25日', + type: 'manual', + icon: , + fileName: '供应商注册指南.pdf', + }, + { + id: '8', + title: '投标操作指南', + description: '电子投标全流程操作手册', + publishDate: '2025年1月10日', + type: 'manual', + icon: , + fileName: '投标操作指南.pdf', + }, + { + id: '9', + title: '在线开标指南', + description: '在线开标会议参与指南', + publishDate: '2024年12月15日', + type: 'manual', + icon: , + fileName: '在线开标指南.pdf', + }, + { + id: '10', + title: '评标专家操作手册', + description: '评标专家系统使用指南', + publishDate: '2024年11月28日', + type: 'manual', + icon: , + fileName: '评标专家操作手册.pdf', + }, + { + id: '11', + title: '合同签署指南', + description: '电子合同签署流程指南', + publishDate: '2024年11月10日', + type: 'manual', + icon: , + fileName: '合同签署指南.pdf', + }, +]; + const DownloadPage: React.FC = () => { - return <>DownloadPage; + const [activeMenu, setActiveMenu] = useState('template'); + const [downloadData, setDownloadData] = useState([]); + const [loading, setLoading] = useState(true); + const [pagination, setPagination] = useState({ + current: 1, + pageSize: 6, + total: 0, + }); + + // 根据当前选中的菜单加载对应的下载数据 + useEffect(() => { + setLoading(true); + // 模拟API请求 + setTimeout(() => { + const data = activeMenu === 'template' ? mockTemplateFiles : mockManuals; + setDownloadData(data); + setPagination((prevPagination) => ({ + ...prevPagination, + total: data.length, + current: 1, + })); + setLoading(false); + }, 500); + }, [activeMenu]); + + // 处理菜单切换 + const handleMenuClick = (e: any) => { + setActiveMenu(e.key); + }; + + // 处理分页变化 + const handlePageChange = (page: number, pageSize?: number) => { + setPagination({ + ...pagination, + current: page, + pageSize: pageSize || pagination.pageSize, + }); + }; + + // 处理下载按钮点击 + const handleDownload = async (id: string, fileName: string) => { + try { + await downloadFile(id, fileName); + } catch (error) { + message.error('下载失败,请稍后重试'); + } + }; + + // 计算当前页显示的数据 + const getCurrentPageData = () => { + const { current, pageSize } = pagination; + const startIndex = (current - 1) * pageSize; + const endIndex = startIndex + pageSize; + return downloadData.slice(startIndex, endIndex); + }; + + return ( +
+ + + + }> + 模板文件 + + }> + 操作手册 + + + + + +
+ {activeMenu === 'template' ? '模板文件' : '操作手册'} + + + {getCurrentPageData().map((item) => ( + + + +
+ {item.icon} + {item.title} +
+
{item.publishDate}
+ {item.description} + +
+
+ + ))} +
+ + `共 ${total} 条记录`} + style={{ marginTop: 24, textAlign: 'right' }} + /> +
+ +
+
+ ); }; + export default DownloadPage; diff --git a/src/pages/download/service.ts b/src/pages/download/service.ts new file mode 100644 index 0000000..11324fd --- /dev/null +++ b/src/pages/download/service.ts @@ -0,0 +1,75 @@ +import { message } from 'antd'; +import request from '@/utils/request'; + +/** + * 获取下载中心文件列表 + * @param params 查询参数 + */ +export async function getDownloadList(params: { + type: string; + current: number; + pageSize: number; +}) { + try { + // 实际项目中应该通过API获取数据 + // return request('/api/download/list', { + // method: 'GET', + // params, + // }); + + // 模拟API请求返回数据 + return Promise.resolve({ + success: true, + data: { + list: [], + total: 0, + }, + }); + } catch (error) { + message.error('获取下载列表失败'); + return { + success: false, + data: { + list: [], + total: 0, + }, + }; + } +} + +/** + * 下载文件 + * @param fileId 文件ID + * @param fileName 文件名称 + */ +export async function downloadFile(fileId: string, fileName: string) { + try { + // 实际项目中应该通过API下载文件 + // const response = await request(`/api/download/file/${fileId}`, { + // method: 'GET', + // responseType: 'blob', + // }); + + // 创建下载链接 + // const blob = new Blob([response]); + // const url = window.URL.createObjectURL(blob); + // const link = document.createElement('a'); + // link.href = url; + // link.download = fileName; + // document.body.appendChild(link); + // link.click(); + // window.URL.revokeObjectURL(url); + // document.body.removeChild(link); + + // 模拟下载成功 + message.success(`文件"${fileName}"开始下载`); + return { + success: true, + }; + } catch (error) { + message.error(`下载文件"${fileName}"失败`); + return { + success: false, + }; + } +} diff --git a/src/pages/notice/notice.less b/src/pages/notice/notice.less index 3a9f0c4..81945e0 100644 --- a/src/pages/notice/notice.less +++ b/src/pages/notice/notice.less @@ -6,17 +6,6 @@ background-color: #fff; } -.noticeHeader { - margin-bottom: 24px; -} - -.pageTitle { - margin-bottom: 24px; - color: rgb(0, 79, 142); - font-weight: 500; - text-align: center; -} - .noticeRow { width: 100%; } @@ -25,35 +14,14 @@ margin-bottom: 24px; } -.menuTitle { - margin-bottom: 16px; - padding: 0 16px; - color: rgb(0, 79, 142); - font-weight: 500; - text-align: center; -} - .noticeMenu { border-right: none; } -.contentCard { - border-radius: 4px; -} - .noticeContent { width: 100%; } -.tableHeader { - margin-bottom: 16px; -} - -.tableTitle { - color: rgb(0, 79, 142); - font-weight: 500; -} - .noticeTitle { color: #333; transition: color 0.3s; diff --git a/src/pages/register/supplier.tsx b/src/pages/register/supplier.tsx index f86127f..66753a6 100644 --- a/src/pages/register/supplier.tsx +++ b/src/pages/register/supplier.tsx @@ -145,7 +145,7 @@ const SupplierRegister: React.FC = () => { okText="我知道了" cancelButtonProps={{ style: { display: 'none' } }} destroyOnClose - maskClosable={false} + // maskClosable={false} >

尊敬的用户: