|
@ -25,7 +25,7 @@ |
|
|
import 'tui-image-editor/dist/tui-image-editor.css' |
|
|
import 'tui-image-editor/dist/tui-image-editor.css' |
|
|
import 'tui-color-picker/dist/tui-color-picker.css' |
|
|
import 'tui-color-picker/dist/tui-color-picker.css' |
|
|
import ImageEditor from 'tui-image-editor' |
|
|
import ImageEditor from 'tui-image-editor' |
|
|
import { fabric } from 'fabric' |
|
|
|
|
|
|
|
|
import odOrOs from '@/components/360View/base64/odOrOs' |
|
|
// 汉化 |
|
|
// 汉化 |
|
|
const locale_zh = { |
|
|
const locale_zh = { |
|
|
// override default English locale to your custom |
|
|
// override default English locale to your custom |
|
@ -190,6 +190,9 @@ export default { |
|
|
title: { |
|
|
title: { |
|
|
type: String, |
|
|
type: String, |
|
|
default: '' |
|
|
default: '' |
|
|
|
|
|
}, |
|
|
|
|
|
isOdOrOs: { |
|
|
|
|
|
type: String |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
data() { |
|
|
data() { |
|
@ -236,14 +239,6 @@ export default { |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
mounted() { |
|
|
mounted() { |
|
|
// const ref = this.$refs.can |
|
|
|
|
|
// const canvas = new fabric.Canvas(ref) |
|
|
|
|
|
// const rect = new fabric.Rect({ |
|
|
|
|
|
// fill: 'red', |
|
|
|
|
|
// width: 20, |
|
|
|
|
|
// height: 20 |
|
|
|
|
|
// }) |
|
|
|
|
|
// canvas.add(rect) |
|
|
|
|
|
}, |
|
|
}, |
|
|
methods: { |
|
|
methods: { |
|
|
init(textOne, textTwo, textThree) { |
|
|
init(textOne, textTwo, textThree) { |
|
@ -252,6 +247,11 @@ export default { |
|
|
textThree ? this.textThree = textThree : '' |
|
|
textThree ? this.textThree = textThree : '' |
|
|
this.visible = true |
|
|
this.visible = true |
|
|
this.$nextTick(() => { |
|
|
this.$nextTick(() => { |
|
|
|
|
|
if (this.isOdOrOs === 'OD') { |
|
|
|
|
|
this.imgUrl = odOrOs.od |
|
|
|
|
|
} else if (this.isOdOrOs === 'OS') { |
|
|
|
|
|
this.imgUrl = odOrOs.os |
|
|
|
|
|
} |
|
|
this.editorOptions.includeUI.loadImage.path = this.imgUrl |
|
|
this.editorOptions.includeUI.loadImage.path = this.imgUrl |
|
|
this.instance = new ImageEditor( |
|
|
this.instance = new ImageEditor( |
|
|
'#tui-image-editor', |
|
|
'#tui-image-editor', |
|
@ -285,6 +285,7 @@ export default { |
|
|
reader.readAsDataURL(file) |
|
|
reader.readAsDataURL(file) |
|
|
reader.onload = function(e) { |
|
|
reader.onload = function(e) { |
|
|
that.imgUrl = reader.result |
|
|
that.imgUrl = reader.result |
|
|
|
|
|
console.log(that.imgUrl) |
|
|
that.init() |
|
|
that.init() |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|