<template>
<div class="order">
<div class="order-tabs">
<ul class="clearfix">
<li v-for="(item,index) in tabsList" @click="onAddClass(index)" :class="{\'order-active\':index==orderNum}">{{item.name}}</li>
</ul>
</div>
</div>
</template>
<script>
export default {
name: \'order\',
data() {
return {
tabsList:[
{name:\'全部\',num:0},
{name:\'待付款\',num:1},
{name:\'待使用\',num:2},
{name:\'待评价\',num:3},
{name:\'退款\',num:4},
],
orderNum:0
}
},
methods:{
onAddClass(i){
this.orderNum = i;
}
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less" scoped>
.order-active{
border-bottom: 3px solid #1e8beb;
color: #1e8beb;
}
@import \'../../common/css/center/order\';
</style>