import{_ as r,l as C,w as s,j as l,k as m,f as e,e as t,b as n,d as I,r as y,C as h,a as W,q as Z}from"./index.3fe853a6.js";import{S as w}from"./SmileOutlined.02787c93.js";const V={};function B(p,a){const c=l("a-timeline-item"),g=l("a-timeline"),d=l("demo-box");return m(),C(d,{jsfiddle:{us:"Basic timeline.",cn:"\u57FA\u672C\u7684\u65F6\u95F4\u8F74\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u57FA\u672C\u7684\u65F6\u95F4\u8F74\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Basic timeline.</p>
`,order:0,title:{"zh-CN":"\u57FA\u672C\u7528\u6CD5","en-US":"Basic usage"},relativePath:"components/timeline/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWVsaW5lPgogICAgPGEtdGltZWxpbmUtaXRlbT5DcmVhdGUgYSBzZXJ2aWNlcyBzaXRlIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+U29sdmUgaW5pdGlhbCBuZXR3b3JrIHByb2JsZW1zIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+VGVjaG5pY2FsIHRlc3RpbmcgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgPGEtdGltZWxpbmUtaXRlbT5OZXR3b3JrIHByb2JsZW1zIGJlaW5nIHNvbHZlZCAyMDE1LTA5LTAxPC9hLXRpbWVsaW5lLWl0ZW0+CiAgPC9hLXRpbWVsaW5lPgo8L3RlbXBsYXRlPgoKCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWVsaW5lPgogICAgPGEtdGltZWxpbmUtaXRlbT5DcmVhdGUgYSBzZXJ2aWNlcyBzaXRlIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+U29sdmUgaW5pdGlhbCBuZXR3b3JrIHByb2JsZW1zIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+VGVjaG5pY2FsIHRlc3RpbmcgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgPGEtdGltZWxpbmUtaXRlbT5OZXR3b3JrIHByb2JsZW1zIGJlaW5nIHNvbHZlZCAyMDE1LTA5LTAxPC9hLXRpbWVsaW5lLWl0ZW0+CiAgPC9hLXRpbWVsaW5lPgo8L3RlbXBsYXRlPg=="}},{default:s(()=>[e(g,null,{default:s(()=>[e(c,null,{default:s(()=>a[0]||(a[0]=[t("Create a services site 2015-09-01")])),_:1,__:[0]}),e(c,null,{default:s(()=>a[1]||(a[1]=[t("Solve initial network problems 2015-09-01")])),_:1,__:[1]}),e(c,null,{default:s(()=>a[2]||(a[2]=[t("Technical testing 2015-09-01")])),_:1,__:[2]}),e(c,null,{default:s(()=>a[3]||(a[3]=[t("Network problems being solved 2015-09-01")])),_:1,__:[3]})]),_:1})]),htmlCode:s(()=>a[4]||(a[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Network problems being solved 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:s(()=>a[5]||(a[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Network problems being solved 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const X=r(V,[["render",B]]),S=I({components:{SmileOutlined:w}});function f(p,a,c,g,d,b){const o=l("a-timeline-item"),u=l("SmileOutlined"),i=l("a-timeline"),k=l("demo-box");return m(),C(k,{jsfiddle:{us:"Set the color of circles. `green` means completed or success status, `red` means warning or error, and `blue` means ongoing or other default status.",cn:"\u5706\u5708\u989C\u8272\uFF0C\u7EFF\u8272\u7528\u4E8E\u5DF2\u5B8C\u6210\u3001\u6210\u529F\u72B6\u6001\uFF0C\u7EA2\u8272\u8868\u793A\u544A\u8B66\u6216\u9519\u8BEF\u72B6\u6001\uFF0C\u84DD\u8272\u53EF\u8868\u793A\u6B63\u5728\u8FDB\u884C\u6216\u5176\u4ED6\u9ED8\u8BA4\u72B6\u6001\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u5706\u5708\u989C\u8272\uFF0C\u7EFF\u8272\u7528\u4E8E\u5DF2\u5B8C\u6210\u3001\u6210\u529F\u72B6\u6001\uFF0C\u7EA2\u8272\u8868\u793A\u544A\u8B66\u6216\u9519\u8BEF\u72B6\u6001\uFF0C\u84DD\u8272\u53EF\u8868\u793A\u6B63\u5728\u8FDB\u884C\u6216\u5176\u4ED6\u9ED8\u8BA4\u72B6\u6001\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Set the color of circles. <code>green</code> means completed or success status, <code>red</code> means warning or error, and <code>blue</code> means ongoing or other default status.</p>
`,order:1,title:{"zh-CN":"\u5706\u5708\u989C\u8272","en-US":"Color"},relativePath:"components/timeline/demo/color.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWVsaW5lPgogICAgPGEtdGltZWxpbmUtaXRlbSBjb2xvcj0iZ3JlZW4iPkNyZWF0ZSBhIHNlcnZpY2VzIHNpdGUgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgPGEtdGltZWxpbmUtaXRlbSBjb2xvcj0iZ3JlZW4iPkNyZWF0ZSBhIHNlcnZpY2VzIHNpdGUgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgPGEtdGltZWxpbmUtaXRlbSBjb2xvcj0icmVkIj4KICAgICAgPHA+U29sdmUgaW5pdGlhbCBuZXR3b3JrIHByb2JsZW1zIDE8L3A+CiAgICAgIDxwPlNvbHZlIGluaXRpYWwgbmV0d29yayBwcm9ibGVtcyAyPC9wPgogICAgICA8cD5Tb2x2ZSBpbml0aWFsIG5ldHdvcmsgcHJvYmxlbXMgMyAyMDE1LTA5LTAxPC9wPgogICAgPC9hLXRpbWVsaW5lLWl0ZW0+CiAgICA8YS10aW1lbGluZS1pdGVtPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAxPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAyPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAzIDIwMTUtMDktMDE8L3A+CiAgICA8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0gY29sb3I9ImdyYXkiPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAxPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAyPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAzIDIwMTUtMDktMDE8L3A+CiAgICA8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0gY29sb3I9ImdyYXkiPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAxPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAyPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAzIDIwMTUtMDktMDE8L3A+CiAgICA8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0gY29sb3I9IiMwMENDRkYiPgogICAgICA8dGVtcGxhdGUgI2RvdD4KICAgICAgICA8U21pbGVPdXRsaW5lZCAvPgogICAgICA8L3RlbXBsYXRlPgogICAgICA8cD5DdXN0b20gY29sb3IgdGVzdGluZzwvcD4KICAgIDwvYS10aW1lbGluZS1pdGVtPgogIDwvYS10aW1lbGluZT4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCB9IGZyb20gJ3Z1ZSc7CmltcG9ydCB7IFNtaWxlT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIGNvbXBvbmVudHM6IHsKICAgIFNtaWxlT3V0bGluZWQsCiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWVsaW5lPgogICAgPGEtdGltZWxpbmUtaXRlbSBjb2xvcj0iZ3JlZW4iPkNyZWF0ZSBhIHNlcnZpY2VzIHNpdGUgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgPGEtdGltZWxpbmUtaXRlbSBjb2xvcj0iZ3JlZW4iPkNyZWF0ZSBhIHNlcnZpY2VzIHNpdGUgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgPGEtdGltZWxpbmUtaXRlbSBjb2xvcj0icmVkIj4KICAgICAgPHA+U29sdmUgaW5pdGlhbCBuZXR3b3JrIHByb2JsZW1zIDE8L3A+CiAgICAgIDxwPlNvbHZlIGluaXRpYWwgbmV0d29yayBwcm9ibGVtcyAyPC9wPgogICAgICA8cD5Tb2x2ZSBpbml0aWFsIG5ldHdvcmsgcHJvYmxlbXMgMyAyMDE1LTA5LTAxPC9wPgogICAgPC9hLXRpbWVsaW5lLWl0ZW0+CiAgICA8YS10aW1lbGluZS1pdGVtPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAxPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAyPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAzIDIwMTUtMDktMDE8L3A+CiAgICA8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0gY29sb3I9ImdyYXkiPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAxPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAyPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAzIDIwMTUtMDktMDE8L3A+CiAgICA8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0gY29sb3I9ImdyYXkiPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAxPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAyPC9wPgogICAgICA8cD5UZWNobmljYWwgdGVzdGluZyAzIDIwMTUtMDktMDE8L3A+CiAgICA8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0gY29sb3I9IiMwMENDRkYiPgogICAgICA8dGVtcGxhdGUgI2RvdD4KICAgICAgICA8U21pbGVPdXRsaW5lZCAvPgogICAgICA8L3RlbXBsYXRlPgogICAgICA8cD5DdXN0b20gY29sb3IgdGVzdGluZzwvcD4KICAgIDwvYS10aW1lbGluZS1pdGVtPgogIDwvYS10aW1lbGluZT4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJzsKaW1wb3J0IHsgU21pbGVPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgY29tcG9uZW50czogewogICAgU21pbGVPdXRsaW5lZCwKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:s(()=>[e(i,null,{default:s(()=>[e(o,{color:"green"},{default:s(()=>a[0]||(a[0]=[t("Create a services site 2015-09-01")])),_:1,__:[0]}),e(o,{color:"green"},{default:s(()=>a[1]||(a[1]=[t("Create a services site 2015-09-01")])),_:1,__:[1]}),e(o,{color:"red"},{default:s(()=>a[2]||(a[2]=[n("p",null,"Solve initial network problems 1",-1),n("p",null,"Solve initial network problems 2",-1),n("p",null,"Solve initial network problems 3 2015-09-01",-1)])),_:1,__:[2]}),e(o,null,{default:s(()=>a[3]||(a[3]=[n("p",null,"Technical testing 1",-1),n("p",null,"Technical testing 2",-1),n("p",null,"Technical testing 3 2015-09-01",-1)])),_:1,__:[3]}),e(o,{color:"gray"},{default:s(()=>a[4]||(a[4]=[n("p",null,"Technical testing 1",-1),n("p",null,"Technical testing 2",-1),n("p",null,"Technical testing 3 2015-09-01",-1)])),_:1,__:[4]}),e(o,{color:"gray"},{default:s(()=>a[5]||(a[5]=[n("p",null,"Technical testing 1",-1),n("p",null,"Technical testing 2",-1),n("p",null,"Technical testing 3 2015-09-01",-1)])),_:1,__:[5]}),e(o,{color:"#00CCFF"},{dot:s(()=>[e(u)]),default:s(()=>[a[6]||(a[6]=n("p",null,"Custom color testing",-1))]),_:1,__:[6]})]),_:1})]),htmlCode:s(()=>a[7]||(a[7]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("green"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("green"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("red"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 3 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 3 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("gray"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 3 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("gray"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 3 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("#00CCFF"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dot"),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("SmileOutlined")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Custom color testing"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" SmileOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
    SmileOutlined`),n("span",{class:"token punctuation"},","),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:s(()=>a[8]||(a[8]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("green"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("green"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("red"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 3 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 3 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("gray"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 3 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("gray"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 3 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("#00CCFF"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dot"),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("SmileOutlined")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("p")]),n("span",{class:"token punctuation"},">")]),t("Custom color testing"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("p")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" SmileOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
    SmileOutlined`),n("span",{class:"token punctuation"},","),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const D=r(S,[["render",f]]),x=I({setup(){const p=y(!1);return{reverse:p,handleClick:()=>{p.value=!p.value}}}});function P(p,a,c,g,d,b){const o=l("a-timeline-item"),u=l("a-timeline"),i=l("a-button"),k=l("demo-box");return m(),C(k,{jsfiddle:{us:'When the timeline is incomplete and ongoing, put a ghost node at last. Set `pending` as truthy value to enable displaying pending item. You can customize the `pending` content by passing a `VNode`. Meanwhile, `slot="pendingDot"` is used to customize the dot of the pending item.\n`reverse={true}` is used for reversing nodes.',cn:"\u5F53\u4EFB\u52A1\u72B6\u6001\u6B63\u5728\u53D1\u751F\uFF0C\u8FD8\u5728\u8BB0\u5F55\u8FC7\u7A0B\u4E2D\uFF0C\u53EF\u7528\u5E7D\u7075\u8282\u70B9\u6765\u8868\u793A\u5F53\u524D\u7684\u65F6\u95F4\u8282\u70B9\uFF0C\u5F53 `pending` \u4E3A\u771F\u503C\u65F6\u5C55\u793A\u5E7D\u7075\u8282\u70B9\uFF0C\u5982\u679C `pending` \u662F `VNode` \u53EF\u7528\u4E8E\u5B9A\u5236\u8BE5\u8282\u70B9\u5185\u5BB9\uFF0C\u540C\u65F6 `pendingDot` \u5C06\u53EF\u4EE5\u7528\u4E8E\u5B9A\u5236\u5176\u8F74\u70B9\u3002reverse \u5C5E\u6027\u7528\u4E8E\u63A7\u5236\u8282\u70B9\u6392\u5E8F\uFF0C\u4E3A false \u65F6\u6309\u6B63\u5E8F\u6392\u5217\uFF0C\u4E3A true \u65F6\u6309\u5012\u5E8F\u6392\u5217\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u5F53\u4EFB\u52A1\u72B6\u6001\u6B63\u5728\u53D1\u751F\uFF0C\u8FD8\u5728\u8BB0\u5F55\u8FC7\u7A0B\u4E2D\uFF0C\u53EF\u7528\u5E7D\u7075\u8282\u70B9\u6765\u8868\u793A\u5F53\u524D\u7684\u65F6\u95F4\u8282\u70B9\uFF0C\u5F53 <code>pending</code> \u4E3A\u771F\u503C\u65F6\u5C55\u793A\u5E7D\u7075\u8282\u70B9\uFF0C\u5982\u679C <code>pending</code> \u662F <code>VNode</code> \u53EF\u7528\u4E8E\u5B9A\u5236\u8BE5\u8282\u70B9\u5185\u5BB9\uFF0C\u540C\u65F6 <code>pendingDot</code> \u5C06\u53EF\u4EE5\u7528\u4E8E\u5B9A\u5236\u5176\u8F74\u70B9\u3002reverse \u5C5E\u6027\u7528\u4E8E\u63A7\u5236\u8282\u70B9\u6392\u5E8F\uFF0C\u4E3A false \u65F6\u6309\u6B63\u5E8F\u6392\u5217\uFF0C\u4E3A true \u65F6\u6309\u5012\u5E8F\u6392\u5217\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>When the timeline is incomplete and ongoing, put a ghost node at last. Set <code>pending</code> as truthy value to enable displaying pending item. You can customize the <code>pending</code> content by passing a <code>VNode</code>. Meanwhile, <code>slot=&quot;pendingDot&quot;</code> is used to customize the dot of the pending item.
<code>reverse={true}</code> is used for reversing nodes.</p>
`,order:2,title:{"zh-CN":"\u6700\u540E\u4E00\u4E2A\u53CA\u6392\u5E8F","en-US":"Last node"},relativePath:"components/timeline/demo/pending.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS10aW1lbGluZSBwZW5kaW5nPSJSZWNvcmRpbmcuLi4iIDpyZXZlcnNlPSJyZXZlcnNlIj4KICAgICAgPGEtdGltZWxpbmUtaXRlbT5DcmVhdGUgYSBzZXJ2aWNlcyBzaXRlIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgICAgPGEtdGltZWxpbmUtaXRlbT5Tb2x2ZSBpbml0aWFsIG5ldHdvcmsgcHJvYmxlbXMgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgICA8YS10aW1lbGluZS1pdGVtPlRlY2huaWNhbCB0ZXN0aW5nIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDwvYS10aW1lbGluZT4KICAgIDxhLWJ1dHRvbiB0eXBlPSJwcmltYXJ5IiBzdHlsZT0ibWFyZ2luLXRvcDogMTZweCIgQGNsaWNrPSJoYW5kbGVDbGljayI+VG9nZ2xlIFJldmVyc2U8L2EtYnV0dG9uPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwoKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHJldmVyc2UgPSByZWY8Ym9vbGVhbj4oZmFsc2UpOwoKICAgIGNvbnN0IGhhbmRsZUNsaWNrID0gKCkgPT4gewogICAgICByZXZlcnNlLnZhbHVlID0gIXJldmVyc2UudmFsdWU7CiAgICB9OwoKICAgIHJldHVybiB7CiAgICAgIHJldmVyc2UsCiAgICAgIGhhbmRsZUNsaWNrLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS10aW1lbGluZSBwZW5kaW5nPSJSZWNvcmRpbmcuLi4iIDpyZXZlcnNlPSJyZXZlcnNlIj4KICAgICAgPGEtdGltZWxpbmUtaXRlbT5DcmVhdGUgYSBzZXJ2aWNlcyBzaXRlIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgICAgPGEtdGltZWxpbmUtaXRlbT5Tb2x2ZSBpbml0aWFsIG5ldHdvcmsgcHJvYmxlbXMgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgICA8YS10aW1lbGluZS1pdGVtPlRlY2huaWNhbCB0ZXN0aW5nIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDwvYS10aW1lbGluZT4KICAgIDxhLWJ1dHRvbiB0eXBlPSJwcmltYXJ5IiBzdHlsZT0ibWFyZ2luLXRvcDogMTZweCIgQGNsaWNrPSJoYW5kbGVDbGljayI+VG9nZ2xlIFJldmVyc2U8L2EtYnV0dG9uPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCByZXZlcnNlID0gcmVmKGZhbHNlKTsKICAgIGNvbnN0IGhhbmRsZUNsaWNrID0gKCkgPT4gewogICAgICByZXZlcnNlLnZhbHVlID0gIXJldmVyc2UudmFsdWU7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgcmV2ZXJzZSwKICAgICAgaGFuZGxlQ2xpY2ssCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:s(()=>[n("div",null,[e(u,{pending:"Recording...",reverse:p.reverse},{default:s(()=>[e(o,null,{default:s(()=>a[0]||(a[0]=[t("Create a services site 2015-09-01")])),_:1,__:[0]}),e(o,null,{default:s(()=>a[1]||(a[1]=[t("Solve initial network problems 2015-09-01")])),_:1,__:[1]}),e(o,null,{default:s(()=>a[2]||(a[2]=[t("Technical testing 2015-09-01")])),_:1,__:[2]})]),_:1},8,["reverse"]),e(i,{type:"primary",style:{"margin-top":"16px"},onClick:p.handleClick},{default:s(()=>a[3]||(a[3]=[t("Toggle Reverse")])),_:1,__:[3]},8,["onClick"])])]),htmlCode:s(()=>a[4]||(a[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),t(),n("span",{class:"token attr-name"},"pending"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Recording..."),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":reverse"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("reverse"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),t(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleClick"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Toggle Reverse"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`

`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" reverse "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`

    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleClick"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      reverse`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token operator"},"!"),t("reverse"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`

    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      reverse`),n("span",{class:"token punctuation"},","),t(`
      handleClick`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:s(()=>a[5]||(a[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),t(),n("span",{class:"token attr-name"},"pending"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Recording..."),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":reverse"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("reverse"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Technical testing 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),t(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleClick"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Toggle Reverse"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" reverse "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleClick"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      reverse`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token operator"},"!"),t("reverse"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      reverse`),n("span",{class:"token punctuation"},","),t(`
      handleClick`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const T=r(x,[["render",P]]),R=I({components:{ClockCircleOutlined:h}});function N(p,a,c,g,d,b){const o=l("a-timeline-item"),u=l("clock-circle-outlined"),i=l("a-timeline"),k=l("demo-box");return m(),C(k,{jsfiddle:{us:"Set a node as an icon or other custom element.",cn:"\u53EF\u4EE5\u8BBE\u7F6E\u4E3A\u56FE\u6807\u6216\u5176\u4ED6\u81EA\u5B9A\u4E49\u5143\u7D20\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u53EF\u4EE5\u8BBE\u7F6E\u4E3A\u56FE\u6807\u6216\u5176\u4ED6\u81EA\u5B9A\u4E49\u5143\u7D20\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Set a node as an icon or other custom element.</p>
`,order:3,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u65F6\u95F4\u8F74\u70B9","en-US":"Custom"},relativePath:"components/timeline/demo/custom.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWVsaW5lPgogICAgPGEtdGltZWxpbmUtaXRlbT5DcmVhdGUgYSBzZXJ2aWNlcyBzaXRlIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+U29sdmUgaW5pdGlhbCBuZXR3b3JrIHByb2JsZW1zIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0gY29sb3I9InJlZCI+CiAgICAgIDx0ZW1wbGF0ZSAjZG90PjxjbG9jay1jaXJjbGUtb3V0bGluZWQgc3R5bGU9ImZvbnQtc2l6ZTogMTZweCIgLz48L3RlbXBsYXRlPgogICAgICBUZWNobmljYWwgdGVzdGluZyAyMDE1LTA5LTAxCiAgICA8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+TmV0d29yayBwcm9ibGVtcyBiZWluZyBzb2x2ZWQgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogIDwvYS10aW1lbGluZT4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IENsb2NrQ2lyY2xlT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIGNvbXBvbmVudHM6IHsKICAgIENsb2NrQ2lyY2xlT3V0bGluZWQsCiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWVsaW5lPgogICAgPGEtdGltZWxpbmUtaXRlbT5DcmVhdGUgYSBzZXJ2aWNlcyBzaXRlIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+U29sdmUgaW5pdGlhbCBuZXR3b3JrIHByb2JsZW1zIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0gY29sb3I9InJlZCI+CiAgICAgIDx0ZW1wbGF0ZSAjZG90PjxjbG9jay1jaXJjbGUtb3V0bGluZWQgc3R5bGU9ImZvbnQtc2l6ZTogMTZweCIgLz48L3RlbXBsYXRlPgogICAgICBUZWNobmljYWwgdGVzdGluZyAyMDE1LTA5LTAxCiAgICA8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+TmV0d29yayBwcm9ibGVtcyBiZWluZyBzb2x2ZWQgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogIDwvYS10aW1lbGluZT4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgQ2xvY2tDaXJjbGVPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgY29tcG9uZW50czogewogICAgQ2xvY2tDaXJjbGVPdXRsaW5lZCwKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:s(()=>[e(i,null,{default:s(()=>[e(o,null,{default:s(()=>a[0]||(a[0]=[t("Create a services site 2015-09-01")])),_:1,__:[0]}),e(o,null,{default:s(()=>a[1]||(a[1]=[t("Solve initial network problems 2015-09-01")])),_:1,__:[1]}),e(o,{color:"red"},{dot:s(()=>[e(u,{style:{"font-size":"16px"}})]),default:s(()=>[a[2]||(a[2]=t(" Technical testing 2015-09-01 "))]),_:1,__:[2]}),e(o,null,{default:s(()=>a[3]||(a[3]=[t("Network problems being solved 2015-09-01")])),_:1,__:[3]})]),_:1})]),htmlCode:s(()=>a[4]||(a[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("red"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dot"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("clock-circle-outlined")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),t(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
      Technical testing 2015-09-01
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Network problems being solved 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ClockCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
    ClockCircleOutlined`),n("span",{class:"token punctuation"},","),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:s(()=>a[5]||(a[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("red"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dot"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("clock-circle-outlined")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),t(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
      Technical testing 2015-09-01
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Network problems being solved 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ClockCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
    ClockCircleOutlined`),n("span",{class:"token punctuation"},","),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const U=r(R,[["render",N]]),F=I({components:{ClockCircleOutlined:h}});function Y(p,a,c,g,d,b){const o=l("a-timeline-item"),u=l("ClockCircleOutlined"),i=l("a-timeline"),k=l("demo-box");return m(),C(k,{jsfiddle:{us:"Alternate timeline.",cn:"\u5185\u5BB9\u5728\u65F6\u95F4\u8F74\u4E24\u4FA7\u8F6E\u6D41\u51FA\u73B0\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u5185\u5BB9\u5728\u65F6\u95F4\u8F74\u4E24\u4FA7\u8F6E\u6D41\u51FA\u73B0\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Alternate timeline.</p>
`,order:4,title:{"zh-CN":"\u4EA4\u66FF\u5C55\u73B0","en-US":"Alternate"},relativePath:"components/timeline/demo/alternate.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWVsaW5lIG1vZGU9ImFsdGVybmF0ZSI+CiAgICA8YS10aW1lbGluZS1pdGVtPkNyZWF0ZSBhIHNlcnZpY2VzIHNpdGUgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgPGEtdGltZWxpbmUtaXRlbSBjb2xvcj0iZ3JlZW4iPlNvbHZlIGluaXRpYWwgbmV0d29yayBwcm9ibGVtcyAyMDE1LTA5LTAxPC9hLXRpbWVsaW5lLWl0ZW0+CiAgICA8YS10aW1lbGluZS1pdGVtPgogICAgICA8dGVtcGxhdGUgI2RvdD48Q2xvY2tDaXJjbGVPdXRsaW5lZCBzdHlsZT0iZm9udC1zaXplOiAxNnB4IiAvPjwvdGVtcGxhdGU+CiAgICAgIFNlZCB1dCBwZXJzcGljaWF0aXMgdW5kZSBvbW5pcyBpc3RlIG5hdHVzIGVycm9yIHNpdCB2b2x1cHRhdGVtIGFjY3VzYW50aXVtIGRvbG9yZW1xdWUKICAgICAgbGF1ZGFudGl1bSwgdG90YW0gcmVtIGFwZXJpYW0sIGVhcXVlIGlwc2EgcXVhZSBhYiBpbGxvIGludmVudG9yZSB2ZXJpdGF0aXMgZXQgcXVhc2kgYXJjaGl0ZWN0bwogICAgICBiZWF0YWUgdml0YWUgZGljdGEgc3VudCBleHBsaWNhYm8uCiAgICA8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0gY29sb3I9InJlZCI+TmV0d29yayBwcm9ibGVtcyBiZWluZyBzb2x2ZWQgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgPGEtdGltZWxpbmUtaXRlbT5DcmVhdGUgYSBzZXJ2aWNlcyBzaXRlIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+CiAgICAgIDx0ZW1wbGF0ZSAjZG90PjxDbG9ja0NpcmNsZU91dGxpbmVkIHN0eWxlPSJmb250LXNpemU6IDE2cHgiIC8+PC90ZW1wbGF0ZT4KICAgICAgVGVjaG5pY2FsIHRlc3RpbmcgMjAxNS0wOS0wMQogICAgPC9hLXRpbWVsaW5lLWl0ZW0+CiAgPC9hLXRpbWVsaW5lPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgQ2xvY2tDaXJjbGVPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgY29tcG9uZW50czogewogICAgQ2xvY2tDaXJjbGVPdXRsaW5lZCwKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWVsaW5lIG1vZGU9ImFsdGVybmF0ZSI+CiAgICA8YS10aW1lbGluZS1pdGVtPkNyZWF0ZSBhIHNlcnZpY2VzIHNpdGUgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgPGEtdGltZWxpbmUtaXRlbSBjb2xvcj0iZ3JlZW4iPlNvbHZlIGluaXRpYWwgbmV0d29yayBwcm9ibGVtcyAyMDE1LTA5LTAxPC9hLXRpbWVsaW5lLWl0ZW0+CiAgICA8YS10aW1lbGluZS1pdGVtPgogICAgICA8dGVtcGxhdGUgI2RvdD48Q2xvY2tDaXJjbGVPdXRsaW5lZCBzdHlsZT0iZm9udC1zaXplOiAxNnB4IiAvPjwvdGVtcGxhdGU+CiAgICAgIFNlZCB1dCBwZXJzcGljaWF0aXMgdW5kZSBvbW5pcyBpc3RlIG5hdHVzIGVycm9yIHNpdCB2b2x1cHRhdGVtIGFjY3VzYW50aXVtIGRvbG9yZW1xdWUKICAgICAgbGF1ZGFudGl1bSwgdG90YW0gcmVtIGFwZXJpYW0sIGVhcXVlIGlwc2EgcXVhZSBhYiBpbGxvIGludmVudG9yZSB2ZXJpdGF0aXMgZXQgcXVhc2kgYXJjaGl0ZWN0bwogICAgICBiZWF0YWUgdml0YWUgZGljdGEgc3VudCBleHBsaWNhYm8uCiAgICA8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0gY29sb3I9InJlZCI+TmV0d29yayBwcm9ibGVtcyBiZWluZyBzb2x2ZWQgMjAxNS0wOS0wMTwvYS10aW1lbGluZS1pdGVtPgogICAgPGEtdGltZWxpbmUtaXRlbT5DcmVhdGUgYSBzZXJ2aWNlcyBzaXRlIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+CiAgICAgIDx0ZW1wbGF0ZSAjZG90PjxDbG9ja0NpcmNsZU91dGxpbmVkIHN0eWxlPSJmb250LXNpemU6IDE2cHgiIC8+PC90ZW1wbGF0ZT4KICAgICAgVGVjaG5pY2FsIHRlc3RpbmcgMjAxNS0wOS0wMQogICAgPC9hLXRpbWVsaW5lLWl0ZW0+CiAgPC9hLXRpbWVsaW5lPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBDbG9ja0NpcmNsZU91dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBDbG9ja0NpcmNsZU91dGxpbmVkLAogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:s(()=>[e(i,{mode:"alternate"},{default:s(()=>[e(o,null,{default:s(()=>a[0]||(a[0]=[t("Create a services site 2015-09-01")])),_:1,__:[0]}),e(o,{color:"green"},{default:s(()=>a[1]||(a[1]=[t("Solve initial network problems 2015-09-01")])),_:1,__:[1]}),e(o,null,{dot:s(()=>[e(u,{style:{"font-size":"16px"}})]),default:s(()=>[a[2]||(a[2]=t(" Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. "))]),_:1,__:[2]}),e(o,{color:"red"},{default:s(()=>a[3]||(a[3]=[t("Network problems being solved 2015-09-01")])),_:1,__:[3]}),e(o,null,{default:s(()=>a[4]||(a[4]=[t("Create a services site 2015-09-01")])),_:1,__:[4]}),e(o,null,{dot:s(()=>[e(u,{style:{"font-size":"16px"}})]),default:s(()=>[a[5]||(a[5]=t(" Technical testing 2015-09-01 "))]),_:1,__:[5]})]),_:1})]),htmlCode:s(()=>a[6]||(a[6]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),t(),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("alternate"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("green"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dot"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("ClockCircleOutlined")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),t(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
      Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque
      laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto
      beatae vitae dicta sunt explicabo.
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("red"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Network problems being solved 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dot"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("ClockCircleOutlined")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),t(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
      Technical testing 2015-09-01
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ClockCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
    ClockCircleOutlined`),n("span",{class:"token punctuation"},","),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:s(()=>a[7]||(a[7]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),t(),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("alternate"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("green"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dot"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("ClockCircleOutlined")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),t(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
      Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque
      laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto
      beatae vitae dicta sunt explicabo.
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),t(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("red"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Network problems being solved 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dot"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("ClockCircleOutlined")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),t(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
      Technical testing 2015-09-01
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ClockCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
    ClockCircleOutlined`),n("span",{class:"token punctuation"},","),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const E=r(F,[["render",Y]]),L=I({components:{ClockCircleOutlined:h}});function _(p,a,c,g,d,b){const o=l("a-timeline-item"),u=l("clock-circle-outlined"),i=l("a-timeline"),k=l("demo-box");return m(),C(k,{jsfiddle:{us:"Right alternate timeline.",cn:"\u65F6\u95F4\u8F74\u70B9\u53EF\u4EE5\u5728\u5185\u5BB9\u7684\u53F3\u8FB9\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u65F6\u95F4\u8F74\u70B9\u53EF\u4EE5\u5728\u5185\u5BB9\u7684\u53F3\u8FB9\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Right alternate timeline.</p>
`,order:5,title:{"zh-CN":"\u53F3\u4FA7\u65F6\u95F4\u8F74\u70B9","en-US":"Right alternate"},relativePath:"components/timeline/demo/right.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWVsaW5lIG1vZGU9InJpZ2h0Ij4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+Q3JlYXRlIGEgc2VydmljZXMgc2l0ZSAyMDE1LTA5LTAxPC9hLXRpbWVsaW5lLWl0ZW0+CiAgICA8YS10aW1lbGluZS1pdGVtPlNvbHZlIGluaXRpYWwgbmV0d29yayBwcm9ibGVtcyAyMDE1LTA5LTAxPC9hLXRpbWVsaW5lLWl0ZW0+CiAgICA8YS10aW1lbGluZS1pdGVtPgogICAgICA8dGVtcGxhdGUgI2RvdD48Y2xvY2stY2lyY2xlLW91dGxpbmVkIHN0eWxlPSJmb250LXNpemU6IDE2cHgiIC8+PC90ZW1wbGF0ZT4KICAgICAgVGVjaG5pY2FsIHRlc3RpbmcgMjAxNS0wOS0wMQogICAgPC9hLXRpbWVsaW5lLWl0ZW0+CiAgICA8YS10aW1lbGluZS1pdGVtPk5ldHdvcmsgcHJvYmxlbXMgYmVpbmcgc29sdmVkIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICA8L2EtdGltZWxpbmU+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBDbG9ja0NpcmNsZU91dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBDbG9ja0NpcmNsZU91dGxpbmVkLAogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWVsaW5lIG1vZGU9InJpZ2h0Ij4KICAgIDxhLXRpbWVsaW5lLWl0ZW0+Q3JlYXRlIGEgc2VydmljZXMgc2l0ZSAyMDE1LTA5LTAxPC9hLXRpbWVsaW5lLWl0ZW0+CiAgICA8YS10aW1lbGluZS1pdGVtPlNvbHZlIGluaXRpYWwgbmV0d29yayBwcm9ibGVtcyAyMDE1LTA5LTAxPC9hLXRpbWVsaW5lLWl0ZW0+CiAgICA8YS10aW1lbGluZS1pdGVtPgogICAgICA8dGVtcGxhdGUgI2RvdD48Y2xvY2stY2lyY2xlLW91dGxpbmVkIHN0eWxlPSJmb250LXNpemU6IDE2cHgiIC8+PC90ZW1wbGF0ZT4KICAgICAgVGVjaG5pY2FsIHRlc3RpbmcgMjAxNS0wOS0wMQogICAgPC9hLXRpbWVsaW5lLWl0ZW0+CiAgICA8YS10aW1lbGluZS1pdGVtPk5ldHdvcmsgcHJvYmxlbXMgYmVpbmcgc29sdmVkIDIwMTUtMDktMDE8L2EtdGltZWxpbmUtaXRlbT4KICA8L2EtdGltZWxpbmU+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IENsb2NrQ2lyY2xlT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIGNvbXBvbmVudHM6IHsKICAgIENsb2NrQ2lyY2xlT3V0bGluZWQsCiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:s(()=>[e(i,{mode:"right"},{default:s(()=>[e(o,null,{default:s(()=>a[0]||(a[0]=[t("Create a services site 2015-09-01")])),_:1,__:[0]}),e(o,null,{default:s(()=>a[1]||(a[1]=[t("Solve initial network problems 2015-09-01")])),_:1,__:[1]}),e(o,null,{dot:s(()=>[e(u,{style:{"font-size":"16px"}})]),default:s(()=>[a[2]||(a[2]=t(" Technical testing 2015-09-01 "))]),_:1,__:[2]}),e(o,null,{default:s(()=>a[3]||(a[3]=[t("Network problems being solved 2015-09-01")])),_:1,__:[3]})]),_:1})]),htmlCode:s(()=>a[4]||(a[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),t(),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("right"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dot"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("clock-circle-outlined")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),t(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
      Technical testing 2015-09-01
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Network problems being solved 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ClockCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
    ClockCircleOutlined`),n("span",{class:"token punctuation"},","),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:s(()=>a[5]||(a[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline")]),t(),n("span",{class:"token attr-name"},"mode"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("right"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Create a services site 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Solve initial network problems 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#dot"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("clock-circle-outlined")]),t(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),t(" 16px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
      Technical testing 2015-09-01
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t("Network problems being solved 2015-09-01"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-timeline")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" ClockCircleOutlined "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
    ClockCircleOutlined`),n("span",{class:"token punctuation"},","),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const j=r(L,[["render",_]]),z={pageData:{title:"Timeline",description:"",frontmatter:{category:"Components",type:"\u6570\u636E\u5C55\u793A",title:"Timeline",subtitle:"\u65F6\u95F4\u8F74",cover:"https://gw.alipayobjects.com/zos/antfincdn/vJmo00mmgR/Timeline.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:""},{level:2,title:"API",slug:"API",content:""},{level:3,title:"Timeline",slug:"Timeline",content:"\u65F6\u95F4\u8F74\u3002"},{level:3,title:"Timeline.Item",slug:"Timeline-Item",content:"\u65F6\u95F4\u8F74\u7684\u6BCF\u4E00\u4E2A\u8282\u70B9\u3002"}],relativePath:"components/timeline/index.zh-CN.md",content:`
\u5782\u76F4\u5C55\u793A\u7684\u65F6\u95F4\u6D41\u4FE1\u606F\u3002

## \u4F55\u65F6\u4F7F\u7528

- \u5F53\u6709\u4E00\u7CFB\u5217\u4FE1\u606F\u9700\u6309\u65F6\u95F4\u6392\u5217\u65F6\uFF0C\u53EF\u6B63\u5E8F\u548C\u5012\u5E8F\u3002
- \u9700\u8981\u6709\u4E00\u6761\u65F6\u95F4\u8F74\u8FDB\u884C\u89C6\u89C9\u4E0A\u7684\u4E32\u8054\u65F6\u3002

## API

\`\`\`html
&lt;a-timeline&gt;
  &lt;a-timeline-item&gt;\u521B\u5EFA\u670D\u52A1\u73B0\u573A 2015-09-01&lt;/a-timeline-item&gt;
  &lt;a-timeline-item&gt;\u521D\u6B65\u6392\u9664\u7F51\u7EDC\u5F02\u5E38 2015-09-01&lt;/a-timeline-item&gt;
  &lt;a-timeline-item&gt;\u6280\u672F\u6D4B\u8BD5\u5F02\u5E38 2015-09-01&lt;/a-timeline-item&gt;
  &lt;a-timeline-item&gt;\u7F51\u7EDC\u5F02\u5E38\u6B63\u5728\u4FEE\u590D 2015-09-01&lt;/a-timeline-item&gt;
&lt;/a-timeline&gt;
\`\`\`

### Timeline

\u65F6\u95F4\u8F74\u3002

| \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C |
| --- | --- | --- | --- |
| mode | \u901A\u8FC7\u8BBE\u7F6E \`mode\` \u53EF\u4EE5\u6539\u53D8\u65F6\u95F4\u8F74\u548C\u5185\u5BB9\u7684\u76F8\u5BF9\u4F4D\u7F6E | \`left\` \\| \`alternate\` \\| \`right\` |  |
| pending | \u6307\u5B9A\u6700\u540E\u4E00\u4E2A\u5E7D\u7075\u8282\u70B9\u662F\u5426\u5B58\u5728\u6216\u5185\u5BB9 | boolean\\|string\\|slot | false |
| pendingDot | \u5F53\u6700\u540E\u4E00\u4E2A\u5E7D\u7075\u8282\u70B9\u5B58\u5728\u6642\uFF0C\u6307\u5B9A\u5176\u65F6\u95F4\u56FE\u70B9 | string\\|slot | \`&lt;LoadingOutlined /&gt;\` |
| reverse | \u8282\u70B9\u6392\u5E8F | boolean | false |

### Timeline.Item

\u65F6\u95F4\u8F74\u7684\u6BCF\u4E00\u4E2A\u8282\u70B9\u3002

| \u53C2\u6570     | \u8BF4\u660E                                            | \u7C7B\u578B              | \u9ED8\u8BA4\u503C | \u7248\u672C |
| -------- | ----------------------------------------------- | ----------------- | ------ | ---- |
| color    | \u6307\u5B9A\u5706\u5708\u989C\u8272 \`blue, red, green\`\uFF0C\u6216\u81EA\u5B9A\u4E49\u7684\u8272\u503C | string            | blue   |      |
| dot      | \u81EA\u5B9A\u4E49\u65F6\u95F4\u8F74\u70B9                                  | string\\|slot      | -      |      |
| label    | \u8BBE\u7F6E\u6807\u7B7E                                        | string \\| slot    | -      | 3.0  |
| position | \u81EA\u5B9A\u4E49\u8282\u70B9\u4F4D\u7F6E                                  | \`left\` \\| \`right\` | -      |      |
`,html:`<p>\u5782\u76F4\u5C55\u793A\u7684\u65F6\u95F4\u6D41\u4FE1\u606F\u3002</p>
<h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528 <a class="header-anchor" href="#\u4F55\u65F6\u4F7F\u7528">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<ul>
<li>\u5F53\u6709\u4E00\u7CFB\u5217\u4FE1\u606F\u9700\u6309\u65F6\u95F4\u6392\u5217\u65F6\uFF0C\u53EF\u6B63\u5E8F\u548C\u5012\u5E8F\u3002</li>
<li>\u9700\u8981\u6709\u4E00\u6761\u65F6\u95F4\u8F74\u8FDB\u884C\u89C6\u89C9\u4E0A\u7684\u4E32\u8054\u65F6\u3002</li>
</ul>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline</span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">></span></span>\u521B\u5EFA\u670D\u52A1\u73B0\u573A 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">></span></span>\u521D\u6B65\u6392\u9664\u7F51\u7EDC\u5F02\u5E38 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">></span></span>\u6280\u672F\u6D4B\u8BD5\u5F02\u5E38 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">></span></span>\u7F51\u7EDC\u5F02\u5E38\u6B63\u5728\u4FEE\u590D 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline</span><span class="token punctuation">></span></span>
</code></pre>
<h3 id="Timeline">Timeline <a class="header-anchor" href="#Timeline">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<p>\u65F6\u95F4\u8F74\u3002</p>
<table>
<thead>
<tr>
<th>\u53C2\u6570</th>
<th>\u8BF4\u660E</th>
<th>\u7C7B\u578B</th>
<th>\u9ED8\u8BA4\u503C</th>
</tr>
</thead>
<tbody>
<tr>
<td>mode</td>
<td>\u901A\u8FC7\u8BBE\u7F6E <code>mode</code> \u53EF\u4EE5\u6539\u53D8\u65F6\u95F4\u8F74\u548C\u5185\u5BB9\u7684\u76F8\u5BF9\u4F4D\u7F6E</td>
<td><code>left</code> | <code>alternate</code> | <code>right</code></td>
<td></td>
</tr>
<tr>
<td>pending</td>
<td>\u6307\u5B9A\u6700\u540E\u4E00\u4E2A\u5E7D\u7075\u8282\u70B9\u662F\u5426\u5B58\u5728\u6216\u5185\u5BB9</td>
<td>boolean|string|slot</td>
<td>false</td>
</tr>
<tr>
<td>pendingDot</td>
<td>\u5F53\u6700\u540E\u4E00\u4E2A\u5E7D\u7075\u8282\u70B9\u5B58\u5728\u6642\uFF0C\u6307\u5B9A\u5176\u65F6\u95F4\u56FE\u70B9</td>
<td>string|slot</td>
<td><code>&lt;LoadingOutlined /&gt;</code></td>
</tr>
<tr>
<td>reverse</td>
<td>\u8282\u70B9\u6392\u5E8F</td>
<td>boolean</td>
<td>false</td>
</tr>
</tbody>
</table>
<h3 id="Timeline-Item">Timeline.Item <a class="header-anchor" href="#Timeline-Item">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<p>\u65F6\u95F4\u8F74\u7684\u6BCF\u4E00\u4E2A\u8282\u70B9\u3002</p>
<table>
<thead>
<tr>
<th>\u53C2\u6570</th>
<th>\u8BF4\u660E</th>
<th>\u7C7B\u578B</th>
<th>\u9ED8\u8BA4\u503C</th>
<th>\u7248\u672C</th>
</tr>
</thead>
<tbody>
<tr>
<td>color</td>
<td>\u6307\u5B9A\u5706\u5708\u989C\u8272 <code>blue, red, green</code>\uFF0C\u6216\u81EA\u5B9A\u4E49\u7684\u8272\u503C</td>
<td>string</td>
<td>blue</td>
<td></td>
</tr>
<tr>
<td>dot</td>
<td>\u81EA\u5B9A\u4E49\u65F6\u95F4\u8F74\u70B9</td>
<td>string|slot</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>label</td>
<td>\u8BBE\u7F6E\u6807\u7B7E</td>
<td>string | slot</td>
<td>-</td>
<td>3.0</td>
</tr>
<tr>
<td>position</td>
<td>\u81EA\u5B9A\u4E49\u8282\u70B9\u4F4D\u7F6E</td>
<td><code>left</code> | <code>right</code></td>
<td>-</td>
<td></td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060301431}},H={class:"markdown"};function M(p,a,c,g,d,b){return m(),W("article",H,a[0]||(a[0]=[Z(`<p>\u5782\u76F4\u5C55\u793A\u7684\u65F6\u95F4\u6D41\u4FE1\u606F\u3002</p><h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528 <a class="header-anchor" href="#\u4F55\u65F6\u4F7F\u7528"><span aria-hidden="true" class="anchor">#</span></a></h2><ul><li>\u5F53\u6709\u4E00\u7CFB\u5217\u4FE1\u606F\u9700\u6309\u65F6\u95F4\u6392\u5217\u65F6\uFF0C\u53EF\u6B63\u5E8F\u548C\u5012\u5E8F\u3002</li><li>\u9700\u8981\u6709\u4E00\u6761\u65F6\u95F4\u8F74\u8FDB\u884C\u89C6\u89C9\u4E0A\u7684\u4E32\u8054\u65F6\u3002</li></ul><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>\u521B\u5EFA\u670D\u52A1\u73B0\u573A 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>\u521D\u6B65\u6392\u9664\u7F51\u7EDC\u5F02\u5E38 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>\u6280\u672F\u6D4B\u8BD5\u5F02\u5E38 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>\u7F51\u7EDC\u5F02\u5E38\u6B63\u5728\u4FEE\u590D 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline</span><span class="token punctuation">&gt;</span></span>
</code></pre><h3 id="Timeline">Timeline <a class="header-anchor" href="#Timeline"><span aria-hidden="true" class="anchor">#</span></a></h3><p>\u65F6\u95F4\u8F74\u3002</p><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th></tr></thead><tbody><tr><td>mode</td><td>\u901A\u8FC7\u8BBE\u7F6E <code>mode</code> \u53EF\u4EE5\u6539\u53D8\u65F6\u95F4\u8F74\u548C\u5185\u5BB9\u7684\u76F8\u5BF9\u4F4D\u7F6E</td><td><code>left</code> | <code>alternate</code> | <code>right</code></td><td></td></tr><tr><td>pending</td><td>\u6307\u5B9A\u6700\u540E\u4E00\u4E2A\u5E7D\u7075\u8282\u70B9\u662F\u5426\u5B58\u5728\u6216\u5185\u5BB9</td><td>boolean|string|slot</td><td>false</td></tr><tr><td>pendingDot</td><td>\u5F53\u6700\u540E\u4E00\u4E2A\u5E7D\u7075\u8282\u70B9\u5B58\u5728\u6642\uFF0C\u6307\u5B9A\u5176\u65F6\u95F4\u56FE\u70B9</td><td>string|slot</td><td><code>&lt;LoadingOutlined /&gt;</code></td></tr><tr><td>reverse</td><td>\u8282\u70B9\u6392\u5E8F</td><td>boolean</td><td>false</td></tr></tbody></table><h3 id="Timeline-Item">Timeline.Item <a class="header-anchor" href="#Timeline-Item"><span aria-hidden="true" class="anchor">#</span></a></h3><p>\u65F6\u95F4\u8F74\u7684\u6BCF\u4E00\u4E2A\u8282\u70B9\u3002</p><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th><th>\u7248\u672C</th></tr></thead><tbody><tr><td>color</td><td>\u6307\u5B9A\u5706\u5708\u989C\u8272 <code>blue, red, green</code>\uFF0C\u6216\u81EA\u5B9A\u4E49\u7684\u8272\u503C</td><td>string</td><td>blue</td><td></td></tr><tr><td>dot</td><td>\u81EA\u5B9A\u4E49\u65F6\u95F4\u8F74\u70B9</td><td>string|slot</td><td>-</td><td></td></tr><tr><td>label</td><td>\u8BBE\u7F6E\u6807\u7B7E</td><td>string | slot</td><td>-</td><td>3.0</td></tr><tr><td>position</td><td>\u81EA\u5B9A\u4E49\u8282\u70B9\u4F4D\u7F6E</td><td><code>left</code> | <code>right</code></td><td>-</td><td></td></tr></tbody></table>`,11)]))}const J=r(z,[["render",M]]),K={pageData:{title:"Timeline",description:"",frontmatter:{category:"Components",type:"Data Display",title:"Timeline",cover:"https://gw.alipayobjects.com/zos/antfincdn/vJmo00mmgR/Timeline.svg"},headers:[{level:2,title:"When To Use",slug:"When-To-Use",content:""},{level:2,title:"API",slug:"API",content:""},{level:3,title:"Timeline",slug:"Timeline",content:"Timeline"},{level:3,title:"Timeline.Item",slug:"Timeline-Item",content:"Node of timeline"}],relativePath:"components/timeline/index.en-US.md",content:`
Vertical display timeline.

## When To Use

- When a series of information needs to be ordered by time (ascending or descending).
- When you need a timeline to make a visual connection.

## API

\`\`\`html
&lt;a-timeline&gt;
  &lt;a-timeline-item&gt;step1 2015-09-01&lt;/a-timeline-item&gt;
  &lt;a-timeline-item&gt;step2 2015-09-01&lt;/a-timeline-item&gt;
  &lt;a-timeline-item&gt;step3 2015-09-01&lt;/a-timeline-item&gt;
  &lt;a-timeline-item&gt;step4 2015-09-01&lt;/a-timeline-item&gt;
&lt;/a-timeline&gt;
\`\`\`

### Timeline

Timeline

| Property | Description | Type | Default |
| --- | --- | --- | --- |
| mode | By sending \`alternate\` the timeline will distribute the nodes to the left and right. | \`left\` \\| \`alternate\` \\| \`right\` | \`left\` |
| pending | Set the last ghost node&#39;s existence or its content | boolean\\|string\\|slot | \`false\` |
| pendingDot | Set the dot of the last ghost node when pending is true | string\\|slot | \`&lt;LoadingOutlined /&gt;\` |
| reverse | reverse nodes or not | boolean | false |

### Timeline.Item

Node of timeline

| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| color | Set the circle&#39;s color to \`blue\`, \`red\`, \`green\` or other custom colors | string | \`blue\` |  |
| dot | Customize timeline dot | string\\|slot | - |  |
| label | Set the label | string \\| slot | - | 3.0 |
| position | Customize node position | \`left\` \\| \`right\` | - |  |
`,html:`<p>Vertical display timeline.</p>
<h2 id="When-To-Use">When To Use <a class="header-anchor" href="#When-To-Use">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<ul>
<li>When a series of information needs to be ordered by time (ascending or descending).</li>
<li>When you need a timeline to make a visual connection.</li>
</ul>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline</span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">></span></span>step1 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">></span></span>step2 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">></span></span>step3 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">></span></span>step4 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline</span><span class="token punctuation">></span></span>
</code></pre>
<h3 id="Timeline">Timeline <a class="header-anchor" href="#Timeline">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<p>Timeline</p>
<table>
<thead>
<tr>
<th>Property</th>
<th>Description</th>
<th>Type</th>
<th>Default</th>
</tr>
</thead>
<tbody>
<tr>
<td>mode</td>
<td>By sending <code>alternate</code> the timeline will distribute the nodes to the left and right.</td>
<td><code>left</code> | <code>alternate</code> | <code>right</code></td>
<td><code>left</code></td>
</tr>
<tr>
<td>pending</td>
<td>Set the last ghost node's existence or its content</td>
<td>boolean|string|slot</td>
<td><code>false</code></td>
</tr>
<tr>
<td>pendingDot</td>
<td>Set the dot of the last ghost node when pending is true</td>
<td>string|slot</td>
<td><code>&lt;LoadingOutlined /&gt;</code></td>
</tr>
<tr>
<td>reverse</td>
<td>reverse nodes or not</td>
<td>boolean</td>
<td>false</td>
</tr>
</tbody>
</table>
<h3 id="Timeline-Item">Timeline.Item <a class="header-anchor" href="#Timeline-Item">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<p>Node of timeline</p>
<table>
<thead>
<tr>
<th>Property</th>
<th>Description</th>
<th>Type</th>
<th>Default</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>color</td>
<td>Set the circle's color to <code>blue</code>, <code>red</code>, <code>green</code> or other custom colors</td>
<td>string</td>
<td><code>blue</code></td>
<td></td>
</tr>
<tr>
<td>dot</td>
<td>Customize timeline dot</td>
<td>string|slot</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>label</td>
<td>Set the label</td>
<td>string | slot</td>
<td>-</td>
<td>3.0</td>
</tr>
<tr>
<td>position</td>
<td>Customize node position</td>
<td><code>left</code> | <code>right</code></td>
<td>-</td>
<td></td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060301430}},O={class:"markdown"};function Q(p,a,c,g,d,b){return m(),W("article",O,a[0]||(a[0]=[Z(`<p>Vertical display timeline.</p><h2 id="When-To-Use">When To Use <a class="header-anchor" href="#When-To-Use"><span aria-hidden="true" class="anchor">#</span></a></h2><ul><li>When a series of information needs to be ordered by time (ascending or descending).</li><li>When you need a timeline to make a visual connection.</li></ul><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>step1 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>step2 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>step3 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>step4 2015-09-01<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline-item</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-timeline</span><span class="token punctuation">&gt;</span></span>
</code></pre><h3 id="Timeline">Timeline <a class="header-anchor" href="#Timeline"><span aria-hidden="true" class="anchor">#</span></a></h3><p>Timeline</p><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th></tr></thead><tbody><tr><td>mode</td><td>By sending <code>alternate</code> the timeline will distribute the nodes to the left and right.</td><td><code>left</code> | <code>alternate</code> | <code>right</code></td><td><code>left</code></td></tr><tr><td>pending</td><td>Set the last ghost node&#39;s existence or its content</td><td>boolean|string|slot</td><td><code>false</code></td></tr><tr><td>pendingDot</td><td>Set the dot of the last ghost node when pending is true</td><td>string|slot</td><td><code>&lt;LoadingOutlined /&gt;</code></td></tr><tr><td>reverse</td><td>reverse nodes or not</td><td>boolean</td><td>false</td></tr></tbody></table><h3 id="Timeline-Item">Timeline.Item <a class="header-anchor" href="#Timeline-Item"><span aria-hidden="true" class="anchor">#</span></a></h3><p>Node of timeline</p><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th><th>Version</th></tr></thead><tbody><tr><td>color</td><td>Set the circle&#39;s color to <code>blue</code>, <code>red</code>, <code>green</code> or other custom colors</td><td>string</td><td><code>blue</code></td><td></td></tr><tr><td>dot</td><td>Customize timeline dot</td><td>string|slot</td><td>-</td><td></td></tr><tr><td>label</td><td>Set the label</td><td>string | slot</td><td>-</td><td>3.0</td></tr><tr><td>position</td><td>Customize node position</td><td><code>left</code> | <code>right</code></td><td>-</td><td></td></tr></tbody></table>`,11)]))}const q=r(K,[["render",Q]]),$=I({CN:J,US:q,components:{Basic:X,Color:D,Pending:T,Custom:U,Alternate:E,Right:j},setup(){return{}}});function nn(p,a,c,g,d,b){const o=l("basic"),u=l("color"),i=l("pending"),k=l("custom"),G=l("alternate"),A=l("right"),v=l("demo-sort");return m(),C(v,null,{default:s(()=>[e(o),e(u),e(i),e(k),e(G),e(A)]),_:1})}const sn=r($,[["render",nn]]);export{sn as default};