Migrate new service (#1)

AceDataCloud · Mar 6, 2024 · 28da026 · 28da026
1 parent f13ca37
commit 28da026
Show file tree

Hide file tree

Showing 109 changed files with 1,158 additions and 1,051 deletions.
diff --git a/change/@acedatacloud-hub-3f7b468d-823d-4219-b31b-12abca70ebf7.json b/change/@acedatacloud-hub-3f7b468d-823d-4219-b31b-12abca70ebf7.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "migrate to new architecture",
+  "packageName": "@acedatacloud/hub",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}
diff --git a/src/components/application/Confirm.vue b/src/components/application/Confirm.vue
@@ -1,41 +1,41 @@
 <template>
-  <el-dialog :model-value="visible" width="500px" center @close="$emit('update:visible', false)">
+  <el-dialog
+    :model-value="visible"
+    width="500px"
+    :title="$t('application.message.confirmApplying')"
+    center
+    @close="$emit('update:visible', false)"
+  >
     <div class="content">
       <el-descriptions :column="1">
         <el-descriptions-item :label="$t('application.field.name')">
-          {{ object?.title }}
+          {{ service?.title }}
         </el-descriptions-item>
         <el-descriptions-item :label="$t('application.field.freeAmount')">
-          <span v-if="type === applicationType.API">
-            {{ object?.free_amount }}{{ $t(`api.unit.${object?.unit}`) }}
-          </span>
+          <span> {{ service?.free_amount }} {{ $t(`service.unit.${service?.unit}`) }} </span>
         </el-descriptions-item>
       </el-descriptions>
-      <p class="description">
-        {{ $t('application.message.applyDescription') }}
-      </p>
       <el-divider class="my-2" />
       <div class="policy">
         <el-checkbox v-model="checked" size="large" class="policy-checkbox" />
         <span class="policy-title"> {{ $t('application.message.readPolicy') }} </span>
-        <span class="policy-title highlight" @click="showPolicy = true"> {{ $t('application.message.policy') }} </span>
+        <span class="policy-title highlight" @click="showPolicy = true">
+          &nbsp;{{ $t('application.message.policy') }}</span
+        >
         <application-policy v-model.visible="showPolicy" />
       </div>
-      <el-button type="primary" class="btn btn-apply" @click="onApply">
-        {{ $t('common.button.applyForFree') }}
-      </el-button>
+      <el-button type="primary" @click="onApply">{{ $t('common.button.apply') }}</el-button>
     </div>
   </el-dialog>
 </template>
 
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { ElDialog, ElDescriptions, ElDescriptionsItem, ElDivider, ElCheckbox, ElButton, ElMessage } from 'element-plus';
-import { IApi, IApplicationType } from '@/operators';
+import { IService } from '@/models';
 import ApplicationPolicy from './Policy.vue';
 
 interface IData {
-  applicationType: typeof IApplicationType;
   checked: boolean;
   showPolicy: boolean;
 }
