Merge pull request #912 from Support-pl/dev-fixes

SazukinPavel · web-flow · commit a6a5a85ab1f8 · 2025-03-13T09:38:38.000-07:00
Dev fixes
diff --git a/src/components/services/openai/draw.vue b/src/components/services/openai/draw.vue
@@ -1,19 +1,5 @@
 <template>
   <a-row class="module" style="margin-top: 10px" :gutter="[10, 10]">
-    <a-col span="12">
-      <div style="padding-bottom: 0; font-weight: 700">Input kilotoken:</div>
-      <div style="padding-top: 0; font-size: 18px">
-        {{ service.resources.inputKilotoken }} {{ currency.title }}
-      </div>
-    </a-col>
-
-    <a-col span="12">
-      <div style="padding-bottom: 0; font-weight: 700">Output kilotoken:</div>
-      <div style="padding-top: 0; font-size: 18px">
-        {{ service.resources.outputKilotoken }} {{ currency.title }}
-      </div>
-    </a-col>
-
     <a-col span="24">
       <div class="token-title">
         Token API:
@@ -36,21 +22,130 @@
     </a-col>
 
     <a-col span="24">
-      <div class="token-title">
-        API endpoint:
-        <copy-icon style="font-size: 18px" @click="addToClipboard(endpoint)" />
-      </div>
-      <div style="padding-top: 0; font-size: 18px">
-        {{ endpoint }}
-      </div>
-    </a-col>
+      <a-tabs v-model:activeKey="activeApiTab">
+        <a-tab-pane key="1" tab="API v1">
+          <a-row style="padding: 0px 5px; margin-bottom: 10px">
+            <a-col span="12">
+              <div style="padding-bottom: 0; font-weight: 700">
+                Input kilotoken:
+              </div>
+              <div style="padding-top: 0; font-size: 18px">
+                {{ service.resources.inputKilotoken }} {{ currency.title }}
+              </div>
+            </a-col>
+            <a-col span="12">
+              <div style="padding-bottom: 0; font-weight: 700">
+                Output kilotoken:
+              </div>
+              <div style="padding-top: 0; font-size: 18px">
+                {{ service.resources.outputKilotoken }} {{ currency.title }}
+              </div>
+            </a-col>
+          </a-row>
 
-    <a-col span="24">
-      <div class="token-title">
-        API example:
-        <copy-icon style="font-size: 18px" @click="addToClipboard(example)" />
-      </div>
-      <code>{{ example }}</code>
+          <a-col span="24">
+            <div class="token-title">
+              API endpoint:
+              <copy-icon
+                style="font-size: 18px"
+                @click="addToClipboard(endpointv1)"
+              />
+            </div>
+            <div style="padding-top: 0; font-size: 18px">
+              {{ endpointv1 }}
+            </div>
+          </a-col>
+
+          <a-col span="24">
+            <div class="token-title">
+              API example:
+              <copy-icon
+                style="font-size: 18px"
+                @click="addToClipboard(exampleV1)"
+              />
+            </div>
+            <code>{{ exampleV1 }}</code>
+          </a-col>
+        </a-tab-pane>
+        <a-tab-pane key="2" tab="API v2 (BETA)">
+          <a-row style="padding: 0px 5px">
+            <a-col span="12">
+              <a-select
+                style="width: 100%; margin-right: 5px"
+                v-model:value="selectedTypeV2"
+                :options="typesOptionsV2"
+              ></a-select>
+            </a-col>
+
+            <a-col span="12">
+              <a-select
+                style="margin-left: 5px; margin-right: 10px; width: 100%"
+                v-model:value="selectedModelV2"
+                :options="modelsOptionsV2"
+              ></a-select>
+            </a-col>
+
+            <a-col span="12">
+              <div style="padding-bottom: 0; font-weight: 700">
+                Input kilotoken:
+              </div>
+              <div style="padding-top: 0; font-size: 18px">
+                {{
+                  service.resources[
+                    `${selectedTypeV2}|${selectedModelV2}|input`
+                  ]
+                }}
+                {{ currency.title }}
+              </div>
+            </a-col>
+            <a-col span="12">
+              <div style="padding-bottom: 0; font-weight: 700">
+                Output kilotoken:
+              </div>
+              <div style="padding-top: 0; font-size: 18px">
+                {{
+                  service.resources[
+                    `${selectedTypeV2}|${selectedModelV2}|output`
+                  ]
+                }}
+                {{ currency.title }}
+              </div>
+            </a-col>
+          </a-row>
+
+          <a-col span="24">
+            <div class="token-title">
+              Base URL:
+              <copy-icon
+                style="font-size: 18px"
+                @click="addToClipboard(baseUrlV2)"
+              />
+            </div>
+            <div style="padding-top: 0; font-size: 18px">
+              {{ baseUrlV2 }}
+            </div>
+          </a-col>
+
+          <a-col span="24">
+            <div
+              class="token-title"
+              style="display: flex; justify-content: space-between"
+            >
+              <div>
+                <span> API example: </span>
+                <copy-icon
+                  style="font-size: 18px"
+                  @click="addToClipboard(exampleV2)"
+                />
+              </div>
+              <a-button @click="openOpenAiDocs" type="link">{{
+                $t("moreExamples")
+              }}</a-button>
+            </div>
+            <code>{{ exampleV2 }}</code>
+          </a-col>
+        </a-tab-pane>
+      </a-tabs>
     </a-col>
 
     <a-col span="24" style="margin-top: 10px">
