135 lines
4.2 KiB
Vue
135 lines
4.2 KiB
Vue
<template>
|
||
<uni-popup ref="showPersonChooser" type="bottom" round background-color="#fff">
|
||
<view style="width: 100%;position: relative;z-index: 100;box-sizing: border-box;background: #fff;padding-top: 10px;">
|
||
<input class="search" @change="searchChange" placeholder="搜索选择人员" v-model="searchPerson"/>
|
||
<scroll-view style="height: 500rpx;padding: 0 32rpx;box-sizing: border-box;" :scroll-y="true">
|
||
<view v-for="(item, index) in personList" :key="index" @click="bindPerson(item)"
|
||
class="person-list" :class="{active: activePerson.id == item.id}">
|
||
<template v-if="choiceType==3">
|
||
<view>{{ item.personName }}</view>
|
||
<view style="color: #8492a6;margin-top: 7rpx;">期望工种：{{item.jobWorkTypeName}}</view>
|
||
</template>
|
||
<template v-else-if="choiceType==4">
|
||
<view>{{ item.personName }}</view>
|
||
<view style="color: #8492a6;margin-top: 7rpx;">意愿培训工种：{{item.trainingIntentionWorkTypeName}}</view>
|
||
</template>
|
||
<template v-else>
|
||
<view style="display: flex;justify-content: space-between;font-size: 32rpx;font-weight: bold;">{{ item.name }}
|
||
<view style="color: #8492a6; font-size: 13px;width: 50%;text-align: right;">{{ item.phone }}</view>
|
||
</view>
|
||
<view style="color: #8492a6;margin-top: 7rpx;">现居住地：{{item.currentResidentialAddress}}</view>
|
||
</template>
|
||
</view>
|
||
</scroll-view>
|
||
<view class="button-area" style="position: relative;">
|
||
<view class="btn" @click="closeshowPersonChooser">取消</view>
|
||
<view class="btn reset" @click="resetData">重置</view>
|
||
<view class="btn save" @click="saveInfo">确定</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
</template>
|
||
|
||
<script>
|
||
import {getPersonList} from '@/apiRc/needs/person'
|
||
import { listJobService } from "@/apiRc/needs/jobService";
|
||
import { listTrainService } from "@/apiRc/needs/trainService";
|
||
export default {
|
||
props: {
|
||
choiceType: {
|
||
default: 1
|
||
}
|
||
},
|
||
mounted() {
|
||
this.doSearch()
|
||
},
|
||
data() {
|
||
return {
|
||
showPersonChooser: false,
|
||
activePerson: {},
|
||
searchPerson: '',
|
||
personList: [],
|
||
searcher: '',
|
||
}
|
||
},
|
||
methods: {
|
||
open() {
|
||
this.$refs.showPersonChooser.open();
|
||
this.activePerson = {}
|
||
},
|
||
closeshowPersonChooser() {
|
||
this.$refs.showPersonChooser.close()
|
||
},
|
||
saveInfo() {
|
||
this.$emit('confirm', this.activePerson)
|
||
this.$refs.showPersonChooser.close()
|
||
},
|
||
searchChange(){
|
||
console.log('搜索内容：' + this.searchPerson);
|
||
if(this.searcher){
|
||
clearTimeout(this.searcher)
|
||
this.doSearch()
|
||
}else{
|
||
this.doSearch()
|
||
}
|
||
},
|
||
doSearch() {
|
||
this.searcher = setTimeout(() => {
|
||
uni.showLoading('加载中...');
|
||
// alert("选择的choiceType：" + this.choiceType );
|
||
if(this.choiceType == 3) {
|
||
listJobService({personName: this.searchPerson, pageSize: 100, pageNum: 1}).then(res => {
|
||
uni.hideLoading();
|
||
this.personList = res.rows
|
||
clearTimeout(this.searcher)
|
||
})
|
||
}else if(this.choiceType == 4) {
|
||
listTrainService({personName: this.searchPerson, pageSize: 100, pageNum: 1}).then(res => {
|
||
uni.hideLoading();
|
||
this.personList = res.rows
|
||
clearTimeout(this.searcher)
|
||
})
|
||
}else{
|
||
getPersonList({name: this.searchPerson, pageSize: 100, pageNum: 1}).then(res => {
|
||
uni.hideLoading();
|
||
this.personList = res.rows
|
||
clearTimeout(this.searcher)
|
||
})
|
||
}
|
||
}, 200)
|
||
},
|
||
|
||
resetData(){
|
||
this.searchPerson = '';
|
||
this.personList = [];
|
||
this.activePerson = {}
|
||
},
|
||
|
||
bindPerson(item) {
|
||
this.activePerson = item;
|
||
this.$forceUpdate();
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.person-list{
|
||
padding: 24rpx 32rpx;
|
||
border-radius: 8rpx;
|
||
box-sizing: border-box;
|
||
border: 1px solid #e4e4e4;
|
||
margin-top: 32rpx;
|
||
&.active{
|
||
border: 1px solid #1890ff;
|
||
}
|
||
}
|
||
.search{
|
||
margin: 0 32rpx;
|
||
border: 1px solid #e4e4e4;
|
||
border-radius: 50rpx;
|
||
height: 64rpx;
|
||
padding: 0 20rpx;
|
||
}
|
||
</style>
|