287 lines
7.1 KiB
Vue
287 lines
7.1 KiB
Vue
<template>
|
||
<view class="page">
|
||
<u-navbar class="u-navbar" title="准入信息查询" placeholder @leftClick="leftClick" leftIconColor="#fff" bgColor="#00337A" :titleStyle="{ color: '#FFF', fontSize: '32rpx' }"/>
|
||
|
||
<view style="width: 100%;height: 80rpx;">
|
||
<view class="search-content">
|
||
<view style="width: 100%;background-color: #fff;">
|
||
<uni-easyinput
|
||
suffixIcon="search"
|
||
v-model="keyword"
|
||
placeholder="请输入人员"
|
||
@iconClick="searchList"
|
||
></uni-easyinput>
|
||
</view>
|
||
<view class="search-icon" @click="distinguish"></view>
|
||
</view>
|
||
<!-- <u-search shape="square" placeholder="搜索" v-model="keyword" :showAction="true" actionText="搜索" :animation="false" @custom="searchList"></u-search> -->
|
||
</view>
|
||
<!-- 列表 -->
|
||
<view class="list-box">
|
||
<view style="width: 100%;height: 70vh;display: flex;align-items: center;justify-content: center;" v-if="isLoading">
|
||
<u-loading-icon :show="true" mode="circle" text="加载中" :vertical="true"></u-loading-icon>
|
||
</view>
|
||
<view v-if="!isLoading&&listData.length==0" style="width: 96%;height: 60vh;display: flex;flex-direction: column;justify-content: center;align-items: center;" >
|
||
<image src="../../../../static/realName/noData.png" style="width: 100rpx;height: 120rpx;" mode=""></image>
|
||
<view>暂无数据</view>
|
||
</view>
|
||
<u-list height="76vh" v-if="!isLoading&&listData.length>0">
|
||
<u-list-item v-for="(item, index) in listData" :key="index">
|
||
<view class="list-item" @click="goDetail(item)">
|
||
<view class="content-box">
|
||
<view class="item-text" >
|
||
<text class="label" style="font-weight: bold;">姓名：</text>
|
||
<text class="info">{{item.name}}</text>
|
||
</view>
|
||
<view class="item-text">
|
||
<text class="label" style="font-weight: bold;">身份证号：</text>
|
||
<text class="info">{{item.idNumber}}</text>
|
||
</view>
|
||
<view class="item-text">
|
||
<text class="label" style="font-weight: bold;">手机号：</text>
|
||
<text class="info">{{item.phone}}</text>
|
||
</view>
|
||
<view class="item-text">
|
||
<text class="label" style="font-weight: bold;">岗位：</text>
|
||
<text class="info">{{item.phone}}</text>
|
||
</view>
|
||
<view class="item-text">
|
||
<text class="label" style="font-weight: bold;">分包：</text>
|
||
<text class="info">{{item.subName}}</text>
|
||
</view>
|
||
<view class="item-text">
|
||
<text class="label" style="font-weight: bold;">班组：</text>
|
||
<text class="info">{{item.teamName}}</text>
|
||
</view>
|
||
|
||
</view>
|
||
|
||
</view>
|
||
</u-list-item>
|
||
</u-list>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { pathToBase64, base64ToPath } from 'image-tools';
|
||
import config from '@/config'
|
||
export default {
|
||
data() {
|
||
return {
|
||
teamId:uni.getStorageSync('realNameUser').teamId,
|
||
keyword:'',
|
||
listData:[],
|
||
number:0,
|
||
isLoading:false
|
||
}
|
||
},
|
||
onLoad() {
|
||
// console.log('?? ~ mounted ~ mounted-index:')
|
||
this.loadList()
|
||
},
|
||
onShow() {
|
||
|
||
},
|
||
methods: {
|
||
//人脸识别采集
|
||
distinguish(){
|
||
console.log('人脸识别采集')
|
||
uni.chooseImage({
|
||
count: 1,
|
||
sizeType: ['compressed'],
|
||
sourceType: ['camera'],
|
||
success: res => {
|
||
console.log('🚀 ~ res-拍照:', res)
|
||
this.imgToBase64(res.tempFilePaths[0]).then(base64 => {
|
||
// console.log(base64)
|
||
uni.uploadFile({
|
||
url: config.realFileUrl+`file/getFaceRecognition`, //服务器地址
|
||
fileType:"image",//ZFB必填,不然报错
|
||
filePath: res.tempFilePaths[0],//这个就是我们上面拍照返回或者先中照片返回的数组
|
||
formData: {
|
||
file:base64,
|
||
photoType:'face',
|
||
},
|
||
success: (uploadFileRes) => {
|
||
console.log(uploadFileRes)
|
||
if(uploadFileRes.statusCode==200){
|
||
uploadFileRes=JSON.parse(uploadFileRes.data)
|
||
console.log(uploadFileRes)
|
||
if(uploadFileRes.code==200){
|
||
if(uploadFileRes.data.face){
|
||
this.faceData=JSON.parse(uploadFileRes.data.personData)
|
||
console.log(this.faceData)
|
||
if(this.faceData){
|
||
this.keyword = this.faceData.name;
|
||
this.searchList()
|
||
}else{
|
||
uni.$u.toast('识别失败');
|
||
}
|
||
}else{
|
||
uni.$u.toast(uploadFileRes.msg);
|
||
}
|
||
}else{
|
||
uni.$u.toast(uploadFileRes.msg);
|
||
}
|
||
}else{
|
||
uni.$u.toast('识别失败');
|
||
}
|
||
},
|
||
fail: err => {
|
||
uni.$u.toast('识别失败');
|
||
console.log(err)
|
||
}
|
||
});
|
||
})
|
||
},
|
||
fail: err => {
|
||
console.log('🚀 ~ err:', err)
|
||
}
|
||
})
|
||
},
|
||
//搜索
|
||
searchList(value){
|
||
this.listData=[]
|
||
this.loadList()
|
||
},
|
||
loadList(){
|
||
let param={
|
||
teamId:this.teamId,
|
||
idNumber:this.keyword,
|
||
}
|
||
this.isLoading=true
|
||
uni.request({
|
||
url: config.realAppUrl+'/BasePerson/selectPersonContent',
|
||
method: 'post',
|
||
data: param,
|
||
header: {
|
||
'Content-Type': 'application/json;charset=UTF-8;',
|
||
Authorization: uni.getStorageSync('realNameToken')
|
||
},
|
||
success: res => {
|
||
console.log(res)
|
||
res = res.data;
|
||
if(res.code==200){
|
||
this.listData=res.data;
|
||
this.number=res.data.length
|
||
this.$forceUpdate()
|
||
this.isLoading=false
|
||
// console.log(this.listData)
|
||
}else{
|
||
this.listData=[]
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
})
|
||
this.isLoading=false
|
||
}
|
||
},
|
||
fail: err => {
|
||
console.log(err)
|
||
this.isLoading=false
|
||
}
|
||
})
|
||
},
|
||
goDetail(item){
|
||
console.log(item)
|
||
uni.navigateTo({
|
||
url: `/pages/realName/workbench/dayPlan/detail?idNumber=${item.idNumber}`
|
||
})
|
||
},
|
||
imgToBase64(data) {
|
||
return new Promise((resolve, reject) => {
|
||
pathToBase64(data)
|
||
.then(base64 => {
|
||
resolve(base64)
|
||
})
|
||
.catch(error => {
|
||
console.error(error)
|
||
reject(error)
|
||
})
|
||
})
|
||
},
|
||
// 返回
|
||
leftClick() {
|
||
console.log('返回')
|
||
uni.navigateBack({
|
||
delta: 1 // 返回
|
||
});
|
||
}
|
||
},
|
||
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.page {
|
||
width: 100vw;
|
||
height: 100vh;
|
||
background-color: #EFEFEF;
|
||
box-sizing: border-box;
|
||
// padding: 0 20px;
|
||
|
||
.search-content {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-top: 20rpx;
|
||
margin-left: 40rpx;
|
||
margin-right: 40rpx;
|
||
.search-icon {
|
||
width: 70rpx;
|
||
height: 60rpx;
|
||
margin-right: 40rpx;
|
||
margin-left: 40rpx;
|
||
background: url('../../../../static/realName/face.png') no-repeat;
|
||
background-size: 100% 100%;
|
||
}
|
||
}
|
||
|
||
.list-box{
|
||
width: 90%;
|
||
height: auto;
|
||
// border: 1px solid #000;
|
||
margin: 0rpx auto;
|
||
|
||
.list-item{
|
||
width: 100%;
|
||
height: auto;
|
||
background-color: #fff;
|
||
border-radius: 20rpx;
|
||
margin: 20rpx 0;
|
||
|
||
.content-box{
|
||
width: 94%;
|
||
height: auto;
|
||
margin: 20rpx;
|
||
// background-color: #F8F9FC;
|
||
padding: 10rpx 0;
|
||
|
||
.item-text{
|
||
width: 95%;
|
||
margin-left: 20rpx;
|
||
margin-top: 15rpx;
|
||
// display: flex;
|
||
align-items: center;
|
||
position: relative;
|
||
.label{
|
||
color: #3A3A3A;
|
||
font-weight: 500;
|
||
}
|
||
.info-right{
|
||
position: absolute;
|
||
top: 0rpx;
|
||
right: 40rpx;
|
||
}
|
||
.info{
|
||
color: #6F6F6F;
|
||
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|