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

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

上级 404db59f
......@@ -7,17 +7,6 @@
justify-content: space-around;
align-items: center;
font-size: 13px;
position: relative;
.badge {
--padding-bottom:0;
--padding-end:5px;
--padding-start:5px;
--padding-top:0;
position: relative;
top: -5px;
left: 5px;
background-color: red;
}
.quick-group-tab {
flex: 1;
height: 30px;
......@@ -26,6 +15,24 @@
align-items: center;
border: 1px solid #a8a8a8;
margin: 0 0 -1px -1px;
z-index: 9999;
background-color: white;
position: relative;
.badge {
--padding-bottom:0;
--padding-end:3px;
--padding-start:3px;
--padding-top:1px;
position: absolute;
top: -5px;
left: 49px;
z-index: 99;
min-width: 15px;
height: 15px;
text-align: center;
line-height: 15px;
background-color: red;
}
}
.app-seleted-item {
background-color: #a8a8a8;
......
......@@ -25,6 +25,7 @@
<ion-icon v-if="item.selected" style="margin-left:auto" name="checkbox-outline"></ion-icon>
</div>
</div>
<ion-backdrop style="height:100vh;z-index:99" v-show="subItems.length > 0" visible="true" tappable="true" @ionBackdropTap="closeBackdrop"></ion-backdrop>
</div>
</template>
......@@ -41,7 +42,6 @@ import {
components: {},
})
export default class AppQuickGroupTab extends Vue {
public test($event: any) {}
/**
* 快速分组代码表
......@@ -190,6 +190,17 @@ export default class AppQuickGroupTab extends Vue {
}
this.$forceUpdate();
}
/**
* 关闭遮罩层
*
* @type {any[]}
* @memberof AppQuickGroup
*/
public closeBackdrop () {
this.subItems.length = 0;
this.$forceUpdate();
}
}
</script>
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册