vue遍历固定几个颜色

<template>
  <li v-for="(item,index) in workList" :key="index" class="workLi" :class="top[index]">
                    <div class="workListLeft">
                        <h3 class="workT">
                            <span>{{ item.APP_NAME }}</span>
                            <!--                            <img src="../../assets/images/打开.png" alt/>-->
                        </h3>
                        <div class="all">
                            全部待办 :
                            <span>{{ item.countOfAllTask }}</span>
                        </div>
                        <div class="warn">
                            预警工单 :
                            <span>{{ item.countOfWarningTask }}</span>
                        </div>
                        <div class="wwc">
                            超期工单 :
                            <span>{{ item.countOfOutTimeTask }}</span>
                        </div>
            <div>
                            <van-button color="#06f" style="background-color: #ddd;border: none" round size="small"
                                        plain type="info" @click="openapp(item)">立即前往
                            </van-button>
                        </div>
                    </div>
                    <div class="workListRight">
                        <img :src="item.APP_LOGO" alt/>
                    </div>
                </li>
            </ul>
</template>

<style>
.top1 {
    background-image: linear-gradient(to bottom right, #C4E759, #6DE195);
}

.top2 {
    background-image: linear-gradient(to bottom right, #54E38E, #41C7AF);
}

.top3 {
    background-image: linear-gradient(to bottom right, #D4fC78, #99E5A2);
}

.top4 {
    background-image: linear-gradient(to bottom right, #C1E3FF, #ABC7FF);
}

.top5 {
    background-image: linear-gradient(to bottom right, #8DEBFF, #6CACFF);
}

.top6 {
    background-image: linear-gradient(to bottom right, #41D8DD, #5583EE);
}
</style>
data(){
return {
  top: [
                "top1",
                "top2",
                "top3",
                "top4",
                "top5",
                "top6",
            ],
       }
}