fix:chat对话更新

This commit is contained in:
shijing 2025-05-06 14:02:34 +08:00
parent 39b88135a1
commit cbbf1ee84f
1 changed files with 38 additions and 7 deletions

View File

@ -5,10 +5,16 @@
<div class="sideContent"> <div class="sideContent">
<div plain="true" class="addBtn" @click="createNewChat">新建聊天</div> <div plain="true" class="addBtn" @click="createNewChat">新建聊天</div>
<div class="chatList"> <div class="chatList">
<div class="listItem" v-for="item in listData" :key="item.id" @click="listItemClick(item.id)"> <div class="listItem" v-for="(item,$index) in listData" :key="item.id" @click="listItemClick(item.id)">
<div class="listItemTitle">{{ item.title }}</div> <el-input v-if="item.isEdit" v-model="item.title" style="width: 160px;"></el-input>
<el-icon :size="20"><el-icon-edit/><Edit/></el-icon> <div class="listItemTitle" v-else>{{ item.title }}</div>
<el-icon :size="20"><el-icon-delete/></el-icon> <el-icon v-if="item.isEdit" class="listItemIcons" :size="15" @click="saveListItem(item.id,$index)"><el-icon-finished/></el-icon>
<el-icon v-else class="listItemIcons" :size="15" @click="editListItem(item.id,$index)"><el-icon-edit/></el-icon>
<el-popconfirm title="确定删除吗?" @confirm="deleteListItem(item.id,$index)">
<template #reference>
<el-icon v-if="!item.isEdit" :size="15" class="listItemIcons"><el-icon-delete/></el-icon>
</template>
</el-popconfirm>
</div> </div>
</div> </div>
</div> </div>
@ -29,9 +35,9 @@
<el-footer class="footerWrap"> <el-footer class="footerWrap">
<div class="footerContent"> <div class="footerContent">
<div class="footerInput"> <div class="footerInput">
<el-input class="search_input" placeholder="来说点什么吧..."></el-input> <el-input v-model="newQuestion" class="search_input" placeholder="来说点什么吧..."></el-input>
</div> </div>
<el-button icon="el-icon-promotion" size="success"></el-button> <el-button @click="sendQuestion" icon="el-icon-promotion" size="success"></el-button>
</div> </div>
</el-footer> </el-footer>
</el-container> </el-container>
@ -46,7 +52,7 @@ export default {
data() { data() {
return { return {
userName: "", userName: "",
listData:[{id:1,title:'前端有哪些性能优化?',}], listData:[{id:1,title:'前端有哪些性能优化?',isEdit:false}],
originData:[ originData:[
{id:1,data:[ {id:1,data:[
{chat_text:'前端有哪些性能优化?',chat_time:'2022-08-18 10:00:00',chat_type:'myself'}, {chat_text:'前端有哪些性能优化?',chat_time:'2022-08-18 10:00:00',chat_type:'myself'},
@ -121,6 +127,25 @@ export default {
} }
}) })
}, },
deleteListItem(id,index){
},
editListItem(id,index){
this.listData[index].isEdit = true;
},
saveListItem(id,index){
// this.$API
this.listData[index].isEdit = false;
},
sendQuestion(){
let date = new Date();
let id = date.getTime();
this.chatData.push({chat_text:this.newQuestion,chat_time:date,chat_type:'myself'});
this.newQuestion = '';
this.$nextTick(()=>{
//
})
},
}, },
}; };
</script> </script>
@ -200,6 +225,12 @@ export default {
border-color: rgb(75, 158, 95); border-color: rgb(75, 158, 95);
background-color :rgb(245, 245, 245) background-color :rgb(245, 245, 245)
} }
.listItem>.listItemIcons{
display: none;
}
.listItem.active>.listItemIcons{
display: block;
}
.listItemTitle{ .listItemTitle{
width: 160px; width: 160px;
overflow: hidden; overflow: hidden;