feat: 概览

ui/src/components/ai-chat/LogOperationButton.vue

@@ -19,11 +19,7 @@
     <el-button text disabled v-if="buttonData?.vote_status === '1'">
       <AppIcon iconName="app-oppose-color"></AppIcon>
     </el-button>
-    <EditContentDialog
-      ref="EditContentDialogRef"
-      :chartId="chartId"
-      @updateContent="updateContent"
-    />
+    <EditContentDialog ref="EditContentDialogRef" />
   </div>
 </template>
 <script setup lang="ts">
@@ -40,10 +36,6 @@ const props = defineProps({
     type: String,
     default: ''
   },
-  chartId: {
-    type: String,
-    default: ''
-  },
   log: Boolean
 })
 
@@ -58,8 +50,8 @@ function editContent(data: any) {
   EditContentDialogRef.value.open(data)
 }
 
-function updateContent(data: any) {
-  emit('update:data', data)
-}
+// function updateContent(data: any) {
+//   emit('update:data', data)
+// }
 </script>
 <style lang="scss" scoped></style>

ui/src/components/ai-chat/index.vue

@@ -71,7 +71,7 @@
                 <el-text type="info">
                   消耗 {{ item?.message_tokens + item?.answer_tokens }} tokens
                 </el-text>
-                <LogOperationButton :data="item" :applicationId="appId" :chartId="item.id" />
+                <LogOperationButton :data="item" :applicationId="appId" />
               </div>
 
               <div class="flex-between mt-8" v-else>

ui/src/components/layout-container/index.vue

@@ -7,10 +7,11 @@
       <h3>{{ header }}</h3>
       <slot name="header"> </slot>
     </div>
-
-    <div class="content-container__main">
-      <slot></slot>
-    </div>
+    <el-scrollbar>
+      <div class="content-container__main">
+        <slot></slot>
+      </div>
+    </el-scrollbar>
   </div>
 </template>
 
@@ -41,6 +42,7 @@ const showBack = computed(() => {
     background-color: var(--app-view-bg-color);
     border-radius: 4px;
     box-sizing: border-box;
+    min-width: 700px;
   }
 }
 </style>

ui/src/layout/components/top-bar/avatar/index.vue

@@ -13,7 +13,7 @@
     <template #dropdown>
       <el-dropdown-menu class="avatar-dropdown">
         <div class="userInfo">
-          <p class="bold mb-4" style="font-size: 14px;">{{ user.userInfo?.username }}</p>
+          <p class="bold mb-4" style="font-size: 14px">{{ user.userInfo?.username }}</p>
           <p>
             <el-text type="info">
               {{ user.userInfo?.email }}
