From 757edb0f67d5a249e188fc35f4853d9cb4346d3f Mon Sep 17 00:00:00 2001
From: zhuhao <979263092@qq.com>
Date: Tue, 10 Dec 2024 10:40:08 +0800
Subject: [PATCH] =?UTF-8?q?=E6=94=B9=E5=90=8DAIPPT?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/prepare/container/kj-list-item.vue  |  13 +-
 src/renderer/src/views/prepare/index.vue      | 198 +++++++++++++-----
 2 files changed, 163 insertions(+), 48 deletions(-)

diff --git a/src/renderer/src/views/prepare/container/kj-list-item.vue b/src/renderer/src/views/prepare/container/kj-list-item.vue
index b874549..14beb53 100644
--- a/src/renderer/src/views/prepare/container/kj-list-item.vue
+++ b/src/renderer/src/views/prepare/container/kj-list-item.vue
@@ -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 {
diff --git a/src/renderer/src/views/prepare/index.vue b/src/renderer/src/views/prepare/index.vue
index 43ff14a..e8e609f 100644
--- a/src/renderer/src/views/prepare/index.vue
+++ b/src/renderer/src/views/prepare/index.vue
@@ -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,13 +202,15 @@ 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' // 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()
-
 const toolStore = useToolState()
 const fs = require('fs')
 const { ipcRenderer } = window.electron || {}
-
 export default {
   name: 'Prepare',
   components: {
@@ -254,7 +266,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: {
@@ -473,6 +501,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,
@@ -499,57 +638,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(()=>{