52 lines
1.4 KiB
Vue
52 lines
1.4 KiB
Vue
<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; }
|
|
}
|
|
}
|
|
|
|
.btn-group{
|
|
padding-right: var(--space-md);
|
|
}
|
|
</style>
|