| @@ -23,7 +23,6 @@ | |||||
| "dayjs": "^1.11.8", | "dayjs": "^1.11.8", | ||||
| "echarts": "^5.2.2", | "echarts": "^5.2.2", | ||||
| "element-plus": "^2.3.1", | "element-plus": "^2.3.1", | ||||
| "fabric": "^5.3.0", | |||||
| "js-audio-recorder": "^1.0.7", | "js-audio-recorder": "^1.0.7", | ||||
| "nprogress": "^0.2.0", | "nprogress": "^0.2.0", | ||||
| "path-browserify": "^1.0.1", | "path-browserify": "^1.0.1", | ||||
| @@ -2,6 +2,7 @@ | |||||
| export {} | export {} | ||||
| declare global { | declare global { | ||||
| const EffectScope: typeof import('vue')['EffectScope'] | const EffectScope: typeof import('vue')['EffectScope'] | ||||
| const ElForm: typeof import('element-plus/es')['ElForm'] | |||||
| const ElMessage: typeof import('element-plus/es')['ElMessage'] | const ElMessage: typeof import('element-plus/es')['ElMessage'] | ||||
| const ElMessageBox: typeof import('element-plus/es')['ElMessageBox'] | const ElMessageBox: typeof import('element-plus/es')['ElMessageBox'] | ||||
| const asyncComputed: typeof import('@vueuse/core')['asyncComputed'] | const asyncComputed: typeof import('@vueuse/core')['asyncComputed'] | ||||
| @@ -270,6 +271,7 @@ import { UnwrapRef } from 'vue' | |||||
| declare module 'vue' { | declare module 'vue' { | ||||
| interface ComponentCustomProperties { | interface ComponentCustomProperties { | ||||
| readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']> | readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']> | ||||
| readonly ElForm: UnwrapRef<typeof import('element-plus/es')['ElForm']> | |||||
| readonly ElMessage: UnwrapRef<typeof import('element-plus/es')['ElMessage']> | readonly ElMessage: UnwrapRef<typeof import('element-plus/es')['ElMessage']> | ||||
| readonly ElMessageBox: UnwrapRef<typeof import('element-plus/es')['ElMessageBox']> | readonly ElMessageBox: UnwrapRef<typeof import('element-plus/es')['ElMessageBox']> | ||||
| readonly asyncComputed: UnwrapRef<typeof import('@vueuse/core')['asyncComputed']> | readonly asyncComputed: UnwrapRef<typeof import('@vueuse/core')['asyncComputed']> | ||||
| @@ -24,7 +24,6 @@ declare module '@vue/runtime-core' { | |||||
| ElInput: typeof import('element-plus/es')['ElInput'] | ElInput: typeof import('element-plus/es')['ElInput'] | ||||
| ElInputNumber: typeof import('element-plus/es')['ElInputNumber'] | ElInputNumber: typeof import('element-plus/es')['ElInputNumber'] | ||||
| ElOption: typeof import('element-plus/es')['ElOption'] | ElOption: typeof import('element-plus/es')['ElOption'] | ||||
| ElPagination: typeof import('element-plus/es')['ElPagination'] | |||||
| ElSelect: typeof import('element-plus/es')['ElSelect'] | ElSelect: typeof import('element-plus/es')['ElSelect'] | ||||
| ElSwitch: typeof import('element-plus/es')['ElSwitch'] | ElSwitch: typeof import('element-plus/es')['ElSwitch'] | ||||
| ElTooltip: typeof import('element-plus/es')['ElTooltip'] | ElTooltip: typeof import('element-plus/es')['ElTooltip'] | ||||
| @@ -32,14 +31,8 @@ declare module '@vue/runtime-core' { | |||||
| GithubCorner: typeof import('./../components/GithubCorner/index.vue')['default'] | GithubCorner: typeof import('./../components/GithubCorner/index.vue')['default'] | ||||
| Hamburger: typeof import('./../components/Hamburger/index.vue')['default'] | Hamburger: typeof import('./../components/Hamburger/index.vue')['default'] | ||||
| IconSelect: typeof import('./../components/IconSelect/index.vue')['default'] | IconSelect: typeof import('./../components/IconSelect/index.vue')['default'] | ||||
| IEpCloseBold: typeof import('~icons/ep/close-bold')['default'] | |||||
| IEpDelete: typeof import('~icons/ep/delete')['default'] | |||||
| IEpDownload: typeof import('~icons/ep/download')['default'] | |||||
| IEpEdit: typeof import('~icons/ep/edit')['default'] | IEpEdit: typeof import('~icons/ep/edit')['default'] | ||||
| IEpLoading: typeof import('~icons/ep/loading')['default'] | |||||
| IEpMenu: typeof import('~icons/ep/menu')['default'] | IEpMenu: typeof import('~icons/ep/menu')['default'] | ||||
| IEpSearch: typeof import('~icons/ep/search')['default'] | |||||
| IEpVideoPlay: typeof import('~icons/ep/video-play')['default'] | |||||
| LangSelect: typeof import('./../components/LangSelect/index.vue')['default'] | LangSelect: typeof import('./../components/LangSelect/index.vue')['default'] | ||||
| MultiUpload: typeof import('./../components/Upload/MultiUpload.vue')['default'] | MultiUpload: typeof import('./../components/Upload/MultiUpload.vue')['default'] | ||||
| MyLoading: typeof import('./../components/myLoading.vue')['default'] | MyLoading: typeof import('./../components/myLoading.vue')['default'] | ||||
| @@ -28,26 +28,26 @@ | |||||
| <script setup> | <script setup> | ||||
| //#region 导入 | //#region 导入 | ||||
| import { fabric } from "fabric"; | |||||
| // import { fabric } from "fabric"; | |||||
| //#endregion --------------------------- | //#endregion --------------------------- | ||||
| //#region 画布交互 | //#region 画布交互 | ||||
| let canvas = new fabric.Canvas("canvas"); | |||||
| // let canvas = new fabric.Canvas("canvas"); | |||||
| //#endregion --------------------------- | //#endregion --------------------------- | ||||
| onMounted(() => { | onMounted(() => { | ||||
| let canvas = new fabric.Canvas("canvas"); | |||||
| // let canvas = new fabric.Canvas("canvas"); | |||||
| let imgElement = document.getElementById("bjImg"); //声明我们的图片 | let imgElement = document.getElementById("bjImg"); //声明我们的图片 | ||||
| let imgInstance = new fabric.Image(imgElement, { | |||||
| //设置图片位置和样子 | |||||
| // left: 100, | |||||
| // top: 100, | |||||
| // width: 400, | |||||
| // height: 200, | |||||
| // angle: 30, //设置图形顺时针旋转角度 | |||||
| }); | |||||
| // let imgInstance = new fabric.Image(imgElement, { | |||||
| //设置图片位置和样子 | |||||
| // left: 100, | |||||
| // top: 100, | |||||
| // width: 400, | |||||
| // height: 200, | |||||
| // angle: 30, //设置图形顺时针旋转角度 | |||||
| // }); | |||||
| console.log(imgInstance); | console.log(imgInstance); | ||||
| canvas.add(imgInstance); | canvas.add(imgInstance); | ||||
| // canvas.on("mouse:up", function (options) { | // canvas.on("mouse:up", function (options) { | ||||