Compare commits

...

7 Commits

3 changed files with 27 additions and 18 deletions

View File

@ -163,6 +163,7 @@ import QuestToPPTist from '@/views/classTask/newClassTaskAssign/questToPPTist/in
import MaterialDialog from './MaterialDialog.vue' import MaterialDialog from './MaterialDialog.vue'
import { PPTApi } from '../../../api' import { PPTApi } from '../../../api'
import TextCreateImg from '@/components/ai-kolors/index.vue' import TextCreateImg from '@/components/ai-kolors/index.vue'
import { toPng, toJpeg } from 'html-to-image' // html-to-image
const mainStore = useMainStore() const mainStore = useMainStore()
const { creatingElement, creatingCustomShape, showSelectPanel, showSearchPanel, showNotesPanel } = storeToRefs(mainStore) const { creatingElement, creatingCustomShape, showSelectPanel, showSearchPanel, showNotesPanel } = storeToRefs(mainStore)
@ -207,8 +208,10 @@ const insertImageElement = (files: FileList) => {
// }) // })
} }
const onhtml2canvas = (imgbs64: string) => { const onhtml2canvas = async (html: HTMLElement) => {
createImageElement(imgbs64) //createImageElement(imgbs64);
const ele = await toPng(html)
createImageElement(ele);
} }
const shapePoolVisible = ref(false) const shapePoolVisible = ref(false)

View File

@ -118,7 +118,7 @@
import { Search } from '@element-plus/icons-vue' import { Search } from '@element-plus/icons-vue'
import { onMounted, ref,watch, reactive, getCurrentInstance,nextTick } from 'vue' import { onMounted, ref,watch, reactive, getCurrentInstance,nextTick } from 'vue'
import { useRouter, useRoute } from 'vue-router' import { useRouter, useRoute } from 'vue-router'
import html2canvas from 'html2canvas'; // import html2canvas from 'html2canvas';
import { listEntpcoursework, listEntpcourseworkLocal } from '@/api/education/entpCourseWork' import { listEntpcoursework, listEntpcourseworkLocal } from '@/api/education/entpCourseWork'
import { listEvaluationclue } from '@/api/classTask' import { listEvaluationclue } from '@/api/classTask'
@ -453,13 +453,16 @@ const handleDelete = async(item, index) => {
*/ */
const captureScreenshot = (id) => { const captureScreenshot = (id) => {
const targetElement = document.getElementById('screenshot-target-' + id); const targetElement = document.getElementById('screenshot-target-' + id);
html2canvas(targetElement).then(canvas => { if (targetElement) {
// canvasURL emit('addQuizImgBs64', targetElement);
const screenshotUrl = canvas.toDataURL('image/png'); }
// // html2canvas(targetElement).then(canvas => {
// console.log(screenshotUrl); // // canvasURL
emit('addQuizImgBs64', screenshotUrl); // const screenshotUrl = canvas.toDataURL('image/png');
}); // //
// // console.log(screenshotUrl);
// emit('addQuizImgBs64', screenshotUrl);
// });
} }
// //

View File

@ -105,7 +105,7 @@
</template> </template>
<script setup> <script setup>
import { Search } from '@element-plus/icons-vue' import { Search } from '@element-plus/icons-vue'
import html2canvas from 'html2canvas'; //import html2canvas from 'html2canvas';
import { onMounted, ref,watch, reactive, getCurrentInstance,nextTick } from 'vue' import { onMounted, ref,watch, reactive, getCurrentInstance,nextTick } from 'vue'
import {listEntpcoursework, listEntpcourseworkNew, getEntpcoursework} from '@/api/education/entpCourseWork' import {listEntpcoursework, listEntpcourseworkNew, getEntpcoursework} from '@/api/education/entpCourseWork'
@ -439,13 +439,16 @@ const getPaginationList = ( page, limit ) => {
*/ */
const captureScreenshot = (id) => { const captureScreenshot = (id) => {
const targetElement = document.getElementById('screenshot-target-' + id); const targetElement = document.getElementById('screenshot-target-' + id);
html2canvas(targetElement).then(canvas => { if (targetElement) {
// canvasURL emit('addQuizImgBs64', targetElement);
const screenshotUrl = canvas.toDataURL('image/png'); }
// // html2canvas(targetElement).then(canvas => {
// console.log(screenshotUrl); // // canvasURL
emit('addQuizImgBs64', screenshotUrl); // const screenshotUrl = canvas.toDataURL('image/png');
}); // //
// // console.log(screenshotUrl);
// emit('addQuizImgBs64', screenshotUrl);
// });
} }