vue2-client 1.8.48 → 1.8.49

package/src/pages/DynamicStatistics/DynamicTable.vue

@@ -1,76 +1,76 @@
-<template>
-  <div class="table-main">
-    <a-table
-      :scroll="{ x: scrollXWidth, y: scrollYHeight }"
-      size="middle"
-      :columns="tableColumns"
-      :dataSource="tableData"
-      :rowKey="record => record.id">
-    </a-table>
-  </div>
-</template>
-
-<script>
-
-export default {
-  name: 'DynamicTable',
-  data () {
-    return {
-      tableColumns: [],
-      // x滚动条宽度
-      scrollXWidth: 1600,
-      scrollYHeight: 400
-    }
-  },
-  mounted () {
-    this.initData()
-  },
-  props: {
-    tableData: {
-      type: Array,
-      required: true
-    }
-  },
-  watch: {
-    tableData: {
-      deep: true,
-      handler (newVal) {
-        this.initData()
-      }
-    }
-  },
-  methods: {
-    async initData () {
-      try {
-        // 从数据第一项推断列信息
-        const sample = this.tableData[0]
-        this.tableColumns = Object.keys(sample).map(key => ({
-          title: key, // 使用键名作为列标题
-          dataIndex: key, // 数据索引与键名相同
-          key: key,
-          ellipsis: true,
-        }))
-        let totalWidth = 0
-        // 设置表格宽度
-        for (let i = 0; i < this.tableColumns.length; i++) {
-          totalWidth = totalWidth + 180
-        }
-        // 设置表格高度为固定值
-        this.scrollYHeight = 'calc(100vh - 40rem)'
-        // 横向滚动长度大于所有宽度，才能实现固定表头
-        this.scrollXWidth = totalWidth
-      } catch (error) {
-        console.error('Fetching data failed:', error)
-      }
-    },
-  }
-}
-</script>
-<style lang="less" scoped>
-.table-main {
-  margin-top: 8px;
-  :deep(.ant-table) {
-    background-color: #fff;
-  }
-}
-</style>
+<template>
+  <div class="table-main">
+    <a-table
+      :scroll="{ x: scrollXWidth, y: scrollYHeight }"
+      size="middle"
+      :columns="tableColumns"
+      :dataSource="tableData"
+      :rowKey="record => record.id">
+    </a-table>
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: 'DynamicTable',
+  data () {
+    return {
+      tableColumns: [],
+      // x滚动条宽度
+      scrollXWidth: 1600,
+      scrollYHeight: 400
+    }
+  },
+  mounted () {
+    this.initData()
+  },
+  props: {
+    tableData: {
+      type: Array,
+      required: true
+    }
+  },
+  watch: {
+    tableData: {
+      deep: true,
+      handler (newVal) {
+        this.initData()
+      }
+    }
+  },
+  methods: {
+    async initData () {
+      try {
+        // 从数据第一项推断列信息
+        const sample = this.tableData[0]
+        this.tableColumns = Object.keys(sample).map(key => ({
+          title: key, // 使用键名作为列标题
+          dataIndex: key, // 数据索引与键名相同
+          key: key,
+          ellipsis: true,
+        }))
+        let totalWidth = 0
+        // 设置表格宽度
+        for (let i = 0; i < this.tableColumns.length; i++) {
+          totalWidth = totalWidth + 180
+        }
+        // 设置表格高度为固定值
+        this.scrollYHeight = 'calc(100vh - 40rem)'
+        // 横向滚动长度大于所有宽度，才能实现固定表头
+        this.scrollXWidth = totalWidth
+      } catch (error) {
+        console.error('Fetching data failed:', error)
+      }
+    },
+  }
+}
+</script>
+<style lang="less" scoped>
+.table-main {
+  margin-top: 8px;
+  :deep(.ant-table) {
+    background-color: #fff;
+  }
+}
+</style>

package/src/pages/DynamicStatistics/EvaluationArea.vue