@@ -134,6 +229,7 @@ const chats = computed(() => {
       message: chat.meta.lastMessage?.content ?? "",
       status: capitalized,
       unread: chat.meta.unread,
+      attachments: chat.meta.lastMessage?.attachments ?? [],
     });
   });
 
@@ -147,10 +243,11 @@ function moduleEnter() {
 
 const isVisible = ref(false);
 const isLoading = ref(false);
+const activeApiTab = ref("1");
 const token = ref("-");
-const endpoint = `${VUE_APP_BASE_URL}nocloud/chat/completions`;
 
-const example = `
+const endpointv1 = `${VUE_APP_BASE_URL}nocloud/chat/completions`;
+const exampleV1 = `
   curl \`<endpoint>\`
   -X POST
   -H "Content-Type: application/json"
@@ -163,6 +260,62 @@ const example = `
   }'
 `;
 
+const selectedModelV2 = ref("gpt-4o");
+const selectedTypeV2 = ref("text");
+const baseUrlV2 = `${VUE_APP_BASE_URL}nocloud/api`;
+const exampleV2 = computed(
+  () => `
+  curl <baseUrl>/v1/chat/completions \
+  -H "Content-Type: application/json" \
+  -H "Authorization: Bearer <token>" \
+  -d '{
+    "model": "${selectedModelV2.value}",
+    "messages": [
+      {
+        "role": "developer",
+        "content": "You are a helpful assistant."
+      },
+      {
+        "role": "user",
+        "content": "Hello!"
+      }
+    ]
+  }'
+`
+);
+
+const modelsOptionsV2 = computed(() => {
+  const resources = Object.keys(props.service.resources)
+    .filter(
+      (key) =>
+        key.split("|").length > 1 ?? key.split("|")[0] === selectedTypeV2.value
+    )
+    .map((key) => key.split("|")[1]);
+
+  return [...new Set(resources).values()].map((key) => ({
+    value: key,
+    label: key,
+  }));
+});
+
+const typesOptionsV2 = computed(() => {
+  const resources = Object.keys(props.service.resources)
+    .filter((key) => key.split("|").length > 1)
+    .map((key) => key.split("|")[0]);
+
+  return [...new Set(resources).values()].map((key) => ({
+    value: key,
+    label: key,
+  }));
+});
+
+function openOpenAiDocs() {
+  window.open(
+    "https://platform.openai.com/docs/api-reference/chat/create",
+    "_blanc"
+  );
+}
+
 async function fetch() {
   try {
     isLoading.value = true;
diff --git a/src/components/support/ticketItem.vue b/src/components/support/ticketItem.vue
@@ -15,7 +15,7 @@
       </div>
       <div class="ticket__lower">
         <div class="ticket__message">
-          {{ beauty(ticket.message) }}
+          {{ beauty(ticket) }}
         </div>
         <div class="ticket__time">
           {{ toDate(ticket.date / 1000 || ticket.date, ".", "00:00") }}
@@ -31,6 +31,7 @@ import { useRoute, useRouter } from "vue-router";
 import { useChatsStore } from "@/stores/chats.js";
 import { toDate } from "@/functions.js";
 import config from "@/appconfig.js";
+import { useI18n } from "vue-i18n";
 
 const props = defineProps({
   ticket: { type: Object, required: true },
@@ -41,6 +42,7 @@ const props = defineProps({
 const router = useRouter();
 const route = useRoute();
 const chatsStore = useChatsStore();
+const { t } = useI18n();
 
 const offset = computed(() => {
   if (props.ticket.unread > 9) {
@@ -82,13 +84,16 @@ function ticketClick(id) {
   router.push({ path: `/ticket/${id}`, query });
 }
 
-function beauty(message) {
+function beauty(ticket) {
+  let message = ticket.message;
   message = decode(message);
   message = message.replace(/-{2,}.*/gi, "");
   message = message.replace(/IP Address.*/gi, "");
   message = message.replace(/<\/?[a-zA-Zа-яА-Я1-9 #-:=";_!?]+>/gi, "");
 
-  return message.trim() || "empty";
+  return message.trim() || ticket.attachments?.length > 0
+    ? t("attachedFiles")
+    : "empty";
 }
 
 function decode(text) {
diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
@@ -383,6 +383,7 @@
     "token": "token",
     "Token expiration date": "Token expiration date",
     "Refresh token": "Refresh token",
+    "moreExamples": "More examples",
     "openai description": "You can use ChatGPT by OpenAI in the Multi-cloud service Support.by with a transparent payment system and without VPN. To start using the feature you need to register in our service, top up your balance and choose the ChatGPT service. \n\n After ordering the service, you get access to ChatGPT through this application and start using the chat. You also receive a ChatGPT API token for use in your software development.",
     "openai description 2": "Your balance is debited according to the number of tokens required for your work or the functionality of your product, depending on the complexity and length of the conversation. Payment is made for the total number of input and output tokens, amounting to thousands. \n\n Think of a \"token\" as a word fragment used for natural language processing. For English text, 1 token is approximately 4 characters or 0.75 words. For the Russian language, one token is approximately equal to 2 characters or 0.25 words.",
     "enter": "Enter",
@@ -750,6 +751,7 @@
     "disk detach": "Disk detach",
     "assign to VM": "Assign to VM",
     "NIC attach": "NIC attach",
+    "attachedFiles": "Attached files",
     "private": "Private",
     "available intervals": "Available intervals:",
     "enter new private IP": "Enter new private IP:",
diff --git a/src/i18n/locales/fr.json b/src/i18n/locales/fr.json
@@ -79,6 +79,8 @@
     "years": "ans",
     "Network": "Réseau",
     "Total": "Total",
+    "moreExamples": "Plus d'exemples",
+    "attachedFiles": "Fichiers joints",
     "Ready made servers": "Forfaits VPS SSD",
     "Windows is paid": "Windows est payant",
     "Payment will be made immediately after purchase": "Le paiement sera effectué immédiatement après l'achat",
diff --git a/src/i18n/locales/pl.json b/src/i18n/locales/pl.json
@@ -214,6 +214,8 @@
     "invoice_Returned": "Zwrócone",
     "invoice_Draft": "Projekt",
     "Active": "Aktywny",
+    "moreExamples": "Więcej przykładów",
+    "attachedFiles": "Załączone pliki",
     "Suspended": "Zawieszony",
     "Canceled": "Odwołany",
     "Pay": "Zaplać",
diff --git a/src/i18n/locales/ru.json b/src/i18n/locales/ru.json
@@ -336,6 +336,8 @@
     "select location": "Выберите локацию",
     "select service": "Select service",
     "select OS": "Выберите ОС",
+    "moreExamples": "Больше примеров",
+    "attachedFiles": "Прикреплённые файлы",
     "select tariff": "Выберите тариф",
     "loading": "Загрузка...",
     "bot is typing": "бот печатает",
diff --git a/src/i18n/locales/vi.json b/src/i18n/locales/vi.json
@@ -217,6 +217,8 @@
     "Servers": "Virtual Servers",
     "Virtual": "Web Hosting",
     "info": "Thông tin",
+    "moreExamples": "Thêm ví dụ",
+    "attachedFiles": "Tập tin đính kèm",
     "enter": "Truy cập",
     "all fields are required": "Vui lòng điền vào tất cả các trường",
     "field must contain more characters": "Chưa nhập đủ ký tự cho trường",
diff --git a/src/routes/services/servicePage.vue b/src/routes/services/servicePage.vue
@@ -349,6 +349,7 @@ async function onStart() {
         );
 
         domain.resources = {
+          ...products,
           period: t("PayG"),
           recurringamount: 0,
           inputKilotoken: products.input_kilotoken,
