From 0175cda6150656bc74b34c6f6c71edd1e1fc653c Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@iotlink.com> Date: 星期四, 04 二月 2021 18:22:54 +0800 Subject: [PATCH] treee, 修复tab切换时树的选中状态.添加区域 --- src/pages/shuohuangMonitorAnalyze/components/memberManage.vue | 109 +++++++++++++++++++++++++++++++++++------------------- 1 files changed, 71 insertions(+), 38 deletions(-) diff --git a/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue b/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue index 6a03a59..2111a3e 100644 --- a/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue +++ b/src/pages/shuohuangMonitorAnalyze/components/memberManage.vue @@ -33,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="renderMemberTable">鏌ヨ</el-button> + <el-button type="primary" size="small" @click="resetFilter">閲嶇疆</el-button> </div> <div class="table-area"> <div class="actions"> @@ -98,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 @@ -148,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"> @@ -196,12 +206,16 @@ <p class="tip"> *璇锋彁鍓嶆牴鎹枃浠舵ā鏉夸腑鐨勮姹傛敹闆嗕汉鍛樹俊鎭紝鍦ㄤ竴涓枃浠跺す涓瓨鏀句汉鍛樼収鐗囧拰EXCEL鏂囦欢 ( - <a href="javascript:;" @mouseover="showDemo=true" @mouseout="showDemo=false">绀轰緥</a>),鐐瑰嚮 + <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 /> </p> <div class="flex-box"> - <label>涓婁紶鏂囦欢:</label> + <label>涓婁紶鏂囦欢澶�:</label> <el-button size="mini" type="primary" @click="uploadDirectoryTrigger">鐐瑰嚮涓婁紶</el-button> <input ref="directoryInput" @change="importDirectory" hidden type="file" webkitdirectory /> </div> @@ -211,15 +225,6 @@ <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> @@ -227,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 } from '@/api/shuohuang' export default { data () { return { @@ -243,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, @@ -261,7 +265,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, @@ -275,8 +280,21 @@ }, methods: { + resetFilter(){ + this.keyword = ''; + this.gender = ''; + this.renderMemberTable(); + }, + isPhone (rule, value, callback) { + if (value.trim()) { + var pattern = /^1[345789]\d{9}$/ + if (pattern.test(value)) { + return callback() + } + return callback(new Error('杈撳叆鐨勬墜鏈哄彿閿欒')) + } + }, nodeContextMenu (e, data, node, comp) { - debugger this.showMenu = true; this.menuTop = e.pageY; this.menuLeft = e.pageX; @@ -310,8 +328,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', @@ -319,16 +338,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(); } }) } @@ -338,11 +360,10 @@ }) }, delMember (member) { - member.IsDel = true; + member.IsDel = '1'; this.memberUpdate(member); }, editMember (member) { - debugger this.memberEditDialogVisible = true; this.memberEditForm = member; }, @@ -354,11 +375,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(); @@ -372,13 +394,14 @@ 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 () { @@ -387,19 +410,18 @@ uploadDirectoryTrigger () { this.$refs['directoryInput'].click(); }, - // uploadExeclTrigger(){ - // this.$refs['excelInput'].click(); - // }, importDirectory () { //this.$refs['directoryInput'].files //鏂囦欢澶筸ap let formData = new FormData; - formData.append('File', this.$refs['directoryInput'].files) - debugger - // 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 => { + debugger + }) }, handleRemove () { @@ -423,8 +445,10 @@ }, 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; @@ -437,8 +461,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; @@ -446,6 +471,7 @@ return childObj; }); } + return arr1.concat(arr2) }, getOrganizeTreeData () { let _this = this; @@ -472,9 +498,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); }) }) @@ -542,6 +572,9 @@ .el-form-item__label { width: 100px; } + .el-form-item__error { + left: 120px; + } } } .el-input { -- Gitblit v1.8.0