All files / src/vtips component.js

0% Statements 0/7
0% Branches 0/2
0% Functions 0/3
0% Lines 0/5
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                                                                                                                                           
export default {
  name: 'vTips',
  data () {
    return {
      exist: false
    }
  },
  props: {
    position: {
      type: Object,
      default: () => {
        return {
          top: 0,
          left: 0
        }
      }
    },
    message: {
      type: String,
      default: ''
    },
    errorClass: {
      type: String,
      default: ''
    },
    errorIcon: {
      type: String,
      default: ''
    }
  },
  render (h) {
    if (!this.exist) return
    return h('div', {
      style: {
        fontSize: '12px',
        color: '#333',
        position: 'absolute',
        top: this.position.top + 'px',
        left: this.position.left + 'px',
        backgroundColor: '#fff',
        padding: '2px 8px',
        margin: 0,
        zIndex: '99',
        boxShadow: '0 2px 4px rgba(0,0,0,.12), 0 0 6px rgba(0,0,0,.04)',
        borderRadius: '4px'
      },
      class: [this.errorClass]
    }, [
      h('i', {
        class: [this.errorIcon]
      }),
      h('b', {
        style: {
          position: 'absolute',
          left: '4px',
          bottom: '-5px',
          width: '8px',
          height: '8px',
          display: 'block',
          borderRight: '1px solid rgba(0,0,0,.1)',
          transform: 'rotateZ(45deg)',
          borderBottom: '1px solid rgba(0,0,0,.1)',
          borderSizing: 'border-box',
          backgroundColor: '#fff'
        }
      }),
      h('span', this.message)
    ])
  }
}