@@ -52,6 +52,7 @@ const logout = () => {
 </script>
 <style lang="scss" scoped>
 .avatar-dropdown {
+  min-width: 210px;
   .userInfo {
     padding: 12px 11px;
   }

ui/src/views/applicaiton-overview/index.vue

@@ -1,6 +1,6 @@
 <template>
   <LayoutContainer header="概览">
-    <div class="main-calc-height p-24">
+    <div class="main-calc-height p-24" style="min-width: 600px">
       <h4 class="title-decoration-1 mb-16">应用信息</h4>
       <el-card shadow="never" class="overview-card" v-loading="loading">
         <div class="title flex align-center">
@@ -16,7 +16,7 @@
         </div>
 
         <el-row :gutter="12">
-          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12" class="mt-16">
+          <el-col :span="12" class="mt-16">
             <div class="flex">
               <el-text type="info">公开访问链接</el-text>
               <el-switch
@@ -26,7 +26,7 @@
                 inline-prompt
                 active-text="开"
                 inactive-text="关"
-                @change="changeState"
+                @change="changeState($event)"
               />
             </div>
 
@@ -38,16 +38,20 @@
               <el-button type="primary" text @click="copyClick(shareUrl)">
                 <AppIcon iconName="app-copy"></AppIcon>
               </el-button>
-              <el-button @click="getAccessToken" type="primary" text style="margin-left: 1px">
+              <el-button @click="refreshAccessToken" type="primary" text style="margin-left: 1px">
                 <el-icon><RefreshRight /></el-icon>
               </el-button>
             </div>
             <div>
-              <el-button :disabled="!accessToken?.is_active" type="primary"><a :href="shareUrl" target="_blank">演示</a></el-button>
-              <el-button :disabled="!accessToken?.is_active" @click="openDialog"> 嵌入第三方 </el-button>
+              <el-button :disabled="!accessToken?.is_active" type="primary"
+                ><a :href="shareUrl" target="_blank">演示</a></el-button
+              >
+              <el-button :disabled="!accessToken?.is_active" @click="openDialog">
+                嵌入第三方
+              </el-button>
             </div>
           </el-col>
-          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12" class="mt-16">
+          <el-col :span="12" class="mt-16">
             <div class="flex">
               <el-text type="info">API访问凭据</el-text>
             </div>
@@ -72,7 +76,7 @@
   </LayoutContainer>
 </template>
 <script setup lang="ts">
-import { reactive, ref, watch, onMounted } from 'vue'
+import { ref, computed, onMounted } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
 import EmbedDialog from './component/EmbedDialog.vue'
 import APIKeyDialog from './component/APIKeyDialog.vue'
@@ -91,20 +95,33 @@ const apiUrl = window.location.origin + '/doc'
 
 const APIKeyDialogRef = ref()
 const EmbedDialogRef = ref()
-const shareUrl = ref('')
+
 const accessToken = ref<any>({})
 const detail = ref<any>(null)
 
 const loading = ref(false)
 
+const shareUrl = computed(() => application.location + accessToken.value.access_token)
+
+function refreshAccessToken() {
+  const obj = {
+    access_token_reset: true
+  }
+  const str = '刷新成功'
+  updateAccessToken(obj, str)
+}
 function changeState(bool: Boolean) {
   const obj = {
     is_active: bool
   }
   const str = bool ? '启用成功' : '禁用成功'
+  updateAccessToken(obj, str)
+}
+
+function updateAccessToken(obj: any, str: string) {
   applicationApi.putAccessToken(id as string, obj, loading).then((res) => {
+    accessToken.value = res?.data
     MsgSuccess(str)
-    getDetail()
   })
 }
 
@@ -117,7 +134,6 @@ function openDialog() {
 function getAccessToken() {
   application.asyncGetAccessToken(id, loading).then((res: any) => {
     accessToken.value = res?.data
-    shareUrl.value = application.location + res?.data?.access_token
   })
 }
 

ui/src/views/log/component/EditContentDialog.vue

@@ -33,7 +33,7 @@
               <AppAvatar v-if="!node.isLeaf" class="mr-12" shape="square" :size="24">
                 <img src="@/assets/icon_document.svg" style="width: 58%" alt="" />
               </AppAvatar>
-              {{ data.name }}
+              <span class="ellipsis-1"> {{ data.name }}</span>
             </span>
           </template>
         </el-cascader>
@@ -42,7 +42,7 @@
     <template #footer>
       <span class="dialog-footer">
         <el-button @click.prevent="dialogVisible = false"> 取消 </el-button>
-        <el-button type="primary" @click="submitForm(formRef)"> 保存 </el-button>
+        <el-button type="primary" @click="submitForm(formRef)" :loading="loading"> 保存 </el-button>
       </span>
     </template>
   </el-dialog>
@@ -53,7 +53,6 @@ import { useRoute } from 'vue-router'
 import type { FormInstance, FormRules } from 'element-plus'
 import logApi from '@/api/log'
 import type { CascaderProps } from 'element-plus'
-
 import useStore from '@/stores'
 
 const { application, document } = useStore()
@@ -70,7 +69,6 @@ const {
   params: { id }
 } = route as any
 
-const emit = defineEmits(['updateContent'])
 
 const formRef = ref()
 
@@ -78,6 +76,7 @@ const dialogVisible = ref<boolean>(false)
 const loading = ref(false)
 
 const form = ref<any>({
+  chat_id: '',
   record_id: '',
   problem_text: '',
   title: '',
@@ -95,6 +94,7 @@ const datasetList = ref([])
 watch(dialogVisible, (bool) => {
   if (!bool) {
     form.value = {
+      chat_id: '',
       record_id: '',
       problem_text: '',
       title: '',
@@ -134,6 +134,7 @@ function getDataset(resolve: any) {
 }
 
 const open = (data: any) => {
+  form.value.chat_id = data.chat
   form.value.record_id = data.id
   form.value.problem_text = data.problem_text
   form.value.content = data.answer_text
@@ -150,7 +151,7 @@ const submitForm = async (formEl: FormInstance | undefined) => {
       logApi
         .putChatRecordLog(
           id,
-          props.chartId,
+          form.value.chat_id,
           form.value.record_id,
           form.value.document[0],
           form.value.document[1],
@@ -158,7 +159,6 @@ const submitForm = async (formEl: FormInstance | undefined) => {
           loading
         )
         .then((res: any) => {
-          emit('updateContent', res.data)
           dialogVisible.value = false
         })
     } else {