|
|
<template>
|
|
|
<view>
|
|
|
<!-- 动火人弹出框 -->
|
|
|
<u-popup :show="showPop" mode="right" customStyle="width: 100vw;height: 100vh;z-index:15;" class="popup">
|
|
|
<!-- 自定义导航栏 -->
|
|
|
<u-navbar bgColor="#ffffff" :placeholder="true" titleStyle="font-weight:600" title="选择人员">
|
|
|
<view slot="left"><!-- <p style="font-size: 18px;">取消</p> --></view>
|
|
|
<view slot="right" @click="goToPage()"><p style="font-size: 18px;color: #3C9CFF;">确定</p></view>
|
|
|
</u-navbar>
|
|
|
|
|
|
<view>
|
|
|
<!-- <u-row style="padding: 0 20rpx;margin-top: 25rpx;">
|
|
|
<u-col :span="12" style="border: 1px solid #dedede;">
|
|
|
<lin-select
|
|
|
:list="productList2"
|
|
|
loading-text="数据加载中"
|
|
|
value-key="deptName"
|
|
|
max-height="180"
|
|
|
placeholder="根据人员单位或部门名称查询"
|
|
|
@input="input2"
|
|
|
v-model="mytext2"
|
|
|
/>
|
|
|
</u-col>
|
|
|
</u-row> -->
|
|
|
<u-row style="padding: 0 20rpx;margin-top: 10rpx;">
|
|
|
<u-col :span="12" style="border: 1px solid #dedede;">
|
|
|
<uni-easyinput focus v-model="nameSouSuo" placeholder="根据人员姓名查询" :clear="true"></uni-easyinput>
|
|
|
</u-col>
|
|
|
</u-row>
|
|
|
<!-- <uni-section class="mb-10" :title="`已选择人员${numDou === 1 ? '(单选)' : '(可多选)'}`" type="line"></uni-section> -->
|
|
|
<u-row style="padding: 20rpx 0rpx 0rpx 10rpx;margin-bottom: 10rpx;font-size: 16px;color: #3C9CFF;">已选择人员{{ numDou === 1 ? '(单选)' : '(可多选)' }}</u-row>
|
|
|
|
|
|
<view style="padding: 10rpx 10rpx;display: flex; flex-wrap: wrap; justify-content: start;">
|
|
|
<template v-for="(item, index) in firepersonCheckList">
|
|
|
<u-tag :text="item.nickName" plain closable @close="closeName(item)"></u-tag>
|
|
|
<!-- <u-col :span="3">{{ index + 1 }}.{{ item.nickName }}</u-col>
|
|
|
<u-col :span="7">{{ item.deptName }}</u-col>
|
|
|
<u-col :span="2"><u--text @click="closeName(item)" type="error" text="取消"></u--text></u-col> -->
|
|
|
</template>
|
|
|
</view>
|
|
|
<u-gap height="0.5" bgColor="#d6d6d6"></u-gap>
|
|
|
|
|
|
<view>
|
|
|
<!-- 全部人员名单-->
|
|
|
<!-- <uni-section class="mb-10" title="人员名单" type="line"></uni-section> -->
|
|
|
<u-row style="padding: 20rpx 0rpx 0rpx 10rpx;font-size: 16px;color: #3C9CFF;">可选择人员名单</u-row>
|
|
|
<!-- 全部人员 -->
|
|
|
<!-- <u-row style="padding: 0rpx 0rpx 20rpx 10rpx;">
|
|
|
<u-col :span="3">姓名</u-col>
|
|
|
<u-col :span="7">部门名称</u-col>
|
|
|
<u-col :span="2">操作</u-col>
|
|
|
</u-row> -->
|
|
|
<scroll-view scroll-y="true" style="height: 900rpx;">
|
|
|
<template v-for="(item, index) in zyFzUserList">
|
|
|
<u-row style="padding: 20rpx 10rpx;">
|
|
|
<u-col :span="3">{{ index + 1 }}.{{ item.nickName }}</u-col>
|
|
|
<u-col :span="7">{{ item.deptName }}</u-col>
|
|
|
<u-col :span="2"><u--text @click="selectPerson(item)" type="primary" text="选择"></u--text></u-col>
|
|
|
</u-row>
|
|
|
<u-gap height="0.5" bgColor="#d6d6d6"></u-gap>
|
|
|
</template>
|
|
|
<view style="width: 100%;height: 180rpx;"></view>
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</u-popup>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
//查询部门全部 //查询人员全部
|
|
|
import { selectUserListBaseInfo } from '@/api/system/user.js';
|
|
|
|
|
|
export default {
|
|
|
name: 'signPop',
|
|
|
props: {
|
|
|
nameSee: { type: Array, default: [] },
|
|
|
//显示隐藏
|
|
|
showPop: { type: Boolean, default: false },
|
|
|
signName: {
|
|
|
type: String,
|
|
|
default: '请传入签字人'
|
|
|
},
|
|
|
numDou: {
|
|
|
type: [Number, String],
|
|
|
default: 1
|
|
|
}
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
// mytext2: '', //作业单位
|
|
|
deptID: '', //作业单位id
|
|
|
nameSouSuo: '',
|
|
|
productList2: [], //作业单位返回表单
|
|
|
zyFzUserList: [],
|
|
|
firepersonCheckList: this.nameSee //人员选择信息
|
|
|
};
|
|
|
},
|
|
|
mounted() {
|
|
|
this.zyFzUserList = [];
|
|
|
this.productList2 = [];
|
|
|
this.firepersonCheckList = this.nameSee;
|
|
|
// this.mytext2 = '';
|
|
|
this.deptID = '';
|
|
|
this.nameSouSuo = '';
|
|
|
},
|
|
|
|
|
|
watch: {
|
|
|
showPop(newdata, olddata) {
|
|
|
console.log(this.nameSee);
|
|
|
console.log(newdata);
|
|
|
this.zyFzUserList = [];
|
|
|
this.productList2 = [];
|
|
|
this.firepersonCheckList = this.nameSee;
|
|
|
// this.mytext2 = '';
|
|
|
this.deptID = '';
|
|
|
this.nameSouSuo = '';
|
|
|
},
|
|
|
// //监听作业单位值变化，取作业单位id
|
|
|
// mytext2(newdata, olddata) {
|
|
|
// if (this.showPop) {
|
|
|
// if (this.mytext2.length < 2) {
|
|
|
// // console.log(this.mytext2.length);
|
|
|
// this.deptID = '';
|
|
|
// }
|
|
|
|
|
|
// if (this.productList2.length !== 0) {
|
|
|
// this.productList2.map(item => {
|
|
|
// if (item.deptName === newdata) {
|
|
|
// this.deptID = item.deptId;
|
|
|
// // console.log('mytexye');
|
|
|
// this.getUserDataList(item.deptId, this.nameSouSuo);
|
|
|
// }
|
|
|
// });
|
|
|
// }
|
|
|
// }
|
|
|
// },
|
|
|
//监听作业单位值变化，取作业单位id
|
|
|
nameSouSuo(newdata, olddata) {
|
|
|
if (this.showPop) {
|
|
|
//部门id为空
|
|
|
if (this.deptID.length === 0) {
|
|
|
//名字为空
|
|
|
if (newdata.length === 0) {
|
|
|
return;
|
|
|
} else {
|
|
|
console.log('部门为空，名字有');
|
|
|
this.getUserDataList(this.deptID, newdata);
|
|
|
}
|
|
|
} else {
|
|
|
//部门id不为空 名字为空
|
|
|
if (newdata.length === 0) {
|
|
|
console.log('部门id不为空 名字为空');
|
|
|
this.getUserDataList(this.deptID);
|
|
|
} else {
|
|
|
//部门id不为空 名字不为空
|
|
|
console.log('部门id不为空 名字不为空');
|
|
|
this.getUserDataList(this.deptID, newdata);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
//取消
|
|
|
goToPage1() {
|
|
|
//参数1：选择的人名信息，参数2：签字人
|
|
|
this.$emit('dataName', 'no', this.signName);
|
|
|
//传值完成，重置传值姓名数组
|
|
|
this.firepersonCheckList = [];
|
|
|
},
|
|
|
//确定
|
|
|
goToPage() {
|
|
|
//参数1：选择的人名信息，参数2：签字人
|
|
|
this.$emit('dataName', this.firepersonCheckList, this.signName);
|
|
|
//传值完成，重置传值姓名数组
|
|
|
this.firepersonCheckList = [];
|
|
|
},
|
|
|
// 点击选择名字
|
|
|
selectPerson(item) {
|
|
|
//单选
|
|
|
if (this.numDou === 1) {
|
|
|
//防止选择重复
|
|
|
if (this.firepersonCheckList.indexOf(item) === -1) {
|
|
|
if (this.firepersonCheckList.length < 1) {
|
|
|
this.firepersonCheckList.push(item);
|
|
|
} else {
|
|
|
this.firepersonCheckList.splice(0, 1, item);
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
//防止选择重复
|
|
|
if (this.firepersonCheckList.indexOf(item) === -1) {
|
|
|
this.firepersonCheckList.push(item);
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
// 删除名字
|
|
|
closeName(id) {
|
|
|
// console.log(this.firepersonCheckList.indexOf(id));
|
|
|
this.firepersonCheckList.splice(this.firepersonCheckList.indexOf(id), 1);
|
|
|
},
|
|
|
// //作业单位搜索框
|
|
|
// input2(val) {
|
|
|
// //不等于空才执行
|
|
|
// if (val != '') {
|
|
|
// //防抖节流
|
|
|
// listDept({
|
|
|
// deptName: val
|
|
|
// }).then(res => {
|
|
|
// this.productList2 = [];
|
|
|
// res.data.map(item => {
|
|
|
// this.productList2.push({ deptId: item.deptId, deptName: item.deptName });
|
|
|
// });
|
|
|
// });
|
|
|
// }
|
|
|
// },
|
|
|
getUserDataList(id, name) {
|
|
|
selectUserListBaseInfo({
|
|
|
deptId: id,
|
|
|
nickName: name
|
|
|
}).then(res => {
|
|
|
this.zyFzUserList = [];
|
|
|
res.data.map(item => {
|
|
|
this.zyFzUserList.push({ userId: item.userId, nickName: item.nickName, deptName: item.deptName });
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss"></style>
|
