Browse Source

Merge branch 'fengrui' of yinet2020/YinetOASystemWeb into master

冯瑞 4 years ago
parent
commit
2abb3db096

+ 75 - 48
src/components/SelectRen/index.vue

@@ -4,6 +4,7 @@
       <el-col :span="6" :xs="24" style="padding-right:10px">
         <el-tree
           :data="deptOptions"
+          node-key ="id"
           :props="defaultProps"
           :expand-on-click-node="false"
           :filter-node-method="filterNode"
@@ -12,7 +13,9 @@
           @node-click="handleNodeClick"
           style="padding:10px;"
         />
+        {{userIds}}==={{userIdsArr.length}}
       </el-col>
+
       <!--用户数据-->
       <el-col :span="18" :xs="24" style="padding:10px; background-color: #fff;">
         <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px">
@@ -26,6 +29,7 @@
               suffix-icon="el-icon-search"
               @keyup.enter.native="handleQuery"
             />
+
           </el-form-item>
           <el-form-item>
             <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
@@ -33,8 +37,8 @@
           </el-form-item>
         </el-form>
 
-        <el-table v-loading="loading" :data="userList" ref="userList" @selection-change="handleSelectionChange">
-          <el-table-column type="selection" width="50" align="center" />
+        <el-table v-loading="loading" :data="userList" ref="userList" @select="handleSelection" @selection-change="handleSelectionChange" @row-click="handleCurrentChange" row-key="userName">
+          <el-table-column type="selection" width="50" align="center" 	/>
           <el-table-column label="用户名称" align="center" prop="userName" :show-overflow-tooltip="true" />
           <el-table-column label="用户昵称" align="center" prop="nickName" :show-overflow-tooltip="true" />
           <el-table-column label="部门" align="center" prop="dept.deptName" :show-overflow-tooltip="true" />
@@ -61,8 +65,12 @@
     export default {
       name: "index",
       components: { Treeselect },
+      props: ['userIds'],
       data(){
         return {
+          userIdsArr:[],
+          selectInput:'',
+          arrID:[],
           multipleSelection:null,
           // 选中人员昵称数组
           names: [],
@@ -75,7 +83,6 @@
           // 总条数
           total: 0,
           // 用户表格数据
-          olduserList: null,
           userList: null,
           deptOptions: undefined,
           defaultProps: {
@@ -94,58 +101,35 @@
         }
       },
       watch: {
-        // 根据名称筛选部门树
-        deptName(val) {
-          this.$refs.tree.filter(val);
-        },
-        userList(n,o){
-          // this.multipleSelection.forEach(row => {
-          //   // 不能自己自定义对象来设置选中(原因如下分析),那我可以从列表中找到需要选中的那个对象,然后把它拿过来作为选中的项就可以了
-          //   // this.$refs.userList.toggleRowSelection(this.userList.find(item => {
-          //   //   return row.userName == item.userName;  // 注意这里寻找的字段要唯一,示例仅参考
-          //   // }), true);
-          //   //this.$refs.userList.toggleRowSelection(this.userList[1], true);
-          // });
-          // this.$nextTick( ()=> {
-          //   console.log("xuanzhong "+this.multipleSelection.length);
-          //   console.log(this.multipleSelection);
-          //   this.multipleSelection.forEach(row => {
-          //     console.log(row.name+"12313");
-          //   });
-          //   //this.$refs.userList.toggleRowSelection(this.userList[1],true);
-          //   //console.log("这是选中行的循环kaishi");
-          // })
+        userIds: {
+          immediate: true,
+          handler() {
+            if(this.userIds!="")
+              this.userIdsArr = this.userIds.split(',');
+          }
         }
       },
       created() {
         this.getList();
         this.getTreeselect();
-        this.olduserList = this.userList;
+        if(this.userIds!="")
+          this.userIdsArr = this.userIds.split(',');
       },
       methods:{
         /** 查询用户列表 */
         getList() {
           this.loading = true;
+          //console.log("测试子组件调用父组件的数据=="+this.userIds);
           listUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
               this.userList = response.rows;
               this.total = response.total;
               this.loading = false;
-              // if(this.multipleSelection!=null)
-              // {
-              //   //alert("获取用户列表"+this.multipleSelection.length);
-              //   this.multipleSelection.forEach(row => {
-              //     // 不能自己自定义对象来设置选中(原因如下分析),那我可以从列表中找到需要选中的那个对象,然后把它拿过来作为选中的项就可以了
-              //     this.$refs.userList.toggleRowSelection(this.userList.find(item => {
-              //       return row.userName == item.userName;  // 注意这里寻找的字段要唯一,示例仅参考
-              //     }), true);
-              //     //this.$refs.userList.toggleRowSelection(this.userList[1], true);
-              //   });
-              // }
-              // else{
-              //   //alert("第一次获取用户列表,暂时还没有选中记录");
-              // }
-            }
-          );
+
+            this.$nextTick(function(){
+              console.log("进入nexttick中:"+this.userIds);
+              this.checked(this.userIds);//每次更新了数据,触发这个函数即可。
+            })
+          });
         },
         /** 查询部门下拉树结构 */
         getTreeselect() {
@@ -173,17 +157,60 @@
           this.resetForm("queryForm");
           this.handleQuery();
         },
