|
@@ -1,7 +1,7 @@
|
|
<template>
|
|
<template>
|
|
<div class="ent_personal">
|
|
<div class="ent_personal">
|
|
<header>
|
|
<header>
|
|
- <h4>杭州琴月文创娱乐有限公司</h4> <span>已认证</span>
|
|
|
|
|
|
+ <h4>{{ $store.state.departList.department }}</h4> <span>已认证</span>
|
|
</header>
|
|
</header>
|
|
<div class="ent_personal_screen">
|
|
<div class="ent_personal_screen">
|
|
<button @click="addPerson('add')">添加人员</button>
|
|
<button @click="addPerson('add')">添加人员</button>
|
|
@@ -26,7 +26,10 @@
|
|
<el-table :data="tableData.list" style="width: 100%" @selection-change="allSelectNode">
|
|
<el-table :data="tableData.list" style="width: 100%" @selection-change="allSelectNode">
|
|
<el-table-column type="selection" width="55" :selectable="checkSelectable">
|
|
<el-table-column type="selection" width="55" :selectable="checkSelectable">
|
|
</el-table-column>
|
|
</el-table-column>
|
|
- <el-table-column prop="name" label="姓名" width="160" >
|
|
|
|
|
|
+ <el-table-column prop="name" label="姓名" width="160" >
|
|
|
|
+ <template slot="header">
|
|
|
|
+ <div style="cursor: pointer;" @click="getpersonData(sortObj.nameSort,'')">姓名 <i class="el-icon-arrow-down"></i></div>
|
|
|
|
+ </template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
<el-table-column label="邮箱" width="180">
|
|
<el-table-column label="邮箱" width="180">
|
|
<template slot-scope="scope">
|
|
<template slot-scope="scope">
|
|
@@ -35,7 +38,10 @@
|
|
</el-table-column>
|
|
</el-table-column>
|
|
<el-table-column prop="phone" label="手机">
|
|
<el-table-column prop="phone" label="手机">
|
|
</el-table-column>
|
|
</el-table-column>
|
|
- <el-table-column width="200" prop="dname" label="部门">
|
|
|
|
|
|
+ <el-table-column width="200" prop="dname" label="部门">
|
|
|
|
+ <template slot="header">
|
|
|
|
+ <div style="cursor: pointer;" @click="getpersonData('',sortObj.departSort)">部门 <i class="el-icon-arrow-down"></i></div>
|
|
|
|
+ </template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
<el-table-column
|
|
<el-table-column
|
|
label="角色">
|
|
label="角色">
|
|
@@ -71,7 +77,7 @@
|
|
<span><i>*</i> 人员姓名:</span>
|
|
<span><i>*</i> 人员姓名:</span>
|
|
<div :class="{test:ruleForm.nameStatus}">
|
|
<div :class="{test:ruleForm.nameStatus}">
|
|
<el-input v-model="ruleForm.name" @input="regName" placeholder="请输入人员姓名"></el-input>
|
|
<el-input v-model="ruleForm.name" @input="regName" placeholder="请输入人员姓名"></el-input>
|
|
- <p>请输入姓名</p>
|
|
|
|
|
|
+ <p>请输入正确的姓名</p>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</label>
|
|
<label class="required">
|
|
<label class="required">
|
|
@@ -81,9 +87,12 @@
|
|
<p>请输入正确的手机号</p>
|
|
<p>请输入正确的手机号</p>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</label>
|
|
- <label>
|
|
|
|
|
|
+ <label class="required">
|
|
<span>邮箱:</span>
|
|
<span>邮箱:</span>
|
|
- <el-input v-model="ruleForm.email" placeholder="请输入人员邮箱"></el-input>
|
|
|
|
|
|
+ <div :class="{test:ruleForm.emailStatus}">
|
|
|
|
+ <el-input v-model="ruleForm.email" placeholder="请输入人员邮箱" @input="emailReg"></el-input>
|
|
|
|
+ <p>请输入正确的邮箱格式</p>
|
|
|
|
+ </div>
|
|
</label>
|
|
</label>
|
|
<label>
|
|
<label>
|
|
<span>部门:</span>
|
|
<span>部门:</span>
|
|
@@ -112,9 +121,12 @@
|
|
<span><i>*</i>手机:</span>
|
|
<span><i>*</i>手机:</span>
|
|
<el-input v-model="ruleForm.phone" disabled placeholder="请输入人员手机号" ></el-input>
|
|
<el-input v-model="ruleForm.phone" disabled placeholder="请输入人员手机号" ></el-input>
|
|
</label>
|
|
</label>
|
|
- <label>
|
|
|
|
|
|
+ <label class="required">
|
|
<span>邮箱:</span>
|
|
<span>邮箱:</span>
|
|
- <el-input v-model="ruleForm.email" placeholder="请输入人员邮箱"></el-input>
|
|
|
|
|
|
+ <div :class="{test:ruleForm.emailStatus}">
|
|
|
|
+ <el-input v-model="ruleForm.email" placeholder="请输入人员邮箱" @input="emailReg"></el-input>
|
|
|
|
+ <p>请输入正确的邮箱格式</p>
|
|
|
|
+ </div>
|
|
</label>
|
|
</label>
|
|
<label>
|
|
<label>
|
|
<span>部门:</span>
|
|
<span>部门:</span>
|
|
@@ -129,15 +141,29 @@
|
|
</template>
|
|
</template>
|
|
</add-drawer>
|
|
</add-drawer>
|
|
|
|
|
|
|
|
+ <!-- 删除弹窗 -->
|
|
|
|
+ <del-popup ref="childDel" title="删除人员">
|
|
|
|
+ <template slot="content">
|
|
|
|
+ <p v-if="currentDelStatus === 'all'">
|
|
|
|
+ <span v-for="(item) in deal_selectDepart" :key="item.id">{{item.pname}}</span>
|
|
|
|
+ </p>
|
|
|
|
+ <p v-else> {{ruleForm.name}} </p>
|
|
|
|
+ </template>
|
|
|
|
+ <template slot="del">
|
|
|
|
+ <button @click="del_Btn" class="del">删除</button>
|
|
|
|
+ </template>
|
|
|
|
+ </del-popup>
|
|
|
|
+
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
import { personInter,departsAll,personAddInter,personDetailInter ,personUpdateInter,personDelInter} from '@/api/api';
|
|
import { personInter,departsAll,personAddInter,personDetailInter ,personUpdateInter,personDelInter} from '@/api/api';
|
|
import addDrawer from "./addDrawer";
|
|
import addDrawer from "./addDrawer";
|
|
|
|
+import delPopup from "./del";
|
|
export default {
|
|
export default {
|
|
components:{
|
|
components:{
|
|
- addDrawer
|
|
|
|
|
|
+ addDrawer,delPopup
|
|
},
|
|
},
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
@@ -152,7 +178,8 @@ export default {
|
|
email:'',
|
|
email:'',
|
|
personId:'',
|
|
personId:'',
|
|
nameStatus:false,
|
|
nameStatus:false,
|
|
- phoneStatus:false
|
|
|
|
|
|
+ phoneStatus:false,
|
|
|
|
+ emailStatus:false,
|
|
},
|
|
},
|
|
whichPart:'add',//add: 添加 edit: 编辑
|
|
whichPart:'add',//add: 添加 edit: 编辑
|
|
selectDepart:[],
|
|
selectDepart:[],
|
|
@@ -160,7 +187,18 @@ export default {
|
|
current:1,
|
|
current:1,
|
|
isSingle:false,
|
|
isSingle:false,
|
|
pageSize:10
|
|
pageSize:10
|
|
- }
|
|
|
|
|
|
+ },
|
|
|
|
+ sortObj:{
|
|
|
|
+ nameSort:true,
|
|
|
|
+ departSort:true,
|
|
|
|
+ },
|
|
|
|
+ currentSort:{
|
|
|
|
+ newName:'',
|
|
|
|
+ newDepart:''
|
|
|
|
+ },
|
|
|
|
+ pending:false,
|
|
|
|
+ currentArr:'',
|
|
|
|
+ currentDelStatus:''
|
|
}
|
|
}
|
|
},
|
|
},
|
|
created() {
|
|
created() {
|
|
@@ -173,6 +211,18 @@ export default {
|
|
})
|
|
})
|
|
},
|
|
},
|
|
computed:{
|
|
computed:{
|
|
|
|
+ deal_selectDepart:function(index){
|
|
|
|
+ let [...arr] = this.selectDepart
|
|
|
|
+ arr.forEach((v,i) =>{
|
|
|
|
+ if(i !== 0){
|
|
|
|
+ v.pname = `,${v.name}`
|
|
|
|
+ }else{
|
|
|
|
+ v.pname = `${v.name}`
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ console.log(arr,this.selectDepart)
|
|
|
|
+ return arr;
|
|
|
|
+ },
|
|
departMsg:function(){
|
|
departMsg:function(){
|
|
if(this.$store.state.chooseDepart){
|
|
if(this.$store.state.chooseDepart){
|
|
return this.$store.state.chooseDepart
|
|
return this.$store.state.chooseDepart
|
|
@@ -203,13 +253,36 @@ export default {
|
|
//获取当前点击页数据
|
|
//获取当前点击页数据
|
|
getPageData(page){
|
|
getPageData(page){
|
|
this.pagebj.current = page;
|
|
this.pagebj.current = page;
|
|
- this.getpersonData();
|
|
|
|
|
|
+ this.getpersonData(this.currentSort.newName,this.currentSort.newDepart,"page");
|
|
},
|
|
},
|
|
//人员数据
|
|
//人员数据
|
|
- getpersonData(){
|
|
|
|
|
|
+ getpersonData(name="",depart="",category=""){
|
|
|
|
+ if(category !== "page"){
|
|
|
|
+ if(name == "" && (typeof name == 'string')){
|
|
|
|
+
|
|
|
|
+ this.currentSort.newName = "";
|
|
|
|
+ }else{
|
|
|
|
+ this.currentSort.newDepart = "";
|
|
|
|
+ this.sortObj.nameSort = !(this.sortObj.nameSort);
|
|
|
|
+ this.currentSort.newName = this.sortObj.nameSort;
|
|
|
|
+ }
|
|
|
|
+ console.log(typeof depart,depart == "","=====")
|
|
|
|
+ if(depart == "" && (typeof depart === 'string')){
|
|
|
|
+ console.log("111")
|
|
|
|
+ this.currentSort.newDepart = "";
|
|
|
|
+ }else{
|
|
|
|
+ this.currentSort.newName = "";
|
|
|
|
+ this.sortObj.departSort = !this.sortObj.departSort;
|
|
|
|
+ this.currentSort.newDepart = this.sortObj.departSort;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ console.log(this.currentSort.newDepart,"=====this.currentSort.newDepart")
|
|
|
|
+
|
|
|
|
+
|
|
personInter({
|
|
personInter({
|
|
- nameSort:true,
|
|
|
|
- departmentSort:'',
|
|
|
|
|
|
+ nameSort:this.currentSort.newName,
|
|
|
|
+ departmentSort:this.currentSort.newDepart,
|
|
page:this.pagebj.current,
|
|
page:this.pagebj.current,
|
|
pageSize:this.pagebj.pageSize,
|
|
pageSize:this.pagebj.pageSize,
|
|
name:this.searchval,
|
|
name:this.searchval,
|
|
@@ -247,7 +320,8 @@ export default {
|
|
},
|
|
},
|
|
//验证姓名不能为空
|
|
//验证姓名不能为空
|
|
regName(){
|
|
regName(){
|
|
- this.ruleForm.name == '' ? this.ruleForm.nameStatus = true : this.ruleForm.nameStatus = false;
|
|
|
|
|
|
+ let reg = /[^\u4e00-\u9fa5]/g;
|
|
|
|
+ reg.test(this.ruleForm.name) || this.ruleForm.name == '' ? this.ruleForm.nameStatus = true : this.ruleForm.nameStatus = false;
|
|
},
|
|
},
|
|
//验证手机号是否正确
|
|
//验证手机号是否正确
|
|
regPhone(){
|
|
regPhone(){
|
|
@@ -257,7 +331,9 @@ export default {
|
|
//删除人员
|
|
//删除人员
|
|
delDepart(status){
|
|
delDepart(status){
|
|
// status all:d多选删除 single:编辑单个删除
|
|
// status all:d多选删除 single:编辑单个删除
|
|
- let delId = ''
|
|
|
|
|
|
+ this.currentDelStatus = status;
|
|
|
|
+ let delId = '';
|
|
|
|
+
|
|
if(status === 'all'){
|
|
if(status === 'all'){
|
|
this.selectDepart.forEach((v,i) =>{
|
|
this.selectDepart.forEach((v,i) =>{
|
|
if(v.id){
|
|
if(v.id){
|
|
@@ -271,7 +347,13 @@ export default {
|
|
this.$message({message: '企业管理员禁止删除',type: 'warning'});
|
|
this.$message({message: '企业管理员禁止删除',type: 'warning'});
|
|
return;
|
|
return;
|
|
}
|
|
}
|
|
- personDelInter({id:delId}).then(res =>{
|
|
|
|
|
|
+ this.currentArr = delId;
|
|
|
|
+ this.$refs.childDel.dialogTableVisible = true;
|
|
|
|
+ },
|
|
|
|
+ //确认删除人员
|
|
|
|
+ del_Btn(){
|
|
|
|
+ personDelInter({id:this.currentArr}).then(res =>{
|
|
|
|
+ this.$refs.childDel.dialogTableVisible = false;
|
|
if(res.data.status == 1){
|
|
if(res.data.status == 1){
|
|
this.getpersonData();
|
|
this.getpersonData();
|
|
this.$message({ message: '删除成功',type: 'success'});
|
|
this.$message({ message: '删除成功',type: 'success'});
|
|
@@ -285,29 +367,47 @@ export default {
|
|
chooseDepartFc(){
|
|
chooseDepartFc(){
|
|
this.$refs.addDrewer.findCompont();
|
|
this.$refs.addDrewer.findCompont();
|
|
},
|
|
},
|
|
|
|
+ //邮箱验证
|
|
|
|
+ emailReg(){
|
|
|
|
+ var reg = new RegExp("^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"); //正则表达式
|
|
|
|
+ console.log(this.ruleForm.email,"===this.ruleForm.email")
|
|
|
|
+ if(this.ruleForm.email == "") return this.ruleForm.emailStatus = false;
|
|
|
|
+ if (!reg.test(this.ruleForm.email)){
|
|
|
|
+ // this.$message({ message: '邮箱地址格式错误', type: 'warning' });
|
|
|
|
+ this.ruleForm.emailStatus = true
|
|
|
|
+ }else{
|
|
|
|
+ this.ruleForm.emailStatus = false;
|
|
|
|
+ }
|
|
|
|
+ },
|
|
// 保存、编辑人员信息
|
|
// 保存、编辑人员信息
|
|
saveDepart(){
|
|
saveDepart(){
|
|
let deparId = '';
|
|
let deparId = '';
|
|
- this.departMsg.id ? deparId = this.departMsg.id : deparId = this.$store.state.entId;
|
|
|
|
|
|
+ if(this.pending) return;
|
|
|
|
+ this.departMsg.id ? deparId = this.departMsg.id : deparId = this.$store.state.entMsg.dept_id;
|
|
|
|
+ this.regName();
|
|
|
|
+ this.regPhone();
|
|
|
|
+ if(this.ruleForm.emailStatus) return;
|
|
|
|
+
|
|
if(this.whichPart === "add"){
|
|
if(this.whichPart === "add"){
|
|
-
|
|
|
|
- if(this.ruleForm.nameStatus && this.ruleForm.phoneStatus) {
|
|
|
|
- this.regName();
|
|
|
|
- this.regPhone();
|
|
|
|
- }else{
|
|
|
|
-
|
|
|
|
- personAddInter({name:this.ruleForm.name,phone:this.ruleForm.phone,mail:this.ruleForm.email,id:deparId}).then(res =>{
|
|
|
|
|
|
+ if(!this.ruleForm.nameStatus && !this.ruleForm.phoneStatus) {
|
|
|
|
+ this.pending = true;
|
|
|
|
+ personAddInter({name:this.ruleForm.name,phone:this.ruleForm.phone,mail:this.ruleForm.email,id:deparId}).then(res =>{
|
|
|
|
+ this.pending = false
|
|
if(res.data.status == 1){
|
|
if(res.data.status == 1){
|
|
this.$refs.addDrewer.drawer = false;
|
|
this.$refs.addDrewer.drawer = false;
|
|
this.getpersonData();
|
|
this.getpersonData();
|
|
this.$message({message: '添加成功',type: 'success'});
|
|
this.$message({message: '添加成功',type: 'success'});
|
|
- }else{
|
|
|
|
|
|
+ }else if(res.data.status == -1){
|
|
|
|
+ this.$message({ message: '该手机号在本企业内已存在', type: 'warning'});
|
|
|
|
+ }else {
|
|
this.$message({ message: '添加失败', type: 'warning'});
|
|
this.$message({ message: '添加失败', type: 'warning'});
|
|
}
|
|
}
|
|
})
|
|
})
|
|
}
|
|
}
|
|
}else{
|
|
}else{
|
|
|
|
+ this.pending = true;
|
|
personUpdateInter({mail:this.ruleForm.email,did:deparId,id:this.ruleForm.personId}).then(res =>{
|
|
personUpdateInter({mail:this.ruleForm.email,did:deparId,id:this.ruleForm.personId}).then(res =>{
|
|
|
|
+ this.pending = false
|
|
if(res.data.status == 1){
|
|
if(res.data.status == 1){
|
|
this.$refs.addDrewer.drawer = false;
|
|
this.$refs.addDrewer.drawer = false;
|
|
this.getpersonData();
|
|
this.getpersonData();
|