{"ast":null,"code":"export default {\n  name: \"tabBar\",\n  data() {\n    return {};\n  },\n  methods: {\n    changeTab(index) {\n      this.$emit('changeTab', index);\n    }\n  },\n  props: {\n    activeTab: {\n      type: Number,\n      default: 0\n    },\n    serverList: {\n      type: Array,\n      default: []\n    }\n  }\n};","map":{"version":3,"names":["name","data","methods","changeTab","index","$emit","props","activeTab","type","Number","default","serverList","Array"],"sources":["src/components/tabBar.vue"],"sourcesContent":["<template>\r\n  <div class=\"tab_content\">\r\n    <div class=\"top_line\"></div>\r\n    <div class=\"tab_wrap\">\r\n      <div v-for=\"(item, index) in serverList\" @click=\"changeTab(index)\" class=\"tab_item\" :class=\"{ 'tab_active': index == activeTab }\">\r\n        {{ item.serverName }}\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n  export default {\r\n    name: \"tabBar\",\r\n    data() {\r\n      return {\r\n      }\r\n    },\r\n    methods: {\r\n      changeTab(index) {\r\n        this.$emit('changeTab', index)\r\n      }\r\n    },\r\n    props: {\r\n      activeTab: {\r\n        type: Number,\r\n        default: 0\r\n      },\r\n      serverList: {\r\n        type: Array,\r\n        default: []\r\n      }\r\n    }\r\n  }\r\n</script>\r\n\r\n<style scoped lang=\"less\">\r\n  .tab_content {\r\n    background: #FAFAFA;\r\n    padding-top: 10px;\r\n    .top_line {\r\n      width: 34px;\r\n      height: 3px;\r\n      background: #9FA5B4;\r\n      border-radius: 3px;\r\n      opacity: 0.19;\r\n      margin: 0 auto;\r\n    }\r\n    .tab_wrap {\r\n      padding-top: 10px;\r\n      display: flex;\r\n      border-bottom: 1px solid #F1F2F5;\r\n      .tab_item {\r\n        flex: 1;\r\n        padding: 10px 0;\r\n        text-align: center;\r\n        font-size: 15px;\r\n        color: rgba(0, 0, 0, 0.4);\r\n        font-weight: 500;\r\n      }\r\n      .tab_active {\r\n        position: relative;\r\n        font-weight: 600;\r\n        color: #3678FF;\r\n      }\r\n      .tab_active:after {\r\n        display: inline-block;\r\n        content: '';\r\n        width: 18px;\r\n        height: 3px;\r\n        background: linear-gradient(270deg, #33A3FF 0%, #176AFE 100%);\r\n        border-radius: 2px;\r\n        position: absolute;\r\n        bottom: 0;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n      }\r\n    }\r\n  }\r\n</style>\r\n"],"mappings":"AAYA;EACAA,IAAA;EACAC,KAAA;IACA,QACA;EACA;EACAC,OAAA;IACAC,UAAAC,KAAA;MACA,KAAAC,KAAA,cAAAD,KAAA;IACA;EACA;EACAE,KAAA;IACAC,SAAA;MACAC,IAAA,EAAAC,MAAA;MACAC,OAAA;IACA;IACAC,UAAA;MACAH,IAAA,EAAAI,KAAA;MACAF,OAAA;IACA;EACA;AACA"},"metadata":{},"sourceType":"module","externalDependencies":[]}