From e56eb059be2e4cc399dfe99047239f09673a5626 Mon Sep 17 00:00:00 2001 From: zhangxuelin <959231531@qq.com> Date: Tue, 10 Dec 2024 09:41:59 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=BF=E6=8D=A2=E4=B8=8A=E4=BC=A0=E5=9B=BE?= =?UTF-8?q?=E7=89=87=20=E8=A7=86=E9=A2=91url=E4=B8=BA=E7=BA=BF=E4=B8=8Aurl?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/renderer/src/AixPPTist/src/api/index.ts | 16 +++- .../views/Editor/CanvasTool/MediaInput.vue | 92 +++++++++++++++++-- .../src/views/Editor/CanvasTool/index.vue | 11 ++- 3 files changed, 110 insertions(+), 9 deletions(-) diff --git a/src/renderer/src/AixPPTist/src/api/index.ts b/src/renderer/src/AixPPTist/src/api/index.ts index 32bb25a..193d60c 100644 --- a/src/renderer/src/AixPPTist/src/api/index.ts +++ b/src/renderer/src/AixPPTist/src/api/index.ts @@ -11,7 +11,8 @@ 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() @@ -184,6 +185,19 @@ 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 default PPTApi \ No newline at end of file diff --git a/src/renderer/src/AixPPTist/src/views/Editor/CanvasTool/MediaInput.vue b/src/renderer/src/AixPPTist/src/views/Editor/CanvasTool/MediaInput.vue index 371447a..c08635b 100644 --- a/src/renderer/src/AixPPTist/src/views/Editor/CanvasTool/MediaInput.vue +++ b/src/renderer/src/AixPPTist/src/views/Editor/CanvasTool/MediaInput.vue @@ -7,19 +7,44 @@ /> @@ -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('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; +} +} diff --git a/src/renderer/src/AixPPTist/src/views/Editor/CanvasTool/index.vue b/src/renderer/src/AixPPTist/src/views/Editor/CanvasTool/index.vue index 1334688..9f03ff0 100644 --- a/src/renderer/src/AixPPTist/src/views/Editor/CanvasTool/index.vue +++ b/src/renderer/src/AixPPTist/src/views/Editor/CanvasTool/index.vue @@ -156,7 +156,7 @@ 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' const mainStore = useMainStore() const { creatingElement, creatingCustomShape, showSelectPanel, showSearchPanel, showNotesPanel } = storeToRefs(mainStore) const { canUndo, canRedo } = storeToRefs(useSnapshotStore()) @@ -188,9 +188,16 @@ 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) => {