@@ -1,54 +1,56 @@
-<template>
-  <div class="evaluation-card">
-    <div v-if="!action">
-      <p>您对这次搜索结果满意吗？</p>
-      <a-button-group>
-        <a-button type="primary" @click="submitEvaluation(true)">满意</a-button>
-        <a-button type="danger" @click="submitEvaluation(false)">不满意</a-button>
-      </a-button-group>
-    </div>
-  </div>
-</template>
-
-<script>
-import { post } from '@vue2-client/services/api'
-import { indexedDB } from '@vue2-client/utils/indexedDB'
-
-export default {
-  data () {
-    return {
-      action: false
-    }
-  },
-  props: {
-    uuid: {
-      type: String,
-      required: true
-    }
-  },
-  methods: {
-    submitEvaluation (result) {
-      const key = 'question-' + this.uuid
-      indexedDB.get(key, (item) => {
-        const content = Object.assign(item, {
-          evaluation: result
-        })
-        post('/api/af-system/logic/openapi/addCommonData', {
-          type: 'ai-evaluation',
-          content: content
-        }).then(res => {
-          this.action = true
-          this.$message.success('评论成功')
-        })
-      })
-    }
-  }
-}
-</script>
-<style lang="less" scoped>
-.evaluation-card {
-  width: 50%;
-  text-align: center;
-  margin: 20px auto 0 auto;
-}
-</style>
+<template>
+  <div class="evaluation-card">
+    <div v-if="!action">
+      <p>您对这次搜索结果满意吗？</p>
+      <a-button-group>
+        <a-space>
+          <a-button type="primary" icon="like" @click="submitEvaluation(true)">满意</a-button>
+          <a-button type="danger" icon="dislike" @click="submitEvaluation(false)">不满意</a-button>
+        </a-space>
+      </a-button-group>
+    </div>
+  </div>
+</template>
+
+<script>
+import { post } from '@vue2-client/services/api'
+import { indexedDB } from '@vue2-client/utils/indexedDB'
+
+export default {
+  data () {
+    return {
+      action: false
+    }
+  },
+  props: {
+    uuid: {
+      type: String,
+      required: true
+    }
+  },
+  methods: {
+    submitEvaluation (result) {
+      const key = 'question-' + this.uuid
+      indexedDB.get(key, (item) => {
+        const content = Object.assign(item, {
+          evaluation: result
+        })
+        post('/api/af-system/logic/openapi/addCommonData', {
+          type: 'ai-evaluation',
+          content: content
+        }).then(res => {
+          this.action = true
+          this.$message.success('评论成功')
+        })
+      })
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+.evaluation-card {
+  width: 50%;
+  text-align: center;
+  margin: 20px auto 0 auto;
+}
+</style>

package/src/pages/DynamicStatistics/FavoriteList.vue

@@ -1,51 +1,51 @@
-<template>
-  <div>
-    <a-list v-show="!loading" size="small" :data-source="data">
-      <a-list-item slot="renderItem" slot-scope="item">
-        <div>
-          <p><a @click="$emit('openFavorites', item.uuid)">{{ item.question }} </a></p>
-          <p>{{ item.date }}</p>
-        </div>
-        <a class="delete_item">
-          <a-icon type="close" @click="$emit('saveToFavorites', item.uuid)"/>
-        </a>
-      </a-list-item>
-    </a-list>
-  </div>
-</template>
-
-<script>
-import { indexedDB } from '@vue2-client/utils/indexedDB'
-
-export default {
-  name: 'FavoriteList',
-  data () {
-    return {
-      data: [],
-      loading: false
-    }
-  },
-  mounted () {
-    this.loadData()
-  },
-  methods: {
-    loadData () {
-      console.warn(123)
-      indexedDB.getAll((data) => {
-        const realData = data.filter(item => item.data && item.data.uuid)
-          .map(item => item.data)
-        this.data = realData
-      })
-    }
-  }
-}
-</script>
-<style lang="less" scoped>
-.delete_item {
-  margin-left: 8px;
-  color: #333;
-}
-p {
-  margin: 0
-}
-</style>
+<template>
+  <div>
+    <a-list v-show="!loading" size="small" :data-source="data">
+      <a-list-item slot="renderItem" slot-scope="item">
+        <div>
+          <p><a @click="$emit('openFavorites', item.uuid)">{{ item.question }} </a></p>
+          <p>{{ item.date }}</p>
+        </div>
+        <a class="delete_item">
+          <a-icon type="close" @click="$emit('saveToFavorites', item.uuid)"/>
+        </a>
+      </a-list-item>
+    </a-list>
+  </div>
+</template>
+
+<script>
+import { indexedDB } from '@vue2-client/utils/indexedDB'
+
+export default {
+  name: 'FavoriteList',
+  data () {
+    return {
+      data: [],
+      loading: false
+    }
+  },
+  mounted () {
+    this.loadData()
+  },
+  methods: {
+    loadData () {
+      console.warn(123)
+      indexedDB.getAll((data) => {
+        const realData = data.filter(item => item.data && item.data.uuid)
+          .map(item => item.data)
+        this.data = realData
+      })
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+.delete_item {
+  margin-left: 8px;
+  color: #333;
+}
+p {
+  margin: 0
+}
+</style>

package/src/pages/DynamicStatistics/QuestionHistoryAndFavorites.vue

@@ -0,0 +1,279 @@
+<template>
+  <a-card class="question-history" id="question-history" size="small">
+    <a-tabs v-model="activeKey">
+      <a-tab-pane key="1" tab="对话历史">
+        <a-list item-layout="horizontal" :data-source="questions">
+          <a-list-item
+            slot="renderItem"
+            :class="item.uuid === currentuuid ? 'question-history-active' : 'question-history-inactive'"
+            slot-scope="item,index"
+            @click="handleOpenFavorite(item)">
+            <a-list-item-meta
+              :title="item.question"
+              :description="item.date"
+            />
+            <a-space>
+              <a-icon
+                type="delete"
+                theme="filled"
+                class="delClass"
+                @click.stop="delQuestion(item,index)"
+              />
+              <span>&emsp;</span>
+              <a-icon
+                v-if="item.data"
+                type="star"
+                :class="item.isFavorite ? 'startActive' : 'startInactive'"
+                @click.stop="toFavorites(item,index)"
+                :theme=" item.isFavorite ? 'filled': 'twoTone'"
+                two-tone-color="#FFD700"/>
+              <a-icon
+                v-else
+                @click.stop="reTrySearch(item)"
+                type="sync"
+                class="reSearch"
+                title="重新查询"/>
+            </a-space>
+          </a-list-item>
+        </a-list>
+      </a-tab-pane>
+      <a-tab-pane key="2" tab="收藏的对话" force-render>
+        <a-list item-layout="horizontal" :data-source="favorites">
+          <a-list-item
+            slot="renderItem"
+            slot-scope="item, index"
+            :class="item.uuid === currentuuid ? 'question-history-active' : 'question-history-inactive'"
+            @click="handleOpenFavorite(item)">
+            <a-list-item-meta
+              :title="item.question"
+              :description="item.date"
+            />
+            <a-space>
+              <a-icon
+                type="star"
+                :class="item.isFavorite ? 'startActive' : 'startInactive'"
+                @click.stop="delFavorites(item,index)"
+                :theme=" item.isFavorite ? 'filled': 'twoTone'"
+                two-tone-color="#FFD700"/>
+            </a-space>
+          </a-list-item>
+        </a-list>
+      </a-tab-pane>
+    </a-tabs>
+  </a-card>
+</template>
+
+<script>
+import { indexedDB } from '@/utils/indexedDB'
+import { formatDate } from '@/utils/util'
+
+export default {
+  props: {
+    currentuuid: {
+      type: String,
+      default: ''
+    }
+  },
+  data () {
+    return {
+      activeKey: '1',
+      questions: [], // 你的问题历史
+      favorites: [] // 你的收藏问题
+    }
+  },
+  mounted () {
+    this.loadData()
+  },
+  methods: {
+    loadData () {
+      indexedDB.getAll((data) => {
+          // 遍历data，将question和favorites分别赋值给questions和favorites
+          for (const datum of data) {
+            if (datum.key.includes('question')) {
+              this.questions.push(datum.data)
+            } else if (datum.key.includes('favorites')) {
+              this.favorites.push(datum.data)
+            }
+          }
+        }
+      )
+    },
+    handleOpenFavorite (item) {
+      this.$emit('handleOpenFavorite', item)
+    },
+    reTrySearch (item) {
+      this.$emit('handleSearch', item.question, null, item.uuid)
+    },
+    add (question) {
+      // 检查 questions 数组中是否已经存在这个问题 替换掉
+      const index = this.questions.findIndex(item => item.uuid === question.uuid)
+      if (index !== -1) {
+        if (question.data) {
+          this.questions.splice(index, 1, Object.assign(question, { date: this.questions[index].date }))
+        } else {
+          this.questions.splice(index, 1, question)
+        }
+        this.updateQuestion(question)
+        return
+      }
+      this.questions.push(question)
+      indexedDB.add('question-' + question.uuid, question)
+    },
+    updateQuestion (question) {
+      const questionKey = 'question-' + question.uuid
+      indexedDB.delete(questionKey)
+      indexedDB.add(questionKey, question)
+    },
+
+    toFavorites (question, index) {
+      this.questions[index].isFavorite = !this.questions[index].isFavorite
+      if (this.questions[index].isFavorite) {
+        const key = 'favorites-' + question.uuid
+        question.date = formatDate('now')
+        question.isFavorite = true
+        indexedDB.add(key, question)
+        this.favorites.push(question)
+        this.$message.success('收藏成功')
+      } else {
+        // 根据 uuid 删除 favorites 中的对应项
+        this.favorites = this.favorites.filter(item => item.uuid !== question.uuid)
+        // 删除收藏的储存
+        const key = 'favorites-' + question.uuid
+        indexedDB.delete(key)
+      }
+      this.updateQuestion(question)
+    },
+    delQuestion (item, index) {
+      // 删除对话历史
+      this.questions.splice(index, 1)
+      const key = 'question-' + item.uuid
+      indexedDB.delete(key)
+      // 删除收藏
+      const favoritesKey = 'favorites-' + item.uuid
+      indexedDB.delete(favoritesKey)
+      // 删除收藏数组中的对应项
+      this.favorites = this.favorites.filter(favorite => favorite.uuid !== item.uuid)
+      this.$message.success('删除成功')
+    },
+    delFavorites (item, index) {
+      this.favorites.splice(index, 1)
+      // 根据uuid寻找 questions 中的对应项
+      // 重新赋值给 questions
+      this.questions = this.questions.map(_item => {
+        if (_item.uuid === item.uuid) {
+          _item.isFavorite = false
+        }
+        return _item
+      })
+      const key = 'favorites-' + item.uuid
+      indexedDB.delete(key)
+      this.$message.success('取消收藏成功')
+      // 如果favorites为空，切换到对话历史
+      if (this.favorites.length === 0) {
+        this.activeKey = '1'
+      }
+      this.updateQuestion(item)
+    }
+    ,
+  }
+}
+</script>
+
+<style scoped lang="less">
+
+#question-history {
+
+  margin-right: 10px;
+  height: 100%;
+
+  .question-history-active {
+    border-left: 4px solid #1890FF;
+    // 左上左下圆角
+    border-radius: 4px 0 0 4px;
+    padding-left : 4px;
+  }
+
+  .question-history-inactive {
+    padding-left : 8px;
+  }
+
+  .ant-list-item-meta /deep/ {
+    width: 60%;
+  }
+
+  .ant-list-item-meta-content /deep/ {
+    width: 98%;
+  }
+
+  .ant-list-item-meta-title /deep/ {
+    width: 90%;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .ant-card {
+    height: 100%;
+    overflow-y: auto;
+  }
+
+  .startActive {
+    color: #FFD700;
+    font-size: 1rem;
+  }
+
+  .startInactive {
+    font-size: 1rem;
+  }
+
+  .delClass {
+    font-size: 1rem;
+    color: #777;
+  }
+
+  .reSearch {
+    font-size: 1rem;
+    color: #1890FF;
+  }
+
+  .reSearch:hover {
+    animation: rotate 0.5s ease-in-out both;
+  }
+
+  @keyframes rotate {
+    0% {
+      transform: rotate(0deg);
+    }
+    100% {
+      transform: rotate(180deg);
+    }
+  }
+
+  .startActive, .startInactive, .reSearch {
+    transition: transform 0.1s;
+  }
+
+  .startActive:hover, .startInactive:hover {
+    animation: shake 0.5s ease-in-out both;
+  }
+
+  @keyframes shake {
+    0% {
+      transform: rotate(0deg);
+    }
+    25% {
+      transform: rotate(-20deg);
+    }
+    50% {
+      transform: rotate(0deg);
+    }
+    75% {
+      transform: rotate(20deg);
+    }
+    100% {
+      transform: rotate(0deg);
+    }
+  }
+}
+
+</style>