yyc12345/coconut-leaf
1
0
Fork 0
Code Activity
Files
1980f61242da7318dc77c6e4b83c2cd8c0bb8d9b
coconut-leaf/src/static/tmpl/datetimepicker.tmpl

200 lines
10 KiB
Cheetah
Raw Normal View History

finish a half of datetimepicker
2021-03-10 16:47:44 +08:00
<div id="ccn-datetimepicker-modal" class="modal is-active" style="float: left; position: fixed; top: 0; bottom: 0; left: 0; right: 0;">
<div class="modal-background"></div>
<div class="modal-card" style="height: 70%;">
add dial plate svg
2021-03-11 16:39:34 +08:00
<header class="modal-card-head pickerHeader">
<div><small i18n-name="ccn-i18n-universal-text-year"></small><span id="ccn-datetimepicker-datetime-year">&nbsp;</span></div>
<div><small i18n-name="ccn-i18n-universal-text-month"></small><span id="ccn-datetimepicker-datetime-month">&nbsp;</span></div>
<div><small i18n-name="ccn-i18n-universal-text-day"></small><span id="ccn-datetimepicker-datetime-day">&nbsp;</span></div>
<div><small i18n-name="ccn-i18n-universal-text-hour"></small><span id="ccn-datetimepicker-datetime-hour">&nbsp;</span></div>
<div><small i18n-name="ccn-i18n-universal-text-minute"></small><span id="ccn-datetimepicker-datetime-minute">&nbsp;</span></div>
finish a half of datetimepicker
2021-03-10 16:47:44 +08:00
</header>
<div class="modal-card-body pickerContainer">
add dial plate svg
2021-03-11 16:39:34 +08:00
<div id="ccn-datetimepicker-panel-year">
finish a half of datetimepicker
2021-03-10 16:47:44 +08:00
<nav class="level is-mobile">
<div class="level-left">
<div class="level-item control">
<a class="button">
<span class="icon is-small"><i class="fas fa-chevron-circle-left"></i></span>
</a>
</div>
</div>
<div class="level-item">this is a title</div>
<div class="level-right">
<div class="level-item control">
<a class="button">
<span class="icon is-small"><i class="fas fa-chevron-circle-right"></i></span>
</a>
</div>
</div>
</nav>
<div class="perfectTable">
<div>
<div>abc</div>
<div>abc</div>
<div>abc</div>
<div>abc</div>
</div>
<div>
<div>abc</div>
<div>abc</div>
<div>abc</div>
<div>abc</div>
</div>
<div>
<div>abc</div>
<div>abc</div>
<div>abc</div>
<div>abc</div>
</div>
</div>
</div>
add dial plate svg
2021-03-11 16:39:34 +08:00
<div id="ccn-datetimepicker-panel-month">
finish a half of datetimepicker
2021-03-10 16:47:44 +08:00
<nav class="level is-mobile">
<div class="level-left">
<div class="level-item control">
<a class="button">
<span class="icon is-small"><i class="fas fa-chevron-circle-left"></i></span>
</a>
</div>
</div>
<div class="level-item">this is a title</div>
<div class="level-right">
<div class="level-item control">
<a class="button">
<span class="icon is-small"><i class="fas fa-chevron-circle-right"></i></span>
</a>
</div>
</div>
</nav>
<div class="perfectTable">
<div>
<div i18n-name="ccn-i18n-universal-month-1"></div>
<div i18n-name="ccn-i18n-universal-month-2"></div>
<div i18n-name="ccn-i18n-universal-month-3"></div>
<div i18n-name="ccn-i18n-universal-month-4"></div>
</div>
<div>
<div i18n-name="ccn-i18n-universal-month-5"></div>
<div i18n-name="ccn-i18n-universal-month-6"></div>
<div i18n-name="ccn-i18n-universal-month-7"></div>
<div i18n-name="ccn-i18n-universal-month-8"></div>
</div>
<div>
<div i18n-name="ccn-i18n-universal-month-9"></div>
<div i18n-name="ccn-i18n-universal-month-10"></div>
<div i18n-name="ccn-i18n-universal-month-11"></div>
<div i18n-name="ccn-i18n-universal-month-12"></div>
</div>
</div>
</div>
add dial plate svg
2021-03-11 16:39:34 +08:00
<div id="ccn-datetimepicker-panel-day">
finish a half of datetimepicker
2021-03-10 16:47:44 +08:00
<nav class="level is-mobile">
<div class="level-left">
<div class="level-item control">
<a class="button">
<span class="icon is-small"><i class="fas fa-chevron-circle-left"></i></span>
</a>
</div>
</div>
<div class="level-item">this is a title</div>
<div class="level-right">
<div class="level-item control">
<a class="button">
<span class="icon is-small"><i class="fas fa-chevron-circle-right"></i></span>
</a>
</div>
</div>
</nav>
<div class="perfectTable">
<div>
<div i18n-name="ccn-i18n-universal-week-1"></div>
<div i18n-name="ccn-i18n-universal-week-2"></div>
<div i18n-name="ccn-i18n-universal-week-3"></div>
<div i18n-name="ccn-i18n-universal-week-4"></div>
<div i18n-name="ccn-i18n-universal-week-5"></div>
<div i18n-name="ccn-i18n-universal-week-6"></div>
<div i18n-name="ccn-i18n-universal-week-7"></div>
</div>
<div>
<div></div><div></div><div></div><div></div><div></div><div></div><div></div>
</div>
<div>
<div></div><div></div><div></div><div></div><div></div><div></div><div></div>
</div>
<div>
<div></div><div></div><div></div><div></div><div></div><div></div><div></div>
</div>
<div>
<div></div><div></div><div></div><div></div><div></div><div></div><div></div>
</div>
<div>
<div></div><div></div><div></div><div></div><div></div><div></div><div></div>
</div>
<div>
<div></div><div></div><div></div><div></div><div></div><div></div><div></div>
</div>
</div>
</div>
add dial plate svg
2021-03-11 16:39:34 +08:00
<svg id="ccn-datetimepicker-panel-hour" xmlns="http://www.w3.org/2000/svg" version="1.1" preserveAspectRatio="xMidYMid" viewBox="0 0 200 200">
<circle cx="100.000000" cy="100.000000" r="100.000000" type="background"></circle>
<line x1="100" y1="100" x2="100.000000" y2="20.000000"></line>
<circle cx="100.000000" cy="20.000000" r="1em" type="symbol"></circle>
<text x="100.000000" y="20.000000">0</text>
<text x="140.000000" y="30.717968">1</text>
<text x="169.282032" y="60.000000">2</text>
<text x="180.000000" y="100.000000">3</text>
<text x="169.282032" y="140.000000">4</text>
<text x="140.000000" y="169.282032">5</text>
<text x="100.000000" y="180.000000">6</text>
<text x="60.000000" y="169.282032">7</text>
<text x="30.717968" y="140.000000">8</text>
<text x="20.000000" y="100.000000">9</text>
<text x="30.717968" y="60.000000">10</text>
<text x="60.000000" y="30.717968">11</text>
<text x="100.000000" y="40.000000">12</text>
<text x="130.000000" y="48.038476">13</text>
<text x="151.961524" y="70.000000">14</text>
<text x="160.000000" y="100.000000">15</text>
<text x="151.961524" y="130.000000">16</text>
<text x="130.000000" y="151.961524">17</text>
<text x="100.000000" y="160.000000">18</text>
<text x="70.000000" y="151.961524">19</text>
<text x="48.038476" y="130.000000">20</text>
<text x="40.000000" y="100.000000">21</text>
<text x="48.038476" y="70.000000">22</text>
<text x="70.000000" y="48.038476">23</text>
</svg>
<svg id="ccn-datetimepicker-panel-minute" xmlns="http://www.w3.org/2000/svg" version="1.1" preserveAspectRatio="xMidYMid" viewBox="0 0 200 200">
<circle cx="100.000000" cy="100.000000" r="100.000000" type="background"></circle>
<line x1="100" y1="100" x2="100.000000" y2="20.000000"></line>
<circle cx="100.000000" cy="20.000000" r="1em" type="symbol"></circle>
<text x="100.000000" y="20.000000">0</text>
<text x="140.000000" y="30.717968">5</text>
<text x="169.282032" y="60.000000">10</text>
<text x="180.000000" y="100.000000">15</text>
<text x="169.282032" y="140.000000">20</text>
<text x="140.000000" y="169.282032">25</text>
<text x="100.000000" y="180.000000">30</text>
<text x="60.000000" y="169.282032">35</text>
<text x="30.717968" y="140.000000">40</text>
<text x="20.000000" y="100.000000">45</text>
<text x="30.717968" y="60.000000">50</text>
<text x="60.000000" y="30.717968">55</text>
</svg>
finish a half of datetimepicker
2021-03-10 16:47:44 +08:00
</div>
<footer class="modal-card-foot">
<a id="ccn-datetimepicker-btnConfirm" class="button is-success">
<span i18n-name="ccn-i18n-datetimepicker-confirm"></span>
</a>
<a id="ccn-datetimepicker-btnCancel" class="button">
<span i18n-name="ccn-i18n-datetimepicker-cancel"></span>
</a>
</footer>
</div>
</div>
Copy Permalink