diff --git a/src/main.ts b/src/main.ts index 7979476..5beab0e 100644 --- a/src/main.ts +++ b/src/main.ts @@ -2,13 +2,14 @@ import { createApp } from 'vue' import App from './App.vue' import router from './router' - +import { createLoadingPlugin } from './utils/loading.js' // 引入加载插件; // 引入 Ant Design Vue 组件 import Antd from 'ant-design-vue' import 'ant-design-vue/dist/reset.css' const app = createApp(App) - +const loadingPlugin = createLoadingPlugin() +app.use(loadingPlugin) // 使用加载插件 app.use(router) app.use(Antd) // 全局注册所有 Ant Design 组件 diff --git a/src/utils/loading.js b/src/utils/loading.js new file mode 100644 index 0000000..9dae146 --- /dev/null +++ b/src/utils/loading.js @@ -0,0 +1,87 @@ +// plugins/loading.js +import { createVNode, render } from 'vue'; +import { Spin } from 'ant-design-vue'; + +const DEFAULT_OPTIONS = { + tip: '加载中...', + size: 'large', + fullscreen: true, // 是否全屏遮罩 +}; + +class LoadingInstance { + constructor(options = {}) { + this.options = { ...DEFAULT_OPTIONS, ...options }; + this.vm = null; + this.container = null; + this.show(); + } + + show() { + const { tip, size, fullscreen } = this.options; + + // 创建容器 + this.container = document.createElement('div'); + if (fullscreen) { + // 全屏模式:覆盖整个视口 + this.container.style.position = 'fixed'; + this.container.style.top = '0'; + this.container.style.left = '0'; + this.container.style.width = '100vw'; + this.container.style.height = '100vh'; + this.container.style.display = 'flex'; + this.container.style.justifyContent = 'center'; + this.container.style.alignItems = 'center'; + this.container.style.backgroundColor = 'rgba(0, 0, 0, 0.2)'; + this.container.style.zIndex = '9999'; + } else { + // 非全屏:需用户指定挂载点(本示例暂不支持,可扩展) + console.warn('非全屏模式未实现,请传入 target 元素'); + } + + // 创建 Spin 组件的 VNode + const vnode = createVNode(Spin, { + tip, + size, + spinning: true, + }); + + // 渲染到容器 + render(vnode, this.container); + document.body.appendChild(this.container); + this.vm = vnode; + } + + hide() { + if (this.container) { + render(null, this.container); // 卸载 + document.body.removeChild(this.container); + this.container = null; + } + } + + // 可选:自动在 Promise 完成后隐藏 + finishAfter(promise) { + if (promise && typeof promise.then === 'function') { + promise.finally(() => { + this.hide(); + }); + } + return promise; + } +} + +// 插件 install 方法 +export function createLoadingPlugin() { + return { + install(app) { + app.config.globalProperties.$loading = { + show(options) { + return new LoadingInstance(options); + }, + }; + + // 如果使用 TypeScript 或需要类型提示,可额外声明 + app.provide('$loading', app.config.globalProperties.$loading); + }, + }; +} \ No newline at end of file diff --git a/src/utils/useLoading.ts b/src/utils/useLoading.ts new file mode 100644 index 0000000..5d19749 --- /dev/null +++ b/src/utils/useLoading.ts @@ -0,0 +1,10 @@ +// composables/useLoading.js +import { getCurrentInstance } from 'vue' + +export function useLoading() { + const instance = getCurrentInstance() + if (!instance) { + throw new Error('useLoading() 必须在 setup() 或生命周期钩子中调用') + } + return instance.appContext.config.globalProperties.$loading +} \ No newline at end of file diff --git a/src/views/document/index.vue b/src/views/document/index.vue index 172f9b2..3a5d080 100644 --- a/src/views/document/index.vue +++ b/src/views/document/index.vue @@ -30,7 +30,7 @@ const selectedKeys = ref(['/document/introdution']); const menuItems = [ { key: '/document/introdution', label: '简介' }, { key: '/document/start', label: '快速开始' }, - { key: '/document/video', label: '视频教程' }, + // { key: '/document/video', label: '视频教程' }, { key: '/document/study', label: '学术资源加速' }, { key: '', label: '如何选择GPU', diff --git a/src/views/document/introdution.vue b/src/views/document/introdution.vue index 48ef389..5f7ece0 100644 --- a/src/views/document/introdution.vue +++ b/src/views/document/introdution.vue @@ -10,8 +10,8 @@

