This commit is contained in:
小杨 2024-12-10 15:34:51 +08:00
commit e7c6ab9e8d
8 changed files with 331 additions and 78 deletions

View File

@ -11,10 +11,15 @@ import * as API_smarttalk from '@/api/file' // 相关api
import * as useStore from '../store' // pptist-状态管理
import { sessionStore } from '@/utils/store' // electron-store 状态管理
import useUserStore from '@/store/modules/user' // 外部-用户信息
import * as Api_server from '@/api/apiService' // 相关api
import * as commUtils from '@/utils/comm.js'
const slidesStore = useStore.useSlidesStore()
const userStore = useUserStore()
import { getClassWorkList,getStudentClassWorkData } from '@/views/tool/createHomework'
import {createWindow} from '@/utils/tool'
import { useToolState } from '@/store/modules/tool'
const toolStore = useToolState()
/** 工具类 */
export class Utils {
static mxData: any = {
@ -186,6 +191,30 @@ export class PPTApi {
else msgUtils.msgError(res.msg || '更新失败');return false
})
}
// 图片|音频|视频 转换为在线地址
static toRousrceUrl =async (o:any) => {
const formData = new FormData()
formData.append('file', o)
const res = await Api_server.Other.uploadFile(formData)
if (res && res.code == 200){
const url = res?.url
url &&(o.src = url)
return url
}
}
}
export class Homework{
// 作业弹窗
static async showHomework(id: any) {
let result = await getClassWorkList(id)
  result = await getStudentClassWorkData()
  localStorage.setItem('teachClassWorkItem', JSON.stringify(result[0]));
  toolStore.isTaskWin=true; // 设置打开批改窗口
//   emit('closeActive')
  createWindow('open-taskwin',{url:'/teachClassTask'});
}
}
export default PPTApi

View File

