smartai_desk_pc/docs/api-request.md

网络请求

• ajax
• WebSocket
• @microsoft/fetch-event-source （SSE）

API请求

请注意src/components/ApiGet.vue组件，此组件可用于get相关的网络请求。

此组件封装了一些默认的loading效果、错误处理内容提示。

相关使用示例：

• src/components/ApiGetExample1.vue
• src/components/ApiGetExample2.vue
• src/components/ApiGetExample3.vue

示例1

<template>
  <ApiGet :url="url">
    <template v-slot="slotProps">
      <div class="result">{{ slotProps.data[0].id }}</div>
    </template>
  </ApiGet>
</template>

<script setup>
import ApiGet from './ApiGet.vue';

/**
 * 使用默认的Loading、错误处理组件
 * 使用 slot 数据
 */
const url = '/api/agent/list';
</script>

一般常用的API接口请求通过Promise统一封装暴露,在组件中引入调用。

示例2

export const getAgentIcons = ({ username }) => {
  return new Promise((resolve, reject) => {
    ajax
      .post(
        `/iaserverapi/v1/user/getInfo`,
        { username },
        {
          headers: {
            'Content-Type': 'application/json'
          }
        }
      )
      .then((res) => {
        resolve({ code: 200, data: res.data });
      })
      .catch((err) => {
        reject(err);
      });
  });
}

import { getAgentIcons } from '../../modules/conversation-dialog/api-dialog';
const getAgentIconsFun = async () => {
  const username = await getUserName();
  const res = await getAgentIcons({ username });
};