对接首页消息通知、巡检点 切换小区获取最新数据
This commit is contained in:
@@ -7,7 +7,7 @@
|
||||
<uni-nav-bar left-icon="left" title="远程开门" backgroundColor ="none" :border="false" @clickLeft="narBack" />
|
||||
</view>
|
||||
<view class="top-img">
|
||||
<image src="http://47.104.199.163:9090/images/imgs/xuancheng-bg.png" mode="" style="width: 100%;height: 100%;"></image>
|
||||
<image src="https://wuyeadmin.bugtc.com/images/imgs/xuancheng-bg.png" mode="" style="width: 100%;height: 100%;"></image>
|
||||
</view>
|
||||
|
||||
<!-- 提示文案 -->
|
||||
@@ -39,6 +39,11 @@
|
||||
<text class="door-name">{{ item.name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 空状态 -->
|
||||
<view v-if="doorList.length === 0" class="empty-state">
|
||||
<uni-icons type="info" size="30" color="#ccc"></uni-icons>
|
||||
<text class="empty-text">暂无可用门禁</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 确认开门按钮 -->
|
||||
@@ -48,19 +53,42 @@
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
|
||||
import { onShow } from '@dcloudio/uni-app'
|
||||
import { getOpenDoorList, switchOpenDoor } from '../../api/api.js'
|
||||
|
||||
// 响应式数据:选中的门索引、开门成功提示
|
||||
const selectedDoor = ref(-1) // -1表示未选中
|
||||
const showSuccess = ref(false)
|
||||
|
||||
// 门列表数据()
|
||||
const doorList = ref([
|
||||
{ iconText: '/static/imgs/westDoor.png',iconActive:"/static/imgs/westDoorWhite.png", name: '西入门闸机' },
|
||||
{ iconText: '/static/imgs/eastDoor.png',iconActive:"/static/imgs/eastDoorWhite.png", name: '东入门闸机' },
|
||||
{ iconText: '/static/imgs/unitDoor.png',iconActive:"/static/imgs/unitDoorWhite.png", name: '1号楼1单元门' },
|
||||
{ iconText: '/static/imgs/unitDoor.png',iconActive:"/static/imgs/unitDoorWhite.png", name: '1号楼2单元门' }
|
||||
])
|
||||
// 门列表数据
|
||||
const doorList = ref([])
|
||||
|
||||
// 查询门禁列表
|
||||
const fetchDoorList = () => {
|
||||
getOpenDoorList().then(res => {
|
||||
if (res.code === 200 && res.data) {
|
||||
doorList.value = res.data
|
||||
.filter(item => item.status === '1')
|
||||
.map(item => ({
|
||||
id: item.id,
|
||||
name: item.deviceName,
|
||||
iconText: item.iconText,
|
||||
iconActive: item.iconActive
|
||||
}))
|
||||
}
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: err.msg || '获取门禁列表失败',
|
||||
icon: 'none'
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
onShow(() => {
|
||||
selectedDoor.value = -1
|
||||
showSuccess.value = false
|
||||
fetchDoorList()
|
||||
})
|
||||
|
||||
// 选择门的方法
|
||||
const selectDoor = (index) => {
|
||||
@@ -75,21 +103,21 @@ const narBack = () =>{
|
||||
}
|
||||
// 确认开门方法
|
||||
const openDoor = () => {
|
||||
// 校验:未选择门时提示
|
||||
// if (selectedDoor.value === -1) {
|
||||
// uni.showToast({
|
||||
// title: '请先选择要开的门',
|
||||
// icon: 'none'
|
||||
// })
|
||||
// return
|
||||
// }
|
||||
const device = doorList.value[selectedDoor.value]
|
||||
if (!device) return
|
||||
|
||||
// 模拟开门接口请求(实际项目替换为真实接口)
|
||||
setTimeout(() => {
|
||||
showSuccess.value = true
|
||||
// 可选:添加成功提示后自动隐藏
|
||||
// setTimeout(() => showSuccess.value = false, 2000)
|
||||
}, 500)
|
||||
uni.showLoading({ title: '开门中...' })
|
||||
switchOpenDoor({ deviceId: device.id }).then(res => {
|
||||
uni.hideLoading()
|
||||
if (res.code === 200) {
|
||||
showSuccess.value = true
|
||||
} else {
|
||||
uni.showToast({ title: res.msg || '开门失败', icon: 'none' })
|
||||
}
|
||||
}).catch(err => {
|
||||
uni.hideLoading()
|
||||
uni.showToast({ title: err.msg || '开门失败', icon: 'none' })
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -203,6 +231,20 @@ const openDoor = () => {
|
||||
.door-item.active .door-name {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.empty-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 100rpx 0;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 32rpx;
|
||||
color: #999;
|
||||
margin-top: 20rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
/* 门图标 */
|
||||
.door-icon {
|
||||
|
||||
Reference in New Issue
Block a user