50 lines
1.9 KiB
TypeScript
50 lines
1.9 KiB
TypeScript
import { Link } from 'react-router-dom'
|
|
import { METHODS as FALLBACK_METHODS } from '@/data/mock'
|
|
import { useCMS, getCMSMethods } from '@/services/cms'
|
|
import GlobalCTA from '@/components/Layout/GlobalCTA'
|
|
|
|
export default function Methods() {
|
|
const { data: METHODS } = useCMS(getCMSMethods, FALLBACK_METHODS)
|
|
return (
|
|
<div>
|
|
<div className="page-header">
|
|
<div className="container">
|
|
<div className="breadcrumb">
|
|
<Link to="/" style={{ color: 'rgba(255,255,255,0.8)' }}>
|
|
首页
|
|
</Link>{' '}
|
|
/ 方法与能力
|
|
</div>
|
|
<h1>方法与能力</h1>
|
|
<p>方法决定路径,能力决定落地。二者闭环,支撑企业进化。</p>
|
|
<div className="placeholder" style={{ marginTop: 12 }}>
|
|
【占位|待业务确认】方法论体系、工具、交付标准待知识母盘灌入。
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<section className="section">
|
|
<div className="container">
|
|
<div className="grid-2">
|
|
{METHODS.map(m => (
|
|
<Link key={m.id} to={`/methods/${m.slug}`} className="card" style={{ display: 'block' }}>
|
|
<p className="eyebrow">{m.group === 'method' ? '方法' : '能力'}</p>
|
|
<h3>{m.title}</h3>
|
|
<p>{m.summary}</p>
|
|
{m.steps && (
|
|
<ol style={{ fontSize: 13, color: '#475569', paddingLeft: 18, marginTop: 8 }}>
|
|
{m.steps.map(s => (
|
|
<li key={s}>{s}</li>
|
|
))}
|
|
</ol>
|
|
)}
|
|
<span style={{ fontSize: 12, color: '#0f6b5b', fontWeight: 700, marginTop: 10, display: 'inline-block' }}>查看详情 →</span>
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<GlobalCTA />
|
|
</div>
|
|
)
|
|
}
|