📷 设置群头像群名称 * {{groupName.length}}/{{maxGroupNameLength}} 群描述

<view class="input-counter">
          <text class="counter-text">{{groupDescription.length}}/{{maxDescriptionLength}}</text>
        </view>
      </view>
    </view>

<view class="member-selection-section">
      <view class="section-header">
        <text class="section-title">选择成员</text>
        <text class="member-count">已选择 {{selectedMembers.length}} 人</text>
      </view>
      
      
      <view class="search-container">
        <view class="search-input-wrapper">
          <text class="search-icon">🔍</text>
          <input class="search-input"
                 placeholder="搜索好友"
                 value="{{searchKeyword}}"
                 bindinput="onSearchInput" />
          <view wx:if="{{searchKeyword}}" 
                class="clear-search" 
                bindtap="clearSearch">
            <text class="clear-icon">✕</text>
          </view>
        </view>
      </view>
      
      
      <view class="selected-members" wx:if="{{selectedMembers.length > 0}}">
        <view class="selected-member-item"
              wx:for="{{selectedMembers}}"
              wx:key="userId"
              bindtap="removeMember"
              data-user-id="{{item.userId}}">
          <image class="selected-avatar" 
                 src="{{item.avatar || '/images/default-avatar.svg'}}" 
                 mode="aspectFill" />
          <text class="selected-name">{{item.nickname || item.username}}</text>
          <view class="remove-btn">
            <text class="remove-icon">✕</text>
          </view>
        </view>
      </view>
      
      
      <view class="friends-list">
        <view class="friend-item {{item.selected ? 'selected' : ''}}"
              wx:for="{{filteredFriends}}"
              wx:key="userId"
              bindtap="toggleMember"
              data-user-id="{{item.userId}}">
          <view class="friend-avatar-container">
            <image class="friend-avatar" 
                   src="{{item.avatar || '/images/default-avatar.svg'}}" 
                   mode="aspectFill" />
            <view class="selection-indicator {{item.selected ? 'selected' : ''}}">
              <text class="indicator-icon">{{item.selected ? '✓' : ''}}</text>
            </view>
          </view>
          
          <view class="friend-info">
            <text class="friend-name">{{item.nickname || item.username}}</text>
            <text class="friend-status">{{item.status || ''}}</text>
          </view>
        </view>
        
        
        <view class="empty-state" wx:if="{{filteredFriends.length === 0}}">
          <text class="empty-icon">👥</text>
          <text class="empty-text">{{searchKeyword ? '没有找到相关好友' : '暂无好友'}}</text>
        </view>
      </view>
    </view>

<view class="group-settings-section">
      <view class="section-title">
        <text class="title-text">群设置</text>
      </view>
      
      <view class="setting-items">
        
        <view class="setting-item">
          <view class="item-info">
            <text class="item-title">允许成员邀请好友</text>
            <text class="item-desc">群成员可以邀请其他人加入群聊</text>
          </view>
          <switch class="setting-switch"
                  checked="{{allowMemberInvite}}"
                  bindchange="onAllowInviteChange" />
        </view>
        
        
        <view class="setting-item">
          <view class="item-info">
            <text class="item-title">保存到通讯录</text>
            <text class="item-desc">将群聊保存到通讯录中</text>
          </view>
          <switch class="setting-switch"
                  checked="{{saveToContacts}}"
                  bindchange="onSaveContactsChange" />
        </view>
        
        
        <view class="setting-item">
          <view class="item-info">
            <text class="item-title">显示群二维码</text>
            <text class="item-desc">允许通过二维码加入群聊</text>
          </view>
          <switch class="setting-switch"
                  checked="{{showQRCode}}"
                  bindchange="onShowQRCodeChange" />
        </view>
      </view>
    </view>
  </scroll-view>
</view>

<view class="loading-overlay" wx:if="{{isCreating}}">
  <view class="loading-content">
    <view class="loading-spinner"></view>
    <text class="loading-text">正在创建群聊...</text>
  </view>
</view>