lyc-dev #39

Merged
lyc merged 2 commits from lyc-dev into main 2024-11-14 11:20:43 +08:00
3 changed files with 144 additions and 71 deletions

View File

@ -20,7 +20,7 @@
</template> </template>
</el-dropdown> </el-dropdown>
<div> <div>
<el-button type="primary" link @click="keywordDialog = true"> <el-button type="primary" link @click="wordDialog = true">
<el-icon> <el-icon>
<Plus /> <Plus />
</el-icon> </el-icon>
@ -31,35 +31,7 @@
</div> </div>
</div> </div>
</div> </div>
<el-dialog v-model="keywordDialog" :show-close="false" width="600"> <keywordDialog v-model="wordDialog"/>
<template #header>
<div class="custom-header flex">
<span>添加提示词</span>
<i class="iconfont icon-guanbi" @click="isDialog = false"></i>
</div>
</template>
<div class="dialog-content">
<el-form :model="form" label-width="auto">
<el-form-item label="名称">
<el-input v-model="form.name" />
</el-form-item>
<el-form-item label="提示词">
<el-input v-model="form.desc" type="textarea" />
</el-form-item>
</el-form>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="keywordDialog = false">取消</el-button>
<el-button type="primary" @click="keywordDialog = false">
确定
</el-button>
</div>
</template>
</el-dialog>
<Dialog v-model="showDialog" :modeType="type" /> <Dialog v-model="showDialog" :modeType="type" />
</template> </template>
@ -69,8 +41,9 @@ import { Plus } from '@element-plus/icons-vue'
import { ElMessageBox } from 'element-plus' import { ElMessageBox } from 'element-plus'
import { modelList } from '@/api/mode/index' import { modelList } from '@/api/mode/index'
import Dialog from './dialog.vue' import Dialog from './dialog.vue'
import keywordDialog from './keyword-dialog.vue'
const keywordDialog = ref(false) const wordDialog = ref(false)
const props = defineProps({ const props = defineProps({
type: { type: {
type: Number, type: Number,
@ -120,13 +93,6 @@ const changeTemplate = (val) => {
}) })
} }
const form = reactive({
name: '',
desc: '',
})
onMounted(() => { onMounted(() => {
getTemplateList() getTemplateList()
}) })
@ -143,8 +109,6 @@ onMounted(() => {
width: 50%; width: 50%;
align-items: center; align-items: center;
padding-left: 20px; padding-left: 20px;
} }
.header-right { .header-right {
@ -160,13 +124,4 @@ onMounted(() => {
} }
} }
.custom-header {
justify-content: space-between;
align-items: center;
.icon-guanbi {
cursor: pointer;
font-weight: bold;
}
}
</style> </style>

View File

@ -0,0 +1,72 @@
<template>
<el-dialog v-model="mode" :show-close="false" width="600">
<template #header>
<div class="custom-header flex">
<span>{{ isAdd ? '添加' : '编辑' }}提示词</span>
<i class="iconfont icon-guanbi" @click="mode = false"></i>
</div>
</template>
<div class="dialog-content">
<el-form :model="form" label-width="auto">
<el-form-item label="名称">
<el-input v-model="form.name" />
</el-form-item>
<el-form-item label="提示词">
<el-input v-model="form.prompt" type="textarea" />
</el-form-item>
</el-form>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="mode = false">取消</el-button>
<el-button type="primary" @click="mode = false">
确定
</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { reactive, watch } from 'vue'
const mode = defineModel()
const props = defineProps({
isAdd: {
type: Boolean,
default: true
},
item: {
type: Object
}
})
const form = reactive({
name: '',
prompt: '',
})
watch(() => props.isAdd, (newVal) => {
if (!newVal) {
console.log(props.item)
form.name = props.item.name
form.prompt = props.item.prompt
}
}, { immediate: true })
</script>
<style lang="scss" scoped>
.custom-header {
justify-content: space-between;
align-items: center;
.icon-guanbi {
cursor: pointer;
font-weight: bold;
}
}
</style>

View File

@ -3,10 +3,24 @@
<el-scrollbar height="100%"> <el-scrollbar height="100%">
<div class="template-list"> <div class="template-list">
<el-row v-for="(item,index) in childTempList"> <el-row v-for="(item, index) in childTempList">
<el-col :span="24"> <el-col :span="24">
<div class="template-item" v-loading="item.loading"> <div class="template-item" v-loading="item.loading">
<div class="item-header"><span class="blue">#</span>{{ item.name }}</div> <div class="item-header">
<div>
<span class="blue">#</span>{{ item.name }}
</div>
<el-popover placement="bottom-end" trigger="hover" popper-class="template-custom-popover" >
<template #reference>
<el-button link type="primary">
<i class="iconfont icon-shenglvehao"></i></el-button>
</template>
<template #default>
<el-button type="primary" link @click="editKeyWord(item)">编辑</el-button>
<el-button type="primary" link>移除</el-button>
</template>
</el-popover>
</div>
<div class="item-text"> <div class="item-text">
{{ item.prompt }} {{ item.prompt }}
</div> </div>
@ -37,9 +51,11 @@
</div> </div>
</el-scrollbar> </el-scrollbar>
<!--编辑结果--> <!--编辑结果-->
<EditDialog v-model="isEdit" :item="editItem" @saveEdit="saveEdit"/> <EditDialog v-model="isEdit" :item="editItem" @saveEdit="saveEdit" />
<!--AI 对话调整--> <!--AI 对话调整-->
<AdjustDialog v-model="isAdjust" :item="editItem" @saveAdjust="saveAdjust"/> <AdjustDialog v-model="isAdjust" :item="editItem" @saveAdjust="saveAdjust" />
<!--编辑提示词-->
<keywordDialog v-model="isEditKeyWord" :isAdd="false" :item="keywordItem"/>
</div> </div>
</template> </template>
@ -47,6 +63,7 @@
import { ref, reactive, onMounted, watch } from 'vue'; import { ref, reactive, onMounted, watch } from 'vue';
import EditDialog from './edit-dialog.vue' import EditDialog from './edit-dialog.vue'
import AdjustDialog from './adjust-dialog.vue' import AdjustDialog from './adjust-dialog.vue'
import keywordDialog from './keyword-dialog.vue';
import { sessionStore } from '@/utils/store' import { sessionStore } from '@/utils/store'
import useUserStore from '@/store/modules/user' import useUserStore from '@/store/modules/user'
import { conversation, completion, modelList } from '@/api/mode/index' import { conversation, completion, modelList } from '@/api/mode/index'
@ -102,10 +119,10 @@ const params = reactive(
) )
const curNode = reactive({}) const curNode = reactive({})
const getConversation = async () => { const getConversation = async () => {
const { user: { userId } } = userStore const { user: { userId } } = userStore
const result = await conversation({ user_id: String(userId) }) const result = await conversation({ user_id: String(userId) })
console.log('result',result) console.log('result', result)
params.conversation_id = result.data.data.id params.conversation_id = result.data.data.id
getCompletion() getCompletion()
} }
@ -120,7 +137,7 @@ const getCompletion = async () => {
let answer = res.data.data.answer let answer = res.data.data.answer
item.oldAnswer = answer item.oldAnswer = answer
item.answer = getResult(answer); item.answer = getResult(answer);
} finally { } finally {
item.loading = false item.loading = false
} }
@ -129,15 +146,15 @@ const getCompletion = async () => {
// //
const againResult = async (index,item) =>{ const againResult = async (index, item) => {
try{ try {
childTempList.value[index].loading = true childTempList.value[index].loading = true
params.messages[0].content = `根据${curNode.edustage}语文课标,提炼出${item.name}` params.messages[0].content = `根据${curNode.edustage}语文课标,提炼出${item.name}`
const res = await completion(params) const res = await completion(params)
let answer = res.data.data.answer let answer = res.data.data.answer
item.oldAnswer = answer item.oldAnswer = answer
item.answer = getResult(answer); item.answer = getResult(answer);
}finally { } finally {
childTempList.value[index].loading = false childTempList.value[index].loading = false
} }
} }
@ -155,35 +172,44 @@ let getResult = (text) => {
// //
const curIndex = ref(-1) const curIndex = ref(-1)
const editItem = reactive({}) const editItem = reactive({})
const onEdit = (index,item) =>{ const onEdit = (index, item) => {
curIndex.value = index curIndex.value = index
Object.assign(editItem, item) Object.assign(editItem, item)
isEdit.value = true isEdit.value = true
} }
// //
const saveEdit = (data) =>{ const saveEdit = (data) => {
childTempList.value[curIndex.value].oldAnswer = data childTempList.value[curIndex.value].oldAnswer = data
let answer = getResult(data); let answer = getResult(data);
childTempList.value[curIndex.value].answer = answer childTempList.value[curIndex.value].answer = answer
} }
const isAdjust = ref(false) const isAdjust = ref(false)
const onAdjust = (index, item) =>{ const onAdjust = (index, item) => {
curIndex.value = index curIndex.value = index
Object.assign(editItem, item) Object.assign(editItem, item)
isAdjust.value = true isAdjust.value = true
} }
const saveAdjust = (item) =>{ const saveAdjust = (item) => {
childTempList.value[curIndex.value].oldAnswer = item childTempList.value[curIndex.value].oldAnswer = item
let answer = getResult(item); let answer = getResult(item);
childTempList.value[curIndex.value].answer = answer childTempList.value[curIndex.value].answer = answer
} }
//
const keywordItem = reactive({})
const isEditKeyWord = ref(false)
const editKeyWord = (item) =>{
isEditKeyWord.value = true
Object.assign(keywordItem, item)
}
onMounted(() => { onMounted(() => {
let data = sessionStore.get('subject.curNode') let data = sessionStore.get('subject.curNode')
Object.assign(curNode, data); Object.assign(curNode, data);
}) })
defineExpose({ defineExpose({
@ -249,6 +275,7 @@ defineExpose({
font-size: 16px; font-size: 16px;
font-weight: bold; font-weight: bold;
color: #000; color: #000;
justify-content: space-between;
.blue { .blue {
font-size: 22px; font-size: 22px;
@ -290,20 +317,25 @@ defineExpose({
} }
} }
.text-answer{
.text-answer {
color: #409eff; color: #409eff;
} }
.ai-btn{
.ai-btn {
margin-top: 10px; margin-top: 10px;
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
.iconfont{
.iconfont {
margin-right: 3px; margin-right: 3px;
} }
:deep(.el-button){
:deep(.el-button) {
font-size: 13px; font-size: 13px;
} }
.icon-ai1{
.icon-ai1 {
font-size: 18px; font-size: 18px;
} }
} }
@ -382,8 +414,22 @@ defineExpose({
} }
} }
.icon-shenglvehao{
font-weight: bold;
font-size: 22px;
}
:deep(.el-popover) {
min-width: 50px;
width: 50px !important;
}
.pl-25 { .pl-25 {
padding-left: 25px; padding-left: 25px;
} }
</style>
</style>
<style>
.template-custom-popover {
width: 110px !important;
min-width: 110px !important;
}
</style>