60 lines
1.1 KiB
Vue
60 lines
1.1 KiB
Vue
|
<script lang="ts" setup>
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div class="Indicator-layout">
|
||
|
|
<div class="Indicator-item">
|
||
|
|
<h4>名称</h4>
|
||
|
|
<p>- 邮箱</p>
|
||
|
|
</div>
|
||
|
|
<div class="Indicator-item">
|
||
|
|
<h4>姓名</h4>
|
||
|
|
<p>- 职务</p>
|
||
|
|
</div>
|
||
|
|
<div class="Indicator-item">
|
||
|
|
<h4>手机号</h4>
|
||
|
|
<p>- 地址</p>
|
||
|
|
</div>
|
||
|
|
<div class="Indicator-item">
|
||
|
|
<h4>上次登陆时间</h4>
|
||
|
|
<p>- 登录IP</p>
|
||
|
|
</div>
|
||
|
|
<div class="Indicator-item">
|
||
|
|
<h4>修改日期</h4>
|
||
|
|
<p>-创建日期</p>
|
||
|
|
</div>
|
||
|
|
<div class="Indicator-item">
|
||
|
|
<h4>状态</h4>
|
||
|
|
<p>-锁定</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
@import 'base';
|
||
|
|
|
||
|
|
.Indicator-layout {
|
||
|
|
background-color: $light-bg-color;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding: $padding*1.5 $padding*10 $padding*1.5 $padding*8;
|
||
|
|
gap: $gap*4;
|
||
|
|
border-radius: $radius;
|
||
|
|
}
|
||
|
|
|
||
|
|
.Indicator-item {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
gap: $gap*.25;
|
||
|
|
flex: 1;
|
||
|
|
|
||
|
|
p {
|
||
|
|
color: $light-unfocused-color;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.Indicator-item:last-of-type {
|
||
|
|
flex: unset;
|
||
|
|
}
|
||
|
|
</style>
|