提交 de3776ee 编写于 作者: Neuromancer255's avatar Neuromancer255

多数据视图快速分组组件样式调整 --fix4

上级 6eb6dbcb
...@@ -45,8 +45,14 @@ ...@@ -45,8 +45,14 @@
padding: 10px 20px; padding: 10px 20px;
border-bottom: 1px solid #a8a8a8; border-bottom: 1px solid #a8a8a8;
display: flex; display: flex;
font-size: 13px;
color: #a8a8a8;
align-items: center; align-items: center;
} }
.selected {
color: black;
background-color: #b6b6b63d;
}
} }
.app-quick-group > .quick-group-tab:first-child { .app-quick-group > .quick-group-tab:first-child {
border-top-left-radius: 5px; border-top-left-radius: 5px;
......
...@@ -13,14 +13,14 @@ ...@@ -13,14 +13,14 @@
</div> </div>
</div> </div>
</div> </div>
<div v-if="subItems.length > 0" class="child-list"> <div ref="child-list" v-if="subItems.length > 0" class="child-list">
<div class="child" v-for="(item,index) in subItems" :key="index" @click="handleClick(item)"> <div :class="{'child':true,'selected':item.selected}" v-for="(item,index) in subItems" :key="index" @click="handleClick(item)">
<span> <span>
<ion-icon v-if=" item.iconcls && !Object.is(item.iconcls, '')" :name="item.iconcls"></ion-icon> <ion-icon v-if=" item.iconcls && !Object.is(item.iconcls, '')" :name="item.iconcls"></ion-icon>
<img v-else-if="item.icon && !Object.is(item.icon, '')" :src="item.icon" /> <img v-else-if="item.icon && !Object.is(item.icon, '')" :src="item.icon" />
<span>{{item.label}}</span> <span>{{item.label}}</span>
</span> </span>
<ion-icon v-if="item.selected" name="checkbox-outline"></ion-icon> <ion-icon v-if="item.selected" style="margin-left:auto" name="checkbox-outline"></ion-icon>
</div> </div>
</div> </div>
</div> </div>
...@@ -172,6 +172,10 @@ export default class AppQuickGroupTab extends Vue { ...@@ -172,6 +172,10 @@ export default class AppQuickGroupTab extends Vue {
} }
} else { } else {
this.subItems.length = 0; this.subItems.length = 0;
this.items.forEach((item:any) => {
item.selected = false;
})
$event.selected = true;
this.$emit("valuechange", $event); this.$emit("valuechange", $event);
} }
this.$forceUpdate(); this.$forceUpdate();
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册