<template>
  <div>
    <div>
      <!-- <ul class="flex-align-center">
        <li :class="brand_act === item.sa_brandid?'act':''" class="brand-item" v-for="item in brands" :key="item.sa_brandid" @click="clickBrand(item.sa_brandid)">{{item.brandname}}</li>
      </ul> -->
    </div>
    <div>

    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      value:'',
      brands:[],
      brand_act:0
    }
  },
  methods:{
    async queryBrands () {
      const res = await this.$api.requested({
        "id": "20220922085103",
        "version":1,
        "content": {
          "pageSize":1000,
          "where":{
            "condition":""
          }
        }
      })
      this.brands = res.data
    },
    async querySalerClass () {
      const res = await this.$api.requested({
         "id": "20220922110403",
          "version":1,
          "content": {
            "sa_brandid":this.brand_act
          }
      })
      this.SalerClassList = res.data
    },
    clickBrand (id) {
      this.brand_act = id
      this.querySalerClass()
    }
  },
  mounted () {
    this.queryBrands()
  }
}

</script>
<style>
</style>
<style scoped>
.brand-item{
  margin-right: 20px;
  color: #768093;
  cursor: pointer;
  transition: .2s all linear;
  font-size: 14px;
}
.act{
  color:#000;
}
.border-bottom{
  border-bottom: 1px solid #e3e5ea;
}
</style>