mirror of https://github.com/halo-dev/halo-admin
![]() #### What type of PR is this? /kind improvement /milestone 2.0 #### What this PR does / why we need it: 优化 Avatar 组件在图片加载失败的状态,以及添加加载状态的动画。目前的策略为,如果图片加载异常,那么会取 `alt` 属性生成占位样式。如果没有设置 `alt`,会显示失败的图标。 #### Screenshots: <img width="421" alt="image" src="https://user-images.githubusercontent.com/21301288/196194978-229cf58d-19e1-4492-b77a-8b1a6b41e3a0.png"> #### Special notes for your reviewer: /cc @halo-dev/sig-halo-console 测试方式: 1. 需要 `pnpm build:packages` 2. 测试修改个人资料的头像,观测不同效果。 3. 访问 https://halo-admin-ui-git-fork-ruibaby-perf-avatar-fallback-halo-dev.vercel.app/story/src-components-avatar-avatar-story-vue?variantId=_default 测试不同参数的效果。 #### Does this PR introduce a user-facing change? ```release-note 优化 Avatar 组件在图片加载失败的状态 ``` |
||
---|---|---|
.changeset | ||
.github | ||
.husky | ||
.vscode | ||
cypress | ||
packages | ||
public | ||
src | ||
.dockerignore | ||
.editorconfig | ||
.env.development | ||
.env.production | ||
.eslintrc.cjs | ||
.gitignore | ||
.gitpod.yml | ||
.npmignore | ||
.npmrc | ||
Dockerfile | ||
LICENSE | ||
Makefile | ||
OWNERS | ||
README.md | ||
cypress.json | ||
env.d.ts | ||
index.html | ||
package.json | ||
pnpm-lock.yaml | ||
pnpm-workspace.yaml | ||
postcss.config.js | ||
prettier.config.js | ||
tailwind.config.js | ||
tsconfig.app.json | ||
tsconfig.json | ||
tsconfig.vite-config.json | ||
tsconfig.vitest.json | ||
vite.config.ts | ||
vitest.config.ts |
README.md
README
Halo 2.0 的管理端项目(原 halo-admin)
注意
当前分支为 Halo 2.0 的 Console 端开发分支,目前 Halo 2.0 处于 Alpha 测试阶段,不建议从 1.5 直接升级,也不建议在生产环境使用。Console 端稳定版本(Halo 1.5)请查阅以下地址:
- 1.5 分支:https://github.com/halo-dev/console/tree/release-1.5
- 1.6 分支:https://github.com/halo-dev/console/tree/release-1.6
当前仓库已经将
halo-admin
改为了console
。但对于 Halo 1.x 版本,依旧保持 halo-admin 的概念。
开发环境运行
# pnpm@7.0.0+
npm install -g pnpm
pnpm install
pnpm build:packages
pnpm dev
生产构建
pnpm build