From e6758ef29bd686e894b4679edf1bd88436b84148 Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期三, 13 一月 2021 19:07:03 +0800
Subject: [PATCH] 分析检索/人员管理接口联调
---
src/pages/shuohuangMonitorAnalyze/components/memberManage.vue | 263 ++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 212 insertions(+), 51 deletions(-)
diff --git a/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue b/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue
index 5d7a0a9..bc1be55 100644
--- a/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue
+++ b/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue
@@ -1,12 +1,20 @@
<template>
<div class="member-manage">
<div class="left">
- <div>
- <el-input placeholder="璇疯緭鍏�" v-model="treeWord">
+ <div style="margin-bottom:10px;">
+ <el-input placeholder="璇疯緭鍏�" v-model="treeWord" size="small">
<el-button slot="append" icon="el-icon-search"></el-button>
</el-input>
</div>
- <el-tree :data="treeData" node-key="id" default-expand-all></el-tree>
+ <el-tree
+ :data="treeData"
+ node-key="id"
+ default-expand-all
+ @node-click="checkNode"
+ :expand-on-click-node="false"
+ :check-on-click-node="true"
+ :highlight-current="true"
+ ></el-tree>
<div class="menuList" v-show="showMenu" :style="{top:menuTop+'px',left:menuLeft+'px'}">
<ul>
<li>鍒涘缓鍚岀骇鑺傜偣</li>
@@ -32,33 +40,58 @@
<div class="table-area">
<div class="actions">
<el-button type="primary" size="small" @click="addMember">娣诲姞浜哄憳</el-button>
- <el-button type="primary" size="small" @click="toggleOrganize">鎹㈢粍缁�</el-button>
+ <el-button
+ type="primary"
+ :disabled="multipleTableSelection.length<1"
+ size="small"
+ @click="toggleOrganize"
+ >鎹㈢粍缁�</el-button>
<el-button type="primary" size="small" @click="batchImport">鎵归噺瀵煎叆</el-button>
- <el-button type="primary" size="small" @click="uploadPic">涓婁紶鐓х墖</el-button>
+ <!-- <el-button type="primary" size="small" @click="uploadPic">涓婁紶鐓х墖</el-button> -->
</div>
- <el-table class="thbg" :data="tableData" fit ref="elTable">
+ <el-table
+ class="thbg"
+ :data="tableData"
+ fit
+ ref="elTable"
+ @selection-change="tableSelection"
+ >
<el-table-column type="selection" width="55"></el-table-column>
- <el-table-column label="濮撳悕" prop="name" sortable>
+ <el-table-column label="濮撳悕" prop="Name" sortable>
<template slot-scope="scope">
- <div style="cursor:pointer;">{{scope.row.name}}</div>
+ <div style="cursor:pointer;">{{scope.row.Name}}</div>
</template>
</el-table-column>
- <el-table-column label="鐓х墖" prop="picture">
- <template>
- <div></div>
+ <el-table-column label="鐓х墖" prop="Surface">
+ <template slot-scope="scope">
+ <div class="table-cell-pic">
+ <img :src="`${CLIP}${scope.row.Surface}`" alt />
+ </div>
</template>
</el-table-column>
- <el-table-column label="鎬у埆" prop="gender"></el-table-column>
- <el-table-column label="鎵�灞炵粍缁�" prop="organization"></el-table-column>
- <el-table-column label="宸ュ彿" prop="no"></el-table-column>
- <el-table-column label="鎵嬫満鍙�" prop="phone"></el-table-column>
- <el-table-column label="鐢ㄦ埛鏉冮檺" prop="userpermission"></el-table-column>
- <el-table-column label="杞偍鏉冮檺" prop="transferpermission"></el-table-column>
- <el-table-column label="鎿嶄綔">
- <template>
+ <el-table-column label="鎬у埆" prop="Sex"></el-table-column>
+ <el-table-column label="鎵�灞炵粍缁�" prop="Org"></el-table-column>
+ <el-table-column label="宸ュ彿" prop="WorkID"></el-table-column>
+ <el-table-column label="鎵嬫満鍙�" prop="Tel"></el-table-column>
+ <el-table-column label="鐢ㄦ埛鏉冮檺" prop="userpermission">
+ <template slot-scope="scope">
<div>
- <i class="el-icon-edit"></i>
- <i class="el-icon-delete"></i>
+ <el-switch v-model="scope.row.UserPermissions" @change="memberUpdate(scope.row)"></el-switch>
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column label="杞偍鏉冮檺" prop="transferpermission">
+ <template slot-scope="scope">
+ <div>
+ <el-switch v-model="scope.row.DumpPermissions" @change="memberUpdate(scope.row)"></el-switch>
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔">
+ <template slot-scope="scope">
+ <div class="operation">
+ <i class="el-icon-edit" @click="editMember(scope.row)"></i>
+ <i class="el-icon-delete" @click="delMember(scope.row)"></i>
</div>
</template>
</el-table-column>
@@ -79,41 +112,41 @@
class="avatar-uploader"
action="https://jsonplaceholder.typicode.com/posts/"
:show-file-list="false"
- :http-request="uploadMemberPic"
+ :http-request="uploadMemberPicture"
>
<img
- v-if="memberEditForm.memberPicUrl"
- :src="memberEditForm.memberPicUrl"
+ v-if="memberEditForm.Surface"
+ :src="`/httpImage/`+memberEditForm.Surface"
class="avatar"
/>
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-form-item>
- <el-form-item label="宸ュ彿:" prop="no">
- <el-input v-model="memberEditForm.no" size="mini"></el-input>
+ <el-form-item label="宸ュ彿:" prop="WorkID">
+ <el-input v-model="memberEditForm.WorkID" size="mini"></el-input>
</el-form-item>
<el-form-item label="鐓х墖鏍囪瘑:">
- <el-input v-model="memberEditForm.figure" size="mini"></el-input>
+ <el-input v-model="memberEditForm.SurfaceName" size="mini"></el-input>
</el-form-item>
<el-form-item label="濮撳悕:">
- <el-input v-model="memberEditForm.name" size="mini"></el-input>
+ <el-input v-model="memberEditForm.Name" size="mini"></el-input>
+ </el-form-item>
+ <el-form-item label="鐢ㄦ埛鍚�:">
+ <el-input v-model="memberEditForm.UserName" size="mini"></el-input>
</el-form-item>
<el-form-item label="鎬у埆:">
- <el-radio v-model="memberEditForm.gender" label="1">濂�</el-radio>
- <el-radio v-model="memberEditForm.gender" label="2">鐢�</el-radio>
+ <el-radio v-model="memberEditForm.Sex" label="濂�">濂�</el-radio>
+ <el-radio v-model="memberEditForm.Sex" label="鐢�">鐢�</el-radio>
</el-form-item>
<el-form-item label="韬唤璇佸彿:">
- <el-input v-model="memberEditForm.idCard" size="mini"></el-input>
+ <el-input v-model="memberEditForm.OwnerID" size="mini"></el-input>
</el-form-item>
<el-form-item label="鎵嬫満鍙�:">
- <el-input v-model="memberEditForm.phone" size="mini"></el-input>
- </el-form-item>
- <el-form-item label="鍏朵粬:">
- <el-input v-model="memberEditForm.other" size="mini"></el-input>
+ <el-input v-model="memberEditForm.Tel" size="mini"></el-input>
</el-form-item>
<div class="btns">
- <el-button size="small">鍙栨秷</el-button>
- <el-button size="small" type="primary">淇濆瓨</el-button>
+ <el-button size="small" @click="memberEditDialogVisible=false">鍙栨秷</el-button>
+ <el-button size="small" type="primary" @click="memberSave">淇濆瓨</el-button>
</div>
</el-form>
</div>
@@ -126,18 +159,22 @@
@close="toggleOrganizeDialogVisible=false"
>
<div class="text-left">
- <div class="flex-box">
- <label>浜哄憳:</label>
- <span>lisi</span>
- </div>
<el-input v-model="organizeKeyword" size="small">
- <el-button slot="append" icon="el-icon-search"></el-button>
+ <el-button slot="append" icon="el-icon-search" @clcik="getOrganizeTreeData"></el-button>
</el-input>
<div>榛樿缁勭粐</div>
- <el-tree :data="organizeData" node-key="id" default-expand-all></el-tree>
+ <el-tree
+ :data="organizeData"
+ node-key="id"
+ default-expand-all
+ @node-click="checkOrgNode"
+ :expand-on-click-node="false"
+ :check-on-click-node="true"
+ :highlight-current="true"
+ ></el-tree>
<div slot="footer" class="btns">
- <el-button size="small">鍙栨秷</el-button>
- <el-button size="small" type="primary">纭畾</el-button>
+ <el-button size="small" @click="toggleOrganizeDialogVisible=false">鍙栨秷</el-button>
+ <el-button size="small" type="primary" @click="updateOrg">纭畾</el-button>
</div>
</div>
</el-dialog>
@@ -175,6 +212,15 @@
<el-table-column prop="time" label="涓婁紶鏃堕棿"></el-table-column>
<el-table-column prop="state" label="鐘舵��"></el-table-column>
</el-table>
+ <el-pagination
+ @size-change="handleTableSizeChange"
+ @current-change="renderMemberTable"
+ :current-page.sync="PageIndex"
+ :page-size="PageSize"
+ :page-sizes="pageSizes"
+ layout="total,sizes, prev, pager, next"
+ :total="tableTotal"
+ ></el-pagination>
</div>
</el-dialog>
</div>
@@ -182,21 +228,30 @@
<script>
-import { getShuohuangDepartTree, getOrganizeTree } from '@/api/shuohuang'
+import { getShuohuangDepartTree, getOrganizeTree, getMemberList, updateMemberInfo, addMember, updateUnit, uploadMemberPic } from '@/api/shuohuang'
export default {
data () {
return {
+ CLIP: 'http://192.168.20.113/',
treeWord: '',
treeData: [],
showMenu: false,
+ deptId: '',
menuTop: 0,
menuLeft: 0,
keyword: '',
gender: '',
genders: [{ name: '鐢�', id: 'g0' }, { name: '濂�', id: 'g1' }],
tableData: [],
+ multipleTableSelection: [],
+ PageIndex: 1,
+ pageSizes: [2, 8, 12, 24],
+ tableTotal: 0,
+ PageSize: 8,
organizeData: [],
+ checkedOrg: '',
+ organizeKeyword: '',
memberEditDialogVisible: false,
toggleOrganizeDialogVisible: false,
batchImportDialogVisible: false,
@@ -209,9 +264,105 @@
mounted () {
this.searchLeftTreeData();
this.getOrganizeTreeData();
+ this.renderMemberTable();
},
methods: {
- uploadPic(){
+ checkOrgNode (a, b, c) {
+ this.checkedOrg = a.id
+ },
+ updateOrg () {
+ let ids = this.multipleTableSelection.map(row => {
+ return row.ID
+ });
+ let params = {
+ DeptID: this.checkedOrg,
+ Users: ids.join(',')
+ }
+ updateUnit(params).then(res => {
+ if (res.success) {
+ this.$notify({
+ type: 'success',
+ message: res.msg
+ });
+ this.toggleOrganizeDialogVisible = false;
+ this.renderMemberTable();
+ }
+ })
+
+ },
+ tableSelection (val) {
+ this.multipleTableSelection = val;
+ },
+ memberSave () {
+ if (this.memberEditForm.ID) {
+ updateMemberInfo(this.memberEditForm).then(res => {
+ if (res.success) {
+ this.$notify({
+ type: 'success',
+ message: res.msg
+ });
+ this.memberEditDialogVisible = false;
+ this.renderMemberTable();
+ }
+ })
+ }else{
+ addMember(this.memberEditForm).then(res=>{
+ if(res.success){
+ this.$notify({
+ type:'success',
+ message: res.msg
+ })
+ this.renderMemberTable();
+ }
+ })
+ }
+
+ },
+ delMember (member) {
+ member.IsDel = true;
+ this.memberUpdate(member);
+ },
+ editMember (member) {
+ debugger
+ this.memberEditDialogVisible = true;
+ this.memberEditForm = member;
+ },
+ memberUpdate (member) {
+ updateMemberInfo(member).then(res => {
+ if (res.success) {
+ this.$notify({
+ type: 'success',
+ message: res.msg
+ });
+ this.renderMemberTable();
+ }
+ })
+ },
+ checkNode (a, b, c) {
+ if (a.children) {
+ this.deptId = a.id;
+ this.renderMemberTable();
+ }
+ },
+ handleTableSizeChange (size) {
+ this.PageSize = size;
+ this.renderMemberTable();
+ },
+ renderMemberTable () {
+ let _this = this;
+ let params = {
+ DeptID: this.deptId,
+ keyword: this.keyword,
+ Sex: this.gender,
+ PageIndex: this.PageIndex,
+ PageSize: this.PageSize
+ }
+ getMemberList(params).then(res => {
+
+ _this.tableData = res.data;
+ })
+ },
+ uploadPic () {
},
batchImportFiles () {
@@ -229,7 +380,13 @@
toggleOrganize () {
this.toggleOrganizeDialogVisible = true;
},
- uploadMemberPic () { },
+ uploadMemberPicture (params) {
+ let param = new FormData();
+ param.append('file', params.file)
+ uploadMemberPic(param).then(res => {
+ this.$set(this.memberEditForm,'Surface',res.data)
+ })
+ },
openMenuList (t, l, frame) {
this.showMenu = true;
this.menuTop = t;
@@ -326,7 +483,7 @@
height: 178px;
display: block;
}
- .batch-upload{
+ .batch-upload {
text-align: left;
margin: 0 20px 20px 10px;
}
@@ -374,7 +531,7 @@
background: rgba(152, 170, 190, 0.7);
}
.right {
- padding: 8px 0 0 20px;
+ padding-left: 20px;
.filter-bar {
display: flex;
margin-bottom: 20px;
@@ -386,7 +543,11 @@
.actions {
text-align: left;
}
-
+ .table-cell-pic {
+ img {
+ width: 70px;
+ }
+ }
}
}
}
--
Gitblit v1.8.0