feat:修改pdf查看器

ZhangXianQiang

2024-07-03 eebf6591511daa7c92a7b009a0fef5fb2bea501b

 src/views/folder/index.vue

@@ -17,7 +17,7 @@
              <div class="card-main flex-1 my-5 relative">
                <div class="main-content absolute top-0 bottom-0 left-0 right-0">
                  <el-table :data="fileList" height="100%">
                    <el-table-column label="文件名称" align="center">
                    <el-table-column label="文件名称">
                      <template #default="scope">
                        <div class="row-info">
                          <div class="icon">
@@ -49,6 +49,10 @@
        </div>
      </div>
    </div>

    <div class="pdf-container">
      <PDFViewer :pdfUrl="'/helloworld.pdf'"></PDFViewer>
    </div>
  </div>
</template>

@@ -56,7 +60,9 @@
import { ref } from 'vue';
import NormalHeader from '@/components/NormalHeader/index.vue';
import { Search } from '@element-plus/icons-vue';
import { getFileList } from '@/api/modules/file.js';

import PDFViewer from '@/components/PDFViewer/index.vue';

const fileType = {
  'img': {
@@ -69,14 +75,12 @@
    iconPath: '/static/icons/file_type_video.png',
    handle: (item) => {
      console.log(item);

    }
  },
  'pdf': {
    iconPath: '/static/icons/file_type_image.png',
    handle: (item) => {
      console.log(item);

    }
  },
};
@@ -120,6 +124,13 @@
  fileType[item.type] && fileType[item.type].handle(item);
};

const getData = () => {
  getFileList().then(res => {

  });
};
getData();

</script>

<style lang="scss" scoped>
@@ -136,4 +147,14 @@
    margin-right: 20px;
  }
}

.pdf-container {
  width: 800px;
  height: 800px;
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
</style>