
<template>
  <div class="box-drawer">
    <div>
      <div style="display: inline-block">
        <h4>{{ messageDetailInfo.title }}</h4>
      </div>
      <div style="float: right; margin-top: 20px; padding-right: 30px">
        <el-button
          type="primary"
          plain
          size="mini"
          icon="el-icon-arrow-left"
          @click="goBack"
          >返回</el-button
        >
        <el-button
          type="primary"
          plain
          size="mini"
          v-if="ispaas==1"
          @click="redeposit"
          >转存为系统公告</el-button
        >
        <el-button
          type="primary"
          plain
          size="mini"
          icon="el-icon-delete"
          @click="delRead"
          >删除</el-button
        >
      </div>
    </div>
    <div class="button-text">
      <i class="el-icon-message-solid" style="color: #fbaf2d"></i>
      <span class="left-text"
        >消息类型：{{
          messageDetailInfo.type == 1 ? "系统公告" : "活动公告"
        }}</span
      >
      <span class="right-text"
        >发布时间：{{ formatter(messageDetailInfo.add_time) }}</span
      >
    </div>
    <div class="Info-text" v-html="messageDetailInfo.content"></div>
  </div>
</template>
<script>
import { delIsRead, GetMessageDetail, Forward,GetIsPaas } from "@/api/msgtemplate";
import { dateFormat } from '@/utils'
export default {
  name: "messageDetail",
  props: ["messageDetailIds"],
  data() {
    return {
      messageDetailInfo: {},
      ispaas: 0,
    };
  },
  created() {
    this.getMessageInfos();
    this.getIsPaas();
  },
  methods: {
    //获取详情信息
    getMessageInfos() {
      let data = {
        id: this.messageDetailIds,
      };
      GetMessageDetail(data).then((res) => {
        if (res.code == 1) {
          this.messageDetailInfo = res.data;
        }
      });
    },
    //删除单个
    delRead() {
      let data = {
        id: this.messageDetailIds,
      };
      delIsRead(data).then((res) => {
        if (res.code == 1) {
          this.$message({ message: "删除成功", type: "success" });
          this.$emit("closeOrderDetailDialog");
        }
      });
    },
    //返回
    goBack() {
      this.$emit("closeOrderDetailDialog");
    },
    redeposit() {
      let data = {
        id: this.messageDetailIds,
      };
      Forward(data).then((res) => {
        if (res.code == 1) {
          this.$message({ message: "转存成功", type: "success" });
          this.$emit("closeOrderDetailDialog");
        }
      });
    },
    getIsPaas() {
      GetIsPaas().then((res) => {
        if (res.code == 1) {
          this.ispaas = res.data.ispaas;
        }
      });
    },
    //日期转换
     /** 时间格式化 */
     formatter(time) {
        return dateFormat(time * 1000, 'Y-m-d H:i:s')
      },
  },
};
</script>
<style scoped>
.Info-text {
  width: 100%;
  height: 470px;
  /* border: 1px solid black; */
  overflow: auto;
}
.box-drawer {
  /* border: 1px solid black; */
  width: 96%;
  margin: 0 auto;
}
.button-text {
  line-height: 48px;
  width: 100%;
  height: 48px;
  background: #f8f8f8;
  padding-left: 15px;
}
.left-text {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #666666;
}
.right-text {
  font-size: 14px;
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #999999;
  float: right;
  padding-right: 20px;
}
</style>