mirror of
https://github.com/501351981/vue-office.git
synced 2025-07-25 07:41:42 +08:00
fix: excel弹窗预览中宽度变化报错
This commit is contained in:
parent
de416c9671
commit
469fe837e8
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@vue-office/excel",
|
"name": "@vue-office/excel",
|
||||||
"version": "1.1.3",
|
"version": "1.1.4",
|
||||||
"description": "",
|
"description": "",
|
||||||
"main": "lib/index.js",
|
"main": "lib/index.js",
|
||||||
"files": [
|
"files": [
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
<script>
|
<script>
|
||||||
import {defineComponent, ref, onMounted, onBeforeUnmount, watch} from 'vue-demi';
|
import {defineComponent, ref, onMounted, onBeforeUnmount, watch, nextTick} from 'vue-demi';
|
||||||
import Spreadsheet from 'x-data-spreadsheet';
|
import Spreadsheet from 'x-data-spreadsheet';
|
||||||
import {getData, readExcelData, transferExcelToSpreadSheet} from './excel';
|
import {getData, readExcelData, transferExcelToSpreadSheet} from './excel';
|
||||||
import {renderImage, clearCache} from './media';
|
import {renderImage, clearCache} from './media';
|
||||||
@ -64,61 +64,64 @@ export default defineComponent({
|
|||||||
const observerCallback = debounce(readOnlyInput, 200).bind(this,rootRef);
|
const observerCallback = debounce(readOnlyInput, 200).bind(this,rootRef);
|
||||||
const observer = new MutationObserver(observerCallback);
|
const observer = new MutationObserver(observerCallback);
|
||||||
const observerConfig = { attributes: true, childList: true, subtree: true };
|
const observerConfig = { attributes: true, childList: true, subtree: true };
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
observer.observe(rootRef.value, observerConfig);
|
nextTick(()=>{
|
||||||
observerCallback(rootRef);
|
observer.observe(rootRef.value, observerConfig);
|
||||||
|
observerCallback(rootRef);
|
||||||
|
|
||||||
window.xs = xs = new Spreadsheet(rootRef.value, {
|
window.xs = xs = new Spreadsheet(rootRef.value, {
|
||||||
mode: 'read',
|
mode: 'read',
|
||||||
showToolbar: false,
|
showToolbar: false,
|
||||||
view: {
|
view: {
|
||||||
height: () => wrapperRef.value.clientHeight || 300,
|
height: () => wrapperRef.value && wrapperRef.value.clientHeight || 300,
|
||||||
width: () => wrapperRef.value.clientWidth || 300,
|
width: () => wrapperRef.value && wrapperRef.value.clientWidth || 300,
|
||||||
},
|
},
|
||||||
row: {
|
row: {
|
||||||
height: 24,
|
height: 24,
|
||||||
len: 100
|
len: 100
|
||||||
},
|
},
|
||||||
col: {
|
col: {
|
||||||
len: 26,
|
len: 26,
|
||||||
width: 80,
|
width: 80,
|
||||||
indexWidth: 60,
|
indexWidth: 60,
|
||||||
minWidth: 60,
|
minWidth: 60,
|
||||||
},
|
},
|
||||||
autoFocus: false
|
autoFocus: false
|
||||||
}).loadData({});
|
}).loadData({});
|
||||||
|
|
||||||
let swapFunc = xs.bottombar.swapFunc;
|
let swapFunc = xs.bottombar.swapFunc;
|
||||||
xs.bottombar.swapFunc = function (index) {
|
xs.bottombar.swapFunc = function (index) {
|
||||||
swapFunc.call(xs.bottombar, index);
|
swapFunc.call(xs.bottombar, index);
|
||||||
sheetIndex = index + 1;
|
sheetIndex = index + 1;
|
||||||
setTimeout(()=>{
|
setTimeout(()=>{
|
||||||
xs.reRender();
|
xs.reRender();
|
||||||
|
renderImage(ctx, mediasSource, workbookDataSource._worksheets[sheetIndex], offset);
|
||||||
|
});
|
||||||
|
|
||||||
|
};
|
||||||
|
let clear = xs.sheet.editor.clear;
|
||||||
|
xs.sheet.editor.clear = function (...args){
|
||||||
|
clear.apply(xs.sheet.editor, args);
|
||||||
|
setTimeout(()=>{
|
||||||
|
renderImage(ctx, mediasSource, workbookDataSource._worksheets[sheetIndex], offset);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
let setOffset = xs.sheet.editor.setOffset;
|
||||||
|
xs.sheet.editor.setOffset = function (...args){
|
||||||
|
setOffset.apply(xs.sheet.editor, args);
|
||||||
|
offset = args[0];
|
||||||
renderImage(ctx, mediasSource, workbookDataSource._worksheets[sheetIndex], offset);
|
renderImage(ctx, mediasSource, workbookDataSource._worksheets[sheetIndex], offset);
|
||||||
});
|
};
|
||||||
|
const canvas = rootRef.value.querySelector('canvas');
|
||||||
};
|
ctx = canvas.getContext('2d');
|
||||||
let clear = xs.sheet.editor.clear;
|
if (props.src) {
|
||||||
xs.sheet.editor.clear = function (...args){
|
getData(props.src, props.requestOptions).then(renderExcel).catch(e => {
|
||||||
clear.apply(xs.sheet.editor, args);
|
xs.loadData({});
|
||||||
setTimeout(()=>{
|
emit('error', e);
|
||||||
renderImage(ctx, mediasSource, workbookDataSource._worksheets[sheetIndex], offset);
|
});
|
||||||
});
|
}
|
||||||
};
|
});
|
||||||
let setOffset = xs.sheet.editor.setOffset;
|
|
||||||
xs.sheet.editor.setOffset = function (...args){
|
|
||||||
setOffset.apply(xs.sheet.editor, args);
|
|
||||||
offset = args[0];
|
|
||||||
renderImage(ctx, mediasSource, workbookDataSource._worksheets[sheetIndex], offset);
|
|
||||||
};
|
|
||||||
const canvas = rootRef.value.querySelector('canvas');
|
|
||||||
ctx = canvas.getContext('2d');
|
|
||||||
if (props.src) {
|
|
||||||
getData(props.src, props.requestOptions).then(renderExcel).catch(e => {
|
|
||||||
xs.loadData({});
|
|
||||||
emit('error', e);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
||||||
onBeforeUnmount(()=>{
|
onBeforeUnmount(()=>{
|
||||||
|
Loading…
x
Reference in New Issue
Block a user