bmui/es/vue/components/segment.js

Bluemoon Moon Components

var __render = function __render() {
  var _vm = this;

  var _h = _vm.$createElement;

  var _c = _vm._self._c || _h;

  return _c('nav', {
    staticClass: "bmui-segment"
  }, _vm._l(_vm.items, function (item, i) {
    return _c('label', {
      key: i,
      "class": ['bmui-segment-item', {
        'bmui-segment-active': _vm.indexInside === i
      }]
    }, [_c('div', {
      staticClass: "bmui-segment-box"
    }, [_c('div', {
      staticClass: "bmui-segment-box2"
    }, [_c('button', {
      staticClass: "bmui-segment-text",
      attrs: {
        "type": "button"
      },
      on: {
        "click": function click($event) {
          _vm.indexInside = i;
        }
      }
    }, [_vm._v(_vm._s((typeof item === 'string' ? item : item.name) || 'ITEM'))]), _vm._v(" "), typeof item.mark === 'number' ? _c('i', {
      "class": item.mark > 9 ? 'bmui-segment-mark' : 'bmui-segment-single-mark'
    }, [_vm._v(_vm._s(item.mark > 99 ? '99+' : item.mark))]) : _vm._e(), _vm._v(" "), item.mark === 'redMark' ? _c('i', {
      staticClass: "bmui-segment-redMark"
    }) : _vm._e()])])]);
  }), 0);
};

var __staticRender = [];
export default {
  render: __render,
  staticRenderFns: __staticRender,
  name: 'BmuiSegment',
  props: {
    items: {
      type: Array,
      "default": function _default() {
        return [];
      }
    },
    index: {
      type: Number,
      "default": null
    }
  },
  data: function data() {
    return {
      indexInside: null
    };
  },
  watch: {
    index: function index(v) {
      this.indexInside = v;
    },
    indexInside: function indexInside(v) {
      this.$emit('change', v);
    }
  },
  created: function created() {
    this.indexInside = this.index;
  }
};