|
|
|
@ -0,0 +1,351 @@
|
|
|
|
|
<script setup lang="ts">
|
|
|
|
|
import { ref, computed, reactive } from 'vue'
|
|
|
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|
|
|
|
import { useMemberStore } from '@/stores'
|
|
|
|
|
import { onReady, onShow } from '@dcloudio/uni-app'
|
|
|
|
|
import { getDeviceList } from '@/services/device'
|
|
|
|
|
import dayjs from 'dayjs'
|
|
|
|
|
|
|
|
|
|
// 经纬度
|
|
|
|
|
let location = reactive({
|
|
|
|
|
longitude: 0,
|
|
|
|
|
latitude: 0,
|
|
|
|
|
})
|
|
|
|
|
// 设备列表
|
|
|
|
|
let deviceInfo: any = ref({})
|
|
|
|
|
let totalSltd: any = ref(true)
|
|
|
|
|
let onlineSltd: any = ref(false)
|
|
|
|
|
let smogSltd: any = ref(false)
|
|
|
|
|
let fullSltd: any = ref(false)
|
|
|
|
|
// 请求参数
|
|
|
|
|
let queryParams: any = ref({
|
|
|
|
|
deviceName: '',
|
|
|
|
|
online: false,
|
|
|
|
|
checkSmog: false,
|
|
|
|
|
checkFull: false,
|
|
|
|
|
location: location,
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// 表示用户扫码参数
|
|
|
|
|
onLoad((query: any) => {
|
|
|
|
|
console.log('设备列表:', query)
|
|
|
|
|
getLocationInfo()
|
|
|
|
|
})
|
|
|
|
|
// 获取坐标信息
|
|
|
|
|
onShow(() => {
|
|
|
|
|
if (location.longitude) {
|
|
|
|
|
console.log('hi-a', location)
|
|
|
|
|
console.log(queryParams.value)
|
|
|
|
|
fnGetDeviceList()
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
// 微信 - 获取当前经纬度
|
|
|
|
|
const getLocationInfo = () => {
|
|
|
|
|
uni.getLocation({
|
|
|
|
|
type: 'gcj02',
|
|
|
|
|
// isHighAccuracy: true,
|
|
|
|
|
// highAccuracyExpireTime: 5000,
|
|
|
|
|
success(res) {
|
|
|
|
|
console.log(res)
|
|
|
|
|
const longitude = res.longitude.toFixed(6)
|
|
|
|
|
const latitude = res.latitude.toFixed(6)
|
|
|
|
|
location = Object.assign(location, {
|
|
|
|
|
longitude: longitude,
|
|
|
|
|
latitude: latitude,
|
|
|
|
|
})
|
|
|
|
|
console.log('hi-b', location)
|
|
|
|
|
console.log(queryParams.value)
|
|
|
|
|
fnGetDeviceList()
|
|
|
|
|
},
|
|
|
|
|
fail(err) {
|
|
|
|
|
uni.showModal({
|
|
|
|
|
content: '检测到您没打开获取定位功能权限,是否去设置打开?',
|
|
|
|
|
confirmText: '确认',
|
|
|
|
|
cancelText: '取消',
|
|
|
|
|
success: function (res) {
|
|
|
|
|
if (res.confirm) {
|
|
|
|
|
uni.openSetting({
|
|
|
|
|
success() {
|
|
|
|
|
getLocationInfo()
|
|
|
|
|
},
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
// 获取设备列表
|
|
|
|
|
const fnGetDeviceList = () => {
|
|
|
|
|
getDeviceList(queryParams.value)
|
|
|
|
|
.then((res) => {
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
deviceInfo.value = res.data
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.catch((err: any) => {})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 是否在线过滤切换
|
|
|
|
|
const fnOnlineSltdChg = () => {
|
|
|
|
|
// console.log('fnOnlineSltdChg:', queryParams.value.online)
|
|
|
|
|
if (queryParams.value.online == true) {
|
|
|
|
|
queryParams.value.online = false
|
|
|
|
|
} else {
|
|
|
|
|
queryParams.value.online = true
|
|
|
|
|
}
|
|
|
|
|
fnGetDeviceList()
|
|
|
|
|
}
|
|
|
|
|
// 是否烟雾过滤切换
|
|
|
|
|
const fnSmogSltdChg = () => {
|
|
|
|
|
// console.log('fnSmogSltdChg:', queryParams.value.checkSmog)
|
|
|
|
|
if (queryParams.value.checkSmog == true) {
|
|
|
|
|
queryParams.value.checkSmog = false
|
|
|
|
|
} else {
|
|
|
|
|
queryParams.value.checkSmog = true
|
|
|
|
|
}
|
|
|
|
|
fnGetDeviceList()
|
|
|
|
|
}
|
|
|
|
|
// 是否烟雾过滤切换
|
|
|
|
|
const fnFullSltdChg = () => {
|
|
|
|
|
// console.log('fnFullSltdChg:', queryParams.value.checkFull)
|
|
|
|
|
if (queryParams.value.checkFull == true) {
|
|
|
|
|
queryParams.value.checkFull = false
|
|
|
|
|
} else {
|
|
|
|
|
queryParams.value.checkFull = true
|
|
|
|
|
}
|
|
|
|
|
fnGetDeviceList()
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 获取屏幕边界到安全区域距离
|
|
|
|
|
// 微信扫码
|
|
|
|
|
const fnScan = async () => {
|
|
|
|
|
// 只允许从相机扫码
|
|
|
|
|
wx.scanCode({
|
|
|
|
|
onlyFromCamera: true,
|
|
|
|
|
success(res) {
|
|
|
|
|
console.log('scan:', res)
|
|
|
|
|
let pathArr = res.path.split('=')
|
|
|
|
|
// uni.redirectTo({
|
|
|
|
|
// url: '/pages/selectAction/selectAction?devCode=' + pathArr[1],
|
|
|
|
|
// })
|
|
|
|
|
},
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
<template>
|
|
|
|
|
<view class="viewport">
|
|
|
|
|
<scroll-view
|
|
|
|
|
:scroll-y="true"
|
|
|
|
|
class="viewport sk-transparent"
|
|
|
|
|
id="scroller"
|
|
|
|
|
:enable-back-to-top="true"
|
|
|
|
|
>
|
|
|
|
|
<uni-card>
|
|
|
|
|
<uni-row>
|
|
|
|
|
<uni-col :span="12">
|
|
|
|
|
<view class="">
|
|
|
|
|
<text>扫码清运</text>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-col>
|
|
|
|
|
<uni-col :span="12">
|
|
|
|
|
<view style="text-align: right"
|
|
|
|
|
><uni-icons type="scan" size="30" @click="fnScan"></uni-icons
|
|
|
|
|
></view>
|
|
|
|
|
</uni-col>
|
|
|
|
|
</uni-row>
|
|
|
|
|
<view
|
|
|
|
|
class="cs-slt-list"
|
|
|
|
|
style="border-top: solid 1px #ececf4; margin: 10rpx 0rpx; padding: 10rpx 0rpx"
|
|
|
|
|
>
|
|
|
|
|
<uni-row>
|
|
|
|
|
<uni-col :span="6">
|
|
|
|
|
<view v-if="totalSltd == true" class="cs-slt-item cs-slt-item-sltd">
|
|
|
|
|
<view>
|
|
|
|
|
<text class="slt-number">{{ deviceInfo.total }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view>
|
|
|
|
|
<text>管理总数</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view v-else class="cs-slt-item">
|
|
|
|
|
<view>
|
|
|
|
|
<text>{{ deviceInfo.total }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view>
|
|
|
|
|
<text>管理总数</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-col>
|
|
|
|
|
<uni-col :span="6">
|
|
|
|
|
<view
|
|
|
|
|
v-if="queryParams.online == true"
|
|
|
|
|
class="cs-slt-item cs-slt-item-sltd"
|
|
|
|
|
@click="fnOnlineSltdChg"
|
|
|
|
|
>
|
|
|
|
|
<view>
|
|
|
|
|
<text class="slt-number">{{ deviceInfo.online }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view>
|
|
|
|
|
<text>在线</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view v-else class="cs-slt-item" @click="fnOnlineSltdChg">
|
|
|
|
|
<view>
|
|
|
|
|
<text class="slt-number">{{ deviceInfo.online }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view>
|
|
|
|
|
<text>在线</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-col>
|
|
|
|
|
<uni-col :span="6">
|
|
|
|
|
<view
|
|
|
|
|
v-if="queryParams.checkSmog == true"
|
|
|
|
|
class="cs-slt-item cs-slt-item-sltd"
|
|
|
|
|
@click="fnSmogSltdChg"
|
|
|
|
|
>
|
|
|
|
|
<view>
|
|
|
|
|
<text class="slt-number">{{ deviceInfo.smog }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view>
|
|
|
|
|
<text>烟雾</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view v-else class="cs-slt-item" @click="fnSmogSltdChg">
|
|
|
|
|
<view>
|
|
|
|
|
<text class="slt-number">{{ deviceInfo.smog }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view>
|
|
|
|
|
<text>烟雾</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-col>
|
|
|
|
|
<uni-col :span="6">
|
|
|
|
|
<view
|
|
|
|
|
v-if="queryParams.checkFull == true"
|
|
|
|
|
class="cs-slt-item cs-slt-item-sltd"
|
|
|
|
|
@click="fnFullSltdChg"
|
|
|
|
|
>
|
|
|
|
|
<view>
|
|
|
|
|
<text class="slt-number">{{ deviceInfo.full }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view>
|
|
|
|
|
<text>满溢</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view v-else class="cs-slt-item" @click="fnFullSltdChg">
|
|
|
|
|
<view>
|
|
|
|
|
<text class="slt-number">{{ deviceInfo.full }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view>
|
|
|
|
|
<text>满溢</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-col>
|
|
|
|
|
</uni-row>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-card>
|
|
|
|
|
<uni-card
|
|
|
|
|
v-for="deviceItem in deviceInfo.list"
|
|
|
|
|
:title="'设备名称:' + deviceItem.deviceName"
|
|
|
|
|
:key="deviceItem.id"
|
|
|
|
|
>
|
|
|
|
|
<uni-row>
|
|
|
|
|
<uni-col :span="24" class="sty-tag-list">
|
|
|
|
|
<view class="sty-tag-list">
|
|
|
|
|
<uni-tag
|
|
|
|
|
v-if="deviceItem.status == 1"
|
|
|
|
|
class="sty-tag-item"
|
|
|
|
|
text="在线"
|
|
|
|
|
type="success"
|
|
|
|
|
/>
|
|
|
|
|
<uni-tag v-else class="sty-tag-item" text="离线" />
|
|
|
|
|
<uni-tag
|
|
|
|
|
v-if="deviceItem.smogStatus == 1"
|
|
|
|
|
class="sty-tag-item"
|
|
|
|
|
text="烟雾:报警"
|
|
|
|
|
type="error"
|
|
|
|
|
/>
|
|
|
|
|
<uni-tag v-else class="sty-tag-item" text="烟雾:未报警" type="success" />
|
|
|
|
|
<uni-tag
|
|
|
|
|
v-if="deviceItem.fullStatus == 1"
|
|
|
|
|
class="sty-tag-item"
|
|
|
|
|
text="满溢"
|
|
|
|
|
type="error"
|
|
|
|
|
/>
|
|
|
|
|
<uni-tag v-else class="sty-tag-item" text="未满溢" type="success" />
|
|
|
|
|
</view>
|
|
|
|
|
</uni-col>
|
|
|
|
|
<uni-col :span="24">
|
|
|
|
|
<view style="font-size: 12px">
|
|
|
|
|
<image
|
|
|
|
|
style="width: 45rpx; height: 45rpx"
|
|
|
|
|
src="@/static/images/bell.png"
|
|
|
|
|
mode="scaleToFill"
|
|
|
|
|
/>
|
|
|
|
|
<text>上次清运时间:</text>
|
|
|
|
|
<text style="color: #0d0d26">{{
|
|
|
|
|
dayjs(deviceItem.cleanDate).format('YYYY-MM-DD HH:mm:ss')
|
|
|
|
|
}}</text>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-col>
|
|
|
|
|
<uni-col
|
|
|
|
|
v-for="bucketItem in deviceItem.bucketList"
|
|
|
|
|
:key="bucketItem.bucketCode"
|
|
|
|
|
:span="24"
|
|
|
|
|
>
|
|
|
|
|
<view class="">
|
|
|
|
|
<text>{{ bucketItem.showName }}:</text>
|
|
|
|
|
<text style="color: #0d0d26">重量 {{ bucketItem.currentWeight }} kg</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view v-if="bucketItem.fullStatus == 1" class="" style="color: #e63232">
|
|
|
|
|
<text>满溢时间:{{ bucketItem.fullTime }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-col>
|
|
|
|
|
</uni-row>
|
|
|
|
|
</uni-card>
|
|
|
|
|
<uni-card>
|
|
|
|
|
<uni-row>
|
|
|
|
|
<uni-col :span="24">
|
|
|
|
|
<view style="text-align: center">
|
|
|
|
|
<text>已到底部</text>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-col>
|
|
|
|
|
</uni-row>
|
|
|
|
|
</uni-card>
|
|
|
|
|
</scroll-view>
|
|
|
|
|
</view>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<style lang="scss">
|
|
|
|
|
page {
|
|
|
|
|
height: 100%;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.viewport {
|
|
|
|
|
width: 100vw;
|
|
|
|
|
height: 100vh;
|
|
|
|
|
.sty-tag-list {
|
|
|
|
|
margin: 10rpx 0rpx;
|
|
|
|
|
.sty-tag-item {
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.cs-slt-list {
|
|
|
|
|
.cs-slt-item {
|
|
|
|
|
text-align: center;
|
|
|
|
|
.slt-number {
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
color: #000000;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.cs-slt-item-sltd {
|
|
|
|
|
.slt-number {
|
|
|
|
|
color: #3775f6;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|