+        /** 手动勾选行的多选框触发的事件 */
+        handleSelection(selection,row) {
+          if (this.userIdsArr.includes(row.userName)) {
+            this.$emit("removeFunction",row.userName,row.nickName);
+          }
+        },
         // 多选框选中数据
         handleSelectionChange(selection) {
           this.names = selection.map(item => item.nickName);
           this.accounts = selection.map(item => item.userName);
-          // if(this.multipleSelection==null){
-          //   this.multipleSelection = selection;
-          // }
-          // else{
-          //   //合并
-          //   this.multipleSelection
-          // }
+          this.$emit('fatherFunction',this.accounts.join(','),this.names.join(','));
+        },
+        //行选中
+        handleCurrentChange(row, event, column) {
+          var same=false;
+          if(this.userIdsArr.length > 0){
+            for(var i=0; i<this.userIdsArr.length ;i++){
+              if(this.userIdsArr[i]==row.userName){
+                same=true;
+                break;
+              }
+            }
+            if(same==true){
+              this.$refs.userList.toggleRowSelection(row,false);
+              this.$emit("removeFunction",row.userName,row.nickName);
+            }
+            else{
+              this.$refs.userList.toggleRowSelection(row,true);
+              this.$emit('fatherFunction',row.userName,row.nickName);
+            }
+          }
+          else{
+            this.$refs.userList.toggleRowSelection(row,true);
+            this.$emit('fatherFunction',row.userName,row.nickName);
+          }
+        },
+        removeByValue(arr, val){
+          for (var i = 0; i < arr.length; i++) {
+            if (arr[i] == val) {
+              arr.splice(i, 1);
+              break;
+            }
+          }
+        },
+        checked(userids){
+          let selectUsers = [];
+          selectUsers = userids.split(',');
+          for(let i=0; i<this.userList.length ;i++){
+            for(let j=0;j<selectUsers.length;j++){
+              if(selectUsers[j] == this.userList[i].userName){
+                this.$refs.userList.toggleRowSelection(this.userList[i], true);//默认选中
+              }
+            }
+          }
         }
       }
     }

+ 98 - 0
src/components/SelectRen/selectUserByDept.vue

