<template>
  <div class="containerbox">
    <div class="flextwo sharetopk" @click="back">
      <div class="leftrow leftrowkimg">
        <img src="../../../assets/leftrow.png" alt />
      </div>
      <div class="sharemiddle">素材详情</div>
      <div class="sharebtn">
        <!-- <img src="../../../assets/sharebtn.png" alt /> -->
      </div>
    </div>
    <div class="wenanbox">
      <div class="wenanboxtitle">{{contentdetail.name}}</div>
      <div class="wenansectitle">{{contentdetail.type_text}}</div>
      <div class="wenandetailtext">{{contentdetail.content}}</div>
    </div>
    <div class="suciabot">
      <div class="sucaibtn" v-clipboard:copy="contentdetail.content" v-clipboard:success="onCopy">复制</div>
    </div>
  </div>
</template>

<script>
import Vue from "vue";
import { Toast } from "vant";
Vue.use(Toast);
export default {
  data() {
    return {
      id: '',
      contentdetail: ""
    }
  },
  created() {
    document.title = '唐元集'
    this.id = this.$route.query.id;
    this.getvideodetail()
  },
  methods: {
    onCopy(e) {
      Toast("复制成功");
    },
    back() {
      this.$router.go(-1)
    },
    getvideodetail() {
      let that = this;
      var url = "/api/user/material_detail";
      let param = {
        material_id: this.id
      };

      that.$axios
        .post(url, param)
        .then(function (res) {
          console.log(res);
          that.contentdetail = res.data.material;
          console.log(that.contentdetail)

        })
        .catch(function (err) {
          console.log(err);
        });
    },

  }
}
</script>

<style scoped>
@import "../../../style/usercenter.css";
</style>