LoongPanel-Asp/web/components/UserPage/UserPageIndicator.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>