@ -7,19 +7,44 @@
/>
<template v-if="type === 'video'">
<Input v-model:value="videoSrc" placeholder="请输入视频地址e.g. https://xxx.mp4"></Input>
<div class="btns">
<el-tabs :tab-position="'left'" class="demo-tabs" v-model="tabvalue">
<el-tab-pane label="常规" >
<Input v-model:value="videoSrc" style="width:100%" placeholder="请输入视频地址e.g. https://xxx.mp4"></Input>
</el-tab-pane>
<el-tab-pane label="上传" >
<FileInput accept="video/*" @change="files => insertImageElementvideo(files)">
<div class="updivs">+点击上传视频</div>
</FileInput>
</el-tab-pane>
</el-tabs>
<div class="btns" v-if="tabvalue=='0'">
<Button @click="emit('close')" style="margin-right: 10px;">取消</Button>
<Button type="primary" @click="insertVideo()">确认</Button>
</div>
</template>
<template v-if="type === 'audio'">
<Input v-model:value="audioSrc" placeholder="请输入音频地址e.g. https://xxx.mp3"></Input>
<div class="btns">
<el-tabs :tab-position="'left'" class="demo-tabs" v-model="tabvalue1">
<el-tab-pane label="常规" >
<Input v-model:value="audioSrc" style="width:100%" placeholder="请输入音频地址e.g. https://xxx.mp3"></Input>
</el-tab-pane>
<el-tab-pane label="上传" >
<FileInput accept="audio/*" @change="files => insertImageElementaudio(files)">
<div class="updivs">+点击上传音频</div>
</FileInput>
</el-tab-pane>
</el-tabs>
<div class="btns" v-if="tabvalue1=='0'">
<Button @click="emit('close')" style="margin-right: 10px;">取消</Button>
<Button type="primary" @click="insertAudio()">确认</Button>
</div>
</template>
</div>
</template>
@ -30,6 +55,8 @@ import message from '../../../utils/message'
import Tabs from '../../../components/Tabs.vue'
import Input from '../../../components/Input.vue'
import Button from '../../../components/Button.vue'
import FileInput from '../../../components/FileInput.vue'
import { PPTApi } from '../../../api'
type TypeKey = 'video' | 'audio'
interface TabItem {
@ -45,9 +72,33 @@ const emit = defineEmits<{
const type = ref<TypeKey>('video')
const videoSrc = ref('https://mazwai.com/videvo_files/video/free/2019-01/small_watermarked/181004_04_Dolphins-Whale_06_preview.webm')
const audioSrc = ref('https://freesound.org/data/previews/614/614107_11861866-lq.mp3')
const videoSrc = ref('')
const audioSrc = ref('')
// https://freesound.org/data/previews/614/614107_11861866-lq.mp3
const tabvalue = ref('0')
const tabvalue1 = ref('0')
const insertImageElementvideo = (files: FileList) => {
console.log('files', files)
const imageFile = files[0]
if (!imageFile) return
PPTApi.toRousrceUrl(imageFile).then(data=>{
videoSrc.value=data
insertVideo()
})
}
const insertImageElementaudio = (files: FileList) => {
console.log('files', files)
const imageFile = files[0]
if (!imageFile) return
PPTApi.toRousrceUrl(imageFile).then(data=>{
videoSrc.value=data
insertAudio()
})
}
const tabs: TabItem[] = [
{ key: 'video', label: '视频' },
{ key: 'audio', label: '音频' },
@ -74,4 +125,33 @@ const insertAudio = () => {
margin-top: 10px;
text-align: right;
}
.updivs{
width: 100%;
height: 100%;
background: #f5f7fa;
border: 1px dashed #d9d9d9;
border-radius: 6px;
text-align: center;
line-height: 100px;
cursor: pointer;
}
.demo-tabs{
:deep(.el-tabs__content){
display: flex;
align-items: center;
div{
width: 100%;
}
}
:deep( .el-tabs__item.is-active) {
color: #d14424;
}
:deep( .el-tabs__item:hover) {
color: #d14424;
}
:deep(.el-tabs__active-bar) {
background-color: #d14424;
height: 3px;
}
}
</style>

View File

@ -161,7 +161,9 @@ import Popover from '../../../components/Popover.vue'
import PopoverMenuItem from '../../../components/PopoverMenuItem.vue'
import QuestToPPTist from '@/views/classTask/newClassTaskAssign/questToPPTist/index.vue'
import MaterialDialog from './MaterialDialog.vue'
import { PPTApi } from '../../../api'
import TextCreateImg from '@/components/ai-kolors/index.vue'
import { toPng } from 'html-to-image' // html-to-image
const mainStore = useMainStore()
const { creatingElement, creatingCustomShape, showSelectPanel, showSearchPanel, showNotesPanel } = storeToRefs(mainStore)
@ -194,13 +196,21 @@ const {
} = useCreateElement()
const insertImageElement = (files: FileList) => {
console.log('files', files)
const imageFile = files[0]
if (!imageFile) return
getImageDataURL(imageFile).then(dataURL => createImageElement(dataURL))
// 线
PPTApi.toRousrceUrl(imageFile).then(data=>{
createImageElement(data)
})
// getImageDataURL(imageFile).then(dataURL => {
// createImageElement(dataURL)
// })
}
const onhtml2canvas = (imgbs64: string) => {
createImageElement(imgbs64)
const onhtml2canvas = async (html: HTMLElement) => {
const ele = await toPng(html);
createImageElement(ele);
}
const shapePoolVisible = ref(false)

View File

@ -949,11 +949,11 @@ const showExamAnalyseDrawer = (row) => {
}
const tableRef = ref();
const getPaginationList = ( page, limit ) => {
const getPaginationList = async ( page, limit ) => {
paginationParams.pageNum = page;
paginationParams.pageSize = limit;
//console.log(page, limit)
handleQueryFromEntpCourseWork(0);
await handleQueryFromEntpCourseWork(0);
//
tableRef.value.setScrollTop(0);
}

View File

@ -49,6 +49,7 @@
:data="workResource.entpCourseWorkList"
style="width: 100%; height: calc(100% - 55px);"
v-loading="pageParams.loading"
ref="tableRef"
>
<el-table-column type="index" width="60" />
<el-table-column align="left" >
@ -118,7 +119,7 @@
import { Search } from '@element-plus/icons-vue'
import { onMounted, ref,watch, reactive, getCurrentInstance,nextTick } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import html2canvas from 'html2canvas';
// import html2canvas from 'html2canvas';
import { listEntpcoursework, listEntpcourseworkLocal } from '@/api/education/entpCourseWork'
import { listEvaluationclue } from '@/api/classTask'
@ -364,11 +365,15 @@ const showExamAnalyseDrawer = (row) => {
proxy.$refs.examDetailsDrawerRef.acceptParams(activeParams);
})
}
const getPaginationList = ( page, limit ) => {
const tableRef = ref();
const getPaginationList = async ( page, limit ) => {
paginationParams.pageNum = page;
paginationParams.pageSize = limit;
console.log(page, limit)
handleQueryFromEntpCourseWork(0);
await handleQueryFromEntpCourseWork(0);
//
tableRef.value.setScrollTop(0);
}
/** 单题上传弹出框----纠错修改框 */
@ -453,13 +458,16 @@ const handleDelete = async(item, index) => {
*/
const captureScreenshot = (id) => {
const targetElement = document.getElementById('screenshot-target-' + id);
html2canvas(targetElement).then(canvas => {
// canvasURL
const screenshotUrl = canvas.toDataURL('image/png');
//
// console.log(screenshotUrl);
emit('addQuizImgBs64', screenshotUrl);
});
if (targetElement) {
emit('addQuizImgBs64', targetElement);
}
// html2canvas(targetElement).then(canvas => {
// // canvasURL
// const screenshotUrl = canvas.toDataURL('image/png');
// //
// // console.log(screenshotUrl);
// emit('addQuizImgBs64', screenshotUrl);
// });
}
//

View File

@ -62,6 +62,7 @@
:data="workResource.entpCourseWorkList"
style="width: 100%; height: calc(100% - 50px);"
v-loading="pageParams.loading"
ref="tableRef"
>
<el-table-column type="index" width="60" />
<el-table-column align="left" >
@ -105,7 +106,7 @@
</template>
<script setup>
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 {listEntpcoursework, listEntpcourseworkNew, getEntpcoursework} from '@/api/education/entpCourseWork'
@ -396,11 +397,15 @@ const showExamAnalyseDrawer = (row) => {
proxy.$refs.examDetailsDrawerRef.acceptParams(activeParams);
})
}
const getPaginationList = ( page, limit ) => {
const tableRef = ref();
const getPaginationList = async ( page, limit ) => {
paginationParams.pageNum = page;
paginationParams.pageSize = limit;
console.log(page, limit)
handleQueryFromEntpCourseWork(0);
await handleQueryFromEntpCourseWork(0);
//
tableRef.value.setScrollTop(0);
}
@ -439,13 +444,16 @@ const getPaginationList = ( page, limit ) => {
*/
const captureScreenshot = (id) => {
const targetElement = document.getElementById('screenshot-target-' + id);
html2canvas(targetElement).then(canvas => {
// canvasURL
const screenshotUrl = canvas.toDataURL('image/png');
//
// console.log(screenshotUrl);
emit('addQuizImgBs64', screenshotUrl);
});
if (targetElement) {
emit('addQuizImgBs64', targetElement);
}
// html2canvas(targetElement).then(canvas => {
// // canvasURL
// const screenshotUrl = canvas.toDataURL('image/png');
// //
// // console.log(screenshotUrl);
// emit('addQuizImgBs64', screenshotUrl);
// });
}

View File

@ -36,7 +36,7 @@
{{ item.async === 'on' ? '同步中' : '' }}
</div>
<template v-if="item.fileFlag ==='课件'">|</template>
<div style="width: 70px">访问 100</div>
<!-- <div style="width: 70px">访问 100</div>
|
<div style="width: 70px">引用 50</div>
|
@ -49,6 +49,16 @@
white-space: nowrap;
width: 200px;
">点赞 20</div>
|-->
<div
style="
flex: 1;
text-align: left;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 200px;
">{{formatDate(item.createTime, 'yyyy-MM-dd hh:mm:ss')}}</div>
</div>
</div>
<div class="prepare-body-main-item-btn">
@ -107,6 +117,7 @@ import { endClass, getSelfReserv } from '@/api/classManage'
import { listEntpcourse } from '@/api/teaching/classwork'
import { createWindow } from '@/utils/tool'
import { defineExpose } from 'vue'
import {formatDate} from '@/utils/comm'
const { ipcRenderer } = window.electron || {}
export default {

View File

@ -8,15 +8,16 @@
</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="createAptFile">新建文枢课件</el-dropdown-item>
<el-dropdown-item>AI一键生成</el-dropdown-item>
<el-dropdown-item>导入PPT</el-dropdown-item>
<el-dropdown-item @click="createAIPPT">新建文枢课件</el-dropdown-item>
<el-dropdown-item @click="aiTOPPT">AI一键生成</el-dropdown-item>
<el-dropdown-item @click="openFilePicker">导入PPT</el-dropdown-item>
<input type="file" ref="fileInput" style="display: none;" @change="handleFileChange" accept="application/vnd.ms-powerpoint,application/vnd.openxmlformats-officedocument.presentationml.presentation">
</el-dropdown-menu>
</template>
</el-dropdown>
<el-tabs v-model="activeAptTab" style="height: 100%;">
<el-tab-pane label="文枢课件" name="教学课件" class="prepare-center-jxkj">
<div class="prepare-center-header">
<!-- <div class="prepare-center-header">
<div class="center-create-btn" style="background-color: rgb(64,158,255)" @click="createAptFile">
<div class="create-btn-title"><el-icon><Plus /></el-icon><label>APT</label></div>
<div class="create-btn-info">智能交互课件</div>
@ -29,7 +30,7 @@
<div class="create-btn-title"><el-icon><Plus /></el-icon><label>PPT</label></div>
<div class="create-btn-info">试验版</div>
</div>
</div>
</div>-->
<div class="prepare-center-body">
<kj-list-item
v-for="(item, index) in currentKJFileList"
@ -152,6 +153,7 @@
<!-- 上课配置 -->
<class-start ref="calssRef" @close="closeChange"/>
<PptDialog @add-success="addAiPPT" :currentNode="currentNode" :uploadData="uploadData" v-model="pptDialog"/>
<progress-dialog v-model:visible="pgDialog.visible" v-bind="pgDialog" />
<!-- 章节弹窗 -->
<TreeLog ref="treelogRef"/>
<!-- <button @click="test">test</button> -->
@ -161,8 +163,16 @@ import {Check, Plus, Position} from '@element-plus/icons-vue'
import Reserv from '@/views/prepare/container/reserv.vue'
import { ArrowDown } from '@element-plus/icons-vue'
import PptDialog from '@/views/prepare/container/ppt-dialog.vue'
import progressDialog from '@/views/teachingDesign/container/progress-dialog.vue'
import {useRouter} from "vue-router";
const router = useRouter()
const aiTOPPT = ()=> {
router.push({path: '/model/design'})
}
</script>
<script>
import {PPTXFileToJson} from "@/AixPPTist/src/hooks/useImport";
const Remote = require('@electron/remote')
import ChooseTextbook from '@/components/choose-textbook/index.vue'
import uploadDialog from '@/components/upload-dialog/index.vue'
@ -192,6 +202,12 @@ import ClassReserv from '@/views/classManage/classReserv.vue'
import TreeLog from '@/views/prepare/components/treeLog.vue'
import classStart from './container/class-start.vue' //
import MsgEnum from '@/plugins/imChat/msgEnum' // im
import Chat from '@/utils/chat'
import * as commUtils from "@/utils/comm";
import * as Api_server from "@/api/apiService";
import msgUtils from "@/plugins/modal";
import * as API_entpcoursefile from "@/api/education/entpcoursefile"; // im
if (!Chat.imChat) Chat.init()
// import Chat from '@/utils/chat' // im
// if (!Chat.imChat) Chat.init()
// import ChatWs from '@/plugins/socket'
@ -201,7 +217,6 @@ import MsgEnum from '@/plugins/imChat/msgEnum' // im 消息枚举
const toolStore = useToolState()
const fs = require('fs')
const { ipcRenderer } = window.electron || {}
export default {
name: 'Prepare',
components: {
@ -257,7 +272,23 @@ export default {
//
treelogRef:null,
// Entpcourse
entp: null
entp: null,
pgDialog: { // -
visible: false,
title: 'PPT解析中...',
width: 300,
showClose: false,
draggable: true,
beforeClose: done => {}, // -
pg: { // -
percentage: 0, //
color: [
{ color: '#1989fa', percentage: 50 }, //
{ color: '#e6a23c', percentage: 80 }, //
{ color: '#5cb87a', percentage: 100 }, // 绿
]
}
}
}
},
computed: {
@ -476,6 +507,117 @@ export default {
},500)
})
},
openFilePicker(){
this.$refs.fileInput.click();
},
handleFileChange(){
const file = event.target.files[0];
if (file) {
console.log(file);
console.log('文件名:', file.name);
console.log('文件类型:', file.type);
console.log('文件大小:', file.size);
this.createAIPPTByFile(file)
}
},
async toRousrceUrl(o) {
if (!!o.src) { // src
const isBase64 = /^data:image\/(\w+);base64,/.test(o.src)
const isBlobUrl = /^blob:/.test(o.src)
console.log('isBase64', o, isBase64)
if (isBase64) {
const bolb = commUtils.base64ToBlob(o.src)
const fileName = Date.now() + '.png'
const file = commUtils.blobToFile(bolb, fileName)
// o.src = fileName
// console.log('file', file)
const formData = new FormData()
formData.append('file', file)
const res = await Api_server.Other.uploadFile(formData)
if (res && res.code == 200){
const url = res?.url
url &&(o.src = url)
}
} else if (isBlobUrl) { //
}
}
if (o?.background?.image) await this.toRousrceUrl(o.background.image)
if (o?.elements) o.elements.forEach(async o => {await this.toRousrceUrl(o)})
},
async createAIPPTByFile(file) {
this.pgDialog.visible = true
this.pgDialog.pg.percentage = 0
const resPptJson = await PPTXFileToJson(file)
const { def, slides, ...content } = resPptJson
// || 线
let completed = 0
const total = slides.length
for( let o of slides ) {
completed++
await this.toRousrceUrl(o)
//
this.pgDialog.pg.percentage = Math.floor(completed / total * 100)
}
this.pgDialog.pg.percentage = 0
this.pgDialog.visible = false
listEntpcourse({
evalid: this.currentNode.id,
edituserid: this.userStore.userId,
pageSize: 500
}).then((response) => {
if (response.rows.length <= 0) return
let resCourse = response.rows[0]
//
let form = {
parentid: 0,
entpid: this.userStore.deptId,
entpcourseid: resCourse.id,
ppttype: 'file',
title: resCourse.coursetitle,
fileurl: '',
filetype: 'aippt',
datacontent: '',
parentContent: JSON.stringify(content),
filekey: '',
filetag: '',
fileidx: 0,
dflag: 0,
status: '',
edituserid: this.userStore.userId
}
addEntpcoursefileReturnId(form).then((slideid) => {
creatAPT({
...this.uploadData,
fileId: slideid,
fileFlag: 'aippt',
fileShowName: this.currentNode.itemtitle + '.aippt'
}).then(async (res) => {
const resSlides = slides.map(({id, ...slide}) => JSON.stringify(slide))
let params = {
parentid: slideid,
entpid: resCourse.entpid,
entpcourseid: resCourse.id,
title: '',
filetype: 'slide',
slides: resSlides,
edituserid: this.userStore.userId
}
const res_3 = await API_entpcoursefile.batchAddNew(params)
if (res_3 && res_3.code == 200) {
msgUtils.msgSuccess('导入PPT课件成功')
this.currentFileList.unshift(res.resData)
setTimeout(()=>{
this.$refs['kjItemRef'+res.resData.id][0].openFileWin(res.resData);
},500)
} else {
msgUtils.msgWarning('导入PPT课件失败')
}
})
})
})
},
createAIPPT() {
listEntpcourse({
evalid: this.currentNode.id,
@ -502,57 +644,22 @@ export default {
edituserid: this.userStore.userId
}
addEntpcoursefileReturnId(form).then((slideid) => {
let pagearray = []
//
pagearray.push({
key: '公屏',
title: '公屏页',
slidedata: {
attrs: { width: 1333, height: 749.8125 },
className: 'Stage',
children: [
{
attrs: {},
className: 'Layer',
children: [
{
attrs: {
width: 1333,
height: 749.8125,
fill: 'white',
name: 'fixedbackground',
listening: true
},
className: 'Rect'
}
]
}
]
}
})
//
var form = {
parentid: slideid,
entpid: resCourse.entpid,
entpcourseid: resCourse.id,
ppttype: 'file',
title: '第一页',
fileurl: '',
filetype: 'slide',
datacontent: JSON.stringify(pagearray),
filekey: '',
filetag: '',
fileidx: 0,
dflag: 0,
status: '',
datacontent: '{"elements":[],"background":{"type":"solid","color":"#fff"}}',
edituserid: this.userStore.userId
}
addEntpcoursefileReturnId(form).then((res) => {
creatAPT({
...this.uploadData,
fileId: slideid,
fileShowName: this.currentNode.itemtitle + '.apt'
fileFlag: 'aippt',
fileShowName: this.currentNode.itemtitle + '.aippt'
}).then((res) => {
this.currentFileList.unshift(res.resData)
setTimeout(()=>{