<template>
  <!-- 录入心得后弹窗 -->
  <div>
    <div class="comment_dialog exped_dialog clearfix">
      <el-dialog
        title="活动心得"
        :visible="expedVisible"
        :close-on-click-modal="false"
        @update:visible="v=>$emit('update:expedVisible',v)"
      >
        <div class="comment_content clearfix">
          <div class="comment_single clearfix">
            <div class="active_title">活动举办者：</div>
            <div class="active_content">{{activeList.school_name}}</div>
          </div>
          <div class="comment_single clearfix">
            <div class="active_title">活动时间：</div>
            <div class="active_content">{{activeList.starttime|date}} - {{activeList.endtime|date}}</div>
          </div>
          <div class="comment_single clearfix">
            <div class="active_title">活动地点：</div>
            <div class="active_content">{{activeList.address}}</div>
          </div>
          <div class="comment_single clearfix">
            <div class="active_title">活动介绍：</div>
            <div class="active_content active_color active_three">{{activeList.description}}</div>
          </div>
          <div class="comment_single clearfix exped_top">
            <div class="active_title">活动内容：</div>
            <div class="active_content active_color">{{activeList.content}}</div>
          </div>
          <div class="comment_single clearfix exped_top">
            <div class="active_title">备注：</div>
            <div class="active_content active_color">{{activeList.remark}}</div>
          </div>
          <!-- 活动描述 -->
          <div class="active_descript layout clearfix align_left flex_diection">
            <div class="descript_title">活动参与过程描述：</div>
            <div class="description">{{activeList.user_description}}</div>
          </div>
          <div class="active_descript layout clearfix align_left flex_diection">
            <div class="descript_title">活动后有关生涯感想：</div>
            <div class="description">{{activeList.user_summary}}</div>
          </div>
          <!-- 活动图片 -->
          <div class="active_descript layout clearfix align_left flex_diection">
            <div class="descript_title">活动图片：</div>
            <div class="des_pic" v-for="(item,index) in activeList.user_images" :key="index">
              <img :src="item" alt />
            </div>
          </div>
        </div>
      </el-dialog>
    </div>
  </div>
</template>
<script>
import { post } from "@/api/http";
export default {
  props: ["expedVisible", "activityId"],
  data() {
    return {
      activeList: [],
      sign_btn: 0,
      descriptList: [],
      activePic: []
    };
  },
  methods: {
    // 录入心得后活动详情
    getDetail() {
      let url = "/api/activity/getActivityDetail";
      let params = {
        id: this.activityId
      };
      post(url, params).then(res => {
        this.activeList = res.activity;
      });
    }
  },
  mounted() {
    this.getDetail();
  }
};
</script>
<style scoped>
@import "../../../../style/personal.css";
.exped_top {
  margin-top: 18px;
}
/* 活动描述 */
.active_descript {
  margin-top: 20px;
  line-height: 32px;
  font-size: 16px;
  color: #5b5e63;
}
.description {
  font-size: 14px;
  line-height: 22px;
  color: #8c9198;
  text-align: left;
  width:540px;
}
/* 图片 */
.des_pic {
  width: 540px;
  height: 170px;
  margin-top: 14px;
}
.des_pic img {
  display: block;
  width: 100%;
  height: 100%;
}
</style>