Merge branch 'main' of http://39.101.199.1:8888/gongjiale/gangkou

# Conflicts:
#	RuoYi-Vue-Oracle/src/main/resources/application-druid.yml
#	RuoYi-Vue-Oracle/src/main/resources/application.yml

ruoyi-ui/src/views/system/sendmsg/index.vue

@@ -0,0 +1,239 @@
+<template>
+  <div>
+  <el-tabs type="border-card" v-model="activeTab" @tab-click="getListData">
+    <el-tab-pane v-for="item in choseList " :label="item">
+
+      <div class="main-box" v-if="dataList.length>0">
+        <div class="main" v-for="item in dataList" >
+          <div class="left" @click="read(item)" >
+            <div :class="item.isRead === '0' ? 'not-read' : 'readed'"></div>
+            {{ item.sendText }}
+          </div>
+          <div style="display: inline-flex;">
+            <div class="right">{{ '发送时间：' + item.sendTime }}</div>
+            <div class="right" style="margin-left: 10px;">{{ '发送人：' + item.sender }}</div>
+          </div>
+        </div>
+        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+          @pagination="getList" />
+      </div>
+      <div v-else class="content">  <img class="img" src="@/assets/home/not-data.png" ></div>
+    </el-tab-pane>
+  </el-tabs>
+  <el-dialog
+  title="查看消息详情"
+  :visible.sync="isShowMsg"
+  width="50%"
+  :before-close="handleClose">
+  <div class="title">消息时间轴 </div>
+  <el-timeline>
+    <el-timeline-item v-for="item in infoList" :timestamp="item.sendTime" placement="top"  >
+      <el-card >
+        <h4>{{item.infoType}}{{item.sendText}}</h4>
+        <p>{{item.sender}} 提交于 {{item.sendTime}}</p>
+      </el-card>
+    </el-timeline-item>
+  </el-timeline>
+  <div class="title">添加回复 </div>
+  <div style="margin:10px">
+            <el-input type="textarea" :rows="2" placeholder="请输入回复内容..." v-model="shareContent">
+            </el-input>
+        </div>
+        <div> <el-button class="agreeButton" @click="sendMsg">发送</el-button></div>
+  <!-- <span slot="footer" class="dialog-footer">
+    <el-button @click="handleClose">取 消</el-button>
+    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+  </span> -->
+</el-dialog>
+</div>
+</template>
+  
+<script>
+
+import { listMsg, readMsg,getMsgDetail } from "@/api/home";
+import {  sendMessage} from "@/api/home";
+export default {
+  name: "SendMsg",
+  data() {
+    return {
+      shareContent:'',
+      repayUser:{},
+      infoList:[],
+      isShowMsg:false,
+      activeTab: '0',
+      choseList: ['未读消息', '已读消息', '全部消息'],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        isRead: '0',
+      },
+      total: 4,
+      dataList: []
+    }
+  },
+  mounted() {
+    this.getList();
+  },
+  methods: {
+    getListData() {
+      if (this.activeTab == 0) {//未读
+        this.queryParams.isRead = '0'
+      } else if (this.activeTab == 1) {//已读
+        this.queryParams.isRead = '1'
+      } else {
+        this.queryParams.isRead = ''
+      }
+      this.getList();
+    },
+    /** 查询消息列表 */
+    getList() {
+      this.loading = true;
+      listMsg(this.queryParams).then(response => {
+        this.dataList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    //消息已读
+    read(item){
+      this.isShowMsg=true;
+      this.repayUser=item
+      getMsgDetail(item.id).then(response => {
+        if(response.code !=500){
+        this.infoList=response.data
+        }
+      });
+    },
+    sendMsg(){
+      let readList=[]
+      readList.push(this.repayUser.sender)
+      let params={
+                readerList: readList,
+                sendText:this.shareContent,
+                parentId:this.infoList[0].id
+            }
+            sendMessage(params).then(response => {
+              if(response.code==200){
+                this.$message.success("消息回复成功！")
+              }else{
+                this.$message.error("消息回复失败！")
+              }
+            });
+         
+    },
+  
+    //关闭
+    handleClose(){
+      this.isShowMsg=false
+    readMsg(this.repayUser.id).then(response => {
+        if(response.code !=500){
+        //  this.$Message.info("消息已读")
+         this.getList()
+   
+        }
+      });
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+.agreeButton {
+    display: inline-block;
+    line-height: 8px;
+    width: 80px;
+    height: 32px;
+    white-space: nowrap;
+    cursor: pointer;
+    color: #ffffff;
+    -webkit-appearance: none;
+    text-align: center;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    outline: 0;
+    margin-left: 10px;
+    -webkit-transition: .1s;
+    transition: .1s;
+    font-weight: 500;
+    //padding: 12px 20px;
+    font-size: 14px;
+    border-radius: 4px;
+    background-color: #068f5c;
+}
+
+.agreeButton:hover {
+    background: #65a5f9;
+    border-color: #65a5f9;
+    color: #FFF;
+}
+.title {
+    padding-left: 20px;
+    color: #212121;
+    font-size: 16px;
+    margin-bottom: 10px;
+    margin-top: 10px;
+    background: url("~@/assets/ucs/biaoti.png") no-repeat;
+    background-position-y: 7px;
+}
+ .content{
+  height: 800px;
+    position: relative;
+  }
+    .img{
+       position: absolute;
+       top:50%;
+       left:50%;
+       transform:translate(-50%,-50%); 
+    }
+.main-box {
+  width: 100%;
+  background: #fff;
+  height: 800px;
+
+  .main {
+    background: #fff;
+    margin: 0 5px;
+    // min-height: 80px;
+    // overflow-y: scroll;
+    border-top: 1px solid #dddee1;
+
+    .readed {
+      width: 10px;
+      height: 10px;
+      border-radius: 5px;
+      display: inline-flex;
+      background: green;
+    }
+
+    .not-read {
+      display: inline-flex;
+      width: 10px;
+      height: 10px;
+      border-radius: 5px;
+      background: red;
+    }
+
+    .left {
+      margin-top: 5px;
+      width: 90%;
+      max-height: 43px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      display: -webkit-box;
+      -webkit-line-clamp: 2;
+      -webkit-box-orient: vertical;
+      word-break: break-all;
+      cursor: pointer;
+    }
+    .left:hover{
+      color:#068f5c;
+      text-decoration: underline;
+    }
+    .right {
+      margin-top: 5px;
+
+      height: 30px;
+    }
+
+  }
+}
+</style>