{"_id":"@dfeidao/fd-w000008","_rev":"4-743e8157ac7970b848f4163d1231a2c3","name":"@dfeidao/fd-w000008","dist-tags":{"dev":"4.6.201905201136","latest":"4.6.201908051154"},"versions":{"4.6.201905201136":{"name":"@dfeidao/fd-w000008","version":"4.6.201905201136","description":"时间选择","scripts":{"lint":"tslint -p ./tsconfig.json","build":"../../node_modules/.bin/gulp","test":"../../node_modules/.bin/gulp dev","umd":"../../node_modules/.bin/gulp umd"},"repository":{"type":"git","url":"https://gitee.com/dfeidao/widgets"},"keywords":["feidao","01feidao","dfeidao","atom","飞道","控件","ai"],"author":{"name":"taoqf","email":"tao_qiufeng@126.com","url":"http://www.01feidao.com/"},"maintainers":[{"name":"mashizhen","email":"mashizhen123@dingtalk.com"},{"name":"taoqf","email":"tao_qiufeng@126.com"}],"license":"MIT","peerDependencies":{},"dependencies":{"@dfeidao/core":"4.6.201904301027"},"devDependencies":{"purecss":"^1.0.0"},"_id":"@dfeidao/fd-w000008@4.6.201905201136","_nodeVersion":"12.2.0","_npmVersion":"6.9.0","dist":{"integrity":"sha512-5zRnMCLB/kR54pZ0u2jr/RdTmqEZv1R7hLSJ+nUbMKCxeLvoQNuky9dkraBl+7lNC08maOtqTfPwDJKrDz4D2g==","shasum":"bf76f616ffd6b6213e281eace468ec3abc43ccfb","tarball":"https://registry.npmjs.org/@dfeidao/fd-w000008/-/fd-w000008-4.6.201905201136.tgz","fileCount":5,"unpackedSize":16470,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc4iDgCRA9TVsSAnZWagAAvQoP/3TqBecD6woDqqFy9VGc\nlkisgX2r0kTUCGeBTODjWa5E1P9vqbNv9KuQbMSpSkDzAQyKL7G9nck6GZix\n1TZmqBUWxjZzP6Q0UgafImOjtTBzBpznJAtW3ZiURTwFKxTNIB+wuMwjTiq/\nKc3g4Yn627Ur13y8ajpoL+5C0sW+vbD+d3lm3Ls9MgVTJ0Wk9EBpeW5IUHy4\nY+S+8WUEiqLvjdPFUhbEVIeMeMxCEnPbX7K1YqqEf36eUsjm+nPkEXELisc4\n5zxbiphUY93sCatG8XQNo4Dl6Q6UBn9fkL0RKJ8ql8nF5XjmJ1Vc9vz6uw9Z\nrjwK+P6WwuayKhdIwtnnBXalc3vq3uWbYsnsQ+E4zuGAILxUEAEnFJR/7ybb\nA6nUJqgAvCod48gxnzF12MDi50BPHXZChJc2qNDfaBzoFEHo7ES02TG1FS0S\nL7GrPULECxzppnoEC+RfBi5wz842aTsR4wSlHp+jB1+/88zjNtvzm0KrEx2o\ngS3ELZGSnwgVnRyp/UYESQjAXBo73rntvxyqeSLtnU5URiImgXoUhjbXO6vV\nt+rSHUb13CTq66npw1x6KLyV3hgE+myR9sV2trm0b1gHY7NJ5Fi4L0FdGyx/\nZdOOpx9J0Tc1Kb65eDmwuchVCgl+w98zPrLc4SPmvKGch7mIOdqqGdMQ31JT\nVIFf\r\n=dJeg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH63d18N4DIsmD3EVyVg9g21pxsq6QsNTrz3CVvgmpD3AiEAkBWSbYfVWNeGqDspSrQMjUP3e1DtW/P48O+vPqLL3KY="}]},"_npmUser":{"name":"taoqf","email":"tao_qiufeng@126.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/fd-w000008_4.6.201905201136_1558323423986_0.622026012864695"},"_hasShrinkwrap":false},"4.6.201907081016":{"name":"@dfeidao/fd-w000008","version":"4.6.201907081016","description":"时间选择","scripts":{"lint":"tslint -p ./tsconfig.json","build":"../../node_modules/.bin/gulp","test":"../../node_modules/.bin/gulp dev","umd":"../../node_modules/.bin/gulp umd"},"repository":{"type":"git","url":"https://gitee.com/dfeidao/widgets"},"keywords":["feidao","01feidao","dfeidao","atom","飞道","控件","ai"],"author":{"name":"taoqf","email":"tao_qiufeng@126.com","url":"http://www.01feidao.com/"},"maintainers":[{"email":"tao_qiufeng@126.com","name":"taoqf"}],"license":"MIT","peerDependencies":{},"dependencies":{"@dfeidao/core":"4.6.201904301027"},"devDependencies":{"purecss":"^1.0.0"},"_id":"@dfeidao/fd-w000008@4.6.201907081016","_nodeVersion":"12.6.0","_npmVersion":"6.9.0","dist":{"integrity":"sha512-TOQLFHqRHJAX2pq2Y6dkFWGOghMQnkeDdIm//ZlqYpUY6rdKUbTHsFs6IvJVmeQwX7ax7Mv/OEtwIuLPc2lkxg==","shasum":"a18ddfa0db12e988ddfb597666780bd2ffc46ba0","tarball":"https://registry.npmjs.org/@dfeidao/fd-w000008/-/fd-w000008-4.6.201907081016.tgz","fileCount":6,"unpackedSize":16634,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdIqeFCRA9TVsSAnZWagAA+ckQAKHQIro1LcX9ndYm+lB/\nvXkLnNyglRZURYfOzP/7qNci/GAX+Jrh953djM1skvFF2Kissu9U9f0oaaGO\ntxinuUXcSid06op+I+yPHMb5H9RvWpyInZosA09IH2vjUUgzT68eddCBg9Mg\nz3jyX4TWfVQEJAqNHBDjDvnFHnkX3hLyuifPp7Fc+vHCm8vnET7CWlHv3hoW\nUmbUJXJ1EdnLr+v1ftoQRJEE190xQ3Qbsb7l4qcVStRvjw2re/IszcczzrYk\nm7+ujdGCATpkvZftZVQF+HOtRGymizx39XEchvImw5ZBFvRXPofMqnzy8vdI\nd1xcxHGWOgMbAovtRGqkSwvo3KF3wP/qnbQwEDaK/fMpFU544sd8xcATPeZs\nCLKfMQOjK9LqBk5exlDowmxIoq6A6b8KoquToaOvLV4RYovZJUU0F5adm7Vz\nlH3Q9q5k92JcEhcWWqAB+PYF369atQ+vZaBvfPm3o9qaJIh8Fhueu6epvoLG\nFISqoq/0w1nuflnVDg0Hvu1t2OO5gRXZxUvI3gHAE7eRY2+cLp8kxqs38jpj\nEI0ONxhRj2tqWJFw6S5OlA93Mo/QHJSgeF0cS1OVJI3s2/CFvFQd5GYKlfAo\nzhBXw8T2c5r+ax2v5gi2RiSYM05T8znEGfCrV7lSRqudOYT164xbvcMJjkBf\ny2nP\r\n=nwqn\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEPp+4IPtM6t03vjDPOOVkMCY16bQlnVZ10yWbHWrvZJAiEAg2Dp9BFioMZeMQBO7Q4wEvaMGlwWONuJwRMNJEHpMmg="}]},"_npmUser":{"name":"taoqf","email":"tao_qiufeng@126.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/fd-w000008_4.6.201907081016_1562552197131_0.9477994058087895"},"_hasShrinkwrap":false},"4.6.201908051154":{"name":"@dfeidao/fd-w000008","version":"4.6.201908051154","description":"时间选择","scripts":{"lint":"tslint -p ./tsconfig.json","build":"../../node_modules/.bin/gulp","test":"../../node_modules/.bin/gulp dev","umd":"../../node_modules/.bin/gulp umd"},"repository":{"type":"git","url":"https://gitee.com/dfeidao/widgets"},"keywords":["feidao","01feidao","dfeidao","atom","飞道","控件","ai"],"author":{"name":"taoqf","email":"tao_qiufeng@126.com","url":"http://www.01feidao.com/"},"maintainers":[{"email":"tao_qiufeng@126.com","name":"taoqf"}],"license":"MIT","peerDependencies":{},"dependencies":{"@dfeidao/core":"4.6.201904301027"},"devDependencies":{"purecss":"^1.0.0"},"_id":"@dfeidao/fd-w000008@4.6.201908051154","_nodeVersion":"12.6.0","_npmVersion":"6.9.0","dist":{"integrity":"sha512-r+m7oLg/9L45XgX+i1MN4daRKXq9MoH6R/Yu/kJczrZids2fousTOeOVmR7+oDcTZbw9G9SMiQYb4LLeCxElEA==","shasum":"f0468b22c77f5c62662ca302d87df35834bc38c6","tarball":"https://registry.npmjs.org/@dfeidao/fd-w000008/-/fd-w000008-4.6.201908051154.tgz","fileCount":6,"unpackedSize":24366,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdR6hjCRA9TVsSAnZWagAAI1UP+QEz1okBBbBmIIfw07kO\nyAGD0C3362hjefRiKR9kwYnjPhptR4AiZpCyD08wJL0yf11VGSdZrIEXmhgI\nLUw0CCCBIA53xodjS5PF0a+gumhaPji5yQi1fB0KuBR8owpwjFQAHnhCMAbj\nHGSatg9QoMgCHKrzvhx375J9lDQ2fZ5LmxLkJvdsKAO/AFc4koqaFrf1dDS8\nvp/rk8kZQllWWcnNjOCEoj1D0u4+syVkoBAy5YSnUKJhIg2Iz1BdCrf1oXOk\np5fnLxR6GkBiLDSp0UBNuDRNkfdO5cjHmlP8GNQSjy2MfnHlfb5IqfJlR/eb\ndJ6ZsPi7MY6hXfUktvAHK3wPE4aNJuAk2wwtFqeITVal0mzfwvT2zOdmYlw7\n+nFq2rNrNYgk//z/M4HaLLiSdoGgC/HxEUkmPBaJTYtCyxXflAyR9HW9Smzv\nwbowKTRF/hYK8POOfrfI1APIH4FXwmn3ixuThitQ2DEakYR7QOFGBrpxBQ3u\nAz+IsZrZg9TRm9dPBAYfPfDQZt/pUzFsx8DHzrpSo216ivlDgEXvq+Bocd4v\nK3gBSbajCfWgKiUxZGjzUMF601MvfvnWnDKiEPgqRMh66IWLSmLkhoLJernx\naUM6U9UJUtfg1NmOrXmfJCF9Bf06UxsnPkuTw15ZwvmxK6Q/ZiGmGgsPUVKI\njD1F\r\n=ELzl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDRRFjSISxjOdC6kkJqAo4BgfzcoU5DlYh5xvsNlDvLIQIgA1CLVZVNE0k5uzqOlHBhjg1+XEK3SGbqy/TZ8dgRrFU="}]},"_npmUser":{"name":"taoqf","email":"tao_qiufeng@126.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/fd-w000008_4.6.201908051154_1564977250463_0.5235497636592912"},"_hasShrinkwrap":false}},"time":{"created":"2019-05-20T03:37:03.802Z","4.6.201905201136":"2019-05-20T03:37:04.186Z","modified":"2022-04-05T04:16:26.887Z","4.6.201907081016":"2019-07-08T02:16:37.256Z","4.6.201908051154":"2019-08-05T03:54:10.660Z"},"maintainers":[{"email":"tao_qiufeng@126.com","name":"taoqf"}],"description":"时间选择","keywords":["feidao","01feidao","dfeidao","atom","飞道","控件","ai"],"repository":{"type":"git","url":"https://gitee.com/dfeidao/widgets"},"author":{"name":"taoqf","email":"tao_qiufeng@126.com","url":"http://www.01feidao.com/"},"license":"MIT","readme":"# 时间选择\n\n<https://dfeidao.gitee.io/widgets/>\n\n## Installation\n\n```sh\nyarn add --dev @dfeidao/fd-w000008\n```\n\n## Tag\n\n```html\n<fd-w000008></fd-w000008>\n```\n\n## Attributes\n\n### `z-index`\n\n该控件所处的页面层级，为空则默认没有设置 【string】\n\n## Methods\n\n### `show`\n\n> 无参数\n\n控件默认为隐藏状态，调用可使控件显示。\n\n#### html\n\n```html\n<div id=\"fd-w000008-002\" style=\"height: 2rem;background: rgb(40, 219, 36);line-height: 2rem;\"></div>\n<fd-w000008 id=\"fd-w000008-001\" style=\"width:50em;height:30em;display:block;position: absolute;\">\n</fd-w000008>\n```\n\n#### js\n\n```javascript\nconst fd_w000008_001 = document.querySelector('#fd-w000008-001');\nconst fd_w000008_002 = document.querySelector('#fd-w000008-002');\n\nfd_w000008_002.addEventListener('click', () => {\n  fd_w000008_001.show();\n});\nfd_w000008_001.addEventListener('fdwe-select-time', (res) => {\n  const start_str = res.start_str;\n  const end_str = res.end_str;\n  const content = start_str + ' - ' + end_str;\n  fd_w000008_002.innerHTML = content;\n});\n```\n\n### `hide`\n\n> 无参数\n\n使控件呈现为隐藏状态。\n\n#### html\n\n```html\n<button id=\"fd-w000008-005\">hide_btn</button>\n<div id=\"fd-w000008-004\" style=\"height: 2rem;background: rgb(40, 219, 36);line-height: 2rem;\"></div>\n<fd-w000008 id=\"fd-w000008-003\" style=\"width:50em;height:30em;display:block;position: absolute;\">\n</fd-w000008>\n```\n\n#### js\n\n```javascript\nconst fd_w000008_003 = document.querySelector('#fd-w000008-003');\nconst fd_w000008_004 = document.querySelector('#fd-w000008-004');\nconst fd_w000008_005 = document.querySelector('#fd-w000008-005');\n\nfd_w000008_004.addEventListener('click', () => {\n  fd_w000008_003.show();\n});\nfd_w000008_005.addEventListener('click', () => {\n  fd_w000008_003.hide();\n});\n```\n\n## Events\n\n#### feidao-web事件绑定示例\n\n```html\n<fd-w000008 data-feidao-actions=\"fdwe-select-time:a001\">\n</fd-w000008>\n```\n\n### `fdwe-select-time`\n\n> 参数示例\n\n```json\n{\"start_str\": \"05:59\", \"end_str\": \"20:59\"}\n```\n\n选择时间区间后，控件发出的事件，输出参数为：start_str，end_str\n\n## Solt\n\n### time\n\n> 在自定义控件内添加新节点，设置其属性为 solt=\"time\" ，即可产生新的时间选择区间。同时需要给新节点添加的属性入下\n\n 属性名 | 作用\n -|-|-\n slot | 固定值solt=\"time\", 用来标示自定义时间区间\n interval  | 设置间隔【string】\n is-before | 设置时间选择区间在此刻之前还是之后。true之前，false为之后\n\n### btn-sure\n\n> 在自定义控件内添加新节点，设置其属性为 solt=\"btn-sure\" ，即可自定义“确定按钮”，自动绑定确定事件，不用使用者再添加绑定事件。\n\n### btn-cancle\n\n> 在自定义控件内添加新节点，设置其属性为 solt=\"btn-cancle\" ，即可自定义“取消按钮”，自动绑定取消事件，不用使用者再添加绑定事件。\n\n## Example\n\n### 设置页面层级\n\n```html\n<fd-w000008 style=\"width:50em;height:30em;display:block;position: absolute;\" z-index=9999></fd-w000008>\n```\n\n### 选择区间\n\n> 参数说明：interval为分钟时长，以分钟为单位；is-before是否是之前时间，包括现在在内的之前都为true，今天之后的为false；\n\n#### html\n\n```html\n<div id=\"fd-w000008-007\" style=\"height: 2rem;background: rgb(40, 219, 36);line-height: 2rem;\"></div>\n<fd-w000008 id=\"fd-w000008-006\" style=\"width:50em;height:30em;display:block;position: absolute;\">\n  <div style=\"width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em\" interval=\"1\" is-before=\"true\"\n    slot=\"time\">\n    现在\n  </div>\n  <div style=\"width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em\" interval=\"10\" is-before=\"true\"\n    slot=\"time\">\n    之前10分钟\n  </div>\n  <div style=\"width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em\" interval=\"50\" is-before=\"true\"\n    slot=\"time\">\n    之前50分钟\n  </div>\n  <div style=\"width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em\" interval=\"50\" is-before=\"false\"\n    slot=\"time\">\n    之后50分钟\n  </div>\n  <div style=\"width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em\" interval=\"300\" is-before=\"false\"\n    slot=\"time\">\n    之后300分钟\n  </div>\n</fd-w000008>\n```\n\n#### js\n\n```javascript\nconst fd_w000008_007 = document.querySelector('#fd-w000008-007');\nconst fd_w000008_006 = document.querySelector('#fd-w000008-006');\n\nfd_w000008_007.addEventListener('click', () => {\n  fd_w000008_006.show();\n});\nfd_w000008_006.addEventListener('fdwe-select-time', (res) => {\n  const start_str = res.start_str;\n  const end_str = res.end_str;\n  const content = start_str + ' - ' + end_str;\n  fd_w000008_007.innerHTML = content;\n});\n```\n\n### 确定按钮\n\n```text\n自定义的确定按钮必须具有 solt 属性，solt=\"btn-sure\"\n```\n\n```html\n<fd-w000008 style=\"width:50em;height:30em;display:block;position: absolute;\">\n  <div slot=\"btn-sure\" style=\"width: 10em;height: 3em;background: lightgoldenrodyellow;display: block;line-height: 3em;text-align: center;\">确定</div>\n</fd-w000008>\n```\n\n### 取消按钮\n\n```text\n自定义的取消按钮必须具有 solt 属性，solt=\"btn-cancle\"\n```\n\n```html\n<fd-w000008 style=\"width:50em;height:30em;display:block;position: absolute;\">\n  <div slot=\"btn-cancle\" style=\"width: 10em;height: 3em;background: lightgoldenrodyellow;display: block;line-height: 3em;text-align: center;\">取消</div>\n</fd-w000008>\n```\n\n### 完整功能示例\n\n#### html\n\n传入要测试的控件的html代码。例：\n\n```html\n<link href=\"../node_modules/purecss/build/grids.css\" type=\"text/css\" rel=\"stylesheet\">\n<link href=\"//cdn.jsdelivr.net/npm/feidao-css/feidao.css\" type=\"text/css\" rel=\"stylesheet\">\n<link href=\"//cdn.jsdelivr.net/npm/feidao-css/theme/blue.css\" type=\"text/css\" rel=\"stylesheet\">\n<div class=\"pure-g\">\n   <div class=\"pure-u-1\">\n      <section>\n         <div id=\"fd-w000008-009\" style=\"height: 2rem;background: rgb(40, 219, 36);line-height: 2rem;\"></div>\n         <fd-w000008 id=\"fd-w000008-008\" style=\"width:50em;height:30em;display:block;position: absolute;\" z-index=9999>\n            <div style=\"width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em\" interval=\"1\" is-before=\"true\"\n            slot=\"time\">\n               现在\n            </div>\n            <div style=\"width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em\" interval=\"10\" is-before=\"true\"\n            slot=\"time\">\n               之前10分钟\n            </div>\n            <div style=\"width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em\" interval=\"50\" is-before=\"true\"\n            slot=\"time\">\n               之前50分钟\n            </div>\n            <div style=\"width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em\" interval=\"50\" is-before=\"false\"\n            slot=\"time\">\n               之后50分钟\n            </div>\n            <div style=\"width: 10em;height: 1.5em;background: whitesmoke;line-height: 1.5em;margin:0.2em\" interval=\"300\" is-before=\"false\"\n            slot=\"time\">\n               之后300分钟\n            </div>\n         </fd-w000008>\n      </section>\n   </div>\n</div>\n```\n\n#### js\n\n传入要测试的控件的js代码。例：\n\n```javascript\nconst fd_w000008_008 = document.querySelector('#fd-w000008-008');\nconst fd_w000008_009 = document.querySelector('#fd-w000008-009');\n\nfd_w000008_009.addEventListener('click', () => {\n  console.log('-------- show -------');\n  fd_w000008_008.show();\n});\nfd_w000008_008.addEventListener('fdwe-select-time', (res) => {\n  console.log('---------', res);\n  const start_str = res.start_str;\n  const end_str = res.end_str;\n  const content = start_str + ' - ' + end_str;\n  fd_w000008_009.innerHTML = content;\n});\n```\n","readmeFilename":"readme.md"}