index.98c24f73.js 154 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131
  1. import{d as I,r as b,_ as g,j as o,k as h,l as v,w as e,f as c,b as n,e as t,t as j,E as C,y,a as w,q as Z}from"./index.3fe853a6.js";import{S}from"./SmileOutlined.02787c93.js";const X=I({setup(){return{value:b()}}});function V(s,a,i,d,m,r){const p=o("a-time-picker"),u=o("a-space"),k=o("demo-box");return h(),v(k,{jsfiddle:{us:"TimePicker of 12 hours format, with default format `h:mm:ss a`.",cn:"12 \u5C0F\u65F6\u5236\u7684\u65F6\u95F4\u9009\u62E9\u5668\uFF0C\u9ED8\u8BA4\u7684 format \u4E3A `h:mm:ss a`\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
  2. <span aria-hidden="true" class="anchor">#</span>
  3. </a></h2>
  4. <p>12 \u5C0F\u65F6\u5236\u7684\u65F6\u95F4\u9009\u62E9\u5668\uFF0C\u9ED8\u8BA4\u7684 format \u4E3A <code>h:mm:ss a</code>\u3002</p>
  5. <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
  6. <span aria-hidden="true" class="anchor">#</span>
  7. </a></h2>
  8. <p>TimePicker of 12 hours format, with default format <code>h:mm:ss a</code>.</p>
  9. `,order:2,title:{"zh-CN":"12 \u5C0F\u65F6\u5236","en-US":"12 hours"},relativePath:"components/time-picker/demo/12hours.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdGltZS1waWNrZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUiIHVzZTEyLWhvdXJzIC8+CiAgICA8YS10aW1lLXBpY2tlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIgdXNlMTItaG91cnMgZm9ybWF0PSJoOm1tOnNzIEEiIHN0eWxlPSJ3aWR0aDogMTQwcHgiIC8+CiAgICA8YS10aW1lLXBpY2tlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIgdXNlMTItaG91cnMgZm9ybWF0PSJoOm1tIGEiIC8+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgRGF5anMgfSBmcm9tICdkYXlqcyc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlOiByZWY8RGF5anM+KCksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdGltZS1waWNrZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUiIHVzZTEyLWhvdXJzIC8+CiAgICA8YS10aW1lLXBpY2tlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIgdXNlMTItaG91cnMgZm9ybWF0PSJoOm1tOnNzIEEiIHN0eWxlPSJ3aWR0aDogMTQwcHgiIC8+CiAgICA8YS10aW1lLXBpY2tlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIgdXNlMTItaG91cnMgZm9ybWF0PSJoOm1tIGEiIC8+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICB2YWx1ZTogcmVmKCksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:e(()=>[c(u,{direction:"vertical"},{default:e(()=>[c(p,{value:s.value,"onUpdate:value":a[0]||(a[0]=l=>s.value=l),"use12-hours":""},null,8,["value"]),c(p,{value:s.value,"onUpdate:value":a[1]||(a[1]=l=>s.value=l),"use12-hours":"",format:"h:mm:ss A",style:{width:"140px"}},null,8,["value"]),c(p,{value:s.value,"onUpdate:value":a[2]||(a[2]=l=>s.value=l),"use12-hours":"",format:"h:mm a"},null,8,["value"])]),_:1})]),htmlCode:e(()=>a[3]||(a[3]=[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(`
  10. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  11. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"use12-hours"),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  12. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"use12-hours"),t(),n("span",{class:"token attr-name"},"format"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("h:mm:ss A"),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"},"width"),n("span",{class:"token punctuation"},":"),t(" 140px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  13. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"use12-hours"),t(),n("span",{class:"token attr-name"},"format"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("h:mm a"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  14. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
  15. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  16. `),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(`
  17. `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Dayjs "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  18. `),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(`
  19. `),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(`
  20. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  21. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  22. `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" ref"),n("span",{class:"token operator"},"<"),t("Dayjs"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
  23. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  24. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  25. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  26. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  27. `)])],-1)])),jsVersionHtml:e(()=>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(`
  28. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  29. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"use12-hours"),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  30. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"use12-hours"),t(),n("span",{class:"token attr-name"},"format"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("h:mm:ss A"),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"},"width"),n("span",{class:"token punctuation"},":"),t(" 140px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  31. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"use12-hours"),t(),n("span",{class:"token attr-name"},"format"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("h:mm a"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  32. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
  33. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  34. `),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(`
  35. `),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(`
  36. `),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(`
  37. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  38. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  39. `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
  40. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  41. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  42. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  43. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  44. `)])],-1)])),_:1})}const R=g(X,[["render",V]]),F=I({setup(){const s=b(!1),a=b(!1);return{value:b(),open:s,open2:a,handleOpenChange:r=>{console.log("open",r),s.value=r},handleClose:()=>{s.value=!1,a.value=!1}}}});function N(s,a,i,d,m,r){const p=o("a-button"),u=o("a-time-picker"),k=o("a-space"),l=o("demo-box");return h(),v(l,{jsfiddle:{us:"Render addon contents to timepicker panel's bottom.",cn:"\u5728 TimePicker \u9009\u62E9\u6846\u5E95\u90E8\u663E\u793A\u81EA\u5B9A\u4E49\u7684\u5185\u5BB9\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
  45. <span aria-hidden="true" class="anchor">#</span>
  46. </a></h2>
  47. <p>\u5728 TimePicker \u9009\u62E9\u6846\u5E95\u90E8\u663E\u793A\u81EA\u5B9A\u4E49\u7684\u5185\u5BB9\u3002</p>
  48. <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
  49. <span aria-hidden="true" class="anchor">#</span>
  50. </a></h2>
  51. <p>Render addon contents to timepicker panel's bottom.</p>
  52. `,order:1,title:{"zh-CN":"\u9644\u52A0\u5185\u5BB9","en-US":"Addon"},relativePath:"components/time-picker/demo/addon.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdGltZS1waWNrZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUiIHYtbW9kZWw6b3Blbj0ib3BlbiIgQG9wZW5DaGFuZ2U9ImhhbmRsZU9wZW5DaGFuZ2UiPgogICAgICA8dGVtcGxhdGUgI3JlbmRlckV4dHJhRm9vdGVyPSJ7IHByZWZpeENscyB9Ij4KICAgICAgICA8YS1idXR0b24gc2l6ZT0ic21hbGwiIHR5cGU9InByaW1hcnkiIEBjbGljaz0iaGFuZGxlQ2xvc2UiPk9LIHt7IHByZWZpeENscyB9fTwvYS1idXR0b24+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2EtdGltZS1waWNrZXI+CiAgICA8YS10aW1lLXBpY2tlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIgdi1tb2RlbDpvcGVuPSJvcGVuMiI+CiAgICAgIDx0ZW1wbGF0ZSAjcmVuZGVyRXh0cmFGb290ZXI+CiAgICAgICAgPGEtYnV0dG9uIHNpemU9InNtYWxsIiB0eXBlPSJwcmltYXJ5IiBAY2xpY2s9ImhhbmRsZUNsb3NlIj5PSzwvYS1idXR0b24+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2EtdGltZS1waWNrZXI+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgRGF5anMgfSBmcm9tICdkYXlqcyc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKCmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBvcGVuID0gcmVmKGZhbHNlKTsKICAgIGNvbnN0IG9wZW4yID0gcmVmKGZhbHNlKTsKICAgIGNvbnN0IHZhbHVlID0gcmVmPERheWpzPigpOwoKICAgIGNvbnN0IGhhbmRsZU9wZW5DaGFuZ2UgPSAob3BlblN0YXR1czogYm9vbGVhbikgPT4gewogICAgICBjb25zb2xlLmxvZygnb3BlbicsIG9wZW5TdGF0dXMpOwogICAgICBvcGVuLnZhbHVlID0gb3BlblN0YXR1czsKICAgIH07CgogICAgY29uc3QgaGFuZGxlQ2xvc2UgPSAoKSA9PiB7CiAgICAgIG9wZW4udmFsdWUgPSBmYWxzZTsKICAgICAgb3BlbjIudmFsdWUgPSBmYWxzZTsKICAgIH07CgogICAgcmV0dXJuIHsKICAgICAgdmFsdWUsCiAgICAgIG9wZW4sCiAgICAgIG9wZW4yLAogICAgICBoYW5kbGVPcGVuQ2hhbmdlLAogICAgICBoYW5kbGVDbG9zZSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdGltZS1waWNrZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUiIHYtbW9kZWw6b3Blbj0ib3BlbiIgQG9wZW5DaGFuZ2U9ImhhbmRsZU9wZW5DaGFuZ2UiPgogICAgICA8dGVtcGxhdGUgI3JlbmRlckV4dHJhRm9vdGVyPSJ7IHByZWZpeENscyB9Ij4KICAgICAgICA8YS1idXR0b24gc2l6ZT0ic21hbGwiIHR5cGU9InByaW1hcnkiIEBjbGljaz0iaGFuZGxlQ2xvc2UiPk9LIHt7IHByZWZpeENscyB9fTwvYS1idXR0b24+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2EtdGltZS1waWNrZXI+CiAgICA8YS10aW1lLXBpY2tlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIgdi1tb2RlbDpvcGVuPSJvcGVuMiI+CiAgICAgIDx0ZW1wbGF0ZSAjcmVuZGVyRXh0cmFGb290ZXI+CiAgICAgICAgPGEtYnV0dG9uIHNpemU9InNtYWxsIiB0eXBlPSJwcmltYXJ5IiBAY2xpY2s9ImhhbmRsZUNsb3NlIj5PSzwvYS1idXR0b24+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2EtdGltZS1waWNrZXI+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBvcGVuID0gcmVmKGZhbHNlKTsKICAgIGNvbnN0IG9wZW4yID0gcmVmKGZhbHNlKTsKICAgIGNvbnN0IHZhbHVlID0gcmVmKCk7CiAgICBjb25zdCBoYW5kbGVPcGVuQ2hhbmdlID0gb3BlblN0YXR1cyA9PiB7CiAgICAgIGNvbnNvbGUubG9nKCdvcGVuJywgb3BlblN0YXR1cyk7CiAgICAgIG9wZW4udmFsdWUgPSBvcGVuU3RhdHVzOwogICAgfTsKICAgIGNvbnN0IGhhbmRsZUNsb3NlID0gKCkgPT4gewogICAgICBvcGVuLnZhbHVlID0gZmFsc2U7CiAgICAgIG9wZW4yLnZhbHVlID0gZmFsc2U7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgdmFsdWUsCiAgICAgIG9wZW4sCiAgICAgIG9wZW4yLAogICAgICBoYW5kbGVPcGVuQ2hhbmdlLAogICAgICBoYW5kbGVDbG9zZSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:e(()=>[c(k,{direction:"vertical"},{default:e(()=>[c(u,{value:s.value,"onUpdate:value":a[0]||(a[0]=f=>s.value=f),open:s.open,"onUpdate:open":a[1]||(a[1]=f=>s.open=f),onOpenChange:s.handleOpenChange},{renderExtraFooter:e(({prefixCls:f})=>[c(p,{size:"small",type:"primary",onClick:s.handleClose},{default:e(()=>[t("OK "+j(f),1)]),_:2},1032,["onClick"])]),_:1},8,["value","open","onOpenChange"]),c(u,{value:s.value,"onUpdate:value":a[2]||(a[2]=f=>s.value=f),open:s.open2,"onUpdate:open":a[3]||(a[3]=f=>s.open2=f)},{renderExtraFooter:e(()=>[c(p,{size:"small",type:"primary",onClick:s.handleClose},{default:e(()=>a[4]||(a[4]=[t("OK")])),_:1,__:[4]},8,["onClick"])]),_:1},8,["value","open"])]),_:1})]),htmlCode:e(()=>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(`
  53. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  54. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("open")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("open"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"@openChange"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOpenChange"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  55. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#renderExtraFooter"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ prefixCls }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  56. `),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"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("small"),n("span",{class:"token punctuation"},'"')]),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 attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleClose"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("OK {{ prefixCls }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
  57. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  58. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-time-picker")]),n("span",{class:"token punctuation"},">")]),t(`
  59. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("open")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("open2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  60. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#renderExtraFooter"),n("span",{class:"token punctuation"},">")]),t(`
  61. `),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"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("small"),n("span",{class:"token punctuation"},'"')]),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 attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleClose"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("OK"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
  62. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  63. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-time-picker")]),n("span",{class:"token punctuation"},">")]),t(`
  64. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
  65. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  66. `),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(`
  67. `),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Dayjs "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  68. `),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(`
  69. `),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(`
  70. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  71. `),n("span",{class:"token keyword"},"const"),t(" open "),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(`
  72. `),n("span",{class:"token keyword"},"const"),t(" open2 "),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(`
  73. `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("Dayjs"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  74. `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOpenChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"openStatus"),n("span",{class:"token operator"},":"),t(" boolean")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
  75. console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'open'"),n("span",{class:"token punctuation"},","),t(" openStatus"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  76. open`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" openStatus"),n("span",{class:"token punctuation"},";"),t(`
  77. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  78. `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleClose"),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(`
  79. open`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(`
  80. open2`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(`
  81. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  82. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  83. value`),n("span",{class:"token punctuation"},","),t(`
  84. open`),n("span",{class:"token punctuation"},","),t(`
  85. open2`),n("span",{class:"token punctuation"},","),t(`
  86. handleOpenChange`),n("span",{class:"token punctuation"},","),t(`
  87. handleClose`),n("span",{class:"token punctuation"},","),t(`
  88. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  89. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  90. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  91. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  92. `)])],-1)])),jsVersionHtml:e(()=>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(`
  93. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  94. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("open")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("open"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"@openChange"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleOpenChange"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  95. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#renderExtraFooter"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ prefixCls }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  96. `),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"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("small"),n("span",{class:"token punctuation"},'"')]),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 attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleClose"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("OK {{ prefixCls }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
  97. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  98. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-time-picker")]),n("span",{class:"token punctuation"},">")]),t(`
  99. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("open")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("open2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  100. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#renderExtraFooter"),n("span",{class:"token punctuation"},">")]),t(`
  101. `),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"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("small"),n("span",{class:"token punctuation"},'"')]),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 attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("handleClose"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("OK"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
  102. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  103. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-time-picker")]),n("span",{class:"token punctuation"},">")]),t(`
  104. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
  105. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  106. `),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(`
  107. `),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(`
  108. `),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(`
  109. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  110. `),n("span",{class:"token keyword"},"const"),t(" open "),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(`
  111. `),n("span",{class:"token keyword"},"const"),t(" open2 "),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(`
  112. `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  113. `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleOpenChange"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"openStatus"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
  114. console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'open'"),n("span",{class:"token punctuation"},","),t(" openStatus"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  115. open`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" openStatus"),n("span",{class:"token punctuation"},";"),t(`
  116. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  117. `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleClose"),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(`
  118. open`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(`
  119. open2`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(`
  120. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  121. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  122. value`),n("span",{class:"token punctuation"},","),t(`
  123. open`),n("span",{class:"token punctuation"},","),t(`
  124. open2`),n("span",{class:"token punctuation"},","),t(`
  125. handleOpenChange`),n("span",{class:"token punctuation"},","),t(`
  126. handleClose`),n("span",{class:"token punctuation"},","),t(`
  127. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  128. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  129. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  130. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  131. `)])],-1)])),_:1})}const D=g(F,[["render",N]]),x=I({setup(){const s=b(C("08:00:00","HH:mm:ss")),a=b("09:00:00");return y(s,()=>{console.log(s.value)}),y(a,()=>{console.log(a.value)}),{value:s,strValue:a}}});function Y(s,a,i,d,m,r){const p=o("a-time-picker"),u=o("a-space"),k=o("demo-box");return h(),v(k,{jsfiddle:{us:"Click `TimePicker`, and then we could select or input a time in panel.",cn:"\u70B9\u51FB TimePicker\uFF0C\u7136\u540E\u53EF\u4EE5\u5728\u6D6E\u5C42\u4E2D\u9009\u62E9\u6216\u8005\u8F93\u5165\u67D0\u4E00\u65F6\u95F4\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
  132. <span aria-hidden="true" class="anchor">#</span>
  133. </a></h2>
  134. <p>\u70B9\u51FB TimePicker\uFF0C\u7136\u540E\u53EF\u4EE5\u5728\u6D6E\u5C42\u4E2D\u9009\u62E9\u6216\u8005\u8F93\u5165\u67D0\u4E00\u65F6\u95F4\u3002</p>
  135. <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
  136. <span aria-hidden="true" class="anchor">#</span>
  137. </a></h2>
  138. <p>Click <code>TimePicker</code>, and then we could select or input a time in panel.</p>
  139. `,order:0,title:{"zh-CN":"\u57FA\u672C","en-US":"Basic"},relativePath:"components/time-picker/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdGltZS1waWNrZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUiIC8+CiAgICA8YS10aW1lLXBpY2tlciB2LW1vZGVsOnZhbHVlPSJzdHJWYWx1ZSIgdmFsdWUtZm9ybWF0PSJISDptbTpzcyIgLz4KICA8L2Etc3BhY2U+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgZGF5anMsIHsgRGF5anMgfSBmcm9tICdkYXlqcyc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmLCB3YXRjaCB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZSA9IHJlZjxEYXlqcz4oZGF5anMoJzA4OjAwOjAwJywgJ0hIOm1tOnNzJykpOwogICAgY29uc3Qgc3RyVmFsdWUgPSByZWY8c3RyaW5nPignMDk6MDA6MDAnKTsKCiAgICB3YXRjaCh2YWx1ZSwgKCkgPT4gewogICAgICBjb25zb2xlLmxvZyh2YWx1ZS52YWx1ZSk7CiAgICB9KTsKICAgIHdhdGNoKHN0clZhbHVlLCAoKSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKHN0clZhbHVlLnZhbHVlKTsKICAgIH0pOwogICAgcmV0dXJuIHsKICAgICAgdmFsdWUsCiAgICAgIHN0clZhbHVlLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdGltZS1waWNrZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUiIC8+CiAgICA8YS10aW1lLXBpY2tlciB2LW1vZGVsOnZhbHVlPSJzdHJWYWx1ZSIgdmFsdWUtZm9ybWF0PSJISDptbTpzcyIgLz4KICA8L2Etc3BhY2U+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCBkYXlqcyBmcm9tICdkYXlqcyc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmLCB3YXRjaCB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZSA9IHJlZihkYXlqcygnMDg6MDA6MDAnLCAnSEg6bW06c3MnKSk7CiAgICBjb25zdCBzdHJWYWx1ZSA9IHJlZignMDk6MDA6MDAnKTsKICAgIHdhdGNoKHZhbHVlLCAoKSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKHZhbHVlLnZhbHVlKTsKICAgIH0pOwogICAgd2F0Y2goc3RyVmFsdWUsICgpID0+IHsKICAgICAgY29uc29sZS5sb2coc3RyVmFsdWUudmFsdWUpOwogICAgfSk7CiAgICByZXR1cm4gewogICAgICB2YWx1ZSwKICAgICAgc3RyVmFsdWUsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:e(()=>[c(u,{direction:"vertical"},{default:e(()=>[c(p,{value:s.value,"onUpdate:value":a[0]||(a[0]=l=>s.value=l)},null,8,["value"]),c(p,{value:s.strValue,"onUpdate:value":a[1]||(a[1]=l=>s.strValue=l),"value-format":"HH:mm:ss"},null,8,["value"])]),_:1})]),htmlCode:e(()=>a[2]||(a[2]=[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(`
  140. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  141. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  142. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("strValue"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"value-format"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("HH:mm:ss"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  143. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
  144. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  145. `),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(`
  146. `),n("span",{class:"token keyword"},"import"),t(" dayjs"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"{"),t(" Dayjs "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  147. `),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(" watch "),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(`
  148. `),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(`
  149. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  150. `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("Dayjs"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token function"},"dayjs"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'08:00:00'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'HH:mm:ss'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  151. `),n("span",{class:"token keyword"},"const"),t(" strValue "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'09:00:00'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  152. `),n("span",{class:"token function"},"watch"),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 operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
  153. console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  154. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  155. `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t("strValue"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
  156. console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("strValue"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  157. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  158. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  159. value`),n("span",{class:"token punctuation"},","),t(`
  160. strValue`),n("span",{class:"token punctuation"},","),t(`
  161. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  162. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  163. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  164. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  165. `)])],-1)])),jsVersionHtml:e(()=>a[3]||(a[3]=[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(`
  166. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  167. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  168. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("strValue"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"value-format"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("HH:mm:ss"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  169. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
  170. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  171. `),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(`
  172. `),n("span",{class:"token keyword"},"import"),t(" dayjs "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  173. `),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(" watch "),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(`
  174. `),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(`
  175. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  176. `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token function"},"dayjs"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'08:00:00'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'HH:mm:ss'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  177. `),n("span",{class:"token keyword"},"const"),t(" strValue "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'09:00:00'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  178. `),n("span",{class:"token function"},"watch"),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 operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
  179. console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  180. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  181. `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t("strValue"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
  182. console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("strValue"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  183. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  184. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  185. value`),n("span",{class:"token punctuation"},","),t(`
  186. strValue`),n("span",{class:"token punctuation"},","),t(`
  187. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  188. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  189. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  190. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  191. `)])],-1)])),_:1})}const U=g(x,[["render",Y]]),z=I({setup(){return{dayjs:C}}});function T(s,a,i,d,m,r){const p=o("a-time-picker"),u=o("demo-box");return h(),v(u,{jsfiddle:{us:"A disabled state of the `TimePicker`.",cn:"\u7981\u7528\u65F6\u95F4\u9009\u62E9\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
  192. <span aria-hidden="true" class="anchor">#</span>
  193. </a></h2>
  194. <p>\u7981\u7528\u65F6\u95F4\u9009\u62E9\u3002</p>
  195. <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
  196. <span aria-hidden="true" class="anchor">#</span>
  197. </a></h2>
  198. <p>A disabled state of the <code>TimePicker</code>.</p>
  199. `,order:3,title:{"zh-CN":"\u7981\u7528","en-US":"Disabled"},relativePath:"components/time-picker/demo/disabled.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWUtcGlja2VyIDp2YWx1ZT0iZGF5anMoJzEyOjA4OjIzJywgJ0hIOm1tOnNzJykiIGRpc2FibGVkIC8+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgZGF5anMgZnJvbSAnZGF5anMnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgcmV0dXJuIHsKICAgICAgZGF5anMsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWUtcGlja2VyIDp2YWx1ZT0iZGF5anMoJzEyOjA4OjIzJywgJ0hIOm1tOnNzJykiIGRpc2FibGVkIC8+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCBkYXlqcyBmcm9tICdkYXlqcyc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICBkYXlqcywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:e(()=>[c(p,{value:s.dayjs("12:08:23","HH:mm:ss"),disabled:""},null,8,["value"])]),htmlCode:e(()=>a[0]||(a[0]=[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(`
  200. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("dayjs('12:08:23', 'HH:mm:ss')"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"disabled"),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  201. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  202. `),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(`
  203. `),n("span",{class:"token keyword"},"import"),t(" dayjs "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  204. `),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(`
  205. `),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(`
  206. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  207. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  208. dayjs`),n("span",{class:"token punctuation"},","),t(`
  209. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  210. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  211. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  212. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  213. `)])],-1)])),jsVersionHtml:e(()=>a[1]||(a[1]=[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(`
  214. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("dayjs('12:08:23', 'HH:mm:ss')"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"disabled"),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  215. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  216. `),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(`
  217. `),n("span",{class:"token keyword"},"import"),t(" dayjs "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  218. `),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(`
  219. `),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(`
  220. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  221. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  222. dayjs`),n("span",{class:"token punctuation"},","),t(`
  223. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  224. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  225. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  226. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  227. `)])],-1)])),_:1})}const E=g(z,[["render",T]]),J=I({setup(){return{value:b(C("12:08","HH:mm")),dayjs:C}}});function K(s,a,i,d,m,r){const p=o("a-time-picker"),u=o("demo-box");return h(),v(u,{jsfiddle:{us:"While part of `format` is omitted, the corresponding column in panel will disappear, too.",cn:"TimePicker \u6D6E\u5C42\u4E2D\u7684\u5217\u4F1A\u968F\u7740 `format` \u53D8\u5316\uFF0C\u5F53\u7565\u53BB `format` \u4E2D\u7684\u67D0\u90E8\u5206\u65F6\uFF0C\u6D6E\u5C42\u4E2D\u5BF9\u5E94\u7684\u5217\u4E5F\u4F1A\u6D88\u5931\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
  228. <span aria-hidden="true" class="anchor">#</span>
  229. </a></h2>
  230. <p>TimePicker \u6D6E\u5C42\u4E2D\u7684\u5217\u4F1A\u968F\u7740 <code>format</code> \u53D8\u5316\uFF0C\u5F53\u7565\u53BB <code>format</code> \u4E2D\u7684\u67D0\u90E8\u5206\u65F6\uFF0C\u6D6E\u5C42\u4E2D\u5BF9\u5E94\u7684\u5217\u4E5F\u4F1A\u6D88\u5931\u3002</p>
  231. <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
  232. <span aria-hidden="true" class="anchor">#</span>
  233. </a></h2>
  234. <p>While part of <code>format</code> is omitted, the corresponding column in panel will disappear, too.</p>
  235. `,order:4,title:{"zh-CN":"\u9009\u62E9\u65F6\u5206","en-US":"Hour and minute"},relativePath:"components/time-picker/demo/hide-column.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWUtcGlja2VyIHYtbW9kZWw6dmFsdWU9InZhbHVlIiBmb3JtYXQ9IkhIOm1tIiAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IGRheWpzIGZyb20gJ2RheWpzJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUgPSByZWYoZGF5anMoJzEyOjA4JywgJ0hIOm1tJykpOwoKICAgIHJldHVybiB7CiAgICAgIHZhbHVlLAogICAgICBkYXlqcywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWUtcGlja2VyIHYtbW9kZWw6dmFsdWU9InZhbHVlIiBmb3JtYXQ9IkhIOm1tIiAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgZGF5anMgZnJvbSAnZGF5anMnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZSA9IHJlZihkYXlqcygnMTI6MDgnLCAnSEg6bW0nKSk7CiAgICByZXR1cm4gewogICAgICB2YWx1ZSwKICAgICAgZGF5anMsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:e(()=>[c(p,{value:s.value,"onUpdate:value":a[0]||(a[0]=k=>s.value=k),format:"HH:mm"},null,8,["value"])]),htmlCode:e(()=>a[1]||(a[1]=[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(`
  236. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"format"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("HH:mm"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  237. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  238. `),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(`
  239. `),n("span",{class:"token keyword"},"import"),t(" dayjs "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  240. `),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(`
  241. `),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(`
  242. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  243. `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token function"},"dayjs"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'12:08'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'HH:mm'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  244. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  245. value`),n("span",{class:"token punctuation"},","),t(`
  246. dayjs`),n("span",{class:"token punctuation"},","),t(`
  247. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  248. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  249. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  250. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  251. `)])],-1)])),jsVersionHtml:e(()=>a[2]||(a[2]=[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(`
  252. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"format"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("HH:mm"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  253. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  254. `),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(`
  255. `),n("span",{class:"token keyword"},"import"),t(" dayjs "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  256. `),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(`
  257. `),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(`
  258. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  259. `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token function"},"dayjs"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'12:08'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'HH:mm'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  260. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  261. value`),n("span",{class:"token punctuation"},","),t(`
  262. dayjs`),n("span",{class:"token punctuation"},","),t(`
  263. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  264. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  265. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  266. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  267. `)])],-1)])),_:1})}const _=g(J,[["render",K]]),L=I({setup(){return{value:b()}}});function O(s,a,i,d,m,r){const p=o("a-time-picker"),u=o("demo-box");return h(),v(u,{jsfiddle:{us:"Show stepped options by `hourStep` `minuteStep` `secondStep`.",cn:"\u53EF\u4EE5\u4F7F\u7528 `hourStep` `minuteStep` `secondStep` \u6309\u6B65\u957F\u5C55\u793A\u53EF\u9009\u7684\u65F6\u5206\u79D2\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
  268. <span aria-hidden="true" class="anchor">#</span>
  269. </a></h2>
  270. <p>\u53EF\u4EE5\u4F7F\u7528 <code>hourStep</code> <code>minuteStep</code> <code>secondStep</code> \u6309\u6B65\u957F\u5C55\u793A\u53EF\u9009\u7684\u65F6\u5206\u79D2\u3002</p>
  271. <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
  272. <span aria-hidden="true" class="anchor">#</span>
  273. </a></h2>
  274. <p>Show stepped options by <code>hourStep</code> <code>minuteStep</code> <code>secondStep</code>.</p>
  275. `,order:5,title:{"zh-CN":"\u6B65\u957F\u9009\u9879","en-US":"Interval option"},relativePath:"components/time-picker/demo/interval-options.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWUtcGlja2VyIHYtbW9kZWw6dmFsdWU9InZhbHVlIiA6bWludXRlLXN0ZXA9IjE1IiA6c2Vjb25kLXN0ZXA9IjEwIiAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUgPSByZWYoKTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWUtcGlja2VyIHYtbW9kZWw6dmFsdWU9InZhbHVlIiA6bWludXRlLXN0ZXA9IjE1IiA6c2Vjb25kLXN0ZXA9IjEwIiAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZSA9IHJlZigpOwogICAgcmV0dXJuIHsKICAgICAgdmFsdWUsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:e(()=>[c(p,{value:s.value,"onUpdate:value":a[0]||(a[0]=k=>s.value=k),"minute-step":15,"second-step":10},null,8,["value"])]),htmlCode:e(()=>a[1]||(a[1]=[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(`
  276. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":minute-step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("15"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":second-step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("10"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  277. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  278. `),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(`
  279. `),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(`
  280. `),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(`
  281. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  282. `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  283. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  284. value`),n("span",{class:"token punctuation"},","),t(`
  285. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  286. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  287. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  288. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  289. `)])],-1)])),jsVersionHtml:e(()=>a[2]||(a[2]=[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(`
  290. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":minute-step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("15"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":second-step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("10"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  291. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  292. `),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(`
  293. `),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(`
  294. `),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(`
  295. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  296. `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  297. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  298. value`),n("span",{class:"token punctuation"},","),t(`
  299. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  300. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  301. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  302. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  303. `)])],-1)])),_:1})}const q=g(L,[["render",O]]),M=I({setup(){return{value1:b(C("12:08:23","HH:mm")),value2:b(C("12:08:23","HH:mm")),value3:b(C("12:08:23","HH:mm"))}}});function Q(s,a,i,d,m,r){const p=o("a-time-picker"),u=o("a-space"),k=o("demo-box");return h(),v(k,{jsfiddle:{us:"The input box comes in three sizes. large is used in the form, while the medium size is the default.",cn:"\u4E09\u79CD\u5927\u5C0F\u7684\u8F93\u5165\u6846\uFF0C\u5927\u7684\u7528\u5728\u8868\u5355\u4E2D\uFF0C\u4E2D\u7684\u4E3A\u9ED8\u8BA4\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
  304. <span aria-hidden="true" class="anchor">#</span>
  305. </a></h2>
  306. <p>\u4E09\u79CD\u5927\u5C0F\u7684\u8F93\u5165\u6846\uFF0C\u5927\u7684\u7528\u5728\u8868\u5355\u4E2D\uFF0C\u4E2D\u7684\u4E3A\u9ED8\u8BA4\u3002</p>
  307. <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
  308. <span aria-hidden="true" class="anchor">#</span>
  309. </a></h2>
  310. <p>The input box comes in three sizes. large is used in the form, while the medium size is the default.</p>
  311. `,order:6,title:{"zh-CN":"\u4E09\u79CD\u5927\u5C0F","en-US":"Three Sizes"},relativePath:"components/time-picker/demo/size.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdGltZS1waWNrZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIiBzaXplPSJsYXJnZSIgLz4KICAgIDxhLXRpbWUtcGlja2VyIHYtbW9kZWw6dmFsdWU9InZhbHVlMiIgLz4KICAgIDxhLXRpbWUtcGlja2VyIHYtbW9kZWw6dmFsdWU9InZhbHVlMyIgc2l6ZT0ic21hbGwiIC8+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IGRheWpzIGZyb20gJ2RheWpzJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwoKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlMTogcmVmKGRheWpzKCcxMjowODoyMycsICdISDptbScpKSwKICAgICAgdmFsdWUyOiByZWYoZGF5anMoJzEyOjA4OjIzJywgJ0hIOm1tJykpLAogICAgICB2YWx1ZTM6IHJlZihkYXlqcygnMTI6MDg6MjMnLCAnSEg6bW0nKSksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdGltZS1waWNrZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIiBzaXplPSJsYXJnZSIgLz4KICAgIDxhLXRpbWUtcGlja2VyIHYtbW9kZWw6dmFsdWU9InZhbHVlMiIgLz4KICAgIDxhLXRpbWUtcGlja2VyIHYtbW9kZWw6dmFsdWU9InZhbHVlMyIgc2l6ZT0ic21hbGwiIC8+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgZGF5anMgZnJvbSAnZGF5anMnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICB2YWx1ZTE6IHJlZihkYXlqcygnMTI6MDg6MjMnLCAnSEg6bW0nKSksCiAgICAgIHZhbHVlMjogcmVmKGRheWpzKCcxMjowODoyMycsICdISDptbScpKSwKICAgICAgdmFsdWUzOiByZWYoZGF5anMoJzEyOjA4OjIzJywgJ0hIOm1tJykpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:e(()=>[c(u,{direction:"vertical"},{default:e(()=>[c(p,{value:s.value1,"onUpdate:value":a[0]||(a[0]=l=>s.value1=l),size:"large"},null,8,["value"]),c(p,{value:s.value2,"onUpdate:value":a[1]||(a[1]=l=>s.value2=l)},null,8,["value"]),c(p,{value:s.value3,"onUpdate:value":a[2]||(a[2]=l=>s.value3=l),size:"small"},null,8,["value"])]),_:1})]),htmlCode:e(()=>a[3]||(a[3]=[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(`
  312. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  313. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("large"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  314. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  315. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value3"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("small"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  316. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
  317. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  318. `),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(`
  319. `),n("span",{class:"token keyword"},"import"),t(" dayjs "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  320. `),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(`
  321. `),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(`
  322. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  323. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  324. `),n("span",{class:"token literal-property property"},"value1"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token function"},"dayjs"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'12:08:23'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'HH:mm'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
  325. `),n("span",{class:"token literal-property property"},"value2"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token function"},"dayjs"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'12:08:23'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'HH:mm'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
  326. `),n("span",{class:"token literal-property property"},"value3"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token function"},"dayjs"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'12:08:23'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'HH:mm'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
  327. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  328. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  329. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  330. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  331. `)])],-1)])),jsVersionHtml:e(()=>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(`
  332. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  333. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("large"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  334. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  335. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value3"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("small"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  336. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
  337. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  338. `),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(`
  339. `),n("span",{class:"token keyword"},"import"),t(" dayjs "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  340. `),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(`
  341. `),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(`
  342. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  343. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  344. `),n("span",{class:"token literal-property property"},"value1"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token function"},"dayjs"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'12:08:23'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'HH:mm'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
  345. `),n("span",{class:"token literal-property property"},"value2"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token function"},"dayjs"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'12:08:23'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'HH:mm'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
  346. `),n("span",{class:"token literal-property property"},"value3"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token function"},"dayjs"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'12:08:23'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'HH:mm'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
  347. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  348. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  349. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  350. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  351. `)])],-1)])),_:1})}const $=g(M,[["render",Q]]),nn=I({components:{SmileOutlined:S},setup(){return{dayjs:C,value:b()}}});function tn(s,a,i,d,m,r){const p=o("smile-outlined"),u=o("a-time-picker"),k=o("demo-box");return h(),v(k,{jsfiddle:{us:"Click `TimePicker`, and then we could select or input a time in panel.",cn:"\u70B9\u51FB TimePicker\uFF0C\u7136\u540E\u53EF\u4EE5\u5728\u6D6E\u5C42\u4E2D\u9009\u62E9\u6216\u8005\u8F93\u5165\u67D0\u4E00\u65F6\u95F4\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
  352. <span aria-hidden="true" class="anchor">#</span>
  353. </a></h2>
  354. <p>\u70B9\u51FB TimePicker\uFF0C\u7136\u540E\u53EF\u4EE5\u5728\u6D6E\u5C42\u4E2D\u9009\u62E9\u6216\u8005\u8F93\u5165\u67D0\u4E00\u65F6\u95F4\u3002</p>
  355. <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
  356. <span aria-hidden="true" class="anchor">#</span>
  357. </a></h2>
  358. <p>Click <code>TimePicker</code>, and then we could select or input a time in panel.</p>
  359. `,order:7,title:{"zh-CN":"\u540E\u7F00\u56FE\u6807","en-US":"Suffix"},relativePath:"components/time-picker/demo/suffix.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWUtcGlja2VyIHYtbW9kZWw6dmFsdWU9InZhbHVlIiA6ZGVmYXVsdC12YWx1ZT0iZGF5anMoJzAwOjAwOjAwJywgJ0hIOm1tOnNzJykiPgogICAgPHRlbXBsYXRlICNzdWZmaXhJY29uPjxzbWlsZS1vdXRsaW5lZCAvPjwvdGVtcGxhdGU+CiAgPC9hLXRpbWUtcGlja2VyPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IGRheWpzLCB7IERheWpzIH0gZnJvbSAnZGF5anMnOwppbXBvcnQgeyBTbWlsZU91dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwoKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBTbWlsZU91dGxpbmVkLAogIH0sCiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICBkYXlqcywKICAgICAgdmFsdWU6IHJlZjxEYXlqcz4oKSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWUtcGlja2VyIHYtbW9kZWw6dmFsdWU9InZhbHVlIiA6ZGVmYXVsdC12YWx1ZT0iZGF5anMoJzAwOjAwOjAwJywgJ0hIOm1tOnNzJykiPgogICAgPHRlbXBsYXRlICNzdWZmaXhJY29uPjxzbWlsZS1vdXRsaW5lZCAvPjwvdGVtcGxhdGU+CiAgPC9hLXRpbWUtcGlja2VyPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgZGF5anMgZnJvbSAnZGF5anMnOwppbXBvcnQgeyBTbWlsZU91dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIGNvbXBvbmVudHM6IHsKICAgIFNtaWxlT3V0bGluZWQsCiAgfSwKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIGRheWpzLAogICAgICB2YWx1ZTogcmVmKCksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:e(()=>[c(u,{value:s.value,"onUpdate:value":a[0]||(a[0]=l=>s.value=l),"default-value":s.dayjs("00:00:00","HH:mm:ss")},{suffixIcon:e(()=>[c(p)]),_:1},8,["value","default-value"])]),htmlCode:e(()=>a[1]||(a[1]=[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(`
  360. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":default-value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("dayjs('00:00:00', 'HH:mm:ss')"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  361. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#suffixIcon"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("smile-outlined")]),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(`
  362. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-time-picker")]),n("span",{class:"token punctuation"},">")]),t(`
  363. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  364. `),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(`
  365. `),n("span",{class:"token keyword"},"import"),t(" dayjs"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"{"),t(" Dayjs "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  366. `),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(`
  367. `),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(`
  368. `),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(`
  369. `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
  370. SmileOutlined`),n("span",{class:"token punctuation"},","),t(`
  371. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  372. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  373. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  374. dayjs`),n("span",{class:"token punctuation"},","),t(`
  375. `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" ref"),n("span",{class:"token operator"},"<"),t("Dayjs"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
  376. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  377. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  378. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  379. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  380. `)])],-1)])),jsVersionHtml:e(()=>a[2]||(a[2]=[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(`
  381. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":default-value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("dayjs('00:00:00', 'HH:mm:ss')"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  382. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),t(),n("span",{class:"token attr-name"},"#suffixIcon"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("smile-outlined")]),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(`
  383. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-time-picker")]),n("span",{class:"token punctuation"},">")]),t(`
  384. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  385. `),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(`
  386. `),n("span",{class:"token keyword"},"import"),t(" dayjs "),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'dayjs'"),n("span",{class:"token punctuation"},";"),t(`
  387. `),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(`
  388. `),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(`
  389. `),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(`
  390. `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(`
  391. SmileOutlined`),n("span",{class:"token punctuation"},","),t(`
  392. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  393. `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
  394. `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
  395. dayjs`),n("span",{class:"token punctuation"},","),t(`
  396. `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),t(`
  397. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  398. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
  399. `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
  400. `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
  401. `)])],-1)])),_:1})}const an=g(nn,[["render",tn]]),sn={};function en(s,a){const i=o("a-time-picker"),d=o("a-time-range-picker"),m=o("a-space"),r=o("demo-box");return h(),v(r,{jsfiddle:{us:"Bordered-less style component.",cn:"\u65E0\u8FB9\u6846\u6837\u5F0F\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
  402. <span aria-hidden="true" class="anchor">#</span>
  403. </a></h2>
  404. <p>\u65E0\u8FB9\u6846\u6837\u5F0F\u3002</p>
  405. <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
  406. <span aria-hidden="true" class="anchor">#</span>
  407. </a></h2>
  408. <p>Bordered-less style component.</p>
  409. `,order:14,title:{"zh-CN":"\u65E0\u8FB9\u6846","en-US":"Bordered-less"},relativePath:"components/time-picker/demo/bordered.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdGltZS1waWNrZXIgOmJvcmRlcmVkPSJmYWxzZSIgLz4KICAgIDxhLXRpbWUtcmFuZ2UtcGlja2VyIDpib3JkZXJlZD0iZmFsc2UiIC8+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPgoKCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdGltZS1waWNrZXIgOmJvcmRlcmVkPSJmYWxzZSIgLz4KICAgIDxhLXRpbWUtcmFuZ2UtcGlja2VyIDpib3JkZXJlZD0iZmFsc2UiIC8+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPg=="}},{default:e(()=>[c(m,{direction:"vertical"},{default:e(()=>[c(i,{bordered:!1}),c(d,{bordered:!1})]),_:1})]),htmlCode:e(()=>a[0]||(a[0]=[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(`
  410. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  411. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},":bordered"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  412. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-range-picker")]),t(),n("span",{class:"token attr-name"},":bordered"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  413. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
  414. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  415. `)])],-1)])),jsVersionHtml:e(()=>a[1]||(a[1]=[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(`
  416. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-space")]),t(),n("span",{class:"token attr-name"},"direction"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("vertical"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
  417. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-picker")]),t(),n("span",{class:"token attr-name"},":bordered"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  418. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-range-picker")]),t(),n("span",{class:"token attr-name"},":bordered"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("false"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  419. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-space")]),n("span",{class:"token punctuation"},">")]),t(`
  420. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  421. `)])],-1)])),_:1})}const on=g(sn,[["render",en]]),cn={};function pn(s,a){const i=o("a-time-range-picker"),d=o("demo-box");return h(),v(d,{jsfiddle:{us:"Use time range picker with `TimeRangePicker`.",cn:"\u901A\u8FC7 `TimeRangePicker` \u4F7F\u7528\u65F6\u95F4\u8303\u56F4\u9009\u62E9\u5668\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
  422. <span aria-hidden="true" class="anchor">#</span>
  423. </a></h2>
  424. <p>\u901A\u8FC7 <code>TimeRangePicker</code> \u4F7F\u7528\u65F6\u95F4\u8303\u56F4\u9009\u62E9\u5668\u3002</p>
  425. <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
  426. <span aria-hidden="true" class="anchor">#</span>
  427. </a></h2>
  428. <p>Use time range picker with <code>TimeRangePicker</code>.</p>
  429. `,order:13,title:{"zh-CN":"\u8303\u56F4\u9009\u62E9\u5668","en-US":"Time Range Picker"},relativePath:"components/time-picker/demo/range-picker.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWUtcmFuZ2UtcGlja2VyIC8+CjwvdGVtcGxhdGU+CgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRpbWUtcmFuZ2UtcGlja2VyIC8+CjwvdGVtcGxhdGU+"}},{default:e(()=>[c(i)]),htmlCode:e(()=>a[0]||(a[0]=[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(`
  430. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-range-picker")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  431. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  432. `)])],-1)])),jsVersionHtml:e(()=>a[1]||(a[1]=[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(`
  433. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-time-range-picker")]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
  434. `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  435. `)])],-1)])),_:1})}const ln=g(cn,[["render",pn]]),un={pageData:{title:"TimePicker",description:"",frontmatter:{category:"Components",type:"\u6570\u636E\u5F55\u5165",title:"TimePicker",subtitle:"\u65F6\u95F4\u9009\u62E9\u6846",cover:"https://gw.alipayobjects.com/zos/alicdn/h04Zsl98I/TimePicker.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:"\u5F53\u7528\u6237\u9700\u8981\u8F93\u5165\u4E00\u4E2A\u65F6\u95F4\uFF0C\u53EF\u4EE5\u70B9\u51FB\u6807\u51C6\u8F93\u5165\u6846\uFF0C\u5F39\u51FA\u65F6\u95F4\u9762\u677F\u8FDB\u884C\u9009\u62E9\u3002"},{level:2,title:"API",slug:"API",content:""},{level:3,title:"\u4E8B\u4EF6",slug:"\u4E8B\u4EF6",content:""},{level:2,title:"\u65B9\u6CD5",slug:"\u65B9\u6CD5",content:""},{level:3,title:"TimeRangePicker",slug:"TimeRangePicker",content:"\u5C5E\u6027\u4E0E DatePicker \u7684 [RangePicker](/components/date-picker/#RangePicker) \u76F8\u540C\u3002\u8FD8\u5305\u542B\u4EE5\u4E0B\u5C5E\u6027\uFF1A"},{level:2,title:"FAQ",slug:"FAQ",content:"\u5982\u4F55\u5728 DatePicker \u4E2D\u4F7F\u7528\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\uFF08\u5982 moment.js \\| dayjs \\| date-fns\uFF09\uFF1F"},{level:3,title:"\u5982\u4F55\u5728 DatePicker \u4E2D\u4F7F\u7528\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\uFF08\u5982 moment.js \\| dayjs \\| date-fns\uFF09\uFF1F",slug:"\u5982\u4F55\u5728-DatePicker-\u4E2D\u4F7F\u7528\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\uFF08\u5982-moment-js-dayjs-date-fns\uFF09\uFF1F",content:"\u8BF7\u53C2\u8003[\u300A\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\u300B](/docs/vue/replace-date-cn)"}],relativePath:"components/time-picker/index.zh-CN.md",content:`
  436. \u8F93\u5165\u6216\u9009\u62E9\u65F6\u95F4\u7684\u63A7\u4EF6\u3002
  437. ## \u4F55\u65F6\u4F7F\u7528
  438. \u5F53\u7528\u6237\u9700\u8981\u8F93\u5165\u4E00\u4E2A\u65F6\u95F4\uFF0C\u53EF\u4EE5\u70B9\u51FB\u6807\u51C6\u8F93\u5165\u6846\uFF0C\u5F39\u51FA\u65F6\u95F4\u9762\u677F\u8FDB\u884C\u9009\u62E9\u3002
  439. ## API
  440. | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |
  441. | --- | --- | --- | --- | --- |
  442. | allowClear | \u662F\u5426\u5C55\u793A\u6E05\u9664\u6309\u94AE | boolean | true | |
  443. | autofocus | \u81EA\u52A8\u83B7\u53D6\u7126\u70B9 | boolean | false | |
  444. | bordered | \u662F\u5426\u6709\u8FB9\u6846 | boolean | true | |
  445. | clearIcon | \u81EA\u5B9A\u4E49\u7684\u6E05\u9664\u56FE\u6807 | v-slot:clearIcon | - | |
  446. | clearText | \u6E05\u9664\u6309\u94AE\u7684\u63D0\u793A\u6587\u6848 | string | clear | |
  447. | disabled | \u7981\u7528\u5168\u90E8\u64CD\u4F5C | boolean | false | |
  448. | disabledHours | \u7981\u6B62\u9009\u62E9\u90E8\u5206\u5C0F\u65F6\u9009\u9879 | function() | - | |
  449. | disabledMinutes | \u7981\u6B62\u9009\u62E9\u90E8\u5206\u5206\u949F\u9009\u9879 | function(selectedHour) | - | |
  450. | disabledSeconds | \u7981\u6B62\u9009\u62E9\u90E8\u5206\u79D2\u9009\u9879 | function(selectedHour, selectedMinute) | - | |
  451. | format | \u5C55\u793A\u7684\u65F6\u95F4\u683C\u5F0F | string | \`HH:mm:ss\` | |
  452. | getPopupContainer | \u5B9A\u4E49\u6D6E\u5C42\u7684\u5BB9\u5668\uFF0C\u9ED8\u8BA4\u4E3A body \u4E0A\u65B0\u5EFA div | function(trigger) | - | |
  453. | hideDisabledOptions | \u9690\u85CF\u7981\u6B62\u9009\u62E9\u7684\u9009\u9879 | boolean | false | |
  454. | hourStep | \u5C0F\u65F6\u9009\u9879\u95F4\u9694 | number | 1 | |
  455. | inputReadOnly | \u8BBE\u7F6E\u8F93\u5165\u6846\u4E3A\u53EA\u8BFB\uFF08\u907F\u514D\u5728\u79FB\u52A8\u8BBE\u5907\u4E0A\u6253\u5F00\u865A\u62DF\u952E\u76D8\uFF09 | boolean | false | |
  456. | minuteStep | \u5206\u949F\u9009\u9879\u95F4\u9694 | number | 1 | |
  457. | open(v-model) | \u9762\u677F\u662F\u5426\u6253\u5F00 | boolean | false | |
  458. | placeholder | \u6CA1\u6709\u503C\u7684\u65F6\u5019\u663E\u793A\u7684\u5185\u5BB9 | string \\| \\[string, string] | \`\u8BF7\u9009\u62E9\u65F6\u95F4\` | |
  459. | popupClassName | \u5F39\u51FA\u5C42\u7C7B\u540D | string | - | |
  460. | popupStyle | \u5F39\u51FA\u5C42\u6837\u5F0F\u5BF9\u8C61 | object | - | |
  461. | renderExtraFooter | \u9009\u62E9\u6846\u5E95\u90E8\u663E\u793A\u81EA\u5B9A\u4E49\u7684\u5185\u5BB9 | v-slot:renderExtraFooter | - | |
  462. | secondStep | \u79D2\u9009\u9879\u95F4\u9694 | number | 1 | |
  463. | showNow | \u9762\u677F\u662F\u5426\u663E\u793A\u201C\u6B64\u523B\u201D\u6309\u94AE | boolean | - | |
  464. | suffixIcon | \u81EA\u5B9A\u4E49\u7684\u9009\u62E9\u6846\u540E\u7F00\u56FE\u6807 | v-slot:suffixIcon | - | |
  465. | use12Hours | \u4F7F\u7528 12 \u5C0F\u65F6\u5236\uFF0C\u4E3A true \u65F6 \`format\` \u9ED8\u8BA4\u4E3A \`h:mm:ss a\` | boolean | false | |
  466. | value(v-model) | \u5F53\u524D\u65F6\u95F4 | [dayjs](https://day.js.org/) | - | |
  467. | valueFormat | \u53EF\u9009\uFF0C\u7ED1\u5B9A\u503C\u7684\u683C\u5F0F\uFF0C\u5BF9 value\u3001defaultValue \u8D77\u4F5C\u7528\u3002\u4E0D\u6307\u5B9A\u5219\u7ED1\u5B9A\u503C\u4E3A dayjs \u5BF9\u8C61 | string\uFF0C[\u5177\u4F53\u683C\u5F0F](https://day.js.org/docs/zh-CN/display/format) | - | |
  468. ### \u4E8B\u4EF6
  469. | \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E | \u56DE\u8C03\u53C2\u6570 |
  470. | ---------- | --------------------- | --------------------------------------------------------- |
  471. | change | \u65F6\u95F4\u53D1\u751F\u53D8\u5316\u7684\u56DE\u8C03 | function(time: dayjs \\| string, timeString: string): void |
  472. | openChange | \u9762\u677F\u6253\u5F00/\u5173\u95ED\u65F6\u7684\u56DE\u8C03 | (open: boolean): void |
  473. ## \u65B9\u6CD5
  474. | \u540D\u79F0 | \u63CF\u8FF0 |
  475. | ------- | -------- |
  476. | blur() | \u79FB\u9664\u7126\u70B9 |
  477. | focus() | \u83B7\u53D6\u7126\u70B9 |
  478. ### TimeRangePicker
  479. \u5C5E\u6027\u4E0E DatePicker \u7684 [RangePicker](/components/date-picker/#RangePicker) \u76F8\u540C\u3002\u8FD8\u5305\u542B\u4EE5\u4E0B\u5C5E\u6027\uFF1A
  480. | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |
  481. | ----- | -------------------- | ------- | ------ | ---- |
  482. | order | \u59CB\u672B\u65F6\u95F4\u662F\u5426\u81EA\u52A8\u6392\u5E8F | boolean | true | |
  483. ## FAQ
  484. ### \u5982\u4F55\u5728 DatePicker \u4E2D\u4F7F\u7528\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\uFF08\u5982 moment.js \\| dayjs \\| date-fns\uFF09\uFF1F
  485. \u8BF7\u53C2\u8003[\u300A\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\u300B](/docs/vue/replace-date-cn)
  486. `,html:`<p>\u8F93\u5165\u6216\u9009\u62E9\u65F6\u95F4\u7684\u63A7\u4EF6\u3002</p>
  487. <h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528 <a class="header-anchor" href="#\u4F55\u65F6\u4F7F\u7528">
  488. <span aria-hidden="true" class="anchor">#</span>
  489. </a></h2>
  490. <p>\u5F53\u7528\u6237\u9700\u8981\u8F93\u5165\u4E00\u4E2A\u65F6\u95F4\uFF0C\u53EF\u4EE5\u70B9\u51FB\u6807\u51C6\u8F93\u5165\u6846\uFF0C\u5F39\u51FA\u65F6\u95F4\u9762\u677F\u8FDB\u884C\u9009\u62E9\u3002</p>
  491. <h2 id="API">API <a class="header-anchor" href="#API">
  492. <span aria-hidden="true" class="anchor">#</span>
  493. </a></h2>
  494. <table>
  495. <thead>
  496. <tr>
  497. <th>\u53C2\u6570</th>
  498. <th>\u8BF4\u660E</th>
  499. <th>\u7C7B\u578B</th>
  500. <th>\u9ED8\u8BA4\u503C</th>
  501. <th>\u7248\u672C</th>
  502. </tr>
  503. </thead>
  504. <tbody>
  505. <tr>
  506. <td>allowClear</td>
  507. <td>\u662F\u5426\u5C55\u793A\u6E05\u9664\u6309\u94AE</td>
  508. <td>boolean</td>
  509. <td>true</td>
  510. <td></td>
  511. </tr>
  512. <tr>
  513. <td>autofocus</td>
  514. <td>\u81EA\u52A8\u83B7\u53D6\u7126\u70B9</td>
  515. <td>boolean</td>
  516. <td>false</td>
  517. <td></td>
  518. </tr>
  519. <tr>
  520. <td>bordered</td>
  521. <td>\u662F\u5426\u6709\u8FB9\u6846</td>
  522. <td>boolean</td>
  523. <td>true</td>
  524. <td></td>
  525. </tr>
  526. <tr>
  527. <td>clearIcon</td>
  528. <td>\u81EA\u5B9A\u4E49\u7684\u6E05\u9664\u56FE\u6807</td>
  529. <td>v-slot:clearIcon</td>
  530. <td>-</td>
  531. <td></td>
  532. </tr>
  533. <tr>
  534. <td>clearText</td>
  535. <td>\u6E05\u9664\u6309\u94AE\u7684\u63D0\u793A\u6587\u6848</td>
  536. <td>string</td>
  537. <td>clear</td>
  538. <td></td>
  539. </tr>
  540. <tr>
  541. <td>disabled</td>
  542. <td>\u7981\u7528\u5168\u90E8\u64CD\u4F5C</td>
  543. <td>boolean</td>
  544. <td>false</td>
  545. <td></td>
  546. </tr>
  547. <tr>
  548. <td>disabledHours</td>
  549. <td>\u7981\u6B62\u9009\u62E9\u90E8\u5206\u5C0F\u65F6\u9009\u9879</td>
  550. <td>function()</td>
  551. <td>-</td>
  552. <td></td>
  553. </tr>
  554. <tr>
  555. <td>disabledMinutes</td>
  556. <td>\u7981\u6B62\u9009\u62E9\u90E8\u5206\u5206\u949F\u9009\u9879</td>
  557. <td>function(selectedHour)</td>
  558. <td>-</td>
  559. <td></td>
  560. </tr>
  561. <tr>
  562. <td>disabledSeconds</td>
  563. <td>\u7981\u6B62\u9009\u62E9\u90E8\u5206\u79D2\u9009\u9879</td>
  564. <td>function(selectedHour, selectedMinute)</td>
  565. <td>-</td>
  566. <td></td>
  567. </tr>
  568. <tr>
  569. <td>format</td>
  570. <td>\u5C55\u793A\u7684\u65F6\u95F4\u683C\u5F0F</td>
  571. <td>string</td>
  572. <td><code>HH:mm:ss</code></td>
  573. <td></td>
  574. </tr>
  575. <tr>
  576. <td>getPopupContainer</td>
  577. <td>\u5B9A\u4E49\u6D6E\u5C42\u7684\u5BB9\u5668\uFF0C\u9ED8\u8BA4\u4E3A body \u4E0A\u65B0\u5EFA div</td>
  578. <td>function(trigger)</td>
  579. <td>-</td>
  580. <td></td>
  581. </tr>
  582. <tr>
  583. <td>hideDisabledOptions</td>
  584. <td>\u9690\u85CF\u7981\u6B62\u9009\u62E9\u7684\u9009\u9879</td>
  585. <td>boolean</td>
  586. <td>false</td>
  587. <td></td>
  588. </tr>
  589. <tr>
  590. <td>hourStep</td>
  591. <td>\u5C0F\u65F6\u9009\u9879\u95F4\u9694</td>
  592. <td>number</td>
  593. <td>1</td>
  594. <td></td>
  595. </tr>
  596. <tr>
  597. <td>inputReadOnly</td>
  598. <td>\u8BBE\u7F6E\u8F93\u5165\u6846\u4E3A\u53EA\u8BFB\uFF08\u907F\u514D\u5728\u79FB\u52A8\u8BBE\u5907\u4E0A\u6253\u5F00\u865A\u62DF\u952E\u76D8\uFF09</td>
  599. <td>boolean</td>
  600. <td>false</td>
  601. <td></td>
  602. </tr>
  603. <tr>
  604. <td>minuteStep</td>
  605. <td>\u5206\u949F\u9009\u9879\u95F4\u9694</td>
  606. <td>number</td>
  607. <td>1</td>
  608. <td></td>
  609. </tr>
  610. <tr>
  611. <td>open(v-model)</td>
  612. <td>\u9762\u677F\u662F\u5426\u6253\u5F00</td>
  613. <td>boolean</td>
  614. <td>false</td>
  615. <td></td>
  616. </tr>
  617. <tr>
  618. <td>placeholder</td>
  619. <td>\u6CA1\u6709\u503C\u7684\u65F6\u5019\u663E\u793A\u7684\u5185\u5BB9</td>
  620. <td>string | [string, string]</td>
  621. <td><code>\u8BF7\u9009\u62E9\u65F6\u95F4</code></td>
  622. <td></td>
  623. </tr>
  624. <tr>
  625. <td>popupClassName</td>
  626. <td>\u5F39\u51FA\u5C42\u7C7B\u540D</td>
  627. <td>string</td>
  628. <td>-</td>
  629. <td></td>
  630. </tr>
  631. <tr>
  632. <td>popupStyle</td>
  633. <td>\u5F39\u51FA\u5C42\u6837\u5F0F\u5BF9\u8C61</td>
  634. <td>object</td>
  635. <td>-</td>
  636. <td></td>
  637. </tr>
  638. <tr>
  639. <td>renderExtraFooter</td>
  640. <td>\u9009\u62E9\u6846\u5E95\u90E8\u663E\u793A\u81EA\u5B9A\u4E49\u7684\u5185\u5BB9</td>
  641. <td>v-slot:renderExtraFooter</td>
  642. <td>-</td>
  643. <td></td>
  644. </tr>
  645. <tr>
  646. <td>secondStep</td>
  647. <td>\u79D2\u9009\u9879\u95F4\u9694</td>
  648. <td>number</td>
  649. <td>1</td>
  650. <td></td>
  651. </tr>
  652. <tr>
  653. <td>showNow</td>
  654. <td>\u9762\u677F\u662F\u5426\u663E\u793A\u201C\u6B64\u523B\u201D\u6309\u94AE</td>
  655. <td>boolean</td>
  656. <td>-</td>
  657. <td></td>
  658. </tr>
  659. <tr>
  660. <td>suffixIcon</td>
  661. <td>\u81EA\u5B9A\u4E49\u7684\u9009\u62E9\u6846\u540E\u7F00\u56FE\u6807</td>
  662. <td>v-slot:suffixIcon</td>
  663. <td>-</td>
  664. <td></td>
  665. </tr>
  666. <tr>
  667. <td>use12Hours</td>
  668. <td>\u4F7F\u7528 12 \u5C0F\u65F6\u5236\uFF0C\u4E3A true \u65F6 <code>format</code> \u9ED8\u8BA4\u4E3A <code>h:mm:ss a</code></td>
  669. <td>boolean</td>
  670. <td>false</td>
  671. <td></td>
  672. </tr>
  673. <tr>
  674. <td>value(v-model)</td>
  675. <td>\u5F53\u524D\u65F6\u95F4</td>
  676. <td><a href="https://day.js.org/" target="_blank" rel="noopener noreferrer">dayjs</a></td>
  677. <td>-</td>
  678. <td></td>
  679. </tr>
  680. <tr>
  681. <td>valueFormat</td>
  682. <td>\u53EF\u9009\uFF0C\u7ED1\u5B9A\u503C\u7684\u683C\u5F0F\uFF0C\u5BF9 value\u3001defaultValue \u8D77\u4F5C\u7528\u3002\u4E0D\u6307\u5B9A\u5219\u7ED1\u5B9A\u503C\u4E3A dayjs \u5BF9\u8C61</td>
  683. <td>string\uFF0C<a href="https://day.js.org/docs/zh-CN/display/format" target="_blank" rel="noopener noreferrer">\u5177\u4F53\u683C\u5F0F</a></td>
  684. <td>-</td>
  685. <td></td>
  686. </tr>
  687. </tbody>
  688. </table>
  689. <h3 id="\u4E8B\u4EF6">\u4E8B\u4EF6 <a class="header-anchor" href="#\u4E8B\u4EF6">
  690. <span aria-hidden="true" class="anchor">#</span>
  691. </a></h3>
  692. <table>
  693. <thead>
  694. <tr>
  695. <th>\u4E8B\u4EF6\u540D\u79F0</th>
  696. <th>\u8BF4\u660E</th>
  697. <th>\u56DE\u8C03\u53C2\u6570</th>
  698. </tr>
  699. </thead>
  700. <tbody>
  701. <tr>
  702. <td>change</td>
  703. <td>\u65F6\u95F4\u53D1\u751F\u53D8\u5316\u7684\u56DE\u8C03</td>
  704. <td>function(time: dayjs | string, timeString: string): void</td>
  705. </tr>
  706. <tr>
  707. <td>openChange</td>
  708. <td>\u9762\u677F\u6253\u5F00/\u5173\u95ED\u65F6\u7684\u56DE\u8C03</td>
  709. <td>(open: boolean): void</td>
  710. </tr>
  711. </tbody>
  712. </table>
  713. <h2 id="\u65B9\u6CD5">\u65B9\u6CD5 <a class="header-anchor" href="#\u65B9\u6CD5">
  714. <span aria-hidden="true" class="anchor">#</span>
  715. </a></h2>
  716. <table>
  717. <thead>
  718. <tr>
  719. <th>\u540D\u79F0</th>
  720. <th>\u63CF\u8FF0</th>
  721. </tr>
  722. </thead>
  723. <tbody>
  724. <tr>
  725. <td>blur()</td>
  726. <td>\u79FB\u9664\u7126\u70B9</td>
  727. </tr>
  728. <tr>
  729. <td>focus()</td>
  730. <td>\u83B7\u53D6\u7126\u70B9</td>
  731. </tr>
  732. </tbody>
  733. </table>
  734. <h3 id="TimeRangePicker">TimeRangePicker <a class="header-anchor" href="#TimeRangePicker">
  735. <span aria-hidden="true" class="anchor">#</span>
  736. </a></h3>
  737. <p>\u5C5E\u6027\u4E0E DatePicker \u7684 <a href="/components/date-picker/#RangePicker">RangePicker</a> \u76F8\u540C\u3002\u8FD8\u5305\u542B\u4EE5\u4E0B\u5C5E\u6027\uFF1A</p>
  738. <table>
  739. <thead>
  740. <tr>
  741. <th>\u53C2\u6570</th>
  742. <th>\u8BF4\u660E</th>
  743. <th>\u7C7B\u578B</th>
  744. <th>\u9ED8\u8BA4\u503C</th>
  745. <th>\u7248\u672C</th>
  746. </tr>
  747. </thead>
  748. <tbody>
  749. <tr>
  750. <td>order</td>
  751. <td>\u59CB\u672B\u65F6\u95F4\u662F\u5426\u81EA\u52A8\u6392\u5E8F</td>
  752. <td>boolean</td>
  753. <td>true</td>
  754. <td></td>
  755. </tr>
  756. </tbody>
  757. </table>
  758. <h2 id="FAQ">FAQ <a class="header-anchor" href="#FAQ">
  759. <span aria-hidden="true" class="anchor">#</span>
  760. </a></h2>
  761. <h3 id="\u5982\u4F55\u5728-DatePicker-\u4E2D\u4F7F\u7528\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\uFF08\u5982-moment-js-dayjs-date-fns\uFF09\uFF1F">\u5982\u4F55\u5728 DatePicker \u4E2D\u4F7F\u7528\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\uFF08\u5982 moment.js | dayjs | date-fns\uFF09\uFF1F <a class="header-anchor" href="#\u5982\u4F55\u5728-DatePicker-\u4E2D\u4F7F\u7528\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\uFF08\u5982-moment-js-dayjs-date-fns\uFF09\uFF1F">
  762. <span aria-hidden="true" class="anchor">#</span>
  763. </a></h3>
  764. <p>\u8BF7\u53C2\u8003<a href="/docs/vue/replace-date-cn">\u300A\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\u300B</a></p>
  765. `,lastUpdated:1748060301401}},dn={class:"markdown"};function rn(s,a,i,d,m,r){return h(),w("article",dn,a[0]||(a[0]=[Z('<p>\u8F93\u5165\u6216\u9009\u62E9\u65F6\u95F4\u7684\u63A7\u4EF6\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><p>\u5F53\u7528\u6237\u9700\u8981\u8F93\u5165\u4E00\u4E2A\u65F6\u95F4\uFF0C\u53EF\u4EE5\u70B9\u51FB\u6807\u51C6\u8F93\u5165\u6846\uFF0C\u5F39\u51FA\u65F6\u95F4\u9762\u677F\u8FDB\u884C\u9009\u62E9\u3002</p><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><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>allowClear</td><td>\u662F\u5426\u5C55\u793A\u6E05\u9664\u6309\u94AE</td><td>boolean</td><td>true</td><td></td></tr><tr><td>autofocus</td><td>\u81EA\u52A8\u83B7\u53D6\u7126\u70B9</td><td>boolean</td><td>false</td><td></td></tr><tr><td>bordered</td><td>\u662F\u5426\u6709\u8FB9\u6846</td><td>boolean</td><td>true</td><td></td></tr><tr><td>clearIcon</td><td>\u81EA\u5B9A\u4E49\u7684\u6E05\u9664\u56FE\u6807</td><td>v-slot:clearIcon</td><td>-</td><td></td></tr><tr><td>clearText</td><td>\u6E05\u9664\u6309\u94AE\u7684\u63D0\u793A\u6587\u6848</td><td>string</td><td>clear</td><td></td></tr><tr><td>disabled</td><td>\u7981\u7528\u5168\u90E8\u64CD\u4F5C</td><td>boolean</td><td>false</td><td></td></tr><tr><td>disabledHours</td><td>\u7981\u6B62\u9009\u62E9\u90E8\u5206\u5C0F\u65F6\u9009\u9879</td><td>function()</td><td>-</td><td></td></tr><tr><td>disabledMinutes</td><td>\u7981\u6B62\u9009\u62E9\u90E8\u5206\u5206\u949F\u9009\u9879</td><td>function(selectedHour)</td><td>-</td><td></td></tr><tr><td>disabledSeconds</td><td>\u7981\u6B62\u9009\u62E9\u90E8\u5206\u79D2\u9009\u9879</td><td>function(selectedHour, selectedMinute)</td><td>-</td><td></td></tr><tr><td>format</td><td>\u5C55\u793A\u7684\u65F6\u95F4\u683C\u5F0F</td><td>string</td><td><code>HH:mm:ss</code></td><td></td></tr><tr><td>getPopupContainer</td><td>\u5B9A\u4E49\u6D6E\u5C42\u7684\u5BB9\u5668\uFF0C\u9ED8\u8BA4\u4E3A body \u4E0A\u65B0\u5EFA div</td><td>function(trigger)</td><td>-</td><td></td></tr><tr><td>hideDisabledOptions</td><td>\u9690\u85CF\u7981\u6B62\u9009\u62E9\u7684\u9009\u9879</td><td>boolean</td><td>false</td><td></td></tr><tr><td>hourStep</td><td>\u5C0F\u65F6\u9009\u9879\u95F4\u9694</td><td>number</td><td>1</td><td></td></tr><tr><td>inputReadOnly</td><td>\u8BBE\u7F6E\u8F93\u5165\u6846\u4E3A\u53EA\u8BFB\uFF08\u907F\u514D\u5728\u79FB\u52A8\u8BBE\u5907\u4E0A\u6253\u5F00\u865A\u62DF\u952E\u76D8\uFF09</td><td>boolean</td><td>false</td><td></td></tr><tr><td>minuteStep</td><td>\u5206\u949F\u9009\u9879\u95F4\u9694</td><td>number</td><td>1</td><td></td></tr><tr><td>open(v-model)</td><td>\u9762\u677F\u662F\u5426\u6253\u5F00</td><td>boolean</td><td>false</td><td></td></tr><tr><td>placeholder</td><td>\u6CA1\u6709\u503C\u7684\u65F6\u5019\u663E\u793A\u7684\u5185\u5BB9</td><td>string | [string, string]</td><td><code>\u8BF7\u9009\u62E9\u65F6\u95F4</code></td><td></td></tr><tr><td>popupClassName</td><td>\u5F39\u51FA\u5C42\u7C7B\u540D</td><td>string</td><td>-</td><td></td></tr><tr><td>popupStyle</td><td>\u5F39\u51FA\u5C42\u6837\u5F0F\u5BF9\u8C61</td><td>object</td><td>-</td><td></td></tr><tr><td>renderExtraFooter</td><td>\u9009\u62E9\u6846\u5E95\u90E8\u663E\u793A\u81EA\u5B9A\u4E49\u7684\u5185\u5BB9</td><td>v-slot:renderExtraFooter</td><td>-</td><td></td></tr><tr><td>secondStep</td><td>\u79D2\u9009\u9879\u95F4\u9694</td><td>number</td><td>1</td><td></td></tr><tr><td>showNow</td><td>\u9762\u677F\u662F\u5426\u663E\u793A\u201C\u6B64\u523B\u201D\u6309\u94AE</td><td>boolean</td><td>-</td><td></td></tr><tr><td>suffixIcon</td><td>\u81EA\u5B9A\u4E49\u7684\u9009\u62E9\u6846\u540E\u7F00\u56FE\u6807</td><td>v-slot:suffixIcon</td><td>-</td><td></td></tr><tr><td>use12Hours</td><td>\u4F7F\u7528 12 \u5C0F\u65F6\u5236\uFF0C\u4E3A true \u65F6 <code>format</code> \u9ED8\u8BA4\u4E3A <code>h:mm:ss a</code></td><td>boolean</td><td>false</td><td></td></tr><tr><td>value(v-model)</td><td>\u5F53\u524D\u65F6\u95F4</td><td><a href="https://day.js.org/" target="_blank" rel="noopener noreferrer">dayjs</a></td><td>-</td><td></td></tr><tr><td>valueFormat</td><td>\u53EF\u9009\uFF0C\u7ED1\u5B9A\u503C\u7684\u683C\u5F0F\uFF0C\u5BF9 value\u3001defaultValue \u8D77\u4F5C\u7528\u3002\u4E0D\u6307\u5B9A\u5219\u7ED1\u5B9A\u503C\u4E3A dayjs \u5BF9\u8C61</td><td>string\uFF0C<a href="https://day.js.org/docs/zh-CN/display/format" target="_blank" rel="noopener noreferrer">\u5177\u4F53\u683C\u5F0F</a></td><td>-</td><td></td></tr></tbody></table><h3 id="\u4E8B\u4EF6">\u4E8B\u4EF6 <a class="header-anchor" href="#\u4E8B\u4EF6"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u4E8B\u4EF6\u540D\u79F0</th><th>\u8BF4\u660E</th><th>\u56DE\u8C03\u53C2\u6570</th></tr></thead><tbody><tr><td>change</td><td>\u65F6\u95F4\u53D1\u751F\u53D8\u5316\u7684\u56DE\u8C03</td><td>function(time: dayjs | string, timeString: string): void</td></tr><tr><td>openChange</td><td>\u9762\u677F\u6253\u5F00/\u5173\u95ED\u65F6\u7684\u56DE\u8C03</td><td>(open: boolean): void</td></tr></tbody></table><h2 id="\u65B9\u6CD5">\u65B9\u6CD5 <a class="header-anchor" href="#\u65B9\u6CD5"><span aria-hidden="true" class="anchor">#</span></a></h2><table><thead><tr><th>\u540D\u79F0</th><th>\u63CF\u8FF0</th></tr></thead><tbody><tr><td>blur()</td><td>\u79FB\u9664\u7126\u70B9</td></tr><tr><td>focus()</td><td>\u83B7\u53D6\u7126\u70B9</td></tr></tbody></table><h3 id="TimeRangePicker">TimeRangePicker <a class="header-anchor" href="#TimeRangePicker"><span aria-hidden="true" class="anchor">#</span></a></h3><p>\u5C5E\u6027\u4E0E DatePicker \u7684 <a href="/components/date-picker/#RangePicker">RangePicker</a> \u76F8\u540C\u3002\u8FD8\u5305\u542B\u4EE5\u4E0B\u5C5E\u6027\uFF1A</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>order</td><td>\u59CB\u672B\u65F6\u95F4\u662F\u5426\u81EA\u52A8\u6392\u5E8F</td><td>boolean</td><td>true</td><td></td></tr></tbody></table><h2 id="FAQ">FAQ <a class="header-anchor" href="#FAQ"><span aria-hidden="true" class="anchor">#</span></a></h2><h3 id="\u5982\u4F55\u5728-DatePicker-\u4E2D\u4F7F\u7528\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\uFF08\u5982-moment-js-dayjs-date-fns\uFF09\uFF1F">\u5982\u4F55\u5728 DatePicker \u4E2D\u4F7F\u7528\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\uFF08\u5982 moment.js | dayjs | date-fns\uFF09\uFF1F <a class="header-anchor" href="#\u5982\u4F55\u5728-DatePicker-\u4E2D\u4F7F\u7528\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\uFF08\u5982-moment-js-dayjs-date-fns\uFF09\uFF1F"><span aria-hidden="true" class="anchor">#</span></a></h3><p>\u8BF7\u53C2\u8003<a href="/docs/vue/replace-date-cn">\u300A\u81EA\u5B9A\u4E49\u65E5\u671F\u5E93\u300B</a></p>',15)]))}const kn=g(un,[["render",rn]]),mn={pageData:{title:"TimePicker",description:"",frontmatter:{category:"Components",type:"Data Entry",title:"TimePicker",cover:"https://gw.alipayobjects.com/zos/alicdn/h04Zsl98I/TimePicker.svg"},headers:[{level:2,title:"When To Use",slug:"When-To-Use",content:"By clicking the input box, you can select a time from a popup panel."},{level:2,title:"API",slug:"API",content:""},{level:3,title:"events",slug:"events",content:""},{level:2,title:"Methods",slug:"Methods",content:""},{level:3,title:"TimeRangePicker",slug:"TimeRangePicker",content:"Same props from [RangePicker](/components/date-picker/#RangePicker) of DatePicker. And includes additional props:"},{level:2,title:"FAQ",slug:"FAQ",content:"How to use DatePicker with customize date library\uFF08like moment.js \\| dayjs \\| date-fns\uFF09\uFF1F"},{level:3,title:"How to use DatePicker with customize date library\uFF08like moment.js \\| dayjs \\| date-fns\uFF09\uFF1F",slug:"How-to-use-DatePicker-with-customize-date-library\uFF08like-moment-js-dayjs-date-fns\uFF09\uFF1F",content:"Please refer [replace date](/docs/vue/replace-date)"}],relativePath:"components/time-picker/index.en-US.md",content:`
  766. To select/input a time.
  767. ## When To Use
  768. By clicking the input box, you can select a time from a popup panel.
  769. ## API
  770. | Property | Description | Type | Default | Version |
  771. | --- | --- | --- | --- | --- |
  772. | allowClear | Whether allow clearing text | boolean | true | |
  773. | autofocus | If get focus when component mounted | boolean | false | |
  774. | bordered | Whether has border style | boolean | true | |
  775. | clearIcon | The custom clear icon | v-slot:clearIcon | - | |
  776. | clearText | The clear tooltip of icon | string | clear | |
  777. | disabled | Determine whether the TimePicker is disabled | boolean | false | |
  778. | disabledHours | To specify the hours that cannot be selected | function() | - | |
  779. | disabledMinutes | To specify the minutes that cannot be selected | function(selectedHour) | - | |
  780. | disabledSeconds | To specify the seconds that cannot be selected | function(selectedHour, selectedMinute) | - | |
  781. | format | To set the time format | string | \`HH:mm:ss\` | |
  782. | getPopupContainer | To set the container of the floating layer, while the default is to create a div element in body | function(trigger) | - | |
  783. | hideDisabledOptions | Whether hide the options that can not be selected | boolean | false | |
  784. | hourStep | Interval between hours in picker | number | 1 | |
  785. | inputReadOnly | Set the \`readonly\` attribute of the input tag (avoids virtual keyboard on touch devices) | boolean | false | |
  786. | minuteStep | Interval between minutes in picker | number | 1 | |
  787. | open(v-model) | Whether to popup panel | boolean | false | |
  788. | placeholder | Display when there&#39;s no value | string \\| \\[string, string] | \`Select a time\` | |
  789. | popupClassName | The className of panel | string | - | |
  790. | popupStyle | The style of panel | CSSProperties | - | |
  791. | renderExtraFooter | Called from time picker panel to render some addon to its bottom | v-slot:renderExtraFooter | - | |
  792. | secondStep | Interval between seconds in picker | number | 1 | |
  793. | showNow | Whether to show \`Now\` button on panel | boolean | - | |
  794. | suffixIcon | The custom suffix icon | v-slot:suffixIcon | - | |
  795. | use12Hours | Display as 12 hours format, with default format \`h:mm:ss a\` | boolean | false | |
  796. | value(v-model) | To set time | [dayjs](https://day.js.org/) | - | |
  797. | valueFormat | optional, format of binding value. If not specified, the binding value will be a Date object | string\uFF0C[date formats](https://day.js.org/docs/en/display/format) | - | |
  798. ### events
  799. | Events Name | Description | Arguments |
  800. | --- | --- | --- |
  801. | change | a callback function, can be executed when the selected time is changing | function(time: dayjs \\| string, timeString: string): void |
  802. | openChange | a callback function which will be called while panel opening/closing | (open: boolean): void |
  803. ## Methods
  804. | Name | Description |
  805. | ------- | ------------ |
  806. | blur() | remove focus |
  807. | focus() | get focus |
  808. ### TimeRangePicker
  809. Same props from [RangePicker](/components/date-picker/#RangePicker) of DatePicker. And includes additional props:
  810. | Property | Description | Type | Default | Version |
  811. | -------- | ------------------------ | ------- | ------- | ------- |
  812. | order | Order start and end time | boolean | true | |
  813. ## FAQ
  814. ### How to use DatePicker with customize date library\uFF08like moment.js \\| dayjs \\| date-fns\uFF09\uFF1F
  815. Please refer [replace date](/docs/vue/replace-date)
  816. `,html:`<p>To select/input a time.</p>
  817. <h2 id="When-To-Use">When To Use <a class="header-anchor" href="#When-To-Use">
  818. <span aria-hidden="true" class="anchor">#</span>
  819. </a></h2>
  820. <p>By clicking the input box, you can select a time from a popup panel.</p>
  821. <h2 id="API">API <a class="header-anchor" href="#API">
  822. <span aria-hidden="true" class="anchor">#</span>
  823. </a></h2>
  824. <table>
  825. <thead>
  826. <tr>
  827. <th>Property</th>
  828. <th>Description</th>
  829. <th>Type</th>
  830. <th>Default</th>
  831. <th>Version</th>
  832. </tr>
  833. </thead>
  834. <tbody>
  835. <tr>
  836. <td>allowClear</td>
  837. <td>Whether allow clearing text</td>
  838. <td>boolean</td>
  839. <td>true</td>
  840. <td></td>
  841. </tr>
  842. <tr>
  843. <td>autofocus</td>
  844. <td>If get focus when component mounted</td>
  845. <td>boolean</td>
  846. <td>false</td>
  847. <td></td>
  848. </tr>
  849. <tr>
  850. <td>bordered</td>
  851. <td>Whether has border style</td>
  852. <td>boolean</td>
  853. <td>true</td>
  854. <td></td>
  855. </tr>
  856. <tr>
  857. <td>clearIcon</td>
  858. <td>The custom clear icon</td>
  859. <td>v-slot:clearIcon</td>
  860. <td>-</td>
  861. <td></td>
  862. </tr>
  863. <tr>
  864. <td>clearText</td>
  865. <td>The clear tooltip of icon</td>
  866. <td>string</td>
  867. <td>clear</td>
  868. <td></td>
  869. </tr>
  870. <tr>
  871. <td>disabled</td>
  872. <td>Determine whether the TimePicker is disabled</td>
  873. <td>boolean</td>
  874. <td>false</td>
  875. <td></td>
  876. </tr>
  877. <tr>
  878. <td>disabledHours</td>
  879. <td>To specify the hours that cannot be selected</td>
  880. <td>function()</td>
  881. <td>-</td>
  882. <td></td>
  883. </tr>
  884. <tr>
  885. <td>disabledMinutes</td>
  886. <td>To specify the minutes that cannot be selected</td>
  887. <td>function(selectedHour)</td>
  888. <td>-</td>
  889. <td></td>
  890. </tr>
  891. <tr>
  892. <td>disabledSeconds</td>
  893. <td>To specify the seconds that cannot be selected</td>
  894. <td>function(selectedHour, selectedMinute)</td>
  895. <td>-</td>
  896. <td></td>
  897. </tr>
  898. <tr>
  899. <td>format</td>
  900. <td>To set the time format</td>
  901. <td>string</td>
  902. <td><code>HH:mm:ss</code></td>
  903. <td></td>
  904. </tr>
  905. <tr>
  906. <td>getPopupContainer</td>
  907. <td>To set the container of the floating layer, while the default is to create a div element in body</td>
  908. <td>function(trigger)</td>
  909. <td>-</td>
  910. <td></td>
  911. </tr>
  912. <tr>
  913. <td>hideDisabledOptions</td>
  914. <td>Whether hide the options that can not be selected</td>
  915. <td>boolean</td>
  916. <td>false</td>
  917. <td></td>
  918. </tr>
  919. <tr>
  920. <td>hourStep</td>
  921. <td>Interval between hours in picker</td>
  922. <td>number</td>
  923. <td>1</td>
  924. <td></td>
  925. </tr>
  926. <tr>
  927. <td>inputReadOnly</td>
  928. <td>Set the <code>readonly</code> attribute of the input tag (avoids virtual keyboard on touch devices)</td>
  929. <td>boolean</td>
  930. <td>false</td>
  931. <td></td>
  932. </tr>
  933. <tr>
  934. <td>minuteStep</td>
  935. <td>Interval between minutes in picker</td>
  936. <td>number</td>
  937. <td>1</td>
  938. <td></td>
  939. </tr>
  940. <tr>
  941. <td>open(v-model)</td>
  942. <td>Whether to popup panel</td>
  943. <td>boolean</td>
  944. <td>false</td>
  945. <td></td>
  946. </tr>
  947. <tr>
  948. <td>placeholder</td>
  949. <td>Display when there's no value</td>
  950. <td>string | [string, string]</td>
  951. <td><code>Select a time</code></td>
  952. <td></td>
  953. </tr>
  954. <tr>
  955. <td>popupClassName</td>
  956. <td>The className of panel</td>
  957. <td>string</td>
  958. <td>-</td>
  959. <td></td>
  960. </tr>
  961. <tr>
  962. <td>popupStyle</td>
  963. <td>The style of panel</td>
  964. <td>CSSProperties</td>
  965. <td>-</td>
  966. <td></td>
  967. </tr>
  968. <tr>
  969. <td>renderExtraFooter</td>
  970. <td>Called from time picker panel to render some addon to its bottom</td>
  971. <td>v-slot:renderExtraFooter</td>
  972. <td>-</td>
  973. <td></td>
  974. </tr>
  975. <tr>
  976. <td>secondStep</td>
  977. <td>Interval between seconds in picker</td>
  978. <td>number</td>
  979. <td>1</td>
  980. <td></td>
  981. </tr>
  982. <tr>
  983. <td>showNow</td>
  984. <td>Whether to show <code>Now</code> button on panel</td>
  985. <td>boolean</td>
  986. <td>-</td>
  987. <td></td>
  988. </tr>
  989. <tr>
  990. <td>suffixIcon</td>
  991. <td>The custom suffix icon</td>
  992. <td>v-slot:suffixIcon</td>
  993. <td>-</td>
  994. <td></td>
  995. </tr>
  996. <tr>
  997. <td>use12Hours</td>
  998. <td>Display as 12 hours format, with default format <code>h:mm:ss a</code></td>
  999. <td>boolean</td>
  1000. <td>false</td>
  1001. <td></td>
  1002. </tr>
  1003. <tr>
  1004. <td>value(v-model)</td>
  1005. <td>To set time</td>
  1006. <td><a href="https://day.js.org/" target="_blank" rel="noopener noreferrer">dayjs</a></td>
  1007. <td>-</td>
  1008. <td></td>
  1009. </tr>
  1010. <tr>
  1011. <td>valueFormat</td>
  1012. <td>optional, format of binding value. If not specified, the binding value will be a Date object</td>
  1013. <td>string\uFF0C<a href="https://day.js.org/docs/en/display/format" target="_blank" rel="noopener noreferrer">date formats</a></td>
  1014. <td>-</td>
  1015. <td></td>
  1016. </tr>
  1017. </tbody>
  1018. </table>
  1019. <h3 id="events">events <a class="header-anchor" href="#events">
  1020. <span aria-hidden="true" class="anchor">#</span>
  1021. </a></h3>
  1022. <table>
  1023. <thead>
  1024. <tr>
  1025. <th>Events Name</th>
  1026. <th>Description</th>
  1027. <th>Arguments</th>
  1028. </tr>
  1029. </thead>
  1030. <tbody>
  1031. <tr>
  1032. <td>change</td>
  1033. <td>a callback function, can be executed when the selected time is changing</td>
  1034. <td>function(time: dayjs | string, timeString: string): void</td>
  1035. </tr>
  1036. <tr>
  1037. <td>openChange</td>
  1038. <td>a callback function which will be called while panel opening/closing</td>
  1039. <td>(open: boolean): void</td>
  1040. </tr>
  1041. </tbody>
  1042. </table>
  1043. <h2 id="Methods">Methods <a class="header-anchor" href="#Methods">
  1044. <span aria-hidden="true" class="anchor">#</span>
  1045. </a></h2>
  1046. <table>
  1047. <thead>
  1048. <tr>
  1049. <th>Name</th>
  1050. <th>Description</th>
  1051. </tr>
  1052. </thead>
  1053. <tbody>
  1054. <tr>
  1055. <td>blur()</td>
  1056. <td>remove focus</td>
  1057. </tr>
  1058. <tr>
  1059. <td>focus()</td>
  1060. <td>get focus</td>
  1061. </tr>
  1062. </tbody>
  1063. </table>
  1064. <h3 id="TimeRangePicker">TimeRangePicker <a class="header-anchor" href="#TimeRangePicker">
  1065. <span aria-hidden="true" class="anchor">#</span>
  1066. </a></h3>
  1067. <p>Same props from <a href="/components/date-picker/#RangePicker">RangePicker</a> of DatePicker. And includes additional props:</p>
  1068. <table>
  1069. <thead>
  1070. <tr>
  1071. <th>Property</th>
  1072. <th>Description</th>
  1073. <th>Type</th>
  1074. <th>Default</th>
  1075. <th>Version</th>
  1076. </tr>
  1077. </thead>
  1078. <tbody>
  1079. <tr>
  1080. <td>order</td>
  1081. <td>Order start and end time</td>
  1082. <td>boolean</td>
  1083. <td>true</td>
  1084. <td></td>
  1085. </tr>
  1086. </tbody>
  1087. </table>
  1088. <h2 id="FAQ">FAQ <a class="header-anchor" href="#FAQ">
  1089. <span aria-hidden="true" class="anchor">#</span>
  1090. </a></h2>
  1091. <h3 id="How-to-use-DatePicker-with-customize-date-library\uFF08like-moment-js-dayjs-date-fns\uFF09\uFF1F">How to use DatePicker with customize date library\uFF08like moment.js | dayjs | date-fns\uFF09\uFF1F <a class="header-anchor" href="#How-to-use-DatePicker-with-customize-date-library\uFF08like-moment-js-dayjs-date-fns\uFF09\uFF1F">
  1092. <span aria-hidden="true" class="anchor">#</span>
  1093. </a></h3>
  1094. <p>Please refer <a href="/docs/vue/replace-date">replace date</a></p>
  1095. `,lastUpdated:1748060301400}},gn={class:"markdown"};function hn(s,a,i,d,m,r){return h(),w("article",gn,a[0]||(a[0]=[Z('<p>To select/input a time.</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><p>By clicking the input box, you can select a time from a popup panel.</p><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th><th>Version</th></tr></thead><tbody><tr><td>allowClear</td><td>Whether allow clearing text</td><td>boolean</td><td>true</td><td></td></tr><tr><td>autofocus</td><td>If get focus when component mounted</td><td>boolean</td><td>false</td><td></td></tr><tr><td>bordered</td><td>Whether has border style</td><td>boolean</td><td>true</td><td></td></tr><tr><td>clearIcon</td><td>The custom clear icon</td><td>v-slot:clearIcon</td><td>-</td><td></td></tr><tr><td>clearText</td><td>The clear tooltip of icon</td><td>string</td><td>clear</td><td></td></tr><tr><td>disabled</td><td>Determine whether the TimePicker is disabled</td><td>boolean</td><td>false</td><td></td></tr><tr><td>disabledHours</td><td>To specify the hours that cannot be selected</td><td>function()</td><td>-</td><td></td></tr><tr><td>disabledMinutes</td><td>To specify the minutes that cannot be selected</td><td>function(selectedHour)</td><td>-</td><td></td></tr><tr><td>disabledSeconds</td><td>To specify the seconds that cannot be selected</td><td>function(selectedHour, selectedMinute)</td><td>-</td><td></td></tr><tr><td>format</td><td>To set the time format</td><td>string</td><td><code>HH:mm:ss</code></td><td></td></tr><tr><td>getPopupContainer</td><td>To set the container of the floating layer, while the default is to create a div element in body</td><td>function(trigger)</td><td>-</td><td></td></tr><tr><td>hideDisabledOptions</td><td>Whether hide the options that can not be selected</td><td>boolean</td><td>false</td><td></td></tr><tr><td>hourStep</td><td>Interval between hours in picker</td><td>number</td><td>1</td><td></td></tr><tr><td>inputReadOnly</td><td>Set the <code>readonly</code> attribute of the input tag (avoids virtual keyboard on touch devices)</td><td>boolean</td><td>false</td><td></td></tr><tr><td>minuteStep</td><td>Interval between minutes in picker</td><td>number</td><td>1</td><td></td></tr><tr><td>open(v-model)</td><td>Whether to popup panel</td><td>boolean</td><td>false</td><td></td></tr><tr><td>placeholder</td><td>Display when there&#39;s no value</td><td>string | [string, string]</td><td><code>Select a time</code></td><td></td></tr><tr><td>popupClassName</td><td>The className of panel</td><td>string</td><td>-</td><td></td></tr><tr><td>popupStyle</td><td>The style of panel</td><td>CSSProperties</td><td>-</td><td></td></tr><tr><td>renderExtraFooter</td><td>Called from time picker panel to render some addon to its bottom</td><td>v-slot:renderExtraFooter</td><td>-</td><td></td></tr><tr><td>secondStep</td><td>Interval between seconds in picker</td><td>number</td><td>1</td><td></td></tr><tr><td>showNow</td><td>Whether to show <code>Now</code> button on panel</td><td>boolean</td><td>-</td><td></td></tr><tr><td>suffixIcon</td><td>The custom suffix icon</td><td>v-slot:suffixIcon</td><td>-</td><td></td></tr><tr><td>use12Hours</td><td>Display as 12 hours format, with default format <code>h:mm:ss a</code></td><td>boolean</td><td>false</td><td></td></tr><tr><td>value(v-model)</td><td>To set time</td><td><a href="https://day.js.org/" target="_blank" rel="noopener noreferrer">dayjs</a></td><td>-</td><td></td></tr><tr><td>valueFormat</td><td>optional, format of binding value. If not specified, the binding value will be a Date object</td><td>string\uFF0C<a href="https://day.js.org/docs/en/display/format" target="_blank" rel="noopener noreferrer">date formats</a></td><td>-</td><td></td></tr></tbody></table><h3 id="events">events <a class="header-anchor" href="#events"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>Events Name</th><th>Description</th><th>Arguments</th></tr></thead><tbody><tr><td>change</td><td>a callback function, can be executed when the selected time is changing</td><td>function(time: dayjs | string, timeString: string): void</td></tr><tr><td>openChange</td><td>a callback function which will be called while panel opening/closing</td><td>(open: boolean): void</td></tr></tbody></table><h2 id="Methods">Methods <a class="header-anchor" href="#Methods"><span aria-hidden="true" class="anchor">#</span></a></h2><table><thead><tr><th>Name</th><th>Description</th></tr></thead><tbody><tr><td>blur()</td><td>remove focus</td></tr><tr><td>focus()</td><td>get focus</td></tr></tbody></table><h3 id="TimeRangePicker">TimeRangePicker <a class="header-anchor" href="#TimeRangePicker"><span aria-hidden="true" class="anchor">#</span></a></h3><p>Same props from <a href="/components/date-picker/#RangePicker">RangePicker</a> of DatePicker. And includes additional props:</p><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th><th>Version</th></tr></thead><tbody><tr><td>order</td><td>Order start and end time</td><td>boolean</td><td>true</td><td></td></tr></tbody></table><h2 id="FAQ">FAQ <a class="header-anchor" href="#FAQ"><span aria-hidden="true" class="anchor">#</span></a></h2><h3 id="How-to-use-DatePicker-with-customize-date-library\uFF08like-moment-js-dayjs-date-fns\uFF09\uFF1F">How to use DatePicker with customize date library\uFF08like moment.js | dayjs | date-fns\uFF09\uFF1F <a class="header-anchor" href="#How-to-use-DatePicker-with-customize-date-library\uFF08like-moment-js-dayjs-date-fns\uFF09\uFF1F"><span aria-hidden="true" class="anchor">#</span></a></h3><p>Please refer <a href="/docs/vue/replace-date">replace date</a></p>',15)]))}const bn=g(mn,[["render",hn]]);const fn={CN:kn,US:bn,components:{Hours:R,Addon:D,Basic:U,Disabled:E,HideColumn:_,IntervalOptions:q,Size:$,Suffix:an,Bordered:on,RangePicker:ln}};function vn(s,a,i,d,m,r){const p=o("Basic"),u=o("Bordered"),k=o("RangePicker"),l=o("Hours"),f=o("Addon"),A=o("Disabled"),W=o("HideColumn"),G=o("IntervalOptions"),H=o("Size"),B=o("Suffix"),P=o("demo-sort");return h(),v(P,null,{default:e(()=>[c(p),c(u),c(k),c(l),c(f),c(A),c(W),c(G),c(H),c(B)]),_:1})}const yn=g(fn,[["render",vn]]);export{yn as default};