模板更多按钮

src/renderer/src/components/template-study/container/result.vue

@@ -3,10 +3,24 @@
 
     <el-scrollbar height="100%">
       <div class="template-list">
-        <el-row v-for="(item,index) in childTempList">
+        <el-row v-for="(item, index) in childTempList">
           <el-col :span="24">
             <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>编辑</el-button>
+                    <el-button type="primary" link>移除</el-button>
+                  </template>
+                </el-popover>
+              </div>
               <div class="item-text">
                 {{ item.prompt }}
               </div>
@@ -37,9 +51,9 @@
       </div>
     </el-scrollbar>
     <!--编辑结果-->
-    <EditDialog v-model="isEdit" :item="editItem" @saveEdit="saveEdit"/>
+    <EditDialog v-model="isEdit" :item="editItem" @saveEdit="saveEdit" />
     <!--AI 对话调整-->
-    <AdjustDialog v-model="isAdjust" :item="editItem" @saveAdjust="saveAdjust"/>
+    <AdjustDialog v-model="isAdjust" :item="editItem" @saveAdjust="saveAdjust" />
   </div>
 </template>
 
@@ -105,7 +119,7 @@ const getConversation = async () => {
 
   const { user: { userId } } = userStore
   const result = await conversation({ user_id: String(userId) })
-  console.log('result',result)
+  console.log('result', result)
   params.conversation_id = result.data.data.id
   getCompletion()
 }
@@ -129,15 +143,15 @@ const getCompletion = async () => {
 
 
 // 重新研读
-const againResult = async (index,item) =>{
-  try{
+const againResult = async (index, item) => {
+  try {
     childTempList.value[index].loading = true
     params.messages[0].content = `根据${curNode.edustage}语文课标，提炼出${item.name}`
     const res = await completion(params)
     let answer = res.data.data.answer
     item.oldAnswer = answer
     item.answer = getResult(answer);
-  }finally {
+  } finally {
     childTempList.value[index].loading = false
   }
 }
@@ -155,26 +169,26 @@ let getResult = (text) => {
 // 编辑
 const curIndex = ref(-1)
 const editItem = reactive({})
-const onEdit = (index,item) =>{
+const onEdit = (index, item) => {
   curIndex.value = index
   Object.assign(editItem, item)
   isEdit.value = true
 }
 
 // 保存编辑
-const saveEdit = (data) =>{
+const saveEdit = (data) => {
   childTempList.value[curIndex.value].oldAnswer = data
   let answer = getResult(data);
   childTempList.value[curIndex.value].answer = answer
 }
 
 const isAdjust = ref(false)
-const onAdjust = (index, item) =>{
+const onAdjust = (index, item) => {
   curIndex.value = index
   Object.assign(editItem, item)
   isAdjust.value = true
 }
-const saveAdjust = (item) =>{
+const saveAdjust = (item) => {
   childTempList.value[curIndex.value].oldAnswer = item
   let answer = getResult(item);
   childTempList.value[curIndex.value].answer = answer
@@ -249,6 +263,7 @@ defineExpose({
         font-size: 16px;
         font-weight: bold;
         color: #000;
+        justify-content: space-between;
 
         .blue {
           font-size: 22px;
@@ -290,20 +305,25 @@ defineExpose({
         }
 
       }
-      .text-answer{
+
+      .text-answer {
         color: #409eff;
       }
-      .ai-btn{
+
+      .ai-btn {
         margin-top: 10px;
         display: flex;
         justify-content: flex-end;
-        .iconfont{
+
+        .iconfont {
           margin-right: 3px;
         }
-        :deep(.el-button){
+
+        :deep(.el-button) {
           font-size: 13px;
         }
-        .icon-ai1{
+
+        .icon-ai1 {
           font-size: 18px;
         }
       }
@@ -382,8 +402,23 @@ defineExpose({
 
   }
 }
-
+.icon-shenglvehao{
+  font-weight: bold;
+  font-size: 22px;
+}
+:deep(.el-popover) {
+  min-width: 50px;
+  width: 50px !important;
+}
 .pl-25 {
   padding-left: 25px;
 }
+
+
+</style>
+<style>
+.template-custom-popover {
+  width: 110px !important;
+  min-width: 110px !important;
+}
 </style>