|
@@ -1,75 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="fileOnlineView">
|
|
|
- <el-dialog
|
|
|
- title="文件在线预览"
|
|
|
- :show-close="true"
|
|
|
- :modal="false"
|
|
|
- :append-to-body="false"
|
|
|
- :destroy-on-close="true"
|
|
|
- :before-close="closeMapDispatch"
|
|
|
- :visible.sync="mapDispatchDialog"
|
|
|
- >
|
|
|
- <div style="width: 100%; height: 100%" id="handout_wrap_inner">
|
|
|
- <vue-office-excel :src="value" @rendered="rendered" />
|
|
|
- </div>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import VueOfficeExcel from '@vue-office/excel'
|
|
|
-import '@vue-office/excel/lib/index.css'
|
|
|
-export default {
|
|
|
- components: {
|
|
|
- VueOfficeExcel
|
|
|
- },
|
|
|
- props: {
|
|
|
- value: {
|
|
|
- type: String,
|
|
|
- default: ''
|
|
|
- }
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- excel: '',
|
|
|
- mapDispatchDialog: false
|
|
|
- }
|
|
|
- },
|
|
|
- watch: {
|
|
|
- value(newVal) {
|
|
|
- this.$nextTick(() => {
|
|
|
- this.mapDispatchDialog = newVal ? true : false
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- rendered() {
|
|
|
- console.log('渲染完成')
|
|
|
- },
|
|
|
- closeMapDispatch() {
|
|
|
- this.$emit('input', '')
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss">
|
|
|
-.fileOnlineView {
|
|
|
- .el-dialog__wrapper {
|
|
|
- width: 100% !important;
|
|
|
- height: 100% !important;
|
|
|
- position: absolute !important;
|
|
|
- }
|
|
|
- .el-dialog {
|
|
|
- margin: 0 !important;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
- .el-dialog__body {
|
|
|
- padding: 0 !important;
|
|
|
- width: 100%;
|
|
|
- height: calc(100% - 58px);
|
|
|
- position: relative;
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|