package.json

@@ -1,6 +1,6 @@
 {
   "name": "aix-win-ws",
-  "version": "2.5.7",
+  "version": "2.5.6",
   "description": "",
   "main": "./out/main/index.js",
   "author": "上海交大重庆人工智能研究院",

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

@@ -1,16 +1,3 @@
-<!--
-依赖： vuedraggable、v-viewer
-属性:    showToolbar   //是否显示工具栏  默认：false
-            工具栏   添加图片：默认6个测试图片，不输入框添加则添加默认，输入图片链接，展示图片链接的图片
-                    清空图片：清空图片
-事件:    clear       清空时触发
-        outIndex    超出九个图片时触发
-方法：   addPic    //添加图片
-          参数：  src  图片链接
-        clearPic  //清空图片
-          参数：  无
-使用方法： 加载组件后，通过ref调用addPic方法添加图片即可
--->
 <template>
   <div style="position: relative;height: 100%;width: 100%;">
     <draggable handle=".header-btn" :draggable="false" item-key="backgroundColor" v-model="gridPicList" class="grid-pic-wrap" :style="getGrid">
@@ -22,21 +9,16 @@
         </div>
       </template>
     </draggable>
-    <div v-if="showToolbar" class="grid-pic-toolbar">
+    <el-input style="position:fixed;bottom: 20px;right: 180px;width: 1000px" v-model="inputValue" type="text" />
-      <el-input style="width: 500px" v-model="inputValue" type="text" />
+    <el-button class="add-btn" @click="addPic">
-      <el-button class="add-btn" @click="pushPic">
       添加
     </el-button>
-      <el-button class="add-btn" @click="clearPic">
+    <el-button style="position:fixed;bottom: 20px;right: 80px;" @click="startPencil">
-        清空
-      </el-button>
-    </div>
-<!--    <el-button style="position:fixed;bottom: 20px;right: 80px;" @click="startPencil">
       画笔
-    </el-button>-->
+    </el-button>
-<!--    <div class="modal-mode">
+    <div class="modal-mode">
       <canvas id="canvas_pic_001" style="position: absolute;top: 0;left: 0;width: 100%;height: 100%;"></canvas>
-    </div>-->
+    </div>
   </div>
 </template>
 
@@ -44,18 +26,10 @@
   import {ref, computed, onMounted} from 'vue'
   import Draggable from 'vuedraggable'
   import ViewerItem from "./viewer-item.vue";
-  // import Fabric from 'fabric';
+  import Fabric from 'fabric';
   const gridPicList = ref([])
   const inputValue = ref('')
   const isShow = ref(false)
-  const emits = defineEmits(['clear','outIndex']);
-
-  const props = defineProps({
-    showToolbar: {
-      type: Boolean,
-      default: true
-    }
-  })
   // 获取图片样式
   const getWH = (item,index)=>{
     return {
@@ -144,19 +118,13 @@
     }
   })
 
-  const pushPic = () => {
-    let src = inputValue.value||picList[gridPicList.value.length]
-    addPic(src)
-  }
   // 添加图片
-  const addPic = (src) => {
+  const addPic = () => {
     if (gridPicList.value.length >= 9) {
-      console.log("超出九个图片")
-      emits('outIndex')
       return
     }
+    let src = inputValue.value||picList[gridPicList.value.length]
     if (!src) {
-      console.log("图片链接不能为空")
       return;
     }
     gridPicList.value.push({
@@ -165,11 +133,6 @@
     })
     inputValue.value = ''
   }
-  // 清空图片
-  const clearPic = () => {
-    gridPicList.value = []
-    emits('clear')
-  }
   //开始画笔
   const startPencil = () => {
     isShow.value = !isShow.value
@@ -185,7 +148,7 @@
     b = b.length === 1? '0' + b : b;
     return `#${r}${g}${b}`;
   }
- /* //初始化画笔
+  //初始化画笔
   const initPend = () => {
     let canvas = new Fabric.fabric.Canvas('canvas_pic_001',{
       interactive: false,
@@ -199,11 +162,10 @@
     canvas.freeDrawingBrush = new Fabric.fabric.PencilBrush(canvas)
     canvas.freeDrawingBrush.width = 1//设置画笔粗细
     canvas.freeDrawingBrush.color = "red"//设置画笔颜色
-  }*/
+  }
-  /*onMounted(() => {
+  onMounted(() => {
     initPend()
-  })*/
+  })
-  defineExpose({addPic,clearPic})
 </script>
 <style scoped lang="scss">
 .modal-mode{
@@ -242,13 +204,10 @@
     }
   }
 }
-.grid-pic-toolbar{
+.add-btn{
   position: fixed;
   right: 20px;
   bottom: 20px;
-  display: flex;
-  .add-btn{
-  }
 }
 @keyframes fadeIn {
   from {

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

@@ -12,7 +12,7 @@
 <script setup>
 import {ref, watch, nextTick, onMounted} from "vue";
 import { component as Viewer } from 'v-viewer'
-// import Fabric from 'fabric';
+import Fabric from 'fabric';
 import 'viewerjs/dist/viewer.css'
 const props = defineProps({
   images: {
@@ -36,13 +36,16 @@ const inited = (viewer) => {
 }
 //缩放时
 const zoomed = (e) => {
-  // setImgStyle()
+  setImgStyle()
+  // console.log('zoomed', e)
 }
 //移动时
 const moved = (e) => {
-  // setImgStyle()
+  setImgStyle()
+  // console.log('moved',e)
 }
 const move = (e) => {
+  // console.log('move', e)
 }
 const appendCanvasToShow = () => {
   initImgStyle()
@@ -89,7 +92,7 @@ const optins = ref({
   "tooltip": true,
   "zoomable": true,
   "rotatable": true,
-  "movable": true,
+  "movable": false,
   "scalable": true,
   "transition": true,
   "fullscreen": true,
@@ -97,9 +100,9 @@ const optins = ref({
 })
 const initViewers = () => {
   refs.value['viewerRef'+props.index]?.rebuildViewer()
-  /*setTimeout(()=>{
+  setTimeout(()=>{
     initImgStyle()
-  },300)*/
+  },300)
 }
 //初始化画笔
 const initPend = () => {
@@ -130,11 +133,11 @@ watch(props.images, (newValue, oldValue) => {
 });
 */
 
-/*onMounted(()=>{
+onMounted(()=>{
   setTimeout(()=>{
     appendCanvasToShow()
   }, 300)
-})*/
+})
 </script>
 <style scoped lang="scss">
 .viewer-item-wrap{

src/renderer/src/views/prepare/index.vue

@@ -10,7 +10,7 @@
           <el-dropdown-menu>
             <el-dropdown-item @click="createAIPPT">新建文枢课件</el-dropdown-item>
             <el-dropdown-item @click="aiTOPPT">AI一键生成</el-dropdown-item>
-            <el-dropdown-item @click="openGridPic">打开宫格</el-dropdown-item>
+<!--            <el-dropdown-item @click="openGridPic">打开宫格</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>