Merge pull request 'zxl' (#180) from zxl into main

Reviewed-on: #180

src/renderer/src/AixPPTist/src/api/gridPic.ts

@@ -0,0 +1,47 @@
+export default class gridPic {
+    private static Instance: gridPic | null = null;
+    private gridPicRef: any = null;
+
+    constructor(elRef?: any) {
+        if (elRef) {
+            this.gridPicRef = elRef;
+        }
+        if (!gridPic.Instance) {
+            gridPic.Instance = this;
+        }
+        return gridPic.Instance;
+    }
+
+    // 初始化
+    init(elRef) {
+        if (elRef) {
+            this.gridPicRef = elRef;
+        }
+        return this;
+    }
+
+    addPIc(data) {
+        if (this.gridPicRef && this.gridPicRef.value && typeof this.gridPicRef.value.addPic === 'function') {
+            this.gridPicRef.value.addPic(data);
+        }
+        return this;
+    }
+
+    // 静态方法 - 初始化
+    static init(elRef) {
+        if (!gridPic.Instance) {
+            gridPic.Instance = new gridPic(elRef);
+        } else {
+            gridPic.Instance.init(elRef);
+        }
+        return gridPic.Instance;
+    }
+
+    // 静态方法 - 打开推图上屏幕
+    static addPIc(data) {
+        if (gridPic.Instance) {
+            return gridPic.Instance.addPIc(data);
+        }
+        return null;
+    }
+}

src/renderer/src/AixPPTist/src/api/index.ts

@@ -274,6 +274,7 @@ export class PPTApi {
   static  toRousrceUrl =async (o:any) => {
       const formData = new FormData()
       formData.append('file', o)
+      formData.append('ral', true)
       const res = await Api_server.Other.uploadFile(formData)
       if (res && res.code == 200){
         const url = res?.url

src/renderer/src/AixPPTist/src/api/types.ts

@@ -132,6 +132,8 @@ export class MsgEnum {
     MSG_dz : 'dz',
     /** @desc: 疑惑 */
     MSG_yh : 'yh',
+    /** @desc: 推图片上屏 */
+    MSG_pushSreen_ImgList : 'pushSreen_ImgList',
     // === 新定义-消息头 ===
     /** @desc: 课程创建-待开课 */
     MSG_0000: 0x0000,

src/renderer/src/AixPPTist/src/api/watcher.ts

@@ -12,9 +12,10 @@ import Classcourse from './classcourse' // 课程相关
 import msgUtils from '@/plugins/modal' // 消息工具
 import * as dialogUtils from '@/utils/dialog' // 弹窗-函数
 import { Homework } from './index' // api-作业相关
-// import emitter from '@/utils/mitt' //mitt 事件总线
+import emitter from '@/utils/mitt' //mitt 事件总线
 import useExecPlay from '../views/Screen/hooks/useExecPlay' // 播放控制
 import hooksUpvote from './upvote' // 点赞-工具
+import gridPic from './gridPic' // 上屏-工具
 
 /**
  * @description 监听器
@@ -98,6 +99,7 @@ export default () => {
           }
           break
         case MsgEnum.HEADS.MSG_slideFlapping: // 幻灯片翻页
+          emitter.emit('closegridPic')
           const slideIndex = content?.current || 0
           const type = content?.animation // 上下动作
           const steps = content?.animationSteps // 动画步骤
@@ -128,6 +130,10 @@ export default () => {
         case MsgEnum.HEADS.MSG_yh: // 疑惑
           hooksUpvote.trigger(2)
           break
+          case MsgEnum.HEADS.MSG_pushSreen_ImgList: // 推图片上屏
+          const imgArray = content.ImgList.map((obj) => obj.url);
+          emitter.emit('opengridPic',{arr:imgArray})
+          break
         case MsgEnum.HEADS.MSG_0010: // 备用
           break
         default:
@@ -142,4 +148,14 @@ export default () => {
       window.close() // 关闭窗口
     }, 1000)
   }
+  // setTimeout(async () => {
+  //   emitter.emit('opengridPic',{arr:['https://prev.ysaix.com:7868/src/assets/images/homecard4.jpg']})
+  // }, 3000)
+
+  // setTimeout(async () => {
+  //   emitter.emit('closegridPic')
+  // }, 6000)
+  // setTimeout(async () => {
+  //   emitter.emit('opengridPic',{arr:['https://prev.ysaix.com:7868/src/assets/images/homecard4.jpg','https://prev.ysaix.com:7868/src/assets/images/homecard4.jpg']})
+  // }, 9000)
 }

src/renderer/src/AixPPTist/src/views/Editor/EditorHeader/index.vue

@@ -16,7 +16,7 @@
             <PopoverMenuItem>导入 pptx 文件</PopoverMenuItem>
           </FileInput>
           <PopoverMenuItem @click="setDialogForExport('pptx')">导出文件</PopoverMenuItem> -->
-          <PopoverMenuItem @click="resetSlides(); mainMenuVisible = false">重置幻灯片</PopoverMenuItem>
+          <!-- <PopoverMenuItem @click="resetSlides(); mainMenuVisible = false">重置幻灯片</PopoverMenuItem> -->
           <!-- <PopoverMenuItem @click="goLink('https://github.com/pipipi-pikachu/PPTist/issues')">意见反馈</PopoverMenuItem> -->
           <!-- <PopoverMenuItem @click="goLink('https://github.com/pipipi-pikachu/PPTist/blob/master/doc/Q&A.md')">常见问题</PopoverMenuItem> -->
           <PopoverMenuItem @click="mainMenuVisible = false; hotkeyDrawerVisible = true">快捷操作</PopoverMenuItem>

src/renderer/src/AixPPTist/src/views/Editor/Toolbar/ElementStylePanel/ImageStylePanel.vue

@@ -88,7 +88,9 @@ import Button from '../../../../components/Button.vue'
 import ButtonGroup from '../../../../components/ButtonGroup.vue'
 import Popover from '../../../../components/Popover.vue'
 import NumberInput from '../../../../components/NumberInput.vue'
-
+import { PPTApi } from '../../../../api'
+import { Console } from 'node:console'
+import { x64 } from 'crypto-js'
 const shapeClipPathOptions = CLIPPATHS
 const ratioClipOptions = [
   {
@@ -221,10 +223,14 @@ const presetImageClip = (shape: string, ratio = 0) => {
 const replaceImage = (files: FileList) => {
   const imageFile = files[0]
   if (!imageFile) return
-  getImageDataURL(imageFile).then(dataURL => {
-    const props = { src: dataURL }
-    updateImage(props)
+  PPTApi.toRousrceUrl(imageFile).then(data=>{
+    const props = { src: data }
+      updateImage(props)
   })
+  // getImageDataURL(imageFile).then(dataURL => {
+    // const props = { src: dataURL }
+    // updateImage(props)
+  // })
 }
 
 // 重置图片：清除全部样式

src/renderer/src/AixPPTist/src/views/Screen/index.vue

@@ -1,16 +1,26 @@
 <template>
   <div class="pptist-screen">
-    <BaseView :changeViewMode="changeViewMode" v-if="viewMode === 'base'" />
-    <PresenterView :changeViewMode="changeViewMode" v-else-if="viewMode === 'presenter'" />
+    <BaseView  :changeViewMode="changeViewMode" v-if="viewMode === 'base'" />
+    <PresenterView  :changeViewMode="changeViewMode" v-else-if="viewMode === 'presenter'" />
     <!-- 点赞组件 -->
     <upvote-vue ref="upvoteRef"  type="2"></upvote-vue>
     <!-- <div style="z-index: 999;position: absolute;top:10px">
     </div> -->
+    <!-- 推图上屏弹窗 -->
+    <el-dialog
+      v-model="dialogVisible"
+       :fullscreen="true"
+      class="gridPicRefdiv"
+      style="overflow: hidden;"
+      :show-close="false"
+    >
+      <grid-pic ref="gridPicRef" style="height:100%;"  @clear="clearchidrenPic"></grid-pic>
+  </el-dialog>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { onMounted, onUnmounted, ref } from 'vue'
+import { onMounted, onUnmounted, ref , nextTick} from 'vue'
 import { KEYS } from '../../configs/hotkey'
 import useScreening from '../../hooks/useScreening'
 import hooksUpvote from '../../api/upvote' // 点赞-工具
@@ -18,9 +28,13 @@ import hooksUpvote from '../../api/upvote' // 点赞-工具
 import BaseView from './BaseView.vue'
 import PresenterView from './PresenterView.vue'
 import upvoteVue from '@/views/tool/components/upvote.vue' // 点赞-子组件
+import gridPic from '@/components/grid-pic/index.vue' // 推图上屏弹子组件
+
+import emitter from '@/utils/mitt' //mitt 事件总线
 
 const viewMode = ref<'base' | 'presenter'>('base')
-
+const dialogVisible = ref(false)
+const gridPicRef:any= ref(null)
 const changeViewMode = (mode: 'base' | 'presenter') => {
   viewMode.value = mode
 }
@@ -35,6 +49,23 @@ const keydownListener = (e: KeyboardEvent) => {
   if (key === KEYS.ESC) exitScreening()
 }
 
+const clearchidrenPic= ()=> {
+  dialogVisible.value = false
+}
+
+// 开启推图上屏幕
+emitter.on('opengridPic', async (data:object)=> {
+  if(gridPicRef.value)  gridPicRef.value.clearPic()
+  dialogVisible.value = true
+  await nextTick();
+  gridPicRef.value.addPic(data.arr)
+});
+// 关闭推图
+emitter.on('closegridPic', ()=> {
+  if(!gridPicRef.value) return
+  gridPicRef.value.clearPic()
+  dialogVisible.value = false
+});
 onMounted(() => document.addEventListener('keydown', keydownListener))
 onUnmounted(() => document.removeEventListener('keydown', keydownListener))
 </script>
@@ -46,4 +77,8 @@ onUnmounted(() => document.removeEventListener('keydown', keydownListener))
   width: 100%;
   height: 100%;
 }
+
+ :deep(.gridPicRefdiv .el-dialog__body){
+  height: 100% !important;
+}
 </style>

src/renderer/src/components/grid-pic/index.vue

@@ -16,8 +16,8 @@
     <draggable handle=".header-btn" :draggable="false" item-key="backgroundColor" v-model="gridPicList" class="grid-pic-wrap" :style="getGrid">
       <template #item="{ element, index }">
         <div class="grid-pic-item" :key="element.backgroundColor" :style="getWH(element,index)">
-          <div class="delete-btn" @click="gridPicList.splice(index,1)">X</div>
-          <div class="header-btn"></div>
+          <div class="delete-btn" @click="()=>{gridPicList.splice(index,1);if(!gridPicList.length) emits('clear')} ">X</div>
+          <div class="header-btn"></div> 
           <ViewerItem :gridPicList="gridPicList" :index="index" :images="element"></ViewerItem>
         </div>
       </template>

src/renderer/src/components/grid-pic/viewer-item.vue

@@ -140,5 +140,8 @@ watch(props.images, (newValue, oldValue) => {
 .viewer-item-wrap{
   width: 100%;
   height: 100%;
+  :deep(.viewer-canvas img) {
+    display: block !important;
+  }
 }
 </style>