增加发送邮件功能

index.html

@@ -5,7 +5,7 @@
     <link rel="icon" type="image/x-icon" href='static/img/favicon.ico'>
     <title></title>
     <style>
-        html body {
+        html, body {
             height: 100%;
             margin: 0px !important;
             overflow: hidden;

package-lock.json

@@ -4301,8 +4301,7 @@
     "extend": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
-      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==",
-      "dev": true
+      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g=="
     },
     "extsprintf": {
       "version": "1.3.0",
@@ -4316,6 +4315,11 @@
       "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
       "dev": true
     },
+    "fast-diff": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.1.2.tgz",
+      "integrity": "sha512-KaJUt+M9t1qaIteSvjc6P3RbMdXsNhK61GRftR6SNxqmhthcd9MGIi4T+o0jD8LUSpSnSKXE20nLtJ3fOHxQig=="
+    },
     "fast-glob": {
       "version": "3.2.11",
       "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.11.tgz",
@@ -6118,6 +6122,11 @@
         "tslib": "^2.0.3"
       }
     },
+    "parchment": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/parchment/-/parchment-1.1.4.tgz",
+      "integrity": "sha512-J5FBQt/pM2inLzg4hEWmzQx/8h8D0CiDxaG3vyp9rKrQRSDgBlhjdP5jQGgosEajXPSQouXGHOmVdgo7QmJuOg=="
+    },
     "parse-json": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
@@ -6423,6 +6432,41 @@
       "resolved": "https://registry.npmjs.org/quickselect/-/quickselect-2.0.0.tgz",
       "integrity": "sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw=="
     },
+    "quill": {
+      "version": "1.3.7",
+      "resolved": "https://registry.npmjs.org/quill/-/quill-1.3.7.tgz",
+      "integrity": "sha512-hG/DVzh/TiknWtE6QmWAF/pxoZKYxfe3J/d/+ShUWkDvvkZQVTPeVmUJVu1uE6DDooC4fWTiCLh84ul89oNz5g==",
+      "requires": {
+        "clone": "^2.1.1",
+        "deep-equal": "^1.0.1",
+        "eventemitter3": "^2.0.3",
+        "extend": "^3.0.2",
+        "parchment": "^1.1.4",
+        "quill-delta": "^3.6.2"
+      },
+      "dependencies": {
+        "clone": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
+          "integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w=="
+        },
+        "eventemitter3": {
+          "version": "2.0.3",
+          "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-2.0.3.tgz",
+          "integrity": "sha512-jLN68Dx5kyFHaePoXWPsCGW5qdyZQtLYHkxkg02/Mz6g0kYpDx4FyP6XfArhQdlOC4b8Mv+EMxPo/8La7Tzghg=="
+        }
+      }
+    },
+    "quill-delta": {
+      "version": "3.6.3",
+      "resolved": "https://registry.npmjs.org/quill-delta/-/quill-delta-3.6.3.tgz",
+      "integrity": "sha512-wdIGBlcX13tCHOXGMVnnTVFtGRLoP0imqxM696fIPwIf5ODIYUHIvHbZcyvGlZFiFhK5XzDC2lpjbxRhnM05Tg==",
+      "requires": {
+        "deep-equal": "^1.0.1",
+        "extend": "^3.0.2",
+        "fast-diff": "1.1.2"
+      }
+    },
     "raf": {
       "version": "3.4.1",
       "resolved": "https://registry.npmmirror.com/raf/-/raf-3.4.1.tgz",
@@ -7759,6 +7803,15 @@
         "vue-style-loader": "^4.1.0"
       }
     },
