<template>
  <div class="main">
    <div class="pageTitle">{{ detailObj.NOTICEINFO_TITLE || "" }}</div>
    <div class="time">{{ detailObj.START_DATE || "-" }}</div>
    <div
      class="navList"
      v-if="detailObj.ImageList && detailObj.ImageList.length > 0"
    >
      <image
        class="img"
        :src="detailObj.ImageList[0].ImageUrl"
        @click="handleShowPreview(detailObj.ImageList[0].ImageUrl)"
      />
    </div>
    <text class="content">{{ detailObj.NOTICEINFO_CONTENT || "" }}</text>
  </div>
</template>
<script>
export default {
  data() {
    return {
      detailObj: {
        NOTICEINFO_TITLE: "",
        START_DATE: "",
        NOTICEINFO_CONTENT: "",
      },
    };
  },
  onLoad(query) {
    console.log("query", query);
    if (query.id) {
      this.hanldeGetDetail(query.id);
    }
  },
  methods: {
    // 预览查看
    handleShowPreview(url) {
      uni.previewImage({
        current: url, // 当前显示图片的http链接
        urls: [url], // 需要预览的图片http链接列表
      });
    },
    async hanldeGetDetail(id) {
      const req = {
        NOTICEINFOId: id,
      };
      const data = await this.$api.$get(
        "/EShangApiMain/Notice/GetNOTICEINFODetail",
        req
      );
      console.log("detail", data);
      const formattedText =
        data.Result_Data.NOTICEINFO_CONTENT.split("\n").join("\n\n");
      this.detailObj = data.Result_Data;
      this.detailObj.NOTICEINFO_CONTENT = formattedText;
    },
  },
};
</script>

<style scoped lang="less">
.main {
  width: 100vw;
  height: 100vh;
  box-sizing: border-box;
  padding: 16rpx 32rpx;
  background: #fff;
  overflow-y: scroll;

  .pageTitle {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 40rpx;
    color: #130f05;
    line-height: 56rpx;
    text-align: left;
    font-style: normal;
  }

  .time {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 24rpx;
    color: #716f69;
    line-height: 36rpx;
    text-align: left;
    font-style: normal;
    margin-top: 8rpx;
  }

  .navList {
    width: 100%;
    height: 100%;
    border-radius: 6rpx;
    overflow: hidden;
    margin: 40rpx 0;

    .img {
      width: 100%;
      height: 100%;
    }
  }

  .content {
    display: block;
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 30rpx;
    color: #130f05;
    line-height: 52rpx;
    text-align: justify;
    font-style: normal;
    overflow-y: auto;
  }
}
.main::-webkit-scrollbar {
  display: none;
}
</style>
