From 15fccc0a1fedf1244516b108a4dc8a8acdfa3c7c Mon Sep 17 00:00:00 2001 From: odc.xiaohui <xiaohui@Q1> Date: 星期五, 14 四月 2023 17:14:02 +0800 Subject: [PATCH] 修改警方公告 --- src/views/cause/Group.vue | 452 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 447 insertions(+), 5 deletions(-) diff --git a/src/views/cause/Group.vue b/src/views/cause/Group.vue index 9e95289..8251778 100644 --- a/src/views/cause/Group.vue +++ b/src/views/cause/Group.vue @@ -1,15 +1,457 @@ <template> - <div> - 缇ょ粍浜ゆ祦 + <div class="groupCommunication"> + <div class="group-left"> + <el-input v-model="filterText" suffix-icon="el-icon-search" class="inputleft" placeholder="璇疯緭鍏�"> + <!-- <el-button slot="append" icon="el-icon-search" style="width:10px;" @click="pick"></el-button> --> + </el-input> + <el-tree ref="tree" :data="treeData" :filter-node-method="filterNode" :props="treeProps" + @node-click="handleNodeClick"></el-tree> + </div> + <div class="group-right"> + <div class="group-right-name"> + {{ this.groupName }} + </div> + <div class="group-right-box"> + <div class="group-right-left-seach"> + <div class="group-right-left-seach-body"> + <el-select v-model="queryInfo.status" placeholder="璇烽�夋嫨"> + <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> + </el-option> + </el-select> + <el-input style="margin-left: 5px" v-model="queryInfo.select" placeholder="璇疯緭鍏ユ垚鍛樻垨鍐呭"></el-input> + <el-button style="margin-left: 5px" type="primary" @click="search">鎼滅储</el-button> + </div> + <div class="group-right-left-seach-body-box"> + <ul style="overflow:auto;height: 558px" class="group-right-left-seach-body-box-ul"> + <li v-for="messageOne in messageList" class="group-right-left-seach-body-box-li" > + <div class="group-right-left-seach-body-box-imgmessage"> + <img class="group-img" v-if="messageOne.pic != null && messageOne.pic != ''" :src="messageOne.pic" + > + <img class="group-img" v-if="messageOne.pic == null || messageOne.pic == ''" + src="../../icons/7bedbaa41b1744fbfe0c55b507fd9e28.png"> + <div style="margin-left: 10px">{{ messageOne.userName }} {{ messageOne.ctime }}</div> + </div> + <div class="group-right-left-seach-body-box-text">{{ messageOne.text }}</div> + </li> + </ul> + </div> + <div class="group-right-left-seach-body-box-reply"> + <span style="margin-left: 15px">娑堟伅鍥炲</span> + <el-input v-model="field103" :autosize="{ minRows: 4, maxRows: 8 }" :style="{ width: '100%' }" + placeholder="璇疯緭鍏ュ洖澶嶄俊鎭�" type="textarea"> + + </el-input> + <div style="text-align: right"> + <el-button :disabled="sendBtn" style="text-align: right" size="mini" type="primary" @click="seedMessage">鍙戦��</el-button> + </div> + </div> + </div> + <div class="group-right-box-ul"> + <ul class="group-right-box-ul-title" style="padding: 0 10px"> + <div> + 缇ゅ叕鍛� + </div> + <li v-for="(item,index) in groupAnList" :key="index"> + 缇ゅ叕鍛婏細 {{item.text}} + </li> + </ul> + </div> + + <div class="group-right-box-ul"> + <ul class="group-right-box-ul-title" style="margin: 0"> + <div style="display: flex;justify-content: space-between;align-items: center;border-bottom: 1px solid #ccc;padding: 0 10px"> + <span>缇ゆ垚鍛�</span> + <el-button style="color: #0086b3;margin-right: 10px" icon="el-icon-turn-off-microphone" type="text" @click="allBanSpeech">鍏ㄤ綋绂佽█</el-button> + </div> + <li v-for="(item,index) in tableData" :key="index" style="padding: 0 10px"> + {{item.userName}} + <el-button v-if="item.banSpeech==0" style="color: red" type="text" @click="speech(item.userId, item.banSpeech, item.groupId)" >绂佽█</el-button> + <el-button v-if="item.banSpeech==1" style="color: green" type="text" @click="speech(item.userId, item.banSpeech, item.groupId)">鍏佽鍙戣█</el-button> + </li> + </ul> + </div> + </div> + + </div> </div> </template> <script> +import { + getName, + getAllMessage, + getAllNotice, + getAllUser, + setBanSpeech, + setAllowSpeech, + setBanSpeechAll, + getGroupMessage, + getGroupMessageContext, + seed, + //saveSubject +} from '@/api/group' +import {Message} from 'element-ui'; +import {getImgUrl} from '@/api/common' + export default { - name: "Group" + name: "Group", + watch: { + filterText(val) { + this.$refs.tree.filter(val); + } + }, + data() { + return { + count: 0, + sendBtn:true, + options: [ + { + value: '0', + label: '鎴愬憳' + }, + { + value: '1', + label: '璁板綍' + } + ], + groupName: '缇ょ粍', + filterText: '', + //缇d + groupId: null, + //娑堟伅鍒楄〃 + messageList: [], + //缇ゅ叕鍛婂垪琛� + groupAnList: [], + treeData: [{ + groupName: '闈掔緤鍖哄叕瀹夊垎灞�缁忎睛澶ч槦', + children: [] + }], + treeProps: { + children: 'children', + label: 'groupName' + }, + field103: '', + queryInfo: {}, + input: '', + //缇ゆ垚鍛樺垪琛� + tableData: [], + } + }, + created() { + this.init(); + }, + methods: { + load() { + + this.count += 2 + }, + + //缇ょ粍鍚嶇О + init() { + getName().then( + res => { + this.treeData[0].children = res; + } + ) + var params = window.location.href.split("id=") + if (params.length != 1) { + var param = {id: params[1]} + this.handleNodeClick(param) + + } + }, + filterNode(value, data) { + if (!value) return true; + return data.groupName.indexOf(value) !== -1; + }, + // pick(){ + // this.filterNode(this.filterVal,this.data); + // }, + handleNodeClick(data) { + if (data.id != null) { + this.groupName = data.groupName; + var _this = this; + getAllMessage(data.id).then((res) => { + + for (let item of res) { + if (item.pic === '' || item.pic === null) { + } else { + getImgUrl(item.pic).then(res => { + item.pic = res + }) + } + } + this.messageList = res + + this.sendBtn=false + }) + getAllNotice(data.id).then(res => this.groupAnList = res) + getAllUser(data.id).then(res => this.tableData = res) + this.groupId = data.id; + } + }, + search() { + if (this.queryInfo.status == 0) { + getGroupMessage(this.queryInfo, this.groupId).then(res => this.messageList = res) + } + if (this.queryInfo.status == 1) { + getGroupMessageContext(this.queryInfo, this.groupId).then(res => this.messageList = res) + } + }, + allBanSpeech() { + setBanSpeechAll(this.groupId).then( + res => { + this.$message({ + message: '绂佽█鎴愬姛', + type: 'success' + }); + getAllUser(this.groupId).then(res => this.tableData = res) + } + ) + }, + speech(val, val2, val3) { + if (val2 == 0) { + setBanSpeech(val, val3).then( + res => { + this.$message({ + message: '绂佽█鎴愬姛', + type: 'success' + }); + getAllUser(val3).then(res => this.tableData = res) + } + ) + + } + if (val2 == 1) { + setAllowSpeech(val, val3).then( + res => { + this.$message({ + message: '鍏佽鍙戣█', + type: 'success' + }); + getAllUser(val3).then(res => this.tableData = res) + } + ) + } + }, + seedMessage() { + seed(this.field103, this.groupId).then(async res => { + this.$message({ + message: '鍥炲鎴愬姛', + type: 'success' + }); + await getAllMessage(this.groupId).then(res => { + res.map(item=>{ + if (item.pic === '' || item.pic === null){ + + }else { + item.pic='/minio/img/'+item.pic + } + + }) + this.messageList = res + // console.log(res) + }) + + // for (let item of this.messageList) { + // if (item.pic === '' || item.pic === null) { + // } else { + // getImgUrl(item.pic).then(res => { + // item.pic = res + // }) + // } + // } + + this.field103 = ''; + } + ) + }, + }, + } </script> -<style scoped> +<style lang="scss" scoped> +* { + list-style: none; +} +.groupCommunication{ + display: flex; + height: 100%; + background-color: #fff; + .group-left{ + width: 300px; + .inputleft{ + margin-top: 10px; + margin-left: 5px; + } + } + .group-right{ + margin-left: 10px; + border-left: 1px solid #ccc; + padding-left: 10px; + background-color: #fff; + //flex-grow: 1; + .group-right-name{ + margin-bottom: 10px; + font-size: 16px; + font-weight: 900; + margin-top: 10px; + } + .group-right-box{ + display: flex; + .group-right-left-seach{ + width: 420px; + .group-right-left-seach-body{ + display: flex; -</style> \ No newline at end of file + } + .group-right-left-seach-body-box{ + .group-right-left-seach-body-box-ul{ + .group-right-left-seach-body-box-li{ + margin-top: 15px; + .group-right-left-seach-body-box-imgmessage{ + display: flex; + color: #ccc; + .group-img{ + width: 25px; + height: 25px; + border-radius: 100px; + + } + } + .group-right-left-seach-body-box-text{ + margin-left: 35px; + } + } + } + + } + .group-right-left-seach-body-box-reply{ + padding: 10px; + border: 1px solid #ccc; + ::v-deep .el-textarea__inner{ + border: none; + resize: none; + } + } + + } + .group-right-box-ul{ + border: 1px solid #ccc; + margin-left: 15px; + width: 420px; + overflow: auto; + .group-right-box-ul-title{ + padding: 0; + } + .group-right-box-ul-title>li{ + margin-top: 10px; + } + } + } + } +} +.container { + width: 34%; +} + +.container1 { + width: 98%; + height: 60%; + margin-top: 8%; + margin-left: 2%; +} + +.container2 { + width: 100%; + height: 30%; + margin-top: 2%; + margin-left: 2%; +} + +.msglist { + margin-bottom: 3%; +} + +.face { + float: left; + width: 25px; + height: 25px; + border-radius: 50%; +} + +.name { + float: right; + margin-right: 43%; + color: #7F7F7F; + font-size: 14px; +} + +.message { + margin-top: 2%; +} + +.mian1 { + margin-top: 20px; +} + +.mian4 { + margin-top: 0px; + width: 24%; +} + +.mian2 { + width: 38%; + margin-top: 0px; + margin-right: 2%; +} + +.table1 { + width: 360px; + margin-top: 0px; + margin-right: 2%; +} + +.table2 { + margin-top: 0px; +} + +.select { + width: 25%; +} + +.table >>> .el-table__row > td { + /* 鍘婚櫎琛ㄦ牸绾� */ + border: none; +} + +.table1 >>> .el-table__row > td { + /* 鍘婚櫎琛ㄦ牸绾� */ + border: none; +} + +.table2 >>> .el-table__row > td { + /* 鍘婚櫎琛ㄦ牸绾� */ + border: none; +} + +.mian5 { + margin-top: 0px; + width: 100%; + height: 30%; +} + +.input { + width: 49%; +} + +.button { + margin-right: 50px; + size: small; +} + +::v-deep(.el-table thead) { + color: #000000; +} +</style> -- Gitblit v1.8.0