liyi/wx-starlock
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wifi配网部分功能

Browse Source
This commit is contained in:
范鹏 2025-03-28 16:57:35 +08:00
parent 985d359789
commit 255ff7f0b0
9 changed files with 291 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.stylelintrc.json
View File

@ -29,6 +29,7 @@
"selector-class-pattern": null,
"keyframes-name-pattern": null,
"unit-no-unknown": null,
"import-notation": null,
"selector-type-no-unknown": [
true,
{

19
pages.json
View File

@ -8,6 +8,18 @@
}
},
"subPackages": [
{
"root": "pages/addDeviceForWiFi",
"pages": [
{
"path": "distributionNetwork",
"style": {
"navigationBarTitleText": "WiFi配网",
"disableScroll": true
}
}
]
},
{
"root": "pages/addDeviceForBluetooth",
"pages": [
@ -103,6 +115,13 @@
"navigationBarTitleText": "有效期",
"disableScroll": true
}
},
{
"path": "selectDeviceType",
"style": {
"navigationBarTitleText": "选择设备类型",
"disableScroll": true
}
}
]
},

69
pages/addDeviceForBluetooth/addLockGuid.vue
View File

@ -11,43 +11,46 @@
</view>
</template>
<script>
import { mapActions, mapState } from 'pinia'
<script setup>
import { useBluetoothStore } from '@/stores/bluetooth'
import { useBasicStore } from '@/stores/basic'
import { onLoad } from '@dcloudio/uni-app'
import { ref } from 'vue'
export default {
data() {
return {}
},
computed: {
...mapState(useBluetoothStore, ['bluetoothStatus', 'isInitBluetooth'])
},
methods: {
...mapActions(useBluetoothStore, [
'getBluetoothStatus',
'initAndListenBluetooth',
'checkSetting'
]),
...mapActions(useBasicStore, ['routeJump']),
async toSearchDevice() {
if (this.bluetoothStatus !== 0) {
this.getBluetoothStatus()
return
}
let result = true
if (!this.isInitBluetooth) {
result = await this.initAndListenBluetooth()
}
if (result) {
this.routeJump({
type: 'redirectTo',
name: 'searchDevice'
})
} else {
this.checkSetting()
}
const bluetoothStore = useBluetoothStore()
const basicStore = useBasicStore()
const type = ref('bluetooth')
onLoad(options => {
if (options.type) {
type.value = options.type
}
})
const toSearchDevice = async () => {
if (bluetoothStore.bluetoothStatus !== 0) {
bluetoothStore.getBluetoothStatus()
return
}
let result = true
if (!bluetoothStore.isInitBluetooth) {
result = await bluetoothStore.initAndListenBluetooth()
}
if (result) {
if (type.value === 'bluetooth') {
basicStore.routeJump({
type: 'redirectTo',
name: 'searchDevice'
})
} else if (type.value === 'wifi') {
basicStore.routeJump({
type: 'redirectTo',
name: 'distributionNetwork'
})
}
} else {
bluetoothStore.checkSetting()
}
}
</script>

28
pages/addDeviceForBluetooth/bindLock.vue
View File

@ -144,7 +144,7 @@
this.getLockList(this.lockSearch)
setTimeout(() => {
uni.hideLoading()
this.backAndToast('添加成功')
this.backAndToast('添加成功', 2)
}, 1000)
} else {
uni.hideLoading()
@ -166,21 +166,21 @@
<style lang="scss" scoped>
.text {
color: #2b2a28;
padding: 100rpx 0;
font-size: 34rpx;
color: #2b2a28;
text-align: center;
}
.input {
border-radius: 16rpx;
background: #ffffff;
margin-left: 35rpx;
margin-top: 24rpx;
height: 108rpx;
width: 616rpx;
padding-left: 32rpx;
height: 108rpx;
padding-right: 32rpx;
padding-left: 32rpx;
margin-top: 24rpx;
margin-left: 35rpx;
background: #ffffff;
border-radius: 16rpx;
}
.input-placeholder {
@ -191,15 +191,15 @@
}
.button {
margin-top: 160rpx;
margin-left: 35rpx;
width: 680rpx;
height: 96rpx;
margin-top: 160rpx;
margin-left: 35rpx;
font-size: 32rpx;
line-height: 96rpx;
color: #ffffff;
text-align: center;
background: #63b8af;
border-radius: 16rpx;
line-height: 96rpx;
text-align: center;
font-size: 32rpx;
color: #ffffff;
}
</style>

150
pages/addDeviceForWiFi/distributionNetwork.vue Normal file
View File

@ -0,0 +1,150 @@
<template>
<view>
<view class="mt-4">
<up-steps :current="current" activeColor="#63b8af" class="custom-steps">
<up-steps-item title="设置WiFi" :itemStyle="{ fontSize: '48rpx' }"> </up-steps-item>
<up-steps-item title="连接设备蓝牙" :itemStyle="{ fontSize: '48rpx' }"></up-steps-item>
<up-steps-item title="开始配网" :itemStyle="{ fontSize: '48rpx' }"></up-steps-item>
</up-steps>
<view class="mt-8 mx-8">
<view v-if="current === 0">
<view class="text-lg font-bold mb-4">请选择WiFi并输入密码</view>
<view class="py-2 border-b border-gray-200">
<picker
v-if="wifiList.length > 0"
mode="selector"
:range="wifiList"
:value="wifiIndex"
@change="changeWifi"
range-key="SSID"
>
<view class="flex items-center">
<view class="mr-4">WiFi</view>
<view>{{ wifiList[wifiIndex].SSID }}</view>
<view class="ml-a">
<up-icon name="arrow-right" size="24rpx"></up-icon>
</view>
</view>
</picker>
</view>
<view class="py-2 border-b border-gray-200">
<view>密码</view>
<view>
<up-input v-model="password" placeholder="请输入密码" type="password" />
</view>
</view>
</view>
</view>
<view
class="fixed bottom-[calc(env(safe-area-inset-bottom)+32rpx)] w-686rpx mx-4 h-88rpx text-center text-white bg-[#63b8af] leading-[88rpx] rounded-44rpx font-bold"
@click="handleNext"
>下一步</view
>
</view>
</view>
</template>
<script setup>
import { onMounted, ref } from 'vue'
import { useBasicStore } from '@/stores/basic'
const $basic = useBasicStore()
const current = ref(0)
const wifiList = ref([])
const wifiIndex = ref(0)
const deviceInfo = $basic.deviceInfo
onMounted(() => {
if (deviceInfo.platform !== 'android' && deviceInfo.platform !== 'ios') {
uni.showToast({
title: '当前设备不支持WiFi功能',
icon: 'none'
})
return
}
uni.authorize({
scope: 'scope.userLocation',
success: () => {
const getWifiListFn = () => {
uni.getWifiList({
success: () => {
uni.onGetWifiList(res => {
const uniqueWifiList = res.wifiList
.filter(wifi => wifi.SSID && wifi.SSID.trim() !== '')
.reduce((acc, current) => {
const exists = acc.find(item => item.SSID === current.SSID)
if (!exists) {
acc.push(current)
}
return acc
}, [])
wifiList.value = uniqueWifiList
console.log('WiFi列表：', wifiList.value)
})
},
fail: err => {
console.error('获取WiFi列表失败：', err)
uni.showToast({
title: '获取WiFi列表失败',
icon: 'none'
})
}
})
}
if (deviceInfo.platform === 'android') {
uni.startWifi({
success: () => {
getWifiListFn()
},
fail: err => {
console.error('初始化WiFi失败：', err)
uni.showToast({
title: '初始化WiFi失败',
icon: 'none'
})
}
})
} else {
getWifiListFn()
}
},
fail: () => {
uni.showModal({
title: '提示',
content: '需要获取位置权限才能使用WiFi功能',
success: res => {
if (res.confirm) {
uni.openSetting()
}
}
})
}
})
})
const changeWifi = e => {
wifiIndex.value = e.detail.value
}
const handleNext = () => {
if (current.value === 0) {
uni.offGetWifiList()
if (deviceInfo.platform === 'android') {
uni.stopWifi()
}
current.value++
}
}
</script>
<style lang="scss" scoped>
.custom-steps {
:deep(.u-text__value) {
font-size: 28rpx !important;
}
}
</style>

2
pages/main/home.vue
View File

@ -531,7 +531,7 @@
},
async toSearchDevice() {
this.routeJump({
name: 'addLockGuid'
name: 'selectDeviceType'
})
},
async toLockDetail(lock) {

39
pages/others/selectDeviceType.vue Normal file
View File

@ -0,0 +1,39 @@
<template>
<view>
<view
class="flex items-center bg-white shadow-sm py-3 px-4 mx-2 rounded-lg mt-4"
@click="toJump('addLockGuid', { type: 'bluetooth' })"
>
<image src="https://oss-lock.xhjcn.ltd/mp/bluetooth-lock.png" class="w-80rpx h-80rpx"></image>
<view class="ml-4">蓝牙锁</view>
<view class="ml-a"><up-icon name="arrow-right"></up-icon></view>
</view>
<view
class="flex items-center bg-white shadow-sm py-3 px-4 mx-2 rounded-lg mt-4"
@click="toJump('addLockGuid', { type: 'wifi' })"
>
<image src="https://oss-lock.xhjcn.ltd/mp/wifi-lock.png" class="w-80rpx h-80rpx"></image>
<view class="ml-4">WiFi锁</view>
<view class="ml-a"><up-icon name="arrow-right"></up-icon></view>
</view>
</view>
</template>
<script setup>
import { useBasicStore } from '@/stores/basic'
const $basic = useBasicStore()
const toJump = (name, params) => {
$basic.routeJump({
name,
params
})
}
</script>
<style lang="scss">
page {
background-color: $uni-bg-color-grey;
}
</style>

10
stores/basic.js
View File

@ -381,6 +381,16 @@ const pages = [
name: 'passageMode',
path: '/pages/settingForBluetooth/passageMode',
tabBar: false
},
{
name: 'selectDeviceType',
path: '/pages/others/selectDeviceType',
tabBar: false
},
{
name: 'distributionNetwork',
path: '/pages/addDeviceForWiFi/distributionNetwork',
tabBar: false
}
]

42
uni.scss
View File

@ -1,5 +1,5 @@
/* uni.scss */
@import 'uview-plus/theme.scss';
@import 'uview-plus/theme';
/**
* 这里是uni-app内置的常用样式变量
@ -24,32 +24,32 @@ $uni-color-warning: #f0ad4e;
$uni-color-error: #dd524d;
/* 文字基本颜色 */
$uni-text-color:#333;//基本色
$uni-text-color-inverse:#fff;//反色
$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息
$uni-text-color: #333; //基本色
$uni-text-color-inverse: #fff; //反色
$uni-text-color-grey: #999; //辅助灰色，如加载更多的提示信息
$uni-text-color-placeholder: #808080;
$uni-text-color-disable:#c0c0c0;
$uni-text-color-disable: #c0c0c0;
/* 背景颜色 */
$uni-bg-color:#ffffff;
$uni-bg-color-grey:#f3f3f3;
$uni-bg-color-hover:#f1f1f1;//点击状态颜色
$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色
$uni-bg-color: #ffffff;
$uni-bg-color-grey: #f3f3f3;
$uni-bg-color-hover: #f1f1f1; //点击状态颜色
$uni-bg-color-mask: rgba(0, 0, 0, 0.4); //遮罩颜色
/* 边框颜色 */
$uni-border-color:#c8c7cc;
$uni-border-color: #c8c7cc;
/* 尺寸变量 */
/* 文字尺寸 */
$uni-font-size-sm:12px;
$uni-font-size-base:14px;
$uni-font-size-lg:16px;
$uni-font-size-sm: 12px;
$uni-font-size-base: 14px;
$uni-font-size-lg: 16px;
/* 图片尺寸 */
$uni-img-size-sm:20px;
$uni-img-size-base:26px;
$uni-img-size-lg:40px;
$uni-img-size-sm: 20px;
$uni-img-size-base: 26px;
$uni-img-size-lg: 40px;
/* Border Radius */
$uni-border-radius-sm: 2px;
@ -71,9 +71,9 @@ $uni-spacing-col-lg: 12px;
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度
/* 文章场景相关 */
$uni-color-title: #2C405A; // 文章标题颜色
$uni-font-size-title:20px;
$uni-color-title: #2c405a; // 文章标题颜色
$uni-font-size-title: 20px;
$uni-color-subtitle: #555555; // 二级标题颜色
$uni-font-size-subtitle:26px;
$uni-color-paragraph: #3F536E; // 文章段落颜色
$uni-font-size-paragraph:15px;
$uni-font-size-subtitle: 26px;
$uni-color-paragraph: #3f536e; // 文章段落颜色
$uni-font-size-paragraph: 15px;