Skip to content

O
office-web
Commit 0c70700d by xiaohai
Options

.

parent cc63d844
Showing with 891 additions and 173 deletions
src/components/common/vueSelector.vue 0 → 100644
<template>
<el-dialog
:title="treeSet.isSelectPerson ? '选择人员' : '选择部门'"
width="660px"
:visible.sync="treeSet.dialogVisible"
>
<div class="transfer-area">
<div class="select-area t-a-select">
<p class="title">选择</p>
<div class="tree-div">
<div class="input-container">
<el-input v-model="searchText" placeholder="请输入内容"></el-input>
</div>
<el-tree
class="search-menu"
node-key="id"
ref="tree"
:check-strictly="true"
:default-expanded-keys="defaultOpen"
:data="menuData"
show-checkbox
:highlight-current="true"
:expand-on-click-node="false"
icon-class="open-child"
:props="myProps"
:filter-node-method="filterNode"
@check-change="getCurrentNode"
@node-expand="nodeOpen"
@node-collapse="nodeClose"
@node-click="handleNodeClick">
<span class="custom-tree-node" :class="data.disableOpen ? 'disable-open' : ''" slot-scope="{ node, data }">
<span>{{ node.label }}</span>
<span class="open-btn" v-if="data.childrens">
<el-button @click="nodeOpen(data, node)" :disabled="data.disableOpen" type="text" size="small">下级</el-button>
</span>
</span>
</el-tree>
</div>
</div>
<div class="selected-area t-a-select">
<p class="title">
已选
<a class="J_del-all" @click="delSelected('empty')">全部清除</a>
</p>
<div class="tree-div">
<ul class="selected-list">
<template v-for="li in selectedList">
<li class="list group-li" :class="li.groupId ? 'group-li' : 'person-li'" :key="li.id+li.label" v-if="selectedList.length > 0">
<div class="label">
<i class="iconfont" :class="li.groupId ? 'icon-tongshi-zuzhijiagou' : 'icon-chengyuan'"></i>{{li.label}}
</div>
<div class="close-btn" @click="delSelected(li)">
<i class="el-icon-close"></i>
</div>
</li>
</template>
</ul>
</div>
</div>
</div>
<div class="btn-box t-rt p-b-10">
<el-button @click="treeSet.dialogVisible = false;">取消</el-button>
<el-button type="primary" @click="submitSelected">确定</el-button>
</div>
</el-dialog>
</template>
<script>
import { formatTreeData, deepCopy } from '@/utils/index';
import { getRequest, postRequest, postJsonRequest } from '@/api/api';
export default {
name: "vue-select-employee",
props: {
treeSet: {
type: Object,
default() {
return {
isSelectPerson: true,
dialogVisible: false,
isSingle: false // 是否单选
}
}
},
treeData: {
type: Object,
default() {
return {};
}
},
onlyGroup: {
type: Array,
default() {
return [];
}
},
onlyPerson: {
type: Boolean,
default: false
},
defaultSelection: {
type: [Object, Array],
default() {
return [];
}
}
},
data() {
return {
searchText: "",
myProps: {
children: 'childrens',
label: 'label',
disabled: "disabled"
},
menusObj: {},
menuData: [],
defaultOpen: [],
selectedList: []
};
},
methods: {
getTreeData() {
},
formatGroupData(treeData, personData) {
let _this = this;
let data = [].concat(JSON.parse(JSON.stringify(treeData)));
let employees = [].concat(JSON.parse(JSON.stringify(personData)));
let copyData = data.slice(0);
let onlyGroup = _this.onlyGroup;
this.menuData = [];
this.defaultOpen = [];
this.menusObj = {};
data.forEach(group => {
group.allClerks = null;
group.childrens = null;
group.label = group.name || "";
group.id = group.groupId || "";
let allClerks = [];
let arr = [];
if (onlyGroup.length > 0) {
if (onlyGroup.indexOf(group.groupId) > -1) {
group.disableOpen = false;
group.disabled = true;
} else {
group.disabled = true;
group.disableOpen = true;
}
} else {
group.disabled = _this.onlyPerson ? true : group.hasPression == 1 ? false : true;
}
copyData.forEach(cG => {
cG.label = cG.name || "";
cG.id = cG.groupId || "";
cG.disableOpen = false;
if (onlyGroup.length > 0) {
if (onlyGroup.indexOf(cG.groupId) > -1) {
cG.disableOpen = false;
cG.disabled = true;
if (cG.parentId == group.groupId) {
arr.push(cG);
}
} else {
cG.disabled = true;
cG.disableOpen = true;
}
} else {
cG.disabled = _this.onlyPerson ? true : cG.hasPression == 1 ? false : true;
if (cG.parentId == group.groupId) {
arr.push(cG);
}
}
});
if (_this.treeSet.isSelectPerson && group.hasPression == 1) employees.forEach(person => {
person.label = person.name;
person.id = person.employeeClerkId;
if (person.departmentId == group.groupId) {
arr.push(person);
allClerks.push(person);
}
_this.menusObj[person.id] = person;
});
if (arr.length > 0) group.childrens = arr;
group.allClerks = allClerks;
if (onlyGroup.length > 0) {
if (onlyGroup.indexOf(group.groupId) > -1) {
group.hasLoad = true;
_this.defaultOpen.push(group.id);
if (onlyGroup.indexOf(group.parentId) < 0) {
_this.menuData.push(group);
}
}
} else {
if (group.level == 0) {
group.disabled = true;
group.hasLoad = true;
_this.menuData = [group];
_this.defaultOpen.push(group.id);
}
}
_this.menusObj[group.id] = group;
});
},
/**
* 树形菜单选择
*/
handleNodeClick(obj, node) {
this.$emit("handleTreeSelection", obj, node, 'node');
},
/**
* 获取当前复选框状态改变的节点，如果被选中，将禁用展开
*/
getCurrentNode(data, ifChecked) {
data.disableOpen = ifChecked;
this.selectedList = this.$refs.tree.getCheckedNodes();
if (this.treeSet.isSingle && this.selectedList.length > 1) {
let index = this.selectedList.indexOf(data);
this.selectedList.splice(1 - index, 1);
this.$refs.tree.setCheckedNodes(this.selectedList);
}
},
/**
* 节点展开时，禁用复选框
*/
nodeOpen(data, self) {
data.disabled = true;
},
/**
* 节点关闭时，取消复选框的禁用
*/
nodeClose(data, node, self) {
data.disabled = this.onlyPerson ? true : data.hasPression != 1;
},
/**
* 关键词搜索
*/
filterNode(value, data) {
if (!value) return true;
return (data.label.indexOf(value) !== -1 || (data.phoneNumber || "").indexOf(value) !== -1);
},
/**
* 删除已选项
*/
delSelected(obj) {
if (obj == 'empty') {
this.$refs.tree.setCheckedKeys([]);
this.selectedList = [];
} else {
let index = this.selectedList.indexOf(obj);
this.selectedList.splice(index, 1);
this.$refs.tree.setCheckedNodes(this.selectedList);
}
},
/**
* 外抛已选的数据
*/
submitSelected() {
this.$emit("handleSelectedList", this.treeSet.isSingle ? this.selectedList[0] : this.selectedList);
this.treeSet.dialogVisible = false;
}
},
mounted() {
console.log(this.$refs, "this");
},
watch: {
searchText(newK, old) {
this.$refs.tree.filter(newK);
},
treeData(newData) {
// let treeData = [].concat(JSON.parse(JSON.stringify(newData.treeData)));
// let personData = [].concat(JSON.parse(JSON.stringify(newData.personData)));
this.formatGroupData(newData.treeData, newData.personData);
},
treeSet(obj) {
if (obj.dialogVisible) {
this.formatGroupData(this.treeData.treeData, this.treeData.personData);
if (this.defaultSelection) {
let list = this.defaultSelection;
this.$nextTick(() => {
console.log(this.$refs, "this");
this.selectedList = list;
this.$refs.tree.setCheckedNodes(list);
list.forEach(li => {
if (li.employeeClerkId) {
this.defaultOpen = [li.departmentId];
} else {
this.defaultOpen.push(this.menusObj[li.id].parentId);
}
});
});
}
}
}
}
};
</script>
<style lang="scss">
.p-b-10 {
padding-bottom: 10px;
}
.transfer-area {
display: flex;
margin-bottom: 40px;
.t-a-select {
width:300px;
height:415px;
background:rgba(255,255,255,1);
border:1px solid rgba(220,223,230,1);
border-radius:4px;
overflow: hidden;
&:first-child {
margin-right: 20px;
}
>.title {
width:100%;
height:42px;
line-height: 42px;
background:rgba(245,247,250,1);
border-bottom:1px solid rgba(220,223,230,1);
border-radius:4px;
text-indent: 15px;
color: #303133;
font-size: 16px;
.J_del-all {
font-size: 14px;
color: #409EFF;
float: right;
cursor: pointer;
margin-right: 15px;
}
}
.tree-div {
width: 100%;
height: 373px;
overflow: auto;
padding: 15px;
box-sizing: border-box;
.search-menu {
margin-top: 20px;
color: #606266;
font-size: 14px;
min-width: 100%;
display:inline-block !important;
.el-tree-node {
.el-tree-node__content {
height: 36px;
position: relative;
.open-child {
position: absolute;
right: 0;
top: 0;
width: 36px;
height: 36px;
padding: 0;
box-sizing: border-box;
}
.custom-tree-node {
flex: 1;
height: 100%;
line-height: 36px;
.open-btn {
width: 50px;
height: 14px;
color: #409EFF;
float: right;
text-align: right;
border-left: 1px solid #DCDFE6;
margin-top: 11px;
line-height: 14px;
}
&.disable-open {
z-index: 999;
}
}
&:hover {
background: none;
}
}
}
}
.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {
background: none;
}
}
.selected-list {
.list {
padding: 12px 0;
display: flex;
.label {
flex: 1;
.iconfont {
color: #409EFF;
margin-right: 5px;
}
}
.close-btn {
width: 16px;
height: 16px;
line-height: 18px;
text-align: center;
cursor: pointer;
border-radius: 100%;
font-size: 8px;
vertical-align: middle;
&:hover {
color: #fff;
background: #909399;
}
}
}
}
}
}
</style>
\ No newline at end of file
src/components/employeeRecord/employeeList.vue
...@@ -3,6 +3,8 @@ ...@@ -3,6 +3,8 @@
<div class="handle-area"> <div class="handle-area">
<div class="flex1"> <div class="flex1">
<template v-if="!isUnEmployee"> <template v-if="!isUnEmployee">
<el-button @click="callSelector" style="margin-right: 10px; height:32px;">选择部门/员工</el-button>
<el-button @click="callStoreSelector" style="margin-right: 10px; height:32px;">选择门店/员工</el-button>
<el-select v-model="clerkType" placeholder="选择类型" @change="reGetList" class="m-r-10"> <el-select v-model="clerkType" placeholder="选择类型" @change="reGetList" class="m-r-10">
<el-option <el-option
v-for="(type, index) in typeLsit" v-for="(type, index) in typeLsit"
...@@ -35,8 +37,9 @@ ...@@ -35,8 +37,9 @@
:picker-options="pickerOptions2"> :picker-options="pickerOptions2">
</el-date-picker> </el-date-picker>
</div> </div>
<el-input v-model="searchParam" placeholder="请输入姓名或手机号" style="width: 218px;margin-left:10px;" @keyup.enter.native="searchFn" clearable @clear="searchFn"></el-input>
</div> </div>
<el-button type="primary">导出<i class="el-icon-upload el-icon--right"></i></el-button> <el-button type="primary" v-if="!isUnEmployee" @click="showExportSet">导出<i class="el-icon-upload el-icon--right"></i></el-button>
</div> </div>
<el-table <el-table
class="list-table" class="list-table"
...@@ -66,12 +69,14 @@ ...@@ -66,12 +69,14 @@
width="480px"> width="480px">
<handle-dialog :employee="employeeObj" :handleType="handleType" :typeTitle="typeTitle" @handleSuccess="handleSuccess"></handle-dialog> <handle-dialog :employee="employeeObj" :handleType="handleType" :typeTitle="typeTitle" @handleSuccess="handleSuccess"></handle-dialog>
</el-dialog> </el-dialog>
<vue-selector></vue-selector>
</div> </div>
</template> </template>
<script> <script>
import { getRequest, postRequest, postJsonRequest } from '@/api/api'; import { getRequest, postRequest, postJsonRequest } from '@/api/api';
import listItem from "components/employeeRecord/listItem"; import listItem from "components/employeeRecord/listItem";
import handleDialog from "components/employeeRecord/handleDialog"; import handleDialog from "components/employeeRecord/handleDialog";
import vueSelector from "components/common/vueSelector";
export default { export default {
name: "employeeRecordList", name: "employeeRecordList",
props: { props: {
...@@ -82,7 +87,8 @@ export default { ...@@ -82,7 +87,8 @@ export default {
}, },
components: { components: {
listItem, listItem,
handleDialog handleDialog,
vueSelector
}, },
data() { data() {
return { return {
...@@ -129,10 +135,21 @@ export default { ...@@ -129,10 +135,21 @@ export default {
employeeObj: {}, employeeObj: {},
fireDate: [], fireDate: [],
startDate: "", startDate: "",
endDate: "" endDate: "",
showSelector: true,
searchParam: ""
}; };
}, },
methods: { methods: {
searchFn() {
this.getEmloyeeList();
},
callSelector() {
this.showSelector = true;
},
showExportSet() {
this.$emit("showExportSetFn");
},
handleSuccess() { handleSuccess() {
this.dialogVisible = false; this.dialogVisible = false;
this.getEmloyeeList(); this.getEmloyeeList();
...@@ -172,7 +189,8 @@ export default { ...@@ -172,7 +189,8 @@ export default {
sortColumn: ths.sortColumn, sortColumn: ths.sortColumn,
clerkType: ths.clerkType == 0 ? "" : ths.clerkType, clerkType: ths.clerkType == 0 ? "" : ths.clerkType,
startDate: ths.startDate, startDate: ths.startDate,
endDate: ths.endDate endDate: ths.endDate,
searchParam: ths.searchParam
}; };
getRequest(url, params) getRequest(url, params)
.then(res => { .then(res => {
......
src/components/employeeRecord/exportSet.vue 0 → 100644
<template>
<div class="export-set-container">
<div class="title">已选择字段<span>导出的列表中将按顺序显示这些字段（可拖拽排序）</span></div>
<div class="cho-list">
<template v-for="tem in origin">
<div class="cho" v-if="tem.checked" :key="tem.fieldCode">{{tem.fieldName}}</div>
</template>
</div>
<div class="cho-area">
<div class="title">选择需要导出的字段</div>
<div class="cho-area-group">
<div class="group-div">
<div class="group-title"></div>
<ul class="group-son-list">
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox></ul>
</div>
<div class="group-div" v-for="(group, index) in tempList" :key="group.fieldCode+index">
<div class="group-title">{{group.title}}</div>
<ul class="group-son-list">
<template v-for="items in origin">
<li :key="items.fieldCode" v-if="items.parentCode == group.fieldCode">
<el-checkbox :label="items.fieldName" :key="items.fieldCode" v-model="items.checked">{{items.fieldName}}</el-checkbox>
</li>
</template>
</ul>
</div>
</div>
</div>
<div class="handle-cho-btn">
<el-button type="primary" class="export-btn" @click="exportCho">导出<i class="iconfont icon-icon_yunxiazai"></i></el-button>
<el-button @click="cancelCho">取消</el-button>
</div>
</div>
</template>
<script>
import { getRequest, postRequest, postJsonRequest } from '@/api/api';
import { deepClone, formatDate } from '@/utils/index';
export default {
name: "export-set",
data() {
return {
tempList: [],
checkList: [],
origin: [],
checkAll: false,
isIndeterminate: false
};
},
methods: {
handleCheckAllChange(val) {
console.log(val);
this.origin.forEach(tem => {
tem.checked = val;
});
},
getTemplate() {
let ths = this;
getRequest("/haoban-manage-web/record/employee-find-template", {})
.then(res => {
if (res.data.errorCode == 1) {
ths.formatTemplateList(res.data.result);
} else {
ths.$message.error({
message: res.data.message
});
}
})
.catch(e => {
ths.$message.error({
message: e.message
});
});
},
formatTemplateList(list) {
let ths = this;
let fieldList = [];
let origin = [];
let copyData = list;
list.forEach(tem => {
tem.title = tem.fieldName;
tem.checked = false;
let arr = [];
copyData.forEach(li => {
if (li.parentCode == tem.fieldCode) {
arr.push(li);
}
});
arr.sort(function(a,b){
return a.sort*1-b.sort*1;
});
if (arr.length > 0) tem["childrens"] = arr;
if (tem.parentCode == 0) {
fieldList.push(tem);
}
// origin.push(tem);
});
fieldList.sort(function(a,b){
return a.sort*1-b.sort*1;
});
fieldList.forEach(group => {
origin = origin.concat(group.childrens);
});
// origin.sort(function(a,b){
// return a.sort*1-b.sort*1;
// });
this.origin = origin;
this.tempList = fieldList;
console.log(fieldList, "模板");
},
cancelCho() {
this.origin.forEach(tem => {
tem.checked = false;
});
this.$emit("cancelCho");
},
exportCho() {
let arr = [];
let ths = this;
this.origin.forEach(tem => {
if (tem.checked) {
arr.push({
fieldCode: tem.fieldCode,
fieldName: tem.fieldName
})
}
});
let params = {};
params["exportTitleContent"] = JSON.stringify(arr);
console.log(params);
getRequest("/haoban-manage-web/record/define-export", params)
.then(res => {
console.log(res, "res");
})
.catch(e => {
ths.$message({
message: e.message
});
});
}
},
beforeMount() {
this.getTemplate();
}
}
</script>
<style lang="scss">
.export-set-container {
background: #fff;
padding: 25px;
.title {
font-size:16px;
font-family:PingFangSC-Medium;
font-weight:500;
color:rgba(48,49,51,1);
span {
font-size:14px;
font-family:PingFangSC-Regular;
font-weight:400;
color:rgba(144,147,153,1);
margin-left: 20px;
}
}
.cho-list {
padding: 34px 0;
border-bottom: 1px solid #E4E7ED;
display: flex;
flex-wrap: wrap;
margin-bottom: 44px;
.cho {
padding: 0 15px;
box-sizing: border-box;
height:32px;
background:rgba(236,245,255,1);
border:1px solid rgba(217,236,255,1);
border-radius:4px;
color: #409EFF;
box-sizing: border-box;
text-align: center;
line-height: 32px;
font-size: 12px;
margin-right: 10px;
margin-bottom: 20px;
cursor: pointer;
&.osen {
background:rgba(64,158,255,1);
color: #fff;
}
}
}
.cho-area {
margin-top: 60px;
font-size:14px;
font-family:PingFangSC-Medium;
font-weight:500;
color:rgba(96,98,102,1);
.group-div {
display: flex;
margin-bottom: 50px;
&:first-child {
margin-top: 60px;
}
.group-title {
width: 100px;
font-weight:400;
color:rgba(96,98,102,1);
}
.group-son-list {
flex: 1;
display: flex;
flex-wrap: wrap;
li {
width: 180px;
margin-bottom: 25px;
}
}
}
}
.handle-cho-btn {
text-align: center;
.export-btn{
margin-right: 10px;
.iconfont {
color: #fff;
margin-left: 5px;
}
}
}
}
</style>
src/components/employeeRecord/handleDialog.vue
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
:rules="rules" :rules="rules"
ref="ruleForm" ref="ruleForm"
> >
<template v-if="typeTitle == '办理离职'"> <template v-if="typeTitle == '办理离职' || typeTitle == '修改离职信息'">
<el-form-item label="最后工作日:" prop="date"> <el-form-item label="最后工作日:" prop="date">
<el-date-picker <el-date-picker
style="width: 280px;" style="width: 280px;"
...@@ -63,7 +63,7 @@ ...@@ -63,7 +63,7 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
<div class="button-box"> <div class="button-box">
<el-button type="primary" @click="submitHandle">{{typeTitle == '办理转正' ? '确认转正' : '确认办理'}}</el-button> <el-button type="primary" @click="submitHandle">{{typeTitle == '办理转正' ? '确认转正' : typeTitle == '修改离职信息' ? '确认修改' : '确认办理'}}</el-button>
</div> </div>
</div> </div>
</template> </template>
...@@ -147,6 +147,15 @@ export default { ...@@ -147,6 +147,15 @@ export default {
fireDate: ths.ruleForm.date fireDate: ths.ruleForm.date
}, },
url: "/haoban-manage-web/record/fire-work" url: "/haoban-manage-web/record/fire-work"
},
changeFireInfo: {
params: {
fireReason: ths.ruleForm.reason,
remark: ths.ruleForm.remarks,
recordId: ths.employee.recordId,
fireDate: ths.ruleForm.date
},
url: "/haoban-manage-web/record/fire-work"
} }
}; };
ths.subRequest(typeObj[ths.handleType].params, typeObj[ths.handleType].url); ths.subRequest(typeObj[ths.handleType].params, typeObj[ths.handleType].url);
......
src/views/contacts/employeeRecord.vue
<template> <template>
<div class="e-record-container"> <div class="e-record-container">
<div class="top-area"> <template v-if="!showExportSet">
<div class="top-title"> <div class="top-area">
<span class="title-span">在职员工</span> <div class="top-title">
<a href="#/recordIo?importCode=record"> <span class="title-span">在职员工</span>
<el-button type="primary">导入员工档案<i class="el-icon-upload el-icon--right"></i></el-button> <a href="#/recordIo?importCode=record">
</a> <el-button type="primary">导入员工档案<i class="el-icon-upload el-icon--right"></i></el-button>
</div> </a>
<div class="e-type-num-title"> </div>
<div class="type-cell" v-for="(count, key) in countObj" :key="key" :class="key == 'onWorkCout' || key == 'noTypeWorkCount' ? 'with-bdr' : ''"> <div class="e-type-num-title">
<p class="type-name">{{typeObj[key]}}</p> <div class="type-cell" v-for="(count, key) in countObj" :key="key" :class="key == 'onWorkCout' || key == 'noTypeWorkCount' ? 'with-bdr' : ''">
<p class="num">{{count}}</p> <p class="type-name">{{typeObj[key]}}</p>
<p class="num">{{count}}</p>
</div>
</div> </div>
</div> </div>
</div> <employee-list @showExportSetFn="showExportSetFn"></employee-list>
<employee-list></employee-list> </template>
<template v-else>
<export-set @cancelCho="cancelCho"></export-set>
</template>
</div> </div>
</template> </template>
<script> <script>
import { getRequest, postRequest, postJsonRequest } from '@/api/api'; import { getRequest, postRequest, postJsonRequest } from '@/api/api';
import exportSet from "components/employeeRecord/exportSet";
import employeeList from "components/employeeRecord/employeeList"; import employeeList from "components/employeeRecord/employeeList";
export default { export default {
name: "employeeRecord", name: "employeeRecord",
components: { components: {
employeeList employeeList,
exportSet
}, },
data() { data() {
return { return {
...@@ -38,10 +45,17 @@ export default { ...@@ -38,10 +45,17 @@ export default {
onTrialCount: "试用", onTrialCount: "试用",
noStatusCount: "无状态" noStatusCount: "无状态"
}, },
countObj: {} countObj: {},
showExportSet: false
}; };
}, },
methods: { methods: {
cancelCho() {
this.showExportSet = false;
},
showExportSetFn() {
this.showExportSet = true;
},
getEmployeeCount() { getEmployeeCount() {
let ths = this; let ths = this;
getRequest("/haoban-manage-web/record/employee-count-detail", {}) getRequest("/haoban-manage-web/record/employee-count-detail", {})
......
src/views/contacts/recordInfo.vue
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="commom-container clerk-detail-container"> <div class="commom-container clerk-detail-container">
<p class="t-rt"><a class="a-href" @click="getPdf()">打印员工档案</a></p> <p class="t-rt"><a class="a-href" @click="getPdf()">打印员工档案</a></p>
<div id="pdfDom"> <div id="pdfDom">
<div class="employee-detail"> <div class="employee-detail-cell">
<div class="head-info"> <div class="head-info">
<p class="head-cell"><img :src="info.headPic" class="head-img"></p> <p class="head-cell"><img :src="info.headPic" class="head-img"></p>
<p class="head-cell name">{{info.clerkName}}<span>{{statusList[info.clerkStatus - 1]}}</span></p> <p class="head-cell name">{{info.clerkName}}<span>{{statusList[info.clerkStatus - 1]}}</span></p>
...@@ -24,29 +24,38 @@ ...@@ -24,29 +24,38 @@
<span class="radio"></span> <span class="radio"></span>
<div class="hurdle"></div></div> <div class="hurdle"></div></div>
<p class="position">{{his.positionName}}</p> <p class="position">{{his.positionName}}</p>
<p>{{historyStatus[his.historyStatus * 1 - 1]}}</p> <p>{{historyStatus[his.historyStatus * 1 - 1]}}<a class="a-href m-l-10 fs-12" @click="editHis" v-if="his.historyStatus == 3">编辑</a></p>
<p>{{!!his.storeName ? his.storeName : his.groupName}}</p> <p>{{!!his.storeName ? his.storeName : his.groupName}}</p>
</div> </div>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
<el-dialog
title="修改离职信息"
:visible.sync="dialogVisible"
width="480px">
<handle-dialog :employee="staticInfo" handleType="changeFireInfo" typeTitle="修改离职信息" @handleSuccess="handleSuccess"></handle-dialog>
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { getRequest, postRequest, postJsonRequest } from '@/api/api'; import { getRequest, postRequest, postJsonRequest } from '@/api/api';
import { deepClone, formatDate } from '@/utils/index'; import { deepClone, formatDate } from '@/utils/index';
import editableCell from "components/employeeRecord/editableCell"; import editableCell from "components/employeeRecord/editableCell";
import handleDialog from "components/employeeRecord/handleDialog";
export default { export default {
name: "recordInfo", name: "recordInfo",
components: { components: {
editableCell editableCell,
handleDialog
}, },
filters: { filters: {
formatDate formatDate
}, },
data() { data() {
return { return {
dialogVisible: false,
htmlTitle: "员工档案", htmlTitle: "员工档案",
info: {}, info: {},
staticInfo: {}, staticInfo: {},
...@@ -58,6 +67,7 @@ export default { ...@@ -58,6 +67,7 @@ export default {
} }
}, },
methods: { methods: {
handleSuccess() {},
getEmployeeDetail() { // 获取员工详情 getEmployeeDetail() { // 获取员工详情
let ths = this; let ths = this;
let params = { let params = {
...@@ -133,7 +143,7 @@ export default { ...@@ -133,7 +143,7 @@ export default {
clerkInfo[tem.fieldCode] = arr; clerkInfo[tem.fieldCode] = arr;
cInfo[tem.fieldCode] = arr.slice(0); cInfo[tem.fieldCode] = arr.slice(0);
} }
// console.log(tem.fieldType, tem.fieldName, tem.fieldOperations, tem); console.log(tem.fieldType, tem.fieldName, tem.fieldOperations, tem);
tem.title = tem.fieldName; tem.title = tem.fieldName;
let arr = []; let arr = [];
copyData.forEach(li => { copyData.forEach(li => {
...@@ -182,13 +192,18 @@ export default { ...@@ -182,13 +192,18 @@ export default {
}, },
formatMileStone(list) { formatMileStone(list) {
let ths = this; let ths = this;
console.log(list, "dddddd"); list.sort(function(a,b){
return a.historyDate*1-b.historyDate*1;
});
let arr = []; let arr = [];
for (let i = 0, len = list.length; i < len; i += 4){ for (let i = 0, len = list.length; i < len; i += 4){
arr.push(list.slice(i, i + 4)); arr.push(list.slice(i, i + 4));
} }
console.log(arr, "dddddd"); console.log(arr, "dddddd");
ths.mileStone = arr; ths.mileStone = arr;
},
editHis() {
this.dialogVisible = true;
} }
}, },
beforeMount() { beforeMount() {
...@@ -200,7 +215,7 @@ export default { ...@@ -200,7 +215,7 @@ export default {
<style lang="scss"> <style lang="scss">
.clerk-detail-container { .clerk-detail-container {
padding: 30px; padding: 30px;
.employee-detail { .employee-detail-cell {
.head-info { .head-info {
margin: 20px 0 70px; margin: 20px 0 70px;
text-align: center; text-align: center;
......
src/views/contacts/recordIo.vue
<template> <template>
<div class="io-container"> <div class="io-container">
<ul class="tip-area"> <template v-if="!dialogVisible">
<li class="tip">姓名必须和好办企业通讯录中的员工姓名保持一致，手机号必须为员工注册好办的手机号</li> <ul class="tip-area">
<li class="tip">员工档案导入时，直接以手机号去做匹配，通讯录中不存在的将无法导入（模板中配置的部门、职位、code，这些字段信息请保持与企业通讯录中一致，这几个字段的信息将不会修改通讯录的信息，直接取该成员对应的通讯录的字段信息）</li> <li class="tip">姓名必须和好办企业通讯录中的员工姓名保持一致，手机号必须为员工注册好办的手机号</li>
<li class="tip">如果想要新增字段，可在后台档案设置中增加，再导入模板</li> <li class="tip">员工档案导入时，直接以手机号去做匹配，通讯录中不存在的将无法导入（模板中配置的部门、职位、code，这些字段信息请保持与企业通讯录中一致，这几个字段的信息将不会修改通讯录的信息，直接取该成员对应的通讯录的字段信息）</li>
<li class="tip">字段类型为图片上传、多选的字段无法导入、导出</li> <li class="tip">如果想要新增字段，可在后台档案设置中增加，再导入模板</li>
<li class="tip">确保导入的表头字段和后台配置表头字段的名称一致（模板下载时间不可修改）</li> <li class="tip">字段类型为图片上传、多选的字段无法导入、导出</li>
<li class="tip">由于数据量可能较大，每次最多导入2000条员工档案，若超过只取前2000条，可以分多次导入</li> <li class="tip">确保导入的表头字段和后台配置表头字段的名称一致（模板下载时间不可修改）</li>
</ul> <li class="tip">由于数据量可能较大，每次最多导入2000条员工档案，若超过只取前2000条，可以分多次导入</li>
<el-radio-group v-model="type" class="m-t-20" @change="resetList"> </ul>
<el-radio-button label="import">导入员工档案</el-radio-button> <el-radio-group v-model="type" class="m-t-20" @change="resetList">
<el-radio-button label="export">导出/修改员工档案</el-radio-button> <el-radio-button label="import">导入员工档案</el-radio-button>
<el-radio-button label="note">错误记录</el-radio-button> <el-radio-button label="export">导出/修改员工档案</el-radio-button>
</el-radio-group> <el-radio-button label="note">错误记录</el-radio-button>
<div class="handle-area import" v-if="type == 'import'"> </el-radio-group>
<div class="step-div" style="margin-bottom :90px;"> <div class="handle-area import" v-if="type == 'import'">
<span class="ft-large">①</span>下载模板 <div class="step-div" style="margin-bottom :90px;">
<a href="http://www.gicdev.com/haoban-manage-web/record/export-record-template.json" class="d-u-btn"> <span class="ft-large">①</span>下载模板
<el-button type="primary">下载<i class="iconfont icon-icon_yunxiazai m-l-5"></i></el-button> <a href="http://www.gicdev.com/haoban-manage-web/record/export-record-template.json" class="d-u-btn">
</a> <el-button type="primary">下载<i class="iconfont icon-icon_yunxiazai m-l-5"></i></el-button>
</div> </a>
<div class="step-div"> </div>
<span class="ft-large">②</span>上传员工档案 <div class="step-div">
<div class="d-u-btn m-t-20"> <span class="ft-large">②</span>上传员工档案
<el-upload <div class="d-u-btn m-t-20">
class="upload-demo" <el-upload
ref="upload" class="upload-demo"
:action="url" ref="upload"
:on-success="uploadSuccess" :action="url"
:on-change="getChange" :on-success="uploadSuccess"
:multiple="false" :on-change="getChange"
:file-list="fileList" :multiple="false"
:auto-upload="false"> :file-list="fileList"
<el-button slot="trigger" size="small" type="primary">选取文件</el-button> :auto-upload="false">
<div slot="tip" class="el-upload__tip">文件格式必须为xls或xlsx格式</div> <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
</el-upload> <div slot="tip" class="el-upload__tip">文件格式必须为xls或xlsx格式</div>
</div> </el-upload>
</div> </div>
<div class="up-btn-div"> </div>
<el-button type="primary" @click="submitUpload('upload')" :disabled="fileList.length == 0">上传</el-button> <div class="up-btn-div">
<el-button type="primary" @click="submitUpload('upload')" :disabled="fileList.length == 0">上传</el-button>
</div>
</div> </div>
</div> <div class="handle-area import" v-else-if="type == 'export'">
<div class="handle-area import" v-else-if="type == 'export'"> <div class="step-div" style="margin-bottom :90px;">
<div class="step-div" style="margin-bottom :90px;"> <span class="ft-large">①</span>导出员工档案
<span class="ft-large">①</span>导出员工档案 <a class="d-u-btn">
<a class="d-u-btn" href="http://www.gicdev.com/haoban-manage-web/record/export-record-template.json"> <el-button type="primary" @click="callExport">下载<i class="iconfont icon-icon_yunxiazai m-l-5"></i></el-button>
<el-button type="primary">下载<i class="iconfont icon-icon_yunxiazai m-l-5"></i></el-button> </a>
</a>
</div>
<div class="step-div">
<span class="ft-large">②</span>上传更新后的员工档案
<div class="d-u-btn m-t-20">
<el-upload
class="upload-demo"
ref="uploadEdit"
:action="url"
:on-success="uploadSuccess"
:on-change="getChange"
:multiple="false"
:file-list="fileList"
:auto-upload="false">
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
<div slot="tip" class="el-upload__tip">文件格式必须为xls或xlsx格式</div>
</el-upload>
</div>
</div>
<div class="up-btn-div">
<el-button type="primary" @click="submitUpload('uploadEdit')" :disabled="fileList.length == 0">上传</el-button>
</div>
</div> </div>
<div class="step-div"> <div class="error-log import" v-else>
<span class="ft-large">②</span>上传更新后的员工档案 <div class="title-area">
<div class="d-u-btn m-t-20"> <div class="tip">
<el-upload <!-- 导入总条数：0条，成功导入0条，<span class="red">错误导入0条</span> -->
class="upload-demo"
ref="uploadEdit"
:action="url"
:on-success="uploadSuccess"
:on-change="getChange"
:multiple="false"
:file-list="fileList"
:auto-upload="false">
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
<div slot="tip" class="el-upload__tip">文件格式必须为xls或xlsx格式</div>
</el-upload>
</div> </div>
</div> <a :href="'http://www.gicdev.com/haoban-manage-web/record//error-log-export?importCode='+$route.query.importCode">
<div class="up-btn-div"> <el-button type="primary">导出错误记录</el-button>
<el-button type="primary" @click="submitUpload('uploadEdit')" :disabled="fileList.length == 0">上传</el-button> </a>
</div>
</div>
<div class="error-log import" v-else>
<div class="title-area">
<div class="tip">
<!-- 导入总条数：0条，成功导入0条，<span class="red">错误导入0条</span> -->
</div> </div>
<a :href="'http://www.gicdev.com/haoban-manage-web/record//error-log-export?importCode='+$route.query.importCode"> <el-table
<el-button type="primary">导出错误记录</el-button> v-loading ="loading"
</a> :data="logList"
</div> class="m-t-20"
<el-table height="400"
v-loading ="loading" style="width: 100%">
:data="logList" <el-table-column
class="m-t-20" type="index"
height="400" width="50"
style="width: 100%"> label="序号">
<el-table-column </el-table-column>
type="index" <el-table-column
width="50" width="200"
label="序号"> prop="fieldValue"
</el-table-column> label="字段值">
<el-table-column </el-table-column>
width="200"
prop="fieldValue"
label="字段值">
</el-table-column>
<el-table-column
width="200"
prop="fieldName"
label="字段名">
</el-table-column>
<el-table-column
width="200"
prop="failReason"
label="错误原因">
</el-table-column>
<template v-for="temp in tempList">
<el-table-column <el-table-column
:key="temp.fieldCode"
width="200" width="200"
:label="temp.fieldName" prop="fieldName"
:prop="temp.fieldCode" label="字段名">
></el-table-column> </el-table-column>
</template> <el-table-column
</el-table> width="200"
<el-pagination prop="failReason"
class="pagination" label="错误原因">
background </el-table-column>
@size-change="handleSizeChange" <template v-for="temp in tempList">
@current-change="handleCurrentChange" <el-table-column
:page-sizes="[20, 40, 60, 80]" :key="temp.fieldCode"
:page-size="pageSize" width="200"
:current-page="currentPage" :label="temp.fieldName"
layout="total, sizes, prev, pager, next" :prop="temp.fieldCode"
:total="total"> ></el-table-column>
</el-pagination> </template>
</div> </el-table>
<el-pagination
class="pagination"
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-sizes="[20, 40, 60, 80]"
:page-size="pageSize"
:current-page="currentPage"
layout="total, sizes, prev, pager, next"
:total="total">
</el-pagination>
</div>
</template>
<template v-else>
<export-set @cancelCho="cancelCho"></export-set>
</template>
</div> </div>
</template> </template>
<script> <script>
import uploadExcelComponent from "components/uploadExcel/index"; import uploadExcelComponent from "components/uploadExcel/index";
import { getRequest, postRequest, postJsonRequest } from '@/api/api'; import { getRequest, postRequest, postJsonRequest } from '@/api/api';
import exportSet from "components/employeeRecord/exportSet";
export default { export default {
name: "employee-io", name: "employee-io",
components: { components: {
uploadExcelComponent uploadExcelComponent,
exportSet
}, },
data() { data() {
let local = window.location.origin; let local = window.location.origin;
...@@ -150,7 +157,8 @@ export default { ...@@ -150,7 +157,8 @@ export default {
pageSize: 20, pageSize: 20,
currentPage: 1, currentPage: 1,
total: 0, total: 0,
tempList: [] tempList: [],
dialogVisible: false
}; };
}, },
methods: { methods: {
...@@ -226,6 +234,12 @@ export default { ...@@ -226,6 +234,12 @@ export default {
getChange(file, fileList) { getChange(file, fileList) {
console.log(file, fileList); console.log(file, fileList);
this.fileList = fileList; this.fileList = fileList;
},
callExport() {
this.dialogVisible = true;
},
cancelCho() {
this.dialogVisible = false;
} }
}, },
beforeMount() { beforeMount() {
......
src/views/contacts/unemployee.vue
...@@ -2,17 +2,18 @@ ...@@ -2,17 +2,18 @@
<div class="e-record-container"> <div class="e-record-container">
<div class="top-area"> <div class="top-area">
<div class="top-title"> <div class="top-title">
<span class="title-span">在职员工</span> <span class="title-span">
<a href="#/recordIo?importCode=record"> 离职员工</span>
<!-- <a href="#/recordIo?importCode=record">
<el-button type="primary">导入员工档案<i class="el-icon-upload el-icon--right"></i></el-button> <el-button type="primary">导入员工档案<i class="el-icon-upload el-icon--right"></i></el-button>
</a> </a> -->
</div> </div>
<div class="e-type-num-title"> <!-- <div class="e-type-num-title">
<div class="type-cell" v-for="(count, key) in countObj" :key="key" :class="key == 'onWorkCout' || key == 'noTypeWorkCount' ? 'with-bdr' : ''"> <div class="type-cell" v-for="(count, key) in countObj" :key="key" :class="key == 'onWorkCout' || key == 'noTypeWorkCount' ? 'with-bdr' : ''">
<p class="type-name">{{typeObj[key]}}</p> <p class="type-name">{{typeObj[key]}}</p>
<p class="num">{{count}}</p> <p class="num">{{count}}</p>
</div> </div>
</div> </div> -->
</div> </div>
<employee-list :isUnEmployee="true"></employee-list> <employee-list :isUnEmployee="true"></employee-list>
</div> </div>
...@@ -42,28 +43,28 @@ export default { ...@@ -42,28 +43,28 @@ export default {
}; };
}, },
methods: { methods: {
getEmployeeCount() { // getEmployeeCount() {
let ths = this; // let ths = this;
getRequest("/haoban-manage-web/record/employee-count-detail", {}) // getRequest("/haoban-manage-web/record/employee-count-detail", {})
.then(res => { // .then(res => {
console.log(res, "res count"); // console.log(res, "res count");
if (res.data.errorCode == 1) { // if (res.data.errorCode == 1) {
ths.countObj = res.data.result; // ths.countObj = res.data.result;
} else { // } else {
ths.$message.error({ // ths.$message.error({
message: res.data.message // message: res.data.message
}); // });
} // }
}) // })
.catch(e => { // .catch(e => {
ths.$message.error({ // ths.$message.error({
message: e.message // message: e.message
}); // });
}); // });
} // }
}, },
beforeMount() { beforeMount() {
this.getEmployeeCount(); // this.getEmployeeCount();
} }
}; };
</script> </script>
......
static/css/public.css
...@@ -341,6 +341,9 @@ input:focus { ...@@ -341,6 +341,9 @@ input:focus {
.c-303133 { .c-303133 {
color: #303133; color: #303133;
} }
.m-l-10 {
margin-left: 10px;
}
.m-l-16 { .m-l-16 {
margin-left: 16px; margin-left: 16px;
} }
......
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