fix: make CMS content live and migrate to MySQL

src/pages/Evolution/index.tsx

@@ -1,12 +1,14 @@
 import { useState } from 'react'
 import { Link } from 'react-router-dom'
 import { FOUR_VALUES as FALLBACK_FOUR, AMB_STATUS_META } from '@/data/mock'
-import { useCMS, getCMSFourValues, getCMSAmb } from '@/services/cms'
+import { useCMS, useCMSTexts, getCMSFourValues, getCMSAmb } from '@/services/cms'
 import GlobalCTA from '@/components/Layout/GlobalCTA'
 
 export default function Evolution() {
   const { data: FOUR_VALUES } = useCMS(getCMSFourValues, FALLBACK_FOUR)
   const { data: AMB_META } = useCMS(getCMSAmb, AMB_STATUS_META)
+  const { data: texts } = useCMSTexts()
+  const text = (key: string, fallback: string) => texts[key] || fallback
   const [foldValues, setFoldValues] = useState(false)
   const [foldAmb, setFoldAmb] = useState(false)
 
@@ -20,12 +22,12 @@ export default function Evolution() {
             </Link>{' '}
             / 企业进化
           </div>
-          <h1>企业进化</h1>
+          <h1>{text('evolution.header_title', '企业进化')}</h1>
           <p>
-            内部顺序强制：<strong>企业进化思想 → 四大价值坐标 → A/M/B 状态坐标</strong>，顺序不可调换。
+            {text('evolution.header_description', '内部顺序强制：企业进化思想 → 四大价值坐标 → A/M/B 状态坐标，顺序不可调换。')}
           </p>
           <p style={{ fontSize: 12, color: 'rgba(255,255,255,0.6)', marginTop: 8 }}>
-            V1.1 FINAL 冻结顺序，任何调换需登记台账延后二期。
+            {text('evolution.header_note', '从进化思想到价值坐标，再到状态坐标，逐层看清企业位置。')}
           </p>
         </div>
       </div>
@@ -33,22 +35,17 @@ export default function Evolution() {
       {/* 1. 企业进化思想 */}
       <section className="section" id="idea">
         <div className="container">
-          <p className="eyebrow">01 — 企业进化思想</p>
-          <h2 className="h2">进化是持续迭代，而非一次性变革</h2>
-          <p className="desc">
-            企业进化强调在不确定环境中，通过机制与人的双重迭代，实现组织的自适应与自进化。拒绝“规模决定论”，强调价值维度独立观察。
-          </p>
+          <p className="eyebrow">{text('evolution.idea_eyebrow', '01 — 企业进化思想')}</p>
+          <h2 className="h2">{text('evolution.idea_title', '进化是持续迭代，而非一次性变革')}</h2>
+          <p className="desc">{text('evolution.idea_description', '企业进化强调在不确定环境中，通过机制与人的双重迭代，实现组织的自适应与自进化。拒绝规模决定论，强调价值维度独立观察。')}</p>
           <div className="card" style={{ marginTop: 16 }}>
-            <h3>核心主张（占位）</h3>
+            <h3>{text('evolution.idea_core_title', '核心主张')}</h3>
             <ul style={{ paddingLeft: 18, fontSize: 14, color: '#475569', lineHeight: 2 }}>
-              <li>经营即进化：战略、组织、机制、人的协同进化</li>
-              <li>坐标而非标签：用价值与状态观察，而非给企业贴标签</li>
-              <li>陪跑而非交付：共创机制，陪跑落地，复盘迭代</li>
-              <li>【占位｜待业务确认】更多思想阐述由知识母盘灌入</li>
+              <li>{text('evolution.idea_bullet_1', '经营即进化：战略、组织、机制、人的协同进化')}</li>
+              <li>{text('evolution.idea_bullet_2', '坐标而非标签：用价值与状态观察，而非给企业贴标签')}</li>
+              <li>{text('evolution.idea_bullet_3', '陪跑而非交付：共创机制，陪跑落地，复盘迭代')}</li>
+              <li>{text('evolution.idea_bullet_4', '持续复盘迭代，让每一次行动都沉淀为组织能力')}</li>
             </ul>
-            <div className="placeholder" style={{ marginTop: 12 }}>
-              【占位｜待业务确认】此段需业务方确认最终表述，一期仅保留结构。
-            </div>
           </div>
         </div>
       </section>
@@ -58,9 +55,9 @@ export default function Evolution() {
         <div className="container">
           <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', flexWrap: 'wrap', gap: 12 }}>
             <div>
-              <p className="eyebrow">02 — 四大价值坐标</p>
-              <h2 className="h2">观察坐标，非售卖产品</h2>
-              <p className="desc">四大价值定位为观察坐标，不能包装成售卖产品。用于看清企业在各维度的真实位置。</p>
+              <p className="eyebrow">{text('evolution.values_eyebrow', '02 — 四大价值坐标')}</p>
+              <h2 className="h2">{text('evolution.values_title', '观察坐标，非售卖产品')}</h2>
+              <p className="desc">{text('evolution.values_description', '四大价值定位为观察坐标，用于看清企业在各维度的真实位置。')}</p>
             </div>
             <button className="foldable-trigger" onClick={() => setFoldValues(!foldValues)} style={{ width: 'auto' }}>
               {foldValues ? '收起' : '展开'}价值详情 <span>{foldValues ? '−' : '+'}</span>
@@ -123,9 +120,9 @@ export default function Evolution() {
         <div className="container">
           <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', flexWrap: 'wrap', gap: 12 }}>
             <div>
-              <p className="eyebrow">03 — A/M/B 状态坐标</p>
-              <h2 className="h2">A / M / B 不绑定规模</h2>
-              <p className="desc">支持同一企业不同价值维度处于不同状态；拒绝“规模决定状态”的包装。</p>
+              <p className="eyebrow">{text('evolution.amb_eyebrow', '03 — A/M/B 状态坐标')}</p>
+              <h2 className="h2">{text('evolution.amb_title', 'A / M / B 不绑定规模')}</h2>
+              <p className="desc">{text('evolution.amb_description', '支持同一企业不同价值维度处于不同状态，拒绝规模决定状态的包装。')}</p>
             </div>
             <button className="foldable-trigger" onClick={() => setFoldAmb(!foldAmb)} style={{ width: 'auto' }}>
               {foldAmb ? '收起' : '展开'}状态详情 <span>{foldAmb ? '−' : '+'}</span>
@@ -150,13 +147,8 @@ export default function Evolution() {
           </div>
 
           <div className="card" style={{ marginTop: 20, background: '#f8fafc' }}>
-            <h3>跨维度状态示例（占位）</h3>
-            <p style={{ fontSize: 13, color: '#64748b' }}>
-              示例：某企业 · 战略价值 A / 组织价值 M / 经营价值 B / 人的价值 M。说明同一企业可在不同坐标处不同状态，需分维度干预。
-            </p>
-            <div className="placeholder" style={{ marginTop: 10 }}>
-              【占位｜待业务确认】真实示例需脱敏后灌入，一期仅示意结构。
-            </div>
+            <h3>{text('evolution.amb_example_title', '跨维度状态示例')}</h3>
+            <p style={{ fontSize: 13, color: '#64748b' }}>{text('evolution.amb_example_description', '示例：某企业 · 战略价值 A / 组织价值 M / 经营价值 B / 人的价值 M。说明同一企业可在不同坐标处不同状态，需分维度干预。')}</p>
           </div>
 
           <div style={{ marginTop: 16, display: 'flex', gap: 10, flexWrap: 'wrap' }}>