<!--
  @description:查看消息记录弹框
  @Modifier:肖文龙
  @date:2020/12/10
-->
<template>
  <div>
    <el-dialog
      v-dialogDrag
      :visible.sync="dialog"
      :close-on-click-modal="false"
      title="查看消息记录"
      width="600px"
      custom-class="el-dialog__body-p0"
    >
      <div class="main mb10">
        <table class="tableData">
          <tr>
            <td>
              标题
            </td>
            <td>
              {{ fromData.title }}
            </td>
          </tr>
          <tr>
            <td>
              发送人
            </td>
            <td>
              {{ filterDictText(mailSourceTypeList, fromData.mailType) }}
            </td>
          </tr>
          <tr>
            <td>
              发送时间
            </td>
            <td>
              {{ fromData.createTime&&$Moment(fromData.createTime).format(momentSaveFormat) }}
            </td>
          </tr>
          <tr>
            <td>
              内容
            </td>
            <td>
              {{ fromData.mailContent }}
            </td>
          </tr>
        </table>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialog = false">关 闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
/* api接口 */
import { getMailToastInfoById } from '@api/common/desk'
/* 公共方法 */
import { filterDictText } from '@/assets/js/utils'
import { userMessageGrounpMixin } from './mixins/userMessageGrounpMixin' // 公共方法
export default {
  name: 'UserMessageDialog',
  mixins: [userMessageGrounpMixin],
  data() {
    return {
      dialog: false,
      // 消息内容数据
      fromData: {
        title: '', // 消息标题
        mailType: '', // 消息发送人
        createTime: '', // 发送时间
        mailContent: '' // 消息发送内容
      }
    }
  },
  methods: {
    filterDictText,
    // 获取消息详情
    open(id) {
      this.dialog = true
      getMailToastInfoById(id).then((res) => {
        const { mailToastInfo } = res.data
        this.fromData = mailToastInfo
      })
    }
  }
}
</script>

<style scoped lang="less">
</style>
