<!--聊天记录显示模块-->
<template>
<div>
<!--  顶部菜单-->
  <span>
    <el-button type="primary" @click="receiverid=did">医生消息</el-button>
    <el-button type="success" @click="receiverid=comid">社区消息</el-button>
    <el-button type="warning" @click="receiverid=sysid">系统消息</el-button>
  </span>
<!--  用表格显示消息-->
  <el-table :data="WordsList" height="450" style="width: 100%" :show-header=false >
    <el-table-column prop="userA" label="Date" width="100" style="padding-left: 0px"/>
    <el-table-column prop="messageA" label="content" align="left"/>
    <el-table-column prop="messageB" label="content" align="right"/>
    <el-table-column prop="userB" label="Address" style="padding-right: 0px" width="100"/>
  </el-table>
  <el-input v-model="aMessage" placeholder="Please input" clearable :rows="3" type="textarea"/>
  <el-button type="primary" @click="sendMessage">发送</el-button>
</div>
</template>

<script>
import request from "@/utils/request";
import { ref } from 'vue'
export default {
  name: "systemMessage",
  created() {
    // 轮询的方式获取消息
    this.$nextTick(() => {
      setInterval(this.getData, 1000);
    });
    // 每次进入都重新更新个人信息防止全局信息在其他地方修改
    this.did=this.$store.getters.doctor;
    this.username=this.$store.getters.username;
    this.dname=this.$store.getters.doctorname;
  },
  methods:{
    // 信息发送
    sendMessage(){
          request.get("/sendMessage",{params:{senderid:this.userid,receiverid:this.receiverid,message:this.aMessage}});
          this.aMessage="";
        },
    // 聊天记录获取
    getData(){
      request.get("/getMessage",{params:{userid1:this.userid,userid2:this.receiverid}}).then(res=>{
        if(res){
          this.WordsList=[];
          switch (this.receiverid){
            case this.did:
              for(var i=0;i<res.length;i++){
                if(res[i].senderid==this.userid){
                  this.WordsList.push({userA: this.username+':',messageA: res[i].message});
                }else {
                  this.WordsList.push({userB: this.dname,messageB: res[i].message});
                }
              }
              break;
            case this.sysid:
              for(var i=0;i<res.length;i++){
                if(res[i].senderid==this.userid){
                  this.WordsList.push({userA: this.username+':',messageA: res[i].message});
                }else {
                  this.WordsList.push({userB: ':系统',messageB: res[i].message});
                }
              }
              break;
            case this.comid:
              for(var i=0;i<res.length;i++){
                if(res[i].senderid==this.userid){
                  this.WordsList.push({userA: this.username+':',messageA: res[i].message});
                }else {
                  this.WordsList.push({userB: ':社区工作者',messageB: res[i].message});
                }
              }
              break;
            default:
              this.WordsList=[];
              break;
          }
        }
      })
        }
  },
  data(){
    return{
      // 用于查找消息记录的基本信息
      did:"",
      dname:"",
      sysid:"111111111111111111",
      comid:"",
      username:this.$store.getters.username,
      // 选择特定的消息后将对应id赋值给receiverid
      userid:this.$store.getters.userid,
      receiverid:"",
      //消息显示
      aMessage: ref(''),
      WordsList:[],

    }
  }
}
</script>

<style scoped>

</style>