地址路径修改

miniprogram/components/avatar/avatar.wxss

@@ -0,0 +1,204 @@
+/* 头像组件样式 */
+.avatar-container {
+  position: relative;
+  display: inline-block;
+}
+
+/* 头像显示区域 */
+.avatar-display {
+  position: relative;
+  border-radius: 50%;
+  overflow: hidden;
+  background-color: #f0f0f0;
+  border: 2px solid #e0e0e0;
+  cursor: pointer;
+  transition: all 0.3s ease;
+}
+
+.avatar-display:active {
+  transform: scale(0.95);
+  opacity: 0.8;
+}
+
+/* 头像图片容器 */
+.avatar-image-wrapper {
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+  overflow: hidden;
+}
+
+/* 头像图片 */
+.avatar-image {
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+}
+
+/* 头像占位符 */
+.avatar-placeholder {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  color: white;
+  border-radius: 50%;
+}
+
+.avatar-text {
+  font-weight: bold;
+  text-transform: uppercase;
+}
+
+/* 编辑图标 */
+.avatar-edit-icon {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.7);
+  border-radius: 50%;
+  width: 24rpx;
+  height: 24rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transform: translate(25%, 25%);
+}
+
+.edit-icon {
+  font-size: 12rpx;
+  color: white;
+}
+
+/* 头像选择弹窗 */
+.avatar-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 9999;
+}
+
+.modal-mask {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+}
+
+.modal-content {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  background: white;
+  border-radius: 20rpx 20rpx 0 0;
+  padding: 40rpx;
+  box-sizing: border-box;
+  animation: slideUp 0.3s ease;
+}
+
+@keyframes slideUp {
+  from {
+    transform: translateY(100%);
+  }
+  to {
+    transform: translateY(0);
+  }
+}
+
+.modal-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 40rpx;
+}
+
+.modal-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+}
+
+.modal-close {
+  font-size: 40rpx;
+  color: #999;
+  padding: 10rpx;
+}
+
+/* 头像选项 */
+.avatar-options {
+  display: flex;
+  flex-direction: column;
+  gap: 30rpx;
+}
+
+.avatar-option {
+  display: flex;
+  align-items: center;
+  padding: 30rpx;
+  background: #f8f9fa;
+  border-radius: 15rpx;
+  transition: all 0.3s ease;
+}
+
+.avatar-option:active {
+  background: #e9ecef;
+  transform: scale(0.98);
+}
+
+.option-icon {
+  font-size: 40rpx;
+  margin-right: 20rpx;
+}
+
+.option-text {
+  font-size: 28rpx;
+  color: #333;
+}
+
+/* 不同尺寸的头像样式 */
+.avatar-small {
+  width: 80rpx;
+  height: 80rpx;
+}
+
+.avatar-medium {
+  width: 120rpx;
+  height: 120rpx;
+}
+
+.avatar-large {
+  width: 160rpx;
+  height: 160rpx;
+}
+
+.avatar-xlarge {
+  width: 200rpx;
+  height: 200rpx;
+}
+
+/* 圆形头像样式 */
+.avatar-circle {
+  border-radius: 50%;
+}
+
+/* 方形头像样式 */
+.avatar-square {
+  border-radius: 15rpx;
+}
+
+/* 带边框的头像 */
+.avatar-bordered {
+  border: 3rpx solid #667eea;
+}
+
+/* 阴影效果 */
+.avatar-shadow {
+  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.15);
+}