From a102948e42134580ecdd36ebb4578755d0a3211f Mon Sep 17 00:00:00 2001 From: Flex <q1406482700@163.com> Date: 星期五, 13 六月 2025 15:36:20 +0800 Subject: [PATCH] 修改数字人默认显示 --- easegen-front/src/views/chooseTemplate/index.vue | 679 +++++++++++++++++++++++++++++++------------------------ 1 files changed, 382 insertions(+), 297 deletions(-) diff --git a/easegen-front/src/views/chooseTemplate/index.vue b/easegen-front/src/views/chooseTemplate/index.vue index 5f037d8..59ed3b1 100644 --- a/easegen-front/src/views/chooseTemplate/index.vue +++ b/easegen-front/src/views/chooseTemplate/index.vue @@ -16,7 +16,7 @@ @blur="saveEdit" @keydown.enter="saveEdit" /> - + <!-- 濡傛灉涓嶅湪缂栬緫锛屾樉绀烘枃鏈� --> <div v-else @@ -110,7 +110,13 @@ /> <!-- 鏁板瓧浜�(鏈夊垯鏄剧ず) --> <el-image - v-if="element.digitalHuman?.show && element.digitalHuman?.host" + v-if=" + element.digitalHuman?.show && + element.digitalHuman?.host && + element.digitalHuman?.host.fixVideoUrl !== null && + element.digitalHuman?.host.pictureUrl !== null && + element.digitalHuman?.host.videoUrl !== null + " class="host" :style="{ width: element.digitalHuman.w * (thumViewSize.width / 800) + 'px', @@ -193,7 +199,7 @@ :src="selectPPT.pictureUrl" style="z-index: 1" /> - + <!-- 鐢讳腑鐢� --> <Vue3DraggableResizable :key="selectPPT.digitalHuman.x + '-' + selectPPT.digitalHuman.y" @@ -231,7 +237,13 @@ </Vue3DraggableResizable> <!-- 鏁板瓧浜� --> <Vue3DraggableResizable - v-if="selectPPT.digitalHuman.show == true && selectPPT.digitalHuman?.host" + v-if=" + selectPPT.digitalHuman.show == true && + selectPPT.digitalHuman?.host && + selectPPT.digitalHuman?.host.fixVideoUrl !== null && + selectPPT.digitalHuman?.host.pictureUrl !== null && + selectPPT.digitalHuman?.host.videoUrl !== null + " :parent="false" :lockAspectRatio="true" :minW="350" @@ -270,7 +282,13 @@ </el-icon> </Vue3DraggableResizable> <Vue3DraggableResizable - v-if="selectPPT.digitalHuman.show == false && selectPPT.digitalHuman?.host" + v-if=" + selectPPT.digitalHuman.show == false && + selectPPT.digitalHuman?.host && + selectPPT.digitalHuman?.host.fixVideoUrl !== null && + selectPPT.digitalHuman?.host.pictureUrl !== null && + selectPPT.digitalHuman?.host.videoUrl !== null + " :parent="false" :lockAspectRatio="true" :minW="350" @@ -584,7 +602,7 @@ </el-select> </div> </div> - <div class="SoundModelArea" v-loading="soundLoading"> + <div class="SoundModelArea" v-loading="soundLoading" v-show="ChangeSoundTypeList?.value === 2 " > <div class="SoundModelAreaBox" v-for="(value, key, index) in audioList" :key="index"> <div class="SoundClassTit"> <el-divider content-position="center"> {{ languageClass(key) }} </el-divider> @@ -625,7 +643,7 @@ </div> </div> </div> - <div class="ButtonArea"> + <div class="ButtonArea" v-show="ChangeSoundTypeList?.value === 2" > <el-button type="primary" @click="submitForm">{{ t('common.ok') }}</el-button> </div> </div> @@ -696,7 +714,7 @@ </el-dialog> </div> </template> - + <script lang="ts" setup> import { ref, reactive, onMounted, computed, watch, nextTick, shallowRef } from 'vue' import draggable from 'vuedraggable' @@ -748,7 +766,7 @@ import { ElMessage, ElMessageBox } from 'element-plus' import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict' import { any } from 'vue-types' - + const editorHtml = useEditorHtml() const router = useRouter() const route = useRoute() @@ -775,6 +793,11 @@ } const hostValue = ref({}) const chooseHost = (item) => { + if (PPTArr.value.length === 0) { + message.warning('璇峰厛涓婁紶ppt') + return false + } + // 鏁板瓧浜洪粯璁ゆ墍鏈夐〉锛屾病鏈夊綋鍓嶉〉閫夐」 hostValue.value = item chooseHost1(2) @@ -795,13 +818,15 @@ hostList.value.forEach((el) => { el.isActive = el.id === host.id }) - + const pagesToUpdate = applyAllHost.value ? PPTArr.value : [selectPPT.value] - + pagesToUpdate.forEach((page) => { page.digitalHuman.host = host initHumanPositon(host, page.digitalHuman) }) + + selectPPT.value = PPTArr.value[0] } const saveEdit = () => { isEditing.value = false @@ -814,22 +839,22 @@ width: 800, height: (800 * 9) / 16 }) - + const thumViewSize = reactive({ width: 152, height: (152 * 9) / 16 }) - + const digitalHumanSize = reactive({ width: 640, height: 360 }) - + const scaleRatio = computed(() => ({ width: courseInfo.value.width / viewSize.width, height: courseInfo.value.height / viewSize.height })) - + const courseInfo = ref({ id: 0, accountId: userId.value, @@ -842,7 +867,7 @@ width: 1920, height: 1080 }) - + watch( () => courseInfo.value.aspect, (newAspect) => { @@ -850,15 +875,15 @@ courseInfo.value.height = newAspect === '16:9' ? 1080 : 1920 } ) - + const state = reactive({ dragging: false }) - + const TEMPLATE_PRESETS = ref([]) const templates = ref([]) const selectTemplate = ref([]) - + const tabs1 = [ { itemName: t('courseCenter.model'), @@ -916,17 +941,17 @@ queryParams1.zg = tabs4ActiveNum.value getList1() } - + const tabs2Click = (item) => { tabs2ActiveNum.value = item.itemValue getList() } - + const tabs3Click = (item) => { tabs3ActiveNum.value = item.itemValue getList() } - + const rightTools = reactive([ { name: t('courseCenter.template'), @@ -960,7 +985,7 @@ // isActive: false // } ]) - + const showHeadImageTool = ref(false) const showDigitalHumanTool = ref(false) // 澹伴煶 @@ -975,7 +1000,7 @@ templateSelection.value = template console.log(templateSelection.value) } - + const handleTemplateSelection1 = (index) => { if (index == 2) { applyAllTemplate.value = true @@ -1004,7 +1029,7 @@ getList1() } else if (item.name == t('courseCenter.sound')) { // 澹伴煶鐨勫鐞� selectAudio - + if (selectLanguage.value === undefined) { // 鑾峰彇璇█绉嶇被 getLanguageList() @@ -1048,7 +1073,7 @@ audioType.value = list changeAudio.value = list[0].value } - + // 鍙�夌殑澹伴煶绫诲埆鍒楄〃 const SoundTypeList = ref() // 褰撳墠閫夋嫨鐨勫0闊崇被鍒� @@ -1060,8 +1085,8 @@ ChangeSoundTypeList.value = { ...res[0] } } if (ChangeSoundTypeList.value === undefined) { - // 鑾峰彇鍙�夌殑澹伴煶绫诲瀷鍒楄〃 - GetSoundTypeList() + // 鑾峰彇鍙�夌殑澹伴煶绫诲瀷鍒楄〃 + GetSoundTypeList() } //鍙�夌殑澹伴煶妯″瀷鐨勫0闊崇被鍒垪琛� const SoundvoiceTypeList = ref() @@ -1114,7 +1139,7 @@ } }) console.log(LanguageArr) - + audioList.value = LanguageArr total.value = data.total if (selectList.value !== undefined && selectList.value !== null) { @@ -1125,7 +1150,7 @@ SoundcurrentAudio.value.pause() SoundcurrentAudio.value = null } - + // 閲嶇疆褰撳墠鎾斁鐘舵�� if (SoundcurrentlyPlaying.value) { SoundcurrentlyPlaying.value.isPlay = false @@ -1163,7 +1188,7 @@ SoundTypeList.value.forEach((element) => { if (element.value === event) { ChangeSoundTypeList.value = { ...element } - + if (selectList.value !== undefined && selectList.value !== null) { selectList.value = null //鍒濆鍖� } @@ -1172,7 +1197,7 @@ SoundcurrentAudio.value.pause() SoundcurrentAudio.value = null } - + // 閲嶇疆褰撳墠鎾斁鐘舵�� if (SoundcurrentlyPlaying.value) { SoundcurrentlyPlaying.value.isPlay = false @@ -1215,7 +1240,7 @@ message.warning('璇烽�夋嫨澹伴煶妯″瀷') return false } - + selectAudio(selectList.value) } else if (ChangeSoundTypeList.value.value === 1) { // 娓呴櫎閫変腑鐨勯煶棰� @@ -1226,19 +1251,19 @@ // item.isSelect = false // }) // } - + // 鍋滄褰撳墠鎾斁鐨勯煶棰� if (SoundcurrentAudio.value) { SoundcurrentAudio.value.pause() SoundcurrentAudio.value = null } - + // 閲嶇疆褰撳墠鎾斁鐘舵�� if (SoundcurrentlyPlaying.value) { SoundcurrentlyPlaying.value.isPlay = false SoundcurrentlyPlaying.value = null } - + selectAudio(undefined) } // 璁板綍鐢ㄦ埛閫夋嫨鐨勫0闊充俊鎭� @@ -1248,9 +1273,9 @@ type: ChangeSoundTypeList.value, //绫诲瀷 model: selectList.value !== undefined ? selectList.value : '' //澹伴煶妯″瀷 } - + // SoundTool.value = false - + // rightTools.forEach((child) => { // if (child.name == '澹伴煶' || child.name == 'sound') { // child.isActive = false @@ -1272,37 +1297,37 @@ } }) } - + // 闊抽绠$悊 const SoundcurrentAudio = ref<HTMLAudioElement | null>(null) const SoundcurrentlyPlaying = ref<any>(null) - + const playAudio = async (item: any) => { // 濡傛灉鐐瑰嚮鐨勬槸褰撳墠姝e湪鎾斁鐨勯」鐩紝鍒欐殏鍋� if (SoundcurrentlyPlaying.value && SoundcurrentlyPlaying.value.id === item.id) { SoundpauseAudio(item) return } - + // 鍋滄褰撳墠鎾斁鐨勯煶棰� if (SoundcurrentAudio.value) { SoundcurrentAudio.value.pause() SoundcurrentAudio.value = null } - + // 濡傛灉涔嬪墠鏈夋挱鏀剧殑椤圭洰锛岄噸缃叾鐘舵�� if (SoundcurrentlyPlaying.value) { SoundcurrentlyPlaying.value.isPlay = false } - + // 璁剧疆鏂扮殑鎾斁椤圭洰 SoundcurrentlyPlaying.value = item item.isPlay = true - + // 鍒涘缓鏂扮殑闊抽瀵硅薄骞舵挱鏀� SoundcurrentAudio.value = new Audio(item.auditionUrl) SoundcurrentAudio.value.play() - + // 娣诲姞鎾斁缁撴潫浜嬩欢鐩戝惉 SoundcurrentAudio.value.addEventListener('ended', () => { item.isPlay = false @@ -1310,7 +1335,7 @@ SoundcurrentAudio.value = null }) } - + const SoundpauseAudio = (item: any) => { if ( SoundcurrentAudio.value && @@ -1322,14 +1347,14 @@ SoundcurrentlyPlaying.value = null } } - + const PPTArr = ref([]) const percentagePPT = ref(0) const showLeftList = ref(true) - + //鏄惁杩涜杩囧垹闄ゆ搷浣� const DeleteD = ref(false) - + const selectPPT = ref({ pictureUrl: '', innerPicture: { @@ -1367,46 +1392,46 @@ host: null } }) - + const videoText = ref(0) const videoDuration = ref('') - + watch( () => PPTArr.value, (val) => { if (!val) return - + videoText.value = val.reduce((prev, curr) => { if (!curr.pptRemark) return prev const plainText = curr.pptRemark.replace(/<[^>]+>/g, '') return prev + plainText.length }, 0) - + let videoTime = (videoText.value / 200) * 60 videoDuration.value = formateVideoTime(Math.ceil(videoTime)) }, { deep: true } ) - + const formateVideoTime = (times: any) => { let hours: any = parseInt(`${times / 60 / 60}`) let restMinutes: any = parseInt(`${(times / 60) % 60}`) let seconds: any = parseInt(`${times % 60}`) - + if (hours < 10) hours = '0' + hours if (restMinutes < 10) restMinutes = '0' + restMinutes if (seconds < 10) seconds = '0' + seconds - + return hours + ':' + restMinutes + ':' + seconds } - + const uploadRef = ref() const headers = { Accept: 'application/json, text/plain, */*', Authorization: 'Bearer ' + getAccessToken(), 'tenant-id': getTenantId() } - + const uploadFileObj = reactive({ filename: '', size: 0, @@ -1418,7 +1443,7 @@ extInfo: '{"addMode":true,"docType":1,"pptNotes":true,"pptContent":false,"notesPolish":false}', resolveType: 1 }) - + //鏅鸿兘璁茬缁勪欢begin //娣诲姞ref const rewriterRef = ref() @@ -1460,14 +1485,14 @@ file.uid = genFileId() uploadRef.value!.handleStart(file) } - + const handleChange = (files) => { const extension = files.name.split('.').pop().toLowerCase() uploadFileObj.docType = extension === 'pdf' ? 2 : 1 uploadFileObj.filename = files.name uploadFileObj.size = files.size } - + const uploadExplainRef = ref() const handleSuccess = (rawFile) => { message.success('涓婁紶鎴愬姛锛�') @@ -1475,12 +1500,12 @@ uploadExplainRef.value.open() uploadRef.value!.clearFiles() } - + const handleError = (err) => { message.error('涓婁紶澶辫触锛岃閲嶈瘯') console.error('Upload error:', err) } - + const uploadSubmit = (uploadForm) => { pptTemplateApi.createPPT(uploadFileObj).then((res) => { if (res) { @@ -1490,7 +1515,7 @@ } }) } - + const chooseTemplate = (currTemplate) => { console.log('currTemplate', currTemplate) selectTemplate.value = cloneDeep(currTemplate) @@ -1500,7 +1525,7 @@ currTemplate.isActive = true applyTemplate() } - + const schedulePPTTimer = ref() const schedulePPT = (id) => { percentagePPT.value = 0 @@ -1530,7 +1555,7 @@ item.businessId = generateUUID() item.width = courseInfo.value.width item.height = courseInfo.value.height - + // 鍒濆鍖栫嫭绔嬬殑鏁板瓧浜洪厤缃� item.digitalHuman = { show: true, @@ -1541,14 +1566,14 @@ active: false, host: selectHost.value } - + let ppturl = item.pictureUrl if (selectTemplate.value.showBackground) { item.pictureUrl = selectTemplate.value.bgImage } else { item.pictureUrl = '' } - + if (item.pictureUrl && selectTemplate.value.showPpt) { item.innerPicture = { name: '鐢讳腑鐢�', @@ -1579,16 +1604,16 @@ } } }) - + PPTArr.value = res PPTArr.value[0].isActive = true selectPPT.value = PPTArr.value[0] showLeftList.value = true clearInterval(schedulePPTTimer.value) - + //ppt浜鸿劯鏍¢獙 PPtIsHaveFace() - + //杞淇濆瓨璇剧▼ /** * 鍚庣鏁版嵁搴撳帇鍔涜繃澶э紝鏆傛椂鍋滄瀹氭椂淇濆瓨 @@ -1598,12 +1623,12 @@ }) }, 2000) } - + const cancelAnalyze = () => { showLeftList.value = true clearInterval(schedulePPTTimer.value) } - + const copyDocument = (item, index) => { ElMessageBox.confirm('鏄惁澶嶅埗璇ラ〉闈紵', '鎻愮ず', { confirmButtonText: '鏄�', @@ -1625,7 +1650,7 @@ }) }) } - + const deleteDocument = (item) => { ElMessageBox.confirm('鏄惁鍒犻櫎璇ラ〉闈紵', '鎻愮ず', { confirmButtonText: '鏄�', @@ -1644,15 +1669,15 @@ }) }) } - + const deleteDigitalHuman = () => { selectPPT.value.digitalHuman.show = false } - + const deleteInnerPicture = () => { selectPPT.value.innerPicture.src = '' } - + const deleteMore = () => { let selected = PPTArr.value.filter((child) => child.isChecked == true) if (selected.length == 0) { @@ -1661,7 +1686,7 @@ PPTArr.value = PPTArr.value.filter((child) => child.isChecked !== true) } } - + const hostList = ref([]) const loading = ref(true) const total = ref(0) @@ -1678,7 +1703,7 @@ zg: '' }) const selectHost = ref(null) - + const getList = async () => { loading.value = true try { @@ -1690,29 +1715,58 @@ data.list.forEach((item) => { item.isActive = false }) - + hostList.value = data.list if (hostList.value.length > 0 && !selectHost.value) { selectHost.value = hostList.value[0] + console.log('selectHost.value', selectHost.value) + if (selectHost.value !== null) { + selectHost.value.fixVideoUrl = null + selectHost.value.pictureUrl = null + selectHost.value.videoUrl = null + selectHost.value.id = null + } // 鏇存柊褰撳墠閫変腑PPT鐨勬暟瀛椾汉 if (selectPPT.value) { selectPPT.value.digitalHuman.host = selectHost.value } } - + total.value = data.total } finally { loading.value = false } } - + +// 鎵�鏈夋暟瀛椾汉褰㈣薄 +const AllHumanList = ref<any[]>([]) +// 鑾峰彇鎵�鏈夋暟瀛椾汉褰㈣薄 +const GetAllHumanList = () => { + let query = { + pageNo: 1, + pageSize: 100, + type: '0', + gender: tabs2ActiveNum.value, + posture: tabs3ActiveNum.value, + status: 0 + } + GetHumanList(query) + query.type = '1' + GetHumanList(query) +} +// 鑾峰彇鍗曠被鏁板瓧浜哄舰璞� +const GetHumanList = async (query) => { + let data = await pptTemplateApi.pageList(query) + AllHumanList.value = [...AllHumanList.value, ...data.list] +} + const choosePPt = (item) => { PPTArr.value.forEach((child) => { child.isActive = child.id === item.id }) selectPPT.value = item } - + // const chooseHost = (item) => { // hostList.value.forEach((el) => { // el.isActive = el.id === item.id @@ -1734,14 +1788,14 @@ digitalHuman.y = viewSize.height - digitalHuman.h } } - + const audioSelect = ref() const audioSelectData = ref() - + const openSelect = () => { audioSelect.value.open() } - + const selectAudio = (data) => { console.log(data) audioSelectData.value = data @@ -1753,7 +1807,7 @@ }) } } - + const coursesCreate = () => { const params = { accountId: userId.value @@ -1764,24 +1818,24 @@ } }) } - + const saveTime = ref() - + const getSaveTime = () => { const date = new Date() let h: any = date.getHours() let m: any = date.getMinutes() let s: any = date.getSeconds() - + if (h < 10) h = '0' + h if (m < 10) m = '0' + m if (s < 10) s = '0' + s - + return h + ':' + m + ':' + s } - + const warningDialog = ref() - + const voiceData = reactive({ show: false, speechRate: 1, @@ -1799,36 +1853,37 @@ 2: '2' } }) - + const removeHtmlTags = (html) => { const parser = new DOMParser() const doc = parser.parseFromString(html, 'text/html') return doc.body.textContent || '' } - + const saveSubmit = async (type) => { console.log('鏄惁鍒犻櫎', DeleteD.value) - - if (ChangeSoundTypeList.value.value === 2) { - //姝ゆ椂涓洪�氱敤 - if (selectList.value === undefined || selectList.value === null) { - message.warning('璇烽�夋嫨澹伴煶妯″瀷') - return false - } - } - + if (!PPTArr.value || PPTArr.value.length === 0) { message.warning('鍦烘櫙涓虹┖锛岃鍏堜笂浼燩PT锛�') return false } - + + if ( + selectPPT.value.digitalHuman?.host.fixVideoUrl === null || + selectPPT.value.digitalHuman?.host.pictureUrl === null || + selectPPT.value.digitalHuman?.host.videoUrl === null + ) { + message.error('璇峰厛閫夋嫨鏁板瓧浜�') + return + } + //浜鸿劯鏍¢獙 while (!IsEndCheckFace.value) {} //涓�涓┖寰幆锛屼富瑕佷负浜嗛伩鍏嶆瀬绔儏鍐典笅褰撶敤鎴风偣鍑讳繚瀛樻寜閽垨鑰呰棰戝悎鎴愭寜閽椂锛屼汉鑴告牎楠屾湭瀹屾垚鐨勯棶棰� if (IsHaveFace.value && !DeleteD.value) { message.warning('褰撳墠ppt涓瓨鍦ㄤ汉鑴稿厓绱狅紝涓烘柟渚垮悗缁棰戠敓鎴愶紝璇峰幓闄よ鍏冪礌') return } - + //淇濆瓨璇剧▼ let saveSubmitForm = { accountId: courseInfo.value.accountId, @@ -1846,9 +1901,9 @@ thumbnail: '', subtitlesStyle: '{}' } - + saveSubmitForm.id = courseInfo.value.id - + const scenes = [] const pageInfo = { docInfo: { @@ -1858,18 +1913,18 @@ }, scenes: [] } - + let thumbnail = '' - + PPTArr.value.forEach((item, index) => { try { pageInfo.scenes.push(item.businessId) if (index === 0) { thumbnail = item.pictureUrl } - + item.pptRemark = removeHtmlTags(item.pptRemark) - + const formatItem = { background: { backgroundType: item.backgroundType, @@ -1948,18 +2003,18 @@ }, businessId: item.businessId } - + scenes.push(formatItem) } catch (error) { console.error(`澶勭悊绗� ${index + 1} 涓満鏅椂鍑洪敊:`, error) throw error } }) - + saveSubmitForm.pageInfo = JSON.stringify(pageInfo) saveSubmitForm.thumbnail = thumbnail saveSubmitForm.scenes = cloneDeep(scenes) - + if (type == 'save') { if (DeleteD.value) { //濡傛灉杩涜杩噋pt鍒犻櫎鎿嶄綔鍒欓渶瑕佽繘琛屼簩娆℃煡鐪� @@ -1969,7 +2024,7 @@ return } } - + try { const res = await pptTemplateApi.coursesSave(JSON.stringify(saveSubmitForm)) if (res) { @@ -1985,7 +2040,6 @@ } } else { try { - if ( ChangeSoundTypeList.value?.value === undefined || selectLanguage.value?.value === undefined @@ -1993,13 +2047,26 @@ message.error('璇峰厛閫夋嫨璇涓庡0闊崇被鍨�') return } - + + if (ChangeSoundTypeList.value.value === 2) { + //姝ゆ椂涓洪�氱敤 + if (selectList.value === undefined || selectList.value === null) { + message.warning('璇烽�夋嫨澹伴煶妯″瀷,骞剁偣鍑荤‘瀹氭寜閽‘瀹氭墍閫夊0闊虫ā鍨�') + return false + } + + if (audioSelectData.value == undefined) { + message.warning('璇风偣鍑荤‘瀹氭寜閽‘瀹氭墍閫夊0闊虫ā鍨�') + return false + } + } + const saveResult = await saveSubmit('save') if (!saveResult) { message.error('淇濆瓨澶辫触锛岃閲嶈瘯鍚庡啀鍚堟垚瑙嗛') return } - + let warningStrArr = [] for (let i = 0; i < PPTArr.value.length; i++) { const item = PPTArr.value[i] @@ -2021,12 +2088,12 @@ } } } - + if (warningStrArr.length > 0) { warningDialog.value.open(warningStrArr.map((warning) => `<div>${warning}</div>`).join('')) return } - + try { const res = await pptTemplateApi.megerMedia(saveSubmitForm) if (res) { @@ -2042,59 +2109,59 @@ } } } - + const applyTemplate = (ppt = null) => { const template = selectTemplate.value console.log('template', selectTemplate.value) const pptList = applyAllTemplate.value ? PPTArr.value : [selectPPT.value] - + pptList.forEach((item) => { const originalPPT = item.innerPicture?.src || item.pictureUrl console.log(template) - item.pictureUrl = template.bgImage - item.digitalHuman.show = template.showDigitalHuman - item.digitalHuman.w = template.humanW - item.digitalHuman.h = template.humanH - item.digitalHuman.x = template.humanX - item.digitalHuman.y = template.humanY - PPTArr.value.forEach((otherItem) => { - if (otherItem.templateId === item.templateId) { - otherItem.width = item.width - otherItem.height = item.height - } - }) - if (template.showPpt) { - item.innerPicture = { - name: '鐢讳腑鐢�', - src: originalPPT, - cover: template.bgImage, - width: template.pptW, - height: template.pptH, - top: template.pptY, - marginLeft: template.pptX, - category: 1, - depth: 1, - businessId: generateUUID(), - entityType: 1, - originHeight: courseInfo.value.height, - originWidth: courseInfo.value.width, - entityId: 1, - templateId: template.id - } + item.pictureUrl = template.bgImage + item.digitalHuman.show = template.showDigitalHuman + item.digitalHuman.w = template.humanW + item.digitalHuman.h = template.humanH + item.digitalHuman.x = template.humanX + item.digitalHuman.y = template.humanY + PPTArr.value.forEach((otherItem) => { + if (otherItem.templateId === item.templateId) { + otherItem.width = item.width + otherItem.height = item.height } + }) + if (template.showPpt) { + item.innerPicture = { + name: '鐢讳腑鐢�', + src: originalPPT, + cover: template.bgImage, + width: template.pptW, + height: template.pptH, + top: template.pptY, + marginLeft: template.pptX, + category: 1, + depth: 1, + businessId: generateUUID(), + entityType: 1, + originHeight: courseInfo.value.height, + originWidth: courseInfo.value.width, + entityId: 1, + templateId: template.id + } + } }) } - + const replaceDialog = ref(null) - + const openReplaceDialog = () => { replaceDialog.value.open() } - + const escapeRegExp = (string) => { return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&') } - + const handleReplacement = (replacements) => { PPTArr.value.forEach((item) => { if (item.pptRemark) { @@ -2107,76 +2174,93 @@ }) message.success('鎵归噺鏇挎崲鎴愬姛锛�') } - + const showAudioPlay = ref(false) const showAudioPlay1 = ref(false) const startAudioPlay = ref(false) const textareaRef = ref() const selectTextarea = ref('') - + const audioExceed = () => { message.warning('鏈�澶氫笂浼犱竴涓0闊抽┍鍔ㄦ枃浠讹紒') } - -const currentAudio = ref() - -const createAudio = async () => { - if (ChangeSoundTypeList.value?.value === undefined || selectLanguage.value?.value === undefined || selectLanguage.value.value === 'all_Language' ) { - message.error('璇峰厛閫夋嫨璇涓庡0闊崇被鍨�') - return - } - - if (ChangeSoundTypeList.value.value === 2) { - //姝ゆ椂涓洪�氱敤 - if (selectList.value === undefined || selectList.value === null) { - message.warning('璇烽�夋嫨澹伴煶妯″瀷') - return false - } - } - if( ChangeSoundTypeList.value.value === 1 ){ - if( selectPPT.value.digitalHuman.host === null || selectPPT.value.digitalHuman.host.id === undefined || selectPPT.value.digitalHuman.host.id === null ){ - message.warning('璇烽�夋嫨鏁板瓧浜�') - return false - } - } - +const currentAudio = ref() + +const createAudio = async () => { + const text = editorRef.value.getText() if (!text) { message.warning('璇疯緭鍏ラ渶瑕佽瘯鍚枃鏈殑鍐呭鈥�') return false } - + + if ( + ChangeSoundTypeList.value?.value === undefined || + selectLanguage.value?.value === undefined || + selectLanguage.value.value === 'all_Language' + ) { + message.error('璇峰厛閫夋嫨璇涓庡0闊崇被鍨�') + return + } + + console.log(ChangeSoundTypeList.value.value) + console.log(selectList.value) + + if (ChangeSoundTypeList.value.value === 2) { + //姝ゆ椂涓洪�氱敤 + if (selectList.value === undefined || selectList.value === null) { + message.warning('璇烽�夋嫨澹伴煶妯″瀷,骞剁偣鍑荤‘瀹氭寜閽‘瀹氭墍閫夊0闊虫ā鍨�') + return false + } + + if (audioSelectData.value == undefined) { + message.warning('璇风偣鍑荤‘瀹氭寜閽‘瀹氭墍閫夊0闊虫ā鍨�') + return false + } + } + + if (ChangeSoundTypeList.value.value === 1) { + if ( + selectPPT.value.digitalHuman.host === null || + selectPPT.value.digitalHuman.host.id === undefined || + selectPPT.value.digitalHuman.host.id === null + ) { + message.warning('璇烽�夋嫨鏁板瓧浜�') + return false + } + } + const truncatedText = text.length > 100 ? text.substring(0, 100) : text - + const params = { text: truncatedText, humanId: selectPPT.value.digitalHuman?.host?.id || null, voiceId: audioSelectData.value == undefined ? null : audioSelectData.value[0].id, language: selectLanguage.value?.value } - + if (ChangeSoundTypeList.value.value === 2) { //姝ゆ椂閫夊彇浜嗗0闊虫ā鍨� params.humanId = null } else if (ChangeSoundTypeList.value.value === 1) { params.voiceId = null } - + try { showAudioPlay1.value = true const res = await pptTemplateApi.createAudio(params) - + if (res && !res.error) { showAudioPlay1.value = false showAudioPlay.value = true - + currentAudio.value = new Audio(res) currentAudio.value.addEventListener('ended', () => { showAudioPlay.value = false currentAudio.value = null }) - + currentAudio.value.play() } else { showAudioPlay1.value = false @@ -2186,37 +2270,37 @@ showAudioPlay1.value = false } } - + const pauseAudio = () => { currentAudio.value.pause() currentAudio.value = null showAudioPlay.value = false } - + const currentAudioFile = ref() - + const audioPlay = (file) => { if (!file.response.data) { message.error('鏈幏鍙栧埌鏂囦欢') return } - + if (currentAudioFile.value) { currentAudioFile.value.pause() currentAudioFile.value.currentTime = 0 } - + const audio = new Audio(file.response.data) currentAudioFile.value = audio - + audio.addEventListener('ended', () => { cancelAudio() }) - + startAudioPlay.value = true audio.play() } - + const cancelAudio = () => { if (currentAudioFile.value) { currentAudioFile.value.pause() @@ -2225,7 +2309,7 @@ } startAudioPlay.value = false } - + const goBack = () => { if (PPTArr.value.length == 0) { pptTemplateApi.coursesDelete(courseInfo.value.id).then((res) => { @@ -2235,17 +2319,17 @@ router.go(-1) } } - + const editorRef = shallowRef() const editorConfig = { placeholder: '璇疯緭鍏ュ唴瀹�...' } - + const handleCreated = (editor) => { editorRef.value = editor } - + const dialogVisible = ref(false) const textList = ref([]) - + const handleWord = () => { editorRef.value.focus() selectTextarea.value = editorRef.value.getSelectionText() @@ -2265,7 +2349,7 @@ message.warning(`${selectTextarea.value}涓嶆槸澶氶煶瀛梎) } } - + const handleTag = (name) => { dialogVisible.value = false const node = { @@ -2280,7 +2364,7 @@ const onDragMove = (evt, data) => { console.log(evt) console.log(data) - + // 闄愬埗鍧愭爣 if (data.x < -100) { data.x = -100 // 鍙互璁剧疆鏈�灏忓潗鏍囦负 -100 @@ -2289,13 +2373,12 @@ data.y = -100 // 鍙互璁剧疆鏈�灏忓潗鏍囦负 -100 } } - + const getCourseDetail = async (id) => { const res = await pptTemplateApi.coursesDetail(id) - console.log( "res褰撳墠淇℃伅", res ) + console.log('res褰撳墠淇℃伅', res) if (res) { courseInfo.value = res - if (res.scenes && res.scenes.length > 0) { res.scenes.forEach((item) => { item.isActive = false @@ -2305,7 +2388,7 @@ item.backgroundType = item.background.backgroundType item.width = item.background.width item.height = item.background.height - + const hostInfo = item.components.find((p) => p.category == 2) if (hostInfo) { item.digitalHuman = { @@ -2316,13 +2399,13 @@ h: hostInfo.height / scaleRatio.value.height, active: false, host: { - ...hostList.value.find((h) => h.code === hostInfo.entityId), + ...AllHumanList.value.find((h) => h.code === hostInfo.entityId), code: hostInfo.entityId, type: hostInfo.entityType } } } - + const innerPicture = item.components.find((p) => p.category == 1) if (innerPicture) { item.innerPicture = { @@ -2334,11 +2417,11 @@ } } }) - + PPTArr.value = res.scenes PPTArr.value[0].isActive = true selectPPT.value = PPTArr.value[0] - + PPTArr.value.forEach((scene, index) => { if (res.scenes[index].voice) { scene.selectAudio = res.scenes[index].voice @@ -2347,7 +2430,7 @@ } scene.uploadAudioUrl = res.scenes[index].audioDriver?.audioUrl }) - + if (PPTArr.value[0].audioDriver?.fileName && PPTArr.value[0].audioDriver?.audioUrl) { selectPPT.value.fileList = [ { @@ -2356,7 +2439,7 @@ } ] } - + // 璁剧疆闊抽閫夋嫨鏁版嵁 const firstScene = res.scenes[0] if (firstScene.voice) { @@ -2369,7 +2452,7 @@ ] } } - + const pageInfo = res.pageInfo ? JSON.parse(res.pageInfo) : '' uploadFileObj.filename = pageInfo ? pageInfo.docInfo.fileName : '' uploadFileObj.size = pageInfo ? pageInfo.docInfo.fileSize : '' @@ -2396,19 +2479,21 @@ showDigitalHuman: item.showDigitalHuman === 1, showPpt: item.showPpt === 1 })) - + templates.value = TEMPLATE_PRESETS.value.map((template) => cloneDeep(template)) selectTemplate.value = cloneDeep(templates.value[0]) - + await getList() - + + GetAllHumanList() + if (route.query.id) { await getCourseDetail(route.query.id) } else { coursesCreate() } }) - + onUnmounted(() => { if (schedulePPTTimer.value) { clearInterval(schedulePPTTimer.value) @@ -2419,19 +2504,19 @@ } }) </script> - + <style scoped lang="scss"> .pages { height: 100%; background-color: #f5f7fa; } - + .minddle-host-image { z-index: 5; width: 100%; height: 100%; } - + .template-top { display: flex; height: 60px; @@ -2441,57 +2526,57 @@ border: 1px solid #ebeef5; box-shadow: 0 3px 6px rgb(175 175 175 / 16%); justify-content: space-between; - + .top-left { display: flex; align-items: center; - + .top-icon { display: flex; align-items: center; } - + .back-text { margin-right: 20px; margin-left: 10px; cursor: pointer; } - + span { margin: 0 25px; } } - + .top-right { span { margin: 0 20px; } } } - + .template-main { display: flex; height: calc(100% - 82px); padding: 10px; justify-content: space-around; - + .template-left { position: relative; width: 180px; background-color: #fff; border: 1px solid #ebeef5; box-shadow: 0 3px 6px rgb(175 175 175 / 16%); - + .page { margin: 0; - + div { padding: 5px 10px; margin: 0; line-height: 30px; border-bottom: 1px solid #ebeef5; } - + .line { width: 30px; height: 3px; @@ -2499,12 +2584,12 @@ margin: 0; background-color: aqua; } - + .upload-demo { text-align: center; } } - + .left-upload-setting { display: flex; height: calc(100% - 86px); @@ -2513,32 +2598,32 @@ flex-direction: column; justify-content: center; align-items: center; - + div { line-height: 40px; } - + ::v-deep(.el-progress-bar) { width: 180px; } - + .el-button { margin: 20px 0; } } - + .image-list { height: calc(100% - 70px); padding: 10px; overflow: hidden auto; border-bottom: 1px solid #ebeef5; - + .list { position: relative; height: calc(152px * 9 / 16); margin: 20px 0; box-sizing: content-box; - + .list-index { position: absolute; top: 10px; @@ -2552,7 +2637,7 @@ background: #122121; border-radius: 5px; } - + .background { position: absolute; width: 100%; @@ -2564,16 +2649,16 @@ height: 100%; background-color: rgba(0, 0, 0, 0); } - + .ppt-bg { z-index: 2; } - + .host { position: absolute; z-index: 3; } - + .icon-content { position: absolute; top: 0; @@ -2585,7 +2670,7 @@ } } } - + .page-btn { position: absolute; bottom: 10px; @@ -2593,7 +2678,7 @@ padding: 0 10px; } } - + .template-middle { display: flex; width: 56%; @@ -2602,36 +2687,36 @@ flex-grow: 1; flex-direction: column; justify-content: flex-start; - + .middle-top { padding: 5px 20px; } - + .main-box { display: flex; padding: 10px 20px; border: 1px solid #ebeef5; justify-content: center; - + .main-image-box { position: relative; border: 1px solid #ebeef5; box-sizing: content-box; } - + .list { position: relative; display: flex; width: 95%; justify-content: center; } - + .ppt-bg { z-index: 2; width: 100%; height: 100%; } - + .host { position: absolute; right: 0; @@ -2639,41 +2724,41 @@ width: 300px; } } - + .voice-main { display: flex; justify-content: space-between; padding: 10px; - + .media-box { display: flex; align-items: center; } } - + .audio-upload { display: flex; align-items: center; justify-content: center; height: 200px; } - + .middle-textarea { padding: 5px 20px; } - + .tool-box { display: flex; padding: 10px; border-top: 1px solid #ebeef5; justify-content: space-between; - + .tool-btn { display: flex; align-items: center; } } - + .audio-play { position: absolute; top: 0; @@ -2690,25 +2775,25 @@ flex-direction: column; } } - + .template-right { position: relative; width: 20%; background-color: #fff; box-shadow: 0 3px 6px rgb(175 175 175 / 16%); - + .tabs-1 { display: flex; justify-content: space-around; padding: 10px 30px; border-bottom: 1px solid #ebeef5; - + .tabs-item { width: 50px; font-size: 14px; text-align: center; cursor: pointer; - + span { display: block; width: 50px; @@ -2718,12 +2803,12 @@ } } } - + .tabs-2 { display: flex; padding: 10px; justify-content: space-around; - + div { width: 60px; height: 30px; @@ -2732,13 +2817,13 @@ cursor: pointer; border-radius: 5px; } - + .tabs-active { color: #fff !important; background-color: #409eff; } } - + .apply-all { position: absolute; bottom: 80px; @@ -2746,12 +2831,12 @@ width: 100%; justify-content: center; } - + .host-list { height: 80%; overflow-y: auto; border-top: 1px solid #ebeef5; - + .host-item { position: relative; display: inline-block; @@ -2759,7 +2844,7 @@ margin: 5px 0; margin-left: 10px; cursor: pointer; - + .background { position: absolute; top: 0; @@ -2769,7 +2854,7 @@ height: 100%; background-color: #f0f1fa; } - + .host-name { position: absolute; bottom: 10px; @@ -2783,7 +2868,7 @@ background: rgb(225 225 225 / 70%); border-radius: 5px; } - + .ppt-bg { z-index: 2; width: 100%; @@ -2792,31 +2877,31 @@ } } } - + .image-setting { padding: 10px 20px; - + .img-setting { display: flex; align-items: center; line-height: 40px; - + .setting-label { width: 120px; } - + ::v-deep(.el-input) { width: 170px; margin-left: 10px; } } } - + .template-list { height: 90%; overflow-y: auto; border-top: 1px solid #ebeef5; - + .template-item { position: relative; display: inline-block; @@ -2842,14 +2927,14 @@ position: absolute; z-index: 2; } - + .human-image { position: absolute; z-index: 3; } } } - + .background { position: absolute; top: 0; @@ -2859,25 +2944,25 @@ height: 100%; //background-color: #f0f1fa; } - + .template-tool { width: 60px; padding: 10px; background-color: #fff; box-shadow: 0 3px 6px rgb(175 175 175 / 16%); - + .tool-item { display: flex; padding: 10px 20px; cursor: pointer; flex-direction: column; align-items: center; - + img { width: 32px; height: 32px; } - + .tool-name { width: 60px; margin-top: 6px; @@ -2888,47 +2973,47 @@ } } } - + ::v-deep(.el-pagination) { position: absolute; bottom: 0; } - + ::-webkit-scrollbar { width: 4px; } - + ::-webkit-scrollbar-thumb { background-color: #888; border-radius: 6px; } - + ::-webkit-scrollbar-track { background-color: #f2f2f2; border-radius: 6px; } - + .voice-card { z-index: 1000 !important; } - + .voice-card :deep(.el-card__body) { padding: 0; } - + .speech-slider { &:deep(.el-slider__bar) { display: none; } - + &:deep(.el-slider__runway) { height: 2px; } - + &:deep(.el-slider__button-wrapper) { top: -17px; } - + &:deep(.el-slider__marks-stop) { top: -5px; width: 12px; @@ -2939,7 +3024,7 @@ .dialog-footer { float: right; } - + // 澹伴煶閮ㄥ垎 .SoundArea { margin-top: 16px; @@ -2963,7 +3048,7 @@ height: 86%; margin: 10px 0; overflow-y: scroll; - + .SoundModelAreaBox { width: 100%; .SoundClassTit { @@ -3043,4 +3128,4 @@ } } } -</style> \ No newline at end of file +</style> -- Gitblit v1.9.3