|
@ -1,12 +1,18 @@ |
|
|
<template> |
|
|
<template> |
|
|
<div class='congestion'> |
|
|
<div class='congestion'> |
|
|
<div :style="{ width: dataList.length * 300 }"> |
|
|
<div :style="{ width: dataList.length * 300 }"> |
|
|
<div :class="selectIndex == index ? selectLine < 1 ? 'item action Abefore' : 'item action Aafter' : selectIndex + selectLine == index ? selectLine < 1 ? 'item action Aafter' : 'item action Abefore' : 'item'" |
|
|
|
|
|
|
|
|
<div :class="selectIndex == index ? |
|
|
|
|
|
(selectLine < 1 ? 'item action Abefore' : 'item action Aafter') : |
|
|
|
|
|
(selectIndex + selectLine == index ? |
|
|
|
|
|
(selectLine < 1 ? 'item action Aafter' : 'item action Abefore') : 'item')" |
|
|
v-for="(item, index) in dataList" :key="index"> |
|
|
v-for="(item, index) in dataList" :key="index"> |
|
|
|
|
|
|
|
|
<i class="after" @click="selectItem(index, -1, dataList[index - 1])"></i> |
|
|
<i class="after" @click="selectItem(index, -1, dataList[index - 1])"></i> |
|
|
<i class="before" @click="selectItem(index, +1, item)"></i> |
|
|
<i class="before" @click="selectItem(index, +1, item)"></i> |
|
|
<span></span> |
|
|
<span></span> |
|
|
<div>{{ item.title }}</div> |
|
|
<div>{{ item.title }}</div> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
@ -44,7 +50,7 @@ export default { |
|
|
this.selectIndex = index; |
|
|
this.selectIndex = index; |
|
|
this.selectLine = num; |
|
|
this.selectLine = num; |
|
|
if (item) |
|
|
if (item) |
|
|
this.$emit("selectItem", item); |
|
|
this.$emit("selectItem", item, index); |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
mounted() { |
|
|
mounted() { |
|
|