|
|
<template>
|
|
|
<div class="filter-sub-detail">
|
|
|
<dl v-for="item in indexData" :key="item.index">
|
|
|
<dt class="index" :id="item.index">{{item.index}}</dt>
|
|
|
<dd class="item" v-for="brand in currentData[item.index]" :key="brand.id" :class="{'active': brand.checked}" @click="select(brand)">
|
|
|
<div class="item-inner">{{brand.name}}</div>
|
|
|
<div class="item-check">
|
|
|
<i class="icon icon-check"></i>
|
|
|
</div>
|
|
|
</dd>
|
|
|
</dl>
|
|
|
<div class="filter-sub-detail-content">
|
|
|
<div class="filter-sub-detail">
|
|
|
<dl v-for="item in indexData" :key="item.index">
|
|
|
<dt class="index" :id="item.index">{{item.index}}</dt>
|
|
|
<dd class="item" v-for="brand in currentData[item.index]" :key="brand.id" :class="{'active': brand.checked}" @click="select(brand)">
|
|
|
<div class="item-inner">{{brand.name}}</div>
|
|
|
<div class="item-check">
|
|
|
<i class="icon icon-check"></i>
|
|
|
</div>
|
|
|
</dd>
|
|
|
</dl>
|
|
|
</div>
|
|
|
<index-list class="filter-index-list" :index-list="indexData" @loc-index="locIndex"></index-list>
|
|
|
</div>
|
|
|
</template>
|
...
|
...
|
@@ -113,6 +115,11 @@ |
|
|
top: 50%!important;
|
|
|
transform: translateY(-50%);
|
|
|
}
|
|
|
.filter-sub-detail-content {
|
|
|
position: absolute;
|
|
|
height: 100%;
|
|
|
width: 100%;
|
|
|
}
|
|
|
|
|
|
|
|
|
</style> |
...
|
...
|
|