Merge branch 'main' of http://27.128.240.72:3000/zhuhao/AIx_Smarttalk_WS into zxl

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/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/Screen/index.vue

@@ -1,16 +1,26 @@
 <template>
   <div class="pptist-screen">
-    <BaseView :changeViewMode="changeViewMode" v-if="viewMode === 'base'" />
+    <BaseView  :changeViewMode="changeViewMode" v-if="viewMode === 'base'" />
-    <PresenterView :changeViewMode="changeViewMode" v-else-if="viewMode === 'presenter'" />
+    <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,15 +16,15 @@
     <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="delete-btn" @click="()=>{gridPicList.splice(index,1);if(!gridPicList.length) emits('clear')} ">X</div>
-          <div class="header-btn"></div>
+          <div class="header-btn"></div> 
           <ViewerItem :gridPicList="gridPicList" :index="index" :images="element"></ViewerItem>
         </div>
       </template>
     </draggable>
-    <div v-if="showToolbar" class="grid-pic-toolbar">
+    <div class="grid-pic-toolbar">
-      <el-input style="width: 500px" v-model="inputValue" type="text" />
+      <el-input v-if="showToolbar" style="width: 500px" v-model="inputValue" type="text" />
-      <el-button class="add-btn" @click="pushPic">
+      <el-button v-if="showToolbar" class="add-btn" @click="pushPic">
         添加
       </el-button>
       <el-button class="add-btn" @click="clearPic">

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>