From fa7044f3ccc9a91bc2bc117d1a06f650d86554f2 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@iotlink.com>
Date: 星期二, 15 六月 2021 16:07:16 +0800
Subject: [PATCH] 优化联动规则加载场景列表的操作
---
src/pages/shuohuangMonitorAnalyze/components/memberManage.vue | 204 ++++++++++++++++++++++++++++++--------------------
1 files changed, 121 insertions(+), 83 deletions(-)
diff --git a/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue b/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue
index 4cb0f16..f254def 100644
--- a/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue
+++ b/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue
@@ -11,17 +11,18 @@
:data="treeData"
node-key="id"
default-expand-all
- @node-click="checkNode"
:expand-on-click-node="false"
:check-on-click-node="true"
:highlight-current="true"
+ @node-click="checkNode"
+ @node-contextmenu="nodeContextMenu"
></el-tree>
<div class="menuList" v-show="showMenu" :style="{top:menuTop+'px',left:menuLeft+'px'}">
<ul>
<li>鍒涘缓鍚岀骇鑺傜偣</li>
<li>鍒犻櫎鑺傜偣</li>
<li>閲嶅懡鍚嶈妭鐐�</li>
- <li>鍏抽棴</li>
+ <li @click="showMenu = false">鍏抽棴</li>
</ul>
</div>
</div>
@@ -32,11 +33,12 @@
<el-option
v-for="item in genders"
:key="item.id"
- :value="item.id"
+ :value="item.name=='鍏ㄩ儴'?'':item.name"
:label="item.name"
>{{item.name}}</el-option>
</el-select>
- <el-button type="primary" size="small" @click="dataSearch">鏌ヨ</el-button>
+ <el-button type="primary" size="small" @click="renderMemberTable">鏌ヨ</el-button>
+ <el-button type="primary" size="small" @click="resetFilter">閲嶇疆</el-button>
</div>
<div class="table-area">
<div class="actions">
@@ -97,6 +99,15 @@
</template>
</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>
</div>
<el-dialog
@@ -147,7 +158,7 @@
<el-form-item label="韬唤璇佸彿:">
<el-input v-model="memberEditForm.OwnerID" size="mini"></el-input>
</el-form-item>
- <el-form-item label="鎵嬫満鍙�:">
+ <el-form-item label="鎵嬫満鍙�:" prop="Tel">
<el-input v-model="memberEditForm.Tel" size="mini"></el-input>
</el-form-item>
<div class="btns">
@@ -194,45 +205,26 @@
<div>
<p class="tip">
*璇锋彁鍓嶆牴鎹枃浠舵ā鏉夸腑鐨勮姹傛敹闆嗕汉鍛樹俊鎭紝鍦ㄤ竴涓枃浠跺す涓瓨鏀句汉鍛樼収鐗囧拰EXCEL鏂囦欢
- (<a href="javascript:;" @mouseover="showDemo=true" @mouseout="showDemo=false">绀轰緥</a>),鐐瑰嚮
- <a href="javascript:;">涓嬭浇妯℃澘.excel</a>
- <img class="tip-demo" v-if="showDemo" :src="`${publicPath}images/shuohuang/tip.jpg`" alt="">
+ (
+ <a
+ href="javascript:;"
+ @mouseover="showDemo=true"
+ @mouseout="showDemo=false"
+ >绀轰緥</a>),鐐瑰嚮
+ <a href="javascript:;" @click="downloadExcel">涓嬭浇妯℃澘.excel</a>
+ <img class="tip-demo" v-if="showDemo" :src="`${publicPath}images/shuohuang/tip.jpg`" alt />
</p>
<div class="flex-box">
- <label>涓婁紶鏂囦欢:</label>
- <el-button size="mini" type="primary" @click="uploadDirectoryTrigger" >鐐瑰嚮涓婁紶</el-button>
- <input ref="directoryInput" @change="importDirectory" hidden type="file" webkitdirectory >
- <!-- <el-button size="mini" type="primary" @click="uploadExeclTrigger" style="margin-left:10px;">鐐瑰嚮涓婁紶Excel</el-button>
- <input ref="excelInput" @change="importExecl" hidden type="file" accept=".xlsx"> -->
- <!-- <el-upload
- class="upload-demo batch-upload"
- action="https://jsonplaceholder.typicode.com/posts/"
- :on-remove="handleRemove"
- multiple
- :limit="3"
- :http-request="batchImportFiles"
- :on-exceed="handleExceed"
- :file-list="fileList"
- >
- <el-button size="small" type="primary">鐐瑰嚮涓婁紶</el-button>
- <div slot="tip" class="el-upload__tip"></div>
- </el-upload> -->
+ <label>涓婁紶鏂囦欢澶�:</label>
+ <el-button size="mini" type="primary" @click="uploadDirectoryTrigger">鐐瑰嚮涓婁紶</el-button>
+ <input ref="directoryInput" @change="importDirectory" hidden type="file" webkitdirectory />
</div>
<el-table class="thbg" :data="batchImportTableData" fit>
<el-table-column type="index" label="搴忓彿"></el-table-column>
- <el-table-column prop="filename" label="鏂囦欢鍚嶇О"></el-table-column>
- <el-table-column prop="time" label="涓婁紶鏃堕棿"></el-table-column>
- <el-table-column prop="state" label="鐘舵��"></el-table-column>
+ <el-table-column prop="Name" label="鏂囦欢鍚嶇О"></el-table-column>
+ <el-table-column prop="UploadTime" label="涓婁紶鏃堕棿"></el-table-column>
+ <el-table-column prop="Status" 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>
@@ -240,8 +232,7 @@
<script>
-import { getShuohuangDepartTree, getOrganizeTree, getMemberList, updateMemberInfo, addMember, updateUnit, uploadMemberPic, uploadDirectory } from '@/api/shuohuang'
-
+import { getShuohuangDepartTree, getOrganizeTree, getMemberList, updateMemberInfo, addMember, updateUnit, uploadMemberPic, uploadDirectory, uploadFile,downloadFile } from '@/api/shuohuang'
export default {
data () {
return {
@@ -256,7 +247,7 @@
menuLeft: 0,
keyword: '',
gender: '',
- genders: [{ name: '鐢�', id: 'g0' }, { name: '濂�', id: 'g1' }],
+ genders: [{id:'g3',name:'鍏ㄩ儴'},{ name: '鐢�', id: 'g0' }, { name: '濂�', id: 'g1' }],
tableData: [],
multipleTableSelection: [],
PageIndex: 1,
@@ -264,7 +255,8 @@
tableTotal: 0,
PageSize: 8,
organizeData: [],
- checkedOrg: '',
+ checkedOrgID: '',
+ checkedOrgName:"",
organizeKeyword: '',
memberEditDialogVisible: false,
toggleOrganizeDialogVisible: false,
@@ -274,7 +266,8 @@
memberEditFormRule: {
Name: [{ required: true, message: '璇疯緭鍏ュ鍚�', trigger: 'change' }],
UserName: [{ required: true, message: '璇疯緭鍏ュ鍚�', trigger: 'change' }],
- Sex: [{ required: true, message: '璇烽�夋嫨鎬у埆', trigger: 'change' }]
+ Sex: [{ required: true, message: '璇烽�夋嫨鎬у埆', trigger: 'change' }],
+ Tel: [{ validator: this.isPhone, trigger: 'change' }],
},
memberPicUrl: '',
showDemo: false,
@@ -288,16 +281,51 @@
},
methods: {
-
+ resetFilter(){
+ this.keyword = '';
+ this.gender = '';
+ this.renderMemberTable();
+ },
+ isPhone (rule, value, callback) {
+ if (!value) {
+ return callback()
+ } else if (value.trim()) {
+ var pattern = /^1[345789]\d{9}$/
+ if (pattern.test(value)) {
+ return callback()
+ }
+ return callback(new Error('杈撳叆鐨勬墜鏈哄彿閿欒'))
+ }
+ // if (value.trim()) {
+ // var pattern = /^1[345789]\d{9}$/
+ // if (pattern.test(value)) {
+ // return callback()
+ // }
+ // return callback(new Error('杈撳叆鐨勬墜鏈哄彿閿欒'))
+ // }
+ },
+ nodeContextMenu (e, data, node, comp) {
+ this.showMenu = true;
+ this.menuTop = e.pageY;
+ this.menuLeft = e.pageX;
+ },
checkOrgNode (a, b, c) {
- this.checkedOrg = a.id
+ this.checkedOrgID = a.id
+ this.checkedOrgName = a.label
+ },
+ downloadExcel(){
+ downloadFile().then(function (res) {
+ // debugger
+ console.log(res);
+ })
},
updateOrg () {
let ids = this.multipleTableSelection.map(row => {
return row.ID
});
let params = {
- DeptID: this.checkedOrg,
+ DeptID: this.checkedOrgID,
+ DeptName:this.checkedOrgName,
Users: ids.join(',')
}
updateUnit(params).then(res => {
@@ -308,6 +336,7 @@
});
this.toggleOrganizeDialogVisible = false;
this.renderMemberTable();
+ this.searchLeftTreeData()
}
})
@@ -318,8 +347,9 @@
memberSave () {
this.$refs['memberForm'].validate((valid) => {
if (valid) {
+ let params = Object.assign({ DeptID: this.curLeftTreeNode.id }, this.memberEditForm);
if (this.memberEditForm.ID) {
- updateMemberInfo(this.memberEditForm).then(res => {
+ updateMemberInfo(params).then(res => {
if (res.success) {
this.$notify({
type: 'success',
@@ -327,16 +357,19 @@
});
this.memberEditDialogVisible = false;
this.renderMemberTable();
+ this.searchLeftTreeData();
}
})
} else {
- addMember(this.memberEditForm).then(res => {
+ addMember(params).then(res => {
if (res.success) {
this.$notify({
type: 'success',
message: res.msg
})
this.renderMemberTable();
+ this.memberEditDialogVisible = false;
+ this.searchLeftTreeData();
}
})
}
@@ -346,11 +379,10 @@
})
},
delMember (member) {
- member.IsDel = true;
+ member.IsDel = '1';
this.memberUpdate(member);
},
editMember (member) {
- debugger
this.memberEditDialogVisible = true;
this.memberEditForm = member;
},
@@ -362,11 +394,12 @@
message: res.msg
});
this.renderMemberTable();
+ this.searchLeftTreeData();
}
})
},
checkNode (a, b, c) {
- if (a.children) {
+ if (a.hasOwnProperty('children')) {
this.curLeftTreeNode = a;
this.deptId = a.id;
this.renderMemberTable();
@@ -380,33 +413,35 @@
let _this = this;
let params = {
DeptID: this.deptId,
- keyword: this.keyword,
+ Keyword: this.keyword,
Sex: this.gender,
PageIndex: this.PageIndex,
PageSize: this.PageSize
}
getMemberList(params).then(res => {
_this.tableData = res.data;
+ _this.tableTotal = res.total;
})
},
uploadPic () {
},
- uploadDirectoryTrigger(){
+ uploadDirectoryTrigger () {
this.$refs['directoryInput'].click();
},
- // uploadExeclTrigger(){
- // this.$refs['excelInput'].click();
- // },
importDirectory () {
+ let _this = this;
//this.$refs['directoryInput'].files //鏂囦欢澶筸ap
let formData = new FormData;
- formData.append('File',this.$refs['directoryInput'].files)
- uploadDirectory(formData).then(res=>{
- debugger
-
+ for (var file in this.$refs['directoryInput'].files) {
+ formData.append('files', this.$refs['directoryInput'].files[file])
+ }
+ //formData.append('files', this.$refs['directoryInput'].files)
+
+ uploadDirectory(formData).then(res => {
+ _this.batchImportTableData = res.data;
+ _this.renderMemberTable();
})
-
},
handleRemove () {
@@ -428,17 +463,12 @@
this.$set(this.memberEditForm, 'Surface', res.data)
})
},
- openMenuList (t, l, frame) {
- this.showMenu = true;
- this.menuTop = t;
- this.menuLeft = l;
- },
- closeMenuList () {
- this.showMenu = false;
- },
+
deepNodeChildren (node) {
+ var arr1 = [];
+ var arr2 = [];
if (node.ChildDept && node.ChildDept.length > 0) {
- return node.ChildDept.map(child => {
+ arr1 = node.ChildDept.map(child => {
let childObj = {};
childObj.id = child.ID;
childObj.label = child.Name;
@@ -451,8 +481,9 @@
}
return childObj;
});
- } else if (node.UserLst && node.UserLst.length > 0) {
- return node.UserLst.map(child => {
+ }
+ if (node.UserLst && node.UserLst.length > 0) {
+ arr2 = node.UserLst.map(child => {
let childObj = {};
childObj.id = child.ID;
childObj.label = child.Name;
@@ -460,6 +491,7 @@
return childObj;
});
}
+ return arr1.concat(arr2)
},
getOrganizeTreeData () {
let _this = this;
@@ -486,9 +518,13 @@
return obj
});
this.$nextTick(() => {
- _this.$refs['leftTreeNodes'].setCurrentNode(_this.treeData[0]);
- _this.curLeftTreeNode = _this.treeData[0];
- _this.checkNode(_this.treeData[0]);
+ if (!Object.keys(_this.curLeftTreeNode).length) {
+ _this.curLeftTreeNode = _this.treeData[0];
+ _this.$refs['leftTreeNodes'].setCurrentNode(_this.treeData[0]);
+ } else {
+ _this.$refs['leftTreeNodes'].setCurrentNode(_this.curLeftTreeNode);
+ }
+ _this.checkNode(_this.curLeftTreeNode);
})
})
@@ -497,9 +533,7 @@
this.memberEditDialogVisible = true;
this.memberEditForm = {};
},
- dataSearch () {
- }
}
}
</script>
@@ -558,6 +592,9 @@
.el-form-item__label {
width: 100px;
}
+ .el-form-item__error {
+ left: 120px;
+ }
}
}
.el-input {
@@ -576,15 +613,15 @@
}
}
}
- .batch-import-dialog{
- .el-dialog__body{
+ .batch-import-dialog {
+ .el-dialog__body {
padding: 14px 20px;
}
- .tip{
+ .tip {
text-align: left;
margin-bottom: 10px;
position: relative;
- .tip-demo{
+ .tip-demo {
position: absolute;
width: 530px;
z-index: 1000;
@@ -599,7 +636,8 @@
z-index: 100;
width: 180px;
text-align: left;
- border: 1px solid #ccc;
+ border: 1px solid #ddd;
+ box-shadow: 4px 4px 3px 0px rgba(0, 0, 0, 0.1);
}
.menuList li {
line-height: 28px;
@@ -608,7 +646,7 @@
background: #fff;
}
.menuList li:hover {
- background: rgba(152, 170, 190, 0.7);
+ background: #ecf0fc;
}
.right {
padding-left: 20px;
--
Gitblit v1.8.0