Commit 4e98dabf authored by 王晓旭's avatar 王晓旭

员工管理,点击部门新增时带过去

parent ce4dd66b
<template> <template>
<div> <div>
<!-- 弹出框表单 --> <!-- 弹出框表单 -->
<el-drawer <el-drawer :title="title" :visible.sync="open" :direction="direction" size="50%">
:title="title" <div class="tips">此功能为快速添加员工入口,如需为员工办理完整的入职手续,请使用[员工关系-入职管理]功能</div>
:visible.sync="open"
:direction="direction"
size="50%">
<div class="tips">此功能为快速添加员工入口,如需为员工办理完整的入职手续,请使用[员工关系-入职管理]功能</div>
<el-form ref="form" :model="form" :rules="rules" label-width="120px"> <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row> <el-row>
<!-- <Field label="性别" prop="gender" v-model="form.gender" type="select" :enumData="dict.gender" placeholder="请选择性别"/> --> <!-- <Field label="性别" prop="gender" v-model="form.gender" type="select" :enumData="dict.gender" placeholder="请选择性别"/> -->
<!-- <Field label="出生日期" prop="birthday" v-model="form.birthday" type="date" /> --> <!-- <Field label="出生日期" prop="birthday" v-model="form.birthday" type="date" /> -->
<!-- <Field label="照片" prop="photoPath" v-model="form.photoPath" type="textarea" placeholder="请输入照片"/> --> <!-- <Field label="照片" prop="photoPath" v-model="form.photoPath" type="textarea" placeholder="请输入照片"/> -->
<!-- <Field label="身份证号码" prop="idCard" v-model="form.idCard" placeholder="请输入身份证号码"/> --> <!-- <Field label="身份证号码" prop="idCard" v-model="form.idCard" placeholder="请输入身份证号码"/> -->
<!-- <Field label="工号" prop="workNum" v-model="form.workNum" placeholder="请输入工号"/> --> <!-- <Field label="工号" prop="workNum" v-model="form.workNum" placeholder="请输入工号"/> -->
<!-- <Field label="政治面貌 " prop="politicalstatus" v-model="form.politicalstatus" type="select" :enumData="dict.politicalstatus" placeholder="请选择政治面貌 "/> --> <!-- <Field label="政治面貌 " prop="politicalstatus" v-model="form.politicalstatus" type="select" :enumData="dict.politicalstatus" placeholder="请选择政治面貌 "/> -->
<!-- <Field label="所属部门名称" prop="deptName" v-model="form.deptName" placeholder="请输入所属部门名称"/> --> <!-- <Field label="所属部门名称" prop="deptName" v-model="form.deptName" placeholder="请输入所属部门名称"/> -->
<Field label="员工姓名" :maxLength="10" prop="name" v-model="form.name" placeholder="请输入员工姓名"/> <Field
label="员工姓名"
:maxLength="10"
prop="name"
v-model="form.name"
placeholder="请输入员工姓名"
/>
<Field label="手机号码" :maxLength="11" prop="phoneNumber" v-model="form.phoneNumber" placeholder="请输入联系电话"/> <Field
label="手机号码"
:maxLength="11"
prop="phoneNumber"
v-model="form.phoneNumber"
placeholder="请输入联系电话"
/>
<!-- <Field label="所属部门" :maxLength="10" prop="deptName" v-model="form.deptName" placeholder="请选择所属部门" @focus="ishowBumen = true"/> <!-- <Field label="所属部门" :maxLength="10" prop="deptName" v-model="form.deptName" placeholder="请选择所属部门" @focus="ishowBumen = true"/>
--> -->
<Field label="所属部门" prop="deptId" v-model="form.deptId" :enumData="dict.deptId" type="select" placeholder="请选择所属部门" /> <Field
label="所属部门"
prop="deptId"
v-model="form.deptId"
:enumData="dict.deptId"
type="select"
placeholder="请选择所属部门"
/>
<Field
label="职位"
prop="positionId"
v-model="form.positionId"
:enumData="dict.positionId"
type="select"
placeholder="请选择职位"
/>
<Field label="职位" prop="positionId" v-model="form.positionId" :enumData="dict.positionId" type="select" placeholder="请选择职位" /> <Field
label="工号"
:maxLength="15"
prop="workNum"
v-model="form.workNum"
placeholder="请输入工号"
/>
<Field label="工号" :maxLength="15" prop="workNum" v-model="form.workNum" placeholder="请输入工号"/> <!-- <Field label="是否在政务大厅" prop="positionId" v-model="form.positionId" placeholder="请选择" type="select"/> -->
<!-- <Field label="职位名称" prop="positionName" v-model="form.positionName" placeholder="请输入职位名称"/> -->
<!-- <Field label="员工类型" prop="staffType" v-model="form.staffType" type="select" :enumData="dict.staffType" placeholder="请选择员工类型"/> -->
<!-- <Field label="员工状态" prop="status" v-model="form.status" type="select" :enumData="dict.status" placeholder="请选择员工状态"/> -->
<!-- <Field label="入职登记表" prop="registerPath" v-model="form.registerPath" type="textarea" placeholder="请输入入职登记表"/> -->
<!-- <Field label="入职时间" prop="entryDate" v-model="form.entryDate" type="date" /> -->
<!-- <Field label="转正时间" prop="regularDate" v-model="form.regularDate" type="date" /> -->
<!-- <Field label="离职时间" prop="leaveDate" v-model="form.leaveDate" type="date" /> -->
<!-- <Field label="备注" prop="remark" v-model="form.remark" type="textarea" placeholder="请输入备注"/> -->
</el-row>
<!-- <Field label="是否在政务大厅" prop="positionId" v-model="form.positionId" placeholder="请选择" type="select"/> --> <form-buttons @submit="submitForm" noCancelBtn />
<!-- <Field label="职位名称" prop="positionName" v-model="form.positionName" placeholder="请输入职位名称"/> --> </el-form>
<!-- <Field label="员工类型" prop="staffType" v-model="form.staffType" type="select" :enumData="dict.staffType" placeholder="请选择员工类型"/> --> </el-drawer>
<!-- <Field label="员工状态" prop="status" v-model="form.status" type="select" :enumData="dict.status" placeholder="请选择员工状态"/> --> <!-- 部门选择 -->
<!-- <Field label="入职登记表" prop="registerPath" v-model="form.registerPath" type="textarea" placeholder="请输入入职登记表"/> --> <el-dialog :visible.sync="ishowBumen" width="70%">
<!-- <Field label="入职时间" prop="entryDate" v-model="form.entryDate" type="date" /> --> <el-row type="flex" :gutter="20" style="height:40vh">
<!-- <Field label="转正时间" prop="regularDate" v-model="form.regularDate" type="date" /> --> <el-col :span="12">
<!-- <Field label="离职时间" prop="leaveDate" v-model="form.leaveDate" type="date" /> --> <el-scrollbar style="height: 100%">
<!-- <Field label="备注" prop="remark" v-model="form.remark" type="textarea" placeholder="请输入备注"/> --> <el-tree
</el-row> size="mini"
ref="siteTree"
<form-buttons @submit='submitForm' noCancelBtn /> :data="bumentree"
</el-form> id="el-tree"
</el-drawer> node-key="id"
<!-- 部门选择 --> indent="4"
<el-dialog :visible.sync="ishowBumen" width="70%"> :props="treeProps"
<el-row type="flex" :gutter="20" style="height:40vh"> :load="loadNode"
<el-col :span="12"> highlight-current
<el-scrollbar style="height: 100%"> default-expand-all
<el-tree :expand-on-click-node="false"
size="mini" :render-content="renderContent"
ref="siteTree" @node-click="handleNodeClick"
:data="bumentree" ></el-tree>
id="el-tree" </el-scrollbar>
node-key="id" </el-col>
indent="4" <el-col :span="12">
:props="treeProps" <div class="titles">已选部门</div>
:load="loadNode" <div
highlight-current class="el-tag flex flex-pack-justify mt10"
default-expand-all v-if="deptnode.label"
:expand-on-click-node="false" style="max-width:80%"
:render-content="renderContent" >
@node-click="handleNodeClick" <div>{{deptnode.label}}</div>
> <div @click="cancledept()">
</el-tree> <i class="el-icon-close"></i>
</el-scrollbar>
</el-col>
<el-col :span="12">
<div class="titles">已选部门</div>
<div class="el-tag flex flex-pack-justify mt10" v-if="deptnode.label" style="max-width:80%">
<div>{{deptnode.label}}</div>
<div @click="cancledept()">
<i class="el-icon-close"></i>
</div>
</div>
</el-col>
</el-row>
<div class="mt20">
<el-button type="primary" size="mini" @click="comfirmbument">确定</el-button>
<el-button size="mini" @click="ishowBumen = false">取消</el-button>
</div> </div>
</el-dialog> </div>
</div> </el-col>
</el-row>
<div class="mt20">
<el-button type="primary" size="mini" @click="comfirmbument">确定</el-button>
<el-button size="mini" @click="ishowBumen = false">取消</el-button>
</div>
</el-dialog>
</div>
</template> </template>
<script> <script>
import form from "@/assets/mixins/formdialog"; import form from "@/assets/mixins/formdialog";
export default { export default {
name: "StaffDetail", name: "StaffDetail",
mixins: [form], mixins: [form],
props:{ props: {
bumentree:{ bumentree: {
type:Array, type: Array,
default:[] default: []
} },
}, currentNode:{
components: { type:Object,
default:{}
}
},
components: {},
watch: {
open(newval) {
if (newval) {
console.log(newval, this.currentNode, this.form.deptId,this.dict.deptId);
if(this.currentNode && this.currentNode.id){
this.form.deptId = JSON.stringify(this.currentNode.id)
this.form.deptName = this.currentNode.label
}
console.log(newval, this.currentNode, this.form.deptId);
}, }
created() { }
this.changePath("staff") },
}, created() {
data() { this.changePath("staff");
return { },
// 遮罩层 data() {
loading: true, return {
// 弹出层标题 // 遮罩层
title: "个人主页", loading: true,
// 是否显示弹出层 // 弹出层标题
open: false, title: "个人主页",
direction:"rtl", // 是否显示弹出层
toString:[ open: false,
"gender", direction: "rtl",
"politicalstatus", toString: ["gender", "politicalstatus", "staffType", "status"],
"staffType", toDate: ["birthday", "entryDate", "regularDate", "leaveDate"],
"status", // 表单校验
], rules: {
toDate:[ name: [
"birthday", { required: true, message: "请输入员工姓名", trigger: "blur" },
"entryDate", { max: 64, message: "最多只能录入64个字符", trigger: "blur" }
"regularDate", ],
"leaveDate", phoneNumber: [
], { required: true, message: "请输入员工手机号码", trigger: "blur" },
// 表单校验 { max: 11, message: "最多只能录入11个字符", trigger: "blur" }
rules: { ],
name: [ deptName: [
{required: true,message: "请输入员工姓名", trigger: "blur" }, { required: true, message: "请选择所属部门", trigger: "change" }
{max: 64,message: "最多只能录入64个字符",trigger: "blur",}, ],
], positionId: [
phoneNumber: [ { required: true, message: "请选择职位", trigger: "blur" }
{required: true,message: "请输入员工手机号码", trigger: "blur" }, ],
{max: 11,message: "最多只能录入11个字符",trigger: "blur",}, workNum: [{ required: true, message: "请输入工号" }]
], },
deptName: [ treeProps: {
{required: true,message: "请选择所属部门", trigger: "change" }, id: "id",
], label: "label",
positionId: [ areaCode: "areaCode",
{required: true,message: "请选择职位", trigger: "blur" } type: "type",
], isLeaf: "isLeaf",
workNum: [ children: "children",
{required: true,message: "请输入工号" }, icon: "icon"
], },
}, ishowBumen: false,
treeProps: { deptnode: {}
id: "id", };
label: "label", },
areaCode:"areaCode",
type: "type",
isLeaf: "isLeaf",
children: "children",
icon: "icon",
},
ishowBumen:false,
deptnode:{}
}
},
methods: { methods: {
renderContent: function (h, { node, data, store }) { renderContent: function(h, { node, data, store }) {
return ( return (
<span> <span>
<i style="font-size:16px;color:#409EFF" class={data.icon}></i> <i style="font-size:16px;color:#409EFF" class={data.icon}></i>
<span style="padding-left: 2px;font-size:14px">{node.label}</span> <span style="padding-left: 2px;font-size:14px">{node.label}</span>
</span> </span>
) );
}, },
async loadNode(node, resolve) { async loadNode(node, resolve) {
if (node.level === 0) { if (node.level === 0) {
return; return;
} }
resolve(data.result); resolve(data.result);
}, },
// 点击 // 点击
handleNodeClick(node) { handleNodeClick(node) {
this.deptnode = node this.deptnode = node;
}, },
comfirmbument(){ comfirmbument() {
this.form.deptId = this.deptnode.id this.form.deptId = this.deptnode.id;
this.form.deptName = this.deptnode.label this.form.deptName = this.deptnode.label;
this.ishowBumen = false this.ishowBumen = false;
}, },
/** 编辑 */ /** 编辑 */
edit(row) { edit(row) {
this.reset() this.reset();
this.query = { id: row.id }; this.query = { id: row.id };
this.urls.currUrl ="staff/edit"; this.urls.currUrl = "staff/edit";
this.getData(); this.getData();
this.pageInfo.type="edit" this.pageInfo.type = "edit";
this.title = "修改员工基本信息"; this.title = "修改员工基本信息";
}, },
/** 新增 */ /** 新增 */
add(row) { add(row) {
this.reset() this.reset();
this.urls.currUrl = "staff/add"; this.urls.currUrl = "staff/add";
this.getData(); this.getData();
this.pageInfo.type="add" this.pageInfo.type = "add";
this.title = "新增员工基本信息"; this.title = "新增员工基本信息";
}, },
/** 查看*/ /** 查看*/
view(row) { view(row) {
this.reset() this.reset();
this.query = { id: row.id }; this.query = { id: row.id };
this.urls.currUrl ="staff/view"; this.urls.currUrl = "staff/view";
this.getData(); this.getData();
this.pageInfo.type="view" this.pageInfo.type = "view";
this.title = "员工基本信息详细"; this.title = "员工基本信息详细";
}, },
/**取消按钮 */ /**取消按钮 */
cancel() { cancel() {
this.open = false; this.open = false;
}, },
/**获取数据后弹框 */ /**获取数据后弹框 */
afterRender(data) { afterRender(data) {
this.open = true; this.open = true;
}, },
afterSubmit(data) { afterSubmit(data) {
this.open = false; this.open = false;
this.$emit("ok"); this.$emit("ok");
}, },
// 表单重置 // 表单重置
reset() { reset() {
this.form = { this.form = {
name : "", name: "",
gender : 1, gender: 1,
birthday : null, birthday: null,
photoPath : "", photoPath: "",
phoneNumber : "", phoneNumber: "",
idCard : "", idCard: "",
workNum : "", workNum: "",
politicalstatus : 1, politicalstatus: 1,
deptId : null, deptId: null,
deptName : "", deptName: "",
positionId : null, positionId: null,
positionName : "", positionName: "",
staffType : 1, staffType: 1,
status : 1, status: 1,
registerPath : "", registerPath: "",
entryDate : null, entryDate: null,
regularDate : null, regularDate: null,
leaveDate : null, leaveDate: null,
remark : "", remark: ""
}; };
this.resetForm("form"); this.resetForm("form");
}, },
resetForm(refName) { resetForm(refName) {
if (this.$refs[refName]) { if (this.$refs[refName]) {
this.$refs[refName].resetFields(); this.$refs[refName].resetFields();
} }
}, },
cancledept(){ cancledept() {
this.deptnode = {} this.deptnode = {};
}
}
} }
}
};
</script> </script>
<style scoped> <style scoped>
.tips{ .tips {
margin-left: 120px; margin-left: 120px;
margin-bottom: 20px; margin-bottom: 20px;
color: #999; color: #999;
font-size: 15px; font-size: 15px;
} }
.titles{ .titles {
color: #409EFF; color: #409eff;
font-size: 16px; font-size: 16px;
display: flex; display: flex;
align-items: center; align-items: center;
} }
.titles::before{ .titles::before {
content: ''; content: "";
width:6px; width: 6px;
height: 16px; height: 16px;
background-color: #409EFF; background-color: #409eff;
display: inline-block; display: inline-block;
margin-right: 10px; margin-right: 10px;
} }
......
...@@ -182,7 +182,7 @@ ...@@ -182,7 +182,7 @@
</div> </div>
</el-dialog> </el-dialog>
<drawer-show ref="drawerform" @ok="getData" :bumentree="areaData" /> <drawer-show ref="drawerform" @ok="getData" :bumentree="areaData" :currentNode="currentNode"/>
</div> </div>
</template> </template>
...@@ -248,6 +248,7 @@ export default { ...@@ -248,6 +248,7 @@ export default {
}, },
handleNodeClick(node) { handleNodeClick(node) {
console.log(node,123123);
this.currentNode = node; this.currentNode = node;
this.query = { deptId: node.id }; this.query = { deptId: node.id };
this.getData(); this.getData();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment