aboutsummaryrefslogtreecommitdiffhomepage
path: root/examples/disabled.html
diff options
context:
space:
mode:
Diffstat (limited to 'examples/disabled.html')
-rw-r--r--examples/disabled.html85
1 files changed, 42 insertions, 43 deletions
diff --git a/examples/disabled.html b/examples/disabled.html
index 6238c54..8fa693e 100644
--- a/examples/disabled.html
+++ b/examples/disabled.html
@@ -2,12 +2,12 @@
2<html> 2<html>
3 3
4<head> 4<head>
5 <title>disabled.js - example - rc-time-picker@1.1.6</title> 5 <title>disabled.js - example - rc-time-picker@2.0.0</title>
6 <meta name="viewport" 6 <meta name="viewport"
7 content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> 7 content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
8 <meta charset="utf-8"/> 8 <meta charset="utf-8"/>
9 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 9 <meta http-equiv="X-UA-Compatible" content="IE=edge">
10 <link href="//cdnjs.cloudflare.com/ajax/libs/normalize/3.0.3/normalize.css" rel="stylesheet"/> 10 <link href="https://a.alipayobjects.com/normalize.css/3.0.1/normalize.css" rel="stylesheet"/>
11 <style> 11 <style>
12 .highlight pre { 12 .highlight pre {
13 padding: .8em 1em; 13 padding: .8em 1em;
@@ -251,41 +251,36 @@ Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-lic
251 <!--[if lt IE 9]> 251 <!--[if lt IE 9]>
252 <script src="https://a.alipayobjects.com/??es5-shim/4.0.5/es5-shim.js,es5-shim/4.0.5/es5-sham.js,html5shiv/3.7.2/src/html5shiv.js"></script> 252 <script src="https://a.alipayobjects.com/??es5-shim/4.0.5/es5-shim.js,es5-shim/4.0.5/es5-sham.js,html5shiv/3.7.2/src/html5shiv.js"></script>
253 <![endif]--> 253 <![endif]-->
254
254 <link rel="stylesheet" href="common.css" /> 255 <link rel="stylesheet" href="common.css" />
255</head> 256</head>
256 257
257<body> 258<body>
258<div class="container"> 259 <div class="container">
259 <div class="header"> 260 <div class="header">
260 <h1>rc-time-picker@1.1.6</h1> 261 <h1>rc-time-picker@2.0.0</h1>
261 262
262 <p>React TimePicker</p> 263 <p>React TimePicker</p>
263 </div> 264 </div>
264 <div class="example" id="__react-content"></div> 265 <div class="example" id="__react-content"></div>
265 <script src="common.js?nowrap"></script> 266
266 <script src="disabled.js?nowrap"></script> 267 <div class="highlight"><pre><code language="js"><span class="hljs-comment">/* eslint no-console:0 */</span>
267 <div class="highlight"><pre><code language="js"><span class="hljs-comment">/* eslint no-console:0 */</span>
268 268
269import <span class="hljs-string">'rc-time-picker/assets/index.css'</span>; 269<span class="hljs-keyword">import</span> <span class="hljs-string">'rc-time-picker/assets/index.css'</span>;
270 270
271import React from <span class="hljs-string">'react'</span>; 271<span class="hljs-keyword">import</span> React <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
272import ReactDom from <span class="hljs-string">'react-dom'</span>; 272<span class="hljs-keyword">import</span> ReactDom <span class="hljs-keyword">from</span> <span class="hljs-string">'react-dom'</span>;
273 273
274import GregorianCalendar from <span class="hljs-string">'gregorian-calendar'</span>; 274<span class="hljs-keyword">import</span> moment <span class="hljs-keyword">from</span> <span class="hljs-string">'moment'</span>;
275import DateTimeFormat from <span class="hljs-string">'gregorian-calendar-format'</span>;
276 275
277import TimePicker from <span class="hljs-string">'rc-time-picker'</span>; 276<span class="hljs-keyword">import</span> TimePicker <span class="hljs-keyword">from</span> <span class="hljs-string">'rc-time-picker'</span>;
278import TimePickerLocale from <span class="hljs-string">'rc-time-picker/lib/locale/zh_CN'</span>;
279 277
280<span class="hljs-keyword">const</span> showSecond = <span class="hljs-literal">true</span>; 278<span class="hljs-keyword">const</span> showSecond = <span class="hljs-literal">true</span>;
281<span class="hljs-keyword">const</span> str = showSecond ? <span class="hljs-string">'HH:mm:ss'</span> : <span class="hljs-string">'HH:mm'</span>; 279<span class="hljs-keyword">const</span> str = showSecond ? <span class="hljs-string">'HH:mm:ss'</span> : <span class="hljs-string">'HH:mm'</span>;
282 280
283<span class="hljs-keyword">const</span> formatter = <span class="hljs-keyword">new</span> DateTimeFormat(str); 281<span class="hljs-keyword">const</span> now = moment().hour(<span class="hljs-number">14</span>).minute(<span class="hljs-number">30</span>);
284 282
285<span class="hljs-keyword">const</span> now = <span class="hljs-keyword">new</span> GregorianCalendar(TimePickerLocale.calendar); 283<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">generateOptions</span>(<span class="hljs-params">length, excludedOptions</span>) </span>{
286now.setTime(<span class="hljs-built_in">Date</span>.now());
287
288<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">generateOptions</span><span class="hljs-params">(length, excludedOptions)</span> </span>{
289 <span class="hljs-keyword">const</span> arr = []; 284 <span class="hljs-keyword">const</span> arr = [];
290 <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> value = <span class="hljs-number">0</span>; value &lt; length; value++) { 285 <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> value = <span class="hljs-number">0</span>; value &lt; length; value++) {
291 <span class="hljs-keyword">if</span> (excludedOptions.indexOf(value) &lt; <span class="hljs-number">0</span>) { 286 <span class="hljs-keyword">if</span> (excludedOptions.indexOf(value) &lt; <span class="hljs-number">0</span>) {
@@ -295,15 +290,15 @@ now.setTime(<span class="hljs-built_in">Date</span>.now());
295 <span class="hljs-keyword">return</span> arr; 290 <span class="hljs-keyword">return</span> arr;
296} 291}
297 292
298<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">onChange</span><span class="hljs-params">(value)</span> </span>{ 293<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">onChange</span>(<span class="hljs-params">value</span>) </span>{
299 <span class="hljs-built_in">console</span>.log(value &amp;&amp; formatter.format(value)); 294 <span class="hljs-built_in">console</span>.log(value &amp;&amp; value.format(str));
300} 295}
301 296
302<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">disabledHours</span><span class="hljs-params">()</span> </span>{ 297<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">disabledHours</span>(<span class="hljs-params"></span>) </span>{
303 <span class="hljs-keyword">return</span> [<span class="hljs-number">0</span>, <span class="hljs-number">1</span>, <span class="hljs-number">2</span>, <span class="hljs-number">3</span>, <span class="hljs-number">4</span>, <span class="hljs-number">5</span>, <span class="hljs-number">6</span>, <span class="hljs-number">7</span>, <span class="hljs-number">8</span>, <span class="hljs-number">22</span>, <span class="hljs-number">23</span>]; 298 <span class="hljs-keyword">return</span> [<span class="hljs-number">0</span>, <span class="hljs-number">1</span>, <span class="hljs-number">2</span>, <span class="hljs-number">3</span>, <span class="hljs-number">4</span>, <span class="hljs-number">5</span>, <span class="hljs-number">6</span>, <span class="hljs-number">7</span>, <span class="hljs-number">8</span>, <span class="hljs-number">22</span>, <span class="hljs-number">23</span>];
304} 299}
305 300
306<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">disabledMinutes</span><span class="hljs-params">(h)</span> </span>{ 301<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">disabledMinutes</span>(<span class="hljs-params">h</span>) </span>{
307 <span class="hljs-keyword">switch</span> (h) { 302 <span class="hljs-keyword">switch</span> (h) {
308 <span class="hljs-keyword">case</span> <span class="hljs-number">9</span>: 303 <span class="hljs-keyword">case</span> <span class="hljs-number">9</span>:
309 <span class="hljs-keyword">return</span> generateOptions(<span class="hljs-number">60</span>, [<span class="hljs-number">30</span>]); 304 <span class="hljs-keyword">return</span> generateOptions(<span class="hljs-number">60</span>, [<span class="hljs-number">30</span>]);
@@ -314,29 +309,33 @@ now.setTime(<span class="hljs-built_in">Date</span>.now());
314 } 309 }
315} 310}
316 311
317<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">disabledSeconds</span><span class="hljs-params">(h, m)</span> </span>{ 312<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">disabledSeconds</span>(<span class="hljs-params">h, m</span>) </span>{
318 <span class="hljs-keyword">return</span> [h + m % <span class="hljs-number">60</span>]; 313 <span class="hljs-keyword">return</span> [h + m % <span class="hljs-number">60</span>];
319} 314}
320 315
321ReactDom.render( 316ReactDom.render(
322 <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-title">TimePicker</span> <span class="hljs-attribute">formatter</span>=<span class="hljs-value">{formatter}</span> <span class="hljs-attribute">locale</span>=<span class="hljs-value">{TimePickerLocale}</span> 317 <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-title">TimePicker</span>
323 <span class="hljs-attribute">showSecond</span>=<span class="hljs-value">{showSecond}</span> 318 <span class="hljs-attribute">showSecond</span>=<span class="hljs-value">{showSecond}</span>
324 <span class="hljs-attribute">defaultValue</span>=<span class="hljs-value">{now}</span> 319 <span class="hljs-attribute">defaultValue</span>=<span class="hljs-value">{now}</span>
325 <span class="hljs-attribute">className</span>=<span class="hljs-value">"xxx"</span> 320 <span class="hljs-attribute">className</span>=<span class="hljs-value">"xxx"</span>
326 <span class="hljs-attribute">onChange</span>=<span class="hljs-value">{onChange}</span> 321 <span class="hljs-attribute">onChange</span>=<span class="hljs-value">{onChange}</span>
327 <span class="hljs-attribute">disabledHours</span>=<span class="hljs-value">{disabledHours}</span> 322 <span class="hljs-attribute">disabledHours</span>=<span class="hljs-value">{disabledHours}</span>
328 <span class="hljs-attribute">disabledMinutes</span>=<span class="hljs-value">{disabledMinutes}</span> 323 <span class="hljs-attribute">disabledMinutes</span>=<span class="hljs-value">{disabledMinutes}</span>
329 <span class="hljs-attribute">disabledSeconds</span>=<span class="hljs-value">{disabledSeconds}</span>/&gt;</span>, 324 <span class="hljs-attribute">disabledSeconds</span>=<span class="hljs-value">{disabledSeconds}</span>
325 /&gt;</span>,
330 document.getElementById('__react-content') 326 document.getElementById('__react-content')
331); 327);
332</span></code></pre></div> 328</span></code></pre></div>
333</div> 329 </div>
334<a href="http://github.com/react-component/time-picker"> 330 <a href="http://github.com/react-component/time-picker">
335 <img style="position: absolute; top: 0; right: 0; border: 0;" 331 <img style="position: absolute; top: 0; right: 0; border: 0;"
336 src="https://camo.githubusercontent.com/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67" 332 src="https://camo.githubusercontent.com/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67"
337 alt="Fork me on GitHub" 333 alt="Fork me on GitHub"
338 data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png"> 334 data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png">
339</a> 335 </a>
336
337 <script src="common.js?nowrap"></script>
338 <script src="disabled.js?nowrap"></script>
340</body> 339</body>
341 340
342</html> 341</html>
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-24 13:22:23 +0000