🎉 现在注册即送炼丹会员(有效期1个月),认证学生直接升级炼丹会员, 了解会员及认证🎉

👉 AutoDL的目标是为用户提供稳定可靠、价格公道的GPU算力,让GPU不再是您成为数据科学家道路上的拦路石。

-

👉 观看官方录制的官方使用视频

+ target="_blank">亼算云的目标是为用户提供稳定可靠、价格公道的GPU算力,让GPU不再是您成为数据科学家道路上的拦路石。

+

👉必看文档:

  1. 快速开始
  2. diff --git a/src/views/document/start.vue b/src/views/document/start.vue index a242d2b..596385d 100644 --- a/src/views/document/start.vue +++ b/src/views/document/start.vue @@ -2,39 +2,39 @@
    -

    快速开始

    +

    快速开始


    -

    AutoDL实例中的数据(包括环境)在关机后将全部保存,开机后无需再次配置和上传数据。总而言之,实例在数据在,但是连续关机15天实例将被释放。详见亼算云实例中的数据(包括环境)在关机后将全部保存,开机后无需再次配置和上传数据。总而言之,实例在数据在,但是连续关机15天实例将被释放。详见实例数据保留说明

    -

    创建实例

    +

    创建实例

    注册后进入控制台,在我的实例菜单下,点击「租用新实例」。

    -

    image_20250226144908

    +

    在租用实例页面:选择计费方式地区GPU型号GPU数量,然后选择合适的空闲主机镜像(内置了不同的深度学习框架的基础镜像和社区镜像),最后创建即可。

    如果你需要更大的硬盘用于存放数据,那么请留意「硬盘」这列「可扩容」大小。数据盘的路径请参考文档

    -

    image_20250226145836 - image_20250306103333 +

    +

    创建完成后等待自动开机,今后主要用到的操作入口见截图中。

    请注意实例状态显示「运行中」开始计费,如不使用请及时关机停止计费。计费规则详见计费说明

    -

    image_20250226153436

    -

    上传数据

    +

    +

    上传数据

    开机后在这个正在运行中的实例上找到快捷工具:「JupyterLab」,点击打开,在下面的截图中找到上传按钮,即可上传数据。如需上传文件夹或更高级的上传方式等,请查阅上传数据文档

    -

    image_20250226153633

    -

    终端训练

    +

    +

    终端训练

    在打开的JupyterLab页面中打开终端。如需使用其他IDE远程开发,请参考VSCode(推荐)PyCharm

    -

    image_20250226153713

    +

    在终端中执行您的Python命令等完成训练

    -

    image_20250226153804

    -

    进阶

    +

    +

    进阶

    1. 如何选择GPU
    2. 配置环境
    3. diff --git a/src/views/document/study.vue b/src/views/document/study.vue index 1cbdd2d..231493d 100644 --- a/src/views/document/study.vue +++ b/src/views/document/study.vue @@ -2,13 +2,13 @@
      -

      学术资源加速

      -

      公开服务

      +

      学术资源加速

      +

      公开服务

      点击访问网址,站点内有具体教程。

      Github: https://ghproxy.link/ (点击后查看当前可用的域名地址,然后点击地址跳转查看文档)

      HuggingFace镜像站:https://hf-mirror.com/

      -

      AutoDL内置服务

      +

      AutoDL内置服务

      声明:限于学术使用github和huggingface网络速度慢的问题,以下为方便用户学术用途使用相关资源提供的加速代理,不承诺稳定性保证。此外如遭遇恶意攻击等,将随时停止该加速服务

      @@ -42,11 +42,11 @@ for line in output.splitlines():
      unset http_proxy && unset https_proxy
       
      -

      速度对比

      +

      速度对比

      未使用加速:

      -

      image-20220902184957292

      +

      使用加速:

      -

      image-20220902185038755

      +

    diff --git a/src/views/home/index.vue b/src/views/home/index.vue index 582645e..2d268f4 100644 --- a/src/views/home/index.vue +++ b/src/views/home/index.vue @@ -13,7 +13,7 @@
    @@ -50,12 +50,15 @@ ¥{{ value.price }} /小时 -
    +
    内存:{{ value.memory }}GB
    显存:{{ value.vram }}GB
    GPU:{{ value.gpu_num }}个
    +
    + 立即购买 +
    @@ -69,7 +72,7 @@
    -
    +
    {{ item.title }}
    {{ item.description }}
    @@ -116,7 +119,7 @@