coding

src/components/Common/Directives/GridBox.js

@@ -1,56 +0,0 @@
-const calcColumnsStyle = (columns, columnGap) => {
-  if (!(columns instanceof Array) || columns.length === 0) return ''
-  const total = columns.reduce((cur, c, i) => (typeof c === 'number' ? cur + c : cur), 0)
-  const baseColumn = columns.reduce(
-    (cur, c, i) => (typeof c === 'string' ? cur + ` - ${c}` : cur),
-    `100% - ${columnGap} * ${columns.length - 1}`
-  )
-  return columns
-    .map((c) => {
-      return typeof c === 'number' ? `calc((${baseColumn}) * ${c} / ${total})` : c
-    })
-    .join(' ')
-}
-
-const calcRowsStyle = (rows, rowGap) => {
-  if (!(rows instanceof Array) || rows.length === 0) return ''
-  const total = rows.reduce((cur, c, i) => (typeof c === 'number' ? cur + c : cur), 0)
-  const baseRow = rows.reduce(
-    (cur, c, i) => (typeof c === 'string' ? cur + ` - ${c}` : cur),
-    `100% - ${rowGap} * ${rows.length - 1}`
-  )
-  return rows
-    .map((c) => {
-      return typeof c === 'number' ? `calc((${baseRow}) * ${c} / ${total})` : c
-    })
-    .join(' ')
-}
-
-export default {
-  bind(el, binding, vnode, oldVnode) {
-    // console.log('----bind----', el, binding, vnode, oldVnode)
-    const { columns = [1], rows = [1], gap = '20px' } = binding.value
-    const [columnGap, rowGap = columnGap] = gap.split(' ')
-    el.style.display = 'grid'
-    el.style.gridTemplateColumns = calcColumnsStyle(columns, columnGap)
-    el.style.gridTemplateRows = calcRowsStyle(rows, rowGap)
-    el.style.gridGap = `${columnGap} ${rowGap}`
-  },
-  inserted(el, binding, vnode, oldVnode) {
-    // console.log('----inserted----', el, binding, vnode, oldVnode)
-  },
-  update(el, binding, vnode, oldVnode) {
-    // console.log('----update----', el, binding, vnode, oldVnode)
-    const { columns = [1], rows = [1], gap = '20px' } = binding.value
-    const [columnGap, rowGap = columnGap] = gap.split(' ')
-    el.style.gridTemplateColumns = calcColumnsStyle(columns, columnGap)
-    el.style.gridTemplateRows = calcRowsStyle(rows, rowGap)
-    el.style.gridGap = `${columnGap} ${rowGap}`
-  },
-  componentUpdated(el, binding, vnode, oldVnode) {
-    // console.log('----componentUpdated----', el, binding, vnode, oldVnode)
-  },
-  unbind(el, binding, vnode, oldVnode) {
-    // console.log('----unbind----', el, binding, vnode, oldVnode)
-  },
-}