haoxuan
2024-02-07 d68b036a3b3c67273b8effa3c9925ef3869a91ba
src/views/overview/previewExcel.vue
@@ -1,11 +1,11 @@
<template>
  <div>
    
    <button @click="cropAndDownload">截取图片</button>
    <!-- <button @click="cropAndDownload">截取图片</button> -->
    <!-- 显示裁剪后的图片 -->
    <div style="width: 800px;">
    <!-- <div style="width: 800px;">
      <img style="width: 100%;" id="export-pdf" v-if="croppedImage" :src="croppedImage" alt="Cropped Image" />
    </div>
    </div> -->
    <div ref="elementToCrop" >
      <div style="width: 100%;">
        <vue-office-excel :minRowLength="0"  :src="excel" @rendered="rendered"/>
@@ -25,19 +25,16 @@
  },
  data() {
    return {
      excel: '',//excel文档地址
      cutAfterWidth:this.$route.params.cutAfterWidth,//裁剪后要减去的宽
      // cutAfterWidth:0,
      croppedImage: null, // 图片
      excel:'',
      cutAfterWidth:0,
      // croppedImage: null, // 图片
    };
  },
  computed: {
  },
  created() {
    console.log(this.$route.params.baseOperationType,"看看")
    if(this.$route.params.baseOperationType!=undefined){
      this.excel=this.$route.params.url
    }
    this.excel=this.$route.query.url
    this.cutAfterWidth=this.$route.query.cutAfterWidth
  },
  mounted() {
  },
@@ -46,8 +43,8 @@
  methods: {
    rendered(){
      console.log("渲染完成")
      if(this.$route.params.baseOperationType!=undefined){
        this.excel=this.$route.params.url
      if(this.$route.query.url){
        this.excel=this.$route.query.url
        this.cropAndDownload()
      }
    },