<!--
  @description:供应商-查看下次记录弹框
  @Modifier:gmy
  @date:2020/8/12-16:00
-->
<template>
  <div>
    <el-dialog
      v-dialogDrag
      :visible.sync="dialogData.dialog"
      :close-on-click-modal="false"
      title="查看消息记录"
      width="896px"
      custom-class="el-dialog__body-p0"
    >
      <div class="p8">
        <table class="tableData">
          <tr>
            <td>
              标题
            </td>
            <td colspan="3">
              {{ messageContent.title }}
            </td>
          </tr>
          <tr>
            <td>
              发送人
            </td>
            <td>
              {{ filterDictText(mailSourceTypeList, messageContent.mailSourceType) }}
            </td>
            <td>
              发送时间
            </td>
            <td>
              {{ $Moment(messageContent.createTime).format(momentSaveFormat) }}
            </td>
          </tr>
          <tr>
            <td>
              内容
            </td>
            <td colspan="3">
              <!-- {{ messageContent.mailContent }} -->
              <p v-html="preText(messageContent.mailContent)" />
            </td>
          </tr>
        </table>
      </div>
    </el-dialog>
  </div>
</template>

<script>
/* api接口 */
import { getMailToastInfoById } from '@/api/procurement/commonDesk'
/* 公共方法 */
import {
  filterDictText
} from '@/assets/js/utils'
import { procurementUserMessageGrounpMixins } from './mixins/procurementUserMessageGrounpMixins' // 公共方法
export default {
  name: 'ConsignContractSelectDialog',
  mixins: [procurementUserMessageGrounpMixins],
  props: {
    // 弹框展示状态
    dialogData: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      // 消息内容数据
      messageContent: {
        title: '', // 消息标题
        mailType: '', // 消息发送人
        createTime: '', // 发送时间
        mailContent: '', // 消息发送内容
        mailSourceType: ''
      }
    }
  },
  watch: {
    // 监听-弹框展示状态
    'dialogData.dialog'(val) {
      if (val) {
        // 弹框已打开
        // 加载数据
        this.getMailToastInfoByIdData(this.dialogData.messageId)
      }
    }
  },
  methods: {
    filterDictText,
    // 获取消息详情
    getMailToastInfoByIdData(id) {
      getMailToastInfoById(id).then(res => {
        const { mailToastInfo } = res.data
        this.messageContent = mailToastInfo
        // this.messageContent.mailContent = '采购单名称：名称\r\n采购单编号：P-XJ-20-00000086'
      }).catch(() => {

      })
    },
    // 将文本域的文本进行处理让文本保存换行空格形式，传递给后端
    preText(pretext) {
      if (pretext) {
        return pretext.replace('\r\n', '<br />')
      }
    }
  }
}
</script>

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