@@ -52,12 +52,8 @@ export default defineComponent({
     ApplicationPolicy
   },
   props: {
-    object: {
-      type: Object as () => IApi | undefined,
-      required: true
-    },
-    type: {
-      type: Object as () => IApplicationType,
+    service: {
+      type: Object as () => IService,
       required: true
     },
     visible: {
@@ -69,8 +65,7 @@ export default defineComponent({
   emits: ['update:visible', 'apply'],
   data(): IData {
     return {
-      applicationType: IApplicationType,
-      checked: true,
+      checked: false,
       showPolicy: false
     };
   },
@@ -90,18 +85,8 @@ export default defineComponent({
 <style lang="scss" scoped>
 .content {
   padding: 10px 40px;
-
-  .description {
-    font-size: 12px;
-  }
-
-  .btn-apply {
-    border-radius: 20px;
-  }
-
   .policy {
     margin-bottom: 10px;
-
     .policy-checkbox {
       margin-right: 10px !important;
     }

diff --git a/src/components/common/ApiStatus.vue → src/components/application/Status.vue b/src/components/common/ApiStatus.vue → src/components/application/Status.vue
@@ -8,60 +8,58 @@
   </div>
   <div v-else-if="application" class="status">
     <span class="info">
-      {{ $t('common.message.usedCount') }}: {{ application?.used_amount }} {{ $t('common.message.remainingCount') }}:
-      {{ application?.remaining_amount }}
+      {{ $t('common.message.usedAmount') }}: {{ application?.used_amount?.toFixed(6) }}
+      {{ $t('common.message.remainingAmount') }}:
+      {{ application?.remaining_amount?.toFixed(6) }}
     </span>
     <span class="actions">
       <el-button size="small" type="primary" @click="onBuyMore(application)">{{
         $t('common.button.buyMore')
       }}</el-button>
     </span>
   </div>
-  <div v-if="needApply && api" class="text-center info">
+  <div v-if="needApply && service" class="text-center info">
     <span class="mr-2">{{ $t('chat.message.notApplied') }}</span>
     <span>
       <el-button type="primary" class="btn btn-apply" size="small" @click="confirming = true">
         {{ $t('common.button.apply') }}
       </el-button>
     </span>
     <span class="ml-1">{{ $t('chat.message.tryForFree') }}</span>
-    <application-confirm v-model.visible="confirming" :object="api" :type="applicationType.API" @apply="onApply" />
+    <application-confirm v-if="service" v-model.visible="confirming" :service="service" @apply="onApply" />
   </div>
 </template>
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { IApplication, IApplicationDetailResponse, applicationOperator } from '@/operators';
+import { applicationOperator } from '@/operators';
 import { ElButton, ElMessage, ElSkeleton, ElSkeletonItem } from 'element-plus';
 import ApplicationConfirm from '@/components/application/Confirm.vue';
-import { IApplicationType } from '@/operators';
-import { apiOperator } from '@/operators/api/operator';
-import { IApiDetailResponse, IApi } from '@/operators/api';
+import { IApplicationType, IApplication, IApplicationDetailResponse, IService } from '@/models';
 import { ERROR_CODE_DUPLICATION } from '@/constants/errorCode';
 import { ROUTE_CONSOLE_APPLICATION_BUY } from '@/router';
 
 export interface IData {
   confirming: boolean;
   applicationType: typeof IApplicationType;
-  api: IApi | undefined;
 }
 
 export default defineComponent({
-  name: 'ApiStatus',
+  name: 'ApplicationStatus',
   components: { ElButton, ApplicationConfirm, ElSkeleton, ElSkeletonItem },
   props: {
     application: {
       type: Object as () => IApplication | undefined,
       required: true
     },
-    apiId: {
-      type: String,
-      required: true
-    },
     initializing: {
       type: Boolean,
       default: false
     },
+    service: {
+      type: Object as () => IService | undefined,
+      required: true
+    },
     needApply: {
       type: Boolean,
       default: false
@@ -71,8 +69,7 @@ export default defineComponent({
   data(): IData {
     return {
       confirming: this.needApply,
-      applicationType: IApplicationType,
-      api: undefined
+      applicationType: IApplicationType
     };
   },
   computed: {
@@ -88,20 +85,9 @@ export default defineComponent({
       if (val) {
         this.confirming = val;
       }
-    },
-    apiId() {
-      this.onFetchApi();
     }
   },
-  mounted() {
-    this.onFetchApi();
-  },
   methods: {
-    onFetchApi() {
-      apiOperator.get(this.apiId).then(({ data: data }: { data: IApiDetailResponse }) => {
-        this.api = data;
-      });
-    },
     onBuyMore(application: IApplication) {
       this.$router.push({
         name: ROUTE_CONSOLE_APPLICATION_BUY,
@@ -114,7 +100,7 @@ export default defineComponent({
       applicationOperator
         .create({
           type: IApplicationType.API,
-          api_id: this.apiId
+          service_id: this.service?.id
         })
         .then(({ data: data }: { data: IApplicationDetailResponse }) => {
           ElMessage.success(this.$t('application.message.applySuccessfully'));

diff --git a/src/components/chat/InputBox.vue b/src/components/chat/InputBox.vue
@@ -50,8 +50,9 @@
 import { defineComponent } from 'vue';
 import { ElInput, ElMessage, ElTooltip, ElUpload } from 'element-plus';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
-import { CHAT_MODEL_CHATGPT4_VISION, IChatModel } from '@/operators';
+import { IChatModel } from '@/models';
 import { getBaseUrlData } from '@/utils';
+import { CHAT_MODEL_GPT_4_VISION } from '@/constants';
 
 export default defineComponent({
   name: 'InputBox',
@@ -96,7 +97,7 @@ export default defineComponent({
       return this.fileList.map((file: UploadFile) => file?.response?.file_url);
     },
     canUpload() {
-      return [CHAT_MODEL_CHATGPT4_VISION.name].includes(this.model.name);
+      return [CHAT_MODEL_GPT_4_VISION.name].includes(this.model.name);
     },
     model(): IChatModel {
       return this.$store.state.chat.model;

diff --git a/src/components/chat/Introduction.vue b/src/components/chat/Introduction.vue
@@ -73,6 +73,7 @@ import { defineComponent } from 'vue';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
 import IntroductionItem from './IntroductionItem.vue';
 import { ElRow, ElCol } from 'element-plus';
+
 export default defineComponent({
   name: 'ConversationIntroduction',
   components: {

diff --git a/src/components/chat/Message.vue b/src/components/chat/Message.vue
@@ -33,7 +33,7 @@ import AnsweringMark from './AnsweringMark.vue';
 import copy from 'copy-to-clipboard';
 import { ElAlert, ElButton } from 'element-plus';
 import MarkdownRenderer from '@/components/common/MarkdownRenderer.vue';
-import { IApplication, IChatMessage, IChatMessageState } from '@/operators';
+import { IApplication, IChatMessage, IChatMessageState } from '@/models';
 import CopyToClipboard from '../common/CopyToClipboard.vue';
 import {
   ERROR_CODE_API_ERROR,
@@ -48,6 +48,7 @@ import {
 } from '@/constants';
 import message from '@/i18n/zh/common/message';
 import { ROUTE_CONSOLE_APPLICATION_BUY } from '@/router';
+
 interface IData {
   copied: boolean;
   messageState: typeof IChatMessageState;

diff --git a/src/components/chat/ModelSelector.vue b/src/components/chat/ModelSelector.vue
@@ -49,28 +49,27 @@
 import { defineComponent } from 'vue';
 import { ElDropdown, ElButton, ElDropdownItem } from 'element-plus';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
+import { IChatModel } from '@/models';
 import {
-  CHAT_MODEL_CHATGPT,
-  CHAT_MODEL_CHATGPT4,
-  CHAT_MODEL_CHATGPT4_BROWSING,
-  CHAT_MODEL_CHATGPT4_VISION,
-  CHAT_MODEL_CHATGPT_16K,
-  CHAT_MODEL_CHATGPT_BROWSING
-} from '@/operators/chat/constants';
-import { IChatModel } from '@/operators';
+  CHAT_MODEL_GPT_3_5,
+  CHAT_MODEL_GPT_3_5_BROWSING,
+  CHAT_MODEL_GPT_4,
+  CHAT_MODEL_GPT_4_BROWSING,
+  CHAT_MODEL_GPT_4_VISION
+} from '@/constants';
 
 const GROUPS = [
   {
     label: '3.5',
     value: 'base',
     icon: 'fa-solid fa-bolt',
-    options: [CHAT_MODEL_CHATGPT, CHAT_MODEL_CHATGPT_16K, CHAT_MODEL_CHATGPT_BROWSING]
+    options: [CHAT_MODEL_GPT_3_5, CHAT_MODEL_GPT_3_5_BROWSING]
   },
   {
     label: '4.0',
     value: 'plus',
     icon: 'fa-solid fa-wand-magic-sparkles',
-    options: [CHAT_MODEL_CHATGPT4, CHAT_MODEL_CHATGPT4_BROWSING, CHAT_MODEL_CHATGPT4_VISION]
+    options: [CHAT_MODEL_GPT_4, CHAT_MODEL_GPT_4_BROWSING, CHAT_MODEL_GPT_4_VISION]
   }
 ];
 

diff --git a/src/components/chat/SidePanel.vue b/src/components/chat/SidePanel.vue
@@ -70,8 +70,8 @@ import { ElSkeleton, ElInput } from 'element-plus';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
 import { ROUTE_CHAT_CONVERSATION, ROUTE_CHAT_CONVERSATION_NEW } from '@/router/constants';
 import { chatOperator } from '@/operators';
-import { IChatConversation } from '@/operators/chat/models';
-import { Status } from '@/store/common/models';
+import { IChatConversation } from '@/models';
+import { Status } from '@/models';
 
 export default defineComponent({
   name: 'SidePanel',
@@ -89,11 +89,14 @@ export default defineComponent({
     conversations() {
       return this.$store.state.chat.conversations;
     },
-    applications() {
-      return this.$store.state.chat.applications;
+    application() {
+      return this.$store.state.chat.application;
     },
     loading() {
-      return this.$store.state.chat.getConversationsStatus === Status.Request;
+      return this.$store.state.chat.status.getConversations === Status.Request;
+    },
+    token() {
+      return this.application?.credentials?.[0].token;
     }
   },
   methods: {
@@ -103,11 +106,20 @@ export default defineComponent({
       });
     },
     async onConfirm(conversation: IChatConversation) {
+      const token = this.token;
+      if (!token) {
+        console.error('Token is not found');
+        return;
+      }
       if (conversation?.deleting) {
-        await chatOperator.deleteConversation(conversation.id);
+        await chatOperator.deleteConversation(conversation.id, {
+          token
+        });
         await this.$store.dispatch('chat/getConversations');
       } else if (conversation?.editing) {
-        await chatOperator.updateConversation(conversation);
+        await chatOperator.updateConversation(conversation, {
+          token
+        });
         await this.$store.dispatch('chat/getConversations');
       } else {
         conversation.editing = true;

diff --git a/src/components/chatdoc/Conversations.vue b/src/components/chatdoc/Conversations.vue
@@ -69,7 +69,8 @@ import { defineComponent } from 'vue';
 import { ElSkeleton, ElInput } from 'element-plus';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
 import { ROUTE_CHATDOC_CONVERSATION, ROUTE_CHATDOC_CONVERSATION_NEW } from '@/router/constants';
-import { IChatdocRepository, chatdocOperator, IChatdocConversation } from '@/operators';
+import { chatdocOperator } from '@/operators';
+import { IChatdocRepository, IChatdocConversation } from '@/models';
 
 export default defineComponent({
   name: 'SidePanel',
@@ -93,8 +94,8 @@ export default defineComponent({
     conversations() {
       return this.repository?.conversations;
     },
-    applications() {
-      return this.$store.state.chatdoc.applications;
+    application() {
+      return this.$store.state.chatdoc.application;
     }
   },
   methods: {

diff --git a/src/components/chatdoc/InputBox.vue b/src/components/chatdoc/InputBox.vue
@@ -26,9 +26,9 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { ElInput, ElMessage, ElTooltip, ElUpload } from 'element-plus';
+import { ElInput } from 'element-plus';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
-import { CHAT_MODEL_CHATGPT4_VISION, IChatModel } from '@/operators';
+import { IChatModel } from '@/models';
 
 export default defineComponent({
   name: 'InputBox',

diff --git a/src/components/chatdoc/Message.vue b/src/components/chatdoc/Message.vue
@@ -27,7 +27,7 @@ import AnsweringMark from './AnsweringMark.vue';
 import copy from 'copy-to-clipboard';
 import { ElAlert, ElButton } from 'element-plus';
 import MarkdownRenderer from '@/components/common/MarkdownRenderer.vue';
-import { IChatdocMessage, IChatdocMessageState } from '@/operators';
+import { IChatdocMessage, IChatdocMessageState } from '@/models';
 import CopyToClipboard from '../common/CopyToClipboard.vue';
 import {
   ERROR_CODE_API_ERROR,