<template>
  <view>
    <scroll-view scroll-y class="info_mainer">
      <view class="wrap">
        <view class="title">
          {{ SYNOPSIS }}
        </view>
        <view class="text">
          <text>提醒时间:</text>
          {{ CREATTIME }}
        </view>
        <view class="text">
          <text>提醒人:</text>
          {{ CREATOR }}
        </view>
        <view class="text">
          <text>提醒内容:</text>
          <text v-html="CONTENT"></text>
        </view>
      </view>
      <view class="cu-tabbar-height"></view>
    </scroll-view>
  </view>
</template>
<script>
import { fnGetMessageRead } from "../../api";

export default {
  data() {
    return {
      SYNOPSIS: "",
      CREATTIME: "",
      CONTENT: "",
      CREATOR: "",
    };
  },
  onLoad(query) {
    this.SYNOPSIS = query.SYNOPSIS;
    this.CREATTIME = query.CREATTIME;
    this.CONTENT = query.CONTENT;
    this.CREATOR = query.CREATOR;
    this.fnGetMessageReply(query.MESSAGE_ID);
  },
  methods: {
    async fnGetMessageReply(MESSAGE_ID) {
      await fnGetMessageRead({ MESSAGE_ID, ISREPLY: "1" });
    },
  },
};
</script>

<style scoped lang="scss">
.container {
  width: 100%;
  height: calc(100vh - 95px);
  background: #ffffff;

  .title {
    font-size: 32upx;
    text-align: center;
    border-bottom: 1px solid #eeeeee;
    padding: 20upx 0;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .main {
    padding: 20upx;
    line-height: 2;

    .p {
      text-indent: 2rem;
    }
  }
}
.wrap {
  padding: 20upx;
  line-height: 2;
  .text text {
    &:first-child {
      margin-right: 20upx;
    }
  }
}
</style>