@@ -0,0 +1,98 @@
+<template>
+  <!-- 选择人员对话框 -->
+  <el-dialog :title="this.title" :visible.sync="childOpen" width="1000px">
+    <SelectRen ref="renlist" :userIds="receiverAccount" @fatherFunction = "selectChange" @removeFunction="removeSelectuser"/>
+
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="cancel">取 消</el-button>
+      <el-button type="primary" @click="submitRen">选 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+  import SelectRen from '@/components/SelectRen';
+    export default {
+      name: "selectUserByDept",
+      components: {
+        SelectRen
+      },
+      props: ['title','open'],
+      data() {
+        return {
+          childOpen: false,
+          receiverName: "", // 收件人的昵称
+          receiverAccount: "", // 收件人的账号
+        };
+      },
+      methods:{
+        // 人员选择器----取消按钮
+        cancel() {
+          this.open = false;
+          this.childOpen=false;
+          this.filterText='';
+        },
+        /** 人员选择器中的 选定按钮操作 */
+        submitRen(){
+          this.$emit('ok', this.receiverAccount, this.receiverName);
+          this.childOpen = false;
+        },
+        /** 人员选中  */
+        selectChange(zh,xm){
+          let zhArr=[];
+          let xmArr=[];
+          if(this.receiverAccount!="")
+            zhArr = this.receiverAccount.split(',');
+          if(this.receiverName!="")
+            xmArr = this.receiverName.split(',');
+          let selzhArr=[];
+          let selxmArr=[];
+          if(zh!="")
+            selzhArr = zh.split(',');
+          if(xm!="")
+            selxmArr = xm.split(',');
+          for (let i = 0, len = selzhArr.length; i < len; i++) {
+            if (!zhArr.includes(selzhArr[i])) {
+              zhArr.push(selzhArr[i]);
+            }
+            if(!xmArr.includes(selxmArr[i])){
+              xmArr.push(selxmArr[i]);
+            }
+          }
+          this.receiverAccount =zhArr.join(',');
+          this.receiverName = xmArr.join(',');
+
+        },
+        /**  人员取消选择  */
+        removeSelectuser(zh,xm){
+          console.log("去除已选择的数据=="+zh+"=="+xm);
+          let zhArr = this.receiverAccount.split(',');
+          let xmArr = this.receiverName.split(',');
+
+          for (var i = 0; i < zhArr.length; i++) {
+            if (zhArr[i] == zh) {
+              zhArr.splice(i, 1);
+              break;
+            }
+          }
+          for (var i = 0; i < xmArr.length; i++) {
+            if (xmArr[i] == xm) {
+              xmArr.splice(i, 1);
+              break;
+            }
+          }
+          this.receiverAccount =zhArr.join(',');
+          this.receiverName =xmArr.join(',');
+        }
+      },
+      watch:{
+        open(val) {
+          this.childOpen = this.open;
+        }
+      }
+    }
+</script>
+
+<style scoped>
+
+</style>

+ 60 - 25
src/views/system/email/send.vue

@@ -17,7 +17,6 @@
       <el-form-item label="主题" prop="mailTheme">
         <el-input v-model="form.mailTheme" placeholder="请输入邮件主题" />
       </el-form-item>
-<!--      :on-success="handleSuccess"-->
       <el-form-item label="附件">
         <el-upload
           class="upload-file"
@@ -45,9 +44,9 @@
       <el-form-item label="邮件内容" prop="mailContent" style="height: 250px;">
         <Editor v-model="form.mailContent" />
       </el-form-item>
-      <el-input v-model="status" v-show="false"/>
-      <el-input v-model="fileName" v-show="false"/>
-      <el-input v-model="filePath" v-show="false"/>
+      <el-input v-model="form.status" v-show="false"/>
+      <el-input v-model="form.fileName" v-show="false"/>
+      <el-input v-model="form.filePath" v-show="false"/>
       <el-form-item style="text-align:center;">
         <el-button type="primary" @click="submitForm(1)">发 送</el-button>
         <el-button @click="submitForm(0)">保存草稿</el-button>
@@ -56,7 +55,8 @@
 
     <!-- 选择人员对话框 -->
     <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
-      <SelectRen ref="renlist"/>
+      <SelectRen ref="renlist" :userIds="receiverAccount" @fatherFunction = "selectChange" @removeFunction="removeSelectuser"/>
+
       <div slot="footer" class="dialog-footer">
         <el-button @click="cancel">取 消</el-button>
         <el-button type="primary" @click="submitRen">选 定</el-button>
@@ -71,7 +71,6 @@
   import Editor from '@/components/Editor';
   import Treeselect from "@riophae/vue-treeselect";
   import SelectRen from '@/components/SelectRen';
