// 在项目入口文件
import Vue from 'vue';
// 圆环型取色盘
import choiceColor from 'vue-circle-choice';
// 半圆型导航
import circularNav from 'vue-circle-choice';

Vue.component('choiceColor', choiceColor);
Vue.component('circularNav', circularNav);

// 在某个组件中
import choiceColor from 'vue-circle-choice';
import circularNav from 'vue-circle-choice';

export default {
  components: {
    choiceColor,
    circularNav,
  },
};

const colors = [
  '#1ba6cc',
  '#189ba7',
  '#98c6ae',
  '#45a270',
  '#7cb325',
  '#eb9826',
];

data() {
  return {
    colors,
    index: 0,
    color: this.colors[0],
  };
},
methods: {
  updateColor({ index, color }) {
    this.index = index;
    this.color = color;
  },
}

const navs = [{
  label: 'Discover',
  href: 'javascript:void(0)',
  icon: 'icon-discover',
}, {
  label: 'Home',
  href: 'javascript:void(0)',
  icon: 'icon-home',
}, {
  label: 'My',
  href: 'javascript:void(0)',
  icon: 'icon-my',
}];

data() {
  return {
    index: 0,
    color: '#1ba6cc',
    navs,
  };
},
methods: {
  updateNav(index) {
    this.index = index;
  },
}