feat: 历史记录增加删除功能优化

1Panel-dev · Jun 13, 2024 · 6c950e1 · 6c950e1
2 parents b90672f + 4a1a9c7
commit 6c950e1
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 19 deletions.
diff --git a/ui/src/components/ai-chat/index.vue b/ui/src/components/ai-chat/index.vue
@@ -146,7 +146,7 @@
  ref="quickInputRef"
  v-model="inputValue"
  placeholder="请输入"
- :autosize="{ minRows: 1, maxRows: 4 }"
+ :autosize="{ minRows: 1, maxRows: common.isMobile() ? 4 : 10 }"
  type="textarea"
  :maxlength="100000"
  @keydown.enter="sendChatHandle($event)"
@@ -173,7 +173,7 @@
  </div>
 </template>
 <script setup lang="ts">
-import { ref, nextTick, computed, watch, reactive } from 'vue'
+import { ref, nextTick, computed, watch, reactive, onMounted } from 'vue'
 import { useRoute } from 'vue-router'
 import LogOperationButton from './LogOperationButton.vue'
 import OperationButton from './OperationButton.vue'
@@ -215,7 +215,7 @@ const props = defineProps({
 
 const emit = defineEmits(['refresh', 'scroll'])
 
-const { application } = useStore()
+const { application, common } = useStore()
 
 const ParagraphSourceDialogRef = ref()
 const aiChatRef = ref()
@@ -622,11 +622,7 @@ defineExpose({
  position: relative;
  color: var(--app-text-color);
  box-sizing: border-box;
- &.chart-log {
- .ai-chat__content {
- padding-bottom: 0;
- }
- }
+
  &__content {
  padding-top: 0;
  box-sizing: border-box;

diff --git a/ui/src/components/common-list/index.vue b/ui/src/components/common-list/index.vue
@@ -6,6 +6,8 @@
  @click.prevent="clickHandle(item, index)"
  :class="current === item[props.valueKey] ? 'active' : ''"
  class="cursor"
+ @mouseenter="mouseenter(item)"
+ @mouseleave="mouseleave()"
  >
  <slot :row="item" :index="index"> </slot>
  </li>
@@ -44,7 +46,14 @@ watch(
  { immediate: true }
 )
 
-const emit = defineEmits(['click'])
+const emit = defineEmits(['click', 'mouseenter', 'mouseleave'])
+
+function mouseenter(row: any) {
+ emit('mouseenter', row)
+}
+function mouseleave() {
+ emit('mouseleave')
+}
 
 function clickHandle(row: any, index: number) {
  current.value = row[props.valueKey]

diff --git a/ui/src/views/chat/embed/index.vue b/ui/src/views/chat/embed/index.vue
@@ -43,14 +43,16 @@
  v-loading="left_loading"
  :defaultActive="currentChatId"
  @click="clickListHandle"
+ @mouseenter="mouseenter"
+ @mouseleave="mouseId = ''"
  >
  <template #default="{ row }">
  <div class="flex-between">
  <auto-tooltip :content="row.abstract">
  {{ row.abstract }}
  </auto-tooltip>
- <div @click.stop>
- <el-button text @click.stop="deleteLog(row)">
+ <div @click.stop v-if="mouseId === row.id">
+ <el-button style="padding: 0" link @click.stop="deleteLog(row)">
  <el-icon><Delete /></el-icon>
  </el-button>
  </div>
@@ -101,6 +103,11 @@ const paginationConfig = reactive({
 const currentRecordList = ref<any>([])
 const currentChatId = ref('new') // 当前历史记录Id 默认为'new'
 
+const mouseId = ref('')
+
+function mouseenter(row: any) {
+ mouseId.value = row.id
+}
 function deleteLog(row: any) {
  log.asyncDelChatClientLog(applicationDetail.value.id, row.id, left_loading).then(() => {
  if (currentChatId.value === row.id) {
@@ -247,9 +254,6 @@ onMounted(() => {
  overflow: hidden;
  }
  .new-chat-button {
- // position: absolute;
- // bottom: 80px;
- // left: 18px;
  z-index: 11;
  }
  // 历史对话弹出层
@@ -305,9 +309,6 @@ onMounted(() => {
  .ai-chat__operate {
  padding-top: 12px;
  }
- .ai-chat__content {
- padding-bottom: 104px;
- }
  }
 }
 </style>
diff --git a/ui/src/views/chat/pc/index.vue b/ui/src/views/chat/pc/index.vue
@@ -23,19 +23,22 @@
  v-loading="left_loading"
  :defaultActive="currentChatId"
  @click="clickListHandle"
+ @mouseenter="mouseenter"
+ @mouseleave="mouseId = ''"
  >
  <template #default="{ row }">
  <div class="flex-between">
  <auto-tooltip :content="row.abstract">
  {{ row.abstract }}
  </auto-tooltip>
- <div @click.stop>
- <el-button text @click.stop="deleteLog(row)">
+ <div @click.stop v-if="mouseId === row.id">
+ <el-button style="padding: 0" link @click.stop="deleteLog(row)">
  <el-icon><Delete /></el-icon>
  </el-button>
  </div>
  </div>
  </template>
+
  <template #empty>
  <div class="text-center">
  <el-text type="info">暂无历史记录</el-text>
@@ -150,7 +153,11 @@ const paginationConfig = ref({
 const currentRecordList = ref<any>([])
 const currentChatId = ref('new') // 当前历史记录Id 默认为'new'
 const currentChatName = ref('新建对话')
+const mouseId = ref('')
 
+function mouseenter(row: any) {
+ mouseId.value = row.id
+}
 function deleteLog(row: any) {
  log.asyncDelChatClientLog(applicationDetail.value.id, row.id, left_loading).then(() => {
  if (currentChatId.value === row.id) {