-
   export default {
     name: "Info",
     components: {
@@ -81,6 +80,13 @@
     },
     data() {
       return {
+        userIds: '',
+        modal: {
+          title: '这里是标题',
+          visible: false,
+          fullscreen: true,
+          switchFullscreen: true,
+        },
         // 选中数组
         ids: [],
         // 遮罩层
@@ -101,7 +107,6 @@
         deptOptions: undefined,
         receiverName: "", // 收件人的昵称
         receiverAccount: "", // 收件人的账号
-        filterText: '',  //人员选择器中的 筛选
         mail: {
           oldFileList: [],
           fileList: []
@@ -185,12 +190,6 @@
           }
         });
       },
-      /** 加载修改树结构json */
-      findZNodes: function () {
-        selectRen(this.queryParams).then(response => {
-            this.options1 = response.data;
-        });
-      },
       /** 查询部门树结构 */
       getDeptTreeselect() {
         deptTreeselect().then(response => {
@@ -204,14 +203,10 @@
       },
       /** 人员选择器中的 选定按钮操作 */
       submitRen(){
-        this.receiverName =this.$refs.renlist.names.join(',');
-        this.receiverAccount=this.$refs.renlist.accounts.join(',');
+        // this.receiverName =this.$refs.renlist.names.join(',');
+        // this.receiverAccount=this.$refs.renlist.accounts.join(',');
         this.open = false;
       },
-      filterNode(value, data) {
-        if (!value) return true;
-        return data.label.indexOf(value) !== -1;
-      },
       handleBefore(file) {
         // 上传前可以对要上传文件进行控制
         // if (file.type.indexOf("image/") == -1) {
@@ -219,7 +214,6 @@
         // }
       },
       handleSuccess(file, fileInfo) {
-        console.log(fileInfo);
         this.mail.fileList.push({
           name: fileInfo.name,
           uuid: fileInfo.uid,
@@ -234,7 +228,6 @@
       handleRemove(file) {
         // 移除
         this.mail.fileList.forEach((item, index) => {
-          console.log(item);
           if (item.uuid === file.uid) {
             this.mail.fileList.splice(index, 1);
             //删除
@@ -258,13 +251,55 @@
             this.msgSuccess("上传成功");
           }
         });
+      },
+      selectChange(zh,xm){
+        let zhArr=[];
+        let xmArr=[];
+        if(this.receiverAccount!="")
+          zhArr = this.receiverAccount.split(',');
+        if(this.receiverName!="")
+          xmArr = this.receiverName.split(',');
+        let selzhArr=[];
+        let selxmArr=[];
+        if(zh!="")
+          selzhArr = zh.split(',');
+        if(xm!="")
+          selxmArr = xm.split(',');
+        for (let i = 0, len = selzhArr.length; i < len; i++) {
+          if (!zhArr.includes(selzhArr[i])) {
+            zhArr.push(selzhArr[i]);
+          }
+          if(!xmArr.includes(selxmArr[i])){
+            xmArr.push(selxmArr[i]);
+          }
+        }
+        this.receiverAccount =zhArr.join(',');
+        this.receiverName = xmArr.join(',');
+
+      },
+      removeSelectuser(zh,xm){
+        console.log("去除已选择的数据=="+zh+"=="+xm);
+        let zhArr = this.receiverAccount.split(',');
+        let xmArr = this.receiverName.split(',');
+
+        for (var i = 0; i < zhArr.length; i++) {
+          if (zhArr[i] == zh) {
+            zhArr.splice(i, 1);
+            break;
+          }
+        }
+        for (var i = 0; i < xmArr.length; i++) {
+          if (xmArr[i] == xm) {
+            xmArr.splice(i, 1);
+            break;
+          }
+        }
+        this.receiverAccount =zhArr.join(',');
+        this.receiverName =xmArr.join(',');
       }
+
     },
     watch: {
-      /** 人员选择器中的 筛选 */
-      filterText(val) {
-        this.$refs.tree.filter(val);
-      }
     }
   };
 </script>