+    "vue-quill-editor": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/vue-quill-editor/-/vue-quill-editor-3.0.6.tgz",
+      "integrity": "sha512-g20oSZNWg8Hbu41Kinjd55e235qVWPLfg4NvsLW6d+DhgBTFbEuMpcWlUdrD6qT3+Noim6DRu18VLM9lVShXOQ==",
+      "requires": {
+        "object-assign": "^4.1.1",
+        "quill": "^1.3.4"
+      }
+    },
     "vue-router": {
       "version": "3.5.2",
       "resolved": "https://registry.nlark.com/vue-router/download/vue-router-3.5.2.tgz",

package.json

@@ -54,9 +54,11 @@
     "object-assign": "^4.1.1",
     "ol": "^6.5.0",
     "push.js": "^1.0.12",
+    "quill": "^1.3.7",
     "relation-graph": "^1.1.0",
     "vanilla-tilt": "^1.8.1",
     "vue": "^2.6.14",
+    "vue-quill-editor": "^3.0.6",
     "vue-router": "^3.5.2",
     "vuedraggable": "^2.24.3",
     "vuex": "^3.6.2",

src/api/mail/mail.js

+import { get, fileUpload, addParam, addParamNew } from "@/util/http_util";
+
+const PREFIX_MAIL = 'api/rest/mail/';
+
+//发送邮件
+export const sendMail = data => {
+    return fileUpload(`${PREFIX_MAIL}/sendWithMime`, data);
+}
\ No newline at end of file

src/view/ddkz/components/chatRoomInfo.vue

@@ -93,7 +93,8 @@
         <NoticeDialog ref="myNotice" :stompClient="stompClient" :currentChatRoomInfo="currentChatRoomInfo"></NoticeDialog>
         <ChatRoomDialog ref="myChatRoom" :currentChatRoomInfo="currentChatRoomInfo" :stompClient="stompClient">
         </ChatRoomDialog>
-        <chatRoomMemberDialog ref="mychatRoomMemberDialog" :currentChatRoomInfo="currentChatRoomInfo"></chatRoomMemberDialog>
+        <ChatRoomMemberDialog ref="mychatRoomMemberDialog" :currentChatRoomInfo="currentChatRoomInfo" @openSendEmailPage="openSendEmailPage"></ChatRoomMemberDialog>
+        <SendEmailDialog ref="myEmail" :fromUser="fromUser" :checkedUserList="checkedUserList"></SendEmailDialog>
     </div>
 </template>
 
@@ -104,6 +105,7 @@ import { getTime_extent } from '@/util/http_util.js';
 import NoticeDialog from '@/view/ddkz/components/noticeDialog.vue';
 import ChatRoomDialog from "@/view/ddkz/components/chatRoomDialog.vue";
 import chatRoomMemberDialog from "@/view/ddkz/components/chatRoomMemberDialog.vue";
+import sendEmailDialog from "@/view/ddkz/components/sendEmailDialog.vue";
 import textImg from '@/assets/img/ddkz/tool1.png';
 import excelImg from '@/assets/img/ddkz/tool5.png';
 import { MAIL_ADDRESS } from "@/constant/user"
@@ -124,14 +126,17 @@ export default {
             publicNoticeList: [],
             stompClient: { connected: false },
             // peopleList: [],
-            notifications: []
+            notifications: [],
+            fromUser:'',
+            checkedUserList:[]
             // status:false
         }
     },
     components: {
         NoticeDialog: NoticeDialog,
         ChatRoomDialog: ChatRoomDialog,
-        chatRoomMemberDialog: chatRoomMemberDialog
+        ChatRoomMemberDialog: chatRoomMemberDialog,
+        SendEmailDialog:sendEmailDialog
     },
     methods: {
         goBackFn() {
@@ -236,6 +241,12 @@ export default {
                 this.$refs.mychatRoomMemberDialog.showDialog();
             })
         },
+        openSendEmailPage(data){
+            this.checkedUserList = data;
+            this.$nextTick(() => {
+                this.$refs.myEmail.showDialog();
+            })
+        },
         sendEmail() {
             window.open(MAIL_ADDRESS);
         },
@@ -347,6 +358,7 @@ export default {
         // this.getCurrentTeamPeople(this.currentChatRoomInfo);
         //获取当前公告列表
         this.getRecordsByPagingFn(this.currentChatRoomInfo);
+        this.fromUser = this.userInfo.email;
     }
 }
 </script>

src/view/ddkz/components/chatRoomMemberDialog.vue

@@ -3,22 +3,34 @@
         @open="handleDialogOpen">
         <div class="info-personInfo">
             <div class="personInfo-content">
-                <div v-for="item in personList" class="everyTeam">
+                <div v-for="(item, index) in personList" class="everyTeam">
                     <div class="teamInfo">
-                        <span>队伍名称：<span>{{ item.teamName }}</span></span>
-                        <!-- <span>角色：<span>{{ item.teamType }}</span></span> -->
+                        <el-checkbox :indeterminate="item.isIndeterminate" v-model="item.checkAll"
+                            @change="handleCheckAllChange($event, index)">全选</el-checkbox><span>队伍名称：<span>{{ item.teamName
+                            }}</span></span>
                     </div>
                     <div class="peopleInfo">
