|
@@ -2,60 +2,90 @@
|
|
|
<div>
|
|
|
<!-- 头部提示 -->
|
|
|
<div class="top-msg margin-bottom">
|
|
|
- <div>当前组织架构和角色同过钉钉同步,上次同步时间2020-06-14</div>
|
|
|
- <div>如果您的钉钉通讯录有变动,请及时同步<span class="blue" style="margin-left: 10px;cursor: pointer;"><i class="el-icon-refresh"></i>立即同步</span></div>
|
|
|
+ <div>当前组织架构和角色同过钉钉同步,上次同步时间
|
|
|
+ <span v-if="info.sync_time">{{info.sync_time}}</span>
|
|
|
+ <span v-else>暂未同步</span>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ 如果您的钉钉通讯录有变动,请及时同步
|
|
|
+ <span class="blue" style="margin-left: 10px;cursor: pointer;" @click="tb()" v-loading="tbLoading">
|
|
|
+ <i class="el-icon-refresh"></i>
|
|
|
+ 立即同步
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="all">
|
|
|
<div class="flex-box">
|
|
|
-<!-- <div class="terr-left">
|
|
|
- <el-button size="medium" type="primary">+ 添加规则分类</el-button>
|
|
|
+ <div class="terr-left">
|
|
|
<div class="rule_class_box">
|
|
|
- <div @click="handleNodeClick({ value: 0 })" class="company_name">
|
|
|
+ <div @click="handleNodeClick({ id: 0 })" class="company_name">
|
|
|
<img src="../assets/image/two.png" />
|
|
|
- <span>你好啊</span>
|
|
|
+ <span>{{ info.name }}</span>
|
|
|
</div>
|
|
|
- <el-tree :data="data" class="cate-tree" :props="defaultProps" @node-click="handleNodeClick">
|
|
|
+ <el-tree
|
|
|
+ :data="bmList"
|
|
|
+ class="cate-tree"
|
|
|
+ :expand-on-click-node="false"
|
|
|
+ :highlight-current="true"
|
|
|
+ :props="{ children: '_child', label: 'name' }"
|
|
|
+ @node-click="handleNodeClick"
|
|
|
+ >
|
|
|
<div
|
|
|
content="tree"
|
|
|
v-show="treedata.length != 0"
|
|
|
class="flex-box flex-v-ce"
|
|
|
slot-scope="{ node, data }"
|
|
|
- style="font-size: 14px;color: #606266; width:100%; text-align: left;">
|
|
|
- <img src="../assets/images/one.png" style="width: 20px;"/>
|
|
|
- <span class="name">{{ data.label }}</span>
|
|
|
- <span style="position: absolute;right: 0px;display:inline-block;vertical-align: top;margin-top:2px;">({{ data.count }}人)</span>
|
|
|
+ style="font-size: 14px;color: #606266; width:100%; text-align: left;"
|
|
|
+ >
|
|
|
+ <img src="../assets/image/one.png" style="width: 20px;margin-right: 5px;" />
|
|
|
+ <span class="name">{{ data.name}}</span>
|
|
|
</div>
|
|
|
</el-tree>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="terr-right border-right flex-1">
|
|
|
<div class="margin-bottom">
|
|
|
- <el-input placeholder="输入同事姓名" v-model="input3">
|
|
|
- <el-button slot="append" icon="el-icon-search"></el-button>
|
|
|
- </el-input>
|
|
|
+ <el-button @click="participation()" size="medium" type="primary" style="margin-right: 10px;" v-show="selectIds.length>0">参与积分管理</el-button>
|
|
|
+ <el-input placeholder="输入同事姓名" size="medium" style="width: 230px;" v-model="keywords"><el-button slot="append" icon="el-icon-search" @click="getEmployee()"></el-button></el-input>
|
|
|
</div>
|
|
|
- <el-table :data="tableData" @selection-change="handleSelectionChange">
|
|
|
- <el-table-column type="selection" width="50" ></el-table-column>
|
|
|
- <el-table-column prop="name" label="姓名"><template slot-scope="scope"></template></el-table-column>
|
|
|
- <el-table-column prop="tel" label="部门"></el-table-column>
|
|
|
- <el-table-column prop="company_id" label="入职时间"></el-table-column>
|
|
|
- <el-table-column prop="status" label="是否参与积分管理"><template slot-scope="scope"></template></el-table-column>
|
|
|
+ <el-table :data="userList" @selection-change="handleSelectionChange" v-loading="tableToading">
|
|
|
+ <el-table-column type="selection" width="50"></el-table-column>
|
|
|
+ <el-table-column label="姓名">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div class="flex-box flex-v-ce">
|
|
|
+ <userImage :user_name="scope.row.name" :img_url="scope.row.img_url" width="44px" height="44px"></userImage>
|
|
|
+ <div style="margin-left: 10px;">{{ scope.row.name }}</div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="部门">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div class="flex-box flex-v-ce bms">
|
|
|
+ <div v-for="(item, index) in scope.row.employee_detail.dept_list" :key="index">{{ item.dept_name }}</div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="accedence_time" label="入职时间"></el-table-column>
|
|
|
+ <el-table-column label="是否参与积分管理">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <!-- {{scope.row.is_official}} -->
|
|
|
+ <el-switch @change="changeIs($event,scope.row.id)" v-model="scope.row.is_official" :active-value="is" :inactive-value="no"></el-switch>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
</el-table>
|
|
|
<div class="pagination">
|
|
|
<el-pagination
|
|
|
- background
|
|
|
- layout="total,sizes, prev, pager, next"
|
|
|
@size-change="handleSizeChange"
|
|
|
- :page-size="pageLimit"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page="page + 1"
|
|
|
+ :page-sizes="[10, 20, 30, 40, 50, 100]"
|
|
|
+ :page-size="perPage"
|
|
|
+ layout="total,sizes, prev, pager, next"
|
|
|
:total="total"
|
|
|
- :current-page.sync="currentPage"
|
|
|
- @current-change="changePage"
|
|
|
></el-pagination>
|
|
|
</div>
|
|
|
- </div> -->
|
|
|
-
|
|
|
+ </div>
|
|
|
</div>
|
|
|
-
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
@@ -64,78 +94,35 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ is: 1,
|
|
|
+ no: 0,
|
|
|
+ page: 0,
|
|
|
+ perPage: 10,
|
|
|
+ total: 0,
|
|
|
+ info: {}, //公司信息
|
|
|
tips_show: true,
|
|
|
- rule_tree: [],
|
|
|
- item_list: [],
|
|
|
- data: [
|
|
|
- {
|
|
|
- label: '一级 1',
|
|
|
- children: [
|
|
|
- {
|
|
|
- label: '二级 1-1',
|
|
|
- children: [
|
|
|
- {
|
|
|
- label: '三级 1-1-1'
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- label: '一级 2',
|
|
|
- children: [
|
|
|
- {
|
|
|
- label: '二级 2-1',
|
|
|
- children: [
|
|
|
- {
|
|
|
- label: '三级 2-1-1'
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- label: '二级 2-2',
|
|
|
- children: [
|
|
|
- {
|
|
|
- label: '三级 2-2-1'
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- label: '一级 3',
|
|
|
- children: [
|
|
|
- {
|
|
|
- label: '二级 3-1',
|
|
|
- children: [
|
|
|
- {
|
|
|
- label: '三级 3-1-1'
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- label: '二级 3-2',
|
|
|
- children: [
|
|
|
- {
|
|
|
- label: '三级 3-2-1'
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- ],
|
|
|
- defaultProps: {
|
|
|
- children: 'children',
|
|
|
- label: 'label'
|
|
|
- },
|
|
|
+ bmList: [],
|
|
|
+ userList: [],
|
|
|
class_type: '',
|
|
|
treedata: [1],
|
|
|
tableData: [],
|
|
|
- input3:'',
|
|
|
+ keywords: '',
|
|
|
+ dept_id:0,
|
|
|
+
|
|
|
+ tableToading: false,
|
|
|
+ tbLoading:false,
|
|
|
+ selectIds:[],
|
|
|
};
|
|
|
},
|
|
|
+ watch:{
|
|
|
+ dept_id(val){
|
|
|
+ this.getEmployee();
|
|
|
+ }
|
|
|
+ },
|
|
|
created() {
|
|
|
- // this.getData();
|
|
|
+ this.getInfo();
|
|
|
+ this.getDepartment();
|
|
|
+ this.getEmployee();
|
|
|
},
|
|
|
mounted() {
|
|
|
this.$nextTick(function() {
|
|
@@ -147,98 +134,167 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
methods: {
|
|
|
- editDetails() {},
|
|
|
- handleSelectionChange() {},
|
|
|
- handleNodeClick() {},
|
|
|
- getData() {
|
|
|
- var that = this;
|
|
|
- // this.$axios.get('api/integral/rule/trees', { cycle_type: 1 }).then(res => {
|
|
|
- // this.dept_list = res.data.data.rule_tree;
|
|
|
- // this.rule_category_list = [];
|
|
|
- // this.item_list = res.data.data.item_list;
|
|
|
- // this.parse_tree(this.dept_list, this.pid);
|
|
|
- // if (this.pid > 0) {
|
|
|
- // this.list = this.cur_item_list;
|
|
|
- // } else {
|
|
|
- // this.list = [];
|
|
|
- // for (let i in this.item_list) {
|
|
|
- // for (let k in this.item_list[i]) {
|
|
|
- // this.list.push(this.item_list[i][k]);
|
|
|
- // }
|
|
|
- // }
|
|
|
- // }
|
|
|
-
|
|
|
- // that.rule_tree = res.data.data.rule_tree;
|
|
|
- // that.item_list = res.data.data.item_list;
|
|
|
- // });
|
|
|
+ //同步信息
|
|
|
+ tb(){
|
|
|
+ this.tbLoading=true;
|
|
|
+ var http1=this.$axios.post('api/ding/department_sync');
|
|
|
+ var http2=this.$axios.post('api/ding/employee_sync');
|
|
|
+ Promise.all([http1,http2]).then(res=>{
|
|
|
+ this.tbLoading=false;
|
|
|
+ if(res[0]){
|
|
|
+ this.tbLoading=false;
|
|
|
+ this.$message.success({message:res[0].data.msg})
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //是否开通
|
|
|
+ changeIs(e,id){
|
|
|
+ var url=e==1? 'api/employee/enable':'api/employee/disable';
|
|
|
+ this.$axios.post(url,{ employee_id:[id]}).then(res => {
|
|
|
+ if(res){
|
|
|
+ this.$message.success({message:res.data.msg})
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //批量开通权限
|
|
|
+ participation(){
|
|
|
+ this.$axios.post('api/employee/enable',{ employee_id: this.selectIds}).then(res => {
|
|
|
+ if(res){
|
|
|
+ this.getEmployee();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //获取公司信息
|
|
|
+ getInfo() {
|
|
|
+ this.$axios.get('api/site/info').then(res => {
|
|
|
+ this.info = res.data.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //选择员工
|
|
|
+ handleSelectionChange(e) {
|
|
|
+ var arr=[];
|
|
|
+ for(var item in e){
|
|
|
+ arr.push(e[item].id);
|
|
|
+ }
|
|
|
+ this.selectIds=arr;
|
|
|
+ },
|
|
|
+ //点击部门
|
|
|
+ handleNodeClick(e) {
|
|
|
+ this.page = 0;
|
|
|
+ this.dept_id=e.id;
|
|
|
+ },
|
|
|
+ //获取部门
|
|
|
+ getDepartment() {
|
|
|
+ this.$axios.get('api/department/tree').then(res => {
|
|
|
+ this.bmList = res.data.data.list;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //获取员工
|
|
|
+ getEmployee() {
|
|
|
+ this.tableToading = true;
|
|
|
+ this.$axios.get('api/employee/index', { params: { dept_id: this.dept_id, keywords: this.keywords, page: this.page, page_size: this.perPage } }).then(res => {
|
|
|
+
|
|
|
+ this.tableToading = false;
|
|
|
+ console.log(res.data.data.pageInfo);
|
|
|
+ this.total = res.data.data.pageInfo.count;
|
|
|
+ this.userList = res.data.data.list;
|
|
|
+ });
|
|
|
},
|
|
|
//关闭提示
|
|
|
tips_close() {
|
|
|
localStorage.setItem('rule', 'true');
|
|
|
this.tips_show = false;
|
|
|
},
|
|
|
+ handleSizeChange: function(val) {
|
|
|
+ this.perPage = val;
|
|
|
+ this.page = 0;
|
|
|
+ this.getEmployee();
|
|
|
+ },
|
|
|
+ //页码变更
|
|
|
+ handleCurrentChange: function(val) {
|
|
|
+ this.page = val - 1;
|
|
|
+ this.getEmployee();
|
|
|
+ }
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
- <style lang="scss" scoped="scoped">
|
|
|
- // .top-msg div:nth-child(1){
|
|
|
- // margin-bottom: 10px;
|
|
|
- // }
|
|
|
- // .company_name {
|
|
|
- // position: relative;
|
|
|
- // display: block;
|
|
|
- // font-family: 'Microsoft YaHei';
|
|
|
- // text-align: left;
|
|
|
- // padding: 15px 25px;
|
|
|
- // cursor: pointer;
|
|
|
- // overflow: hidden;
|
|
|
- // white-space: nowrap;
|
|
|
- // text-overflow: ellipsis;
|
|
|
- // border-bottom: 1px #f8f8f8 solid;
|
|
|
- // }
|
|
|
- // .company_name img {
|
|
|
- // position: relative;
|
|
|
- // display: inline-block;
|
|
|
- // top: 2px;
|
|
|
- // width: 18px;
|
|
|
- // height: 18px;
|
|
|
- // margin-right: 4px;
|
|
|
- // }
|
|
|
- // .terr-right {
|
|
|
- // .custom-tree-node {
|
|
|
- // margin-left: -4px;
|
|
|
- // }
|
|
|
- // .custom-tree-node * {
|
|
|
- // vertical-align: middle;
|
|
|
- // }
|
|
|
- // .custom-tree-node:hover {
|
|
|
- // .treeIcon {
|
|
|
- // display: inline-block;
|
|
|
- // width: 55%;
|
|
|
- // }
|
|
|
- // }
|
|
|
- // }
|
|
|
+<style lang="scss" scoped="scoped">
|
|
|
+.name{
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ width: 80%;
|
|
|
+}
|
|
|
+.bms div {
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+.top-msg div:nth-child(1) {
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+.company_name {
|
|
|
+ position: relative;
|
|
|
+ display: block;
|
|
|
+ font-family: 'Microsoft YaHei';
|
|
|
+ text-align: left;
|
|
|
+ padding: 15px 25px;
|
|
|
+ cursor: pointer;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ border-bottom: 1px #f8f8f8 solid;
|
|
|
+}
|
|
|
+.company_name img {
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ top: 2px;
|
|
|
+ width: 18px;
|
|
|
+ height: 18px;
|
|
|
+ margin-right: 4px;
|
|
|
+}
|
|
|
+.terr-right {
|
|
|
+ .custom-tree-node {
|
|
|
+ margin-left: -4px;
|
|
|
+ }
|
|
|
+ .custom-tree-node * {
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+ .custom-tree-node:hover {
|
|
|
+ .treeIcon {
|
|
|
+ display: inline-block;
|
|
|
+ width: 55%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
- // .rule_class_box {
|
|
|
- // ::v-deep .el-tree-node {
|
|
|
- // border-bottom: 1px #f8f8f8 solid;
|
|
|
- // }
|
|
|
- // ::v-deep .el-tree-node__content {
|
|
|
- // height: 46px;
|
|
|
- // line-height: 46px;
|
|
|
- // }
|
|
|
- // ::v-deep .is-current .el-tree-node__content .el-icon-caret-right {
|
|
|
- // color: #409eff !important;
|
|
|
- // }
|
|
|
- // ::v-deep .is-current .el-tree-node__content .el-tree-node__label {
|
|
|
- // color: #409eff !important;
|
|
|
- // }
|
|
|
- // ::v-deep .is-current .el-tree-node__children .el-icon-caret-right {
|
|
|
- // color: #c0c4cc !important;
|
|
|
- // }
|
|
|
- // ::v-deep .is-current .el-tree-node__children .el-tree-node__label {
|
|
|
- // color: #606266 !important;
|
|
|
- // }
|
|
|
- // }
|
|
|
+.rule_class_box {
|
|
|
+ ::v-deep .el-tree-node {
|
|
|
+ border-bottom: 1px #f8f8f8 solid;
|
|
|
+ }
|
|
|
+ ::v-deep .el-tree-node__content {
|
|
|
+ padding: 10px 0;
|
|
|
+ border-bottom: 1px #f8f8f8 solid;
|
|
|
+ }
|
|
|
+ ::v-deep .el-tree-node__content:hover {
|
|
|
+ background: #ecf5ff;
|
|
|
+ border-radius: 4px;
|
|
|
+ }
|
|
|
+ ::v-deep .is-current .el-tree-node__content .el-icon-caret-right {
|
|
|
+ color: #409eff !important;
|
|
|
+ }
|
|
|
+ ::v-deep .is-current .el-tree-node__content .el-tree-node__label {
|
|
|
+ color: #409eff !important;
|
|
|
+ }
|
|
|
+ ::v-deep .is-current .el-tree-node__children .el-icon-caret-right {
|
|
|
+ color: #c0c4cc !important;
|
|
|
+ }
|
|
|
+ ::v-deep .is-current .el-tree-node__children .el-tree-node__label {
|
|
|
+ color: #606266 !important;
|
|
|
+ }
|
|
|
+ ::v-deep .is-current .name {
|
|
|
+ color: #409eff !important;
|
|
|
+ font-weight: normal;
|
|
|
+ transition: 0.35s ease-in-out;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|