block.js
6 years ago
component.js
6 years ago
schema.js
6 years ago
style.css
6 years ago
style.css.map
6 years ago
style.scss
6 years ago
component.js
104 lines
| 1 | import React from 'react'; |
| 2 | |
| 3 | const { lodash } = window; |
| 4 | const { times } = lodash; |
| 5 | const {InnerBlocks} = wp.editor; |
| 6 | |
| 7 | export class Component extends React.Component { |
| 8 | |
| 9 | render() { |
| 10 | |
| 11 | const { |
| 12 | colNum, |
| 13 | innerTag |
| 14 | } = this.props.attributes; |
| 15 | let for_ = this.props.for_; |
| 16 | const ALLOWED_BLOCKS = ['vk-blocks/th','vk-blocks/td']; |
| 17 | |
| 18 | /** |
| 19 | * Get Th Block to repeat. |
| 20 | * @param colNum |
| 21 | * @returns {Array} |
| 22 | */ |
| 23 | const getTh = (colNum) => { |
| 24 | return times(colNum, () => ["vk-blocks/th"]); |
| 25 | }; |
| 26 | /** |
| 27 | * Get Th Block to repeat. |
| 28 | * @param colNum |
| 29 | * @returns {Array} |
| 30 | */ |
| 31 | const getTd = (colNum) => { |
| 32 | return times(colNum, () => ["vk-blocks/td"]); |
| 33 | }; |
| 34 | |
| 35 | /** |
| 36 | * Switch Element type for Editor or View. |
| 37 | * @param colNum |
| 38 | * @returns {*} |
| 39 | */ |
| 40 | const templateInnerTr = (colNum) => { |
| 41 | |
| 42 | //エディタとビューの切り替え |
| 43 | if (for_ === 'edit') { |
| 44 | return <tr><InnerBlocks |
| 45 | template={getTd(colNum)} |
| 46 | templateLock="all" |
| 47 | ALLOWED_BLOCKS={ALLOWED_BLOCKS} |
| 48 | /></tr>; |
| 49 | } else if ('save') { |
| 50 | return <tr><InnerBlocks.Content |
| 51 | template={getTd(colNum)} |
| 52 | templateLock="all" |
| 53 | ALLOWED_BLOCKS={ALLOWED_BLOCKS} |
| 54 | /></tr>; |
| 55 | } |
| 56 | }; |
| 57 | |
| 58 | const templateInnerTrSimpleTable = () => { |
| 59 | |
| 60 | //エディタとビューの切り替え |
| 61 | if (for_ === 'edit') { |
| 62 | return <tr> |
| 63 | <InnerBlocks |
| 64 | template={[["vk-blocks/th"],["vk-blocks/td"]]} |
| 65 | templateLock="all" |
| 66 | ALLOWED_BLOCKS={ALLOWED_BLOCKS} |
| 67 | /> |
| 68 | </tr>; |
| 69 | } else if ('save') { |
| 70 | return <tr> |
| 71 | <InnerBlocks.Content |
| 72 | template={[["vk-blocks/th"],["vk-blocks/td"]]} |
| 73 | templateLock="all" |
| 74 | ALLOWED_BLOCKS={ALLOWED_BLOCKS} |
| 75 | /> |
| 76 | </tr>; |
| 77 | } |
| 78 | }; |
| 79 | |
| 80 | /** |
| 81 | * Add Col indicated by RangeControl Number. |
| 82 | * @param colNum |
| 83 | * @returns {string} |
| 84 | */ |
| 85 | const addCol = (colNum) => { |
| 86 | |
| 87 | let returnElm = ''; |
| 88 | switch (innerTag) { |
| 89 | case 'vk-blocks/simple-table': |
| 90 | returnElm = templateInnerTrSimpleTable(); |
| 91 | break; |
| 92 | default: |
| 93 | for (let i = 0; i < colNum; i++) { |
| 94 | returnElm = templateInnerTr(colNum); |
| 95 | } |
| 96 | break; |
| 97 | } |
| 98 | return returnElm; |
| 99 | }; |
| 100 | |
| 101 | return (addCol(colNum)); |
| 102 | } |
| 103 | } |
| 104 |