Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 | 26x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 26x 26x 26x 26x 4x 26x | <script>
function getCells(props, option) {
return option.scopedSlots ?
option.scopedSlots({
data: props.data,
index: props.index,
active: props.active,
matchedMedia: props.matchedMedia
}) :
props.data[option.name]
}
/**
* Checks for click on interactive lement: <a> or <button>
* to prevent redirect
*
* @param {HTMLElement} eventTarget - clicked target
* @return {Boolean} if this was a click on interactive element
*/
function isInteraction(eventTarget) {
let interaction = false
const elements = ['A', 'BUTTON']
const match = el => elements.includes(el.tagName)
while ( ! interaction && eventTarget.tagName !== 'TR' ) {
if ( match(eventTarget) ) interaction = true
eventTarget = eventTarget.parentElement
}
return interaction
}
function emitOnClick(event) {
I if ( isInteraction(event.target) ) return
this.listeners.click.call(window, this.props)
}
function setActive(event) {
event.preventDefault();
event.stopPropagation();
this.listeners.setActive(this.props.index, !this.props.active);
}
export default {
name: 'tb-row',
functional: true,
props: {
data: {
type: Object,
required: true
},
tableOptions: {
type: Array,
required: true
},
index: {
type: Number,
required: true
},
active: {
type: Boolean,
default: false
},
url: String,
matchedMedia: Array,
showToggler: {
type: Boolean,
default: false
}
},
render(h, ctx) {
const props = ctx.props
const cells = props.tableOptions.map( (option, i) => {
return h('td', {
staticClass: [option.className],
key: i
}, getCells(props, option))
})
//Mobile toggle button
if ( props.showToggler ) {
cells.push(
h('td', {
key: 'toggler',
on:{ click: setActive.bind(ctx) },
attrs: {class: 'int-table__control-tab'}
}, [
h('a', {attrs: {class:'int-table__show', href: ''}}, [
h('i', {attrs: {class:'icon icon-box-down'}})
])
])
)
}
return h('tr', {
staticClass: 'int-table__block',
class: { active: props.active, 'is-link': props.url },
key: props.index + '-row',
on: props.url ? { click: emitOnClick.bind(ctx) } : undefined }, cells )
}
}
</script>
|