140 lines
8.5 KiB
HTML
140 lines
8.5 KiB
HTML
<!--#
|
|
layout("/layouts/v4/baseLayout.html"){
|
|
#-->
|
|
|
|
<style>
|
|
#v4-person-center {
|
|
padding-top: 10px;
|
|
background: url(/assets/platform/img/v4/home-bg.png);
|
|
background-size: cover;
|
|
min-height: calc(100vh - 64px);
|
|
}
|
|
|
|
.v-person-center-container {
|
|
width: 1500px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.v4-person-basic-info {
|
|
height: 250px;
|
|
background: url("/assets/platform/img/v4/person-center/img1.png");
|
|
background-size: cover;
|
|
padding: 20px 50px 30px;
|
|
display: flex;
|
|
}
|
|
|
|
.v4-person-basic-info .info_img {
|
|
width: 72px;
|
|
height: 100px;
|
|
margin-right: 40px;
|
|
flex-shrink: 0;
|
|
position: relative;
|
|
top: 25px;
|
|
}
|
|
|
|
.v4-person-basic-info .info_img img {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.v4-person-basic-info .info_grid {
|
|
flex: 1;
|
|
display: grid;
|
|
/*三行三列*/
|
|
grid-template-columns: repeat(3, 1fr);
|
|
grid-template-rows: repeat(3, 1fr);
|
|
}
|
|
|
|
.v4-person-basic-info .info_grid .info-item {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 8px 12px;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.v4-person-basic-info .info_grid .info-label {
|
|
font-weight: 600;
|
|
color: #333;
|
|
min-width: 80px;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.v4-person-basic-info .info_grid .info-value {
|
|
color: #666;
|
|
font-size: 14px;
|
|
flex: 1;
|
|
}
|
|
|
|
</style>
|
|
|
|
<div id="v4-person-center">
|
|
<div class="v-person-center-container">
|
|
<!--个人基本信息-->
|
|
<div class="v4-person-basic-info">
|
|
<div class="info_img">
|
|
<img
|
|
src="data:image/png;base64,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">
|
|
</div>
|
|
<div class="info_grid">
|
|
<div class="info-item">
|
|
<span class="info-label">姓名：</span>
|
|
<span class="info-value">${@auth.getPrincipalProperty('username')}</span>
|
|
</div>
|
|
<div class="info-item">
|
|
<span class="info-label">籍贯：</span>
|
|
<span class="info-value">${@auth.getPrincipalProperty('nativePlace')}</span>
|
|
</div>
|
|
<div class="info-item">
|
|
<span class="info-label">出生日期：</span>
|
|
<span class="info-value">${@auth.getPrincipalProperty('birthday')}</span>
|
|
</div>
|
|
<div class="info-item">
|
|
<span class="info-label">性别：</span>
|
|
<span class="info-value">${@auth.getPrincipalProperty('sex')}</span>
|
|
</div>
|
|
<div class="info-item">
|
|
<span class="info-label">年龄：</span>
|
|
<span class="info-value">46</span>
|
|
</div>
|
|
<div class="info-item">
|
|
<span class="info-label">政治面貌：</span>
|
|
<span class="info-value">${@auth.getPrincipalProperty('political')}</span>
|
|
</div>
|
|
<div class="info-item">
|
|
<span class="info-label">民族：</span>
|
|
<span class="info-value">${@auth.getPrincipalProperty('nation')}</span>
|
|
</div>
|
|
<div class="info-item">
|
|
<span class="info-label">身份证：</span>
|
|
<span class="info-value">${@auth.getPrincipalProperty('idCard')}</span>
|
|
</div>
|
|
<div class="info-item">
|
|
<span class="info-label">电话：</span>
|
|
<span class="info-value">${@auth.getPrincipalProperty('mobile')}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script nonce="${cspNonce!}">
|
|
new Vue({
|
|
el: "#v4-person-center",
|
|
data() {
|
|
return {
|
|
|
|
}
|
|
},
|
|
mounted() {
|
|
},
|
|
methods: {
|
|
|
|
}
|
|
})
|
|
</script>
|
|
|
|
|
|
<!--#
|
|
}
|
|
#-->
|