<template>
  <div class="container">
    <pdf v-for="(item, index) in pdfNumPages" :key="index" :src="pdfUrl" :page="index + 1" />
  </div>
</template>

<script>
import pdf from "vue-pdf";
import config from "@/config";
import { mapActions } from "vuex";
import localStorage from "@/service/localStorage";
let CMAP_URL = "https://cdn.jsdelivr.net/npm/pdfjs-dist@2.5.207/cmaps/";

export default {
  name: "PolicyVirtualDetail",
  components: {
    pdf
  },
  data() {
    return {
      pdfUrl: "",
      pdfNumPages: null
    };
  },
  mounted() {
    this.pdfTask();
  },
  methods: {
    ...mapActions(["setIsLoading"]),
    pdfTask() {
      const token = localStorage.get("mongoToken");
      const policySecId = this.$route.query?.policySecId;
      if (!policySecId || !token) this.$router.back();
      const url = `${
        config.basicHost
      }policy/download?token=${token}&policySecId=${encodeURIComponent(policySecId)}`;
      this.pdfUrl = pdf.createLoadingTask({ url, cMapUrl: CMAP_URL, cMapPacked: true });
      this.pdfUrl.promise
        .then(pdf => {
          this.pdfNumPages = pdf.numPages;
          this.setIsLoading(false);
        })
        .catch(err => {
          console.error("err", err);
        });
    }
  }
};
</script>
<style lang="less" scoped></style>
