Add loading state to volunteer-headshot component

# Problem

The `volunteer-headshot` should have some loading states for async data.

## Subtasks
- [ ] Add a light gray background for the image as a placeholder, until loaded (keeping in mind that a user may have a transparent PNG, so the background shouldn't remain gray)
- [ ] Add a light gray rectangular area for the user's name as a placeholder, until loaded
- [ ] Add a light gray rectangular area for the user's role as a placeholder, until loaded

找到 `volunteer-headshot` 组件，并检查异步数据等待期间其图像、姓名和角色的渲染方式。为这三个区域都添加加载占位符，确保透明 PNG 加载后图像背景不会仍然是灰色；当每个占位符都被已加载的内容替换时即可完成。

由索引模型根据 Issue 内容生成。