first commit

components/WifiCard.vue

@@ -0,0 +1,47 @@
+<template>
+	<view class="card wifi-card">
+		<view class="card-header flex-row-sb">
+			<view class="title">WiFi配置</view>
+			<view class="btn-group">
+				<button class="btn-apple btn-primary btn-mini" @tap="$emit('modify')">修改</button>
+			</view>
+		</view>
+		<view class="wifi-info flex-col-g16 mt-30">
+			<view class="wifi-item flex-row-sb">
+				<view class="wifi-details flex-col-g8">
+					<view class="caption">网络名称</view>
+					<view class="subtitle">{{ deviceInfo.ssidName }}</view>
+				</view>
+				<button class="btn-apple btn-primary btn-mini" @tap="$emit('copy', deviceInfo.ssidName)">复制</button>
+			</view>
+			<view class="wifi-item flex-row-sb">
+				<view class="wifi-details flex-col-g8">
+					<view class="caption">连接密码</view>
+					<view class="subtitle">{{ deviceInfo.ssidPwd }}</view>
+				</view>
+				<button class="btn-apple btn-primary btn-mini" @tap="$emit('copy', deviceInfo.ssidPwd)">复制</button>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	defineProps({
+		deviceInfo: { type: Object, default: () => ({}) }
+	});
+
+	defineEmits(['modify', 'copy']);
+</script>
+
+<style scoped lang="scss">
+	.wifi-card {
+		.wifi-item {
+			padding: var(--space-md);
+			background: var(--gray-100);
+			border-radius: var(--radius-medium);
+			margin-bottom: var(--space-sm);
+			&:last-child { margin-bottom: 0; }
+			.wifi-details { flex: 1; }
+		}
+	}
+</style>