52 lines
1.7 KiB
Plaintext
52 lines
1.7 KiB
Plaintext
<!-- 头像组件 -->
|
||
<view class="avatar-container">
|
||
<!-- 头像显示区域 -->
|
||
<view class="avatar-display" bindtap="onAvatarTap">
|
||
<view wx:if="{{avatarUrl}}" class="avatar-image-wrapper">
|
||
<image
|
||
class="avatar-image"
|
||
src="{{avatarUrl}}"
|
||
mode="aspectFill"
|
||
style="width: {{size}}rpx; height: {{size}}rpx;"
|
||
></image>
|
||
</view>
|
||
<view wx:else class="avatar-placeholder">
|
||
<text class="avatar-text" style="font-size: {{textSize}}rpx;">{{placeholderText}}</text>
|
||
</view>
|
||
<!-- 编辑图标 -->
|
||
<view wx:if="{{editable}}" class="avatar-edit-icon">
|
||
<text class="edit-icon">✏️</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 头像选择弹窗 -->
|
||
<view wx:if="{{showAvatarModal}}" class="avatar-modal">
|
||
<view class="modal-mask" bindtap="hideAvatarModal"></view>
|
||
<view class="modal-content">
|
||
<view class="modal-header">
|
||
<text class="modal-title">选择头像</text>
|
||
<text class="modal-close" bindtap="hideAvatarModal">×</text>
|
||
</view>
|
||
|
||
<view class="avatar-options">
|
||
<!-- 拍照 -->
|
||
<view class="avatar-option" bindtap="takePhoto">
|
||
<text class="option-icon">📷</text>
|
||
<text class="option-text">拍照</text>
|
||
</view>
|
||
|
||
<!-- 从相册选择 -->
|
||
<view class="avatar-option" bindtap="chooseImage">
|
||
<text class="option-icon">🖼️</text>
|
||
<text class="option-text">从相册选择</text>
|
||
</view>
|
||
|
||
<!-- 默认头像 -->
|
||
<view class="avatar-option" bindtap="useDefaultAvatar">
|
||
<text class="option-icon">👤</text>
|
||
<text class="option-text">使用默认头像</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view> |