Claw 项目完整结构提交

Claw/client/wechat_app/components/user-avatar/user-avatar.js

@@ -0,0 +1,117 @@
+// 用户头像组件逻辑
+const { DEFAULT_AVATAR } = require('../../utils/constant.js')
+
+Component({
+  properties: {
+    // 头像图片地址
+    src: {
+      type: String,
+      value: ''
+    },
+    // 默认头像
+    defaultAvatar: {
+      type: String,
+      value: DEFAULT_AVATAR
+    },
+    // 尺寸：small, medium, large, xlarge
+    size: {
+      type: String,
+      value: 'medium'
+    },
+    // 形状：circle, rounded, square
+    shape: {
+      type: String,
+      value: 'circle'
+    },
+    // 图片裁剪模式
+    mode: {
+      type: String,
+      value: 'aspectFill'
+    },
+    // 是否懒加载
+    lazyLoad: {
+      type: Boolean,
+      value: true
+    },
+    // 是否显示在线状态
+    showStatus: {
+      type: Boolean,
+      value: false
+    },
+    // 在线状态：online, offline, busy, away
+    status: {
+      type: String,
+      value: 'offline'
+    },
+    // 徽章数量
+    badge: {
+      type: Number,
+      value: 0
+    },
+    // 是否显示加载状态
+    loading: {
+      type: Boolean,
+      value: false
+    },
+    // 自定义样式
+    customStyle: {
+      type: String,
+      value: ''
+    }
+  },
+
+  data: {
+    imageLoaded: false,
+    imageError: false
+  },
+
+  methods: {
+    // 图片加载成功
+    onImageLoad() {
+      this.setData({
+        imageLoaded: true,
+        imageError: false
+      })
+      this.triggerEvent('load')
+    },
+
+    // 图片加载失败
+    onImageError(e) {
+      console.error('头像加载失败:', e)
+      this.setData({
+        imageLoaded: false,
+        imageError: true
+      })
+      this.triggerEvent('error', e)
+    },
+
+    // 点击头像
+    onAvatarTap() {
+      this.triggerEvent('tap', {
+        src: this.properties.src,
+        status: this.properties.status,
+        badge: this.properties.badge
+      })
+    },
+
+    // 长按头像
+    onAvatarLongPress() {
+      this.triggerEvent('longpress', {
+        src: this.properties.src,
+        status: this.properties.status,
+        badge: this.properties.badge
+      })
+    },
+
+    // 获取头像状态文本
+    getStatusText() {
+      const statusMap = {
+        online: '在线',
+        offline: '离线',
+        busy: '忙碌',
+        away: '离开'
+      }
+      return statusMap[this.properties.status] || '未知'
+    }
+  }
+})