Browse Source

初始化底图

360view
bianyaqi 2 years ago
parent
commit
476a3f3682
  1. BIN
      src/assets/img/od.png
  2. 4
      src/components/360View/base64/odOrOs.js
  3. 19
      src/components/360View/img-editor.vue
  4. 2
      src/page-subspecialty/views/modules/formList/laserSurgery.vue

BIN
src/assets/img/od.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

4
src/components/360View/base64/odOrOs.js

File diff suppressed because one or more lines are too long

19
src/components/360View/img-editor.vue

@ -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()
} }
}, },

2
src/page-subspecialty/views/modules/formList/laserSurgery.vue

@ -147,7 +147,7 @@
/> />
</div> </div>
</div> </div>
<img-editor ref="imgEditorRef" @fullImgBack="fullImgBack" />
<img-editor ref="imgEditorRef" :is-od-or-os="this.confirmData.eyeType" @fullImgBack="fullImgBack" />
</div> </div>
</div> </div>
</template> </template>

Loading…
Cancel
Save