-                        <div v-for="item1 in item.teamMemberStateBOList"
-                            :class="['everyPersonList', 'cardType' + item.id % 3]">
-                            <span class="isOnline" :style="{ backgroundColor: item1.online ? 'green' : 'gray' }"></span>
-                            <span class="username" :style="{ color: item1.online ? 'green' : 'white' }"
-                                v-text="item1.userId"></span>
-                            <span title="组长" :style="{ color: item1.online ? 'green' : 'white' }" :class="[item1.userId == item.leader ? 'el-icon-user-solid' : '']"></span>
-                        </div>
+                        <el-checkbox-group v-model="item.checkedMembers"
+                            @change="handleCheckedMembersChange($event, index)">
+                            <div v-for="item1 in item.teamMemberStateBOList"
+                                :class="['everyPersonList', 'cardType' + item.id % 3]">
+                                <el-checkbox :label="item1.userId" :key="item1.userId" :disabled="item1.email?false:true">
+                                    <span class="isOnline"
+                                        :style="{ backgroundColor: item1.online ? 'green' : 'gray' }"></span>
+                                    <span class="username" :style="{ color: item1.online ? 'green' : 'white' }"
+                                        v-text="item1.userId"></span>
+                                    <span title="组长" :style="{ color: item1.online ? 'green' : 'white' }"
+                                        :class="[item1.userId == item.leader ? 'el-icon-user-solid' : '']"></span>
+                                </el-checkbox>
+                            </div>
+                        </el-checkbox-group>
+
                     </div>
                 </div>
             </div>
+            <div class="personInfo-footer">
+                <el-button type="success" size="small" @click="sendEmail">发送邮件</el-button>
+            </div>
         </div>
     </el-dialog>
 </template>
@@ -32,7 +44,8 @@ export default {
         return {
             dialogVisible: false,
             personList: [],
-            chatRoomInfo: {}
+            chatRoomInfo: {},
+            checkedPersonList:[]
         }
     },
     directives: {
@@ -55,20 +68,42 @@ export default {
         getCurrentTeamPeople(chatRoomId) {
             //查询聊天组的人员
             getChatRoomMemberInfo(chatRoomId).then(res => {
+                res.forEach(item => {
+                    item['checkAll'] = false;
+                    item['isIndeterminate'] = false;
+                    item['checkedMembers'] = [];
+
+                })
                 this.personList = res;
             }).catch(error => {
                 this.$message.error(error);
             });
         },
+        handleCheckAllChange(val, index) {
+            let tmp = [];
+            this.personList[index].teamMemberStateBOList.forEach(item=>{
+                tmp.push(item.userId);
+            });
+            this.personList[index].checkedMembers = val ? tmp : [];
+            this.personList[index].isIndeterminate = false;
+        },
+        handleCheckedMembersChange(value, index) {
+            let checkedCount = value.length;
+            this.personList[index].checkAll = checkedCount === this.personList[index].teamMemberStateBOList.length;
+            this.personList[index].isIndeterminate = checkedCount > 0 && checkedCount < this.personList[index].teamMemberStateBOList.length;
+        },
+        //发送邮件
+        sendEmail(){
+            this.checkedPersonList = [];
+            this.personList.forEach(item=>{
+                item.checkedMembers.forEach(item1=>{
+                    this.checkedPersonList.push(item.teamMemberStateBOList.filter(item2=>{return item2.userId==item1})[0].email);
+                })
+            });
+            this.$emit('openSendEmailPage',this.checkedPersonList);
+        }
     },
     computed: {
-        // userInfo() {
-        //     if (this.$store.getters.userInfo) {
-        //         return this.$store.getters.userInfo;
-        //     } else {
-        //         return { account: "" };
-        //     }
-        // },
         title() {
             return this.chatRoomInfo.nickname + " 成员信息";
         }
@@ -80,7 +115,7 @@ export default {
 <style lang="scss">
 .info-personInfo {
     width: 100%;
-    height: 30%;
+    height: 40%;
     overflow-y: auto;
 
     .title {
@@ -103,7 +138,7 @@ export default {
 
     .personInfo-content {
         width: 100%;
-        height: 100%;
+        height: calc(100% - 50px);
 
         .everyTeam {
             width: calc(33% - 10px);
@@ -193,5 +228,10 @@ export default {
             }
         }
     }
+    .personInfo-footer{
+        width: 100%;
+        height: 50px;
+        text-align: right;
+    }
 }
 </style>
\ No newline at end of file