完成人员详细信息功能
This commit is contained in:
weipengfei
parent
fa91ae3a63
commit
cefbc4b3e4
@ -18,4 +18,14 @@ export const companyView = (data) => oahttp.get('/company/view', data)
|
||||
/**
|
||||
* 公司详情
|
||||
*/
|
||||
export const companyAreaManager = (data) => oahttp.get('/company/areaManager', data)
|
||||
export const companyAreaManager = (data) => oahttp.get('/company/areaManager', data)
|
||||
|
||||
/**
|
||||
* 人员列表
|
||||
*/
|
||||
export const companyUser = (data) => oahttp.get('/company/users', data)
|
||||
|
||||
/**
|
||||
* 人员详情
|
||||
*/
|
||||
export const companyUserDetail = (data) => oahttp.get('/company/user', data)
|
||||
@ -105,9 +105,9 @@
|
||||
</view>
|
||||
|
||||
<view class="no_login" v-if="!$store.state.app.token">
|
||||
<view class="view">
|
||||
<view class="view" @click="login()">
|
||||
<view class="text">登录里海OA,开启线上便捷办公</view>
|
||||
<button class="btn" @click="login">立即登录</button>
|
||||
<button class="btn">立即登录</button>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <tabbar></tabbar> -->
|
||||
|
||||
@ -44,7 +44,7 @@
|
||||
<view class="bottom">
|
||||
<view class="circle"></view>
|
||||
<view class="green">所属片区</view>
|
||||
<view>{{item.area}}</view>
|
||||
<view>{{item.city_name+item.area_name+item.street_name}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
@ -218,7 +218,7 @@
|
||||
|
||||
.item {
|
||||
width: 694rpx;
|
||||
height: 201rpx;
|
||||
// height: 201rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 14rpx 14rpx 14rpx 14rpx;
|
||||
opacity: 1;
|
||||
@ -270,6 +270,7 @@
|
||||
display: flex;
|
||||
justify-content: left;
|
||||
align-items: center;
|
||||
margin-top: 20rpx;
|
||||
|
||||
.circle {
|
||||
width: 11rpx;
|
||||
|
||||
BIN
static/icons/man.png
Normal file
BIN
static/icons/man.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
static/icons/woman.png
Normal file
BIN
static/icons/woman.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
@ -2,47 +2,52 @@
|
||||
<view class="personnel">
|
||||
<!-- <button class="new_btn">创建</button> -->
|
||||
<view class="personnel_list">
|
||||
<view class="personnel_item">
|
||||
<view class="type">
|
||||
<image src="../../static/icons/err_w.png"></image>
|
||||
<!-- <image src="../../static/icons/ok_w.png"></image> -->
|
||||
<text>未签约</text>
|
||||
</view>
|
||||
<view class="top">
|
||||
<view class="left">
|
||||
<u--image class="u_avatar" :showLoading="true" src="../../static/img/public/man.png" width="112.28rpx" height="112.28rpx" shape="circle"></u--image>
|
||||
<block v-for="(item, index) in userList" :key="item.id">
|
||||
<view class="personnel_item">
|
||||
<view class="type" :class="item.is_contract?'type_blue':''">
|
||||
<image v-if="item.is_contract" src="../../static/icons/ok_w.png"></image>
|
||||
<image v-else src="../../static/icons/err_w.png"></image>
|
||||
<text>{{item.is_contract?'已签约':'未签约'}}</text>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="info_top">
|
||||
<view class="info_name">人员名称</view>
|
||||
<view>隶属乡镇公司名称</view>
|
||||
<view class="top">
|
||||
<view class="left">
|
||||
<u--image class="u_avatar" :showLoading="true" :src="item.avatar||'../../static/img/public/man.png'" width="112.28rpx" height="112.28rpx" shape="circle"></u--image>
|
||||
</view>
|
||||
<view class="info_bottom">
|
||||
<view class="item phone">
|
||||
<uni-icons type="phone" color="#999999FF"></uni-icons>
|
||||
13546841564
|
||||
<view class="right">
|
||||
<view class="info_top">
|
||||
<view class="info_name">{{item.name}}</view>
|
||||
<view>{{item.company}}</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<uni-icons type="location" color="#999999FF"></uni-icons>
|
||||
通滩镇
|
||||
<view class="info_bottom">
|
||||
<view class="item phone">
|
||||
<uni-icons type="phone" color="#999999FF"></uni-icons>
|
||||
{{item.phone}}
|
||||
</view>
|
||||
<view class="item">
|
||||
<uni-icons type="location" color="#999999FF"></uni-icons>
|
||||
<view class="location">{{item.city_name+item.area_name+item.street_name}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="center">
|
||||
<view class="top">小组服务团队：<text class="green">管理人</text></view>
|
||||
<view class="bottom">
|
||||
<view><image src="../../static/icons/ok.png"></image>身份证</view>
|
||||
<view><image src="../../static/icons/ok.png"></image>驾驶证</view>
|
||||
<view><image src="../../static/icons/err.png"></image>银行卡</view>
|
||||
<view class="center">
|
||||
<view class="top" v-for="(role, roleIndex) in item.roles" :key="roleIndex">
|
||||
{{role}}
|
||||
<!-- <text class="green">管理人</text> -->
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view><image :src="item.qualification.id_card?'../../static/icons/ok.png':'../../static/icons/err.png'"></image>身份证</view>
|
||||
<view><image :src="item.qualification.car_card?'../../static/icons/ok.png':'../../static/icons/err.png'"></image>驾驶证</view>
|
||||
<view><image :src="item.qualification.bank_account?'../../static/icons/ok.png':'../../static/icons/err.png'"></image>银行卡</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-line color="#999999FF"></u-line>
|
||||
<view class="bottom" style="margin-top: 28rpx;">
|
||||
<button class="look" @click="navTo('/subpkg/personnelDetails/personnelDetails?id='+item.id)">查看</button>
|
||||
</view>
|
||||
</view>
|
||||
<u-line color="#999999FF"></u-line>
|
||||
<view class="bottom" style="margin-top: 28rpx;">
|
||||
<button class="look" @click="navTo('/subpkg/personnelDetails/personnelDetails')">查看</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="personnel_item">
|
||||
</block>
|
||||
<!-- <view class="personnel_item">
|
||||
<view class="type type_blue">
|
||||
<image src="../../static/icons/ok_w.png"></image>
|
||||
<text>已签约</text>
|
||||
@ -80,13 +85,14 @@
|
||||
<view class="bottom" style="margin-top: 28rpx;">
|
||||
<button class="look" @click="navTo('/subpkg/personnelDetails/personnelDetails')">查看</button>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Toast } from '@/libs/uniApi.js'
|
||||
import {companyUser} from "@/api/company.js"
|
||||
export default {
|
||||
onReady() {
|
||||
uni.setNavigationBarColor({
|
||||
@ -96,11 +102,13 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
userList: []
|
||||
}
|
||||
},
|
||||
onLoad() {},
|
||||
onShow() {},
|
||||
onShow() {
|
||||
this.loadUserList()
|
||||
},
|
||||
methods: {
|
||||
navTo(url) {
|
||||
url ?
|
||||
@ -108,6 +116,15 @@ export default {
|
||||
url: url,
|
||||
}) : Toast('暂未开放')
|
||||
},
|
||||
loadUserList(){
|
||||
let that = this;
|
||||
companyUser({
|
||||
page: 1,
|
||||
limit: 15
|
||||
}).then(res=>{
|
||||
that.userList = res.data.data;
|
||||
})
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
uni.stopPullDownRefresh()
|
||||
@ -179,6 +196,7 @@ export default {
|
||||
margin-left: 28rpx;
|
||||
font-size: 25rpx;
|
||||
font-weight: 400;
|
||||
overflow: hidden;
|
||||
color: #999999;
|
||||
.info_top{
|
||||
display: flex;
|
||||
@ -203,7 +221,7 @@ export default {
|
||||
margin-right: 28rpx;
|
||||
}
|
||||
.location{
|
||||
flex: 1;
|
||||
width: 250rpx;
|
||||
white-space: nowrap; /* 不换行 */
|
||||
overflow: hidden; /* 将超出文本隐藏 */
|
||||
text-overflow: ellipsis; /* 使用省略号表示被隐藏的文本 */
|
||||
|
||||
@ -1,9 +1,95 @@
|
||||
<template>
|
||||
<view class=""></view>
|
||||
<view class="page">
|
||||
<view class="basic">
|
||||
<view class="title">人员基本信息</view>
|
||||
<view class="card">
|
||||
<view class="basic_top">
|
||||
<image class="avatar" :src="userInfo.avatar"></image>
|
||||
<view class="text">
|
||||
<view class="basic_name">
|
||||
<view class="name">{{userInfo.name}}</view>
|
||||
<image class="icon" :src="userInfo.sex==1?'../../static/icons/man.png':'../../static/icons/woman.png'"></image>
|
||||
<view class="role">{{userInfo.roles[0]}}</view>
|
||||
</view>
|
||||
<view class="id_card">
|
||||
身份证号:{{userInfo.id_card}}
|
||||
</view>
|
||||
<view class="phone">
|
||||
联系电话:{{userInfo.phone}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
负责区域: {{userInfo.city_name+userInfo.area_name+userInfo.street_name}}{{userInfo.city_name+userInfo.area_name+userInfo.street_name}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="certification">
|
||||
<view class="title">资质信息</view>
|
||||
<view class="c_item">
|
||||
<uni-section style="background-color: transparent;" title="身份证" titleFontSize="32rpx" type="line"></uni-section>
|
||||
<view class="card_box">
|
||||
<image :src="userInfo.qualification.id_card"
|
||||
@click="previewImg([userInfo.qualification.id_card,userInfo.qualification.id_card_b], 0)">
|
||||
</image>
|
||||
<image :src="userInfo.qualification.id_card_b"
|
||||
@click="previewImg([userInfo.qualification.id_card,userInfo.qualification.id_card_b], 1)"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="c_item">
|
||||
<uni-section style="background-color: transparent;" title="驾驶证" titleFontSize="32rpx" type="line"></uni-section>
|
||||
<view class="card_box">
|
||||
<image :src="userInfo.qualification.car_card"
|
||||
@click="previewImg([userInfo.qualification.car_card,userInfo.qualification.car_card_b], 0)"></image>
|
||||
<image :src="userInfo.qualification.car_card_b"
|
||||
@click="previewImg([userInfo.qualification.car_card,userInfo.qualification.car_card_b], 1)"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="c_item">
|
||||
<uni-section style="background-color: transparent;" title="银行卡照片" titleFontSize="32rpx" type="line"></uni-section>
|
||||
<view class="card_box">
|
||||
<image :src="userInfo.qualification.bank_account"
|
||||
@click="previewImg([userInfo.qualification.bank_account,userInfo.qualification.bank_account_b], 0)"></image>
|
||||
<image :src="userInfo.qualification.bank_account_b"
|
||||
@click="previewImg([userInfo.qualification.bank_account,userInfo.qualification.bank_account_b], 1)"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="contract">
|
||||
<view class="title">电子合同</view>
|
||||
<view class="card">
|
||||
<uni-section style="background-color: transparent;" :title="userInfo.name" titleFontSize="32rpx" type="line"></uni-section>
|
||||
<view class="c_text">性别：{{userInfo.sex==1?'男':'女'}}</view>
|
||||
<view class="c_text">身份证号码：{{userInfo.id_card}}</view>
|
||||
<view class="c_text">联系电话：{{userInfo.phone}}</view>
|
||||
<view class="c_text">合同类型：{{userInfo.contract.contract_type_name}}</view>
|
||||
<view class="c_text">合同编号：{{userInfo.contract.contract_no}}</view>
|
||||
<u-line v-if="userInfo.contract.file" color="#999999FF" style="margin: 31rpx 0;"></u-line>
|
||||
<view v-if="userInfo.contract.file" class="contract_box">
|
||||
<view class="left">
|
||||
<image class="contract_img" src="../../static/img/contract/pdf.png"></image>
|
||||
<view class="text">
|
||||
<view class="name">合同</view>
|
||||
<view>
|
||||
<text>{{userInfo.contract.create_time}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right"
|
||||
@click="naviTo('/subpkg/pdfView/pdfView?url=' + userInfo.contract.file)">
|
||||
<!-- <image class="icon"></image> -->
|
||||
<uni-icons type="paperclip" color="#3274F9"></uni-icons>
|
||||
<view>查看</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Toast } from '@/libs/uniApi.js'
|
||||
import {companyUserDetail} from "@/api/company.js"
|
||||
export default {
|
||||
onReady() {
|
||||
uni.setNavigationBarColor({
|
||||
@ -13,18 +99,41 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
id:'',
|
||||
userInfo: {
|
||||
qualification:{},
|
||||
contract:{},
|
||||
roles:{}
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad() {},
|
||||
onShow() {},
|
||||
onLoad(options) {
|
||||
if(options.id)this.id=options.id;
|
||||
},
|
||||
onShow() {
|
||||
this.loadUserDetail();
|
||||
},
|
||||
methods: {
|
||||
navTo(url) {
|
||||
naviTo(url) {
|
||||
url ?
|
||||
uni.navigateTo({
|
||||
url: url,
|
||||
}) : Toast('暂未开放')
|
||||
},
|
||||
loadUserDetail(){
|
||||
if(!this.id) return;
|
||||
companyUserDetail({
|
||||
id: this.id
|
||||
}).then(res=>{
|
||||
this.userInfo = res.data;
|
||||
})
|
||||
},
|
||||
previewImg(urls, index=0){
|
||||
uni.previewImage({
|
||||
urls:urls,
|
||||
current:index
|
||||
})
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
uni.stopPullDownRefresh()
|
||||
@ -33,5 +142,161 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
.page{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.title{
|
||||
font-size: 35rpx;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
margin-bottom: 21rpx;
|
||||
}
|
||||
.card{
|
||||
width: 694rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 14rpx 14rpx 14rpx 14rpx;
|
||||
padding: 28rpx;
|
||||
}
|
||||
.basic{
|
||||
margin: 28rpx 0;
|
||||
.card{
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
.basic_top{
|
||||
display: flex;
|
||||
margin-bottom: 28rpx;
|
||||
.avatar{
|
||||
width: 154rpx;
|
||||
height: 154rpx;
|
||||
background: #CCCCCC;
|
||||
border-radius: 7rpx 7rpx 7rpx 7rpx;
|
||||
margin-right: 28rpx;
|
||||
}
|
||||
.text{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
.basic_name{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.icon{
|
||||
width: 21rpx;
|
||||
height: 21rpx;
|
||||
margin-left: 18rpx;
|
||||
margin-right: 36rpx;
|
||||
}
|
||||
.name{
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: #000000CC;
|
||||
}
|
||||
.role{
|
||||
width: 284rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: #3274F9;
|
||||
// white-space: nowrap; /* 不换行 */
|
||||
// overflow: hidden; /* 将超出文本隐藏 */
|
||||
// text-overflow: ellipsis; /* 使用省略号表示被隐藏的文本 */
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.bottom{
|
||||
// width: 640rpx;
|
||||
// white-space: nowrap; /* 不换行 */
|
||||
// overflow: hidden; /* 将超出文本隐藏 */
|
||||
// text-overflow: ellipsis; /* 使用省略号表示被隐藏的文本 */
|
||||
}
|
||||
}
|
||||
}
|
||||
.certification{
|
||||
margin-bottom: 28rpx;
|
||||
.title{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.c_item{
|
||||
width: 694rpx;
|
||||
.card_box{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
image{
|
||||
width: 336rpx;
|
||||
height: 238rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 14rpx 14rpx 14rpx 14rpx;
|
||||
border: 2rpx solid #CCCCCC;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.contract{
|
||||
margin-bottom: 28rpx;
|
||||
.card{
|
||||
padding-top: 0;
|
||||
.contract_box{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left {
|
||||
display: flex;
|
||||
|
||||
.contract_img {
|
||||
width: 102rpx;
|
||||
height: 102rpx;
|
||||
background: #F5F5F5;
|
||||
border-radius: 14rpx 14rpx 14rpx 14rpx;
|
||||
margin-right: 21rpx;
|
||||
}
|
||||
|
||||
.text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
;
|
||||
font-weight: 500;
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
line-height: 35rpx;
|
||||
}
|
||||
|
||||
.nickname {
|
||||
margin-right: 35rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
height: 39rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
line-height: 35rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: #3274F9;
|
||||
line-height: 35rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.icon {
|
||||
width: 35rpx;
|
||||
height: 39rpx;
|
||||
background-color: #3274F9;
|
||||
opacity: 1;
|
||||
margin-right: 10rpx
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user