<template>
  <div class="">
    <Header />
    <Mainmenu activeIndex="2" />
    <div class="wrap">
      <div class="title">{{ policyInfo.artTitle }}</div>
      <div v-html="policyInfo.artContent"></div>
    </div>
  </div>
</template>

<script>
import Header from "@/components/header.vue";
import Mainmenu from "@/components/mainmenu.vue";
import { getPolicyInfo } from "@/utils/api";
export default {
  name: "",
  components: {
    Header,
    Mainmenu,
  },
  data() {
    return {
      id: "",
      policyInfo: {},
    };
  },
  created() {
    this.id = this.$route.query.id;
    this.handelGetPolicyInfo();
  },
  methods: {
    handelGetPolicyInfo() {
      getPolicyInfo({ id: this.id })
        .then((res) => {
          console.log("getPolicyInfo", res);
          this.policyInfo = res.data;
        })
        .catch((err) => {
          console.log("getPolicyInfo err", err);
        });
    },
  },
};
</script>

<style lang='scss' scoped>
.wrap {
  padding-top: 50px;
  overflow: hidden;
  .title {
    text-align: center;
    margin-bottom: 24px;
    font-size: 24px;
  }
  /deep/ img {
    max-width: 100%;
  }
  /deep/ p {
    line-height: 1.5;
    margin-bottom: 10px;
  }
}
//@import url()
</style>