huangyicao/banban
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: support assigning child to existing device

Browse Source
This commit is contained in:
stu2not
2026-06-02 14:40:30 +08:00
parent cd32d4e64c
commit 57bafb003d
3 changed files with 137 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
banban-mini/src/pages/bind/index.scss
+35
View File
@@ -68,6 +68,41 @@
position: relative;
}
.pending-device-card {
margin: 0 48px 48px;
background: #FFFFFF;
border-radius: 24px;
padding: 48px 40px;
display: flex;
flex-direction: column;
align-items: center;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}
.pending-device-title {
font-size: 34px;
font-weight: 700;
color: #1A1A1A;
margin-bottom: 14px;
}
.pending-device-id {
max-width: 100%;
font-size: 28px;
color: #FF8C42;
font-weight: 600;
word-break: break-all;
text-align: center;
margin-bottom: 12px;
}
.pending-device-desc {
font-size: 26px;
color: #666666;
text-align: center;
line-height: 1.5;
}
.scan-frame {
background: #FFFFFF;
border-radius: 24px;
banban-mini/src/pages/bind/index.tsx
+36 -19
View File
@@ -350,26 +350,37 @@ export default function Bind() {
<Text className='title'>{isPendingBinding ? '补全绑定' : '扫码贴卡绑定设备'}</Text>
</View>
<View className='scan-area'>
<View className='scan-frame' onClick={handleScanCode}>
{isPendingBinding ? (
<View className='pending-device-card'>
<View className='icon-bg orange'>
<Image className='control-icon-img' src={require('../../assets/tab-icons/rings.png')} mode='aspectFit' />
</View>
<Text className='scan-text'>
{!canEditDeviceFields ? '请先完成儿童资料' : isScanning ? '正在扫码...' : '点击扫码'}
</Text>
<Text className='scan-hint'>
{!canEditDeviceFields ? '先选儿童，再扫设备二维码' : '扫描设备二维码或条码'}
</Text>
<Text className='pending-device-title'>关联现有设备</Text>
<Text className='pending-device-id'>{pendingDeviceId}</Text>
<Text className='pending-device-desc'>选择已有孩子，或新建孩子后完成关联</Text>
</View>
) : (
<View className='scan-area'>
<View className='scan-frame' onClick={handleScanCode}>
<View className='icon-bg orange'>
<Image className='control-icon-img' src={require('../../assets/tab-icons/rings.png')} mode='aspectFit' />
</View>
<Text className='scan-text'>
{!canEditDeviceFields ? '请先完成儿童资料' : isScanning ? '正在扫码...' : '点击扫码'}
</Text>
<Text className='scan-hint'>
{!canEditDeviceFields ? '先选儿童，再扫设备二维码' : '扫描设备二维码或条码'}
</Text>
</View>
<View className='scan-corners'>
<View className='corner top-left'></View>
<View className='corner top-right'></View>
<View className='corner bottom-left'></View>
<View className='corner bottom-right'></View>
<View className='scan-corners'>
<View className='corner top-left'></View>
<View className='corner top-right'></View>
<View className='corner bottom-left'></View>
<View className='corner bottom-right'></View>
</View>
</View>
</View>
)}
<View className='bind-form'>
<View className='form-card'>
@@ -413,12 +424,17 @@ export default function Bind() {
</View>
<Text className='field-hint'>
{children.length > 0
? '可以选已有儿童，也可以在这里新建一个儿童后再绑定设备'
: '当前还没有儿童资料，请先创建一个儿童资料'}
{isPendingBinding
? children.length > 0
? '可以选已有儿童，也可以新建一个儿童后关联当前设备'
: '当前还没有儿童资料，请先创建一个儿童资料后关联设备'
: children.length > 0
? '可以选已有儿童，也可以在这里新建一个儿童后再绑定设备'
: '当前还没有儿童资料，请先创建一个儿童资料'}
</Text>
</View>
{!isPendingBinding && (
<View className='form-card'>
<Text className='form-title'>设备信息</Text>
@@ -457,6 +473,7 @@ export default function Bind() {
</View>
)}
</View>
)}
<Button
className='submit-btn'
@@ -476,11 +493,11 @@ export default function Bind() {
</View>
<View className='tip-item'>
<Text className='tip-number'>2</Text>
<Text className='tip-text'>扫描设备二维码，确认设备号和序列号正确</Text>
<Text className='tip-text'>{isPendingBinding ? '确认当前待关联设备，再选择要关联的孩子' : '扫描设备二维码，确认设备号和序列号正确'}</Text>
</View>
<View className='tip-item'>
<Text className='tip-number'>3</Text>
<Text className='tip-text'>点击发送绑卡指令，然后去设备上贴自己的卡完成确认</Text>
<Text className='tip-text'>{isPendingBinding ? '点击完成儿童关联，设备会出现在该孩子下面' : '点击发送绑卡指令，然后去设备上贴自己的卡完成确认'}</Text>
</View>
</View>
{systemBanner}