feat(userManagement): 用户管理新增空态与同步进度弹框组件
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
17792275749
co-authored by
Claude Opus 4.7
Claude Opus 4.7
parent
9040fc4fba
commit
3e0d260fdc
@@ -1,63 +1,71 @@
|
||||
<view class="userManagement">
|
||||
<!-- 设备卡片 -->
|
||||
<view class="device-card">
|
||||
<view class="device-icon"></view>
|
||||
<view class="device-info">
|
||||
<view class="device-name-row">
|
||||
<view class="device-name">{{ device.name }}</view>
|
||||
<view class="device-status">
|
||||
<view class="status-dot"></view>
|
||||
<view class="status-text">{{ device.connected ? '已连接' : '未连接' }}</view>
|
||||
<view class="userManagement">
|
||||
<!-- 顶部固定区 -->
|
||||
<view class="header">
|
||||
<!-- 设备卡片 -->
|
||||
<view class="device-card">
|
||||
<view class="device-icon"></view>
|
||||
<view class="device-info">
|
||||
<view class="device-name-row">
|
||||
<view class="device-name">{{ device.name }}</view>
|
||||
<view class="device-status">
|
||||
<view class="status-dot"></view>
|
||||
<view class="status-text">{{ device.connected ? '已连接' : '未连接' }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="device-meta">型号：{{ device.model }}</view>
|
||||
<view class="device-meta">设备编号：{{ device.serial }}</view>
|
||||
</view>
|
||||
<view class="device-meta" style="margin-bottom: 20rpx;">型号：{{ device.model }}</view>
|
||||
<view class="device-meta">设备编号：{{ device.serial }}</view>
|
||||
</view>
|
||||
|
||||
<!-- 已录入用户 + 同步按钮 -->
|
||||
<view class="section-header">
|
||||
<view class="section-title">已录入用户（{{ memberCount }}/10）</view>
|
||||
<view class="sync-btn" bind:tap="onTapSync">同步用户至设备</view>
|
||||
</view>
|
||||
|
||||
<!-- 同步提示 -->
|
||||
<view class="sync-tip">当前用户信息未同步至设备，请在连接设备的状态下，点击同步按钮完成信息同步</view>
|
||||
</view>
|
||||
|
||||
<!-- 用户列表滚动区 -->
|
||||
<view class="body">
|
||||
<scroll-view scroll-y class="scrollView" wx:if="{{ members.length }}">
|
||||
<view class="scrollViewContent">
|
||||
<block wx:for="{{ members }}" wx:key="id">
|
||||
<view class="member-card">
|
||||
<view class="member-avatar {{ item.gender === '女' ? 'member-avatar--female' : 'member-avatar--male' }}"></view>
|
||||
<view class="member-info">
|
||||
<view class="member-name-row">
|
||||
<view class="member-name">{{ item.name }}</view>
|
||||
<view class="member-type-tag member-type-tag--{{ item.typeClass }}">{{ item.type }}</view>
|
||||
</view>
|
||||
<view class="member-sub">{{ item.gender }}·{{ item.age }}岁 丨 {{ item.height }}cm</view>
|
||||
</view>
|
||||
<view class="member-right">
|
||||
<view class="member-sync member-sync--{{ item.syncClass }}">{{ item.sync }}</view>
|
||||
<view class="member-ops">
|
||||
<view class="op-edit">编辑</view>
|
||||
<view class="op-delete">删除</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="empty-state" wx:else>
|
||||
<image class="empty-img" src="/images/emptyData.png" mode="aspectFit" />
|
||||
<view class="empty-text">暂无用户\n请添加用户以使用设备测量</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 已录入用户 + 同步按钮 -->
|
||||
<view class="section-header">
|
||||
<view class="section-title">已录入用户（{{ memberCount }}/10）</view>
|
||||
<view class="sync-btn" bind:tap="onTapSync">同步用户至设备</view>
|
||||
|
||||
<!-- 底部常驻添加用户按钮 -->
|
||||
<view class="footer">
|
||||
<view class="btn-primary" bind:tap="onTapAddUser">添加用户（最多10位）</view>
|
||||
<!-- <view class="btn-primary" bind:tap="onTapAddSelf">一键添加本人</view>-->
|
||||
<!-- <view class="btn-cancel" bind:tap="onTapAddNew">添加新用户</view>-->
|
||||
</view>
|
||||
|
||||
<!-- 同步提示 -->
|
||||
<view class="sync-tip">当前用户信息未同步至设备，请在连接设备的状态下，点击同步按钮完成信息同步</view>
|
||||
|
||||
<!-- 用户列表 -->
|
||||
<block wx:for="{{ members }}" wx:key="id">
|
||||
<view class="member-card">
|
||||
<view class="member-avatar {{ item.gender === '女' ? 'member-avatar--female' : 'member-avatar--male' }}"></view>
|
||||
<view class="member-info">
|
||||
<view class="member-name-row">
|
||||
<view class="member-name">{{ item.name }}</view>
|
||||
<view class="member-type-tag member-type-tag--{{ item.typeClass }}">{{ item.type }}</view>
|
||||
</view>
|
||||
<view class="member-sub">{{ item.gender }}·{{ item.age }}岁 丨 {{ item.height }}cm</view>
|
||||
</view>
|
||||
<view class="member-right">
|
||||
<view class="member-sync member-sync--{{ item.syncClass }}">{{ item.sync }}</view>
|
||||
<view class="member-ops">
|
||||
<view class="op-edit">编辑</view>
|
||||
<view class="op-delete">删除</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!-- 底部添加用户按钮 -->
|
||||
<view class="add-btn" bind:tap="onTapAddUser">添加用户（最多10位）</view>
|
||||
|
||||
<!-- 同步进度弹框 -->
|
||||
<block wx:if="{{ syncShow }}">
|
||||
<view class="sync-mask"></view>
|
||||
<view class="sync-panel">
|
||||
<view class="sync-title">同步成员至设备</view>
|
||||
<view class="sync-status">{{ syncStatus }}</view>
|
||||
<view class="sync-percent">{{ syncPercent }}%</view>
|
||||
<view class="sync-progress">
|
||||
<view class="sync-progress-inner" style="width: {{ syncPercent }}%;"></view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<user-management-sync show="{{ syncShow }}" percent="{{ syncPercent }}" status="{{ syncStatus }}" />
|
||||
</view>
|
||||
|
||||
Reference in New Issue
Block a user