141 lines
3.5 KiB
Vue
141 lines
3.5 KiB
Vue
<template>
|
|
<view>
|
|
<scroll-view
|
|
v-if="deviceInfo"
|
|
:scroll-y="true"
|
|
:style="{ height: deviceInfo.windowHeight - deviceInfo.safeArea.top + 'px' }"
|
|
>
|
|
<view class="pb-[calc(env(safe-area-inset-bottom)+250rpx)]">
|
|
<view
|
|
v-for="(item, index) in list"
|
|
:key="index"
|
|
:style="{ marginTop: index !== 0 ? '4rpx' : '0' }"
|
|
@click="changeGroup(item)"
|
|
class="flex items-center justify-between h-80 bg-white text-base"
|
|
>
|
|
<view class="ml-4 max-w-550 break-all">{{ item.keyGroupName }}</view>
|
|
<view
|
|
class="mr-4"
|
|
v-if="item.keyGroupId === $bluetooth.currentLockSetting.lockBasicInfo.groupId"
|
|
>
|
|
<up-icon name="checkbox-mark" color="#63b8af" size="40rpx"></up-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
<view
|
|
@click="() => $refs.modalInput.open()"
|
|
class="bg-#4777ee text-white pos-fixed bottom-[calc(env(safe-area-inset-bottom)+48rpx)] rounded-44rpx w-686 ml-4 h-88 line-height-88rpx text-lg font-bold text-center"
|
|
>创建新分组</view
|
|
>
|
|
<ModalInput
|
|
ref="modalInput"
|
|
title="创建新分组"
|
|
:autoClose="false"
|
|
placeholder="请输入名称"
|
|
@confirm="changeName"
|
|
/>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { onMounted, ref } from 'vue'
|
|
import { useBasicStore } from '@/stores/basic'
|
|
import { createGroupRequest, getGroupListRequest, setGroupRequest } from '@/api/setting'
|
|
import { useBluetoothStore } from '@/stores/bluetooth'
|
|
|
|
const $basic = useBasicStore()
|
|
const $bluetooth = useBluetoothStore()
|
|
|
|
const deviceInfo = ref(null)
|
|
const modalInput = ref(null)
|
|
const list = ref([])
|
|
|
|
const pending = ref(false)
|
|
|
|
onMounted(async () => {
|
|
deviceInfo.value = await $basic.getDeviceInfo()
|
|
getList()
|
|
})
|
|
|
|
const getList = async () => {
|
|
const { code, data, message } = await getGroupListRequest({ type: 1 })
|
|
if (code === 0) {
|
|
list.value = data.list
|
|
} else {
|
|
uni.showToast({
|
|
title: message,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
}
|
|
|
|
const changeGroup = async item => {
|
|
if (pending.value) return
|
|
pending.value = true
|
|
uni.showLoading({
|
|
title: '设置中'
|
|
})
|
|
const { code, message } = await setGroupRequest({
|
|
lockId: $bluetooth.currentLockInfo.lockId,
|
|
groupId: item.keyGroupId
|
|
})
|
|
uni.hideLoading()
|
|
pending.value = false
|
|
if (code === 0) {
|
|
$bluetooth.updateCurrentLockSetting({
|
|
...$bluetooth.currentLockSetting,
|
|
lockBasicInfo: {
|
|
...$bluetooth.currentLockSetting.lockBasicInfo,
|
|
groupId: item.keyGroupId,
|
|
groupName: item.keyGroupName
|
|
}
|
|
})
|
|
uni.showToast({
|
|
title: '设置锁分组成功',
|
|
icon: 'none'
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
title: message,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
}
|
|
|
|
const changeName = async name => {
|
|
if (!name) {
|
|
uni.showToast({
|
|
title: '请输入名称',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
if (pending.value) return
|
|
pending.value = true
|
|
const { code, message } = await createGroupRequest({
|
|
groupName: name
|
|
})
|
|
pending.value = false
|
|
if (code === 0) {
|
|
modalInput.value.close()
|
|
getList()
|
|
uni.showToast({
|
|
title: '创建成功',
|
|
icon: 'none'
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
title: message,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background-color: $uni-bg-color-grey;
|
|
}
|
|
</style>
|