Merge branch 'main' into zouyf_dev

package.json

@@ -68,6 +68,7 @@
     "less": "^4.2.0",
     "less-loader": "^7.3.0",
     "lodash": "^4.17.21",
+    "markmap-lib": "^0.18.8",
     "mitt": "^3.0.1",
     "nanoid": "^5.0.7",
     "node-addon-api": "^8.1.0",
@@ -102,6 +103,7 @@
     "vue-cropper": "1.0.3",
     "vue-qr": "^4.0.9",
     "vue-router": "^4.4.0",
+    "vue3-mindmap": "^0.5.12",
     "vuedraggable": "^4.1.0",
     "whiteboard_lyc": "^0.1.3",
     "xgplayer": "^3.0.19",

src/main/file.js

@@ -452,6 +452,27 @@ export default async function ({ app, shell, BrowserWindow, ipcMain }) {
     })
   })
 
+  ipcMain.on('export-img64-file', function (event, {base64, name}) {
+    name = name || '思维导图'
+    const parts = base64.split(';base64,');
+    const contentType = parts[0].split(':')[1];
+    const extension = contentType.split('/')[1];
+    const data = Buffer.from(parts[1], 'base64');
+
+    dialog.showSaveDialog({
+      title: '保存图片',
+      defaultPath: path.join(app.getPath('downloads'), `${name}.${extension}`),
+      filters: [
+        { name: 'Image Files', extensions: [extension] }
+      ]
+    }).then(result => {
+      if (!result.canceled) {
+        fs.writeFileSync(result.filePath, data);
+        event.reply('export-img64-file-reply')
+      }
+    });
+  })
+
   /*导出文件*/
   function exportFile(list, callback) {
     let win = BrowserWindow.getFocusedWindow()

src/renderer/src/AixPPTist/src/hooks/useImport.ts

@@ -1,6 +1,8 @@
 import { ref } from 'vue'
 import { storeToRefs } from 'pinia'
-import { parse, type Shape, type Element, type ChartItem } from 'pptxtojson'
+// import { parse, type Shape, type Element, type ChartItem } from 'pptxtojson'
+// import { parse, utils, fill as fillUtil } from '@/plugins/pptTojson'
+import { parse, fill as fillUtil, type Shape, type Element, type ChartItem } from '@/plugins/pptTojson'
 import { nanoid } from 'nanoid'
 import { useSlidesStore } from '../store'
 import { decrypt } from '../utils/crypto'
@@ -9,6 +11,7 @@ import useAddSlidesOrElements from '../hooks/useAddSlidesOrElements'
 import useSlideHandler from '../hooks/useSlideHandler'
 import message from '../utils/message'
 import { getSvgPathRange } from '../utils/svgPathParser'
+import { calculatePathDimensions } from '@/utils/ppt/svgUtils'
 import type {
   Slide,
   TableCellStyle,
@@ -75,57 +78,18 @@ const parseLineElement = (el: Shape) => {
 
   return data
 }
-export default () => {
 
-  const exporting = ref(false)
+// PPT json二次加工处理
-
+const parsePptJsonSlides = (slides: Slide[]|any, zip) => {
-  // 导入pptist文件
+  return new Promise(async (resolve, reject) => {
-  const importSpecificFile = (files: FileList, cover = false) => {
-    const file = files[0]
-
-    const reader = new FileReader()
-    reader.addEventListener('load', () => {
     try {
-        const slides = JSON.parse(decrypt(reader.result as string))
-        if (cover) {
-          slidesStore.updateSlideIndex(0)
-          slidesStore.setSlides(slides)
-        }
-        else if (isEmptySlide.value) slidesStore.setSlides(slides)
-        else addSlidesFromData(slides)
-      }
-      catch {
-        message.error('无法正确读取 / 解析该文件')
-      }
-    })
-    reader.readAsText(file)
-  }
-
-
-
-  // 导入PPTX文件
-  const importPPTXFile = (files: FileList) => {
-    const file = files[0]
-    if (!file) return
-
-    exporting.value = true
-
       const shapeList: ShapePoolItem[] = []
       for (const item of SHAPE_LIST) {
         shapeList.push(...item.children)
       }
-
-    const reader = new FileReader()
-    reader.onload = async e => {
-      const json = await parse(e.target!.result as ArrayBuffer)
-
       const ratio = 96 / 72
-      const width = json.size.width
+      const newSlides: Slide[] = []
-
+      for (const item of slides) {
-      slidesStore.setViewportSize(width * ratio)
-
-      const slides: Slide[] = []
-      for (const item of json.slides) {
         const { type, value } = item.fill
         let background: SlideBackground
         if (type === 'image') {
@@ -163,7 +127,7 @@ export default () => {
           background,
         }
   
-        const parseElements = (elements: Element[]) => {
+        const parseElements = async (elements: Element[]) => {
           for (const el of elements) {
             const originWidth = el.width || 1
             const originHeight = el.height || 1
@@ -219,6 +183,7 @@ export default () => {
                 rotate: el.rotate,
                 flipH: el.isFlipH,
                 flipV: el.isFlipV,
+                zipPath: el.zipPath,
               })
             }
             else if (el.type === 'audio') {
@@ -235,6 +200,7 @@ export default () => {
                 color: theme.value.themeColor,
                 loop: false,
                 autoplay: false,
+                zipPath: el.zipPath,
               })
             }
             else if (el.type === 'video') {
@@ -248,6 +214,7 @@ export default () => {
                 top: el.top,
                 rotate: 0,
                 autoplay: false,
+                zipPath: el.zipPath,
               })
             }
             else if (el.type === 'shape') {
@@ -325,6 +292,34 @@ export default () => {
                     element.viewBox = [maxX || originWidth, maxY || originHeight]
                   }
                 }
+                // auth: zdg
+                if (el.fill) {
+                  const { type, ...opt } = el.fill
+                  if (type === 'gradient') { // 线性渐变色
+                    element.gradient = {
+                      type: 'linear',
+                      colors: opt.colors.map(item => ({
+                        ...item,
+                        pos: parseInt(item.pos),
+                      })),
+                      rotate: opt.rot,
+                    }
+                  } else if (type == 'image') { // 背景图填充
+                    const pathPos = calculatePathDimensions(element.path)
+                    const url = opt.picBase64 || (!!zip ? await fillUtil.getPicFillBase64(opt.zipPath, zip) : '')
+                    element.gradient = {
+                      type: 'image',
+                      image: {
+                        src: url,
+                        width: opt.w||el.width,
+                        height: opt.h||el.height,
+                        path_W: Math.round(pathPos.width),  // 获取path 的宽高
+                        path_h: Math.round(pathPos.height), // 获取path 的宽高
+                        ...opt
+                      }
+                    }
+                  }
+                }
     
                 if (element.path) slide.elements.push(element)
               }
@@ -468,18 +463,91 @@ export default () => {
               })
             }
             else if (el.type === 'group' || el.type === 'diagram') {
-              const elements = el.elements.map(_el => ({
+              const elements = el.elements.map(_el => {
+                const isGroup = el.type === 'group' // 子级是否为分组
+                const isFlipH = !!(_el.isFlipH ^ el.isFlipH) // 水平翻转(分组有值进行异或运算)
+                const isFlipV = !!(_el.isFlipV ^ el.isFlipV) // 垂直翻转(分组有值进行异或运算)
+                const isPleft = el.isFlipH_def // 是否父级翻转-改变子元素坐标left
+                const isPtop = el.isFlipV_def // 是否父级翻转-改变子元素坐标top
+                const left = originLeft + (isPleft ? originWidth - _el.left - _el.width : _el.left)
+                const top = originTop + (isPtop ? originHeight - _el.top - _el.height : _el.top)
+                return {
                   ..._el,
-                left: _el.left + originLeft,
+                  left,
-                top: _el.top + originTop,
+                  top,
-              }))
+                  isFlipH,
-              parseElements(elements)
+                  isFlipV,
+                  isFlipH_def: _el.isFlipH, // 保留默认
+                  isFlipV_def: _el.isFlipV, // 保留默认
+                }
+              })
+              await parseElements(elements)
             }
           }
         }
-        parseElements(item.elements)
+        // 设置默认翻转默认属性
-        slides.push(slide)
+        item.elements.forEach(o => { o.isFlipH_def = o.isFlipH; o.isFlipV_def = o.isFlipV })
+        item.bgElements.forEach(o => { o.isFlipH_def = o.isFlipH; o.isFlipV_def = o.isFlipV })
+        item.bgElements.length && await parseElements(item.bgElements) // 加载当前幻灯片对应的母版
+        item.elements.length && await parseElements(item.elements) // 加载当前幻灯片
+        newSlides.push(slide)
       }
+      resolve(newSlides)
+    } catch (error) {
+      reject(error)
+    }
+  })
+}
+
+export default () => {
+
+  const exporting = ref(false)
+
+  // 导入pptist文件
+  const importSpecificFile = (files: FileList, cover = false) => {
+    const file = files[0]
+
+    const reader = new FileReader()
+    reader.addEventListener('load', () => {
+      try {
+        const slides = JSON.parse(decrypt(reader.result as string))
+        if (cover) {
+          slidesStore.updateSlideIndex(0)
+          slidesStore.setSlides(slides)
+        }
+        else if (isEmptySlide.value) slidesStore.setSlides(slides)
+        else addSlidesFromData(slides)
+      }
+      catch {
+        message.error('无法正确读取 / 解析该文件')
+      }
+    })
+    reader.readAsText(file)
+  }
+
+ 
+
+  // 导入PPTX文件
+  const importPPTXFile = (files: FileList) => {
+    const file = files[0]
+    if (!file) return
+
+    exporting.value = true
+
+    const shapeList: ShapePoolItem[] = []
+    for (const item of SHAPE_LIST) {
+      shapeList.push(...item.children)
+    }
+    
+    const reader = new FileReader()
+    reader.onload = async e => {
+      const json = await parse(e.target!.result as ArrayBuffer)
+
+      const ratio = 96 / 72
+      const width = json.size.width
+      slidesStore.setViewportSize(width * ratio)
+      // json数据二次加工
+      const slides = await parsePptJsonSlides(json.slides, json.zip)
       slidesStore.updateSlideIndex(0)
       slidesStore.setSlides(slides)
       exporting.value = false
@@ -539,365 +607,7 @@ export const PPTXFileToJson = (data: File|ArrayBuffer) => {
     resData.def = json // 保留原始数据
     resData.width = width * ratio
     resData.ratio = slidesStore.viewportRatio
-
+    resData.slides = await parsePptJsonSlides(json.slides, json.zip)
-    const slides: Slide[] = []
-    for (const item of json.slides) {
-      const { type, value } = item.fill
-      let background: SlideBackground
-      if (type === 'image') {
-        background = {
-          type: 'image',
-          image: {
-            src: value.picBase64,
-            size: 'cover',
-          },
-        }
-      }
-      else if (type === 'gradient') {
-        background = {
-          type: 'gradient',
-          gradient: {
-            type: 'linear',
-            colors: value.colors.map(item => ({
-              ...item,
-              pos: parseInt(item.pos),
-            })),
-            rotate: value.rot,
-          },
-        }
-      }
-      else {
-        background = {
-          type: 'solid',
-          color: value,
-        }
-      }
-
-      const slide: Slide = {
-        id: nanoid(10),
-        elements: [],
-        background,
-      }
-
-      const parseElements = (elements: Element[]) => {
-        for (const el of elements) {
-          const originWidth = el.width || 1
-          const originHeight = el.height || 1
-          const originLeft = el.left
-          const originTop = el.top
-
-          el.width = el.width * ratio
-          el.height = el.height * ratio
-          el.left = el.left * ratio
-          el.top = el.top * ratio
-
-          if (el.type === 'text') {
-            const textEl: PPTTextElement = {
-              type: 'text',
-              id: nanoid(10),
-              width: el.width,
-              height: el.height,
-              left: el.left,
-              top: el.top,
-              rotate: el.rotate,
-              defaultFontName: theme.value.fontName,
-              defaultColor: theme.value.fontColor,
-              content: convertFontSizePtToPx(el.content, ratio),
-              lineHeight: 1,
-              outline: {
-                color: el.borderColor,
-                width: el.borderWidth,
-                style: el.borderType,
-              },
-              fill: el.fillColor,
-              vertical: el.isVertical,
-            }
-            if (el.shadow) {
-              textEl.shadow = {
-                h: el.shadow.h * ratio,
-                v: el.shadow.v * ratio,
-                blur: el.shadow.blur * ratio,
-                color: el.shadow.color,
-              }
-            }
-            slide.elements.push(textEl)
-          }
-          else if (el.type === 'image') {
-            slide.elements.push({
-              type: 'image',
-              id: nanoid(10),
-              src: el.src,
-              width: el.width,
-              height: el.height,
-              left: el.left,
-              top: el.top,
-              fixedRatio: true,
-              rotate: el.rotate,
-              flipH: el.isFlipH,
-              flipV: el.isFlipV,
-            })
-          }
-          else if (el.type === 'audio') {
-            slide.elements.push({
-              type: 'audio',
-              id: nanoid(10),
-              src: el.blob,
-              width: el.width,
-              height: el.height,
-              left: el.left,
-              top: el.top,
-              rotate: 0,
-              fixedRatio: false,
-              color: theme.value.themeColor,
-              loop: false,
-              autoplay: false,
-            })
-          }
-          else if (el.type === 'video') {
-            slide.elements.push({
-              type: 'video',
-              id: nanoid(10),
-              src: (el.blob || el.src)!,
-              width: el.width,
-              height: el.height,
-              left: el.left,
-              top: el.top,
-              rotate: 0,
-              autoplay: false,
-            })
-          }
-          else if (el.type === 'shape') {
-            if (el.shapType === 'line' || /Connector/.test(el.shapType)) {
-              // 从返回对象中解构出 xx 函数并调用
-              const lineElement = parseLineElement(el)
-              slide.elements.push(lineElement)
-            }
-            else {
-              const shape = shapeList.find(item => item.pptxShapeType === el.shapType)
-
-              const vAlignMap: { [key: string]: ShapeTextAlign } = {
-                'mid': 'middle',
-                'down': 'bottom',
-                'up': 'top',
-              }
-
-              const element: PPTShapeElement = {
-                type: 'shape',
-                id: nanoid(10),
-                width: el.width,
-                height: el.height,
-                left: el.left,
-                top: el.top,
-                viewBox: [200, 200],
-                path: 'M 0 0 L 200 0 L 200 200 L 0 200 Z',
-                fill: el.fillColor || 'none',
-                fixedRatio: false,
-                rotate: el.rotate,
-                outline: {
-                  color: el.borderColor,
-                  width: el.borderWidth,
-                  style: el.borderType,
-                },
-                text: {
-                  content: convertFontSizePtToPx(el.content, ratio),
-                  defaultFontName: theme.value.fontName,
-                  defaultColor: theme.value.fontColor,
-                  align: vAlignMap[el.vAlign] || 'middle',
-                },
-                flipH: el.isFlipH,
-                flipV: el.isFlipV,
-              }
-              if (el.shadow) {
-                element.shadow = {
-                  h: el.shadow.h * ratio,
-                  v: el.shadow.v * ratio,
-                  blur: el.shadow.blur * ratio,
-                  color: el.shadow.color,
-                }
-              }
-
-              if (shape) {
-                element.path = shape.path
-                element.viewBox = shape.viewBox
-
-                if (shape.pathFormula) {
-                  element.pathFormula = shape.pathFormula
-                  element.viewBox = [el.width, el.height]
-
-                  const pathFormula = SHAPE_PATH_FORMULAS[shape.pathFormula]
-                  if ('editable' in pathFormula && pathFormula.editable) {
-                    element.path = pathFormula.formula(el.width, el.height, pathFormula.defaultValue)
-                    element.keypoints = pathFormula.defaultValue
-                  }
-                  else element.path = pathFormula.formula(el.width, el.height)
-                }
-              }
-              if (el.shapType === 'custom') {
-                if (el.path!.indexOf('NaN') !== -1) element.path = ''
-                else {
-                  element.special = true
-                  element.path = el.path!
-
-                  const { maxX, maxY } = getSvgPathRange(element.path)
-                  element.viewBox = [maxX || originWidth, maxY || originHeight]
-                }
-              }
-
-              if (element.path) slide.elements.push(element)
-            }
-          }
-          else if (el.type === 'table') {
-            const row = el.data.length
-            const col = el.data[0].length
-
-            const style: TableCellStyle = {
-              fontname: theme.value.fontName,
-              color: theme.value.fontColor,
-            }
-            const data: TableCell[][] = []
-            for (let i = 0; i < row; i++) {
-              const rowCells: TableCell[] = []
-              for (let j = 0; j < col; j++) {
-                const cellData = el.data[i][j]
-
-                let textDiv: HTMLDivElement | null = document.createElement('div')
-                textDiv.innerHTML = cellData.text
-                const p = textDiv.querySelector('p')
-                const align = p?.style.textAlign || 'left'
-
-                const span = textDiv.querySelector('span')
-                const fontsize = span?.style.fontSize ? (parseInt(span?.style.fontSize) * ratio).toFixed(1) + 'px' : ''
-                const fontname = span?.style.fontFamily || ''
-                const color = span?.style.color || cellData.fontColor
-
-                rowCells.push({
-                  id: nanoid(10),
-                  colspan: cellData.colSpan || 1,
-                  rowspan: cellData.rowSpan || 1,
-                  text: textDiv.innerText,
-                  style: {
-                    ...style,
-                    align: ['left', 'right', 'center'].includes(align) ? (align as 'left' | 'right' | 'center') : 'left',
-                    fontsize,
-                    fontname,
-                    color,
-                    bold: cellData.fontBold,
-                    backcolor: cellData.fillColor,
-                  },
-                })
-                textDiv = null
-              }
-              data.push(rowCells)
-            }
-
-            const colWidths: number[] = new Array(col).fill(1 / col)
-
-            slide.elements.push({
-              type: 'table',
-              id: nanoid(10),
-              width: el.width,
-              height: el.height,
-              left: el.left,
-              top: el.top,
-              colWidths,
-              rotate: 0,
-              data,
-              outline: {
-                width: el.borderWidth || 2,
-                style: el.borderType,
-                color: el.borderColor || '#eeece1',
-              },
-              cellMinHeight: 36,
-            })
-          }
-          else if (el.type === 'chart') {
-            let labels: string[]
-            let legends: string[]
-            let series: number[][]
-
-            if (el.chartType === 'scatterChart' || el.chartType === 'bubbleChart') {
-              labels = el.data[0].map((item, index) => `坐标${index + 1}`)
-              legends = ['X', 'Y']
-              series = el.data
-            }
-            else {
-              const data = el.data as ChartItem[]
-              labels = Object.values(data[0].xlabels)
-              legends = data.map(item => item.key)
-              series = data.map(item => item.values.map(v => v.y))
-            }
-
-            const options: ChartOptions = {}
-
-            let chartType: ChartType = 'bar'
-
-            switch (el.chartType) {
-              case 'barChart':
-              case 'bar3DChart':
-                chartType = 'bar'
-                if (el.barDir === 'bar') chartType = 'column'
-                if (el.grouping === 'stacked' || el.grouping === 'percentStacked') options.stack = true
-                break
-              case 'lineChart':
-              case 'line3DChart':
-                if (el.grouping === 'stacked' || el.grouping === 'percentStacked') options.stack = true
-                chartType = 'line'
-                break
-              case 'areaChart':
-              case 'area3DChart':
-                if (el.grouping === 'stacked' || el.grouping === 'percentStacked') options.stack = true
-                chartType = 'area'
-                break
-              case 'scatterChart':
-              case 'bubbleChart':
-                chartType = 'scatter'
-                break
-              case 'pieChart':
-              case 'pie3DChart':
-                chartType = 'pie'
-                break
-              case 'radarChart':
-                chartType = 'radar'
-                break
-              case 'doughnutChart':
-                chartType = 'ring'
-                break
-              default:
-            }
-
-            slide.elements.push({
-              type: 'chart',
-              id: nanoid(10),
-              chartType: chartType,
-              width: el.width,
-              height: el.height,
-              left: el.left,
-              top: el.top,
-              rotate: 0,
-              themeColors: [theme.value.themeColor],
-              textColor: theme.value.fontColor,
-              data: {
-                labels,
-                legends,
-                series,
-              },
-              options,
-            })
-          }
-          else if (el.type === 'group' || el.type === 'diagram') {
-            const elements = el.elements.map(_el => ({
-              ..._el,
-              left: _el.left + originLeft,
-              top: _el.top + originTop,
-            }))
-            parseElements(elements)
-          }
-        }
-      }
-      parseElements(item.elements)
-      slides.push(slide)
-    }
-    resData.slides = slides
     resolve(resData)
   })
 }

src/renderer/src/AixPPTist/src/types/slides.ts

@@ -41,7 +41,7 @@ export const enum ElementTypes {
  * 
  * rotate: 渐变角度（线性渐变）
  */
-export type GradientType = 'linear' | 'radial'
+export type GradientType = 'linear' | 'radial' | 'image'
 export type GradientColor = {
   pos: number
   color: string

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

@@ -46,11 +46,12 @@
         :options="[
           { label: '线性渐变', value: 'linear' },
           { label: '径向渐变', value: 'radial' },
+          { label: '背景图', value: 'image' },
         ]"
       />
     </div>
     
-    <template v-if="fillType === 'gradient'">
+    <template v-if="fillType === 'gradient' && gradient.type !== 'image'">
       <div class="row">
         <GradientBar
           :value="gradient.colors"
@@ -206,6 +207,13 @@ const updateFillType = (type: 'gradient' | 'fill') => {
 const updateGradient = (gradientProps: Partial<Gradient>) => {
   if (!gradient.value) return
   const _gradient = { ...gradient.value, ...gradientProps }
+  if (!_gradient.colors) {
+    _gradient.colors = [
+      { pos: 0, color: '#fff' },
+      { pos: 100, color: '#fff' },
+    ]
+    _gradient.rotate = 0
+  }
   updateElement({ gradient: _gradient })
 }
 const updateGradientColors = (color: string) => {

src/renderer/src/AixPPTist/src/views/components/element/ShapeElement/BaseShapeElement.vue

@@ -33,6 +33,8 @@
               :type="elementInfo.gradient.type"
               :colors="elementInfo.gradient.colors"
               :rotate="elementInfo.gradient.rotate"
+              :image="elementInfo.gradient.image"
+              :info="elementInfo"
             />
           </defs>
           <g 

src/renderer/src/AixPPTist/src/views/components/element/ShapeElement/GradientDefs.vue

@@ -1,6 +1,25 @@
 <template>
+  <!-- auth:zdg 增加图片 -->
+  <pattern
+    v-if="type === 'image'"
+    :id="id"
+    :x="image?.stretch?.l || 0"
+    :y="image?.stretch?.t || 0"
+    :width="image?.path_W||'100%'"
+    :height="image?.path_h||'100%'"
+    :style="image.rotWithShape==0?'transform:rotate('+(-info.rotate)+'deg)' : ''"
+    patternUnits="userSpaceOnUse">
+    <image
+      :width="image?.path_W||200"
+      :height="image?.path_h||200"
+      :href="image.src"
+      :opacity="image.opacity"
+      preserveAspectRatio="none"
+    />
+  </pattern>
+  <!-- auth:zdg 默认 线性渐变 -->
   <linearGradient 
-    v-if="type === 'linear'"
+    v-else-if="type === 'linear'"
     :id="id" 
     x1="0%" 
     y1="0%" 
@@ -10,20 +29,35 @@
   >
     <stop v-for="(item, index) in colors" :key="index" :offset="`${item.pos}%`" :stop-color="item.color" />
   </linearGradient>
-
+  <!-- auth:zdg 默认 径向渐变 -->
   <radialGradient :id="id" v-else>
     <stop v-for="(item, index) in colors" :key="index" :offset="`${item.pos}%`" :stop-color="item.color" />
   </radialGradient>
 </template>
 
 <script lang="ts" setup>
-import type { GradientColor, GradientType } from '../../../../types/slides'
+import type { GradientColor, GradientType, PPTShapeElement } from '../../../../types/slides'
-
+interface ImageSvg {
-withDefaults(defineProps<{
+  src: string,
+  width: number,
+  height: number,
+  zipPath: string,
+  opacity: number,
+  rotWithShape: string,
+  stretch?: {
+    l?: number,
+    t?: number,
+    r?: number,
+    b?: number
+  }
+}
+const data = withDefaults(defineProps<{
   id: string
   type: GradientType
-  colors: GradientColor[]
+  colors?: GradientColor[]
-  rotate?: number
+  rotate?: number,
+  image?: ImageSvg,
+  info?: PPTShapeElement
 }>(), {
   rotate: 0,
 })

src/renderer/src/AixPPTist/src/views/components/element/ShapeElement/index.vue

@@ -42,6 +42,8 @@
               :type="elementInfo.gradient.type"
               :colors="elementInfo.gradient.colors"
               :rotate="elementInfo.gradient.rotate"
+              :image="elementInfo.gradient.image"
+              :info="elementInfo"
             />
           </defs>
           <g 

src/renderer/src/api/ai/index.js

@@ -1,12 +1,10 @@
 import request from '@/utils/request'
 
 // 创建对话
-export const createChart = ({ headers, data }) => {
+export const createChart = () => {
   return request({
     url: '/qf/createChart',
     method: 'post',
-    headers,
-    data,
   })
 }
 // 大模型对话

src/renderer/src/api/mode/index.js

@@ -29,6 +29,20 @@ export function completion(data) {
   })
 }
 
+// 大模型对话
+export function modelChat(data) {
+  return axios({
+    url: '/mind/chat',
+    method: 'post',
+    headers: {
+      Authorization: 'Bearer ragflow-IwMDI1MGU2YTU3NjExZWZiNWEzMDI0Mm',
+      'Content-Type': 'application/json',
+      Accept: '*/*'
+    },
+    data: data
+  })
+}
+
 // 添加提示词 （系统预设）
 export function addKeyWords(data) {
   return request({

src/renderer/src/assets/iconfont/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 4723712 */
-  src: url('iconfont.woff2?t=1735483000546') format('woff2'),
+  src: url('iconfont.woff2?t=1737434703828') format('woff2'),
-       url('iconfont.woff?t=1735483000546') format('woff'),
+       url('iconfont.woff?t=1737434703828') format('woff'),
-       url('iconfont.ttf?t=1735483000546') format('truetype');
+       url('iconfont.ttf?t=1737434703828') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,10 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-siweidaotu:before {
+  content: "\e606";
+}
+
 .icon-chuangzuo:before {
   content: "\e6cc";
 }

src/renderer/src/assets/iconfont/iconfont.json

@@ -5,6 +5,13 @@
   "css_prefix_text": "icon-",
   "description": "",
   "glyphs": [
+    {
+      "icon_id": "11685410",
+      "name": "思维导图",
+      "font_class": "siweidaotu",
+      "unicode": "e606",
+      "unicode_decimal": 58886
+    },
     {
       "icon_id": "39170417",
       "name": "创作",

src/renderer/src/components/file-image/index.vue

@@ -42,7 +42,8 @@ const getFileTypeIcon = () => {
     airobot: 'icon-jiqirenfushi', // 数字人生成
     aiimg: 'icon-xiangmuicon_maobishufa', // 文生图片
     aidraw: 'icon-meishu-F', // 文生连环画
-    aiyinyue: 'icon-yinle' //文生音乐
+    aiyinyue: 'icon-yinle', //文生音乐
+    aiswdt: 'icon-siweidaotu' //思维导图
   }
   if (iconObj[name]) {
     return '#' + iconObj[name]

src/renderer/src/layout/components/Aside.vue

@@ -5,7 +5,11 @@
         <el-popover ref="popoverRef" placement="right" trigger="hover" popper-class="popoverStyle" :tabindex="999" >
           <template #reference>
             <div class="user-info">
-              <el-image class="user-img" :src="img"  />
+              <el-image class="user-img" :src="img">
+                <template #error>
+                  <img :src="route_path + userStore.user.avatar">
+                </template>
+              </el-image>
               <span>{{ userStore.user.nickName }}</span>
             </div>
           </template>
@@ -65,6 +69,7 @@ import {toLinkLeftWeb} from "@/utils/tool"
 
 const { ipcRenderer } = window.electron || {}
 const dev_api = ref(import.meta.env.VITE_APP_BASE_API)
+const route_path = ref(import.meta.env.VITE_APP_BUILD_BASE_PATH)
 const userStore = useUserStore()
 const router = useRouter()
 const currentRoute = ref('')

src/renderer/src/layout/index.vue

@@ -24,7 +24,7 @@
         </el-main>
       </el-container>
       <Uploader v-if="uploaderStore.uploadList && uploaderStore.uploadList.length > 0" />
-      <AiChart/>
+<!--      <AiChart/>-->
     </el-container>
   </div>
 </template>

src/renderer/src/main.js

@@ -11,10 +11,9 @@ import 'virtual:windi.css'
 import request from "@/utils/request";
 
 //v-md-editor
-import VMdPreview from '@kangc/v-md-editor/lib/preview';
+import VMdEditor from '@kangc/v-md-editor';
-import '@kangc/v-md-editor/lib/style/preview.css';
+import '@kangc/v-md-editor/lib/style/base-editor.css';
-// 引入你所使用的主题 此处以 github 主题为例
+import githubTheme from '@kangc/v-md-editor/lib/theme/github.js';
-import githubTheme from '@kangc/v-md-editor/lib/theme/github';
 import '@kangc/v-md-editor/lib/theme/style/github.css';
 // highlightjs
 import hljs from 'highlight.js';
@@ -51,7 +50,7 @@ app.config.globalProperties.$requestGetJYW = (url,config)=>{
 import Icon from '@/AixPPTist/src/plugins/icon'
 import Directive from '@/AixPPTist/src/plugins/directive'
 
-VMdPreview.use(githubTheme, {
+VMdEditor.use(githubTheme, {
   Hljs: hljs,
 });
 
@@ -93,7 +92,7 @@ app.use(router)
     .use(Icon)
     .use(Directive)
     .use(aiAudio)
-    .use(VMdPreview)
+    .use(VMdEditor)
     .mount('#app')
 
 const isStadium = (user) => {

src/renderer/src/plugins/pptTojson/index.d.ts

@@ -0,0 +1,358 @@
+// import type { number } from "echarts"
+
+export interface Shadow {
+  h: number
+  v: number
+  blur: number
+  color: string
+}
+
+export interface Shape {
+  type: 'shape'
+  left: number
+  top: number
+  width: number
+  height: number
+  borderColor: string
+  borderWidth: number
+  borderType: 'solid' | 'dashed' | 'dotted'
+  borderStrokeDasharray: string
+  shadow?: Shadow
+  fillColor: string
+  content: string
+  isFlipV: boolean
+  isFlipH: boolean
+  rotate: number
+  shapType: string
+  vAlign: string
+  path?: string
+  name: string
+}
+
+export interface Text {
+  type: 'text'
+  left: number
+  top: number
+  width: number
+  height: number
+  borderColor: string
+  borderWidth: number
+  borderType: 'solid' | 'dashed' | 'dotted'
+  borderStrokeDasharray: string
+  shadow?: Shadow
+  fillColor: string
+  isFlipV: boolean
+  isFlipH: boolean
+  isVertical: boolean
+  rotate: number
+  content: string
+  vAlign: string
+  name: string
+}
+
+export interface Image {
+  type: 'image'
+  left: number
+  top: number
+  width: number
+  height: number
+  src: string
+  rotate: number
+  isFlipH: boolean
+  isFlipV: boolean
+}
+
+export interface TableCell {
+  text: string
+  rowSpan?: number
+  colSpan?: number
+  vMerge?: number
+  hMerge?: number
+  fillColor?: string
+  fontColor?: string
+  fontBold?: boolean
+}
+export interface Table {
+  type: 'table'
+  left: number
+  top: number
+  width: number
+  height: number
+  data: TableCell[][]
+  borderColor: string
+  borderWidth: number
+  borderType: 'solid' | 'dashed' | 'dotted'
+}
+
+export type ChartType = 'lineChart' |
+  'line3DChart' |
+  'barChart' |
+  'bar3DChart' |
+  'pieChart' |
+  'pie3DChart' |
+  'doughnutChart' |
+  'areaChart' |
+  'area3DChart' |
+  'scatterChart' |
+  'bubbleChart' |
+  'radarChart' |
+  'surfaceChart' |
+  'surface3DChart' |
+  'stockChart'
+
+export interface ChartValue {
+  x: string
+  y: number
+}
+export interface ChartXLabel {
+  [key: string]: string
+}
+export interface ChartItem {
+  key: string
+  values: ChartValue[]
+  xlabels: ChartXLabel
+}
+export type ScatterChartData = [number[], number[]]
+export interface CommonChart {
+  type: 'chart'
+  left: number
+  top: number
+  width: number
+  height: number
+  data: ChartItem[]
+  chartType: Exclude<ChartType, 'scatterChart' | 'bubbleChart'>
+  barDir?: 'bar' | 'col'
+  marker?: boolean
+  holeSize?: string
+  grouping?: string
+  style?: string
+}
+export interface ScatterChart {
+  type: 'chart'
+  left: number
+  top: number
+  width: number
+  height: number
+  data: ScatterChartData,
+  chartType: 'scatterChart' | 'bubbleChart'
+}
+export type Chart = CommonChart | ScatterChart
+
+export interface Video {
+  type: 'video'
+  left: number
+  top: number
+  width: number
+  height: number
+  blob?: string
+  src?: string
+}
+
+export interface Audio {
+  type: 'audio'
+  left: number
+  top: number
+  width: number
+  height: number
+  blob: string
+}
+
+export interface Diagram {
+  type: 'diagram'
+  left: number
+  top: number
+  width: number
+  height: number
+  elements: (Shape | Text)[]
+}
+
+export interface Math {
+  type: 'math'
+  left: number
+  top: number
+  width: number
+  height: number
+  latex: string
+}
+
+export type BaseElement = Shape | Text | Image | Table | Chart | Video | Audio | Diagram | Math
+
+export interface Group {
+  type: 'group'
+  left: number
+  top: number
+  width: number
+  height: number
+  rotate: number
+  elements: BaseElement[]
+}
+export type Element = BaseElement | Group
+
+export interface SlideColorFill {
+  type: 'color'
+  value: string
+}
+
+export interface SlideImageFill {
+  type: 'image'
+  value: {
+    picBase64: string
+    opacity: number
+  }
+}
+
+export interface SlideGradientFill {
+  type: 'gradient'
+  value: {
+    rot: number
+    colors: {
+      pos: string
+      color: string
+    }[]
+  }
+}
+
+export type SlideFill = SlideColorFill | SlideImageFill | SlideGradientFill
+
+export interface Slide {
+  fill: SlideFill
+  elements: Element[]
+  note: string
+}
+
+export interface Options {
+  slideFactor?: number
+  fontsizeFactor?: number
+}
+
+export const parse: (file: ArrayBuffer, options?: Options) => Promise<{
+  slides: Slide[]
+  size: {
+    width: number
+    height: number
+  }
+}>
+
+/** zdg: 新内容 */
+export const align = {
+  getHorizontalAlign?: (t,e,r,n) => string
+  getVerticalAlign?: (t,e,r,n) => string
+}
+export const border = {
+  getBorder?: (t,e,r) => string
+}
+export const chart = {
+  getChartInfo?: (t) => string
+}
+export const color = {
+  applyHueMod?: (t) => string
+  applyLumMod?: (t) => string
+  applyLumOff?: (t) => string
+  applySatMod?: (t) => string
+  applyShade?: (t) => string
+  applyTint?: (t) => string
+  getColorName2Hex?: (t) => string
+  hslToRgb?: (t) => string
+  hueToRgb?: (t) => string
+}
+export const fontStyle = {
+  getFontBold?: (t) => string
+  getFontColor?: (t) => string
+  getFontDecoration?: (t) => string
+  getFontDecorationLine?: (t) => string
+  getFontItalic?: (t) => string
+  getFontShadow?: (t) => string
+  getFontSize?: (t) => string
+  getFontSpace?: (t) => string
+  getFontSubscript?: (t) => string
+  getFontType?: (t) => string
+}
+export const fill = {
+  getBgGradientFill?: (bgPr, phClr, slideMasterContent, warpObj) => string|object|null
+  getBgPicFill?: (bgPr, sorce, warpObj) => object|null
+  getFillType?: (node) => string
+  getPicFill?: (type, node, warpObj) => string|null|undefined
+  getPicFillBase64?: (zipPath, zipObj) => string|null|undefined
+  getShapeFill?: (node, isSvgMode, warpObj) => object|null
+  getShapeFillBg?: (node, source, warpObj) => object<{zipPath:string,opacity:number}>|null
+  getSlideBackgroundFill?: (warpObj) => object<{type: string, value: string}>
+  getSolidFill?: (solidFill, clrMap, phClr, warpObj) => string
+}
+export const math = {
+  findOMath?: (t) => string
+  latexFormart?: (t) => string
+  parseAccent?: (t) => string
+  parseBar?: (t) => string
+  parseBox?: (t) => string
+  parseDelimiter?: (t) => string
+  parseEqArr?: (t) => string
+  parseFraction?: (t) => string
+  parseFunction?: (t) => string
+  parseGroupChr?: (t) => string
+  parseLimit?: (t) => string
+  parseMatrix?: (t) => string
+  parseNary?: (t) => string
+  parseOMath?: (t) => string
+  parseRadical?: (t) => string
+  parseSubscript?: (t) => string
+  parseSuperscript?: (t) => string
+}
+export const position = {
+  getPosition?: (t) => string
+  getPt?: (t) => string
+  getSize?: (t) => string
+}
+export const readXmlFile = {
+  readXmlFile?: (t) => string
+  simplifyLostLess?: (t) => string
+}
+export const schemeColor = {
+  getSchemeColorFromTheme?: (t) => string
+}
+export const shadow = {
+  getShadow?: (t) => string
+}
+export const shape = {
+  getCustomShapePath?: (t) => string
+  shapeArc?: (t) => string
+}
+export const table = {
+  getTableBorders?: (t) => string
+  getTableCellParams?: (t) => string
+  getTableRowParams?: (t) => string
+}
+export const text = {
+  genSpanElement?: (t) => string
+  genTextBody?: (t) => string
+  getListType?: (t) => string
+}
+export const utils = {
+  angleToDegrees?: (t) => string
+  base64ArrayBuffer?: (t) => string
+  eachElement?: (t) => string
+  escapeHtml?: (t) => string
+  extractFileExtension?: (t) => string
+  getMimeType?: (t) => string
+  getTextByPathList?: (t) => string
+  isVideoLink?: (t) => string
+  toHex?: (t) => string
+}
+
+export const genChart: (node, warpObj) => object
+export const genDiagram: (node, warpObj) => object
+export const genShape: (node, slideLayoutSpNode, slideMasterSpNode, name, type, warpObj) => object
+export const genTable: (node, warpObj) => object
+export const getContentTypes: (zip) => object
+export const getNote: (noteContent) => string
+export const getSlideInfo: (zip) => object
+export const getSlideLayoutEl: (warpObj, isPh) => Array
+export const indexNodes: (content) => object
+export const loadTheme: (zip) => object|null
+export const processCxnSpNode: (node, warpObj) => object
+export const processGraphicFrameNode: (node, warpObj, source) => string
+export const processGroupSpNode: (node, warpObj, source) => object|null
+export const processMathNode: (t) => string
+export const processNodesInSlide: (t) => string
+export const processPicNode: (t) => string
+export const processSingleSlide: (t) => string
+export const processSpNode: (t) => string

src/renderer/src/router/index.js

@@ -108,6 +108,12 @@ export const constantRoutes = [
         name: 'aiVoice',
         meta: { title: '语音生成', showBread: true }
       },
+      {
+        path: 'mindmap',
+        component: () => import('@/views/mindMap/index.vue'),
+        name: 'mindmap',
+        meta: { title: 'AI思维导图' }
+      },
     ]
   },
 

src/renderer/src/utils/ppt/svgUtils.js

@@ -0,0 +1,138 @@
+/**
+ * svg 相关工具类
+ * @module svgUtils
+ * import { svgUtils } from '@/utils/svgUtils'
+ * @author: zdg
+ */
+
+// zdg: 计算路径的边界
+export const calculatePathDimensions = (d)  => {
+  let minX = Infinity;
+  let maxX = -Infinity;
+  let minY = Infinity;
+  let maxY = -Infinity;
+  let currentX = 0;
+  let currentY = 0;
+  const commandRegex = /([A-Za-z])([^A-Za-z]+)/g;
+  let match;
+  while ((match = commandRegex.exec(d))!== null) {
+      const type = match[1];
+      const params = match[2].trim().split(/\s+|,/).map(Number);
+      switch (type) {
+          case 'M': // 移动到
+              currentX = params[0];
+              currentY = params[1];
+              break;
+          case 'L': // 直线到
+              currentX = params[0];
+              currentY = params[1];
+              break;
+          case 'H': // 水平直线
+              currentX = params[0];
+              break;
+          case 'V': // 垂直直线
+              currentY = params[0];
+              break;
+          case 'C': // 三次贝塞尔曲线
+              for (let i = 0; i < params.length; i += 6) {
+                  const control1X = params[i];
+                  const control1Y = params[i + 1];
+                  const control2X = params[i + 2];
+                  const control2Y = params[i + 3];
+                  const endX = params[i + 4];
+                  const endY = params[i + 5];
+                  // 更新边界
+                  if (control1X < minX) minX = control1X;
+                  if (control1X > maxX) maxX = control1X;
+                  if (control1Y < minY) minY = control1Y;
+                  if (control1Y > maxY) maxY = control1Y;
+                  if (control2X < minX) minX = control2X;
+                  if (control2X > maxX) maxX = control2X;
+                  if (control2Y < minY) minY = control2Y;
+                  if (control2Y > maxY) maxY = control2Y;
+                  if (endX < minX) minX = endX;
+                  if (endX > maxX) maxX = endX;
+                  if (endY < minY) minY = endY;
+                  if (endY > maxY) maxY = endY;
+                  currentX = endX;
+                  currentY = endY;
+              }
+              break;
+          case 'S': // 光滑三次贝塞尔曲线
+              for (let i = 0; i < params.length; i += 4) {
+                  const controlX = params[i];
+                  const controlY = params[i + 1];
+                  const endX = params[i + 2];
+                  const endY = params[i + 3];
+                  // 更新边界
+                  if (controlX < minX) minX = controlX;
+                  if (controlX > maxX) maxX = controlX;
+                  if (controlY < minY) minY = controlY;
+                  if (controlY > maxY) maxY = controlY;
+                  if (endX < minX) minX = endX;
+                  if (endX > maxX) maxX = endX;
+                  if (endY < minY) minY = endY;
+                  if (endY > maxY) maxY = endY;
+                  currentX = endX;
+                  currentY = endY;
+              }
+              break;
+          case 'Q': // 二次贝塞尔曲线
+              for (let i = 0; i < params.length; i += 4) {
+                  const controlX = params[i];
+                  const controlY = params[i + 1];
+                  const endX = params[i + 2];
+                  const endY = params[i + 3];
+                  // 更新边界
+                  if (controlX < minX) minX = controlX;
+                  if (controlX > maxX) maxX = controlX;
+                  if (controlY < minY) minY = controlY;
+                  if (controlY > maxY) maxY = controlY;
+                  if (endX < minX) minX = endX;
+                  if (endX > maxX) maxX = endX;
+                  if (endY < minY) minY = endY;
+                  if (endY > maxY) maxY = endY;
+                  currentX = endX;
+                  currentY = endY;
+              }
+              break;
+          case 'T': // 光滑二次贝塞尔曲线
+              for (let i = 0; i < params.length; i += 2) {
+                  const endX = params[i];
+                  const endY = params[i + 1];
+                  // 更新边界
+                  if (endX < minX) minX = endX;
+                  if (endX > maxX) maxX = endX;
+                  if (endY < minY) minY = endY;
+                  if (endY > maxY) maxY = endY;
+                  currentX = endX;
+                  currentY = endY;
+              }
+              break;
+          case 'A': // 椭圆弧
+              const endX = params[5];
+              const endY = params[6];
+              // 更新边界
+              if (endX < minX) minX = endX;
+              if (endX > maxX) maxX = endX;
+              if (endY < minY) minY = endY;
+              if (endY > maxY) maxY = endY;
+              currentX = endX;
+              currentY = endY;
+              break;
+          case 'Z': // 闭合路径
+              // 闭合路径不影响边界，这里不需要额外操作
+              break;
+          default:
+              console.error(`Unknown command: ${type}`);
+              break;
+      }
+      if (currentX < minX) minX = currentX;
+      if (currentX > maxX) maxX = currentX;
+      if (currentY < minY) minY = currentY;
+      if (currentY > maxY) maxY = currentY;
+  }
+  const width = maxX - minX;
+  const height = maxY - minY;
+  return { width, height };
+}

src/renderer/src/utils/talkFile/index.js

@@ -87,6 +87,15 @@ export const exportFile = async (list) => {
   })
 }
 
+export const exportImg64File = async (base64, name) => {
+  return new Promise((resolve, reject) => {
+    ipcRenderer.send('export-img64-file', {base64,name})
+    ipcRenderer.once('export-img64-file-reply', (e) => {
+      resolve()
+    })
+  })
+}
+
 export const creatPPT = (name, uploadData) => {
   JSON.parse(JSON.stringify(uploadData))
   return new Promise((resolve, reject) => {

src/renderer/src/views/mindMap/index.vue

@@ -0,0 +1,267 @@
+<template>
+  <div class="page-mindmap flex flex-col h-full">
+    <div class="mindmap-header flex items-center justify-between pl-5">
+      <div class="flex w-1/2 items-center justify-between">
+        <div>
+          <b>AI思维导图</b> <span class="ml-5">《{{ curNode.itemtitle }}》</span>
+        </div>
+        <div>
+          <template v-if="isEdit">
+            <el-button class="mr-3" @click="isEdit = false">取消</el-button>
+            <el-button type="success" class="mr-3" @click="isEdit = false">保存</el-button>
+          </template>
+<!--          <el-button v-else type="primary" class="mr-3" @click="isEdit = true">编辑</el-button>-->
+<!--          <el-select v-model="curMode" class="mr-3 w-30">
+            <el-option
+              v-for="item in modeOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>-->
+        </div>
+      </div>
+      <div>
+        导出清晰度：<el-input-number v-model="scale" :min="1" :max="10" />数字越大越清晰，但图片大小会越大
+        <el-button @click="outputImg" type="primary">导出图片</el-button>
+      </div>
+    </div>
+    <div class="mindmap-main flex flex-1" style="overflow: auto;">
+      <div class="w-1/3 h-full p-3 main-left flex flex-col" v-loading="loadingAnswer" style="overflow: auto;">
+        <div class="flex flex-1" style="overflow: auto;">
+          <v-md-editor v-model="resMarkdown" :mode="isEdit ? 'edit' : 'preview'" />
+        </div>
+        <div class="main-left-ipt">
+          <el-input
+            v-model="textVal"
+            style="max-width: 600px"
+            placeholder="请输入信息对内容进一步调整"
+            class="input-with-select"
+          >
+            <template #append>
+              <el-icon size="20" style="cursor: pointer;" @click="sendMessage"><Position /></el-icon>
+            </template>
+          </el-input>
+<!--          <el-input style="float: left;" v-model="textVal" size="large" placeholder="请输入信息对内容进一步调整" /><el-button>发送</el-button>-->
+        </div>
+      </div>
+      <div class="w-2/3 h-full main-right">
+        <mindmap v-if="rootData" :timetravel="true" :drag="true" :zoom="true" :edit="true"
+                 :center-btn="true" :fit-btn="true" :ctm="true" :add-node-btn="true"
+                 v-model="rootData"></mindmap>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted, computed, watch } from 'vue'
+import { Position } from "@element-plus/icons-vue"
+import { sessionStore } from '@/utils/store'
+import { modelList, completion, modelChat } from '@/api/mode/index.js'
+import { createChart, sendChart } from '@/api/ai/index'
+import { Transformer } from 'markmap-lib'
+import mindmap from 'vue3-mindmap'
+import html2canvas from 'html2canvas'
+import 'vue3-mindmap/dist/style.css'
+import {exportImg64File} from "@/utils/talkFile";
+import axios from 'axios'
+
+const transformer = new Transformer()
+
+// 当前节点
+const curNode = reactive({})
+
+const textVal = ref(``)
+
+const loadingAnswer = ref(false)
+
+const scale = ref(5)
+
+// const textVal = computed(() => {
+//   return `生成${curNode.itemtitle}的教学思维导图，按照markdown的格式编写，只返回markdown的部分`
+// })
+
+const curMode = ref(2)
+const modeOptions = ref([
+  {
+    label: '教学大模型',
+    value: 1
+  },
+  {
+    label: '知识库模型',
+    value: 2,
+  }
+])
+
+const isEdit = ref(false)
+
+// AI 对话
+const resMarkdown = ref(``)
+const params = reactive({
+  prompt: '',
+  dataset_id: '',
+  template: ''
+})
+const messages = ref([
+  {
+    role: 'user',
+    content: ''
+  }
+])
+const aiConversation = async () => {
+  console.log(prompt.value)
+  // return
+  // params.prompt = prompt.value.replace(/{模板名称}/g, '')
+  // 暂时用死数据
+  // let str =  '针对高中语文必修上册-人教版《静女》这一课根据设置情境、引导学习进行课件教学PPT内容设计，只需要涉及到设置情境、引导学习的内容即可，不需要封面、结尾和其它内容。'
+  // messages.value[0].content = str
+  params.prompt = prompt.value
+  // 教学大模型
+  loadingAnswer.value = true
+  if (curMode.value == 1) {
+    const res = await sendChart({
+      content: params.prompt,
+      conversationId: conversation_id.value,
+      stream: false
+    })
+    resMarkdown.value = res.data.answer.replaceAll('```markdown','').replaceAll('```', '')
+  }
+  // 知识库模型
+  else {
+    let data =  {
+      "messages": [
+        {
+          "role": "user",
+          "content": params.prompt
+        }
+      ]
+    }
+    const res = await text2mindmap(data).finally(() => {
+      loadingAnswer.value = false
+    })
+    console.log(res)
+    resMarkdown.value = res.data.answer.content.replaceAll('```markdown','').replaceAll('```', '')
+  }
+}
+
+const sendMessage = async () => {
+  loadingAnswer.value = true
+  rootData.value = null
+  let data = {
+    "messages": [
+      {
+        "role":"assiatant",
+        "content": resMarkdown.value
+      },
+      {
+        "role": "user",
+        "content": `${textVal.value}，${prompt.value}`
+      }
+    ]
+  }
+  let res = await text2mindmap(data).finally(() => {
+    loadingAnswer.value = false
+  })
+  resMarkdown.value = res.data.answer.content.replaceAll('```markdown','').replaceAll('```', '')
+}
+
+const text2mindmap =(data)=> {
+  return axios({
+    url: "https://ai.ysaix.com:7865/chat",
+    method: "post",
+    headers: {
+      "Content-Type": "application/json",
+      Accept: "*/*",
+    },
+    data:data
+  });
+}
+
+// 查询prompt 替换
+const prompt = ref('')
+const getPrompt = async () => {
+  const { rows } = await modelList({ model: 5 })
+  let str = rows.find((item) => item.name.indexOf('思维导图') != -1).prompt
+
+  str = str.replace('{学段}', curNode.edustage)
+  str = str.replace('{学科}', curNode.edusubject)
+  let bookV = curNode.roottitle + '版'
+  str = str.replace('{教材版本}', bookV)
+  str = str.replace('{课程名称}', `《${curNode.itemtitle}》`)
+  prompt.value = str
+}
+
+// 千帆创建对话
+const conversation_id = ref('')
+const getChartId = async () => {
+  const res = await createChart()
+  conversation_id.value = res.data.conversation_id
+    // ai 对话
+    aiConversation()
+}
+
+const rootData = ref(null)
+
+const degure = (item) => {
+  item.name = item.content.replace(/<[^>]*>/g, '');;
+  if (item.children && item.children.length) {
+    item.children.forEach(item2 => {
+      degure(item2)
+    })
+  }
+}
+
+const outputImg = () => {
+  let svg = window.document.getElementById('Mindmap_svg-wrapper_fgvb6')
+  // let das = svg.querySelectorAll('.Mindmap_root_fgvb6')[0]
+  html2canvas(svg,{
+    scale: scale.value
+  }).then((canvas) => {
+    const dataUrl = canvas.toDataURL()
+    exportImg64File(dataUrl, `${curNode.itemtitle}思维导图`)
+  })
+  // mm.value.fit()
+}
+// 初始化
+onMounted(() => {
+  let data = sessionStore.get('subject.curNode')
+  Object.assign(curNode, data)
+
+  // 获取提示词
+  getPrompt()
+  // 获取百度千帆会话ID
+  getChartId()
+
+})
+// 监听 initValue 的变化
+watch(() => resMarkdown.value, () => {
+  const { root } = transformer.transform(resMarkdown.value)
+  degure(root)
+  rootData.value = [root]
+  console.log(rootData.value)
+})
+</script>
+
+<style lang="scss" scoped>
+.mindmap-header {
+  background: #fff;
+  height: 45px;
+  border-radius: 5px;
+  margin-bottom: 20px;
+}
+.main-left {
+  background: #fff;
+  border-radius: 5px;
+  .main-left-ipt {
+    height: 40px;
+  }
+}
+.main-right{
+  border: 1px solid #ccc;
+  svg {
+    width: 100%;
+    height: 100%;
+  }
+}
+</style>

src/renderer/src/views/model/index.vue

@@ -161,6 +161,10 @@ const tools = reactive([{
   name: '文生图片',
   path: '/model/aiKolors',
   img: 'aiimg'
+},{
+  name: 'AI思维导图',
+  path: '/model/mindmap',
+  img: 'aiswdt'
 },{
   name: '文生连环画',
   path: '',
@@ -304,6 +308,8 @@ const pgDialog = ref({ // 弹窗-进度条
 
 const fileInput = ref(null)
 
+let pptMedia = {} // ppt媒体数据
+
 const openFilePicker = () =>{
   fileInput.value.click();
 }
@@ -319,6 +325,7 @@ const handleFileChange = ()=> {
 const createAIPPTByFile = async (file)=> {
   pgDialog.value.visible = true
   pgDialog.value.pg.percentage = 0
+  pptMedia = {} // 清空媒体数据
   const resPptJson = await PPTXFileToJson(file).catch(() => {
     ElMessageBox.alert('PPT文件转换失败！请点击素材右侧...下载文件后打开另存为PPTX文件格式再进行导入！')
     pgDialog.value.visible = false
@@ -394,42 +401,66 @@ const createAIPPTByFile = async (file)=> {
     })
   })
 }
-
+// 将图片|音频|视频 转换为线上地址
-const toRousrceUrl = async (o) => {
+const getOnlineFileUrl = (data, name) => {
-  if (!!o.src) { // 如果有src就转换
+  return new Promise(async (resolve, reject) => {
-    const isBase64 = /^data:image\/(\w+);base64,/.test(o.src)
+    let file
-    const isBlobUrl = /^blob:/.test(o.src)
+    if (data instanceof Blob) { // blob类型判断
-    // console.log('isBase64', o, isBase64)
+      const fileName = Date.now() + `.${name||'png'}`
-    if (isBase64) {
+      file = commUtils.blobToFile(data, fileName)
-      const bolb = commUtils.base64ToBlob(o.src)
+    } else if (data instanceof File) { // file类型判断
-      const fileName = Date.now() + '.png'
+      file = data
-      const file = commUtils.blobToFile(bolb, fileName)
+    } else { // 其他类型 base64
-      // o.src = fileName
+      const blob = commUtils.base64ToBlob(data)
-      // console.log('file', file)
+      const fileName = Date.now() + `.${name||'png'}`
+      file = commUtils.blobToFile(blob, fileName)
+    }
     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
+      resolve(res?.url)
-        url &&(o.src = url)
+    } else { // 失败
+      reject(res?.msg||'上传失败')
     }
+  })
+}
+const toRousrceUrl = async (o) => {
+  if (!!o.src) { // 如果有src就转换
+    const isBase64 = /^data:image\/(\w+);base64,/.test(o.src)
+    const isBlobUrl = /^blob:/.test(o.src)
+    let onLineUrl = '' // 线上地址
+    if (!!o.zipPath) onLineUrl = pptMedia[o.zipPath] || '' // 是否已上传过
+    if (onLineUrl) o.src = onLineUrl // 已存在线上地址直接赋值
+    else { // 不存在重新上传
+      if (isBase64) { // 相同资源处理
+        const url = await getOnlineFileUrl(o.src)
+        url && o.zipPath && (pptMedia[o.zipPath] = url) // 缓存
       } else if (isBlobUrl) { // 视频和音频
         const res = await fetch(o.src)
         const blob = await res.blob()
-      const fileName = o.type=='video'? Date.now() + '.mp4':Date.now() + '.mp3'
+        const url = await getOnlineFileUrl(blob, o.type=='video'?'mp4':'mp3')
-      const file = commUtils.blobToFile(blob, fileName)
+        URL.revokeObjectURL(o.src) // 释放内存
-      // o.src = fileName
-      // console.log('file', file)
-      const formData = new FormData()
-      formData.append('file', file)
-      const ress = await Api_server.Other.uploadFile(formData)
-      if (ress && ress.code == 200){
-        const url = ress?.url
         url &&(o.src = url)
+        url && o.zipPath && (pptMedia[o.zipPath] = url) // 缓存
       }
     }
   }
 
+  // 处理元素为shape 可能存在背景图等
+  const isBg = o?.gradient?.type == 'image' && !!o?.gradient?.image
+  if (isBg) {
+    const {src, zipPath} = o.gradient.image || {}
+    let onLineUrl = '' // 线上地址
+    if (!!zipPath) onLineUrl = pptMedia[zipPath] || '' // 是否已上传过
+    if (onLineUrl) o.gradient.image.src = onLineUrl // 已存在线上地址直接赋值
+    else { // 重新上传
+      const url = await getOnlineFileUrl(src)
+      o.gradient.image.src = url
+      url && zipPath && (pptMedia[zipPath] = url) // 缓存
+    }
+  }
+
   if (o?.background?.image) await toRousrceUrl(o.background.image)
   if(o?.elements){
     for (let element of o.elements) {

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

@@ -289,7 +289,8 @@ export default {
             { color: '#5cb87a', percentage: 100 }, // 绿色
           ]
         }
-      }
+      },
+      pptMedia: {} // ppt媒体数据
     }
   },
   computed: {
@@ -591,43 +592,66 @@ export default {
         this.createAIPPTByFile(file, this.currentNode.itemtitle + '.aippt')
       }
     },
-    async toRousrceUrl(o) {
+    // 将图片|音频|视频 转换为线上地址
-      if (!!o.src) { // 如果有src就转换
+    getOnlineFileUrl(data, name){
-        const isBase64 = /^data:image\/(\w+);base64,/.test(o.src)
+      return new Promise(async (resolve, reject) => {
-        const isBlobUrl = /^blob:/.test(o.src)
+        let file
-        // console.log('isBase64', o, isBase64)
+        if (data instanceof Blob) { // blob类型判断
-        if (isBase64) {
+          const fileName = Date.now() + `.${name||'png'}`
-          const bolb = commUtils.base64ToBlob(o.src)
+          file = commUtils.blobToFile(data, fileName)
-          const fileName = Date.now() + '.png'
+        } else if (data instanceof File) { // file类型判断
-          const file = commUtils.blobToFile(bolb, fileName)
+          file = data
-          // o.src = fileName
+        } else { // 其他类型 base64
-          // console.log('file', file)
+          const blob = commUtils.base64ToBlob(data)
+          const fileName = Date.now() + `.${name||'png'}`
+          file = commUtils.blobToFile(blob, fileName)
+        }
         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
+          resolve(res?.url)
-            url &&(o.src = url)
+        } else { // 失败
+          reject(res?.msg||'上传失败')
         }
+      })
+    },
+    async toRousrceUrl(o) {
+      if (!!o.src) { // 如果有src就转换
+        const isBase64 = /^data:image\/(\w+);base64,/.test(o.src)
+        const isBlobUrl = /^blob:/.test(o.src)
+        let onLineUrl = '' // 线上地址
+        if (!!o.zipPath) onLineUrl = this.pptMedia[o.zipPath] || '' // 是否已上传过
+        if (onLineUrl) o.src = onLineUrl // 已存在线上地址直接赋值
+        else { // 不存在重新上传
+          if (isBase64) { // 相同资源处理
+            const url = await this.getOnlineFileUrl(o.src)
+            url && o.zipPath && (this.pptMedia[o.zipPath] = url) // 缓存
           } else if (isBlobUrl) { // 视频和音频
             const res = await fetch(o.src)
             const blob = await res.blob()
-          const fileName = o.type=='video'? Date.now() + '.mp4':Date.now() + '.mp3'
+            const url = await this.getOnlineFileUrl(blob, o.type=='video'?'mp4':'mp3')
-          const file = commUtils.blobToFile(blob, fileName)
+            URL.revokeObjectURL(o.src) // 释放内存
-          // o.src = fileName
-          // console.log('file', file)
-          const formData = new FormData()
-          formData.append('file', file)
-          const ress = await Api_server.Other.uploadFile(formData)
-          if (ress && ress.code == 200){
-            const url = ress?.url
             url &&(o.src = url)
+            url && o.zipPath && (this.pptMedia[o.zipPath] = url) // 缓存
           }
         }
       }
+      // 处理元素为shape 可能存在背景图等
+      const isBg = o?.gradient?.type == 'image' && !!o?.gradient?.image
+      if (isBg) {
+        const {src, zipPath} = o.gradient.image || {}
+        let onLineUrl = '' // 线上地址
+        if (!!zipPath) onLineUrl = this.pptMedia[zipPath] || '' // 是否已上传过
+        if (onLineUrl) o.gradient.image.src = onLineUrl // 已存在线上地址直接赋值
+        else { // 重新上传
+          const url = await this.getOnlineFileUrl(src)
+          o.gradient.image.src = url
+          url && zipPath && (this.pptMedia[zipPath] = url) // 缓存
+        }
+      }
       
       if (o?.background?.image) await this.toRousrceUrl(o.background.image)
-      // if (o?.elements) o.elements.forEach(async o => {await this.toRousrceUrl(o)})
       if(o?.elements){
         for (let element of o.elements) {
             await this.toRousrceUrl(element);
@@ -637,6 +661,7 @@ export default {
     async createAIPPTByFile(file,fileShowName) {
       this.pgDialog.visible = true
       this.pgDialog.pg.percentage = 0
+      this.pptMedia = {} // 清空媒体数据
       const resPptJson = await PPTXFileToJson(file).catch(() => {
         ElMessageBox.alert('PPT文件转换失败！请点击素材右侧...下载文件后打开另存为PPTX文件格式再进行导入！')
         this.pgDialog.visible = false

src/renderer/src/views/profile/userAvatar.vue

@@ -1,6 +1,11 @@
 <template>
   <div class="user-info-head" @click="editCropper()">
-    <img :src="options.img" title="点击上传头像" class="img-circle img-lg" />
+    <!-- <img :src="options.img" title="点击上传头像" class="img-circle img-lg" /> -->
+    <el-image class="user-img" :src="options.img" style="width: 120px;">
+      <template #error>
+        <img :src="route_path + userStore.user.avatar">
+      </template>
+    </el-image>
     <el-dialog
       v-model="open"
       append-to-body
@@ -31,6 +36,7 @@ const userStore = useUserStore()
 const open = ref(false)
 const visible = ref(false)
 const dev_api = ref(import.meta.env.VITE_APP_BASE_API)
+const route_path = ref(import.meta.env.VITE_APP_BUILD_BASE_PATH)
 const defaultImg = ['/img/avatar-default.jpg','/images/img-avatar.png','/src/assets/images/img-avatar.png']
 
 //图片裁剪数据

src/renderer/src/views/teachingDesign/container/center.vue

@@ -17,8 +17,8 @@
     </div>
     <div class="center-con" v-loading="loading">
       <!-- <v-md-editor v-if="markeDownAnswer" :model-value="markeDownAnswer" mode="preview"></v-md-editor> -->
-      <v-md-preview v-if="markeDownAnswer" :text="markeDownAnswer"></v-md-preview>
+      <!-- <v-md-preview v-if="markeDownAnswer" :text="markeDownAnswer"></v-md-preview> -->
-      
+      <v-md-editor v-if="markeDownAnswer" v-model="markeDownAnswer" mode="preview" />
       <el-empty v-else description="请选择符合您需要的教学模式，生成教学大纲" />
     </div>
   </div>