<template>
  <view>
    <custom-nav-bar position="fixed" color="black" left-text="" left-arrow />

    <view class="dateil">
      <view class="title multi-line">{{detailObj.activityTitle}}</view>
      <view class="flex flex-v-center">
        <view class="nickName">发布人：{{detailObj.userName}}</view>
        <view class="time">{{getDateTime(detailObj.createTime,1)}}</view>
      </view>

      <view class="line"></view>
      <mp-html class="rich-text" :content="detailObj.activityContent" />
    </view>
  </view>
</template>

<script>
  import * as peopleApi from '@/api/peopleApi';
  import * as publicApi from '@/api/publicApi';
  import utils from '@/utils/util.map'
  export default {
    data() {
      return {
        options: {},
        detailObj: {},
      }
    },
    onLoad(options) {
      this.options = options;
      this.activityDetail();
    },
    methods: {
      getDateTime(time) {
        return utils.getDateTime(time, 1)
      },
      async activityDetail() {
        const that = this;
        const res = await peopleApi.activityDetailApi({
          id: this.options.id,
        });

        if (res.data) {
          that.detailObj = res.data
        }
      }
    }
  }
</script>

<style lang="less" scoped>
  .dateil {
    padding: 10rpx 40rpx;

    .title {
      font-size: 34rpx;
      font-weight: 500;
      color: #333333;
    }

    .nickName {
      font-size: 24rpx;
      font-weight: 400;
      color: #FF7F34;
      margin-top: 32rpx;
      margin-right: 32rpx;
    }

    .time {
      font-size: 24rpx;
      font-weight: 400;
      color: #999999;
      margin-top: 32rpx;
    }

    .line {
      margin: 40rpx 0 32rpx 0;
      height: 1px;
      background: #EFEFEF;
    }

    .rich-text {
      line-height: 54rpx;
    }
  }
</style>