rainbro 4 weeks ago
parent
commit
c5bec530a8
  1. 35
      src/components/SliderScond.vue

35
src/components/SliderScond.vue

@ -6,16 +6,19 @@
<div class="flex-between gap8 collapse-item"> <div class="flex-between gap8 collapse-item">
<div class="flex gap8 "> <div class="flex gap8 ">
<GuipToolTip :content="item[renderKeyNew.menuTitle]"> <GuipToolTip :content="item[renderKeyNew.menuTitle]">
<span class="flex gap8 menu-name"><img width="20px" :src="require('@/assets/serviceIcon/ver_'+item.type+'.svg')" alt="">{{ item[renderKeyNew.menuTitle] }}</span> <div class="flex gap8 menu-name"><img width="20px" :src="require('@/assets/serviceIcon/ver_'+item.type+'.svg')" alt=""><span >{{ item[renderKeyNew.menuTitle] }}</span></div>
</GuipToolTip> </GuipToolTip>
<span v-if="item[renderKeyNew.selected]" class="menu-select"></span> <!-- <span v-if="item[renderKeyNew.selected]" class="menu-select"></span> -->
</div> </div>
<img class="arrow_img" :class="{ 'is-active': activeNames.includes(item[renderKeyNew.domName]) }" <div class="flex gap8">
<span v-if="item[renderKeyNew.selected]" class="menu-select"></span>
<img class="arrow_img" :class="{ 'is-active': activeNames.includes(item[renderKeyNew.domName]) }"
src="@/assets/input_ex_ic.png" alt=""> src="@/assets/input_ex_ic.png" alt="">
</div>
</div> </div>
</template> </template>
<div v-for="(item1, index1) in item.list" @click="setActiveCur(item1, item, index)" <div v-for="(item1, index1) in item.list" @click="setActiveCur(item1, item, index)"
:class="['flex-between point', activeFloor == item1[renderKeyNew.subtitle] ? 'curActive' : '']" :class="['flex-between point gap8', activeFloor == item1[renderKeyNew.subtitle] ? 'curActive' : '']"
:key="index1"> :key="index1">
<span class="l-menu-name">{{ item1[renderKeyNew.subtitle] }}</span> <span class="l-menu-name">{{ item1[renderKeyNew.subtitle] }}</span>
<img v-if="item1[renderKeyNew.SubSelected]" class="selected" src="../assets/menu/is_selected.png" alt=""> <img v-if="item1[renderKeyNew.SubSelected]" class="selected" src="../assets/menu/is_selected.png" alt="">
@ -264,7 +267,7 @@ export default {
} }
::v-deep .el-collapse-item__header { ::v-deep .el-collapse-item__header {
max-width: 120px; max-width: 162px;
} }
.arrow_img { .arrow_img {
@ -288,20 +291,26 @@ export default {
padding: 11px 0; padding: 11px 0;
height: 40px; height: 40px;
line-height: 18px; line-height: 18px;
max-width: 80px; width: 120px;
// max-width: 96px;
box-sizing: border-box; box-sizing: border-box;
overflow: hidden; span{
white-space: nowrap; // max-width: 50px;
text-overflow: ellipsis; // width: 50px;
text-align: left;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
} }
.l-menu-name { .l-menu-name {
max-width: 90px; // max-width: 90px;
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
color: #8A9099; color: #8A9099;
padding: 9px 0; padding: 7px 0;
height: 36px; height: 36px;
box-sizing: border-box; box-sizing: border-box;
} }
@ -321,8 +330,8 @@ export default {
} }
.el-collapse { .el-collapse {
min-width: 158px; min-width: 200px;
max-width: 158px; max-width: 200px;
background-color: #fff; background-color: #fff;
height: 100%; height: 100%;
overflow-y: auto; overflow-y: auto;

Loading…
Cancel
Save