[AI Generated]: feat(Views): 新增连接WiFi页五态状态机及跳转完善个人信息

miniprogram/pages/connectedWifi/connectedWifi.wxml

@@ -1,91 +1,111 @@
 <view class="connected-wifi">
 
-	<!-- 顶部装饰:configuring 显示三层同心圆动画;其余状态显示静态占位图 -->
-	<block wx:if="{{ status === 'configuring' }}">
-		<view class="ripple"></view>
-	</block>
-	<block wx:else>
-		<view class="hero"></view>
-	</block>
+	<!-- 密码输入态:整页覆盖,独立布局 -->
+	<block wx:if="{{ status === 'password' }}">
+		<view class="password-page">
+			<view class="password-title">输入WiFi密码</view>
 
-	<!-- 主标题:随状态切换 -->
-	<view class="title">
-		{{
-			status === 'idle' ? '为设备配置 WiFi' :
-			status === 'configuring' ? '正在配网中...' :
-			status === 'success' ? '配网成功' : '配网失败'
-		}}
-	</view>
-
-	<!-- 副标题:随状态切换 -->
-	<view class="sub-title">
-		{{
-			status === 'idle' ? '请输入 2.4G WiFi 名称和密码,确保设备处于配网状态' :
-			status === 'configuring' ? '请保持设备与手机靠近,正在传输配网信息' :
-			status === 'success' ? '设备已成功连入 WiFi 网络,可正常使用' : '请检查 WiFi 密码或设备状态后重试'
-		}}
-	</view>
-
-	<!-- 配网表单:idle / configuring / failed 时显示 -->
-	<block wx:if="{{ status !== 'success' }}">
-		<view class="wifi-form">
-
-			<!-- WiFi 名称行 -->
-			<view class="form-row">
-				<text class="form-label">WiFi 名称</text>
-				<input
-					class="form-input"
-					type="text"
-					placeholder="请输入 WiFi 名称"
-					placeholder-class="form-placeholder"
-					value="{{ form.ssid }}"
-					disabled="{{ status === 'configuring' }}"
-					bindinput="onInputSsid"
-				/>
+			<!-- 已选 WiFi 行 -->
+			<view class="password-ssid">
+				<view class="password-ssid-icon"></view>
+				<text class="password-ssid-name">{{ selectedWifi.name }}</text>
+				<view class="password-ssid-close" bind:tap="onCancelPwd"></view>
 			</view>
 
-			<!-- WiFi 密码行 -->
-			<view class="form-row">
-				<text class="form-label">WiFi 密码</text>
+			<!-- 密码输入行 -->
+			<view class="password-input-row">
+				<text class="password-label">密码</text>
 				<input
-					class="form-input"
+					class="password-input"
 					password="{{ !form.showPwd }}"
-					placeholder="请输入 WiFi 密码"
-					placeholder-class="form-placeholder"
+					placeholder="输入您的wifi密码"
+					placeholder-class="password-placeholder"
 					value="{{ form.password }}"
-					disabled="{{ status === 'configuring' }}"
 					bindinput="onInputPwd"
 				/>
-				<view class="form-eye" bind:tap="onTogglePwd">
-					{{ form.showPwd ? '隐藏' : '显示' }}
+				<view class="password-eye" bind:tap="onTogglePwd"></view>
+			</view>
+
+			<!-- 取消 / 连接 双按钮 -->
+			<view class="password-actions">
+				<view class="btn-ghost" bind:tap="onCancelPwd">取消</view>
+				<view class="btn-primary" bind:tap="onConfirmPwd">连接</view>
+			</view>
+		</view>
+	</block>
+
+	<!-- 列表 / 空态:共用顶部设备卡 + 标题行 -->
+	<block wx:if="{{ status === 'list' || status === 'empty' }}">
+
+		<!-- 顶部设备卡:始终显示"已连接" -->
+		<view class="device-card">
+			<view class="card-icon"></view>
+			<view class="card-info">
+				<view class="card-name">{{ currentDevice.name }}</view>
+				<view class="card-status">
+					<view class="card-dot"></view>
+					<text class="card-status-text">已连接</text>
 				</view>
 			</view>
 		</view>
-	</block>
 
-	<!-- 成功结果区:仅 success 显示 -->
-	<block wx:if="{{ status === 'success' }}">
-		<view class="result-success">
-			<view class="result-icon-success"></view>
-			<view class="result-text">设备已成功连接到 {{ form.ssid || '当前 WiFi' }}</view>
+		<!-- 附近WiFi 标题行 + 右侧「刷新」 -->
+		<view class="wifi-header">
+			<text class="wifi-title">附近WiFi</text>
+			<view class="wifi-refresh" bind:tap="onRefresh">
+				<view class="wifi-refresh-icon"></view>
+				<text class="wifi-refresh-text">刷新</text>
+			</view>
+		</view>
+
+		<!-- 副标题 -->
+		<view class="wifi-subtitle">
+			<text class="wifi-subtitle-text">网络列表(</text>
+			<text class="wifi-subtitle-tip">请选择一个网络进行连接</text>
+			<text class="wifi-subtitle-text">)</text>
+		</view>
+
+		<!-- 列表态 -->
+		<block wx:if="{{ status === 'list' }}">
+			<view class="wifi-list">
+				<block wx:for="{{ wifiList }}" wx:key="id">
+					<!-- 已连接项:蓝色文字 + 右侧已连接勾 -->
+					<block wx:if="{{ item.connected }}">
+						<view class="wifi-item wifi-item-connected" data-id="{{ item.id }}" bind:tap="onTapWifi">
+							<view class="wifi-item-icon-connected"></view>
+							<text class="wifi-item-name-connected">{{ item.name }}</text>
+							<view class="wifi-item-tag">
+								<text class="wifi-item-tag-text">已连接</text>
+								<view class="wifi-item-tag-check"></view>
+							</view>
+						</view>
+					</block>
+					<!-- 普通项:灰底圆形图标 + 右箭头 -->
+					<block wx:else>
+						<view class="wifi-item" data-id="{{ item.id }}" bind:tap="onTapWifi">
+							<view class="wifi-item-icon"></view>
+							<text class="wifi-item-name">{{ item.name }}</text>
+							<view class="wifi-item-arrow"></view>
+						</view>
+					</block>
+				</block>
+			</view>
+		</block>
+
+		<!-- 空态 -->
+		<block wx:if="{{ status === 'empty' }}">
+			<view class="empty">
+				<view class="empty-image"></view>
+				<view class="empty-text">未查找到可用wifi,请重试</view>
+			</view>
+		</block>
+
+		<!-- 底部「确认」按钮:必须连接成功一个 WiFi 后才可点击 -->
+		<view
+			class="confirm-btn {{ hasConnected ? '' : 'confirm-btn-disabled' }}"
+			bind:tap="onConfirm"
+		>
+			确认
 		</view>
 	</block>
-
-	<!-- 主按钮:文案与可用状态随 status 切换 -->
-	<view
-		class="submit-btn {{ status === 'configuring' ? 'submit-btn-disabled' : '' }}"
-		bind:tap="onSubmit"
-	>
-		{{
-			status === 'idle' ? '开始配网' :
-			status === 'configuring' ? '配网中...' :
-			status === 'success' ? '完成' : '重新配网'
-		}}
-	</view>
-
-	<!-- 帮助文案 -->
-	<view class="help">
-		<text class="help-text">设备无法连接 WiFi?</text>
-		<text class="help-link" bind:tap="onOpenHelp">查看帮助</text>
-	</view>
 </view>