111 lines
2.1 KiB
Vue
111 lines
2.1 KiB
Vue
<template>
|
|
|
|
|
|
<view class="personnel_list">
|
|
<view class="cards">
|
|
<view class="cards_head">
|
|
<text style="font-size: 32rpx">最后更新:2020-25-2</text>
|
|
<text>更新档案</text>
|
|
<text>查看档案</text>
|
|
</view>
|
|
<view class="cards_content">
|
|
<view class="right">
|
|
<view class="">
|
|
<text>人员姓名 :</text>
|
|
<text> { item.name }</text>
|
|
</view>
|
|
<view class="">
|
|
<text>联系电话 :</text>
|
|
<text>{ item.phone }</text>
|
|
</view>
|
|
<view class="">
|
|
<text>所属片区 :</text>
|
|
<text> 所属片区 </text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="left">
|
|
<view class="cir">
|
|
<u--image class="u_avatar" :showLoading="true" :src="'../../static/img/public/man.png'"
|
|
width="112.28rpx" height="112.28rpx" shape="circle"></u--image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
.personnel_list {
|
|
padding: 28rpx 0;
|
|
margin-bottom: 130rpx;
|
|
|
|
.cards {
|
|
margin: 0 auto;
|
|
margin-bottom: 28rpx;
|
|
width: 694rpx;
|
|
background: #ffffff;
|
|
border-radius: 30rpx;
|
|
opacity: 1;
|
|
overflow: hidden;
|
|
// box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
|
|
|
|
.cards_head {
|
|
padding: 28rpx;
|
|
background-color: $theme-oa-color;
|
|
color: white;
|
|
height: 100rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.cards_content {
|
|
padding: 28rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
.left {
|
|
text-align: center;
|
|
// padding: 15rpx 25rpx;
|
|
padding-top: 20rpx;
|
|
|
|
width: 160rpx;
|
|
background-color: $theme-oa-color;
|
|
color: white;
|
|
border-radius: 40rpx;
|
|
|
|
.cir {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
background-color: #ffffff;
|
|
margin-left: 25rpx;
|
|
border-radius: 120rpx;
|
|
position: relative;
|
|
}
|
|
}
|
|
|
|
.right {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
|
|
view {
|
|
text:nth-child(2) {
|
|
margin-left: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.u_avatar {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
}
|
|
}
|
|
</style> |