Merge branch 'main' of http://27.128.240.72:3000/zhuhao/AIx_Smarttalk_WS into zdg_dev
This commit is contained in:
zdg
commit
433161ef13
|
|
@ -6,11 +6,11 @@ directories:
|
||||||
win:
|
win:
|
||||||
executableName: 文枢课堂
|
executableName: 文枢课堂
|
||||||
icon: resources/logo2.ico
|
icon: resources/logo2.ico
|
||||||
target:
|
# target:
|
||||||
- target: nsis
|
# - target: nsis
|
||||||
arch:
|
# arch:
|
||||||
- x64
|
# - x64
|
||||||
- ia32
|
# - ia32
|
||||||
files:
|
files:
|
||||||
- '!**/.vscode/*'
|
- '!**/.vscode/*'
|
||||||
- '!src/*'
|
- '!src/*'
|
||||||
|
|
|
||||||
|
|
@ -6,11 +6,11 @@ directories:
|
||||||
win:
|
win:
|
||||||
executableName: 永川中小学AI教学系统
|
executableName: 永川中小学AI教学系统
|
||||||
icon: resources/yc-logo.png
|
icon: resources/yc-logo.png
|
||||||
target:
|
# target:
|
||||||
- target: nsis
|
# - target: nsis
|
||||||
arch:
|
# arch:
|
||||||
- x64
|
# - x64
|
||||||
- ia32
|
# - ia32
|
||||||
files:
|
files:
|
||||||
- '!**/.vscode/*'
|
- '!**/.vscode/*'
|
||||||
- '!src/*'
|
- '!src/*'
|
||||||
|
|
|
||||||
|
|
@ -6,11 +6,11 @@ directories:
|
||||||
win:
|
win:
|
||||||
executableName: 实训教学
|
executableName: 实训教学
|
||||||
icon: resources/yc-logo.png
|
icon: resources/yc-logo.png
|
||||||
target:
|
# target:
|
||||||
- target: nsis
|
# - target: nsis
|
||||||
arch:
|
# arch:
|
||||||
- x64
|
# - x64
|
||||||
- ia32
|
# - ia32
|
||||||
files:
|
files:
|
||||||
- '!**/.vscode/*'
|
- '!**/.vscode/*'
|
||||||
- '!src/*'
|
- '!src/*'
|
||||||
|
|
|
||||||
|
|
@ -6,11 +6,11 @@ directories:
|
||||||
win:
|
win:
|
||||||
executableName: 育人酉数平台
|
executableName: 育人酉数平台
|
||||||
icon: resources/yy-logo.png
|
icon: resources/yy-logo.png
|
||||||
target:
|
# target:
|
||||||
- target: nsis
|
# - target: nsis
|
||||||
arch:
|
# arch:
|
||||||
- x64
|
# - x64
|
||||||
- ia32
|
# - ia32
|
||||||
files:
|
files:
|
||||||
- '!**/.vscode/*'
|
- '!**/.vscode/*'
|
||||||
- '!src/*'
|
- '!src/*'
|
||||||
|
|
|
||||||
|
|
@ -13,11 +13,11 @@ asarUnpack:
|
||||||
win:
|
win:
|
||||||
executableName: AIx
|
executableName: AIx
|
||||||
icon: resources/logo2.ico
|
icon: resources/logo2.ico
|
||||||
target:
|
# target:
|
||||||
- target: nsis
|
# - target: nsis
|
||||||
arch:
|
# arch:
|
||||||
- x64
|
# - x64
|
||||||
- ia32
|
# - ia32
|
||||||
nsis:
|
nsis:
|
||||||
oneClick: false
|
oneClick: false
|
||||||
allowToChangeInstallationDirectory: true
|
allowToChangeInstallationDirectory: true
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "aix-win-ws",
|
"name": "aix-win-ws",
|
||||||
"version": "2.5.16",
|
"version": "2.5.17",
|
||||||
"description": "",
|
"description": "",
|
||||||
"main": "./out/main/index.js",
|
"main": "./out/main/index.js",
|
||||||
"author": "上海交大重庆人工智能研究院",
|
"author": "上海交大重庆人工智能研究院",
|
||||||
|
|
@ -44,7 +44,7 @@
|
||||||
"@vue-office/excel": "^1.7.11",
|
"@vue-office/excel": "^1.7.11",
|
||||||
"@vue-office/pdf": "^2.0.2",
|
"@vue-office/pdf": "^2.0.2",
|
||||||
"@vueuse/core": "^10.11.0",
|
"@vueuse/core": "^10.11.0",
|
||||||
"aix-plugins-aitools": "^1.1.5",
|
"aix-plugins-aitools": "^1.1.10",
|
||||||
"animate.css": "^4.1.1",
|
"animate.css": "^4.1.1",
|
||||||
"circular-json": "^0.5.9",
|
"circular-json": "^0.5.9",
|
||||||
"clipboard": "^2.0.11",
|
"clipboard": "^2.0.11",
|
||||||
|
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 107 KiB After Width: | Height: | Size: 79 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 107 KiB After Width: | Height: | Size: 21 KiB |
|
|
@ -23,7 +23,7 @@
|
||||||
</li>
|
</li>
|
||||||
<li v-if="computedregistertype!=4" :class="computedregistertype==1 || computedregistertype==2 ? '':'pointer-events'" @click="onUserTo('/joinSchool')">加入学校</li>
|
<li v-if="computedregistertype!=4" :class="computedregistertype==1 || computedregistertype==2 ? '':'pointer-events'" @click="onUserTo('/joinSchool')">加入学校</li>
|
||||||
<li @click="onUserTo('/profile')">个人中心</li>
|
<li @click="onUserTo('/profile')">个人中心</li>
|
||||||
<li v-if="isStadium() !== true" @click="onUserTo('/schoolManagement')">学校管理</li>
|
<li v-if="isStadium() !== true && checkRole(['admin','headmaster'])" @click="onUserTo('/schoolManagement')">学校管理</li>
|
||||||
<li v-if="isStadium() !== true" @click="onUserTo('/class')">班级中心</li>
|
<li v-if="isStadium() !== true" @click="onUserTo('/class')">班级中心</li>
|
||||||
<li @click="logout">退出登录</li>
|
<li @click="logout">退出登录</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
@ -65,7 +65,7 @@ import pkc from "../../../../../package.json"
|
||||||
import defaultUserImg from '@/assets/images/img-avatar.png'
|
import defaultUserImg from '@/assets/images/img-avatar.png'
|
||||||
import { sessionStore } from '@/utils/store'
|
import { sessionStore } from '@/utils/store'
|
||||||
import {toLinkLeftWeb} from "@/utils/tool"
|
import {toLinkLeftWeb} from "@/utils/tool"
|
||||||
|
import { checkRole } from '@/utils/permission'
|
||||||
|
|
||||||
const { ipcRenderer } = window.electron || {}
|
const { ipcRenderer } = window.electron || {}
|
||||||
const dev_api = ref(import.meta.env.VITE_APP_BASE_API)
|
const dev_api = ref(import.meta.env.VITE_APP_BASE_API)
|
||||||
|
|
@ -86,6 +86,7 @@ const defaultImg = ['/img/avatar-default.jpg','/images/img-avatar.png','/src/ass
|
||||||
|
|
||||||
//是否是基地人员
|
//是否是基地人员
|
||||||
const isStadium = () => {
|
const isStadium = () => {
|
||||||
|
console.log('isStadium',userStore.roles )
|
||||||
let user = userStore.user
|
let user = userStore.user
|
||||||
let roles = user.roles
|
let roles = user.roles
|
||||||
return roles.some(item => item.roleKey === 'stadium')
|
return roles.some(item => item.roleKey === 'stadium')
|
||||||
|
|
|
||||||
|
|
@ -25,7 +25,7 @@ import log from 'electron-log/renderer' // 渲染进程日志-文件记录
|
||||||
import customComponent from '@/components/common' // 自定义组件
|
import customComponent from '@/components/common' // 自定义组件
|
||||||
import plugins from './plugins' // plugins插件
|
import plugins from './plugins' // plugins插件
|
||||||
import useUserStore from '@/store/modules/user'
|
import useUserStore from '@/store/modules/user'
|
||||||
import aiAudio from 'aix-plugins-aitools' // 文字转语音插件
|
import aiTools from 'aix-plugins-aitools' // 文字转语音插件
|
||||||
import '../../../node_modules/aix-plugins-aitools/aitools.css'
|
import '../../../node_modules/aix-plugins-aitools/aitools.css'
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -91,7 +91,7 @@ app.use(router)
|
||||||
.use(plugins)
|
.use(plugins)
|
||||||
.use(Icon)
|
.use(Icon)
|
||||||
.use(Directive)
|
.use(Directive)
|
||||||
.use(aiAudio)
|
.use(aiTools)
|
||||||
.use(VMdEditor)
|
.use(VMdEditor)
|
||||||
.mount('#app')
|
.mount('#app')
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,51 @@
|
||||||
|
import useUserStore from '@/store/modules/user'
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 字符权限校验
|
||||||
|
* @param {Array} value 校验值
|
||||||
|
* @returns {Boolean}
|
||||||
|
*/
|
||||||
|
export function checkPermi(value) {
|
||||||
|
if (value && value instanceof Array && value.length > 0) {
|
||||||
|
const permissions = useUserStore().permissions
|
||||||
|
const permissionDatas = value
|
||||||
|
const all_permission = "*:*:*";
|
||||||
|
|
||||||
|
const hasPermission = permissions.some(permission => {
|
||||||
|
return all_permission === permission || permissionDatas.includes(permission)
|
||||||
|
})
|
||||||
|
|
||||||
|
if (!hasPermission) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
return true
|
||||||
|
} else {
|
||||||
|
console.error(`need roles! Like checkPermi="['system:user:add','system:user:edit']"`)
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 角色权限校验
|
||||||
|
* @param {Array} value 校验值
|
||||||
|
* @returns {Boolean}
|
||||||
|
*/
|
||||||
|
export function checkRole(value) {
|
||||||
|
if (value && value instanceof Array && value.length > 0) {
|
||||||
|
const roles = useUserStore().roles
|
||||||
|
const permissionRoles = value
|
||||||
|
const super_admin = "admin";
|
||||||
|
|
||||||
|
const hasRole = roles.some(role => {
|
||||||
|
return super_admin === role || permissionRoles.includes(role)
|
||||||
|
})
|
||||||
|
|
||||||
|
if (!hasRole) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
return true
|
||||||
|
} else {
|
||||||
|
console.error(`need roles! Like checkRole="['admin','editor']"`)
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -1,267 +1,91 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="page-mindmap flex flex-col h-full">
|
<aiMindMap
|
||||||
<div class="mindmap-header flex items-center justify-between pl-5">
|
@exportImg="exportImg"
|
||||||
<div class="flex w-1/2 items-center justify-between">
|
@createMindMap="createMindMap"
|
||||||
<div>
|
@reloadMindMap="reloadMindMap"
|
||||||
<b>AI思维导图</b> <span class="ml-5">《{{ curNode.itemtitle }}》</span>
|
ref="mindMapRef"
|
||||||
</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>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, reactive, onMounted, computed, watch } from 'vue'
|
import {onMounted, ref} from "vue";
|
||||||
import { Position } from "@element-plus/icons-vue"
|
// import aiMindMap from './mindMapAITools.vue'
|
||||||
import { sessionStore } from '@/utils/store'
|
import {sessionStore} from "@/utils/store";
|
||||||
import { modelList, completion, modelChat } from '@/api/mode/index.js'
|
import {editTempResult, modelList, tempResult, tempSave} from "@/api/mode";
|
||||||
import { createChart, sendChart } from '@/api/ai/index'
|
import {exportImg64File} from "@/utils/talkFile";
|
||||||
import { Transformer } from 'markmap-lib'
|
import useUserStore from '@/store/modules/user'
|
||||||
import mindmap from 'vue3-mindmap'
|
const { user } = useUserStore()
|
||||||
import html2canvas from 'html2canvas'
|
|
||||||
import 'vue3-mindmap/dist/style.css'
|
|
||||||
import {exportImg64File} from "@/utils/talkFile";
|
|
||||||
import axios from 'axios'
|
|
||||||
|
|
||||||
const transformer = new Transformer()
|
const showMap = ref(false)
|
||||||
|
const prompt = ref('')
|
||||||
|
const url = ref("https://ai.ysaix.com:7865/chat")
|
||||||
|
|
||||||
// 当前节点
|
let curNode = sessionStore.get('subject.curNode')
|
||||||
const curNode = reactive({})
|
const title = ref(curNode.itemtitle)
|
||||||
|
let curModel = ref({})
|
||||||
const textVal = ref(``)
|
const getPrompt = async () => {
|
||||||
|
let str = curModel.value.prompt
|
||||||
const loadingAnswer = ref(false)
|
str = str.replace('{学段}', curNode.edustage)
|
||||||
|
str = str.replace('{学科}', curNode.edusubject)
|
||||||
const scale = ref(5)
|
let bookV = curNode.roottitle + '版'
|
||||||
|
str = str.replace('{教材版本}', bookV)
|
||||||
// const textVal = computed(() => {
|
str = str.replace('{课程名称}', `《${curNode.itemtitle}》`)
|
||||||
// return `生成${curNode.itemtitle}的教学思维导图，按照markdown的格式编写，只返回markdown的部分`
|
prompt.value = str
|
||||||
// })
|
|
||||||
|
|
||||||
const curMode = ref(2)
|
|
||||||
const modeOptions = ref([
|
|
||||||
{
|
|
||||||
label: '教学大模型',
|
|
||||||
value: 1
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '知识库模型',
|
|
||||||
value: 2,
|
|
||||||
}
|
}
|
||||||
])
|
|
||||||
|
|
||||||
const isEdit = ref(false)
|
const exportImg = (data) => {
|
||||||
|
exportImg64File(data, `${curNode.itemtitle}思维导图`)
|
||||||
|
}
|
||||||
|
|
||||||
// AI 对话
|
const createMindMap = async (data) => {
|
||||||
const resMarkdown = ref(``)
|
if (tempData.value) {
|
||||||
const params = reactive({
|
tempData.value.content = data
|
||||||
prompt: '',
|
await editTempResult(tempData.value)
|
||||||
dataset_id: '',
|
}else {
|
||||||
template: ''
|
const item = {
|
||||||
})
|
mainModelId: 5,
|
||||||
const messages = ref([
|
modelId: curModel.value.id,
|
||||||
{
|
content: data,
|
||||||
role: 'user',
|
ex1: curNode.id
|
||||||
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}`
|
|
||||||
}
|
}
|
||||||
]
|
await tempSave(item)
|
||||||
|
await getTempData()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
let res = await text2mindmap(data).finally(() => {
|
|
||||||
loadingAnswer.value = false
|
|
||||||
})
|
|
||||||
resMarkdown.value = res.data.answer.content.replaceAll('```markdown','').replaceAll('```', '')
|
|
||||||
}
|
|
||||||
|
|
||||||
const text2mindmap =(data)=> {
|
const reloadMindMap = async (data) => {
|
||||||
return axios({
|
tempData.value.content = data
|
||||||
url: "https://ai.ysaix.com:7865/chat",
|
await editTempResult(tempData.value)
|
||||||
method: "post",
|
}
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
Accept: "*/*",
|
|
||||||
},
|
|
||||||
data:data
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 查询prompt 替换
|
const getTempData = async () => {
|
||||||
const prompt = ref('')
|
const { rows } = await tempResult({
|
||||||
const getPrompt = async () => {
|
mainModelId: 5,
|
||||||
const { rows } = await modelList({ model: 5 })
|
modelId: curModel.value.id,
|
||||||
let str = rows.find((item) => item.name.indexOf('思维导图') != -1).prompt
|
ex1: curNode.id,
|
||||||
|
createUser: user.userId
|
||||||
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)
|
|
||||||
})
|
})
|
||||||
|
tempData.value = rows?rows[0]:null
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
const outputImg = () => {
|
const reloadData = ref('')
|
||||||
let svg = window.document.getElementById('Mindmap_svg-wrapper_fgvb6')
|
const tempData = ref(null)
|
||||||
// let das = svg.querySelectorAll('.Mindmap_root_fgvb6')[0]
|
const mindMapRef = ref(null)
|
||||||
html2canvas(svg,{
|
onMounted(async () => {
|
||||||
scale: scale.value
|
const { rows } = await modelList({ model: 5 })
|
||||||
}).then((canvas) => {
|
curModel.value = rows.find((item) => item.name.indexOf('思维导图') != -1)
|
||||||
const dataUrl = canvas.toDataURL()
|
await getTempData()
|
||||||
exportImg64File(dataUrl, `${curNode.itemtitle}思维导图`)
|
reloadData.value = tempData.value?tempData.value.content:'';
|
||||||
|
await getPrompt()
|
||||||
|
mindMapRef.value.initData({
|
||||||
|
reloadData: reloadData.value,
|
||||||
|
title: title.value,
|
||||||
|
prompt: prompt.value,
|
||||||
|
url: url.value
|
||||||
|
})
|
||||||
|
// showMap.value = true
|
||||||
})
|
})
|
||||||
// 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>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<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>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -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>
|
||||||
|
|
@ -0,0 +1,246 @@
|
||||||
|
<!--
|
||||||
|
initData参数：
|
||||||
|
{
|
||||||
|
prompt: 思维导图prompt数据,
|
||||||
|
title: 标题
|
||||||
|
url: 请求地址
|
||||||
|
reloadData: 初始化数据，如果为空则默认去获取
|
||||||
|
}
|
||||||
|
|
||||||
|
回调函数
|
||||||
|
emits: {
|
||||||
|
exportImg: 导出图片按钮回调
|
||||||
|
createMindMap: 创建思维导图回调,初始化生成
|
||||||
|
reloadMindMap: 重新加载思维导图回调，对话重新生成
|
||||||
|
}
|
||||||
|
-->
|
||||||
|
<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">《{{ props.title }}》</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>-->
|
||||||
|
</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="reConversation"><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>
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'aiMindMap'
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<script setup>
|
||||||
|
import { ref, reactive, onMounted, watch, defineExpose } from 'vue'
|
||||||
|
import { Position } from "@element-plus/icons-vue"
|
||||||
|
import { Transformer } from 'markmap-lib'
|
||||||
|
import mindmap from 'vue3-mindmap'
|
||||||
|
import html2canvas from 'html2canvas'
|
||||||
|
import 'vue3-mindmap/dist/style.css'
|
||||||
|
import axios from 'axios'
|
||||||
|
|
||||||
|
const transformer = new Transformer()
|
||||||
|
const emits = defineEmits(['exportImg', 'createMindMap', 'reloadMindMap'])
|
||||||
|
const props = reactive({
|
||||||
|
prompt: '',
|
||||||
|
url: '',
|
||||||
|
title: '',
|
||||||
|
reloadData: ''
|
||||||
|
})
|
||||||
|
|
||||||
|
const textVal = ref(``)
|
||||||
|
|
||||||
|
const loadingAnswer = ref(false)
|
||||||
|
|
||||||
|
const scale = ref(5)
|
||||||
|
|
||||||
|
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 () => {
|
||||||
|
params.prompt = props.prompt
|
||||||
|
loadingAnswer.value = true
|
||||||
|
let data = {
|
||||||
|
"messages": [
|
||||||
|
{
|
||||||
|
"role": "user",
|
||||||
|
"content": params.prompt
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
const res = await text2mindmap(data).finally(() => {
|
||||||
|
loadingAnswer.value = false
|
||||||
|
})
|
||||||
|
resMarkdown.value = res.data.answer.content.replaceAll('```markdown','').replaceAll('```', '')
|
||||||
|
emits('createMindMap', resMarkdown.value, res)
|
||||||
|
}
|
||||||
|
|
||||||
|
const reConversation = async () => {
|
||||||
|
loadingAnswer.value = true
|
||||||
|
rootData.value = null
|
||||||
|
let data = {
|
||||||
|
"messages": [
|
||||||
|
{
|
||||||
|
"role":"assiatant",
|
||||||
|
"content": resMarkdown.value
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"role": "user",
|
||||||
|
"content": `${textVal.value}，${props.prompt}`
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
let res = await text2mindmap(data).finally(() => {
|
||||||
|
loadingAnswer.value = false
|
||||||
|
})
|
||||||
|
resMarkdown.value = res.data.answer.content.replaceAll('```markdown','').replaceAll('```', '')
|
||||||
|
emits('reloadMindMap', resMarkdown.value, res)
|
||||||
|
}
|
||||||
|
|
||||||
|
const text2mindmap =(data)=> {
|
||||||
|
return axios({
|
||||||
|
url: props.url,
|
||||||
|
method: "post",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
Accept: "*/*",
|
||||||
|
},
|
||||||
|
data:data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
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')
|
||||||
|
html2canvas(svg,{
|
||||||
|
scale: scale.value
|
||||||
|
}).then((canvas) => {
|
||||||
|
const dataUrl = canvas.toDataURL()
|
||||||
|
emits('exportImg', dataUrl)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const initData = (datas) => {
|
||||||
|
Object.assign(props, datas)
|
||||||
|
// 获取提示词
|
||||||
|
if (props.reloadData) {
|
||||||
|
resMarkdown.value = props.reloadData
|
||||||
|
}else {
|
||||||
|
aiConversation()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
initData,
|
||||||
|
outputImg,
|
||||||
|
aiConversation,
|
||||||
|
reConversation
|
||||||
|
})
|
||||||
|
|
||||||
|
// 初始化
|
||||||
|
onMounted(() => {
|
||||||
|
// initData()
|
||||||
|
})
|
||||||
|
|
||||||
|
// 监听 initValue 的变化
|
||||||
|
watch(() => resMarkdown.value, () => {
|
||||||
|
const { root } = transformer.transform(resMarkdown.value)
|
||||||
|
degure(root)
|
||||||
|
rootData.value = [root]
|
||||||
|
})
|
||||||
|
</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>
|
||||||
Loading…
Reference in New Issue