<template>
  <div class="main">
    <navbar :user="userInfo"></navbar>
    <div style="width: 1094px;background-color: white;margin: 0 auto; border-radius: 10px;">
      <div class="postDialog">
        <i-post-info :post-info="postInfo"></i-post-info>
      </div>
    </div>
  </div>
</template>
<script>
  import {
    httpServer
  } from "@/components/httpServer/httpServer.js";
  import navbar from "@/components/nav/navbar.vue";
  import IPostInfo from "@/components/info/post.vue";
  import {
    mapGetters
  } from "vuex";
  export default {
    components: {
      navbar,
      IPostInfo
    },
    data() {
      return {
        postId: 0,
        postInfo: {}
      };
    },
    computed: {
      ...mapGetters("user", ["userInfo"])
    },
    methods: {
      gotoDetail() {
        let postId = this.postId;
        httpServer("Course.getPostInfo", {
          postId
        }).then(res => {
          if (res.code == 200) {
            this.postInfo = res.data
          }
        })
      }
    },
    created() {
      this.postId = +this.$route.query.postId || 0;
      if (this.postId > 0) {
        this.gotoDetail();
      }
    }
  }
</script>
<style>
  .postDialog {
    background-color: white;
    width: 800px;
    margin: 0px auto;
    padding: 20px;
    margin-bottom: 100px;
  }
</style>
